修改herder Table路由

src/components/assets/myCard.vue

@@ -37,8 +37,12 @@
         </div>
         <div v-if="LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase() && (nftData.type == 1 || nftData.type == 12) && nftData.on_sale == 0" class="link-below">
           <span v-if="nftData?.status">loading</span>
-          <span v-else @click="lockToGame('convert')">Stake</span>
+          <span v-else @click="lockToGame(nftData)">Stake</span>
         </div>
+        <!-- <div v-if="LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase() && (nftData.type == 13) && nftData.on_sale == 0" class="link-below">
+          <span v-if="nftData?.status">loading</span>
+          <span v-else @click="lockToGame(nftData)">Stake</span>
+        </div> -->
       </div>
     </div>
     <div class="card-btn" v-if="nftData.type != 13 && LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase()">
@@ -53,10 +57,10 @@
         <span v-if="nftData?.status">loading</span>
         <span @click="unStake(nftData)">Unstake</span>
       </div>
-      <!-- <div class="card-sell" v-else>
+      <div class="card-sell" v-else>
         <span v-if="nftData?.status">loading</span>
-        <span v-else @click="lockToGame('founder')">Stake</span>
+        <span v-else @click="lockToGame(nftData)">Stake</span>
-      </div> -->
+      </div>
     </div>
     <SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
     <LoadingDialog :loadingDialogVisible="loadingDialogVisible" />
@@ -158,8 +162,8 @@ const cancelNft = async (val) => {
 
 const loadingDialogVisible = ref(false)
 // 下链使用
-const lockToGame = async(type) => {
+const lockToGame = async(data) => {
-  if(type == 'founder') {
+  if(data.type == 13) {
     const confirmResult = await createModal(ConfirmDialog, {
         title: '', 
         message: `Are you sure you want to stake?`
@@ -168,7 +172,7 @@ const lockToGame = async(type) => {
         loadingDialogVisible.value = true
         unlockMainConfirm()
       }
-  } else if(type == 'convert') {
+  } else {
     const confirmResult = await createModal(ConfirmDialog, {
       title: '', 
       message: 'Are you sure you want to stake?'
@@ -391,6 +395,7 @@ const sellHandleClose = (val) => {
 
 onMounted(() => {
   cardPrice(toRaw(props.nftData))
+  
 });
 </script>
 

src/components/common/convertCard.vue

@@ -7,18 +7,18 @@
             <div class="nft-img">
               <ImgCard :nftData="nft" />
             </div>
-            <div class="nft-name">{{ nft.name }}</div>
+            <div class="nft-name" v-if="nft.type == 13">Founder's Tag</div>
+            <div class="nft-name" v-else>{{ nft.name }}</div>
           </div>
         </template>
       </a-table-column>
-      <a-table-column title="Status" data-index="type" :width="400">
+      <a-table-column title="Status" data-source="orderList" :width="400">
-        <template  #default="{ text: type }">
+        <template #default="{ text: orderList }">
           <div class="status">
-            <!-- <div class="nft-status" v-if="nft.item_id == '10017' || nft.item_id == '10018'">Redeem</div>
+            <div class="nft-status" v-if="orderList.nft.item_id == '10017' || orderList.nft.item_id == '10018'">Redeem</div>
-            <div class="nft-status" v-else>Stake</div> -->
+            <div class="nft-status" v-else-if="orderList.type == 1">Mint</div>
-            <div class="nft-status" v-if="type == 1">Mint</div>
+            <div class="nft-status" v-else-if="orderList.type == 2">Stake</div>
-            <div class="nft-status" v-else-if="type == 2">Stake</div>
+            <div class="nft-status" v-else-if="orderList.type == 3">UnStake</div>
-            <div class="nft-status" v-else-if="type == 3">UnStake</div>
           </div>
         </template>
       </a-table-column>
@@ -26,7 +26,12 @@
         <template  #default="{ text: nft }">
           <div class="quantity">
             <div v-if="nft.detail.quality" class="nft-quantity">{{ nft.detail.quality }}</div>
-            <div v-else class="nft-quantity">{{ nft.detail.gold_coins }}</div>
+            <div v-else-if="nft.detail.gold_coins" class="nft-quantity">{{ nft.detail.gold_coins }}</div>
+            <div v-else class="nft-quantity">
+              <span v-if="nft.quality == 1">Common</span>
+              <span v-if="nft.quality == 2">Rare</span>
+              <span v-if="nft.quality == 3">Legendary</span>
+            </div>
           </div>
         </template>
       </a-table-column>

src/components/common/searchView/nftStatusRadio.vue

@@ -5,7 +5,7 @@
       <a-radio value="0">All</a-radio>
       <a-radio value="1">Listed</a-radio>
       <a-radio value="2">Unlisted</a-radio>
-      <a-radio value="3">Staking</a-radio>
+      <!-- <a-radio value="3">Staking</a-radio> -->
     </a-radio-group>
   </div>
 </template>

src/components/layout/NavBar.vue

@@ -145,7 +145,7 @@ const navList = reactive([
     name: "ASSETS",
     path: "/assets",
     submenu: [
-      { label: "Before 2024", link: "https://pledge.kingsome.cn" },
+      { label: "Before 2024", link: "https://pledge.counterfire.games" },
       {
         label: "After 2024",
         path: "/assets",
@@ -157,18 +157,23 @@ const navList = reactive([
     name: "NOTICE",
     path: "/notice",
   },
-  {
+  // {
-    id: 5,
+  //   id: 5,
-    name: "EVENT",
+  //   name: "GACHA",
-    path: "/contact",
+  //   path: "https://gacha.counterfire.games/view",
-    submenu: [
+  // },
-      { label: "Badge", link: "https://badge.counterfire.games/" },
+  // {
-      {
+  //   id: 5,
-        label: "Gacha",
+  //   name: "EVENT",
-        link: "https://gacha.counterfire.games/",
+  //   path: "/contact",
-      },
+  //   submenu: [
-    ],
+  //     { label: "Badge", link: "https://badge.counterfire.games/" },
-  },
+  //     {
+  //       label: "Gacha",
+  //       link: "https://gacha.counterfire.games/",
+  //     },
+  //   ],
+  // },
   // {
   //   id: 6,
   //   name: "STAKE",
@@ -211,7 +216,9 @@ function handNavCurent(nav) {
     router.push(nav.path);
   // } else if(nav.id == 6) {
   //   window.open(nav.path, "_blank");
-  } 
+  // } else if(nav.id == 5) {
+  //   window.open(nav.path, "_blank")
+  }
   // if (nav.id == 1 || nav.id == 2 || nav.id == 3) {
   //   window.open(nav.path, "_blank");
   // } else if (nav.id == 5 || nav.id == 6) {
@@ -380,82 +387,19 @@ onMounted( async () => {
       line-height: 30px;
       color: #bb7fff !important;
       cursor: pointer;
-      .dropdown {
+      &:hover {
-        position: absolute;
+        transition-property: color;
-        top: 84px;
+        transition-duration: 0.15s;
-        left: 50%;
+        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-        width: 100%;
+        font-family: "Anton";
-        background: rgba(0, 0, 0, 0.84);
+        background-color: #bb7fff;
-        border-radius: 0px 0px 12px 12px;
+        border-radius: 42px;
-        z-index: 1;
+        color: #000000 !important;
-        opacity: 0;
+          .dropdown {
-        transform: translate(-50%, 0%);
+          display: block;
-        visibility: hidden;
+        }
-        transition: all 0.3s ease-out;
-      }
-
-      .dropdown ul {
-        list-style: none;
-        margin: 0;
-        padding: 0;
-      }
-      .dropdown li {
-        // padding-top: 10px;
-        // padding-bottom: 10px;
-        padding-left: 20px;
-        padding-right: 20px;
-        cursor: pointer;
-      }
-      .link-content {
-        display: flex;
-        //  width: 150px;
-        text-align: center;
-        align-items: center;
-        justify-content: space-between;
-      }
-      .link-label {
-        font-size: 16px;
-        font-family: Arial;
-        font-weight: 400;
-        text-align: center;
-        color: #ffffff;
-      }
-      .dropdown li a {
-        font-size: 16px;
-        font-family: Arial;
-        font-weight: 400;
-        color: #ffffff;
-        padding-top: 10px;
-        padding-bottom: 10px;
-        text-align: center; /* ensure text is centered */
-        width: 100%; /* make it span the full width */
-        display: block;
-        cursor: pointer;
-      }
-      .dropdown li span {
-        font-size: 15px;
-        font-family: Arial;
-        font-weight: 400;
-        color: #ffffff;
       }
     }
-    .duration-200 {
-      transition-duration: 0.2s;
-    }
-    .nav-item:hover {
-      transition-property: color;
-      transition-duration: 0.15s;
-      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-      font-family: "Anton";
-      background-color: #bb7fff;
-      border-radius: 42px;
-      color: #000000 !important;
-    }
-    .nav-item:hover .dropdown {
-      opacity: 1;
-      visibility: visible;
-    }
-
     .active-nav-item {
       font-size: 32px;
       font-family: "Anton";
@@ -469,55 +413,49 @@ onMounted( async () => {
       transition-duration: 0.3s;
       transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
       color: #000000 !important;
-      .dropdown {
+      &:hover {
-        position: absolute;
+        .dropdown {
-        top: 84px;
+          display: block;
-        left: 50%;
+        }
-        width: 100%;
-        background: rgba(0, 0, 0, 0.84);
-        border-radius: 0px 0px 12px 12px;
-        z-index: 1;
-        opacity: 0;
-        transform: translate(-50%, 0%);
-        visibility: hidden;
-        transition: all 0.3s ease-out;
       }
-      .dropdown ul {
+    }
+    .dropdown {
+      position: absolute;
+      top: 84px;
+      left: 50%;
+      width: 100%;
+      background: rgba(0, 0, 0, 0.84);
+      border-radius: 0px 0px 12px 12px;
+      z-index: 1;
+      transform: translate(-50%, 0%);
+      display: none;
+      transition: all 0.3s ease-out;
+      ul {
         list-style: none;
         margin: 0;
         padding: 0;
-      }
+        li {
-      .dropdown li {
+          padding-left: 20px;
-        padding-top: 10px;
+          padding-right: 20px;
-        padding-bottom: 10px;
+          cursor: pointer;
-        padding-left: 20px;
+          .link-content {
-        padding-right: 20px;
+            display: flex;
-        cursor: pointer;
+            text-align: center;
-      }
+            align-items: center;
-      .link-content {
+            justify-content: space-between;
-        display: flex;
+            a {
-        //  width: 150px;
+              font-size: 16px;
-        align-items: center;
+              font-family: Arial;
-        justify-content: space-between;
+              font-weight: 400;
-      }
+              color: #ffffff;
-      .link-label {
+              padding-top: 10px;
-        font-size: 16px;
+              padding-bottom: 10px;
-        font-family: Arial;
+              text-align: center; /* ensure text is centered */
-        font-weight: 400;
+              width: 100%; /* make it span the full width */
-        text-align: center;
+              cursor: pointer;
-        color: #ffffff;
+            }
-      }
+          }
-      .dropdown li a {
+        }
-        font-size: 16px;
-        font-family: Arial;
-        font-weight: 400;
-        color: #ffffff;
-      }
-      .dropdown li span {
-        font-size: 15px;
-        font-family: Arial;
-        font-weight: 400;
-        color: #ffffff;
       }
     }
   }

src/views/DetailView.vue

@@ -106,7 +106,8 @@
                 <div>Contract address</div>
                 <div class="contract-address">
                   <div>{{ detailData.nft.contract_address}}</div>
-                  <span><a :href="contractBlankUrl" target="_blank">{{ sliceAddress(detailData.nft.contract_address) }}</a></span>
+                  <span v-if="detailData.nft.type != 13"><a :href="contractBlankUrl" target="_blank">{{ sliceAddress(detailData.nft.contract_address) }}</a></span>
+                  <span v-else><a :href="founderBlankUrl" target="_blank">{{ sliceAddress(detailData.nft.contract_address) }}</a></span>
                 </div>
               </li>
               <li>
@@ -121,7 +122,8 @@
               </li>
               <li>
                 <div>Metadata</div>
-                <div><a :href="detailData.nft.meta_url" target="_blank">{{ sliceAddress(detailData.nft.meta_url) }}</a></div>
+                <div v-if="detailData.nft.type != 13"><a :href="detailData.nft.meta_url" target="_blank">{{ sliceAddress(detailData.nft.meta_url) }}</a></div>
+                <div v-else><a :href="founderBlankUrl" target="_blank">{{ sliceAddress(detailData.nft.meta_url) }}</a></div>
               </li>
               <li>
                 <div>Royalties</div>
@@ -234,6 +236,7 @@ const detailData = ref(null)
 const assetsDetailData = ref(null)
 const myAddress = localWalletStore.address
 const contractBlankUrl = ref()
+const founderBlankUrl = ref()
 const contractTokenUrl = ref()
 const nftAbilities = ref()
 const icon = ref('')
@@ -628,7 +631,9 @@ const mintHero = async () => {
 
 const getDetail = async () => {
   let { errcode, errmsg, data} = await nftDetail(props.address, props.tokenid)
+  console.log(data)
   contractBlankUrl.value = `${import.meta.env.VUE_APP_EXPLORER_URL}/address/${data.nft.contract_address}`
+  
   contractTokenUrl.value = `${import.meta.env.VUE_APP_EXPLORER_URL}/token/${data.nft.contract_address}/instance/${data.nft.token_id}`
   if (errcode) {
     // console.log(errmsg)
@@ -652,6 +657,7 @@ onMounted(() => {
     getDetail()
   } else {
     detailData.value = marketplaceList.detailData
+    founderBlankUrl.value = `https://etherscan.io/token/0xec23679653337d4c6390d0eeba682246a6067777?a=${detailData.value.nft.token_id}`
     nftAbilities.value = marketplaceList.detailData.nft.detail
   }
 })
@@ -926,12 +932,16 @@ onMounted(() => {
               position: relative;
               cursor: pointer;
               >div {
-                width: 520px;
+                width: 560px;
                 height: 40px;
+                border-radius: 10px;
+                line-height: 40px;
+                border: 1px solid #7e7686;
                 position: absolute;
                 top: -50px;
                 left: -50%;
-                background: #17141b;
+                text-align: center;
+                background: #282131;
                 color: #fff;
                 display: none;
               }