From 2bd2df4fabf9e213a9dd611cc2f7f7854665f635 Mon Sep 17 00:00:00 2001
From: CounterFire2023 <136581895+CounterFire2023@users.noreply.github.com>
Date: Tue, 25 Jun 2024 10:36:47 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=AF=A6=E6=83=85=E9=A1=B5?=
 =?UTF-8?q?=E7=9A=84=E4=BC=A0=E5=8F=82=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/assets/card.vue |  9 +++---
 src/views/DetailView.vue       | 53 ++++++++++------------------------
 2 files changed, 21 insertions(+), 41 deletions(-)

diff --git a/src/components/assets/card.vue b/src/components/assets/card.vue
index e7e76ab..a4d15b5 100644
--- a/src/components/assets/card.vue
+++ b/src/components/assets/card.vue
@@ -31,11 +31,10 @@
 <script setup>
 import { ref, toRaw, onMounted, getCurrentInstance } from "vue"
 // import BuyDialog from "@/components/Dialogs/buyDialog.vue"
-import { useDetailStore } from "@/store/detail"
+
 import {
   apiAddCartList
 } from "@/utils/marketplace"
-const detailData = useDetailStore()
 import { useRouter } from "vue-router";
 import { BlockChain } from "@/components/chain/BlockChain"
 const router = useRouter();
@@ -72,8 +71,10 @@ const getImageUrl = (name) => {
 
 // 去详情页面
 const toDetail = () => {
-  detailData.nftData = toRaw(props.nftData)
-  router.push('/detail');
+  // detailData.nftData = toRaw(props.nftData)
+  // router.push('/detail');
+  const nftData = toRaw(props.nftData)
+  router.push({name: 'Detail', state: { nftData }});
 }
 
 // 添加购物车
diff --git a/src/views/DetailView.vue b/src/views/DetailView.vue
index b843cc7..3d20e15 100644
--- a/src/views/DetailView.vue
+++ b/src/views/DetailView.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="detail">
     <div class="detail-bg"></div>
-    <div v-if="detailData.nftData" class="detail-content">
+    <div v-if="detailData" class="detail-content">
       <div class="content">
         <div class="top-left">
           <div class="top-left-img">
@@ -12,19 +12,19 @@
           <h2>Item name</h2>
           <div class="top-right-owner">
             <div>Owner:</div>
-            <div class="address">{{ sliceAddress(detailData.nftData.nft.owner_address) }}</div>
+            <div class="address">{{ sliceAddress(detailData.owner_address) }}</div>
           </div>
-          <div class="top-right-price">
+          <div class="top-right-price" v-if="detailData.event">
             <li>
               <div>Price</div>
               <div class="time">
                 <img src="@/assets/img/marketplace/time.png" alt="图片">
-                <div>Time remaining: &nbsp;<StarTimer :getAddress="detailData.nftData.event.data.end_at" /></div>
+                <div>Time remaining: &nbsp;<StarTimer :getAddress="detailData.event.data.end_at" /></div>
               </div>
             </li>
             <li>
               <div class="price">
-                <span class="bold">{{ priceWei(detailData.nftData.event.data.buy[0].amount) }}&nbsp;</span>
+                <span class="bold">{{ priceWei(detailData.event.data.buy[0].amount) }}&nbsp;</span>
                 <img src="@/assets/img/marketplace/ETHicon.png" alt="ICON">
                 <span>( $ 37.64 )</span>
               </div>
@@ -37,7 +37,7 @@
             3、购买
             4、
             -->
-            <div v-if="myAddress != detailData.nftData.nft.owner_address">
+            <div v-if="myAddress != detailData.owner_address">
               <div class="buy" @click="buyNow">Buy Now</div>
               <div class="add">
                 <span>Add to cart </span>
@@ -67,11 +67,11 @@
             <h2>Info</h2>
             <li>
               <div>Contract address</div>
-              <div>{{ sliceAddress(detailData.nftData.nft.contract_address) }}</div>
+              <div>{{ sliceAddress(detailData.contract_address) }}</div>
             </li>
             <li>
               <div>Token ID</div>
-              <div>{{ detailData.nftData.nft.token_id }}</div>
+              <div>{{ detailData.token_id }}</div>
             </li>
             <li>
               <div>Blockchain</div>
@@ -79,7 +79,7 @@
             </li>
             <li>
               <div>Metadata</div>
-              <div><a :href="detailData.nftData.nft.meta_url" target="_blank">{{ sliceAddress(detailData.nftData.nft.meta_url) }}</a></div>
+              <div><a :href="detailData.meta_url" target="_blank">{{ sliceAddress(detailData.meta_url) }}</a></div>
             </li>
             <li>
               <div>Royalties</div>
@@ -141,40 +141,19 @@
 import { ref, toRaw, onMounted } from "vue"
 import StarTimer from "@/components/common/starTimer.vue"
 import { apiDetail } from "@/utils/marketplace"
-import { useDetailStore } from "@/store/detail"
-const detailData = useDetailStore()
-console.log(toRaw(detailData.nftData))
+import {walletStore} from "@/store/wallet";
 import { BlockChain } from "@/components/chain/BlockChain"
-// const nftData = ref()
-const myAddress = localStorage.getItem("assessAddress")
-const nftAbilities = ref(detailData.nftData.nft.detail)
-// const newAbilitiesName = (data) => {
-//   const newName = {
-//     Tier: "",
-//     Active Days: "",
-//     Tier: "",
-//     Tier: "",
-//     Tier: "",
-//     Tier: "",
-//     Tier: "",
-//     Tier: "",
-//   }
-// }
+const localWalletStore = walletStore()
+const detailData = window.history.state.nftData
+console.log(detailData)
 
-
-// const formatAddress = computed(() => {
-//   const accountId = localStorage.getItem('assessAddress');
-//   if (!accountId) return "-";
-//   if (accountId.length >= 10) {
-//     return `${accountId.substring(0, 6)}......${accountId.slice(-4)}`;
-//   }
-//   return accountId;
-// });
+const myAddress = localWalletStore.address
+const nftAbilities = ref(detailData.detail)
 
 // 购买
 const buyNow = async () => {
   let tokenIds = []
-  tokenIds.push(detailData.nftData.nft.token_id)
+  tokenIds.push(detailData.token_id)
   console.log(tokenIds)
 
   console.log(await new BlockChain().market.batchBuy(tokenIds))