.

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

@@ -94,59 +94,72 @@
             <div class="top">
                 <div class="top1">
                     <div class="text1">类型</div>
-                    <div class="text2">{{ info.category || '暂无' }}</div>
+                    <div v-if="info.category" class="text2">{{ info.category }}</div>
+                    <div v-else class="text5">铸造者未设置</div>
                 </div>
-                <div class="top1" @click="Whisper" v-if="init2">
+                <div class="top1" @click="Whisper">
                     <div class="text1">悄悄话</div>
-                    <div class="text2 text3" :class="{ prim: init2.opened }">
+                    <div class="text2 text3" v-if="init2" :class="{ prim: init2.opened }">
                         <img v-if="!init2.opened" class="img" :src="init2.icon[0]" alt="" />
                         <img v-if="init2.opened" class="img" :src="init2.icon[2]" alt="" />
                         <div class="text4" :class="{ prim: init2.opened }">
                             {{ init2.opened ? '已打开' : '未打开' }}
                         </div>
                     </div>
+                    <div class="text5" v-else>铸造者未设置</div>
                 </div>
             </div>
-            <div v-if="privileges.length > 0">
-                <div class="page-title">持有特权<span>（灰色表示已使用）</span></div>
-                <div class="prive">
-                    <div v-for="(item, index) in init" :key="index">
-                        <div class="prive1" :class="{ prim: item.opened }">
-                            <img v-if="!item.opened" class="img" :src="item.icon[0]" alt="" />
-                            <div v-if="item.icon[2]">
-                                <img v-if="item.opened" class="img" :src="item.icon[2]" alt="" />
-                            </div>
-                            <!-- <img class="img" v-else :src="item.icon[0]" alt="" /> -->
+            <div class="page-title">持有特权<span>（灰色表示已使用）</span></div>
+            <div class="prive" v-if="privileges.length > 0">
+                <div v-for="(item, index) in init" :key="index">
+                    <div class="prive1" :class="{ prim: item.opened }">
+                        <img v-if="!item.opened" class="img" :src="item.icon[0]" alt="" />
+                        <div v-if="item.icon[2]">
+                            <img v-if="item.opened" class="img" :src="item.icon[2]" alt="" />
+                        </div>
+                        <!-- <img class="img" v-else :src="item.icon[0]" alt="" /> -->
 
-                            <div v-if="item.once" @click="privilegeFn2(item)" class="prive2">
-                                {{ item.name }}
-                            </div>
-                            <div v-else @click="privilegeFn(item)" class="prive2">
-                                {{ item.name }}
-                            </div>
+                        <div v-if="item.once" @click="privilegeFn2(item)" class="prive2">
+                            {{ item.name }}
+                        </div>
+                        <div v-else @click="privilegeFn(item)" class="prive2">
+                            {{ item.name }}
                         </div>
                     </div>
                 </div>
             </div>
-            <template v-if="properties.length > 0">
-                <div class="page-title">商品特性</div>
-                <div class="specific-list">
-                    <div class="specific-item" v-for="(item, index) in properties" :key="index">
-                        <div class="text1">{{ item.name }}</div>
-                        <div class="text2">{{ item.value }}</div>
+            <div v-if="privileges.length === 0" class="conName">铸造者未设置</div>
+            <div class="goods">
+                <div class="goods-info">
+                    <div class="page-title">商品特性</div>
+                    <div class="specific-list" v-if="properties.length > 0">
+                        <div class="specific-item" v-for="(item, index) in properties" :key="index">
+                            <div class="text1">{{ item.name }}</div>
+                            <div class="text2">{{ item.value }}</div>
+                        </div>
+                    </div>
+                    <div v-else class="textName">铸造者未设置</div>
+                </div>
+                <div class="goods-info">
+                    <div class="page-title">链上信息</div>
+                    <div class="page-text" v-if="info.txHash || info.blockNumber || info.tokenId">
+                        Hash地址：{{ info.txHash }}<br />
+                        区块高度： {{ info.blockNumber }}<br />
+                        令牌ID： {{ info.tokenId }}
                     </div>
+                    <div v-else class="textName">铸造者未设置</div>
+                </div>
+                <div class="goods-info">
+                    <div class="page-title">作品描述</div>
+                    <div v-if="info.detail" class="page-text page-detail" v-html="info.detail"></div>
+                    <div v-else class="textName">铸造者未设置</div>
                 </div>
-            </template>
-            <div class="page-title">链上信息</div>
-            <div class="page-text">
-                Hash地址：{{ info.txHash }}<br />
-                区块高度： {{ info.blockNumber }}<br />
-                令牌ID： {{ info.tokenId }}
             </div>
-            <template v-if="info.detail">
+
+            <!-- <template v-if="info.detail">
                 <div class="page-title">作品描述</div>
                 <div class="page-text" v-html="info.detail"></div>
-            </template>
+            </template> -->
         </div>
 
         <!-- <div class="btn van-safe-area-bottom" ref="btn" v-if="isBuy">
@@ -590,6 +603,13 @@ export default {
 .detail {
     padding-bottom: 100px;
 }
+.conName {
+    font-size: @font2;
+    font-weight: 400;
+    color: #939599;
+    line-height: 24px;
+    padding: 10px 0 0 16px;
+}
 .content {
     padding: 0px 16px;
     display: flex;
@@ -630,6 +650,14 @@ export default {
                 line-height: 24px;
                 margin-left: 156px;
             }
+            .text5 {
+                font-size: @font2;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: 400;
+                color: #939599;
+                line-height: 24px;
+                padding-left: 10px;
+            }
         }
     }
 }
@@ -911,14 +939,28 @@ export default {
         margin-bottom: 6px;
     }
 }
+.textName {
+    font-size: @font2;
+    font-weight: 400;
+    color: #939599;
+    line-height: 24px;
+    // padding-top: 10px;
+    padding: 10px 0 0 16px;
+}
 .goods {
     // padding: 20px 16px;
 
     .page-title {
+        font-size: @font2;
+        font-weight: bold;
+        color: #ffffff;
+        line-height: 24px;
+        margin-top: 14px;
         &:not(:first-child) {
             padding-top: 16px;
         }
     }
+
     span {
         font-size: 14px;
         font-weight: 400;
@@ -934,7 +976,7 @@ export default {
             display: flex;
             align-items: center;
             .text1 {
-                font-size: 18px;
+                font-size: @font2;
                 font-weight: bold;
                 color: #ffffff;
                 line-height: 28px;

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

@@ -107,11 +107,60 @@
         </van-cell>
 
         <driver />
-
+        <div class="top">
+            <div class="top1">
+                <div class="text1">类型</div>
+                <div v-if="info.category" class="text2">{{ info.category }}</div>
+                <div v-else class="text5">铸造者未设置</div>
+            </div>
+            <div class="top1">
+                <div class="text1">悄悄话</div>
+                <div class="text2 text3" v-if="init2">
+                    <img class="img" :src="init2.icon[0]" alt="" />
+                    <div class="text4" :class="{ prim: init2.opened }">
+                        {{ init2.opened ? '已打开' : '未打开' }}
+                    </div>
+                </div>
+                <div class="text5" v-else>铸造者未设置</div>
+            </div>
+        </div>
+        <div class="titleIcon">持有特权<span>（灰色表示已使用）</span></div>
+        <div class="prive">
+            <div v-if="init">
+                <div v-for="(item, index) in init" :key="index">
+                    <div class="prive1">
+                        <img class="img" :src="item.icon[0]" alt="" />
+                        <div class="prive2">{{ item.name }}</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div v-if="!init" class="conName">铸造者未设置</div>
+        <div class="conName" v-else>铸造者未设置</div>
+        <!-- </template> -->
         <div class="goods">
-            <div class="goods-info" v-if="boxs.length > 0">
+            <div class="goods-info">
+                <div class="page-title">商品特性</div>
+                <div class="specific-list" v-if="properties.length > 0">
+                    <div class="specific-item" v-for="(item, index) in properties" :key="index">
+                        <div class="text1">{{ item.name }}</div>
+                        <div class="text2">{{ item.value }}</div>
+                    </div>
+                </div>
+                <div v-else class="textName">铸造者未设置</div>
+            </div>
+            <div class="goods-info">
+                <div class="page-title">链上信息</div>
+                <div class="page-text" v-if="info.txHash || info.blockNumber || info.tokenId">
+                    Hash地址：{{ info.txHash }}<br />
+                    区块高度： {{ info.blockNumber }}<br />
+                    令牌ID： {{ info.tokenId }}
+                </div>
+                <div v-else class="textName">铸造者未设置</div>
+            </div>
+            <div class="goods-info">
                 <div class="page-title">盲盒详情</div>
-                <swiper :slidesPerView="'auto'" :spaceBetween="20" class="detail-swiper">
+                <swiper v-if="boxs.length > 0" :slidesPerView="'auto'" :spaceBetween="20" class="detail-swiper">
                     <swiper-slide v-for="(item, index) in boxs" :key="index">
                         <van-image
                             width="100%"
@@ -123,19 +172,13 @@
                         />
                     </swiper-slide>
                 </swiper>
+                <div v-else class="textName">铸造者未设置</div>
             </div>
-            <div class="goods-info" v-if="properties.length > 0">
-                <div class="page-title">商品特性</div>
-                <div class="specific-list">
-                    <div class="specific-item" v-for="(item, index) in properties" :key="index">
-                        <div class="text1">{{ item.name }}</div>
-                        <div class="text2">{{ item.value }}</div>
-                    </div>
-                </div>
-            </div>
-            <div class="goods-info" v-if="info.detail">
+
+            <div class="goods-info">
                 <div class="page-title">作品描述</div>
-                <div class="page-text page-detail" v-html="info.detail"></div>
+                <div v-if="info.detail" class="page-text page-detail" v-html="info.detail"></div>
+                <div v-else class="textName">铸造者未设置</div>
             </div>
         </div>
         <div class="btn van-safe-area-bottom" v-if="info.isAppointment">
@@ -197,7 +240,9 @@ export default {
             info: {},
             liked: false,
             btn: null,
-            blindBoxItems: []
+            blindBoxItems: [],
+            init: [],
+            init2: null
         };
     },
     computed: {
@@ -254,6 +299,16 @@ export default {
                 .get('/collection/get/' + this.$route.query.id)
                 .then(res => {
                     this.info = res;
+                    if (res.privileges) {
+                        this.init2 = res.privileges.find(item => {
+                            return item.name === '悄悄话';
+                        });
+                    }
+                    if (res.privileges) {
+                        this.init = res.privileges.filter(item => {
+                            return item.name !== '悄悄话';
+                        });
+                    }
                     this.getTime(res.startTime);
                     this.$nextTick(() => {
                         if (this.isBuy) {
@@ -316,6 +371,36 @@ export default {
 .detail {
     padding-bottom: 100px;
 }
+.prive {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    flex-wrap: wrap;
+    .prive1 {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin: 16px 15px 0;
+        width: 94px;
+        height: 32px;
+        color: #000;
+        background: linear-gradient(48deg, #fdfb60 0%, #ff8f3e 100%);
+        border-radius: 4px;
+        &.prim {
+            background: #202122;
+            color: @text3;
+        }
+        .img {
+            text-align: center;
+            width: 18px;
+            height: 18px;
+            margin-right: 4px;
+        }
+        .prive2 {
+            text-align: center;
+        }
+    }
+}
 .info {
     // height: 164px;
     background-color: @bg;
@@ -444,6 +529,81 @@ export default {
         font-size: @font2;
     }
 }
+.conName {
+    font-size: @font2;
+    font-weight: 400;
+    color: #939599;
+    line-height: 24px;
+    padding: 10px 0 0 16px;
+}
+.titleIcon {
+    font-size: @font2;
+    font-weight: bold;
+    color: #ffffff;
+    line-height: 24px;
+    padding: 30px 0 0 16px;
+}
+span {
+    font-size: @font2;
+    font-weight: 400;
+    color: #939599;
+    line-height: 24px;
+}
+.top {
+    padding: 20px 16px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .top1 {
+        display: flex;
+        align-items: center;
+        .text1 {
+            font-size: @font2;
+            font-weight: bold;
+            color: #ffffff;
+            line-height: 28px;
+        }
+        .text2 {
+            width: 94px;
+            height: 32px;
+            border: 1px solid yellow;
+            border-radius: 4px;
+            margin-left: 14px;
+            line-height: 32px;
+            text-align: center;
+            color: #ffffff;
+            &.text3 {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+            }
+            .img {
+                width: 18px;
+                height: 18px;
+                margin-right: 4px;
+            }
+            &.prim {
+                color: @text3;
+                border: 1px solid #303133;
+                background: #202122;
+            }
+        }
+        .text4 {
+            color: #fdfb60;
+            &.prim {
+                color: @text3;
+            }
+        }
+        .text5 {
+            font-size: @font2;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #939599;
+            line-height: 24px;
+            padding-left: 10px;
+        }
+    }
+}
 .buy {
     width: 100%;
     display: block;
@@ -493,18 +653,16 @@ export default {
     padding: 20px 16px;
 
     .page-title {
+        font-size: @font2;
+        font-weight: bold;
+        color: #ffffff;
+        line-height: 24px;
         &:not(:first-child) {
             padding-top: 16px;
         }
     }
 }
 
-.page-title {
-    font-size: @font2;
-    font-weight: bold;
-    color: #ffffff;
-    line-height: 28px;
-}
 .specific-list {
     padding: 10px 0 0;
     display: flex;
@@ -512,6 +670,13 @@ export default {
     justify-content: space-between;
     overflow-x: auto;
 }
+.textName {
+    font-size: @font2;
+    font-weight: 400;
+    color: #939599;
+    line-height: 24px;
+    padding-top: 10px;
+}
 .specific-item {
     // width: 94px;
     // height: 62px;

src/main/pc-space/src/views/AssetDetail.vue

@@ -178,15 +178,18 @@
                     <div class="del" v-else>铸造者未设置</div>
                     <!-- </div> -->
                 </div>
-                <div style="margin-top: 30px" v-if="properties.length != 0">
+                <div style="margin-top: 30px">
                     <div class="time">
                         <div class="time1">商品特性</div>
                     </div>
                     <div class="card">
-                        <div class="box1" v-for="(item, index) in properties" :key="index">
-                            <div class="box2">{{ item.name }}</div>
-                            <div class="box3">{{ item.value }}</div>
+                        <div v-if="properties.length != 0">
+                            <div class="box1" v-for="(item, index) in properties" :key="index">
+                                <div class="box2">{{ item.name }}</div>
+                                <div class="box3">{{ item.value }}</div>
+                            </div>
                         </div>
+                        <div class="del" v-else>暂无设置特性</div>
                     </div>
                 </div>
             </div>
@@ -915,6 +918,14 @@ export default {
                 cursor: pointer;
             }
         }
+        .del {
+            font-size: 14px;
+            width: 220px;
+            font-weight: 400;
+            color: #939599;
+            line-height: 24px;
+            padding-left: 22px;
+        }
         .init1 {
             display: flex;
             align-items: center;
@@ -939,14 +950,7 @@ export default {
             .box {
                 width: 218px;
             }
-            .del {
-                font-size: 14px;
-                width: 220px;
-                font-weight: 400;
-                color: #939599;
-                line-height: 24px;
-                padding-left: 22px;
-            }
+
             .img {
                 width: 24px;
                 height: 24px;