Merge branch 'yuan' of panhui/lasuo_nft_front into dev

src/components/product/productLarge.vue

@@ -21,14 +21,20 @@
             <!-- 即将售罄 -->
             <div class="shop_sold_out_two" v-else-if="isSold">即将售罄</div>
             <!-- <img :src="getImg(changeImgs(info.pic, 600))" alt="" class="commodity_map" /> -->
-            <van-image width="100%" height="calc(100vw - 30px)" :radius="30" :src="getImg(changeImgs(info.pic))" fit="cover"/>
+            <van-image
+                width="100%"
+                height="calc(100vw - 30px)"
+                :radius="30"
+                :src="getImg(changeImgs(info.pic))"
+                fit="cover"
+            />
             <div class="shop_title">
                 <div>{{ info.name }}</div>
                 <img v-if="!!info.model3d" :src="require('@assets/3d@3x.png')" alt="" class="shop_title_img" />
             </div>
             <div class="shop_number">
                 <div class="shop_number_con" v-if="info.collectionCategory">
-                    <span>{{info.collectionCategory}}</span>
+                    <span>{{ info.collectionCategory }}</span>
                 </div>
                 <div class="limit">
                     <span>限量</span>
@@ -47,17 +53,15 @@
                     <div class="shop_bottom_left_name">{{ info.minter }}</div>
                 </div>
                 <div class="shop_bottom_right" v-if="info.salable">
-                        <div class="shop_bottom_right_con">￥</div>
-                        <div class="shop_bottom_right_price">{{ info.price }}</div>
-                </div>
-                <div class="shop_bottom_right_price" v-else>
-                    仅展示
+                    <div class="shop_bottom_right_con">￥</div>
+                    <div class="shop_bottom_right_price">{{ info.price }}</div>
                 </div>
+                <div class="shop_bottom_right_price" v-else>仅展示</div>
                 <!-- <div class="shop_bottom_right">
                     <div class="shop_bottom_right_title">仅展示</div>
                 </div> -->
             </div>
-            <img :src="require('@assets/dibuwenli.png')" alt="" class="bottom_texture">
+            <img :src="require('@assets/dibuwenli.png')" alt="" class="bottom_texture" />
         </div>
     </router-link>
 </template>
@@ -80,23 +84,50 @@ export default {
     },
     computed: {
         time() {
-            if (this.info.purchaseTime) {
-                if (this.dayjs().isSameOrBefore(this.info.purchaseTime, 'YYYY-MM-DD HH:mm:ss')) {
-                    return this.dayjs(this.info.purchaseTime).format('MM月DD日HH:mm');
+            if (this.info.hasSubscribe) {
+                if (this.info.purchaseTime) {
+                    if (this.dayjs().isSameOrBefore(this.info.purchaseTime, 'YYYY-MM-DD HH:mm:ss')) {
+                        return this.dayjs(this.info.purchaseTime).format('MM月DD日HH:mm');
+                    }
                 }
+                return '';
+            } else {
+                if (this.info.startTime && !this.isSolded && !this.isSold) {
+                    if (this.dayjs().isSameOrBefore(this.info.startTime, 'YYYY-MM-DD HH:mm:ss')) {
+                        return this.dayjs(this.info.startTime).format('MM月DD日HH:mm');
+                    }
+                }
+                return '';
             }
-
-            return '';
         }
+        // isSolded() {
+        //     return this.info && !this.info.noSoldOut && this.info.salable && this.info.source === 'OFFICIAL';
+        // },
+        // isSold() {
+        //     return this.info && this.info.soldOut && this.info.salable;
+        // }
     },
     mounted() {
-        if (this.info.purchaseTime) {
-            var x = this.dayjs(this.info.purchaseTime, 'YYYY-MM-DD HH:mm:ss');
-            var y = this.dayjs();
-            let d = this.dayjs.duration(x.diff(y));
-            let day = parseInt(d.asDays());
-            if (day <= 0) {
-                this.getTime(this.info.purchaseTime);
+        console.log(this.isSolded);
+        if (this.info.hasSubscribe) {
+            if (this.info.purchaseTime) {
+                var x = this.dayjs(this.info.purchaseTime, 'YYYY-MM-DD HH:mm:ss');
+                var y = this.dayjs();
+                let d = this.dayjs.duration(x.diff(y));
+                let day = parseInt(d.asDays());
+                if (day <= 0) {
+                    this.getTime(this.info.purchaseTime);
+                }
+            }
+        } else {
+            if (this.info.startTime && !this.isSolded && !this.isSold) {
+                var x1 = this.dayjs(this.info.startTime, 'YYYY-MM-DD HH:mm:ss');
+                var y1 = this.dayjs();
+                let d1 = this.dayjs.duration(x1.diff(y1));
+                let day = parseInt(d1.asDays());
+                if (day <= 0) {
+                    this.getTime(this.info.startTime);
+                }
             }
         }
     },
@@ -134,14 +165,14 @@ export default {
     border-radius: 30px;
     margin-bottom: 15px;
     position: relative;
-    .bottom_texture{
+    .bottom_texture {
         width: 196px;
         height: 140px;
         position: absolute;
         right: 0;
         bottom: 0;
     }
-    /deep/ .van-image__img{
+    /deep/ .van-image__img {
         position: relative;
         z-index: 11;
     }
@@ -320,7 +351,7 @@ export default {
                 font-size: 16px;
                 font-family: PingFangSC-Medium, PingFang SC;
                 font-weight: 600;
-                color: #FFFFFF;
+                color: #ffffff;
                 line-height: 22px;
                 margin-top: 4px;
                 // position: absolute;
@@ -334,22 +365,22 @@ export default {
                 color: #ffffff;
                 line-height: 28px;
             }
-            .shop_bottom_right_title{
+            .shop_bottom_right_title {
                 margin-top: 9px;
                 font-size: 14px;
                 font-family: PingFangSC-Medium, PingFang SC;
                 font-weight: 500;
-                color: #FFFFFF;
+                color: #ffffff;
                 line-height: 16px;
             }
         }
         .shop_bottom_right_price {
-                font-size: 16px;
-                font-family: PingFangSC-Medium, PingFang SC;
-                font-weight: 600;
-                color: #ffffff;
-                line-height: 28px;
-            }
+            font-size: 16px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 600;
+            color: #ffffff;
+            line-height: 28px;
+        }
     }
 }
 </style>

src/mixins/product.js

@@ -180,7 +180,11 @@ export default {
         },
         updateTime() {
             if (this.startTime) {
-                this.getTime(this.info.purchaseTime);
+                if(this.info.hasSubscribe){
+                    this.getTime(this.info.purchaseTime);
+                }else{
+                    this.getTime(this.info.startTime);
+                }  
             }
         }
     },

src/views/product/Detail.vue

@@ -309,19 +309,27 @@
                 <div class="list_of_details_one_title">
                     <div class="list_of_details_one_title_one">
                         <div class="list_of_details_one_title_one_con">
-                        <img :src="require('@assets/zuo@3x.png')" alt="" class="list_of_details_one_title_img list_of_details_one_title_img_left" />
-                        <div>
-                            <div class="list_of_details_one_title_con">{{ infoName }}</div>
-                            <div class="limited_label">
-                                <div class="limited_label_title" v-if="info.collectionCategory">
-                                    {{ info.collectionCategory  }}
+                            <img
+                                :src="require('@assets/zuo@3x.png')"
+                                alt=""
+                                class="list_of_details_one_title_img list_of_details_one_title_img_left"
+                            />
+                            <div>
+                                <div class="list_of_details_one_title_con">{{ infoName }}</div>
+                                <div class="limited_label">
+                                    <div class="limited_label_title" v-if="info.collectionCategory">
+                                        {{ info.collectionCategory }}
+                                    </div>
+                                    <div class="limited_label_number">限量</div>
+                                    <div class="limited_label_total">{{ info.total }}份</div>
+                                    <div class="limited_label_category">{{ info.category }}</div>
                                 </div>
-                                <div class="limited_label_number">限量</div>
-                                <div class="limited_label_total">{{ info.total }}份</div>
-                                <div class="limited_label_category">{{ info.category }}</div>
                             </div>
-                        </div>
-                        <img :src="require('@assets/you@3x.png')" alt="" class="list_of_details_one_title_img list_of_details_one_title_img_right" />
+                            <img
+                                :src="require('@assets/you@3x.png')"
+                                alt=""
+                                class="list_of_details_one_title_img list_of_details_one_title_img_right"
+                            />
                         </div>
                     </div>
                     <!-- <img :src="require('@assets/maisui.png')" alt="" class="list_of_details_one_title_img" /> -->
@@ -632,7 +640,11 @@
                     <div v-else class="sold_out">已售罄</div>
                 </div>
                 <div v-else-if="!info.hasSubscribe && !isSolded && !isSold">
-                    <div class="buy_now" @click="buyNow">
+                    <div class="coming_on_sale" v-if="isAppointment" block round>
+                        <div class="coming_on_sale_con">即将开售</div>
+                        <div class="coming_on_sale_time">{{ startTime }}</div>
+                    </div>
+                    <div class="buy_now" @click="buyNow" v-else>
                         <!-- 立即购买 -->
                         <div class="buy_now_con">购买</div>
                         <div class="buy_now_tip">
@@ -700,7 +712,7 @@ export default {
     components: {
         // HashCode,
         // ProductTitle,
-        ProductBanner,
+        ProductBanner
         // HashCode
         // HashCode
         // Swiper,
@@ -771,13 +783,13 @@ export default {
         },
         infoName() {
             if (this.info.name) {
-                if(this.info.name.length > 10){
+                if (this.info.name.length > 10) {
                     return this.info.name.slice(0, 10) + '...';
-                }else{
-                    return this.info.name
+                } else {
+                    return this.info.name;
                 }
             } else {
-                return ''
+                return '';
             }
         },
         appointmentStartOne() {
@@ -963,7 +975,7 @@ export default {
                 });
             }
         },
-        collectionSoldOut(){
+        collectionSoldOut() {
             if (!this.isLogin) {
                 this.checkLogin();
                 return;
@@ -1303,7 +1315,7 @@ export default {
                     display: flex;
                     justify-content: center;
                 }
-                .list_of_details_one_title_one_con{
+                .list_of_details_one_title_one_con {
                     position: relative;
                     display: flex;
                 }
@@ -1311,11 +1323,11 @@ export default {
                     width: 56px;
                     height: 56px;
                 }
-                .list_of_details_one_title_img_left{
+                .list_of_details_one_title_img_left {
                     position: absolute;
                     left: -60px;
                 }
-                .list_of_details_one_title_img_right{
+                .list_of_details_one_title_img_right {
                     position: absolute;
                     right: -60px;
                 }
@@ -1647,7 +1659,7 @@ export default {
                 line-height: 18px;
                 letter-spacing: 1px;
                 opacity: 0.5;
-            } 
+            }
         }
     }
     .detail_content_con {
@@ -2103,7 +2115,7 @@ export default {
         .transaction_button_right {
             // padding-top: 10px;
             box-sizing: border-box;
-            .collection_sold_out{
+            .collection_sold_out {
                 width: 160px;
                 height: 46px;
                 background: #f9ddb3;