From 94ada755d8860a07e18475360a810f7a08d23e1f Mon Sep 17 00:00:00 2001
From: huangjinming <huangjinming@kingsome.cn>
Date: Thu, 19 Jan 2023 11:46:33 +0800
Subject: [PATCH] fix

---
 src/components/market/WeaponSellTop.vue      |  2 -
 src/components/mobile/main/HeroBuyTop.vue    |  6 +-
 src/components/mobile/main/HeroItem.vue      | 30 +++----
 src/components/mobile/main/HeroSellTop.vue   |  4 +-
 src/components/mobile/main/PieceSellTop.vue  |  5 +-
 src/components/mobile/main/TheSellDialog.vue | 12 ++-
 src/views/desktop/Market.vue                 | 81 ++++++++----------
 src/views/desktop/MyNft.vue                  | 90 ++++++++------------
 8 files changed, 99 insertions(+), 131 deletions(-)

diff --git a/src/components/market/WeaponSellTop.vue b/src/components/market/WeaponSellTop.vue
index cdffaa2..1073bd7 100644
--- a/src/components/market/WeaponSellTop.vue
+++ b/src/components/market/WeaponSellTop.vue
@@ -82,9 +82,7 @@ export default {
         margin-left: 17px;
       }
       .weapon-name {
-        //  width: 46px;
         height: 15px;
-        // max-width: 86px;
         line-height: 15px;
         padding-right: 10px;
         padding-left: 10px;
diff --git a/src/components/mobile/main/HeroBuyTop.vue b/src/components/mobile/main/HeroBuyTop.vue
index d83dd63..d1df04b 100644
--- a/src/components/mobile/main/HeroBuyTop.vue
+++ b/src/components/mobile/main/HeroBuyTop.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="hero-top">
+  <div class="hero-top" v-if="data.info">
     <div :class="data.info.is_genesis ? 'piece-left' : 'piece-left-gen'">
       <div class="hero-img">
         <img
@@ -8,8 +8,8 @@
           alt=""
         />
       </div>
-      <div class="gen" v-if="data.info.is_genesis">
-        <img width="31px" src="../../../assets/market/hero/gen.png" alt="" />
+      <div class="gen" v-if="data.info">
+        <img width="31px" v-if="data.info.is_genesis" src="../../../assets/market/hero/gen.png" alt="" />
       </div>
     </div>
     <div class="hero-right">
diff --git a/src/components/mobile/main/HeroItem.vue b/src/components/mobile/main/HeroItem.vue
index 7648d73..dcabd70 100644
--- a/src/components/mobile/main/HeroItem.vue
+++ b/src/components/mobile/main/HeroItem.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
-    <div class="type-img">
+    <div class="type-img" v-if="hero.info">
       <img
-        v-if="hero.info.is_genesis == 1"
+        v-if="hero.info.is_genesis"
         class="img-item"
         src="../../../assets/mobile/market/hero/type-1.png"
         alt=""
@@ -25,10 +25,10 @@
           alt=""
         />
       </div>
-      <div class="gen">
+      <div class="gen"  v-if="hero.info">
         <img
           width="42px"
-          v-if="hero.info.is_genesis == 1"
+          v-if="hero.info.is_genesis"
           src="../../../assets/market/hero/gen.png"
           alt=""
         />
@@ -48,21 +48,21 @@
     </div>
     <div class="mynft-btn" v-if="isType == 'mynft'">
       <!-- <div class="rent-btn">rent</div> -->
-       <div class="t-icon" v-if="hero.o_link > 0 &&isType=='mynft'">
+      <div class="t-icon" v-if="hero.o_link > 0 && isType == 'mynft'">
         <img src="../../../assets/mobile/market/hero/t-icon.png" alt="" />
       </div>
-      <div class="price" v-if="hero.o_link > 0 &&isType=='mynft'">{{formatPriceShow(hero.s_price,18)  }}</div>
+      <div class="price" v-if="hero.o_link > 0 && isType == 'mynft'">
+        {{ formatPriceShow(hero.s_price, 18) }}
+      </div>
       <div class="sell-btn">sell</div>
     </div>
     <div class="sale" v-else>
       <div class="t-icon">
         <img src="../../../assets/mobile/market/hero/t-icon.png" alt="" />
       </div>
-      <div class="price">{{formatPriceShow(hero.s_price,18)  }}</div>
+      <div class="price">{{ formatPriceShow(hero.s_price, 18) }}</div>
       <div class="buy">
-        
-          <img src="../../../assets/mobile/market/hero/buy.png" alt=""
-        />
+        <img src="../../../assets/mobile/market/hero/buy.png" alt="" />
       </div>
     </div>
   </div>
@@ -118,11 +118,11 @@ export default {
       }
     }
   },
-  methods:{
-     formatPriceShow(price, decimals, fixed = 2) {
+  methods: {
+    formatPriceShow(price, decimals, fixed = 2) {
       return formatPrice(price, decimals, fixed);
     },
-  }
+  },
 };
 </script>
 
@@ -205,7 +205,7 @@ export default {
     color: #ffffff;
     border-radius: 31px;
   }
-    .t-icon {
+  .t-icon {
     width: 63px;
     height: 63px;
     img {
@@ -217,7 +217,7 @@ export default {
 .sale {
   display: flex;
   justify-content: space-between;
-   margin-top: 25px;
+  margin-top: 25px;
   padding-left: 22px;
   padding-right: 22px;
   .t-icon {
diff --git a/src/components/mobile/main/HeroSellTop.vue b/src/components/mobile/main/HeroSellTop.vue
index 3b66aff..a7c327c 100644
--- a/src/components/mobile/main/HeroSellTop.vue
+++ b/src/components/mobile/main/HeroSellTop.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <div class="piece-top">
-      <div :class="data.info.is_genesis ? 'piece-left' : 'piece-left-gen'">
+      <div v-if="data.info" :class="data.info.is_genesis ? 'piece-left' : 'piece-left-gen'">
         <div>
           <img
             class="hero-img"
@@ -29,7 +29,7 @@
           <div class="token-id">
             <div>
               <div>Token id</div>
-              <div>#{{ data.detail.token_id }}</div>
+              <div v-if="data.detail">#{{ data.detail.token_id }}</div>
             </div>
           </div>
           <div class="amount">
diff --git a/src/components/mobile/main/PieceSellTop.vue b/src/components/mobile/main/PieceSellTop.vue
index 1ed99b1..a958d12 100644
--- a/src/components/mobile/main/PieceSellTop.vue
+++ b/src/components/mobile/main/PieceSellTop.vue
@@ -2,16 +2,15 @@
   <div>
     <div :class="isBuy ? 'piece-top' : 'piece-active'">
       <div class="piece-left">
-        <div class="piece-img">
+        <div class="piece-img" v-if="data.detail">
           <img
-            v-if="data.detail.item_id"
             :src="
               require('@/assets/market/piece/' + data.detail.item_id + '.png')
             "
             alt=""
           />
         </div>
-        <div class="name">{{ data.detail.name }}</div>
+        <div class="name" v-if="data.detail">{{ data.detail.name }}</div>
       </div>
       <div class="piece-right">
         <div class="userinfo">
diff --git a/src/components/mobile/main/TheSellDialog.vue b/src/components/mobile/main/TheSellDialog.vue
index 1aee273..3a4390a 100644
--- a/src/components/mobile/main/TheSellDialog.vue
+++ b/src/components/mobile/main/TheSellDialog.vue
@@ -8,7 +8,6 @@
         v-if="type == 'weapon'"
         :data="piece"
       ></WeaponSellTop>
-
       <ChipSellTop
         :isBuy="isBuy"
         v-if="type == 'chip'"
@@ -34,9 +33,7 @@
             alt=""
           />
         </div>
-        <div class="service-usdt">
-          <span class="usdt-number"> 0</span> USDT
-        </div>
+        <div class="service-usdt"><span class="usdt-number"> 0</span> USDT</div>
       </div>
       <div class="piece-bottom">
         <div class="piece-bottom-top">
@@ -159,7 +156,7 @@ export default {
   methods: {
     closeTip() {
       this.detailVisible = false;
-      this.shell.price =''
+      this.shell.price = "";
     },
     init(data) {
       this.detailVisible = true;
@@ -316,8 +313,9 @@ $item-size: 22px;
   left: 0;
   width: 100%;
   background-color: rgba(20, 28, 34, 0.6);
-   z-index: 2000;
-   transition: opacity 0.2s cubic-bezier(0.6, 0, 0.4, 1) 0s, transform 0.2s ease-in-out 0s;
+  z-index: 2000;
+  transition: opacity 0.2s cubic-bezier(0.6, 0, 0.4, 1) 0s,
+    transform 0.2s ease-in-out 0s;
   .content {
     position: relative;
     .close {
diff --git a/src/views/desktop/Market.vue b/src/views/desktop/Market.vue
index d2b01a3..b6684fc 100644
--- a/src/views/desktop/Market.vue
+++ b/src/views/desktop/Market.vue
@@ -36,7 +36,7 @@
           :pieceOptions="pieceOptions"
           :chipOptions="chipOptions"
           :nft-type="nftType"
-           :isType="isType"
+          :isType="isType"
           :value="value"
           :priceMax="priceMax"
           :priceMin="priceMin"
@@ -106,7 +106,7 @@ import { debounce } from "@/utils/formatAddress";
 export default class Market extends Vue {
   mobileFilterShow = false;
   currentTab = "market";
-  isType="isType"
+  isType = "isType";
   value = 7;
   nftType = 1;
   nftList = [];
@@ -531,7 +531,6 @@ export default class Market extends Vue {
   heroLevelChange(levelSlider: any) {
     this.lvFilter = levelSlider;
     this.getMarketNftList();
-    // this.$emit("heroLevelChange", levelSlider);
   }
   heroQualityChange(Quality: any) {
     this.qualityFilter = Quality;
@@ -592,55 +591,52 @@ export default class Market extends Vue {
     this.getMarketNftList();
   }
   toPage(pageNo: number) {
-    console.log("to page: ", pageNo);
-    // this.currentPage = pageNo
     this.starts = (pageNo - 1) * 10;
     this.getMarketNftList();
   }
-  async getMarketNftList( ) {
+  async getMarketNftList() {
     if (!AppModule.accountId) {
       return;
     }
-    try{
-    this.showLoading();
-    const reqData: any = {
-      page_size: this.pageSize,
-      start: this.starts,
-      type: this.nftType == 4 ? 5 : this.nftType,
-      job_filters: this.nftType == 2 ? null : this.jobFilters,
-      search_filters: this.searchFilters,
-      quality_filter: this.qualityFilter,
-      durability_filter: this.durabilityFilter,
-      lv_filter: this.lvFilter,
-      order_asc: this.orderAsc,
-      order_method: this.orderMethod,
-      price_filter: this.priceFilter,
-    };
-    
-    const res: any = await queryMarketNftList(reqData);
-    if (res.nfts) {
-      // this.nftList = res.nfts;
-      let list = res.nfts;
-      this.nftList = list.filter((item: any) => {
-        return item.details !== null;
-      });
-       
-      if (res) {
-        const page = res;
-        this.totalPage = parseInt(page.total) || 1;
-        this.pageSize = page.page_size || 10;
-        this.starts = page.start;
-        this.currentPage = page.start / page.page_size + 1;
-         this.hideLoading();
+    try {
+      this.showLoading();
+      const reqData: any = {
+        page_size: this.pageSize,
+        start: this.starts,
+        type: this.nftType == 4 ? 5 : this.nftType,
+        job_filters: this.nftType == 2 ? null : this.jobFilters,
+        search_filters: this.searchFilters,
+        quality_filter: this.qualityFilter,
+        durability_filter: this.durabilityFilter,
+        lv_filter: this.lvFilter,
+        order_asc: this.orderAsc,
+        order_method: this.orderMethod,
+        price_filter: this.priceFilter,
+      };
+
+      const res: any = await queryMarketNftList(reqData);
+      if (res.nfts) {
+        let list = res.nfts || [];
+        this.nftList = list.filter((item: any) => {
+          return item.details !== null;
+        });
+
+        if (res) {
+          const page = res;
+          this.totalPage = parseInt(page.total) || 1;
+          this.pageSize = page.page_size || 10;
+          this.starts = page.start;
+          this.currentPage = page.start / page.page_size + 1;
+          this.hideLoading();
+        }
       }
-    }
-    }catch(err){
-       this.hideLoading()
+    } catch (err) {
+      this.hideLoading();
     }
   }
   @Watch("isLogin")
   private accountChange() {
-    console.log("account change: ", AppModule.accountId);
+    // console.log("account change: ", AppModule.accountId);
     if (this.isLogin) {
       // this.fetchDatas(this.pageSize);
       // this.checkOrderHistory();
@@ -655,7 +651,6 @@ export default class Market extends Vue {
   }
 
   onNftTypeClicked(id: number) {
-    // console.log("nft type clicked: ", id);
     this.nftType = id;
     this.jobFilters = "1|2|3|4";
     const jobList = this.jobList.map((item) => {
@@ -680,8 +675,6 @@ export default class Market extends Vue {
   hideLoading() {
     this.loadingInstance?.close();
   }
-  // this.isValue
-  sliderChange() {}
 }
 </script>
 <style lang="scss" scoped>
diff --git a/src/views/desktop/MyNft.vue b/src/views/desktop/MyNft.vue
index 99240b2..1b5eccd 100644
--- a/src/views/desktop/MyNft.vue
+++ b/src/views/desktop/MyNft.vue
@@ -44,16 +44,6 @@
             @nft-type-changed="onNftTypeClicked"
             class="left-bar"
           ></nft-type-bar>
-          <!-- <sort-select
-            :filters="filters"
-            :selected-index="nftState"
-            @filter-change="filterChange"
-          ></sort-select> -->
-          <!-- <nft-list
-            :nft-datas="nftList"
-            v-if="nftList.length > 0"
-            @activate-clicked="onActivateClick"
-          ></nft-list> -->
           <search-result
             @filter-show="showFilter"
             :select-idx="nftType"
@@ -485,7 +475,6 @@ export default class MyNft extends Vue {
   private currentPage = 1;
   private currencyTypeList = [];
   private dataCache: Map<any, INftData[]> = new Map();
-
   private isProcess = false;
   private rewardModal: ZModal;
   orderTimer: any = null;
@@ -571,7 +560,6 @@ export default class MyNft extends Vue {
   heroLevelChange(levelSlider: any) {
     this.lvFilter = levelSlider;
     this.getMyNftList(this.starts);
-    // this.$emit("heroLevelChange", levelSlider);
   }
   heroQualityChange(Quality: any) {
     this.qualityFilter = Quality;
@@ -622,8 +610,6 @@ export default class MyNft extends Vue {
     this.getMyNftList(this.starts);
   }
   toPage(pageNo: number) {
-    console.log("to page: ", pageNo);
-    // this.currentPage = pageNo
     this.starts = (pageNo - 1) * 10;
     this.getMyNftList(this.starts);
   }
@@ -631,47 +617,44 @@ export default class MyNft extends Vue {
     if (!AppModule.accountId) {
       return;
     }
-    try{
+    try {
+      this.showLoading();
+      const reqData: any = {
+        page_size: this.pageSize,
+        start: this.starts,
+        type: this.nftType == 4 ? 5 : this.nftType,
+        job_filters: this.jobFilters,
+        search_filters: this.searchFilters,
+        quality_filter: this.qualityFilter,
+        durability_filter: this.durabilityFilter,
+        lv_filter: this.lvFilter,
+        order_asc: this.orderAsc,
+        order_method: this.orderMethod,
+      };
 
-   
-    this.showLoading();
-    const reqData: any = {
-      page_size: this.pageSize,
-      start: this.starts,
-      type: this.nftType == 4 ? 5 : this.nftType,
-      job_filters: this.jobFilters,
-      search_filters: this.searchFilters,
-      quality_filter: this.qualityFilter,
-      durability_filter: this.durabilityFilter,
-      lv_filter: this.lvFilter,
-      order_asc: this.orderAsc,
-      order_method: this.orderMethod,
-    };
+      const res: any = await queryMyNftList(reqData);
+      if (res.nfts) {
+         this.nftList = res.nfts || [];
+        // this.nftList = list.filter((item: any) => {
+        //   return item.details !== null;
+        // });
 
-    const res: any = await queryMyNftList(reqData);
-    if (res.nfts) {
-      let list = res.nfts;
-      this.nftList = list.filter((item: any) => {
-        return item.details !== null;
-      });
-      // console.log(this.nftList, "-==========================");
-
-      if (res) {
-        const page = res;
-        this.totalPage = page.total || 1;
-        this.pageSize = page.page_size || 10;
-        this.starts = page.start;
-        this.currentPage = page.start / page.page_size + 1;
-      }
-      if (res.errcode == 0) {
-        this.hideLoading();
-      }else{
-         this.hideLoading();
+        if (res) {
+          const page = res;
+          this.totalPage = page.total || 1;
+          this.pageSize = page.page_size || 10;
+          this.starts = page.start;
+          this.currentPage = page.start / page.page_size + 1;
+        }
+        if (res.errcode == 0) {
+          this.hideLoading();
+        } else {
+          this.hideLoading();
+        }
       }
+    } catch (err) {
+      this.hideLoading();
     }
-     }catch(err){
-      this.hideLoading()
-     }
   }
   async getCurrencyType() {
     if (this.currencyTypeList.length > 0) {
@@ -679,11 +662,8 @@ export default class MyNft extends Vue {
     }
     const res: any = await getSupportedCurrenTypes();
     this.currencyTypeList = res.list;
-    // this.value = this.options[0].address;
   }
   onNftTypeClicked(typeId: number) {
-    console.log("nft type clicked: ", typeId);
-
     if (this.nftType !== typeId) {
       this.nftType = typeId;
       this.jobFilters = "1|2|3|4";
@@ -735,7 +715,7 @@ export default class MyNft extends Vue {
       this.resetData();
     }
   }
- 
+
   showFilter(val: boolean) {
     this.mobileFilterShow = val;
   }