feat: 增加详情页分享

src/views/goodsDetail/smallPic.vue

@@ -124,7 +124,8 @@ export default {
       inProgress: false, // 活动是否已经开始
       countDownText: '',
       stockPercentage: 0,
-      sharePicData: {},
+      sharePicData: {}, // 生成海报图所需要的链接
+      shareInfo: {}, // 调用分享需要的参数
       picUrl: '', // 海报url
       // 以下是原有的data
       detailParam: {
@@ -184,17 +185,23 @@ export default {
         });
         this.$store.dispatch('goods_share_close');
       }
+      if (ev === 'weixin') {
+        nativeBridge.run({
+          event: 'showShareView',
+          data: this.shareInfo
+        });
+      }
     },
     outputPicUrl(res) {
       this.picUrl = res || '';
-      const shareInfo = {
+      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', shareInfo);
+      this.$store.dispatch('goods_share_open', this.shareInfo);
     },
     setShareData() {
       const avatorList = [];
@@ -215,7 +222,7 @@ export default {
         skuImg: this.detailInfo.thumbImageUrl, // y,
         activityPrice: this.detailInfo.activityPrice, // y
         skuNo: this.detailParam.skuNo,
-        peoplePhotoList: ['https://img.lkbang.net/avator/default.png']
+        peoplePhotoList: avatorList
       };
       this.$refs.sharePic.createAndUploadPic();
     },

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');
       }
-    });
-  },
-  beforeDestroy() {
-    EventBus.$off('shareClickItem');
-  },
-  methods: {
+      if (ev === 'weixin') {
+        nativeBridge.run({
+          event: 'showShareView',
+          data: this.shareInfo
+        });
+      }
+    },
     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' });