fix

src/components/market/NftList.vue

@@ -1,39 +1,44 @@
 <template>
   <div class="card-list">
     <div class="grid">
-      <nft-info v-for="c in nftDatas" :key="c.id" :nft-data="c" @activate-clicked="onActivateClick"></nft-info>
+      <nft-info
+        v-for="c in nftDatas"
+        :key="c.id"
+        :nft-data="c"
+        @activate-clicked="onActivateClick"
+      ></nft-info>
     </div>
   </div>
 </template>
 <script lang="ts">
-import { Component, Prop, Vue, Watch } from 'vue-property-decorator'
-import Pagination from '@/components/market/Pagination.vue'
-import Card from '@/components/market/Card.vue'
-import NftInfo from '@/components/market/NftInfo.vue'
-import { INftData } from '@/types/Nft'
+import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+import Pagination from "@/components/market/Pagination.vue";
+import Card from "@/components/market/Card.vue";
+import NftInfo from "@/components/market/NftInfo.vue";
+import { INftData } from "@/types/Nft";
 
 @Component({
-  name: 'NftList',
+  name: "NftList",
   components: {
     NftInfo,
     Card,
-    Pagination
-  }
+    Pagination,
+  },
 })
 export default class extends Vue {
-  @Prop() private nftDatas: INftData[]
-  private cardList: INftData[] = []
+  @Prop() private nftDatas: INftData[];
+  private cardList: INftData[] = [];
 
-  @Watch('nftDatas')
+  @Watch("nftDatas")
   private onNftDataChange() {
     if (!this.nftDatas) {
-      return
+      return;
     }
-    this.cardList.length = 0
-    console.log('nftDatas change')
-    console.log(this.nftDatas)
+    this.cardList.length = 0;
+    console.log("nftDatas change");
+    console.log(this.nftDatas);
     for (const data of this.nftDatas) {
-      this.cardList.push(data)
+      this.cardList.push(data);
     }
   }
 
@@ -58,8 +63,8 @@ export default class extends Vue {
     // }
   }
 
-  onActivateClick(data: {tokenId: string, type: number}) {
-    this.$emit('activate-clicked', data)
+  onActivateClick(data: { tokenId: string; type: number }) {
+    this.$emit("activate-clicked", data);
   }
 }
 </script>
@@ -80,7 +85,7 @@ export default class extends Vue {
   justify-content: center;
   display: -ms-grid;
   display: grid;
-  -ms-grid-columns: (1fr)[4];
+  -ms-grid-columns: (1fr) [4];
   grid-template-columns: repeat(4, 1fr);
   -webkit-column-gap: 1.875em;
   column-gap: 1.875em;
@@ -105,16 +110,16 @@ export default class extends Vue {
 
 @media (max-width: 1023px) {
   .card-list .grid {
-    -ms-grid-columns: (1fr)[2];
+    -ms-grid-columns: (1fr) [2];
     grid-template-columns: repeat(2, 1fr);
   }
 }
 
 @media (max-width: 767px) {
-  .card-list{
+  .card-list {
     margin-top: 76px;
     padding: 26px 0;
-  };
+  }
   .card-list .grid {
     display: flex;
     flex-direction: column;
@@ -122,15 +127,14 @@ export default class extends Vue {
   }
 }
 @media (min-width: 1024px) and (max-width: 1439px) {
-  .card-list{
+  .card-list {
     font-size: 15px;
   }
 }
 
 @media (min-width: 1439px) {
-  .card-list{
+  .card-list {
     font-size: 16px;
   }
 }
-
 </style>

src/components/market/NftTypeBar.vue

@@ -18,7 +18,7 @@
         v-model="value"
         :popper-append-to-body="false"
         @change="handSortSelect"
-        placeholder="请选择"
+        placeholder=""
         popper-class="select-popper"
       >
         <el-option
@@ -38,7 +38,7 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 @Component({
   name: "NftTypeBar",
   components: {},
-  props:['sortOptions','selectIdx']
+  props: ["sortOptions", "selectIdx"],
 })
 export default class NftTypeBar extends Vue {
   // @Prop() private selectIdx: number;
@@ -49,12 +49,12 @@ export default class NftTypeBar extends Vue {
     { Image: require("../../assets/market/piece.png") },
     // { Image: require("../../assets/market/voucher.png") },
   ];
-  
+
   value = "";
   private onClickItem(idx: number) {
     this.$emit("nft-type-changed", idx + 1);
   }
- handSortSelect(value: any) {
+  handSortSelect(value: any) {
     console.log(value);
     this.$emit("handSortSelect", value);
   }
@@ -105,7 +105,7 @@ $item-size: 20px;
 ::v-deep .el-input--suffix .el-input__inner {
   width: 159px;
   height: 36px;
-  font-size: 23px;
+  font-size: 20px;
   border: none;
   text-align: center;
   color: #fff;

src/components/market/nft/PieceNft.vue

@@ -30,7 +30,9 @@
           <!-- <div class="level-lv">
           Lv <span class="level-number">{{ piece.level }}</span>
         </div> -->
-          <div class="tree-guard">Tree guard</div>
+          <div class="tree-guard">
+            {{ piece.c_name ? piece.c_name : "Tree guard" }}
+          </div>
         </div>
         <div class="lease-listing" v-if="isType == 'mynft'">
           <div class="rent"></div>

src/views/desktop/Market.vue

@@ -579,7 +579,7 @@ export default class Market extends Vue {
       page_size: pageNo,
       type: this.nftType == 4 ? 5 : this.nftType,
       account: "0x9a4d9dd2bfcad659975f0f5a480625c7929e9385",
-      job_filters:this.nftType == 2 ||this.nftType == 5? null: this.jobFilters,
+      job_filters:this.nftType == 2 ? null: this.jobFilters,
       search_filters: this.searchFilters,
       quality_filter: this.qualityFilter,
       durability_filter: this.durabilityFilter,
@@ -589,7 +589,6 @@ export default class Market extends Vue {
       price_filter: this.priceFilter,
     };
     const res: any = await queryShellNftList(reqData);
-    console.log(res, "MAKET");
     if (res.nfts) {
       // this.nftList = res.nfts;
       let list = res.nfts;