update @组合商品 一键领取校验 手输判断/授权逻辑

src/global.scss

@@ -93,12 +93,13 @@ html {
   display: none;
 }
 
-/*页面加载*/
+// 营销 H5 全局样式
+// 页面加载
 .pageNoneLoading_Vant {
   margin-top: 200px;
 }
 
-/*点击遮罩loading*/
+// 点击遮罩loading
 .overlayLoadBody {
   background-color: rgba(0, 0, 0, 0) !important;
   display: flex;
@@ -120,4 +121,18 @@ html {
   background: #e8eaec !important;
 }
 
+// 底部滑出输入框
+.inputPopup {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  align-items: center;
+  .inputModalTitle {
+
+  }
+  .inputModalContent {
+    margin-bottom: 20px;
+  }
+}
+
 

src/views/pages/comProduct/index.vue

@@ -64,14 +64,15 @@
       v-model:show="inputModalShow"
       closeable
       position="bottom"
-      :style="{ height: '30%' }"
+      :style="{ height: '40%' }"
-      class="inputModal"
+      class="inputPopup"
     >
-      <p class="inputModalTitle">标题</p>
+      <p class="inputModalTitle"> {{ getModalTitle }} </p>
       <van-cell-group class="inputModalContent" inset>
-        <van-field v-model="inputVal" label="账号" placeholder="请输入手机号或QQ号" />
+        <van-field v-model="inputVal" label="账号" placeholder="请输入手机号" />
         <van-field v-model="inputValAgain" label="再次输入" placeholder="请再次输入" />
       </van-cell-group>
+      <van-button @click="receiveAll('submit', selectedPro)" type="primary" block>块级元素</van-button>
     </van-popup>
   </div>
 </template>
@@ -84,8 +85,18 @@ export default {
   props: {},
   data() {
     return {
-      loadingStatus: false,
+      loadingStatus: false, // 页面加载 loading
+      overlayLoad: false, // 点击 遮罩 loading
+
+      isWx: navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1,
+      wxAuthUrl: 'https://openapi.1688sup.com/wechat/oauth',
+      zfbAuthUrl: 'https://openapi.1688sup.com/alipay/oauth',
+
       key: this.$route.query.key || localStorage.getItem("key"),
+      // token: this.$route.query.token || localStorage.getItem("key"),
+      openid: this.$route.query.openid || localStorage.getItem("openid"), // 微信授权id
+      alipayuserid: this.$route.query.alipayuserid || localStorage.getItem("alipayuserid"), // 支付宝授权id
+
       detailType: 0, // 路由 push 详情 type
       showData: ['31', '32', '33', '2', '1'] as Array<any>, // 区分 列表 和 详情
       pageData: new Map([['31', []], ['32', []], ['33', []], ['2', []], ['1', []]]),
@@ -159,7 +170,7 @@ export default {
       inputModalShow: false,
       inputVal: '',
       inputValAgain: '',
-      overlayLoad: false,
+      selectedPro: [], // 单个商品 和 同一类型 + 一键领取
       orderData: [], // 订单轮询
     }
   },
@@ -168,6 +179,25 @@ export default {
     this.checkRoute();
     await this.getData();
   },
+  computed: {
+    getModalTitle() {
+      const obj = this.selectedPro[0];
+      if (this.selectedPro.length === 1) {
+        return obj.goods.name;
+      } else {
+       switch (obj.goods.type) {
+         case 1:
+           return "红包";
+         case 2:
+           return "直充/卡密";
+         case 3:
+           return obj.info.channel === 1 ? "支付宝立减金" : obj.info.channel === 2 ? '微信立减金' : '云闪付立减金';
+         default:
+           return ''
+       }
+      }
+    }
+  },
   watch: {
     '$route': {
       handler: 'checkRoute',
@@ -191,6 +221,8 @@ export default {
             list.push(item);
             this.pageData.set(index, list);
           })
+        } else {
+          showToast('商品数据为空');
         }
       }
       this.loadingStatus = false;
@@ -217,26 +249,81 @@ export default {
     async receiveAll (type: string, list: any) {
       if (this.detailType && type === 'top') return;
       console.log(`---list-${type}---`, list);
-      if (type === 'one') {
+      // 领取提示判断
+      if (type === 'one') { // 单品 直接根据
         let obj = list[0];
-        if (obj.goods.err_code && obj.goods.reson) {
+        if (obj.goods.err_code) {
-          return showToast(obj.goods.reson);
+          return showToast(obj.goods.reson || '商品异常');
         }
       }
-      let ids: any = [];
+      let ids: any = [], modes: any = [];
       list.forEach((item: any) => {
+        if (item.goods.type === 1) { // 红包
+          const str = item.cash.channel === 3 ? `${item.cash.channel}` : `${item.cash.channel}${item.cash.receive_mode}`;
+          modes.push(str)
+        } else if (item.goods.type === 2) { // 直充
+          const str = item.degital.product_type === 1 ? `${item.degital.product_type}${item.degital.check_sms_code}` : `${item.degital.product_type}${item.degital.card_show}${item.degital.check_sms_code}`;
+          modes.push(str)
+        } else if (item.goods.type === 3) { // 立减金
+          const str = item.info.channel === 3 ? `${item.info.channel}` : `${item.info.channel}${item.info.receive_mode}`;
+          modes.push(str)
+        }
         if (!item.goods.err_code) {
           ids.push(item.goods.id)
         }
       })
+      if (new Set(modes).size !== 1) {
+        return showToast('不同类型或领取方式不支持一键领取');
+      }
       if (!ids.length) {
         return showToast('暂无可领取商品');
       }
+      // 直充（非平台） + 红包/立减金（支付-账号领取/云闪付） 输入判断
+      this.selectedPro = [ ...list ];
+      let obj = this.selectedPro[0], account = '默认';
+      const boolHB = obj.goods.type === 1 && (((obj.cash.channel === 1) && (obj.cash.receive_mode === 2)) || (obj.cash.channel === 3));
+      const boolZC = obj.goods.type === 2 && !((obj.degital.product_type === 2) && (obj.degital.card_show === 2));
+      const boolLJJ = obj.goods.type === 3 && ((obj.info.channel === 1) && (obj.info.receive_mode === 2) || (obj.info.channel === 3));
+      if (boolHB || boolZC || boolLJJ) {
+        if (type !== 'submit') {
+          return this.inputModalShow = true;
+        }
+        if (!this.inputVal) {
+          return showToast('请输入账号');
+        } else {
+          if (!this.inputValAgain) {
+            return showToast('请再次输入账号');
+          }
+          if (this.inputValAgain !== this.inputVal) {
+            return showToast('两次输入不一致');
+          }
+        }
+        account = this.inputVal;
+      }
+      // 红包/立减金（支付-官方领取/微信） 授权判断
+      if (obj.goods.type === 1) { // 红包
+        if (obj.cash.channel === 1 && obj.cash.receive_mode === 1) { // 支付宝-官方领取
+          account = this.alipayuserid;
+        }
+        if (this.info.channel === 2) { // 微信
+          account = this.openid;
+        }
+        if (!account) return this.channelJudge(obj.cash.channel, obj.cash.receive_mode);
+      } else if (obj.goods.type === 3) {
+        if (obj.info.channel === 1 && obj.info.receive_mode === 1) { // 支付宝-官方领取
+          account = this.alipayuserid;
+        }
+        if (obj.info.channel === 2) { // 微信
+          account = this.openid;
+        }
+        if (!account) return this.channelJudge(obj.info.channel, obj.info.receive_mode);
+      }
+      // 兑换-订单轮询
       this.overlayLoad = true;
       const res = await EXCHANGE({
         key: this.key,
         id: ids,
-        account: 'account',
+        account: account,
         name: 'name',
       });
       if (res && res.code === 200) {
@@ -263,6 +350,48 @@ export default {
       }
       this.overlayLoad = false;
     },
+    // 支付宝-官方领取 + 微信
+    channelJudge (channel: number, mode: number) {
+      // channel 1 支付宝 2 微信 3 云闪付
+      // mode 支付宝：1 官方领取 2 账号领取；微信：1 小程序 2 公众号 3 通用领取
+      if (channel === 1 && mode === 1) { // 支付宝-官方领取
+        const backLink = encodeURIComponent(`${location.origin}/yxh5/cmsVoucher?key=${localStorage.getItem('key')}&id=${this.$route.query.id}`);
+        const url = `${this.zfbAuthUrl}?jump=${backLink}`;
+        // 微信等环境不能直接打开支付宝
+        const ua = navigator.userAgent.toLowerCase();
+        if (this.isWx || ua.indexOf("baiduboxapp") > -1 || ua.indexOf("firefox") > -1) {
+          showConfirmDialog({
+            confirmButtonText: '复制',
+            message: '请点击[复制]按钮，复制链接到浏览器打开',
+          })
+          .then(() => {
+            this.copyFn(url);
+          })
+          .catch(() => {})
+        } else {
+          // 唤起支付宝
+          location.replace(url);
+        }
+      } else if (channel === 2) { // 微信
+        if (!this.isWx) { // 微信环境 默认静默授权
+          if (mode === 2) { // 公众号
+            const backLink = encodeURIComponent(`${location.origin}/yxh5/cmsVoucher?key=${localStorage.getItem('key')}&id=${this.$route.query.id}`);
+            const url = `${this.wxAuthUrl}?jump=${backLink}`;
+            showConfirmDialog({
+              confirmButtonText: '复制',
+              message: '请点击[复制]按钮，复制链接到微信打开',
+            })
+            .then(() => {
+              this.copyFn(url);
+            })
+            .catch(() => {})
+          } else { // 小程序 + 通用领取
+            // 唤起小程序 todo
+            location.replace('https://www.baidu.com/')
+          }
+        }
+      }
+    },
     async orderPolling () {
       const that = this;
       const res = await ORDER_QUERY({
@@ -540,13 +669,4 @@ export default {
     }
   }
 }
-.inputModal {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-around;
-  align-items: center;
-  .inputModalContent {
-    margin-bottom: 20px;
-  }
-}
 </style>

src/views/templates/cmsDetail/index.vue

@@ -11,7 +11,7 @@
     </div>
     <p class="line"/>
     <img class="defaultInputImg" v-if="!pageData" :src="cssData.defaultInputImg" alt="">
-    <div v-if="!((pageData.degital.product_type === 2) && (pageData.degital.card_show === 2)) || (pageData.degital.check_sms_code === 1)" class="inputBox">
+    <div v-if="!((pageData.degital.product_type === 2) && (pageData.degital.card_show === 2))" class="inputBox">
       <van-cell-group inset>
         <van-field v-model="inputVal" label="账号" placeholder="请输入手机号" />
         <van-field

src/views/templates/cmsList/index.vue

@@ -1,7 +1,7 @@
 <template>
   <van-loading class="pageNoneLoading_Vant" v-if="loadingStatus" size="24px" color="#0094ff" vertical>加载中...</van-loading>
   <div v-else class="cmsListWrapper">
-    <img @click="jumpBanner" class="bannerTop" :src="cssData.bannerTop[0].url" alt="">
+    <img @click="jumpBanner" class="bannerTop" :src="cssData.bannerTop.length ? cssData.bannerTop[0].url : 'https://lsxdmgoss.oss-cn-chengdu.aliyuncs.com/MarketingSystem/image/front/goodstop.png'" alt="">
     <div class="content">
       <div v-if="cssData.contentType === 1" class="carouselBox">
         <img v-if="!pageData" class="carouselImg" :src="cssData.carouselImg" alt="">

src/views/templates/cmsVoucher/index.vue

@@ -269,7 +269,7 @@ export default {
         account = this.openid;
       }
       // 针对 支付宝-官方领取/微信 需要授权场景 判断
-      if (!account ) return this.channelJudge();
+      if (!account) return this.channelJudge();
       this.overlayLoad = true;
       const res = await EXCHANGE({
         key: this.key,
@@ -306,6 +306,7 @@ export default {
           .then(() => {
             this.copyFn(url);
           })
+          .catch(() => {})
         } else {
           // 唤起支付宝
           location.replace(url);
@@ -322,6 +323,7 @@ export default {
             .then(() => {
               this.copyFn(url);
             })
+            .catch(() => {})
           } else { // 小程序 + 通用领取
             // 唤起小程序 todo
             location.replace('https://www.baidu.com/')