feat: 根据各种状态判断商品详情的按钮展示

src/views/goodsDetail/components/bottomNav.vue

 <template>
   <div class="goods-bottom">
     <template v-if="status == 1">
-      <template v-if="groupId">
+      <template v-if="!groupId">
+        <cr-button
+          shape="circle"
+          :disabled="disabled"
+          type="primary"
+          block
+          @click="createOrJoin(1)"
+        >
+          立即开团
+        </cr-button>
+      </template>
+      <template v-else>
         <cr-button
           class="mutiplie"
           plain
@@ -11,7 +22,9 @@
           @click="createOrJoin(2)"
           >自己做团长</cr-button
         >
+        <!-- canJoinGroupBuyAgain -> 是否可以参团   groupBuyStatus 1->拼团中 -->
         <cr-button
+          v-if="info.canJoinGroupBuyAgain && info.groupBuyStatus == 1"
           class="mutiplie"
           shape="circle"
           :disabled="disabled"
@@ -22,22 +35,29 @@
           立即参团
         </cr-button>
       </template>
-      <template v-else>
-        <cr-button
-          shape="circle"
-          :disabled="disabled"
-          type="primary"
-          block
-          @click="createOrJoin(1)"
-        >
-          立即开团
-        </cr-button>
-      </template>
     </template>
     <template v-else>
-      <cr-button shape="circle" :disabled="disabled" type="primary" block @click="shareTo">
+      <cr-button
+        v-if="info.groupBuyStatus == 1 || info.groupBuyStatus == 0"
+        shape="circle"
+        :disabled="disabled"
+        type="primary"
+        block
+        @click="shareTo"
+      >
         邀请好友
       </cr-button>
+      <cr-button
+        v-else
+        shape="circle"
+        plain
+        :disabled="disabled"
+        type="primary"
+        block
+        @click="toList"
+      >
+        查看其他商品
+      </cr-button>
     </template>
   </div>
 </template>
@@ -74,6 +94,12 @@ export default {
     };
   },
   methods: {
+    toList() {
+      const { activityId } = this.$route.query || '';
+      if (activityId) {
+        this.$router.push({ name: 'groupBuyList', query: { activityId } });
+      }
+    },
     shareTo() {
       // 邀请好友
       this.$emit('share');

src/views/goodsDetail/components/groupDescInfo.vue

@@ -73,12 +73,10 @@ 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);
-              }
+            if (item.intersectionRatio == 0) {
+              this.$emit('changeButtonVisible', true);
+            } else {
+              this.$emit('changeButtonVisible', false);
             }
           });
         });

src/views/goodsDetail/index.vue

@@ -185,6 +185,7 @@
       type="shoppingCar"
       :disabled="false"
       :group-id="groupId"
+      :info="detailInfo.groupBuyInfo || {}"
       @buy="goVccOrDetail"
     />
   </div>
@@ -326,6 +327,11 @@ export default {
     },
     // ka渠道逻辑
     goVccOrDetail(res) {
+      if (!res) {
+        this.currentPopupType = '';
+        this.currentPopupName = '';
+        return;
+      }
       const buttonNameMap = {
         0: '立即参团',
         1: '立即开团',
@@ -373,15 +379,8 @@ export default {
     },
     async init(detailParam) {
       const [res] = await goods.detailInfo(detailParam);
+      // canJoinGroupBuyAgain  groupStatus
       try {
-        if (res.groupBuyInfo?.groupId) {
-          localStorage.set('groupBuyGroupId', res.groupBuyInfo.groupId || ''); // 设置groupBuyGroupId，用于下单
-          this.groupId = +res.groupBuyInfo.groupId || 0;
-        }
-        if (res.groupBuyInfo?.joinGroup) {
-          const query = { ...this.$route.query };
-          return this.$router.replace({ name: 'groupBuySkuInfoSmallPic', query });
-        }
         this.imgList = res.imageUrl || [];
         this.detailInfo = res;
         this.setStartStatus(res);

src/views/goodsDetail/smallPic.less

@@ -78,6 +78,7 @@
       box-sizing: border-box;
       font-size: 16px;
       padding: 0 @padding-sd 60px;
+      overflow: hidden;
   }
   // 头像组、团购规则等
   &-product-info{