feat(KIP-15785): 停车首页增加积分补录弹窗

postcss.config.js

@@ -14,6 +14,7 @@ module.exports = {
                 /node_modules/,
                 // /src\/kui\/components\/k-tab/, 
                 /src\/kui\/components\/k-illustration/,
+                /src\/components\/wx-points-commit/,
             ], // 设置忽略文件，用正则做目录名匹配
             // exclude: [/node_modules/, /src\/kui/], // 设置忽略文件，用正则做目录名匹配
             landscape: false, // 是否处理横屏情况

src/components/wx-points-commit/wx-points-commit.vue

@@ -1,152 +1,142 @@
 <template>
-  <view class="box" v-if="show" @touchmove.stop.prevent>
-    <view class="boxIn">
-      <view class="content">
-        <image class="commit-star" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/points-commit.png"> </image>
-        <image v-if="custTypeId === 0" class="commit-logo-default" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/kerry.png"> </image>
-        <image v-else class="commit-logo-ko" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/ko.png"> </image>
-        <view class="logo"> </view>
-        <view class="title"> 您有消费积分未领取 </view>
-        <view class="text"> 如您的微信支付积分未到账，请于消费当日申请领取 </view>
-        <view @click="toWxPointsAuth" class="commit-btn" :class="{ 'commit-btn--blue': custTypeId === 1, 'commit-btn--green': custTypeId === 2 }"> 去领取 </view>
-        <image @click="close" class="commit-cancel" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/close.svg"> </image>
-      </view>
-    </view>
-  </view>
+  <div class="box" v-if="show" @touchmove.stop.prevent>
+    <div class="boxIn">
+      <div class="content">
+        <img class="commit-star" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/points-commit.png">
+        </img>
+        <img v-if="custTypeId === 0" class="commit-logo-default" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/kerry.png" />
+        <img v-else class="commit-logo-ko" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/ko.png" />
+        <div class="logo">
+        
+        </div>
+        <div class="title">
+          {{'您有消费积分未领取'}}
+        </div>
+        <div class="text">
+          如您的微信支付积分未到账，请于消费当日申请领取
+        </div>
+        <div @click="toWxPointsAuth" class="commit-btn" :class="{'commit-btn--blue': custTypeId===1,'commit-btn--green': custTypeId===2, 'commit-btn--qhkc': isQHKC }">
+          去领取
+        </div>
+        <img @click="close('time')" class="commit-cancel" src="https://cnsh-kerry-crm-prod.oss-cn-shanghai.aliyuncs.com/images/wx-points/close.svg" />
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
-import { mapState } from 'vuex';
-import { kipGetPointsConfig } from '@/utils/api-kip.js';
-// const app = getApp();
-const app = {};
+/* https://kerryprops.atlassian.net/browse/KIP-15785 */
+import Vue from 'vue';
+import uni from '@/utils/uniHooks';
+import { mapState } from "vuex"
+import {
+  wxEasyPointsCommitStatus
+} from '@/utils/api-kip.js'
+import { toLogin } from '@/utils'
 export default {
-  props: {},
   created() {
     // this.handleGetPointsConfig()
   },
-  watch: {},
   data() {
     return {
       pointsConfig: null,
       show: false,
       clickToWxPointsAuth: false,
+      pointsModalFlag: false
     };
   },
   computed: {
     // custTypeId: 0 默认版本，1 上海静安 2 上海浦东
     ...mapState({
       // custTypeId: 0
-      custTypeId: (state) => state.custTypeId,
+      custTypeId: state => state.custTypeId,
+      mallId: (state) => state.mallId,
+      source: (state) => state.source,
     }),
+    isQHKC() {
+      return ['8a88a9fd7f73ffcd017f968739870006', '8aaa82ea804d07cd0180516ff03b0008'].includes(this.mallId);
+    }
   },
   methods: {
-    checkoutLogin() {
-      const pages = getCurrentPages();
-      let url = '/' + pages[pages.length - 1].route;
-      pages[pages.length - 1].$vm.$refs.child.login(url, () => {
-        this.toWxPointsAuth();
-      });
-    },
-    handleGetPointsConfig() {
-      kipGetPointsConfig()
-        .then((resp) => {
-          const result = resp.data;
-          // codes,wxAuth,aliAuth
-          this.pointsConfig = result;
-          if (result) {
-            if (result && result.codes) {
-              // codes,wxAuth,aliAuth
-              this.pointsConfig = result;
-              this.checkoutLogin();
-            } else {
-              if (result.code && result.code === '300000') {
-                this.checkoutLogin();
-              } else {
-                uni.showToast({
-                  icon: 'none',
-                  mask: true,
-                  duration: 2000,
-                  title: result.errorMessage || result.message || '出错了，请稍后再试',
-                });
-              }
-            }
-          } else {
-            if (resp.code && resp.code === '300000') {
-              this.checkoutLogin();
-            } else {
-              uni.showToast({
-                icon: 'none',
-                mask: true,
-                duration: 2000,
-                title: resp.message,
-              });
-            }
-          }
-        })
-        .catch((e) => {
-          uni.showToast({
-            icon: 'none',
-            mask: true,
-            title: '请求错误',
-          });
-        });
-    },
     async toWxPointsAuth() {
-      console.log('授权微信无感积分');
+      console.log('授权微信无感积分')
       if (this.clickToWxPointsAuth) {
-        console.log('授权微信无感积分重复点击');
-        return;
+        console.log('授权微信无感积分重复点击')
+        return
       }
-      await this.handleGetPointsConfig();
-      this.clickToWxPointsAuth = true;
-      var myPluginInterface = requirePlugin('myPlugin');
-      uni.showLoading();
-      const _this = this;
-      await myPluginInterface.getLocation(app.globalData.openId).then((res) => {
-        const that = _this;
-        if (res.return_code === 0) {
-          uni.navigateTo({
-            url: `plugin://myPlugin/index?openid=${app.globalData.openId}&mch_id=${that.pointsConfig.mchId}&member_status=${that.pointsConfig.wxAuth ? 1 : 0}`,
-            success: function () {
-              that.close();
-              uni.hideLoading();
-              that.clickToWxPointsAuth = false;
-            },
-          });
-        } else if (res.return_code === '102') {
-          uni.showModal({
-            title: '提示',
-            content: '请您在”定位服务“中允许”微信”使用位置信息， 并允许该小程序使用定位功能',
-            showCancel: false,
-            confirmText: '确认',
-            success: function (res) {
-              that.close();
-              that.clickToWxPointsAuth = false;
-            },
-          });
-          uni.hideLoading();
-        } else {
-          that.clickToWxPointsAuth = false;
-        }
-      });
+      if (window.__wxjs_environment === 'miniprogram') {
+        wx.miniProgram.navigateTo({
+          "url": this.source === 'KIP' ? '/pages/points/wx-points-commit' : "/pages/package-parkingFee/wx-points-commit" // 去 login 页面 1 去登录
+        })
+      }
+      this.show = false;
+      this.clickToWxPointsAuth = false
     },
-    open() {
-      this.show = true;
+    async open(callback) {
+      const isShow = this.checkShowFlag();
+      if(!isShow) {
+        return
+      }
+      const pointsCommitStatus = await wxEasyPointsCommitStatus();
+
+      if(pointsCommitStatus.pointsCommitStatus === 'PENDING') {
+        // 展示
+        this.show = true
+        callback && callback()
+      }
+    },
+    checkShowFlag() {
+      // 如果是支付宝,不弹出弹窗
+      if(Vue.prototype.isAlipayClient) {
+        return false
+      }
+      const nowTime = new Date()
+      const nowTime00 = new Date().getTime()
+      var lbs_easy_end_time = uni.getStorageSync('lbs_easy_end_time')
+      if (lbs_easy_end_time) {
+        const arr_lbsId = lbs_easy_end_time.filter(element => {
+            return element.lbsId === this.$store.state?.lbsId
+        })
+        const milliseconds_in_24_hours = 24 * 60 * 60 * 1000
+        // 24小时内只弹出一次
+        if (arr_lbsId.length > 0 && nowTime00 - arr_lbsId[arr_lbsId.length - 1].time < milliseconds_in_24_hours) {
+           return false
+        }
+      }
+      return true
     },
     close() {
-      this.show = false;
+      this.show = false
+      var arr_lbs_end_time = []
+      if (uni.getStorageSync('lbs_easy_end_time')) {
+        arr_lbs_end_time = uni.getStorageSync('lbs_easy_end_time')
+        arr_lbs_end_time = arr_lbs_end_time.filter(item => item.lbsId !== this.$store.state?.lbsId);
+        console.log('del_arr_lbs_end_time:::', arr_lbs_end_time)
+        arr_lbs_end_time.push({
+            lbsId: this.$store.state?.lbsId,
+            time: new Date().getTime()
+        })
+        uni.setStorageSync("lbs_easy_end_time", arr_lbs_end_time)
+      } else {
+        arr_lbs_end_time.push({
+            lbsId: this.$store.state?.lbsId,
+            time: new Date().getTime()
+        })
+        uni.setStorageSync("lbs_easy_end_time", arr_lbs_end_time)
+      }
     },
-  },
-};
+  }
+}
 </script>
-<style scoped lang="less">
-.box {
+<style scoped>
+.box{
   position: fixed;
   z-index: 10000;
   width: 100vw;
   height: 100vh;
-  background: rgba(0, 0, 0, 0.7);
+  background: rgba(0,0,0,0.7);
+  top: 0;
+  left: 0;
 }
 
 .boxIn {
@@ -155,17 +145,17 @@ export default {
   height: 100%;
 }
 
-.content {
+.content{
   position: relative;
   width: calc(100% - 110px);
-  height: 232px;
-  background: #ffffff;
+  height: 245px;
+  background: #FFFFFF;
   border-radius: 8px;
   margin: 0 auto;
   margin-top: 280px;
 }
 
-.commit-star {
+.commit-star{
   position: absolute;
   width: calc(100vw - 40px);
   height: calc(48.1vw - 23.6px);
@@ -173,16 +163,16 @@ export default {
   left: -33px;
 }
 
-.commit-logo-default {
+.commit-logo-default{
   width: 84px;
-  height: 20px;
+  height:20px;
   position: relative;
   display: block;
   top: 15px;
   left: 30px;
 }
 
-.commit-logo-ko {
+.commit-logo-ko{
   width: 80px;
   height: 20px;
   position: relative;
@@ -191,12 +181,12 @@ export default {
   left: 35px;
 }
 
-.logo {
+.logo{
   height: 35px;
-  border-bottom: 1rpx solid rgba(151, 151, 151, 0.1);
+  border-bottom: 1rpx solid rgba(151,151,151,0.1);
 }
 
-.title {
+.title{
   font-size: 16px;
   font-weight: 600;
   color: #333;
@@ -204,7 +194,7 @@ export default {
   margin-top: 22px;
 }
 
-.text {
+.text{
   width: 180px;
   margin: 0 auto;
   margin-top: 8px;
@@ -213,31 +203,42 @@ export default {
   text-align: center;
 }
 
-.commit-btn {
+.text-content{
+  width: calc(100% - 20px);
+  line-height: 20px;
+}
+
+.commit-btn{
   width: calc(100vw - 180px);
   height: 40px;
   margin: 0 auto;
-  margin-top: 17px;
+  margin-top: 27px;
   line-height: 40px;
   text-align: center;
   font-size: 15px;
   color: #fff;
-  background: #644a79;
+  background: var(--k-color-primary-01, #064c8a);
   border-radius: 25px;
-  box-shadow: 3px 3px 12px 0px #644a79;
+  box-shadow: 3px 3px 12px 0px var(--k-color-primary-01, #064c8a);
+  
 }
 
 .commit-btn--blue {
-  box-shadow: 3px 3px 12px 0px #13358e;
-  background: #13358e;
+  box-shadow: 3px 3px 12px 0px #13358E;
+  background: #13358E;
 }
 
 .commit-btn--green {
-  box-shadow: 3px 3px 12px 0px #25673c;
-  background: #25673c;
+  box-shadow: 3px 3px 12px 0px #25673C;
+  background: #25673C;
+}
+
+.commit-btn--qhkc {
+  box-shadow: 3px 3px 12px 0px #DF8443;
+  background: #DF8443;
 }
 
-.commit-cancel {
+.commit-cancel{
   position: relative;
   display: block;
   margin: 0 auto;
@@ -245,4 +246,4 @@ export default {
   width: 32px;
   height: 32px;
 }
-</style>
+</style>

src/pages/parkingFeeV2/mixins/parkingFee.js

@@ -5,6 +5,7 @@ import {mapState} from 'vuex';
 import {initWxJsSdkConfig} from '@/utils/login';
 import {getUrlParams, isHZ, isAlipay} from '@/utils';
 import wxPointsAuth from '@/components/wx-points-auth/wx-points-auth.vue'
+import wxPointsCommit from '@/components/wx-points-commit/wx-points-commit.vue'
 import CacheTool from '@/utils/cache-tool'
 const app = {
   globalData: {
@@ -19,6 +20,7 @@ export default {
     plateNumber,
     LoginDom,
     'wx-points-auth': wxPointsAuth,
+    'wx-points-commit': wxPointsCommit,
     // blueCom,
     // greenCom,
     // officeBlueCom,
@@ -180,6 +182,12 @@ export default {
     } catch (e) {
       console.log(e)
     }
+    /*积分初始化*/
+    if(this.$route.query?.isLogin === "haveLoggedIn" && this.$route.query?.isHome === "true") {
+      this.$refs.wxPointsCommit.open(() => {
+        this.$refs.wxPointsAuth.show = false
+      })     
+    }
   },
   methods: {
     gosuccess () {

src/pages/parkingFeeV2/parkingFee.vue

@@ -219,6 +219,7 @@
       </div>
     </scroll-view>
     <wx-points-auth ref="wxPointsAuth"></wx-points-auth>
+    <wx-points-commit ref="wxPointsCommit"></wx-points-commit>
     <plate-number ref="plateKeyboard" :noDisBtn="[32, 33, 34,35, 36, 37]" :carType="carType" :active="active" :ind="ind" :numArr="numArr" @carnoArr="updateCarno"></plate-number>
     <checkCarPopup ref="checkCarPopup"></checkCarPopup>
   </div>

src/utils/common/localStorage.js

@@ -3,6 +3,7 @@ export function localStorageInit() {
   // 保留 carList
   const carList = uni.getStorageSync('carList');
   const lbs_end_time = uni.getStorageSync('lbs_end_time');
+  const lbs_easy_end_time = uni.getStorageSync('lbs_easy_end_time');
   // 保留 buildingId
   // const buildingId = window.localStorage.getItem('buildingId')
   // 每次进入页面清空 缓存数据
@@ -16,4 +17,7 @@ export function localStorageInit() {
   if(lbs_end_time) {
     uni.setStorageSync('lbs_end_time', lbs_end_time);
   }
+  if(lbs_easy_end_time) {
+    uni.setStorageSync('lbs_easy_end_time', lbs_easy_end_time);
+  }
 }

src/utils/index.js

@@ -427,7 +427,12 @@ export function backLbsHome() {
 export function toLogin() {
   if (window.__wxjs_environment === 'miniprogram') {
     wx.miniProgram.redirectTo({
-      "url": "/pages/package-parkingFee/parkingFeeWebViewLogin?needLogin=1" // 去 login 页面 1 去登录
+      "url": source === 'KIP' ? "/pages/package-login/select?from=parkingFeeWebView" : "/pages/package-parkingFee/parkingFeeWebViewLogin?needLogin=1" // 去 login 页面 1 去登录
+    })
+  }
+  if (Vue.prototype.isAlipayClient) {
+    my?.reLaunch({
+      url: "/pages/package-parkingFee/parkingFeeWebViewLogin?needLogin=1" // 去 login 页面 1 去登录
     })
   }
 }