Merge branch 'feat/group-buy' of git.quantgroup.cn:ui/group-buy-ui into feat/group-buy

src/views/goodsDetail/components/bottomNav.vue

@@ -42,10 +42,8 @@
   </div>
 </template>
 <script>
-import goodsCheckMixin from '@/mixins/goodsCheck.mixin';
 export default {
   name: 'BottomNav',
-  mixins: [goodsCheckMixin],
   props: {
     groupId: {
       type: Number,
@@ -83,9 +81,6 @@ export default {
     createOrJoin(mark) {
       // 参团
       // mark 1-> 开团  2-> 参团
-      if (this.checkLogin()) {
-        return;
-      }
       this.$emit('buy', mark);
     }
   }

src/views/goodsDetail/components/groupDescInfo.vue

@@ -21,7 +21,12 @@
       <!-- </template> -->
     </div>
     <div v-if="showButtonGroup" ref="buttonArea" class="button-area">
-      <cr-button v-if="groupInfo.groupBuyStatus == 1" block shape="circle" type="primary"
+      <cr-button
+        v-if="groupInfo.groupBuyStatus == 1"
+        block
+        shape="circle"
+        type="primary"
+        @click="share"
         >邀请好友</cr-button
       >
       <cr-button v-else plain block shape="circle" type="primary" @click="toList"
@@ -68,11 +73,13 @@ export default {
       if (this.$refs.buttonArea) {
         this.observer = new IntersectionObserver(entries => {
           entries.forEach(item => {
+            if (this.groupInfo.groupBuyStatus == 1) {
               if (item.intersectionRatio == 0) {
                 this.$emit('changeButtonVisible', true);
               } else {
                 this.$emit('changeButtonVisible', false);
               }
+            }
           });
         });
         this.observer.USE_MUTATION_OBSERVER = false;
@@ -87,11 +94,13 @@ export default {
   },
   methods: {
     toList() {
-      console.log(this.$route);
       const { activityId } = this.$route.query || '';
       if (activityId) {
         this.$router.push({ name: 'groupBuyList', query: { activityId } });
       }
+    },
+    share() {
+      this.$emit('share');
     }
   }
 };

src/views/goodsDetail/index.vue

@@ -263,7 +263,7 @@ export default {
     })
   },
   created() {
-    this.hasLogin = localStorage.get('vccToken') != 'null' ? true : false;
+    this.hasLogin = localStorage.get('vccToken') ? true : false;
     this.detailParam = { ...this.$route.query };
     localStorage.remove('orderData');
     localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id，用于下单

src/views/goodsDetail/smallPic.vue

@@ -65,6 +65,7 @@
             :timestemp="groupTimestemp"
             :show-button-group="true"
             @changeButtonVisible="changeButtonVisible"
+            @share="setShareData"
           />
           <successInfo :group-info="detailInfo.groupBuyInfo || {}" />
           <cr-divider
@@ -90,6 +91,7 @@
       </div>
     </div>
     <bottom-nav v-if="showButtonNav" :status="2" :disabled="false" @share="shareTo" />
+    <sharePic ref="sharePic" :share-pic-data="sharePicData" @outputPicUrl="outputPicUrl" />
   </div>
 </template>
 <script>
@@ -101,6 +103,7 @@ import successInfo from '@/components/groupBuySuccessInfo';
 import rules from '@/components/rules';
 import groupDescInfo from './components/groupDescInfo';
 import localStorage from '@/service/localStorage.service';
+import sharePic from '@/components/sharePic';
 export default {
   // eslint-disable-next-line vue/name-property-casing
   name: 'goodDetail',
@@ -110,7 +113,8 @@ export default {
     avatorGroup,
     successInfo,
     rules,
-    groupDescInfo
+    groupDescInfo,
+    sharePic
   },
   data() {
     return {
@@ -120,6 +124,9 @@ export default {
       inProgress: false, // 活动是否已经开始
       countDownText: '',
       stockPercentage: 0,
+      sharePicData: {}, // 生成海报图所需要的链接
+      shareInfo: {}, // 调用分享需要的参数
+      picUrl: '', // 海报url
       // 以下是原有的data
       detailParam: {
         skuNo: '',
@@ -129,13 +136,24 @@ export default {
       detailInfo: {},
       imgList: [],
       detailImgList: [], // 商品详情图像展示
-      hasLogin: false,
       name: {},
       showButtonNav: false // 是否显示底部按钮
     };
   },
+  computed: {
+    goodsShareInfo() {
+      return this.$store.state.pay.goodsShareInfo;
+    }
+  },
+  watch: {
+    goodsShareInfo: {
+      immediate: false,
+      handler(val) {
+        this.onShareEventChange(val);
+      }
+    }
+  },
   created() {
-    this.hasLogin = window.localStorage.getItem('vccToken') != 'null' ? true : false;
     this.detailParam = { ...this.$route.query };
     localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id，用于下单
     if (this.detailParam.groupBuyGroupId) {
@@ -159,8 +177,54 @@ export default {
     }, 5000);
   },
   methods: {
-    shareTo() {
-      // 分享
+    async onShareEventChange({ ev, nativeBridge }) {
+      if (ev === 'pic') {
+        // 处理图片url
+        nativeBridge.openNewUrl({
+          newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(this.picUrl))}`
+        });
+        this.$store.dispatch('goods_share_close');
+      }
+      if (ev === 'weixin') {
+        nativeBridge.run({
+          event: 'showShareView',
+          data: this.shareInfo
+        });
+      }
+    },
+    outputPicUrl(res) {
+      this.picUrl = res || '';
+      this.shareInfo = {
+        title: this.detailInfo.goodsName,
+        desc: '',
+        link: `${window.location.href}&groupBuyGroupId=${this.groupId}` || '', // 页面地址
+        imgUrl: this.detailInfo.thumbImageUrl, // 图片地
+        posterUrl: res || ''
+      };
+      this.$store.dispatch('goods_share_open', this.shareInfo);
+    },
+    setShareData() {
+      const avatorList = [];
+      this.detailInfo.groupBuyInfo.groupBuyValidUserInfoList.map(v => {
+        avatorList.push(v.avatar);
+      });
+      this.sharePicData = {
+        groupBuySuccessGuys: this.detailInfo?.groupBuyInfo.groupBuySuccessPersonCount,
+        salePrice: this.detailInfo.price, // y
+        groupBuyGroupId: this.groupId,
+        goodsSpecialId: this.detailParam.goodsSpecialId,
+        openGroupCnt: this.detailInfo?.groupBuyInfo.groupBuyLimitUserCount,
+        templateId: this.detailParam.templateId,
+        templateDetailId: this.detailParam.templateDetailId,
+        needGuys: this.detailInfo?.groupBuyInfo.groupBuyNeedUserCount,
+        skuName: this.detailInfo.goodsName, // y
+        activityId: this.detailParam.activityId,
+        skuImg: this.detailInfo.thumbImageUrl, // y,
+        activityPrice: this.detailInfo.activityPrice, // y
+        skuNo: this.detailParam.skuNo,
+        peoplePhotoList: avatorList
+      };
+      this.$refs.sharePic.createAndUploadPic();
     },
     changeButtonVisible(res) {
       this.showButtonNav = res;

src/views/pay/payResult.vue

@@ -76,6 +76,8 @@ import groupBuyApi from '@/api/groupBuy';
 import { isApp, isWxMp } from '@/service/validation.service';
 import { EventBus } from '@/service/utils.service';
 import sharePic from '@/components/sharePic';
+import qs from 'qs';
+import config from '@/config';
 export default {
   components: {
     // Goods,
@@ -98,6 +100,19 @@ export default {
       picUrl: ''
     };
   },
+  computed: {
+    goodsShareInfo() {
+      return this.$store.state.pay.goodsShareInfo;
+    }
+  },
+  watch: {
+    goodsShareInfo: {
+      immediate: false,
+      handler(val) {
+        this.onShareEventChange(val);
+      }
+    }
+  },
   created() {
     const { orderNo, reason, amount, freeAmount, payType } = this.$route.query;
     const { success } = this.$route.meta;
@@ -111,26 +126,45 @@ export default {
     this.payStatusName = success ? '支付成功' : '支付失败';
     this.getCouponList();
   },
-  mounted() {
-    const _this = this;
-    EventBus.$on('shareClickItem', async function({ ev, nativeBridge }) {
+  beforeDestroy() {
+    EventBus.$off('shareClickItem');
+  },
+  methods: {
+    async onShareEventChange({ ev, nativeBridge }) {
       if (ev === 'pic') {
         // 处理图片url
         nativeBridge.openNewUrl({
-          newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(_this.picUrl))}`
+          newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(this.picUrl))}`
         });
-        _this.$store.dispatch('goods_share_close');
+        this.$store.dispatch('goods_share_close');
       }
+      if (ev === 'weixin') {
+        nativeBridge.run({
+          event: 'showShareView',
+          data: this.shareInfo
         });
+      }
     },
-  beforeDestroy() {
-    EventBus.$off('shareClickItem');
-  },
-  methods: {
     outputPicUrl(res) {
       this.picUrl = res;
-      this.$store.dispatch('goods_share_open');
-      console.log(this.picUrl);
+      const linkPath = qs.stringify({
+        h: 0,
+        skuNo: this.sharePicData.skuNo,
+        groupBuyGroupId: this.sharePicData.groupBuyGroupId,
+        goodsSpecialId: this.sharePicData.goodsSpecialId,
+        activityId: this.sharePicData.activityId,
+        templateId: this.sharePicData.templateId,
+        templateDetailId: this.sharePicData.templateDetailId
+      });
+      let detailUrl = `${config.localHost}/groupBuy/skuInfo?${linkPath}`;
+      this.shareInfo = {
+        title: this.sharePicData.skuName,
+        desc: '',
+        link: detailUrl || '', // 页面地址
+        imgUrl: this.sharePicData.skuImg, // 图片地
+        posterUrl: res || ''
+      };
+      this.$store.dispatch('goods_share_open', this.shareInfo);
     },
     async setShareData() {
       const [res, error] = await groupBuyApi.getGroupShareInfo(this.orderNo);
@@ -140,16 +174,6 @@ export default {
       this.sharePicData = res;
       this.$refs.sharePic.createAndUploadPic();
     },
-    // goPay() {
-    //   this.$track?.registeredEvents('h5_RechargeResultPageClick', {
-    //     commodity_id: this.skuID,
-    //     order_number: this.orderNo,
-    //     pay_method: this.payMethodName,
-    //     pay_status: this.payStatusName,
-    //     buttons_name: '重新支付'
-    //   });
-    //   this.$router.replace({ name: 'pay', query: { orderNo: this.orderNo } });
-    // },
     goPage(type) {
       if (type == 1) {
         this.$router.replace({ path: '/orderList/0' });