开卡页设计和逻辑处理

src/shoppingGuid/page/pages/achievement/achievement.js

@@ -3,7 +3,7 @@ const wxService = require('../../../../utils/wxService');
 const app = getApp();
 // import wxCharts from '../../../../charts/wxcharts-min.js'
 const wxCharts = require('../../../../charts/wxcharts-min.js')
-
+// https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png
 wxService.page({
 
   /**
@@ -56,7 +56,6 @@ wxService.page({
       current : this.data.current,
     });
 
-
     this.getGuidOrderPreview(this.data.current);
   },
 

src/shoppingGuid/page/pages/achievement/achievement.wxml

@@ -29,15 +29,21 @@
     <view class='number-container'>
       <view class='number-item'>
         <view>本月业绩（元）</view>
-        <view class='number' style='color:#F7B500;'>{{achievement.achievementMonth}}</view>
+        <view class='number' style='color:#F7B500;'>
+          {{achievement.achievementMonth ? achievement.achievementMonth : 0}}
+        </view>
       </view>
       <view class='number-item'>
         <view>本月新增会员</view>
-        <view class='number' style='color:#FA6400;'>{{memberPreview.recruitAmountMonth}}</view>
+        <view class='number' style='color:#FA6400;'>
+          {{memberPreview.recruitAmountMonth ? memberPreview.recruitAmountMonth : 0}}
+        </view>
       </view>
       <view class='number-item'>
         <view>本月新增订单</view>
-        <view class='number' style='color:#FA6400;'>{{achievement.orderAmount}}</view>
+        <view class='number' style='color:#FA6400;'>
+          {{achievement.orderAmount ? achievement.orderAmount : 0}}
+        </view>
       </view>
     </view>
     <!-- <view class='list-item'>
@@ -70,15 +76,15 @@
     </view>
     <view class='list-item'>
       <text>总销售额（￥）</text>
-      <label>{{currentOrderData.salesVolume}}</label>
+      <label>{{currentOrderData.salesVolume ? currentOrderData.salesVolume : 0}}</label>
     </view>
     <view class='list-item'>
       <text>退货额（￥） </text>
-      <label>{{currentOrderData.refundVolume}}</label>
+      <label>{{currentOrderData.refundVolume ? currentOrderData.refundVolume : 0}}</label>
     </view>
     <view class='list-item'>
       <text>退款率 </text>
-      <label>{{currentOrderData.refundRate}}</label>
+      <label>{{currentOrderData.refundRate ? currentOrderData.refundRate : '0%'}}</label>
     </view>
   </view>
 

src/shoppingGuid/page/pages/home/home.js

@@ -63,7 +63,7 @@ wxService.page({
   onShow: function () {
     this.getRecruitRanking()  // 招募榜
   },
-  //打开我的名片
+  //打开摄像头 扫码
   onTapScanQrcode(){
     wx.scanCode({
       success : res => {
@@ -76,22 +76,21 @@ wxService.page({
         console.log('扫码失败结果是--',err)
       },
     });
-  
   },
   //获取排行榜
   getRecruitRanking() {
     wx.showLoading({
       title: '加载中'
-    })
+    });
+
     wxService.post('/marketing/shoppingguide/recruitRanking').then(res => {
       if (res) {
         const { result, data } = res.data;
-
         if (result == 0) {
           wx.hideLoading()
           let list = data ? data : [];
           if(list.length == 0){
-            this.data.loadingText = '暂无榜单~';
+            this.data.loadingText = '暂无榜单信息~';
           }
 
           list.map(item => {
@@ -109,24 +108,19 @@ wxService.page({
           });
         }
       }
-    })
+    });
   },
   // 门店榜
   getStoreRanking() {
-    wx.showLoading({
-      title: '加载中'
-    });
-    this.setData({
-      loadingText : '数据加载中...'
-    });
-
+    wx.showLoading({title: '加载中'});
+    this.setData({loadingText : '数据加载中...'});
     wxService.post('/marketing/shoppingguide/storeRanking').then(res => {
       if (res) {
         const { result, data } = res.data
         if (result == 0) {
           wx.hideLoading();
           if (!data){
-            this.data.loadingText = '暂无榜单~';
+            this.data.loadingText = '暂无榜单信息~';
           }
           
           this.setData({
@@ -136,7 +130,7 @@ wxService.page({
         }
         
       }
-    })
+    });
   },
   // 点击事件
   onTopBarTap(e){
@@ -186,7 +180,6 @@ wxService.page({
     });
 
   },
-
   //获取优惠券列表
   getCouponList(){
     wx.showLoading({
@@ -211,7 +204,6 @@ wxService.page({
       }
     });
   },
-
   //展示优惠券二维码
   onTapShowQrcode(e) {
     let item = e.currentTarget.dataset.item;
@@ -220,7 +212,6 @@ wxService.page({
       url: '/shoppingGuid/page/pages/couponQrcode/couponQrcode',
     });
   },
-
   //定向发送优惠券
   onTapToSendConpon(e) {
     let item = e.currentTarget.dataset.item;
@@ -260,7 +251,6 @@ wxService.page({
       showModal: false
     });
   },
-
   //群发
   onTapToSendByGroup(e) {
     let item = e.currentTarget.dataset.item;

src/shoppingGuid/page/pages/home/home.wxml

@@ -109,7 +109,7 @@
         </view>
       </view>
     </view>
-    <empty text="暂无商品~" wx:else/>
+    <empty text="商家暂无推荐商品~" wx:else/>
   </view>
   <!-- 招募榜 -->
   <view class='rank-container'>
@@ -126,7 +126,7 @@
     </view>
     <view class='rank-title'>
       <image class='top20' src='/assets/imgs/shoppingGuide/home_top20.png' mode='aspectFit'></image>
-      <view class='rank-more'>更多点击查看更多></view>
+      <!-- <view class='rank-more'>更多点击查看更多></view> -->
     </view>
     <!-- 招募榜 -->
     <view wx:if="{{current == 1}}">

src/shoppingGuid/page/pages/openCard/openCard.js

@@ -10,13 +10,27 @@ wxService.page({
    * 页面的初始数据
    */
   data: {
-
+    showOpenCardModal : false,
+    imageUrl: 'https://img3.bigaka.com/test/1001/201912/20191202/1001854598a6-67dd-4b3e-9a02-934c1b28a295.jpg'
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
+    //判断用户是不是已经登录了
+    let userInfo = wx.getStorageSync('_baseUserInfo');
+    if(userInfo){
+      wx.reLaunch({
+        url: '/pages/userCenter/userCenter',
+      });
+      return;
+    }
+
+    //未登录 需要授权登录 弹出设置的开卡图片
+    this.setData({
+      showOpenCardModal : true,
+    });
 
   },
 
@@ -31,14 +45,10 @@ wxService.page({
       utils.getUserInfoByBtn(userInfo).then((data = {}) => {
         const { token } = data
         wx.setStorageSync('_accreditUserInfo', userInfo);
-        if (token) {
-          wx.setStorageSync('token', token)
-        } else {
-          wx.setStorageSync('token', '')
-        }
-        wx.setStorageSync('_baseUserInfo', data)
+        wx.setStorageSync('token', token ? token : '');
+        wx.setStorageSync('_baseUserInfo', data);
         // 存储用户开卡状态
-        this.setUserInfo()
+        this.setUserInfo();
       }).catch(err => {
         if (err) {
           wx.showToast({
@@ -48,9 +58,10 @@ wxService.page({
         }
       })
     } else {
-      this.setData({
-        isAuthorization: false
-      })
+      wx.showToast({
+        title: `授权失败，请核实！`,
+        icon: 'none'
+      });
     }
   },
 
@@ -65,7 +76,6 @@ wxService.page({
       return false
     }
 
-    return ;
     //如果已经是会员则跳转到首页
     wx.reLaunch({
       url: '/pages/userCenter/userCenter',

src/shoppingGuid/page/pages/openCard/openCard.json

 {
   "navigationBarTitleText": "开卡页",
+  "disableScroll": true,
   "usingComponents": {}
 }
\ No newline at end of file

src/shoppingGuid/page/pages/openCard/openCard.wxml

 <!--shoppingGuid/page/pages/openCard/openCard.wxml-->
-<view class='open-card-container'></view>
+<!-- 默认展示的内容 -->
+<view class='loading-body' wx:if="{{!showOpenCardModal}}">
+  <view class="circle-line">
+    <text></text>
+    <text></text>
+    <text></text>
+    <text></text>
+    <text></text>
+    <text></text>
+    <text></text>
+    <text></text>
+  </view>
+  <view>加载中...</view>
+</view>
+
+<!-- 弹出层 -->
+<view class='open-card-container' wx:else>
+  <view class='open-card'>
+    <button bindgetuserinfo="userAuthBtnCallBack" open-type='getUserInfo'>
+        <image src='{{imageUrl}}' mode='widthFix'></image>
+    </button>
+  </view>
+</view>

src/shoppingGuid/page/pages/openCard/openCard.wxss

 page{
-  background: #f2f2f2;
+  background: #ffffff;
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
   font-size: 24rpx;
   color: #333333;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100vh;
 }
 
 view{
@@ -11,6 +16,110 @@ view{
   -webkit-box-sizing: border-box;
 }
 
+.loading-body{
+  display: flex;
+  flex-direction: column;
+  color: #999999;
+  justify-content: center;
+  align-items: center;
+}
+
 .open-card-container{
-  
-}
+  position: fixed;
+  left: 0;
\ No newline at end of file
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.open-card-container .open-card{
+  max-width: 90vw;
+  max-height: 90vh;
+}
+
+.open-card-container .open-card button{
+  appearance: none;
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+}
+
+.open-card-container .open-card button::after{
+  border: none;
+}
+
+/* 加载 */
+/*动画一：单个渐变  */
+.circle-line{
+    width: 80px;
+    height: 80px;
+    display: inline-block;
+    position: relative;
+}
+.circle-line text{
+    display: block;
+    width: 50%;
+    height: 5px;
+    opacity: .7;
+    position: absolute;
+    top: calc(50% - 2.5px);
+    left: 0px;
+    transform-origin: center right; 
+    animation: circle 1.5s linear infinite; 
+}
+.circle-line text::before{
+    content: '';
+    display: block;
+    width: 15px;
+    height: 5px;
+    position: absolute;
+    top: 0;
+    right: 10px;
+    background-color: #ff3333;
+}
+.circle-line text:nth-child(1){
+    transform: rotate(0deg);
+    animation-delay: 0.2s;
+}
+.circle-line text:nth-child(2){
+    transform: rotate(45deg);
+    animation-delay: 0.4s;
+}
+.circle-line text:nth-child(3){
+    transform: rotate(90deg);
+    animation-delay: 0.6s;
+}
+.circle-line text:nth-child(4){
+    transform: rotate(135deg);
+    animation-delay: 0.8s;
+}
+.circle-line text:nth-child(5){
+    transform: rotate(180deg);
+    animation-delay: 1s;
+}
+.circle-line text:nth-child(6){
+    transform: rotate(225deg);
+    animation-delay: 1.2s;
+}
+.circle-line text:nth-child(7){
+    transform: rotate(270deg);
+    animation-delay: 1.4s;
+}
+.circle-line text:nth-child(8){
+    transform: rotate(315deg);
+    animation-delay: 1.6s;
+}
+@keyframes circle {
+    0%{
+        opacity: 0.05;
+    }
+    100%{
+        opacity: 0.9;
+    }
+}

src/shoppingGuid/page/pages/qrcode/qrcode.js

 // shoppingGuid/page/pages/qrcode/qrcode.js
 const wxService = require('../../../../utils/wxService')
-import GuiderCard from '../../../../palette/guiderCard';
+import { Integer } from '../../../../utils/integerDigitalConvertion'
 const app = getApp();
 wxService.page({
   /**
@@ -145,11 +145,75 @@ wxService.page({
       this.getEnterpriseQrcode();
     }
     else if (this.data.currentBottomType == 1){ //带门店参数的关注公众号二维码
-
+      
     }
     else if (this.data.currentBottomType == 3){ //开卡页
+      this.getOpenCardPageQrcode();
+    }
+  },
+  
+  //获取二维码展示
+  getOpenCardPageQrcode(){
+    //先生成触点对象信息
+    let currentUserInfo = wx.getStorageSync('guidBaseInfo');
+    // if (!currentUserInfo) { //未登录成功
+    //   wx.redirectTo({
+    //     url: '/shoppingGuid/page/pages/welcomGuider/welcomGuider',
+    //   });
+    //   return;
+    // }
+
+    currentUserInfo = {
+      member : {
+        id: '588024219670024192'
+      }
+    }
+
+    wx.showLoading({
+      title: '触点生成中..',
+    });
 
+    let content = {
+      title: `导购“${this.data.name}”展示开卡页`,
+      id: currentUserInfo.member.id,
+      url: this.data.avator
+    }
+    let tentacleInfo = {
+      content: JSON.stringify(content),
+      contentId: currentUserInfo.member.id,
+      contentType: app.globalData.contants.SHARE_TYPE.BE_INVITED, //内容类型 STAFF_RECOMMAND
+      title: content.title, //标题
+      type: 3// 1:门店,2:员工(暂时不做),3:会员,4:第三方外部渠道,5:智能营销
     }
+
+    wxService.getTentacleContent(tentacleInfo).then(res => {
+      if (res && res.id) {
+        wx.showLoading({
+          title: '二维码生成中..',
+        });
+        let tentacleId = res.id;
+        let inner_tentacleId = Integer.digit(tentacleId, 10, 64);
+        //生成二维码
+        let data = {
+          "autoColor": true,
+          "page": 'shoppingGuid/page/pages/openCard/openCard',
+          // "page": 'pages/index/index',
+          "scene": '?t=' + inner_tentacleId,
+          "width": 260
+        }
+
+        wxService.post(`/marketing/quickMark/getAppQrCodePicture`, data).then(res => {
+          const { result, data } = res.data
+          if (result == 0) {
+            let url = app.globalData.imageUrl + data;
+            this.setData({
+              codeImg: url
+            });
+          }
+        });
+      }
+    });
+
   },
 
   /**