修改herder Table路由
This commit is contained in:
parent
15715d28cf
commit
f681c24e5b
@ -37,8 +37,12 @@
|
|||||||
</div>
|
</div>
|
||||||
<div v-if="LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase() && (nftData.type == 1 || nftData.type == 12) && nftData.on_sale == 0" class="link-below">
|
<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-if="nftData?.status">loading</span>
|
||||||
<span v-else @click="lockToGame('convert')">Stake</span>
|
<span v-else @click="lockToGame(nftData)">Stake</span>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
<div class="card-btn" v-if="nftData.type != 13 && LOCKER_ADDRESS.toLowerCase() != nftData.owner_address.toLowerCase()">
|
<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 v-if="nftData?.status">loading</span>
|
||||||
<span @click="unStake(nftData)">Unstake</span>
|
<span @click="unStake(nftData)">Unstake</span>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="card-sell" v-else>
|
<div class="card-sell" v-else>
|
||||||
<span v-if="nftData?.status">loading</span>
|
<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>
|
</div>
|
||||||
<SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
|
<SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
|
||||||
<LoadingDialog :loadingDialogVisible="loadingDialogVisible" />
|
<LoadingDialog :loadingDialogVisible="loadingDialogVisible" />
|
||||||
@ -158,8 +162,8 @@ const cancelNft = async (val) => {
|
|||||||
|
|
||||||
const loadingDialogVisible = ref(false)
|
const loadingDialogVisible = ref(false)
|
||||||
// 下链使用
|
// 下链使用
|
||||||
const lockToGame = async(type) => {
|
const lockToGame = async(data) => {
|
||||||
if(type == 'founder') {
|
if(data.type == 13) {
|
||||||
const confirmResult = await createModal(ConfirmDialog, {
|
const confirmResult = await createModal(ConfirmDialog, {
|
||||||
title: '',
|
title: '',
|
||||||
message: `Are you sure you want to stake?`
|
message: `Are you sure you want to stake?`
|
||||||
@ -168,7 +172,7 @@ const lockToGame = async(type) => {
|
|||||||
loadingDialogVisible.value = true
|
loadingDialogVisible.value = true
|
||||||
unlockMainConfirm()
|
unlockMainConfirm()
|
||||||
}
|
}
|
||||||
} else if(type == 'convert') {
|
} else {
|
||||||
const confirmResult = await createModal(ConfirmDialog, {
|
const confirmResult = await createModal(ConfirmDialog, {
|
||||||
title: '',
|
title: '',
|
||||||
message: 'Are you sure you want to stake?'
|
message: 'Are you sure you want to stake?'
|
||||||
@ -391,6 +395,7 @@ const sellHandleClose = (val) => {
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
cardPrice(toRaw(props.nftData))
|
cardPrice(toRaw(props.nftData))
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -7,18 +7,18 @@
|
|||||||
<div class="nft-img">
|
<div class="nft-img">
|
||||||
<ImgCard :nftData="nft" />
|
<ImgCard :nftData="nft" />
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</a-table-column>
|
</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="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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</a-table-column>
|
</a-table-column>
|
||||||
@ -26,7 +26,12 @@
|
|||||||
<template #default="{ text: nft }">
|
<template #default="{ text: nft }">
|
||||||
<div class="quantity">
|
<div class="quantity">
|
||||||
<div v-if="nft.detail.quality" class="nft-quantity">{{ nft.detail.quality }}</div>
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</a-table-column>
|
</a-table-column>
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
<a-radio value="0">All</a-radio>
|
<a-radio value="0">All</a-radio>
|
||||||
<a-radio value="1">Listed</a-radio>
|
<a-radio value="1">Listed</a-radio>
|
||||||
<a-radio value="2">Unlisted</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>
|
</a-radio-group>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -145,7 +145,7 @@ const navList = reactive([
|
|||||||
name: "ASSETS",
|
name: "ASSETS",
|
||||||
path: "/assets",
|
path: "/assets",
|
||||||
submenu: [
|
submenu: [
|
||||||
{ label: "Before 2024", link: "https://pledge.kingsome.cn" },
|
{ label: "Before 2024", link: "https://pledge.counterfire.games" },
|
||||||
{
|
{
|
||||||
label: "After 2024",
|
label: "After 2024",
|
||||||
path: "/assets",
|
path: "/assets",
|
||||||
@ -157,18 +157,23 @@ const navList = reactive([
|
|||||||
name: "NOTICE",
|
name: "NOTICE",
|
||||||
path: "/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,
|
// id: 6,
|
||||||
// name: "STAKE",
|
// name: "STAKE",
|
||||||
@ -211,6 +216,8 @@ function handNavCurent(nav) {
|
|||||||
router.push(nav.path);
|
router.push(nav.path);
|
||||||
// } else if(nav.id == 6) {
|
// } else if(nav.id == 6) {
|
||||||
// window.open(nav.path, "_blank");
|
// 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) {
|
// if (nav.id == 1 || nav.id == 2 || nav.id == 3) {
|
||||||
// window.open(nav.path, "_blank");
|
// window.open(nav.path, "_blank");
|
||||||
@ -380,69 +387,7 @@ onMounted( async () => {
|
|||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
color: #bb7fff !important;
|
color: #bb7fff !important;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
.dropdown {
|
&:hover {
|
||||||
position: absolute;
|
|
||||||
top: 84px;
|
|
||||||
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 {
|
|
||||||
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-property: color;
|
||||||
transition-duration: 0.15s;
|
transition-duration: 0.15s;
|
||||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
@ -450,12 +395,11 @@ onMounted( async () => {
|
|||||||
background-color: #bb7fff;
|
background-color: #bb7fff;
|
||||||
border-radius: 42px;
|
border-radius: 42px;
|
||||||
color: #000000 !important;
|
color: #000000 !important;
|
||||||
|
.dropdown {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.nav-item:hover .dropdown {
|
|
||||||
opacity: 1;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.active-nav-item {
|
.active-nav-item {
|
||||||
font-size: 32px;
|
font-size: 32px;
|
||||||
font-family: "Anton";
|
font-family: "Anton";
|
||||||
@ -469,6 +413,12 @@ onMounted( async () => {
|
|||||||
transition-duration: 0.3s;
|
transition-duration: 0.3s;
|
||||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
color: #000000 !important;
|
color: #000000 !important;
|
||||||
|
&:hover {
|
||||||
|
.dropdown {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.dropdown {
|
.dropdown {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 84px;
|
top: 84px;
|
||||||
@ -477,47 +427,35 @@ onMounted( async () => {
|
|||||||
background: rgba(0, 0, 0, 0.84);
|
background: rgba(0, 0, 0, 0.84);
|
||||||
border-radius: 0px 0px 12px 12px;
|
border-radius: 0px 0px 12px 12px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
opacity: 0;
|
|
||||||
transform: translate(-50%, 0%);
|
transform: translate(-50%, 0%);
|
||||||
visibility: hidden;
|
display: none;
|
||||||
transition: all 0.3s ease-out;
|
transition: all 0.3s ease-out;
|
||||||
}
|
ul {
|
||||||
.dropdown ul {
|
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
li {
|
||||||
.dropdown li {
|
|
||||||
padding-top: 10px;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
|
||||||
.link-content {
|
.link-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
// width: 150px;
|
text-align: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
a {
|
||||||
.link-label {
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: Arial;
|
|
||||||
font-weight: 400;
|
|
||||||
text-align: center;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
.dropdown li a {
|
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-family: Arial;
|
font-family: Arial;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
padding-top: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
text-align: center; /* ensure text is centered */
|
||||||
|
width: 100%; /* make it span the full width */
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.dropdown li span {
|
|
||||||
font-size: 15px;
|
|
||||||
font-family: Arial;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -106,7 +106,8 @@
|
|||||||
<div>Contract address</div>
|
<div>Contract address</div>
|
||||||
<div class="contract-address">
|
<div class="contract-address">
|
||||||
<div>{{ detailData.nft.contract_address}}</div>
|
<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>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
@ -121,7 +122,8 @@
|
|||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<div>Metadata</div>
|
<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>
|
||||||
<li>
|
<li>
|
||||||
<div>Royalties</div>
|
<div>Royalties</div>
|
||||||
@ -234,6 +236,7 @@ const detailData = ref(null)
|
|||||||
const assetsDetailData = ref(null)
|
const assetsDetailData = ref(null)
|
||||||
const myAddress = localWalletStore.address
|
const myAddress = localWalletStore.address
|
||||||
const contractBlankUrl = ref()
|
const contractBlankUrl = ref()
|
||||||
|
const founderBlankUrl = ref()
|
||||||
const contractTokenUrl = ref()
|
const contractTokenUrl = ref()
|
||||||
const nftAbilities = ref()
|
const nftAbilities = ref()
|
||||||
const icon = ref('')
|
const icon = ref('')
|
||||||
@ -628,7 +631,9 @@ const mintHero = async () => {
|
|||||||
|
|
||||||
const getDetail = async () => {
|
const getDetail = async () => {
|
||||||
let { errcode, errmsg, data} = await nftDetail(props.address, props.tokenid)
|
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}`
|
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}`
|
contractTokenUrl.value = `${import.meta.env.VUE_APP_EXPLORER_URL}/token/${data.nft.contract_address}/instance/${data.nft.token_id}`
|
||||||
if (errcode) {
|
if (errcode) {
|
||||||
// console.log(errmsg)
|
// console.log(errmsg)
|
||||||
@ -652,6 +657,7 @@ onMounted(() => {
|
|||||||
getDetail()
|
getDetail()
|
||||||
} else {
|
} else {
|
||||||
detailData.value = marketplaceList.detailData
|
detailData.value = marketplaceList.detailData
|
||||||
|
founderBlankUrl.value = `https://etherscan.io/token/0xec23679653337d4c6390d0eeba682246a6067777?a=${detailData.value.nft.token_id}`
|
||||||
nftAbilities.value = marketplaceList.detailData.nft.detail
|
nftAbilities.value = marketplaceList.detailData.nft.detail
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -926,12 +932,16 @@ onMounted(() => {
|
|||||||
position: relative;
|
position: relative;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
>div {
|
>div {
|
||||||
width: 520px;
|
width: 560px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
border-radius: 10px;
|
||||||
|
line-height: 40px;
|
||||||
|
border: 1px solid #7e7686;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: -50px;
|
top: -50px;
|
||||||
left: -50%;
|
left: -50%;
|
||||||
background: #17141b;
|
text-align: center;
|
||||||
|
background: #282131;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user