收藏列表

src/main/nine-space/src/components/PageTitle.vue

@@ -1,16 +1,10 @@
 <template>
-  <van-cell
-    :title="title"
-    :border="false"
-    value="查看全部"
-    :url="url"
-    is-link
-  />
+  <van-cell :title="title" :border="false" value="查看全部" :to="to" is-link />
 </template>
 
 <script>
 export default {
-  props: ["title", "url"],
+  props: ["title", "to"],
 };
 </script>
 

src/main/nine-space/src/components/product/productInfo.vue

@@ -1,7 +1,7 @@
 <template>
   <router-link
     :to="{
-      path: '/detail',
+      path: '/productDetail',
       query: {
         id: info.id,
       },

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

@@ -0,0 +1,24 @@
+export default {
+  data() {
+    return {
+      typeOptions: [
+        {
+          label: "精选推荐",
+          value: "",
+        },
+        {
+          label: "原创系列",
+          value: "DEFAULT",
+        },
+        {
+          label: "数字盲合",
+          value: "BLIND_BOX",
+        },
+        {
+          label: "拍卖系列",
+          value: "AUCTION",
+        },
+      ],
+    };
+  },
+};

src/main/nine-space/src/router/index.js

@@ -130,9 +130,18 @@ const routes = [
     component: () => import("../views/account/TradingPassword.vue"),
   },
   {
-    path: "/detail",
-    name: "detail",
-    component: () => import("../views/Detail.vue"),
+    path: "/productDetail",
+    name: "productDetail",
+    component: () => import("../views/product/Detail.vue"),
+    meta: {
+      pageType: Page.Every,
+      title: "第九空间",
+    },
+  },
+  {
+    path: "/productList",
+    name: "productList",
+    component: () => import("../views/product/List.vue"),
     meta: {
       pageType: Page.Every,
       title: "第九空间",

src/main/nine-space/src/views/Discover.vue

@@ -19,7 +19,7 @@
     </swiper>
 
     <van-grid :border="false">
-      <van-grid-item text="精选推荐">
+      <van-grid-item text="精选推荐" :to="{ path: '/productList' }">
         <template v-slot:icon>
           <img
             class="grid-img"
@@ -27,7 +27,15 @@
           />
         </template>
       </van-grid-item>
-      <van-grid-item text="原创系列">
+      <van-grid-item
+        text="原创系列"
+        :to="{
+          path: '/productList',
+          query: {
+            type: 'DEFAULT',
+          },
+        }"
+      >
         <template v-slot:icon>
           <img
             class="grid-img"
@@ -35,7 +43,15 @@
           />
         </template>
       </van-grid-item>
-      <van-grid-item text="数字盲盒">
+      <van-grid-item
+        text="数字盲盒"
+        :to="{
+          path: '/productList',
+          query: {
+            type: 'BLIND_BOX',
+          },
+        }"
+      >
         <template v-slot:icon>
           <img
             class="grid-img"
@@ -43,7 +59,15 @@
           />
         </template>
       </van-grid-item>
-      <van-grid-item text="拍卖系列">
+      <van-grid-item
+        text="拍卖系列"
+        :to="{
+          path: '/productList',
+          query: {
+            type: 'AUCTION',
+          },
+        }"
+      >
         <template v-slot:icon>
           <img
             class="grid-img"

src/main/nine-space/src/views/Home.vue

@@ -29,7 +29,10 @@
     </swiper>
 
     <div class="box" v-if="box.length > 0">
-      <page-title title="数字盲盒"></page-title>
+      <page-title
+        title="数字盲盒"
+        :to="{ path: '/productList', query: { type: 'BLIND_BOX' } }"
+      ></page-title>
       <div class="box-list">
         <product-info
           v-for="item in box"
@@ -41,7 +44,10 @@
     </div>
 
     <div class="box">
-      <page-title title="最HOT收藏品"></page-title>
+      <page-title
+        title="最HOT收藏品"
+        :to="{ path: '/productList', query: { type: 'DEFAULT' } }"
+      ></page-title>
       <div class="box-list">
         <template v-for="(item, index) in products" :key="item.id">
           <product-info v-model:info="products[index]"></product-info

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

@@ -41,6 +41,15 @@
       <div class="text1">实际支付</div>
       <div class="text1">¥{{ info.totalPrice }}</div>
     </div>
+    <div class="info-item" v-if="info.txHash">
+      <div class="text1">链上hash</div>
+      <div class="text1">{{ info.txHash }}</div>
+    </div>
+
+    <div class="info-item" v-if="info.gasUsed">
+      <div class="text1">消耗gas</div>
+      <div class="text1">{{ info.gasUsed }}</div>
+    </div>
 
     <div class="info-item">
       <div class="text1">支付方式</div>

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

@@ -19,7 +19,7 @@
       </div>
       <div class="title">{{ info.name }}</div>
       <div class="info-bottom">
-        <span class="text1"> 编号 338392 </span>
+        <span class="text1" v-if="info.type !== 'DEFAULT'"> 编号 338392 </span>
         <van-button type="primary" plain size="mini">选择其他编号</van-button>
         <like-button :isLike="liked" @click="likeProduct">
           {{ info.likes }}
@@ -28,7 +28,17 @@
     </div>
 
     <driver />
-    <van-cell value="进入主页" is-link class="creator">
+    <van-cell
+      value="进入主页"
+      is-link
+      class="creator"
+      :to="{
+        path: '/creatorDetail',
+        query: {
+          id: info.minterId,
+        },
+      }"
+    >
       <template #icon>
         <van-image
           width="40"
@@ -66,7 +76,7 @@
       <div class="page-text" v-html="info.detail"></div>
     </div>
 
-    <div class="btn van-safe-area-bottom" ref="btn">
+    <div class="btn van-safe-area-bottom" ref="btn" v-if="info.stock">
       <div class="btns">
         <van-button type="primary" block round @click="buy"
           >立即购买</van-button
@@ -121,8 +131,6 @@ export default {
   },
   mounted() {
     this.getProduct();
-    this.btn = this.$refs.btn;
-    document.body.appendChild(this.$refs.btn);
   },
   beforeUnmount() {
     if (this.btn) {
@@ -139,6 +147,8 @@ export default {
         this.info = res;
         this.$nextTick(() => {
           this.checkLike();
+          this.btn = this.$refs.btn;
+          document.body.appendChild(this.$refs.btn);
         });
 
         setTimeout(() => {

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

@@ -0,0 +1,144 @@
+<template>
+  <div class="follow">
+    <van-sticky ref="top" @change="change">
+      <div class="top">
+        <div class="name">{{ pageName }}</div>
+      </div>
+      <van-tabs
+        v-model:active="source"
+        :ellipsis="false"
+        line-width="16"
+        line-height="2"
+        @change="getList"
+      >
+        <van-tab
+          :title="item.label"
+          :name="item.value"
+          :key="index"
+          v-for="(item, index) in sourceOptions"
+        ></van-tab>
+      </van-tabs>
+    </van-sticky>
+    <div class="list">
+      <template v-for="(item, index) in list" :key="index">
+        <product-info
+          v-model:info="list[index]"
+          @update:info="init"
+        ></product-info>
+      </template>
+      <van-empty v-if="empty" description="没有任何藏品哦~" />
+    </div>
+  </div>
+</template>
+
+<script>
+import ProductInfo from "../../components/product/productInfo.vue";
+import product from "../../mixins/product";
+export default {
+  components: { ProductInfo },
+  inject: ["bs"],
+  mixins: [product],
+  data() {
+    return {
+      list: [],
+      empty: false,
+      source: "",
+      type: "",
+      sourceOptions: [
+        {
+          label: "全部",
+          value: "",
+        },
+        {
+          label: "新品",
+          value: "OFFICIAL,USER",
+        },
+        {
+          label: "转让",
+          value: "TRANSFER",
+        },
+      ],
+    };
+  },
+  computed: {
+    pageName() {
+      return this.getLabelName(this.type, this.typeOptions);
+    },
+  },
+  mounted() {
+    if (this.$route.query.type) {
+      this.type = this.$route.query.type;
+    }
+    this.getList();
+  },
+  methods: {
+    change(isFixed) {
+      if (isFixed) {
+        this.$nextTick(() => {
+          document.body.appendChild(this.stiky);
+        });
+      } else {
+        // this.$refs.top.$el.appendChild(this.stiky);
+      }
+    },
+    getList() {
+      this.$toast.loading({
+        message: "加载中...",
+        forbidClick: true,
+      });
+      this.$http
+        .post(
+          "/collection/all",
+          {
+            page: 0,
+            size: 20,
+            query: {
+              source: this.source,
+              type: this.type,
+              onShelf: true,
+            },
+            sort: "createdAt,desc",
+          },
+          { body: "json" }
+        )
+        .then((res) => {
+          this.list = res.content;
+          this.empty = res.empty;
+          setTimeout(() => {
+            this.bs.value.refresh();
+          }, 500);
+        });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.follow {
+  background-color: #0f0f0f;
+  padding-bottom: 100px;
+}
+.top {
+  background-color: #181818;
+  padding: 0 16px;
+  height: 50px;
+  display: flex;
+  align-items: center;
+  .name {
+    font-size: 20px;
+    font-weight: bold;
+    color: #ffffff;
+    line-height: 30px;
+  }
+}
+/deep/.van-tabs {
+  .van-tabs__nav {
+    padding-left: 16px;
+  }
+}
+/deep/.van-tab {
+  flex-grow: 0;
+  padding: 0 0 0 0;
+  margin-right: 50px;
+}
+</style>