倒计时

src/main/nine-space/src/mixins/product.js

@@ -46,7 +46,8 @@ export default {
                 本期推荐: 'soldOut;sale,desc;sort,desc',
                 最HOT收藏品: 'soldOut;likes,desc;sort,desc;createdAt,desc',
                 更多藏品: 'soldOut;source,asc;sale,desc;likes,desc'
-            }
+            },
+            timer: null
         };
     },
     computed: {
@@ -96,9 +97,21 @@ export default {
                 str += day + '天 ';
             }
             this.startTime = str + dayjs.duration(x.diff(y)).format('HH:mm:ss');
-            setTimeout(() => {
-                this.getTime(startTime);
-            }, 1000);
+
+            if (this.timer) {
+                clearTimeout(this.timer);
+                this.timer = null;
+            }
+            if (!dayjs().isBefore(dayjs(startTime))) {
+                if (this.getProduct) {
+                    this.getProduct();
+                }
+                this.startTime = '';
+            } else {
+                this.timer = setTimeout(() => {
+                    this.getTime(startTime);
+                }, 1000);
+            }
         },
         getShort(str = '') {
             if (str) {

src/main/nine-space/src/views/product/Detail.vue

@@ -206,8 +206,30 @@
                 </van-button>
             </div>
         </div> -->
-
-        <div class="btn van-safe-area-bottom" ref="btn" v-if="info.salable">
+        <div class="btn van-safe-area-bottom" ref="btn" v-if="info.scheduleSale && !info.salable">
+            <div class="btn-list">
+                <div class="price-content">
+                    <div class="price">
+                        <img src="@assets/jiage_huang.png" alt="" />
+                        {{ info.price }}
+                    </div>
+                    <div class="price-sub" v-if="info.originalPrice">¥{{ info.originalPrice || 0 }}</div>
+                    <div class="sub" v-if="info.royalties">
+                        含 <span>{{ info.royalties }}%</span> 版税
+                    </div>
+                </div>
+                <div class="flex1"></div>
+                <div class="btns">
+                    <van-button class="no-btn" v-if="isAppointment" block round>
+                        <div class="appoint">
+                            <span>即将开售</span>
+                            <span>{{ startTime }}</span>
+                        </div>
+                    </van-button>
+                </div>
+            </div>
+        </div>
+        <div class="btn van-safe-area-bottom" ref="btn" v-else-if="info.salable">
             <div class="btn-list">
                 <div class="price-content">
                     <div class="price">