修改质押解除质押轮询

2024-07-24 10:40:38 +08:00 · 2024-07-24 10:40:38 +08:00 · 3c53269ca2
commit 3c53269ca2
parent b399e1ed4a
7 changed files with 235 additions and 75 deletions
--- a/src/components/Dialogs/confirmDialog.vue
+++ b/src/components/Dialogs/confirmDialog.vue
@ -111,14 +111,14 @@ function hideModal(result = null) {
    }
  }
  .cf-content-text {
-    width: 75%;
+    width: 78%;
    margin: 0 auto;
    margin-top: 10px;
    text-align: left;
    .cf-text {
      font-family: 'Poppins';
      font-weight: 500;
-      font-size: 30px;
+      font-size: 28px;
    }
  }
  .cf-btn-grid {
--- a/src/components/assets/activity.vue
+++ b/src/components/assets/activity.vue
@ -36,7 +36,7 @@ import Hero from "@/components/common/searchView/hero.vue"
 import Gold from "@/components/common/searchView/gold.vue"
 import Card from "@/components/common/convertCard.vue";
 import NftId from "@/configs/item.json"
-import { apiLockState } from "@/utils/marketplace"
+import { apiLockState, apiActivity } from "@/utils/marketplace"
 import {useMarketplaceStore} from "@/store/marketplace";
 import {walletStore} from "@/store/wallet";
 const marketplaceStore = useMarketplaceStore()
@ -114,13 +114,34 @@ const getMyAssets = async () => {
  // nftList.value = []
  const myADdress = localWalletStore.address
  // console.log(data)
+  const data = {
+    page_size: 20,
+    cursor: '',
+    search: {
+      name: '',
+    },
+    filter: {
+      item_ids: []
+    },
+    sort: {
+      fields: [
+        {
+          name: '',
+          type: 0
+        }
+      ]
+    }
+  }
  // return
+  // const address = import.meta.env.VUE_APP_EXPLORER_URL
  if(myADdress) {
    try {
      reqData.value.cursor = next_cursor.value.next_cursor
-      let res = await apiLockState(myADdress, reqData.value)
-      // return
-      nftList.value = [...nftList.value, ...res.rows]
+      // let res = await apiLockState(myADdress, reqData.value)
+      let res = await apiActivity(data, myADdress)
+      console.log(res,'--------------------------------')
+      return
+      // nftList.value = [...nftList.value, ...res.rows]
      // nftListBox = nftList.value.reduce((acc, obj) => {
      //   const existingObj = acc.find(item => item.token_id == obj.token_id)
      //   if(!existingObj) {
--- a/src/components/assets/assetsHeader.vue
+++ b/src/components/assets/assetsHeader.vue
@ -10,6 +10,7 @@
        <div class="total">
          <p>Total Contribution Credits:&nbsp; <span>{{ contributionPointTotal }}</span></p>
          <img src="@/assets/img/marketplace/totalContribution.png" alt="">
+          <img class="icon" @click="rulesDialogVisible = true" src="@/assets/img/marketplace/History.png" alt="">
        </div>
        <div class="day">
          <p>Daily Expected:&nbsp;&nbsp; <span>+{{ contributionPoint }}/d</span></p>
@ -222,20 +223,20 @@
            <li>
              <h4>Founder’s Tag</h4>
              <div class="hero-title">
-                <span>Tier</span>
+                <span>Rarity</span>
                <span>Daily contribution points</span>
              </div>
              <div class="hero-body">
                <div>
-                  <span>Tier 1</span>
+                  <span>Common</span>
                  <span>20</span>
                </div>
                <div>
-                  <span>Tier 2</span>
+                  <span>Rare</span>
                  <span>40</span>
                </div>
                <div>
-                  <span>Tier 3</span>
+                  <span>Legendary</span>
                  <span>100</span>
                </div>
                <div>
@ -291,7 +292,6 @@ const imageUrl = computed(() => {

 // 打开历史记录弹窗
 const receiveLog = () => {
-  console.log('----')
  logDialogVisible.value = true
 }

--- a/src/components/assets/myCard.vue
+++ b/src/components/assets/myCard.vue
@ -31,21 +31,32 @@
            <img src="@/assets/img/marketplace/totalContribution.png" alt="">
          </div>
        </div>
-        <div v-if="LOCKER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase() || FOUNDER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase()" class="link-staking" @click="unStake(nftData)">
-          <img src="@/assets/img/marketplace/Staking.png" alt="">
+        <div v-if="LOCKER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase() || FOUNDER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase()" class="link-staking">
+          <span v-if="nftData?.status">loading</span>
+          <img v-else src="@/assets/img/marketplace/Staking.png" @click="unStake(nftData)" alt="">
        </div>
-        <div v-if="LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase() && (nftData.type == 1 || nftData.type == 12) && nftData.on_sale == 0" class="link-below" @click="lockToGame('convert')">
-          Stake
+        <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>
        </div>
      </div>
    </div>
    <div class="card-btn" v-if="nftData.type != 13 && LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase()">
-      <div class="card-sell" v-if="nftData.on_sale == 0" @click="sellNft(nftData)">List</div>
+      <div class="card-sell" v-if="nftData.on_sale == 0">
+        <span v-if="nftData?.status">loading</span>
+        <span v-else @click="sellNft(nftData)">List</span>
+      </div>
      <div class="card-cancel" v-if="nftData.on_sale == 1" @click="cancelNft(nftData)">Cancel listing</div>
    </div>
    <div class="card-btn" v-else>
-      <div class="card-cancel" v-if="LOCKER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase() || FOUNDER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase()" @click="unStake(nftData)">Unstake</div>
-      <div class="card-sell" v-else @click="lockToGame('founder')">Stake</div>
+      <div class="card-cancel" v-if="LOCKER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase() || FOUNDER_ADDRESS.toLowerCase() == nftData.owner_address.toLowerCase()">
+        <span v-if="nftData?.status">loading</span>
+        <span @click="unStake(nftData)">Unstake</span>
+      </div>
+      <div class="card-sell" v-else>
+        <span v-if="nftData?.status">loading</span>
+        <span v-else @click="lockToGame('founder')">Stake</span>
+      </div>
    </div>
    <SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
    <LoadingDialog :loadingDialogVisible="loadingDialogVisible" />
@ -56,7 +67,7 @@
 import { ref, toRaw, onMounted, getCurrentInstance, inject } from "vue"
 const message = inject('$message')
 import SellDialog from "@/components/Dialogs/sellDialog.vue"
-import { apiGetPrice, nftDetail } from "@/utils/marketplace"
+import { apiGetPrice, nftDetail, apiTxHash } from "@/utils/marketplace"
 import ImgCard from "@/components/common/imgCard.vue"
 import LoadingDialog from "@/components/Dialogs/loadingDialog.vue"
 import { priceCalculated } from "@/configs/priceCalculate"
@ -173,14 +184,28 @@ const lockToGameConfirm = async () => {
    const bc = new BlockChain()
    let res = await bc.locker.lock(toRaw(props.nftData).contract_address, [toRaw(props.nftData).token_id])
    // message.success('lockToGame success')
+    toRaw(props.nftData)['status'] = 1
    const confirmResult = await createModal(ConfirmDialog, {
      title: '', 
      noBtnTitle: '',
      message: 'Staking is complete. This process may take 3-4 minutes.'
    }).show()
-    // router.go(-1)
-    emit('renewMyNft')
    loadingDialogVisible.value = false
+    if(res) {
+      try {
+        const {errcode, errmsg, confirmed} = await apiTxHash([toRaw(props.nftData).net_id], res)
+        let timer = setInterval(() => {
+          if(confirmed == 1) {
+            toRaw(props.nftData)['status'] = ''
+            emit('renewMyNft')
+            clearInterval(timer);
+          }
+        }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
+    }
+    // // router.go(-1)
    // router.push('/assets')
  } catch (e) {
    if(e.message.indexOf('rejected') > -1) {
@ -197,16 +222,29 @@ const unlockMainConfirm = async () => {
    const bc = new BlockChain()
    let res = await bc.locker.lockMain(toRaw(props.nftData).contract_address, [toRaw(props.nftData).token_id])
    // message.success('lockToGame success')
+    toRaw(props.nftData)['status'] = 1
    const confirmResult = await createModal(ConfirmDialog, {
      title: '', 
      noBtnTitle: '',
      message: 'Staking is complete. This process may take 3-4 minutes.'
    }).show()
-    // router.go(-1)
-    emit('renewMyNft')
    loadingDialogVisible.value = false
-    // router.push('/assets')
+    if(res) {
+      try {
+        const {errcode, errmsg, confirmed} = await apiTxHash([toRaw(props.nftData).net_id], res)
+        let timer = setInterval(() => {
+          if(confirmed == 1) {
+            toRaw(props.nftData)['status'] = ''
+            emit('renewMyNft')
+            clearInterval(timer);
+          }
+        }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
+    }
  } catch (e) {
+    console.log(e)
    if(e.message.indexOf('rejected') > -1) {
      message.error('User rejected the request')
    } else {
@ -251,18 +289,26 @@ const heroLock = async (data) => {
  try {
    const bc = new BlockChain()
    let res = await bc.locker.unlockOrMintGameNft(toRaw(data).contract_address,[toRaw(data).token_id])
+    toRaw(props.nftData)['status'] = 1
+    const confirmResult = await createModal(ConfirmDialog, {
+      title: '', 
+      noBtnTitle: '',
+      message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
+    }).show()
+    loadingDialogVisible.value = false
    if(res) {
-      let timer = setTimeout( async () => {
-        // message.success('Unstake success.')
-        const confirmResult = await createModal(ConfirmDialog, {
-          title: '', 
-          noBtnTitle: '',
-          message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
-        }).show()
-        loadingDialogVisible.value = false
-        emit('renewMyNft')
-        clearTimeout(timer);
+      try {
+        const {errcode, errmsg, confirmed} = await apiTxHash(toRaw(props.nftData).net_id, res)
+        let timer = setInterval( async () => {
+        if(confirmed == 1) {
+          toRaw(props.nftData)['status'] = ''
+          emit('renewMyNft')
+          clearInterval(timer);
+        }
      }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
    }
  } catch (e) {
    console.log(e)
@ -281,28 +327,39 @@ const founderLock = async (data) => {
  try {
    const bc = new BlockChain()
    let res = await bc.locker.unlockMain(data.contract_address,[data.token_id])
+    toRaw(props.nftData)['status'] = 1
+    const confirmResult = await createModal(ConfirmDialog, {
+      title: '', 
+      noBtnTitle: '',
+      message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
+    }).show()
+    loadingDialogVisible.value = false
    if(res) {
-      let timer = setTimeout( async () => {
-        // message.success('Unstake success.')
-        const confirmResult = await createModal(ConfirmDialog, {
-          title: '', 
-          noBtnTitle: '',
-          message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
-        }).show()
-        loadingDialogVisible.value = false
-        emit('renewMyNft')
-        clearTimeout(timer);
+      try {
+        const {errcode, errmsg, confirmed} = await apiTxHash(toRaw(props.nftData).net_id, res)
+        let timer = setInterval( async () => {
+        if(confirmed == 1) {
+          toRaw(props.nftData)['status'] = ''
+          emit('renewMyNft')
+          clearInterval(timer);
+        }
      }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
    }
  } catch (e) {
-    console.log(e);
    loadingDialogVisible.value = false
    if(e.message.indexOf('rejected') > -1) {
      message.error('User rejected the request')
    } else if (e.message.indexOf('select wallet') > -1) {
      message.error('user cancel select wallet')
    } else if (e.message.indexOf('eoa address changed') > -1) {
-      message.error("It looks like there's an issue with your MetaMask or OKX wallet address. Please check your wallet address and try again")
+      const confirmResult = await createModal(ConfirmDialog, {
+        title: '', 
+        noBtnTitle: '',
+        message: "It looks like there's an issue with your MetaMask or OKX wallet address. Please check your wallet address and try again."
+      }).show()
    } else {
      message.error('Unstake fail')
    }
@ -475,6 +532,11 @@ onMounted(() => {
      background: #1778f1;
      border-radius: 12px;
      text-align: center;
+      span {
+        display: inline-block;
+        width: 100%;
+        height: 100%;
+      }
    }
    .card-sell, .card-cancel {
      width: 100%;
--- a/src/components/chain/utils.js
+++ b/src/components/chain/utils.js
@ -199,6 +199,10 @@ export const switchEthereumChain = async (provider, targetChainId) => {
        provider.removeListener('chainChanged', onChainChange)
        deferred.reject(addError)
      }
+    } else {
+      console.error('error add chain: ', e.message)
+      provider.removeListener('chainChanged', onChainChange)
+      deferred.reject(e)
    }
  }
  return deferred.promise
--- a/src/utils/marketplace.js
+++ b/src/utils/marketplace.js
@ -147,3 +147,15 @@ export const apiUserData = async (account_address) => {
  const url = `${API_BASE}/api/user/${account_address}`
  return httpGet(url, {})
 }
+
+// 轮询状态
+export const apiTxHash = async (net_id, account_address) => {
+  const url = `${API_BASE}/api/chain/txhash/${net_id}/${account_address}`
+  return httpGet(url, {})
+}
+
+// 活动交易记录
+export const apiActivity = async (data, account_address) => {
+  const url = `${API_BASE}/api/chain/activity/${account_address}`
+  return httpPost(url, data)
+}
--- a/src/views/DetailView.vue
+++ b/src/views/DetailView.vue
@ -49,7 +49,12 @@
            </div>
            <div class="top-right-btns">
              <div v-if="FOUNDER_ADDRESS.toLowerCase() == detailData.nft.owner_address.toLowerCase() || LOCKER_ADDRESS.toLowerCase() == detailData.nft.owner_address.toLowerCase()">
-                <div class="cancel" @click="localWalletStore.token == '' ? cardLogin() : backStaking()">Unstake</div>
+                <div class="cancel" v-if="detailData.nft?.status == 1">
+                  <span>Loading</span>
+                </div>
+                <div class="cancel" v-else>
+                  <span @click="localWalletStore.token == '' ? cardLogin() : backStaking()">Unstake</span>
+                </div>
              </div>
              <div v-if="(detailData.nft.type == 1 && !detailData.nft.contract_address) && LOCKER_ADDRESS.toLowerCase() != detailData.nft.owner_address.toLowerCase()">
                <div class="mint" @click="mintHero">Mint</div>
@ -77,11 +82,18 @@
              2、下架
              3、使用
              -->
-              <div v-if="myAddress == detailData.nft.owner_address">
+              <div v-if="myAddress == detailData.nft.owner_address && detailData.nft?.status != 1">
                <div class="sell" @click="beginSell" v-if="detailData.nft.on_sale == 0 && detailData.nft.type != 13">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 || detailData.nft.type == 12)">Stake</div>
-                <div class="redeem" @click="lockToGame('founder')" v-else-if="detailData.nft.type == 13">Stake</div>
+                <div v-if="detailData.nft?.status == 1" class="cancel">
+                  <span>Loading</span>
+                </div>
+                <div class="redeem" v-else-if="detailData.nft.on_sale == 0 && (detailData.nft.type == 1 || detailData.nft.type == 12)">
+                  <span @click="lockToGame('convert')">Stake</span>
+                </div>
+                <div class="redeem" v-else-if="detailData.nft.type == 13">
+                  <span @click="lockToGame('founder')">Stake</span>
+                </div>
                <!-- <div class="redeem" @click="lockToGame('redeem')" v-if="detailData.nft.on_sale == 0 && detailData.nft.type == 11">Redeem</div> -->
              </div>
            </div>
@ -197,7 +209,7 @@ import ImgCard from "@/components/common/imgCard.vue"
 import StarTimer from "@/components/common/starTimer.vue"
 import SellDialog from "@/components/Dialogs/sellDialog.vue"
 import Footer from "@/components/common/footer.vue"
-import { nftDetail, apiGetPrice } from "@/utils/marketplace"
+import { nftDetail, apiGetPrice, apiTxHash } from "@/utils/marketplace"
 import {priceCalculated} from "@/configs/priceCalculate.js"
 import { BlockChain } from "@/components/chain/BlockChain"
 import {walletStore} from "@/store/wallet";
@ -336,13 +348,28 @@ const lockToGameConfirm = async () => {
  try {
    await new BlockChain().locker.lock(detailData.value.nft.contract_address, [detailData.value.nft.token_id])
    // message.success('lockToGame success')
+    detailData.value.nft['status'] = 1
    const confirmResult = await createModal(ConfirmDialog, {
      title: '', 
      noBtnTitle: '',
      message: 'Staking is complete. This process may take 3-4 minutes.'
    }).show()
    loadingDialogVisible.value = false
-    router.go(-1)
+    if(res) {
+      try {
+        const { confirmed } = await apiTxHash(detailData.value.nft.net_id, res)
+        let timer = setInterval( async () => {
+          // message.success('Unstake success.')
+          if(confirmed == 1) {
+            detailData.value.nft['status'] = ''
+            router.go(-1)
+            clearInterval(timer);
+          }
+        }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
+    }
  } catch (e) {
    if(e.message.indexOf('rejected') > -1) {
      message.error('User rejected the request')
@ -356,16 +383,28 @@ const unlockMainConfirm = async () => {
  try {
    const bc = new BlockChain()
    let res = await bc.locker.lockMain(detailData.value.nft.contract_address, [detailData.value.nft.token_id])
-    // message.success('lockToGame success')
+    detailData.value.nft['status'] = 1
    const confirmResult = await createModal(ConfirmDialog, {
      title: '', 
      noBtnTitle: '',
      message: 'Staking is complete. This process may take 3-4 minutes.'
    }).show()
-    // router.go(-1)
-    emit('renewMyNft')
    loadingDialogVisible.value = false
-    // router.push('/assets')
+    if(res) {
+      try {
+        const { confirmed } = await apiTxHash(detailData.value.nft.net_id, res)
+        let timer = setInterval( async () => {
+          // message.success('Unstake success.')
+          if(confirmed == 1) {
+            detailData.value.nft['status'] = ''
+            router.go(-1)
+            clearInterval(timer);
+          }
+        }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
+    }
  } catch (e) {
    if(e.message.indexOf('rejected') > -1) {
      message.error('User rejected the request')
@ -397,18 +436,27 @@ const heroLock = async () => {
  try {
    const bc = new BlockChain()
    let res = await bc.locker.unlockOrMintGameNft(detailData.value.nft.contract_address,[detailData.value.nft.token_id])
+    detailData.value.nft['status'] = 1
+    const confirmResult = await createModal(ConfirmDialog, {
+      title: '', 
+      noBtnTitle: '',
+      message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
+    }).show()
+    loadingDialogVisible.value = false
    if(res) {
-      let timer = setTimeout( async () => {
+      try {
+        const { confirmed } = await apiTxHash(detailData.value.nft.net_id, res)
+        let timer = setInterval( async () => {
        // message.success('Unstake success.')
-        const confirmResult = await createModal(ConfirmDialog, {
-          title: '', 
-          noBtnTitle: '',
-          message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
-        }).show()
-        loadingDialogVisible.value = false
-        router.go(-1)
-        clearTimeout(timer);
+        if( confirmed) {
+          detailData.value.nft['status'] = ''
+          router.go(-1)
+          clearInterval(timer);
+        }
      }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
    }
  } catch (e) {
    loadingDialogVisible.value = false
@ -426,18 +474,27 @@ const founderLock = async () => {
  try {
    const bc = new BlockChain()
    let res = await bc.locker.unlockMain(detailData.value.nft.contract_address,[detailData.value.nft.token_id])
+    detailData.value.nft['status'] = 1
+    const confirmResult = await createModal(ConfirmDialog, {
+      title: '', 
+      noBtnTitle: '',
+      message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
+    }).show()
+    loadingDialogVisible.value = false
    if(res) {
-      let timer = setTimeout( async () => {
+      try {
+        const { confirmed } = await apiTxHash(detailData.value.nft.net_id, res)
+        let timer = setInterval( async () => {
        // message.success('Unstake success.')
-        const confirmResult = await createModal(ConfirmDialog, {
-          title: '', 
-          noBtnTitle: '',
-          message: 'Unstake success. It is expected to take 3-4 minutes. Please log in to the original wallet address to check later.'
-        }).show()
-        loadingDialogVisible.value = false
-        router.go(-1)
-        clearTimeout(timer);
+        if( confirmed) {
+          detailData.value.nft['status'] = ''
+          router.go(-1)
+          clearInterval(timer);
+        }
      }, 2000);
+      } catch (e) {
+        console.log(e)
+      }
    }
  } catch (e) {
    loadingDialogVisible.value = false
@ -446,7 +503,11 @@ const founderLock = async () => {
    } else if (e.message.indexOf('select wallet') > -1) {
      message.error('user cancel select wallet')
    } else if (e.message.indexOf('eoa address changed') > -1) {
-      message.error("It looks like there's an issue with your MetaMask or OKX wallet address. Please check your wallet address and try again")
+      const confirmResult = await createModal(ConfirmDialog, {
+        title: '', 
+        noBtnTitle: '',
+        message: "It looks like there's an issue with your MetaMask or OKX wallet address. Please check your wallet address and try again."
+      }).show()
    } else {
      message.error('Unstake fail')
    }