开发公众号分享页面

components/invite/index.js

@@ -35,5 +35,10 @@ Component({
                 }
             })
         },
+        jump() {
+            wx.navigateTo({
+                url: '/salesperson/pages/gzhShare/index',
+            })
+        },
     }
 })

components/invite/index.wxml

@@ -25,7 +25,7 @@
                 <image src="/static/pyq.png" class="icon" />
                 <view class="label">朋友圈</view>
             </view>
-            <view class="box">
+            <view class="box" bindtap="jump">
                 <image src="/static/gzh.png" class="icon" />
                 <view class="label">公众号</view>
             </view>

salesperson/pages/gzhShare/index.js

@@ -1,66 +1,8 @@
-// salesperson/pages/gzhShare/index.js
 Page({
-
-    /**
-     * 页面的初始数据
-     */
     data: {
 
     },
-
-    /**
-     * 生命周期函数--监听页面加载
-     */
     onLoad(options) {
 
     },
-
-    /**
-     * 生命周期函数--监听页面初次渲染完成
-     */
-    onReady() {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面显示
-     */
-    onShow() {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面隐藏
-     */
-    onHide() {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面卸载
-     */
-    onUnload() {
-
-    },
-
-    /**
-     * 页面相关事件处理函数--监听用户下拉动作
-     */
-    onPullDownRefresh() {
-
-    },
-
-    /**
-     * 页面上拉触底事件的处理函数
-     */
-    onReachBottom() {
-
-    },
-
-    /**
-     * 用户点击右上角分享
-     */
-    onShareAppMessage() {
-
-    }
 })

salesperson/pages/gzhShare/index.less

@@ -1 +1,68 @@
-/* salesperson/pages/gzhShare/index.wxss */
+.container {
+    position: relative;
+    width: 100%;
+    min-height: 100vh;
+    padding: 32rpx 22rpx;
+    background: url(https://reader-wx.ai160.com/images/reader/sell/bg1.jpg)no-repeat;
+    background-size: contain;
+
+    .copyBox {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 26rpx 37rpx;
+        border-radius: 20rpx;
+        background: #FFF9EE;
+
+        .left {
+            .label {
+                margin-bottom: 12rpx;
+                font-size: 30rpx;
+                font-weight: bold;
+            }
+
+            .value {
+                font-size: 26rpx;
+            }
+        }
+
+        .copy {
+            padding: 8rpx 40rpx;
+            border-radius: 26rpx;
+            font-size: 24rpx;
+            color: #FFFFFF;
+        }
+    }
+
+    .b1 {
+        margin-bottom: 30rpx;
+
+        .label {
+            color: #FF9E00;
+        }
+
+        .copy {
+            background-color: #FEAB25;
+        }
+    }
+
+    .b2 {
+        background-color: #DAEDFF;
+
+        .label {
+            color: #2485E4;
+        }
+
+        .copy {
+            background-color: #4FC3FF;
+        }
+    }
+    .longImg{
+        margin-top: 30rpx;
+        width: 100%;
+        height: 1000rpx;
+        border-top-left-radius: 20rpx;
+        border-top-right-radius: 20rpx;
+        background-color: white;
+    }
+}

salesperson/pages/gzhShare/index.wxml

@@ -1,2 +1,21 @@
-<!--salesperson/pages/gzhShare/index.wxml-->
-<text>salesperson/pages/gzhShare/index.wxml</text>
+<view class="container">
+    <view class="copyBox b1">
+        <view class="left">
+            <view class="label">
+                小程序APPID
+            </view>
+            <view class="value">wX3efccde928ldxkx</view>
+        </view>
+        <view class="copy">复制</view>
+    </view>
+    <view class="copyBox b2">
+        <view class="left">
+            <view class="label">
+                小程序APPID
+            </view>
+            <view class="value">wX3efccde928ldxkx</view>
+        </view>
+        <view class="copy">复制</view>
+    </view>
+    <view class="longImg"></view>
+</view>

salesperson/pages/gzhShare/index.wxss

@@ -1 +1,56 @@
-/* salesperson/pages/gzhShare/index.wxss */
+.container {
+  position: relative;
+  width: 100%;
+  min-height: 100vh;
+  padding: 32rpx 22rpx;
+  background: url(https://reader-wx.ai160.com/images/reader/sell/bg1.jpg) no-repeat;
+  background-size: contain;
+}
+.container .copyBox {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 26rpx 37rpx;
+  border-radius: 20rpx;
+  background: #FFF9EE;
+}
+.container .copyBox .left .label {
+  margin-bottom: 12rpx;
+  font-size: 30rpx;
+  font-weight: bold;
+}
+.container .copyBox .left .value {
+  font-size: 26rpx;
+}
+.container .copyBox .copy {
+  padding: 8rpx 40rpx;
+  border-radius: 26rpx;
+  font-size: 24rpx;
+  color: #FFFFFF;
+}
+.container .b1 {
+  margin-bottom: 30rpx;
+}
+.container .b1 .label {
+  color: #FF9E00;
+}
+.container .b1 .copy {
+  background-color: #FEAB25;
+}
+.container .b2 {
+  background-color: #DAEDFF;
+}
+.container .b2 .label {
+  color: #2485E4;
+}
+.container .b2 .copy {
+  background-color: #4FC3FF;
+}
+.container .longImg {
+  margin-top: 30rpx;
+  width: 100%;
+  height: 1000rpx;
+  border-top-left-radius: 20rpx;
+  border-top-right-radius: 20rpx;
+  background-color: white;
+}