提交

apps/mobile/src/utils/callFn/index.js

@@ -267,6 +267,7 @@ export function getAppOrWxPageLink(page) {
  */
 export function openAppOrWxPage(page, config = {}) {
   const link = getAppOrWxPageLink(page)
+  console.log(link)
   openLinkOfOther(link, config)
 }
 

apps/mobile/src/views/common/vipsubscribeRights.vue

@@ -35,8 +35,9 @@
                     'btn-yellow': item.color === 'yellow',
                     'btn-yellowb': item.color === 'yellowb'
                   }"
+                  @click.stop="cardClick(item)"
                 >
-                  {{ item.btn }}
+                  {{ item.title === '超级订阅' ? viperbtnText : memberbtnText }}
                 </div>
               </div>
               <div
@@ -124,26 +125,31 @@
         <div class="middle-desc">
           请点击申请免费体验，我们将第一时间联系您，并推荐适合您需求的产品，或指派专业客户经理为您定制解决方案。
         </div>
-        <div class="middle-btn">申请免费体验</div>
+        <div class="middle-btn" @click="gosource">申请免费体验</div>
       </div>
       <div class="bottomModules">
         <img src="@/assets/image/vip-subscribe/serve/hzhb.png" alt="" />
       </div>
-      <div class="footer-group">
+      <div class="footer-group" @click="call_Phone('400-108-6670')">
         <div class="phone-btn">
           <div class="icon-phone"></div>
           <div class="btn-text">电话咨询</div>
         </div>
-        <div class="wx-btn">
+        <div class="wx-btn" @click="kefu">
           <div class="icon-wx"></div>
           <div class="btn-text">在线客服</div>
         </div>
-        <div class="open-btn">立即开通</div>
+        <div class="open-btn" @click="bottombtnClick">{{ bottombtnText }}</div>
       </div>
     </div>
   </div>
 </template>
 <script>
+import { getUserAccountInfo } from '@/api/modules'
+import { callPhone } from '@/utils/callFn'
+import { mapGetters } from 'vuex'
+import { openAppOrWxPage } from '@/utils/'
+import { LINKS } from '@/data'
 import Ad from '@/components/ad/Ad.vue'
 import { Swipe, SwipeItem } from 'vant'
 import { px2px } from '@/utils'
@@ -155,6 +161,28 @@ export default {
     Ad
   },
   computed: {
+    ...mapGetters('user', ['isLogin', 'isFree', 'isMember', 'isSuper']),
+    viperbtnText() {
+      if (this.isSuper) {
+        return '1'
+      } else {
+        return '立即开通'
+      }
+    },
+    memberbtnText() {
+      if (this.isMember) {
+        return '续费咨询'
+      } else {
+        return '立即开通'
+      }
+    },
+    bottombtnText() {
+      if (this.tab === 0) {
+        return this.viperbtnText
+      } else {
+        return this.memberbtnText
+      }
+    },
     serveList() {
       if (this.tab === 0) {
         return this.tableModules_free_vip
@@ -176,7 +204,75 @@ export default {
       return (this.$envs.inWX ? 'jy' : 'jyapp') + '-wxcontent-bottom'
     }
   },
+  watch: {},
+  created() {
+    this.getUserAccountInfoAjax()
+  },
   methods: {
+    openAppOrWxPage,
+    callPhone,
+    getUserAccountInfoAjax() {
+      getUserAccountInfo().then((res) => {
+        console.log(res)
+      })
+    },
+    cardClick(item) {
+      if (item.title === '超级订阅') {
+        if (this.viperbtnText === '立即开通') {
+          this.$router.push({
+            path: '/order/create/svip',
+            query: { type: 'buy' }
+          })
+        } else if (this.viperbtnText === '立即续费') {
+          this.$router.push({
+            path: '/order/create/svip',
+            query: { type: 'renew' }
+          })
+        } else {
+          this.kefu()
+        }
+      } else if (item.title === '大会员商机版2.0') {
+        if (this.memberbtnText === '立即开通') {
+        } else if (this.memberbtnText === '续费咨询') {
+          window.location.href = ''
+        }
+      } else if (item.title === '大会员专家版2.0') {
+        if (this.memberbtnText === '立即开通') {
+        } else if (this.memberbtnText === '续费咨询') {
+          window.location.href = ''
+        }
+      }
+    },
+    bottombtnClick() {
+      let obj = {}
+      if (this.tab === 0) {
+        obj = { title: '超级订阅' }
+      } else if (this.tab === 1) {
+        obj = { title: '大会员商机版2.0' }
+      } else if (this.tab === 2) {
+        obj = { title: '大会员专家版2.0' }
+      }
+      this.cardClick(obj)
+    },
+    gosource() {
+      // 留资
+      if (this.$envs.inWX) {
+        location.href =
+          '/weixin/frontPage/bigmember/free/perfect_info?source=wx_ServiceList_experience'
+      } else if (this.$envs.inApp) {
+        location.href =
+          '/jyapp/frontPage/bigmember/free/perfect_info?source=app_ServiceList_experience'
+      } else {
+        location.href =
+          '/jyapp/frontPage/bigmember/free/perfect_info?source=h5_ServiceList_experience'
+      }
+    },
+    kefu() {
+      this.openAppOrWxPage(LINKS.客服)
+    },
+    call_Phone(tel) {
+      this.callPhone(tel)
+    },
     itemclick(index) {
       this.setswipeTo(index)
     },
@@ -193,21 +289,18 @@ export default {
       cardlist: [
         {
           title: '超级订阅',
-          btn: '立即开通',
           tag: '推荐个人、小微企业使用',
           desc: '<span style="color:#2ABED1;fontSize:16px">27</span>项特权，支持标讯灵活订阅、高级搜索，让商机获取更轻松！',
           color: 'blue'
         },
         {
           title: '大会员商机版2.0',
-          btn: '立即开通',
           tag: '推荐企业获取商机、业务拓展使用',
           desc: '<span style="color:#B1700E;fontSize:16px">38</span>项特权，提前推送超前项目，优先对接项目负责人。',
           color: 'yellow'
         },
         {
           title: '大会员专家版2.0',
-          btn: '立即开通',
           tag: '推荐企业获取商机、业务拓展、企业管理、市场分析使用',
           desc: '<span style="color:#B1700E;fontSize:16px">48</span>项特权，分析业主、企业画像、导出数据辅助市场决策。',
           color: 'yellowb'
@@ -1137,6 +1230,7 @@ export default {
 <style lang="scss" scoped>
 .vipsubscribeRights {
   padding-bottom: 66px;
+
   .header {
     max-height: 190px;
     position: relative;
@@ -1163,6 +1257,7 @@ export default {
             display: flex;
             align-items: center;
             justify-content: space-between;
+
             .left-text {
               font-size: 16px;
               font-weight: 400;
@@ -1170,6 +1265,7 @@ export default {
               text-align: left;
               color: #1b1a2a;
             }
+
             .right-btn {
               width: 112px;
               height: 33px;
@@ -1180,16 +1276,20 @@ export default {
               align-items: center;
               justify-content: center;
             }
+
             .btn-blue {
               background: linear-gradient(270deg, #3687ff 0%, #2abed1 100%);
             }
+
             .btn-yellow {
               background: linear-gradient(270deg, #d69e55 0%, #f1d090 130.11%);
             }
+
             .btn-yellowb {
               background: linear-gradient(270deg, #d69e55 0%, #f1d090 130.11%);
             }
           }
+
           .tag-text {
             font-size: 11px;
             display: inline-block;
@@ -1199,21 +1299,25 @@ export default {
             border-radius: 20px;
             margin-right: 10px;
           }
+
           .tag-blue {
             color: #2abed1;
             background: #eaf8fa;
             border: 1px solid #2abed1;
           }
+
           .tag-yellow {
             color: #b1700e;
             background: #c98f3714;
             border: 1px solid #c98f37;
           }
+
           .tag-yellowb {
             color: #b1700e;
             border: 1px solid #c98f37;
             background: #c98f3714;
           }
+
           .card-desc {
             font-size: 14px;
             line-height: 20px;
@@ -1259,16 +1363,20 @@ export default {
       }
     }
   }
+
   .content_box {
     padding-top: 104px;
     background-color: #fff;
+
     .titleImg {
       width: 264px;
       display: block;
       margin: auto;
     }
+
     .tableModules {
       padding: 14px 12px 0 12px;
+
       .m-title {
         font-size: 15px;
         line-height: 22px;
@@ -1277,6 +1385,7 @@ export default {
         padding-left: 11px;
         margin-bottom: 8px;
       }
+
       .m-title::before {
         position: absolute;
         left: 0;
@@ -1288,6 +1397,7 @@ export default {
         border-radius: 11px;
         background-color: #2abed1;
       }
+
       .m-head {
         border-radius: 8px 8px 0 0;
         background: linear-gradient(269.92deg, #f5f6f7 0.06%, #edeff2 99.93%);
@@ -1295,32 +1405,39 @@ export default {
         line-height: 18px;
         color: #171826;
         display: flex;
+
         .m-head-item {
           flex: 1;
           text-align: center;
           padding: 12px 2px;
         }
+
         .blue {
           background: linear-gradient(279.5deg, #7ce8f7 17%, #ddfff5 100%);
           border-radius: 8px 8px 0 0;
         }
+
         .yellow {
           background: linear-gradient(270deg, #f1d090 0%, #fae7ca 100%);
           border-radius: 8px 8px 0 0;
           color: #c26f33 !important;
         }
+
         .yellowb {
           background: linear-gradient(270deg, #f5c594 0%, #ffebdc 100%);
           border-radius: 8px 8px 0 0;
           color: #c26f33 !important;
         }
       }
+
       .m-content {
         background-color: #fff;
         display: flex;
+
         .con-cr-gray {
           color: #9b9ca3;
         }
+
         .con-item {
           flex: 1;
           padding: 10px 8px;
@@ -1330,6 +1447,7 @@ export default {
           min-height: 44px;
           font-size: 11px;
           line-height: 18px;
+
           ::v-deep {
             .icon-blue {
               width: 16px;
@@ -1338,6 +1456,7 @@ export default {
               display: block;
               background-image: url('@/assets/image/vip-subscribe/serve/right-green.png');
             }
+
             .icon-yellow {
               width: 16px;
               height: 16px;
@@ -1345,29 +1464,35 @@ export default {
               display: block;
               background-image: url('@/assets/image/vip-subscribe/serve/right-yellow.png');
             }
+
             .flex-center {
               display: flex;
               align-items: center;
             }
+
             .text {
               text-align: center;
             }
           }
         }
+
         .blue {
           background-color: #dafafe;
           color: #2abed1;
         }
+
         .yellow {
           background-color: #fff6ee;
           color: #c26f33;
         }
+
         .yellowb {
           background-color: #ffede1;
           color: #c26f33;
         }
       }
     }
+
     .middleModules {
       width: 100%;
       height: 231px;
@@ -1375,12 +1500,14 @@ export default {
       background-image: url('@/assets/image/vip-subscribe/serve/bg-img.png');
       background-size: 100% 100%;
       padding-top: 30px;
+
       .middle-tit {
         font-size: 20px;
         line-height: 32px;
         color: #171826;
         text-align: center;
       }
+
       .middle-desc {
         width: 340px;
         color: #5f5e64;
@@ -1390,6 +1517,7 @@ export default {
         margin: auto;
         margin-top: 16px;
       }
+
       .middle-btn {
         width: 343px;
         height: 46px;
@@ -1404,6 +1532,7 @@ export default {
         margin-top: 17px;
       }
     }
+
     .footer-group {
       width: 100%;
       background-color: #fff;
@@ -1413,6 +1542,7 @@ export default {
       left: 0;
       bottom: 0;
       display: flex;
+
       .phone-btn {
         // display: flex;
         // justify-content: center;
@@ -1424,10 +1554,12 @@ export default {
           margin: auto;
         }
       }
+
       .wx-btn {
         // display: flex;
         // justify-content: center;
         margin-left: 36px;
+
         .icon-wx {
           background-image: url('@/assets/image/vip-subscribe/serve/kefu.png');
           background-size: 16px 16px;
@@ -1436,6 +1568,7 @@ export default {
           margin: auto;
         }
       }
+
       .btn-text {
         font-size: 14px;
         line-height: 20px;
@@ -1443,6 +1576,7 @@ export default {
         text-align: center;
         margin-top: 4px;
       }
+
       .open-btn {
         width: 159px;
         height: 42px;
@@ -1456,14 +1590,17 @@ export default {
         margin-left: 36px;
       }
     }
+
     .bottomModules img {
       width: 100%;
       display: block;
     }
+
     .m-content:last-child {
       border-radius: 0 0 8px 8px;
       overflow: hidden;
     }
+
     .gray {
       background-color: #fafafb !important;
     }