修改herder Table路由
This commit is contained in:
yuyongdong
parent
15715d28cf
commit
f681c24e5b
@ -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>
|
||||
</div> -->
|
||||
<span v-else @click="lockToGame(nftData)">Stake</span>
|
||||
</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) => {
|
||||
if(type == 'founder') {
|
||||
const lockToGame = async(data) => {
|
||||
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>
|
||||
|
||||
|
||||
@ -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">
|
||||
<template #default="{ text: type }">
|
||||
<a-table-column title="Status" data-source="orderList" :width="400">
|
||||
<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-else>Stake</div> -->
|
||||
<div class="nft-status" v-if="type == 1">Mint</div>
|
||||
<div class="nft-status" v-else-if="type == 2">Stake</div>
|
||||
<div class="nft-status" v-else-if="type == 3">UnStake</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-if="orderList.type == 1">Mint</div>
|
||||
<div class="nft-status" v-else-if="orderList.type == 2">Stake</div>
|
||||
<div class="nft-status" v-else-if="orderList.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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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,
|
||||
name: "EVENT",
|
||||
path: "/contact",
|
||||
submenu: [
|
||||
{ label: "Badge", link: "https://badge.counterfire.games/" },
|
||||
{
|
||||
label: "Gacha",
|
||||
link: "https://gacha.counterfire.games/",
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// id: 5,
|
||||
// name: "GACHA",
|
||||
// path: "https://gacha.counterfire.games/view",
|
||||
// },
|
||||
// {
|
||||
// id: 5,
|
||||
// name: "EVENT",
|
||||
// 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 {
|
||||
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;
|
||||
&: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;
|
||||
.dropdown {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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 {
|
||||
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;
|
||||
&:hover {
|
||||
.dropdown {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.dropdown li {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.link-content {
|
||||
display: flex;
|
||||
// width: 150px;
|
||||
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;
|
||||
}
|
||||
.dropdown li span {
|
||||
font-size: 15px;
|
||||
font-family: Arial;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
li {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
cursor: pointer;
|
||||
.link-content {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
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 */
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -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;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user