Переглянути джерело

feat(KIP-11184): Temp parking | ali program | H5 & native 信息交互 postMessage通讯

john 2 роки тому
батько
коміт
481cda6be3

+ 8 - 0
public/index.html

@@ -25,6 +25,7 @@
         qaPayment: 'https://qa-payment.kerryonvip.com',
       };
     }
+    window.isAlipayClient = false
     // const userAgent = window.navigator.userAgent.toLowerCase()
     // if(!/miniprogram/g.test(userAgent)) {
     //   document.getElementsByTagName('title')[0].innerText= '临时停车'
@@ -53,6 +54,13 @@
       // var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
       // document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
   </script>
+    <!--引入https://appx/web-view.min.js, 如该 H5 页面需要同时在非支付宝客户端内使用,为避免该请求404,可参考以下写法 -->
+    <script>
+      if (navigator.userAgent.indexOf('AlipayClient') > -1) {
+        document.writeln('<script src="https://appx/web-view.min.js"' + '>' + '<' + '/' + 'script>');
+          window.isAlipayClient = true
+      }
+    </script>
 </head>
 
 <body>

+ 42 - 14
src/App.vue

@@ -24,7 +24,12 @@
 </template>
 <script>
 import loginMinix from '@/mixins/login';
-import { getIsMin, getIsWxh5, getUrlParams, initEnv, requestInit, wssInit, theCommunicationBetweenWechatAndH5IsNormal, isReloadBefore, getsTheCurrentTopic } from '@/utils/index.js';
+import { 
+  getIsMin, getIsWxh5, getUrlParams, initEnv, requestInit, 
+  wssInit, theCommunicationBetweenWechatAndH5IsNormal, 
+  isReloadBefore, getsTheCurrentTopic, alipayClientInit,
+  localStorageInit, setToken, windowSendInit
+} from '@/utils/index.js';
 import uni from '@/utils/uniHooks';
 import { getAppIdByGroupIdAndMallId } from '@/utils/index.js';
 import sensorsFn from '@/plugins/sensors';
@@ -32,6 +37,7 @@ import sensorsFn from '@/plugins/sensors';
 export default {
   mixins: [loginMinix],
   async created() {
+    
     await initEnv();
     await requestInit();
     await this.init();
@@ -72,6 +78,27 @@ export default {
   methods: {
     async init() {
       uni.setStorageSync('env', window.env);
+      // 如果是支付宝小程序:初始化
+      if (isAlipayClient) {
+        setToken()
+        localStorageInit();
+        windowSendInit()
+        try {
+          this.$store.commit('SET_IS_INIT', false);
+          const options = await alipayClientInit();
+          await this.$store.dispatch('baseInit', {
+            options,
+            callback: () => {
+              this.$store.commit('SET_IS_INIT', true);
+              // 无感积分逻辑
+              // this.wxEasyPointsCommitStatusInit();
+            },
+          });
+        } catch (err) {
+          console.log(err);
+        }
+        return
+      }
       // 如果是微信小程序。初始化wss
       if (getIsMin()) {
         // 如果刷新之后没有与微信小程序建立链接则提示用户,关闭小程序重新进入
@@ -100,20 +127,21 @@ export default {
         if (window.location.href.indexOf('cryptojs') > -1) {
           return;
         }
-        // 保留 carList
-        const carList = uni.getStorageSync('carList');
-        // 保留 buildingId
-        const buildingId = window.localStorage.getItem('buildingId')
-        // 每次进入页面清空 缓存数据
-        window.localStorage.clear();
-        if (carList) {
-          uni.setStorageSync('carList', JSON.parse(carList));
-        }
-        if (buildingId) {
-          window.localStorage.setItem('buildingId', buildingId)
-        }
+        // // 保留 carList
+        // const carList = uni.getStorageSync('carList');
+        // // 保留 buildingId
+        // const buildingId = window.localStorage.getItem('buildingId')
+        // // 每次进入页面清空 缓存数据
+        // window.localStorage.clear();
+        // if (carList) {
+        //   uni.setStorageSync('carList', JSON.parse(carList));
+        // }
+        // if (buildingId) {
+        //   window.localStorage.setItem('buildingId', buildingId)
+        // }
+        setToken();
+        localStorageInit();
         this.$store.commit('SET_IS_INIT', false);
-        window.token = `${window.location.href}`.replace(/.*wx\/(.*)\/.*/g, '$1');
         try {
           const options = await wssInit();
           this.$store.dispatch('baseInit', {

+ 68 - 0
src/api/parking/index.js

@@ -174,4 +174,72 @@ export function paperCoupon(couponCode, vehicleNo) {
 
 export function updateUnionId({openId, unionId, vipCode = null}) {
   return window.requestms.put(`update-union-id?openId=${openId}&unionId=${unionId}&vipCode=${vipCode}`, {}, { loading: false });
+}
+
+
+// Temp parking Frontend |前端功能开关 config api: https://kerryprops.atlassian.net/browse/KIP-11003
+
+/* 
+新增键值对配置:
+curl --request POST \
+  --url http://localhost:8080/conf-values \
+  --header 'Content-Type: application/json' \
+  --data '{
+  "key": "key1",
+  "value": {
+    "key": "key1",
+    "value": null,
+    "description": "some desc 中文一些描述性文字",
+    "createTime": "2023-07-19 11:11:00"
+  },
+  "description": "some desc 中文一些描述性文字",
+  "createTime": "2023-07-19 11:11:00"
+}'
+ */
+export function aDDConfValues(params) {
+  return window.requestms.post(`conf-values`, params, { loading: false });
+}
+/* 
+所有配置列表:
+curl --request GET \
+  --url http://localhost:8080/conf-values/
+ */
+export function getConfValues(params) {
+  return window.requestms.get(`conf-values`, {}, { loading: false });
+}
+/* 
+查询具体key1的值:
+curl --request GET \
+  --url http://localhost:8080/conf-values/key1
+ */
+export function getConfValueOfKey(key) {
+  return window.requestms.get(`conf-values/${key}`, {}, { loading: false });
+  // return window.requestms.get(`https://qa-kip-service-internal.kerryplus.com/temporary-parking-service/conf-values/${key}`, {}, { loading: false });
+}
+/* 
+修改key1的值:
+curl --request PUT \
+  --url http://localhost:8080/conf-values/key1 \
+  --header 'Content-Type: application/json' \
+  --data '{
+  "key": "key1",
+  "value": {
+    "key": "key333",
+    "description": "ffffffffff",
+    "createTime": "2023333300"
+  },
+  "description": "sofgggggg4545字",
+  "createTime": "2023-01-11 11:11:00"
+}'
+ */
+export function putConfValueOfKey(key, params) {
+  return window.requestms.put(`conf-values/${key}`, params, { loading: false });
+}
+/* 
+删除key1:
+curl --request DELETE \
+  --url http://localhost:8080/conf-values/key1
+ */
+export function deleteConfValueOfKey(key) {
+  return window.requestms.delete(`conf-values/${key}`, {}, { loading: false });
 }

+ 1 - 1
src/main.js

@@ -6,7 +6,7 @@ import VConsole from 'vconsole';
 // 或者使用配置参数来初始化,详情见文档
 // 开发环境和qa环境 打开debug
 const debug = /dev-t?-?|qa-t?-?|sl-t?-?|808[0-9]/.test(window.location.href);
-if (debug && process.env.NODE_ENV !== 'dev') {
+if (debug) {
   window.vConsole = new VConsole(
     // { theme: 'dark' }
   );

+ 7 - 4
src/pages/parkingFee/mixins/parkingFee.js

@@ -16,7 +16,7 @@ import uni from '@/utils/uniHooks';
 // import greenCom from '../components/green/home.vue';
 // import officeBlueCom from '../components/officeBlue/home.vue';
 // import purpleCom from '../components/purple/home.vue';
-import { parkingLots, qrCodes, unlicensedCarCheckIn } from '@/api/parking';
+import { parkingLots, qrCodes, unlicensedCarCheckIn, getConfValueOfKey } from '@/api/parking';
 import { reject } from 'lodash';
 
 export default {
@@ -478,13 +478,16 @@ export default {
         try {
           // 判断是否启用停车发票
           uni.showLoading()
-          const res = await getAccessH5(`${this.mallId}-invoice`);
-          if(res?.data === 1) {
+          // const res = await getAccessH5(`${this.mallId}-invoice`);
+          const res = await getConfValueOfKey('HEJIInvoiceSwitch')
+          const lbsId = uni.getStorageSync('lbsId')
+          if(res?.switch && res.lbsId.length && res.lbsId.indexOf(lbsId) > -1) {
             uni.hideLoading();
             // console.log(474, this.Dialog);
             this.$dialog({
               title: '温馨提示',
-              message: '小程序“停车开票”功能将从2023年8月10日起提供服务,支持开具3个月内停车记录的发票,如需停车开票,请稍后尝试或咨询服务台',
+              // message: '小程序“停车开票”功能将从2023年8月10日起提供服务,支持开具3个月内停车记录的发票,如需停车开票,请稍后尝试或咨询服务台',
+              message: res.message,
               confirmButtonColor: this.$theme[this.theme].primaryColor
             })
             // 提示用户

+ 8 - 6
src/pages/parkingFee/mixins/parkingFeeDetail.js

@@ -156,12 +156,14 @@ export default {
     },
     // 前往支付
     async toPay() {
-      // 判断微信小程序与 h5 是否正常通信
-      const isReload = await theCommunicationBetweenWechatAndH5IsNormal()
-      if(!isReload) {
-        uni.setStorageSync('isReload', 1)
-        window.location.reload()
-        return
+      if (!isAlipayClient) {
+        // 判断微信小程序与 h5 是否正常通信
+        const isReload = await theCommunicationBetweenWechatAndH5IsNormal()
+        if(!isReload) {
+          uni.setStorageSync('isReload', 1)
+          window.location.reload()
+          return
+        }  
       }
       if (this.btnLoading) return
       this.btnLoading = true

+ 4 - 2
src/store/index.js

@@ -185,7 +185,7 @@ const store = new Vuex.Store({
         //     '8aaa81947c6e1ca0017c7201e82d0001#8aaa80cc7d4fc7b3017d55c4d6120000#8aaa80b47c784020017c78b00d060022#ozdsB4yx3I7ez2Ba3DgEmeSR-CFY#13601829387'
         //   )
         // );
-        console.log(128, options);
+        // console.log('128128128128', options);
         // if (!pageId) return;
         let {
           groupId = '',
@@ -223,7 +223,9 @@ const store = new Vuex.Store({
         commit('SET_APPID', appId);
 
         // let { groupId, mallId } =
-        if (!/CRM|PUDONG|JINGAN/.test(source)) {
+        // source: "ALIPAY"
+        // console.log('227227227227', !/CRM|PUDONG|JINGAN|ALIPAY/.test(source), source)
+        if (!/CRM|PUDONG|JINGAN|ALIPAY/.test(source)) {
           const groupIdAndMallId = getGroupIdAndMallIdByLsbId(lbsId);
           groupId = groupIdAndMallId.groupId;
           mallId = groupIdAndMallId.mallId;

+ 12 - 0
src/utils/alipayClient/index.js

@@ -0,0 +1,12 @@
+export function  alipayClientInit() {
+  return new Promise(resolve => {
+    // 请求 projectId
+    window.toWXSendMsg({
+      type: 'getProjectId',
+      options: {},
+    });
+    window.subscribe('projectId',( options ) => {
+      resolve(options.options);
+    });
+  })
+}

+ 15 - 0
src/utils/common/localStorage.js

@@ -0,0 +1,15 @@
+import uni from '../uniHooks'
+export function localStorageInit() {
+  // 保留 carList
+  const carList = uni.getStorageSync('carList');
+  // 保留 buildingId
+  const buildingId = window.localStorage.getItem('buildingId')
+  // 每次进入页面清空 缓存数据
+  window.localStorage.clear();
+  if (carList) {
+    uni.setStorageSync('carList', JSON.parse(carList));
+  }
+  if (buildingId) {
+    window.localStorage.setItem('buildingId', buildingId)
+  }
+}

+ 28 - 1
src/utils/index.js

@@ -247,6 +247,21 @@ export function getUrl() {
 export function windowSendInit() {
   const token = window.token;
   window.toWXSendMsg = function ( {type = '',funcName = '',options = {}} ) {
+    if(isAlipayClient) {
+      my.postMessage({
+        name:'h5',
+        body: {
+          token,
+          data: {
+            type: type,
+            funcName,
+            options,
+          }
+        }
+      });
+      return
+    }
+
     /**
      * 向小程序端发送消息
      */
@@ -269,6 +284,13 @@ export function windowSendInit() {
 
   // 主动订阅事件回调
   window.subscribe = function ( type,callback ) {
+    if(isAlipayClient) {
+      my.onMessage = function (response) {
+        console.log('293my.onMessage', response)
+        callback(response.body.data);
+      }
+      return
+    }
     const subscribeId = window.stompClient.subscribe('/user/' + token + '/toH5',function ( response ) {
       try {
         let res = {
@@ -347,4 +369,9 @@ export function getsTheCurrentTopic() {
   return { theme, componentName }
 }
 
-export * from './common/websocket.js'
+export function setToken() {
+  window.token = `${window.location.href}`.replace(/.*wx\/(.*)\/.*/g, '$1');
+}
+export * from './common/websocket.js'
+export * from './common/localStorage.js'
+export * from './alipayClient/index.js'