feat: 移动端详情页客户推荐

apps/mobile/src/views/article/components/ContentCustomerRecommend.vue

@@ -4,7 +4,14 @@
     class="content-customer-recommend"
     v-if="showModule"
   >
-    <MaskCard v-if="showMask"></MaskCard>
+    <MaskCard
+      v-if="showMask"
+      :title="maskConf.title"
+      :exampleImage="maskConf.exampleImage"
+      :desc="maskConf.desc"
+      @headerActionClick="headerActionClick"
+      @footerBtnClick="footerBtnClick"
+    ></MaskCard>
     <template v-else>
       <div class="customer-list">
         <CustomerCell
@@ -48,6 +55,11 @@ export default {
   },
   data() {
     return {
+      maskConf: {
+        title: '大会员专家版权益',
+        exampleImage: 'mask/example/customer-list-example-img@2x.png',
+        desc: '根据区域、业务范围、客户类型帮助企业快速找到目标地区潜在业务需求客户及联系方式。'
+      },
       // entList: [
       //   {
       //     id: 'e-1111',
@@ -117,7 +129,7 @@ export default {
     },
     showModule() {
       if (this.hasBigMemberPower7) {
-        return this.entList.length
+        return this.entList.length > 0
       } else {
         return true
       }
@@ -133,9 +145,6 @@ export default {
       return !this.hasBigMemberPower7
     }
   },
-  created() {
-    window.t = this
-  },
   methods: {
     toDetail(item) {
       const query = {
@@ -177,6 +186,21 @@ export default {
       } catch (error) {
         console.log(error)
       }
+    },
+    headerActionClick() {
+      openAppOrWxPage(LINKS.大会员落地页面)
+    },
+    footerBtnClick() {
+      const source = `${this.$env.platform}_article_CustomerRecommend`
+      // 留资页面
+      // this.$leaveInfo.toLeaveInfoPage({
+      //   source
+      // })
+      openAppOrWxPage(LINKS.留资, {
+        query: {
+          source
+        }
+      })
     }
   }
 }

apps/mobile/src/views/article/ui/MaskCard.vue

@@ -10,7 +10,7 @@
         >
           <h5 class="mask-content-title">{{ title }}</h5>
           <span class="mask-content-actions">
-            <span class="mask-content-action">
+            <span class="mask-content-action" @click="onHeaderActionClick">
               <span>查看服务介绍</span>
               <van-icon name="arrow" />
             </span>
@@ -24,7 +24,12 @@
         <div class="mask-content-footer">
           <p class="mask-content-desc-text">{{ desc }}</p>
           <div class="mask-content-footer-btn">
-            <van-button type="primary" class="mask-footer-btn" size="small">
+            <van-button
+              type="primary"
+              class="mask-footer-btn"
+              size="small"
+              @click="onFooterBtnClick"
+            >
               {{ footerButtonText }}
             </van-button>
           </div>
@@ -46,7 +51,7 @@ export default {
   props: {
     title: {
       type: String,
-      default: '大会员专家版权益'
+      default: ''
     },
     bgImage: {
       type: String,
@@ -58,8 +63,7 @@ export default {
     },
     desc: {
       type: String,
-      default:
-        '根据区域、业务范围、客户类型帮助企业快速找到目标地区潜在业务需求客户及联系方式。'
+      default: ''
     },
     footerButtonText: {
       type: String,
@@ -80,7 +84,14 @@ export default {
     return {}
   },
   created() {},
-  methods: {}
+  methods: {
+    onHeaderActionClick() {
+      this.$emit('headerActionClick')
+    },
+    onFooterBtnClick() {
+      this.$emit('footerBtnClick')
+    }
+  }
 }
 </script>