修改金币卡图片

src/components/Dialogs/buyDialog.vue

@@ -16,7 +16,8 @@
           <li>
             <div class="nft">
               <div class="nft-img">
-                <img :src="item.nft.image" alt />
+                <!-- <img :src="item.nft.image" alt /> -->
+                <ImgCard :nftData="item.nft" />
               </div>
               <div class="nft-name">{{ item.nft.name }}</div>
             </div>
@@ -49,6 +50,7 @@
 <script setup>
 import {ref, toRaw, computed, onMounted} from "vue";
 import {Modal} from "ant-design-vue";
+import ImgCard from "@/components/common/imgCard.vue"
 import {priceCalculated} from "@/configs/priceCalculate";
 import {BlockChain} from "@/components/chain/BlockChain";
 import { formatPrice } from "@/components/chain/utils";
@@ -205,8 +207,27 @@ onMounted(() => {
             .nft-img {
               width: 110px;
               height: 164px;
-              border: 1px solid #fff;
+              // border: 1px solid #fff;
               margin-left: 50px;
+              .card-img-common {
+                .img-top {
+                  width: 100px;
+                  height: 30px;
+                  top: 20px;
+                  left: 20px;
+                }
+                .img-btm {
+                  bottom: 30px;
+                  left: 30px;
+                  >div {
+                    width: 120px;
+                    height: 40px;
+                  }
+                  div:nth-child(2) {
+                    margin-left: 8px;
+                  }
+                }
+              }
             }
             .nft-name {
               font-weight: bold;

src/components/Dialogs/sellDialog.vue

@@ -17,7 +17,8 @@
         <div class="content-nfts">
           <div class="content-nfts-top">
             <div class="content-nfts-top-left">
-              <img :src="props.sellDataArr.image" alt />
+              <!-- <img :src="props.sellDataArr.image" alt /> -->
+              <ImgCard :nftData="props.sellDataArr" />
             </div>
             <div class="content-nfts-top-right">
               <div class="content-nfts-top-right-title">Enter a price</div>
@@ -131,6 +132,7 @@
 import {ref, toRaw, onMounted, inject} from "vue";
 const message = inject("$message");
 import {DownOutlined, UpOutlined} from "@ant-design/icons-vue";
+import ImgCard from "@/components/common/imgCard.vue"
 // import LoadingDialog from "@/components/Dialogs/loadingDialog.vue"
 import {priceCalculated, timeFormat, royaltiesPrice, feePrice, totalPrice} from "@/configs/priceCalculate.js";
 import {BlockChain} from "@/components/chain/BlockChain";
@@ -275,9 +277,24 @@ onMounted(() => {
               width: 386px;
               height: 576px;
               margin-right: 20px;
-              img {
+              .card-img-common {
-                width: 100%;
+                .img-top {
-                height: 100%;
+                  width: 100px;
+                  height: 30px;
+                  top: 20px;
+                  left: 20px;
+                }
+                .img-btm {
+                  bottom: 30px;
+                  left: 30px;
+                  >div {
+                    width: 120px;
+                    height: 40px;
+                  }
+                  div:nth-child(2) {
+                    margin-left: 8px;
+                  }
+                }
               }
             }
             .content-nfts-top-right {

src/components/assets/collectibles.vue

@@ -112,16 +112,17 @@ const handleScroll = () => {
   //请求数据接口
   // this.seeMoreSchoolList();
   // console.log('scrollTop + windowHeight == scrollHeight请求接口',toRaw(marketplaceStore.cursorObj), scrollTop, windowHeight, scrollHeight)
-  if(myADdress) {
+  // if(myADdress) {
     if(toRaw(marketplaceStore.cursorObj).remaining != 0) {
-      getMyAssets()
+  //     getMyAssets()
     // } else {
-    //   console.log('不用请求')
+      console.log('请求coll')
     } else {
-      return false;
+      console.log('不用请求coll')
+  //     return false;
     }
     return false;
-    }
+    // }
   }
 }
 

src/components/assets/hanging.vue

@@ -14,106 +14,99 @@
 </template>
 
 <script setup>
-import { ref, onMounted, watch } from "vue";
+import {ref, onMounted, onUnmounted, watch} from "vue";
 import OverView from "@/components/common/searchView/Overview.vue";
 import Card from "@/components/common/hangingCard.vue";
-import { apiHangingState } from "@/utils/marketplace"
+import {apiHangingState} from "@/utils/marketplace";
 import {walletStore} from "@/store/wallet";
-import { formatPrice } from "@/components/chain/utils"
+import {formatPrice} from "@/components/chain/utils";
-const localWalletStore = walletStore()
+const localWalletStore = walletStore();
 
-const nftList = ref([])
+const nftList = ref([]);
-const overviewValue = ref()
+const overviewValue = ref();
 
 const overviewChild = (val) => {
-  overviewValue.value = val
+  overviewValue.value = val;
-  getHistoryList()
+  getHistoryList();
-}
+};
-const myAddress = ref(localWalletStore.address)
+const myAddress = ref(localWalletStore.address);
 const next_cursor = ref({
   count: 9,
   next_cursor: "",
   previous_cursor: "1",
   remaining: 0,
-  total_count: 9
+  total_count: 9,
-})
+});
 const getHistoryList = async () => {
   let data = {
     page_size: 20, //TODO:: 根据实际情况修改该值
     cursor: next_cursor.value.next_cursor,
     search_name: overviewValue.value,
-  }
+  };
   if (myAddress.value) {
-    let nftListBox = []
+    let nftListBox = [];
-    let res = await apiHangingState(data,myAddress.value)
+    let res = await apiHangingState(data, myAddress.value);
-    console.log(res)
+    next_cursor.value = res.page;
-    nftList.value = [ ...nftList.value, ...res.rows]
+    nftList.value = [...nftList.value, ...res.rows];
     nftListBox = nftList.value.reduce((acc, obj) => {
-        const existingObj = acc.find(item => item.nft.token_id == obj.nft.token_id)
+      const existingObj = acc.find((item) => item.nft.token_id == obj.nft.token_id);
       if (!existingObj) {
-          acc.push(obj)
+        acc.push(obj);
       }
-        return acc
+      return acc;
-      },[])
+    }, []);
-      nftList.value = nftListBox
+    nftList.value = nftListBox;
 
     for (let sub of nftListBox) {
       if (sub.event?.data) {
-        const _data = formatPrice(sub.event.data)
+        const _data = formatPrice(sub.event.data);
-        sub.event.icon = _data.icon
+        sub.event.icon = _data.icon;
-        sub.event.usd = _data.usd
+        sub.event.usd = _data.usd;
-        sub.event.currencyName = _data.currencyName
+        sub.event.currencyName = _data.currencyName;
-        sub.event.amount = _data.amount
+        sub.event.amount = _data.amount;
-        sub.event.decimals = _data.decimals
+        sub.event.decimals = _data.decimals;
       }
     }
-    nftList.value = nftListBox
+    nftList.value = nftListBox;
-  }
   }
+};
 
-// const handleScroll = () => {
+// const handleScrollListing = () => {
-//   const myADdress = localWalletStore.address
+//   var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; //变量windowHeight是可视区的高度
-//   var scrollTop =
+//   var windowHeight = document.documentElement.clientHeight || document.body.clientHeight; //变量scrollHeight是滚动条的总高度
-//   document.documentElement.scrollTop || document.body.scrollTop; //变量windowHeight是可视区的高度
+//   var scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
-//   var windowHeight =
+//   console.log("next_cursor.value",scrollTop, windowHeight, scrollHeight);
-//   document.documentElement.clientHeight || document.body.clientHeight; //变量scrollHeight是滚动条的总高度
+//   return;
-//   var scrollHeight =
-//   document.documentElement.scrollHeight || document.body.scrollHeight;
 //   if (scrollTop + windowHeight == scrollHeight) {
-//   //请求数据接口
+//     //   //请求数据接口
-//   // this.seeMoreSchoolList();
+//     //   // this.seeMoreSchoolList();
-//   // console.log('scrollTop + windowHeight == scrollHeight请求接口',toRaw(marketplaceStore.cursorObj), scrollTop, windowHeight, scrollHeight)
+//     //   // console.log('scrollTop + windowHeight == scrollHeight请求接口',toRaw(marketplaceStore.cursorObj), scrollTop, windowHeight, scrollHeight)
-//   if(myADdress) {
+//     console.log("next_cursor.value", next_cursor.value);
-//     // if(toRaw(marketplaceStore.cursorObj).remaining != 0) {
+//     if (next_cursor.value.remaining != 0) {
-//       getHistoryList()
+//       //       getHistoryList()
-//     console.log('请求')
+//       console.log("请求list");
-//     // // } else {
+//     } else {
-//     // //   console.log('不用请求')
+//       console.log("不用请求list");
-//     // } else {
-//     //   return false;
-//     // }
-//     // return false;
-//     }
 //     }
 //   }
+// };
 
 watch(localWalletStore, () => {
   if (!localWalletStore.token) {
-    nftList.value = []
+    nftList.value = [];
   } else {
-    getHistoryList()
+    getHistoryList();
   }
-})
+});
 
 onMounted(() => {
-  getHistoryList()
+  getHistoryList();
-  window.removeEventListener('scroll', handleScroll)
+  // window.removeEventListener("scroll", handleScrollListing);
-})
+});
 
 onUnmounted(() => {
-  window.removeEventListener('scroll', handleScroll)
+  // window.removeEventListener("scroll", handleScrollListing);
-})
+});
-
 </script>
 
 <style lang="scss" scoped>

src/components/assets/myCard.vue

@@ -6,7 +6,9 @@
         <!-- <LazyLoadImg :src="nftData.image" :src-placeholder="placeholderImg" alt="图片"/> -->
       </div>
       <div class="card-name">
-        <div>GENESIS HERO</div>
+        <div>
+          <span v-if="nftData.type == 1">GENESIS HERO</span>
+        </div>
         <div class="no-sell" v-show="nftData.on_sale == 1" @click="cancelNft(nftData)">
           <img src="@/assets/img/marketplace/On_SeLL.png" alt="">
         </div>
@@ -21,7 +23,7 @@
             <img :src="icon" alt="">
           </div>
         </div>
-        <div v-if="nftData.type == 0 && nftData.on_sale == 0" class="enabled" @click="lockToGame('redeem')">
+        <div v-if="nftData.type == 11 && nftData.on_sale == 0" class="enabled" @click="lockToGame('redeem')">
           Redeem
         </div>
         <div v-if="nftData.type == 1 && nftData.on_sale == 0" class="link-below" @click="lockToGame('convert')">
@@ -211,6 +213,9 @@ onMounted(() => {
       height: 360px;
       margin: 0 auto;
       :deep(.card-img-common) {
+        li {
+          width: 100%;
+          height: 100%;
           .img-top {
             width: 100px;
             height: 30px;
@@ -232,6 +237,7 @@ onMounted(() => {
           }
         }
       }
+    }
     .card-name {
       display: flex;
       justify-content: space-between;

src/components/assets/trading.vue

@@ -58,7 +58,6 @@ const getHistoryList = async () => {
   if(myADdress) {
     let nftListBox
     let res = await apiHistoryState(myADdress,data)
-    console.log(res)
     next_cursor.value = res.page
     nftList.value = [...nftList.value, ...res.rows]
     nftListBox = nftList.value.reduce((acc, obj) => {
@@ -68,7 +67,6 @@ const getHistoryList = async () => {
         }
         return acc
       },[])
-      // nftList.value = nftListBox
     for (let sub of nftListBox) {
       if (sub.event?.data) {
         const _data = parseTradeEvent(sub.event)
@@ -83,8 +81,7 @@ const getHistoryList = async () => {
   }
 }
 
-const handleScroll = () => {
+const handleScrollTrad = () => {
-  const myADdress = localWalletStore.address
   var scrollTop =
   document.documentElement.scrollTop || document.body.scrollTop; //变量windowHeight是可视区的高度
   var windowHeight =
@@ -96,7 +93,10 @@ const handleScroll = () => {
     // this.seeMoreSchoolList();
     // console.log('scrollTop + windowHeight == scrollHeight请求接口',toRaw(marketplaceStore.cursorObj), scrollTop, windowHeight, scrollHeight)
     if(next_cursor.value.remaining != 0) {
-      getHistoryList()
+      // getHistoryList()
+      console.log('请求trad')
+    } else {
+      console.log('不用请求trad')
     }
     return false;
   }
@@ -112,11 +112,11 @@ watch(localWalletStore,() => {
 
 onMounted(() => {
   getHistoryList()
-  window.addEventListener("scroll", handleScroll, true);
+  window.addEventListener("scroll", handleScrollTrad, true);
 })
 
 onUnmounted(() => {
-  window.removeEventListener('scroll', handleScroll)
+  window.removeEventListener('scroll', handleScrollTrad)
 })
 </script>
 

src/components/common/card.vue

@@ -5,7 +5,9 @@
         <ImgCard :nftData="nftData.nft" />
       </div>
       <div class="card-name">
-        <div>GENESIS HERO</div>
+        <div>
+          <span v-if="nftData.nft.type == 1">GENESIS HERO</span>
+        </div>
         <div>{{nftData.nft.name}}</div>
       </div>
       <div class="card-price">

src/components/common/imgCard.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="card-img-common">
+    <li v-if="props.nftData.type == 1">
       <LazyLoadImg :src="props.nftData.image" :src-placeholder="placeholderImg" alt="图片"/>
       <div class="img-top">
         {{ props.nftData.detail.max_mining_days }}D
@@ -8,6 +9,13 @@
         <div>{{ props.nftData.detail.wealth }}</div>
         <div>{{ props.nftData.detail.lucky }}</div>
       </div>
+    </li>
+    <li v-else>
+      <div class="gold-img">
+        <img v-if="props.nftData.detail.gold_coins == 1000" src="@/assets/img/marketplace/Coin_icon_1000.png" alt="">
+        <img v-if="props.nftData.detail.gold_coins == 10000" src="@/assets/img/marketplace/Coin_icon_10000.png" alt="">
+      </div>
+    </li>
   </div>
 </template>
 
@@ -27,11 +35,19 @@ const props = defineProps({
 
 <style lang="scss" scoped>
 .card-img-common {
-  position: relative;
+  width: 100%;
+  height: 100%;
   img {
     width: 100%;
     height: 100%;
   }
+  li {
+    position: relative;
+  }
+  .gold-img {
+    border: 2px solid #fff;
+    background: rgb(60, 50, 26);
+  }
   .img-top {
     position: absolute;
     display: flex;

src/views/DetailView.vue

@@ -61,7 +61,7 @@
                 <div class="sell" @click="beginSell" v-if="detailData.nft.on_sale == 0">List</div>
                 <div class="cancel" @click="cancelSell" v-if="detailData.nft.on_sale == 1">Cancel listing</div>
                 <div class="redeem" @click="lockToGame('convert')" v-if="detailData.nft.on_sale == 0 && detailData.nft.type == 1">Convert</div>
-                <div class="redeem" @click="lockToGame('redeem')" v-if="detailData.nft.on_sale == 0 && detailData.nft.type == 0">Redeem</div>
+                <div class="redeem" @click="lockToGame('redeem')" v-if="detailData.nft.on_sale == 0 && detailData.nft.type == 11">Redeem</div>
               </div>
             </div>
             <div class="info">