From 63eda1f879e161fbeba56d5a8ac4e07745b4bdd4 Mon Sep 17 00:00:00 2001 From: CounterFire2023 <136581895+CounterFire2023@users.noreply.github.com> Date: Tue, 25 Jun 2024 12:59:22 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0nft=E9=94=81=E5=AE=9A?= =?UTF-8?q?=E5=88=B0locker=E5=90=88=E7=BA=A6(=E4=B8=8B=E9=93=BE)=E6=96=B9?= =?UTF-8?q?=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.dev | 3 +- src/components/assets/collectibles.vue | 5 ++-- src/components/assets/hanging.vue | 4 ++- src/components/assets/trading.vue | 4 ++- src/components/chain/BlockChain.js | 2 ++ src/components/chain/contract/Locker.js | 38 +++++++++++++++++++++++++ src/components/layout/NavBar.vue | 2 +- src/views/DetailView.vue | 35 +++++++++++++---------- 8 files changed, 72 insertions(+), 21 deletions(-) create mode 100644 src/components/chain/contract/Locker.js diff --git a/.env.dev b/.env.dev index 74ba3b9..40f51db 100644 --- a/.env.dev +++ b/.env.dev @@ -12,4 +12,5 @@ VUE_APP_PASSPORT_MARKET_ADDRESS=0x7d117aA8BD6D31c4fa91722f246388f38ab1942c VUE_APP_MKT_API='https://market-test.kingsome.cn' VUE_APP_NET_ID='13473' VUE_APP_MARKET_CURRENCY='0xFd42bfb03212dA7e1A4608a44d7658641D99CF34' -VUE_APP_MAKEFEE_ADDRESS='0x50A8e60041A206AcaA5F844a1104896224be6F39' \ No newline at end of file +VUE_APP_MAKEFEE_ADDRESS='0x50A8e60041A206AcaA5F844a1104896224be6F39' +VUE_APP_LOCKER_ADDRESS='0x59e751c2037B710090035B6ea928e0cce80aC03f' \ No newline at end of file diff --git a/src/components/assets/collectibles.vue b/src/components/assets/collectibles.vue index 26bc5a6..86ba94f 100644 --- a/src/components/assets/collectibles.vue +++ b/src/components/assets/collectibles.vue @@ -50,9 +50,10 @@ import Status from "@/components/common/searchView/status.vue"; import Card from "./card.vue"; import NftId from "@/configs/item.json" import { apiAssetsState } from "@/utils/marketplace" +import {walletStore} from "@/store/wallet"; import { useCollectiblesStore } from "@/store/collectibles" const marketplaceList = useCollectiblesStore() - +const localWalletStore = walletStore() const nftList = ref([]) const filterList = ref() @@ -73,7 +74,7 @@ const statusChild = (val) => { } const getMyAssets = async () => { - const myADdress = localStorage.getItem('assessAddress') + const myADdress = localWalletStore.address const data = { type: '0', page_size: '20', diff --git a/src/components/assets/hanging.vue b/src/components/assets/hanging.vue index 2e2360c..360a629 100644 --- a/src/components/assets/hanging.vue +++ b/src/components/assets/hanging.vue @@ -51,6 +51,8 @@ import Status from "@/components/common/searchView/status.vue"; import Card from "@/components/common/hangingCard.vue"; import { apiHangingState } from "@/utils/marketplace" import { useHangingStore } from "@/store/hanging" +import {walletStore} from "@/store/wallet"; +const localWalletStore = walletStore() const marketplaceList = useHangingStore() const nftList = ref([]) @@ -73,7 +75,7 @@ const statusChild = (val) => { } const getHistoryList = async () => { - const myAddress = localStorage.getItem('assessAddress') + const myAddress = localWalletStore.address const data = { type: '1', page_size: '20', diff --git a/src/components/assets/trading.vue b/src/components/assets/trading.vue index 46d07cf..4e280d1 100644 --- a/src/components/assets/trading.vue +++ b/src/components/assets/trading.vue @@ -50,6 +50,8 @@ import Status from "@/components/common/searchView/status.vue"; import Card from "@/components/common/card.vue"; import { apiHistoryState } from "@/utils/marketplace" import { useTradingStore } from "@/store/trading" +import {walletStore} from "@/store/wallet"; +const localWalletStore = walletStore() const marketplaceList = useTradingStore() const nftList = ref([]) @@ -75,7 +77,7 @@ const clearAll = () => { } const getHistoryList = async () => { - const myAddress = localStorage.getItem('assessAddress') + const myAddress = localWalletStore.address let res = await apiHistoryState(myAddress) } diff --git a/src/components/chain/BlockChain.js b/src/components/chain/BlockChain.js index 8955fe2..aec0350 100644 --- a/src/components/chain/BlockChain.js +++ b/src/components/chain/BlockChain.js @@ -6,6 +6,7 @@ import WalletSelectModel from "@/components/chain/WalletSelectModel.vue"; import {createModal} from "@/utils/model.util"; import {ImtblMarket} from "@/components/chain/Market"; import { ALL_PROVIDERS } from "@/configs/configchain"; +import {Locker} from "@/components/chain/contract/Locker"; export const allProviders = { 1: MetaMaskWallet, @@ -22,6 +23,7 @@ export class BlockChain { this.store.$hydrate({runHooks: false}); this.initWallet(); this.market = new ImtblMarket() + this.locker = new Locker(this) BlockChain.instance = this; } diff --git a/src/components/chain/contract/Locker.js b/src/components/chain/contract/Locker.js new file mode 100644 index 0000000..e15ff38 --- /dev/null +++ b/src/components/chain/contract/Locker.js @@ -0,0 +1,38 @@ + +import { ethers } from 'ethers' + +const lockAbi = [ + 'function lock(address nft, uint256[] tokenIds) external' +] + +const erc721Abi = [ + 'function approve(address to, uint256 tokenId) external', + 'function getApproved(uint256 tokenId) public view returns (address)' +] + +const lockAddress = import.meta.env.VUE_APP_LOCKER_ADDRESS + +export class Locker { + + constructor(_chainInstance) { + this.bc = _chainInstance + } + + async lock(nft, tokenIds) { + // call single method with abi and address + console.log('lock nft', nft, tokenIds) + const nftContract = new ethers.Contract(nft, erc721Abi, this.bc.provider.getSigner()) + for (let tokenId of tokenIds) { + const addressApproval = await nftContract.getApproved(tokenId) + if ((addressApproval || "").toLowerCase() != lockAddress.toLowerCase()) { + const resApproval = await nftContract.approve(lockAddress, tokenId); + await this.bc.provider.waitForTransaction(resApproval.hash) + console.debug('approve', resApproval.hash) + } + } + const contract = new ethers.Contract(lockAddress, lockAbi, this.bc.provider.getSigner()) + const res = await contract.lock(nft, tokenIds) + await this.bc.provider.waitForTransaction(res.hash) + return res.hash + } +} \ No newline at end of file diff --git a/src/components/layout/NavBar.vue b/src/components/layout/NavBar.vue index 0258fd2..e7431ab 100644 --- a/src/components/layout/NavBar.vue +++ b/src/components/layout/NavBar.vue @@ -156,7 +156,7 @@ const message = copied.value ? "Text copied!" : "Click the button to copy text."; const formatAddress = computed(() => { - const accountId = localStorage.getItem('assessAddress'); + const accountId = localWalletStore.address if (!accountId) return "-"; if (accountId.length >= 10) { return `${accountId.substring(0, 6)}......${accountId.slice(-6)}`; diff --git a/src/views/DetailView.vue b/src/views/DetailView.vue index 3d20e15..83073ca 100644 --- a/src/views/DetailView.vue +++ b/src/views/DetailView.vue @@ -37,7 +37,7 @@ 3、购买 4、 --> -
+
Buy Now
Add to cart @@ -58,9 +58,9 @@ 3、使用 -->
-
上架
-
下架
-
使用
+
上架
+
下架
+
使用
@@ -141,31 +141,36 @@ import { ref, toRaw, onMounted } from "vue" import StarTimer from "@/components/common/starTimer.vue" import { apiDetail } from "@/utils/marketplace" -import {walletStore} from "@/store/wallet"; import { BlockChain } from "@/components/chain/BlockChain" +import {walletStore} from "@/store/wallet"; const localWalletStore = walletStore() const detailData = window.history.state.nftData console.log(detailData) - const myAddress = localWalletStore.address const nftAbilities = ref(detailData.detail) // 购买 const buyNow = async () => { - let tokenIds = [] - tokenIds.push(detailData.token_id) - console.log(tokenIds) - - console.log(await new BlockChain().market.batchBuy(tokenIds)) - return + let tokenIds = [detailData.event.data.id] try { - let res = await batchBuy(tokenIds) - console.log(rse) + await new BlockChain().market.batchBuy(tokenIds) + console.log('buy success') } catch (e) { - console.log(e) + console.log('buy fail', e.message) } } +const lockToGame = async() => { + try { + await new BlockChain().locker.lock(detailData.contract_address, [detailData.token_id]) + console.log('lockToGame success') + router.go(-1) + } catch (e) { + console.log('lockToGame fail', e.message) + } + +} + // 处理地址 const sliceAddress = (address) => { if (!address) return "-";