feat: 增加分享测试页面

src/components/avatorGroup.vue

 <template>
   <div class="avator-group">
-    <div v-for="(item, index) in avators" :key="index" class="avator-item" :style="widthStyle">
-      <cr-image class="avator-img" :class="{ avator: index == 0 }" width="" height="" :src="item" />
-      <div v-if="index == 0" class="is-leader">
+    <div
+      v-for="(item, index) in avators.slice(0, 9)"
+      :key="index"
+      class="avator-item"
+      :style="widthStyle"
+    >
+      <cr-image
+        class="avator-img"
+        :class="{ avator: index == 0 }"
+        width=""
+        height=""
+        :src="item.avatar"
+      />
+      <div v-if="item.userTag && item.userTag == '团长'" class="is-leader">
         <cr-image class="crown" width="" height="" src="@/assets/images/leaderIcon.png" />
       </div>
-      <div v-if="index == 0" class="leader-name">
+      <div v-if="item.userTag && item.userTag == '团长'" class="leader-name">
         <cr-image
           class="leader-name-icon"
           height=""
@@ -13,14 +24,14 @@
           src="@/assets/images/leader-name.png"
         />
       </div>
-      <div v-else class="is-new">
+      <div v-if="item.userTag && item.userTag.toLowerCase() == 'new'" class="is-new">
         <cr-image width="25px" src="@/assets/images/new-user.png" />
       </div>
     </div>
     <div v-if="avators.length < 10" class="placeholder" :style="widthStyle">
       <div class="content">?</div>
     </div>
-    <div class="more" :style="widthStyle" @click="showMoreAvator">
+    <div v-if="avators.length > 9" class="more" :style="widthStyle" @click="showMoreAvator">
       <div class="content" />
     </div>
     <cr-dialog v-model="showDialogSlot" confirm-button-text="知道了" confirm-button-color="#ec1500">
@@ -38,12 +49,12 @@
             class="avator-img"
             width=""
             height=""
-            :src="item"
+            :src="item.avatar"
           />
-          <div v-if="index == 0" class="is-leader">
+          <div v-if="item.userTag && item.userTag == '团长'" class="is-leader">
             <cr-image class="crown" width="" height="" src="@/assets/images/leaderIcon.png" />
           </div>
-          <div v-if="index == 0" class="leader-name">
+          <div v-if="item.userTag && item.userTag == '团长'" class="leader-name">
             <cr-image
               class="leader-name-icon"
               height=""
@@ -80,13 +91,7 @@ export default {
     }
   },
   created() {
-    if (this.groupInfo.groupBuyAllUserInfoList) {
-      this.avators = this.groupInfo.groupBuyAllUserInfoList.map(v => {
-        return v.avatar;
-      });
-    } else {
-      this.avators = [];
-    }
+    this.avators = this.groupInfo.groupBuyAllUserInfoList || [];
   },
   methods: {
     showMoreAvator() {

src/router/routes.js

@@ -13,6 +13,14 @@ export default [
     },
     component: () => import('../components/error')
   },
+  {
+    path: '/share-test',
+    name: 'share-test',
+    meta: {
+      title: '出错了'
+    },
+    component: () => import('../views/test/share-test.vue')
+  },
   {
     path: '*',
     name: 'notFound',

src/views/goodsDetail/smallPic.vue

@@ -43,15 +43,17 @@
         <div class="goods-group-info-status">
           <cr-image width="80" src="../../assets/images/success.png" />
         </div>
-        <avatorGroup />
-        <group-desc-info :show-button-group="true" @changeButtonVisible="changeButtonVisible" />
-        <successInfo />
-        <cr-divider
-          hairline
-          :style="{
-            borderColor: '#ECECEC'
-          }"
-        />
+        <template v-if="inProgress == 1">
+          <avatorGroup :group-info="detailInfo.groupBuyInfo || {}" />
+          <group-desc-info :group-info="detailInfo.groupBuyInfo || {}" :timestemp="timestemp" />
+          <successInfo :group-info="detailInfo.groupBuyInfo || {}" />
+          <cr-divider
+            hairline
+            :style="{
+              borderColor: '#ECECEC'
+            }"
+          />
+        </template>
         <rules />
       </div>
       <span v-if="detailImgList.length" id="goodDetail" class="goods-divider">宝贝详情</span>
@@ -92,7 +94,10 @@ export default {
   data() {
     return {
       endTime: 1631203200000,
+      timestemp: '',
       showInfo: false,
+      inProgress: false, // 活动是否已经开始
+      countDownText: '',
       // 以下是原有的data
       detailParam: {
         skuNo: '',
@@ -138,6 +143,7 @@ export default {
       const [res] = await goods.detailInfo(detailParam);
       this.imgList = res.imageUrl || [];
       this.detailInfo = res;
+      this.setStartStatus(res);
       try {
         const detailImages = await goods.getDetailPic(this.detailInfo.contentDetailUrl);
         // const imgReg = new RegExp('(?<=src=").[^"]*', 'g');
@@ -155,6 +161,30 @@ export default {
       } catch (error) {
         console.error(error);
       }
+    },
+    setStartStatus(data) {
+      const currentTime = new Date(data.currentTime).getTime();
+      const activityStartTime = new Date(data.startTime).getTime();
+      const activityEndTime = new Date(data.endTime).getTime();
+      if (currentTime <= activityStartTime) {
+        // 当前时间小于活动开始时间
+        this.timestemp = activityStartTime;
+        this.countDownText = '距活动开始时间';
+        this.inProgress = -1;
+        return;
+      }
+      if (currentTime >= activityEndTime) {
+        this.timestemp = 0;
+        this.countDownText = '活动已结束';
+        this.inProgress = 0;
+        return;
+      }
+      if (currentTime > activityStartTime && currentTime < activityEndTime) {
+        this.timestemp = activityEndTime;
+        this.countDownText = '距成团结束';
+        this.inProgress = 1;
+        return;
+      }
     }
   }
 };

src/views/test/share-test.vue

+<template>
+  <button style="width: 80%; height: 35px; background:#f00" @click="share">分享</button>
+</template>
+<script>
+import Bridge from '@qg/js-bridge';
+export default {
+  methods: {
+    share() {
+      const nativeBridge = new Bridge();
+      const data = {
+        event: 'showShareView',
+        data: {
+          platform: ['weChat', 'timeLine', 'QQ', 'QQZone', 'CopyLink', 'GeneratePoster'], //依次分别是微信、朋友圈、QQ好友、QQ空间、复制链接
+          shareDic: {
+            title: 'aaaa',
+            desc: 'bbbb',
+            link: `https://www.baidu.com`, // 页面地址
+            imgUrl: 'http://kdspstatic.q-gp.com/FnPUaThQoK23qZjhXTG9C8XopI4y' // 图片地址
+          }
+        }
+      };
+      nativeBridge.showShareView(data);
+    }
+  }
+};
+</script>