huangjinming/CounterFireGames
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改中心化card样式

Browse Source
This commit is contained in:
yuyongdong 2024-07-17 19:19:32 +08:00
parent 6610f054c0
commit 8356f5ed5f
8 changed files with 62 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/assets/assetsContent.vue
View File

@ -7,14 +7,14 @@
</div>
<div class="content">
<Collectibles v-if="navIndex == 0" />
<Hanging v-else-if="navIndex == 1" />
<!-- <Hanging v-else-if="navIndex == 1" />
<Trading v-else-if="navIndex == 2" />
<Activity v-else-if="navIndex == 3" />
<!-- <Staking v-if="navIndex == 1" />
<Centralization v-if="navIndex == 2" />
<Activity v-else-if="navIndex == 3" /> -->
<Centralization v-if="navIndex == 1" />
<Staking v-if="navIndex == 2" />
<Hanging v-else-if="navIndex == 3" />
<Trading v-else-if="navIndex == 4" />
<Activity v-else-if="navIndex == 5" /> -->
<Activity v-else-if="navIndex == 5" />
</div>
</div>
</template>
@ -37,12 +37,12 @@ const navList = ref([
{
name: "NFTs"
},
// {
// name: "Staking"
// },
// {
// name: "Centralized Assets"
// },
{
name: "Centralized Assets"
},
{
name: "Staking"
},
{
name: "Listings"
},

2
src/components/assets/assetsHeader.vue
View File

@ -314,7 +314,7 @@ onMounted(() => {
background: url('@/assets/img/marketplace/CEC_bg.png') no-repeat;
background-size: 100% 100%;
box-sizing: border-box;
display: none;
// display: none;
.uaw-listing-content {
display: flex;
justify-content: space-between;

40
src/components/assets/cenCard.vue
View File

@ -33,7 +33,7 @@
</div>
</div>
<div class="card-btn">
<div class="card-sell" v-if="nftData.on_sale == 0" @click="mintNft(nftData)">Mint for NFT</div>
<div class="card-sell" v-if="nftData.on_sale == 0" @click="mintHero(nftData)">Mint for NFT</div>
</div>
<SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
<LoadingDialog :loadingDialogVisible="loadingDialogVisible" />
@ -53,7 +53,6 @@ import placeholderImg from '@/assets/img/marketplace/GenesisHeroes_NFT.png'
import {createModal} from "@/utils/model.util";
import ConfirmDialog from "@/components/Dialogs/confirmDialog.vue"
import { timeFormat } from "@/configs/priceCalculate"
import { Locker } from "@/components/chain/contract/Locker"
const emit = defineEmits(['renewMyNft'])
import {formatPrice} from "@/components/chain/utils"
@ -68,14 +67,6 @@ const props = defineProps({
},
});
const mintNft = async () => {
// console.log('-----', toRaw(props.nftData))
// return
const locker = new Locker()
let res = await locker.mintNft([toRaw(props.nftData).uniid])
console.log(res,'--------------')
}
// 获取地板价
const floorPrice = ref('0')
const getFloorPrice = async (val) => {
@ -241,34 +232,9 @@ onMounted(() => {
padding: 30px 30px 20px 30px;
box-sizing: border-box;
.card-img {
width: 240px;
height: 360px;
width: 190px;
height: 316px;
margin: 0 auto;
:deep(.card-img-common) {
li {
width: 100%;
height: 100%;
.img-top {
width: 100px;
height: 30px;
top: 20px;
left: 20px;
}
.img-btm {
bottom: 12px;
left: 20px;
>div {
width: 80px;
height: 30px;
}
div:nth-child(1) {
}
div:nth-child(2) {
margin-left: 8px;
}
}
}
}
}
.card-name {
display: flex;

46
src/components/assets/imgs.vue
View File

@ -4,7 +4,6 @@
<img :src="heroBgImageUrl" alt="">
</div>
<div class="imgs-img">
<!-- <img src="@/assets/img/marketplace/hero/Mariana.png" alt=""> -->
<img :src="heroImageUrl" alt="">
</div>
<div class="imgs-day">
@ -63,12 +62,19 @@ const qualityImageUrl = computed(() => {
<style lang="scss" scoped>
.imgs {
position: relative;
width: 190px;
height: 316px;
margin: 0 auto;
.imgs-bg {
width: 190px;
height: 316px;
}
.imgs-img {
position: absolute;
top: 0;
left: 0;
width: 235px;
height: 320px;
width: 184px;
height: 273px;
img {
width: 100%;
height: 100%;
@ -76,11 +82,11 @@ const qualityImageUrl = computed(() => {
}
.imgs-day {
position: absolute;
right: 0;
right: 3px;
bottom: 100px;
width: 90px;
height: 30px;
line-height: 30px;
width: 76px;
height: 25px;
line-height: 25px;
background: url('@/assets/img/marketplace/hero/hero_card_coinTime.png') no-repeat;
background-size: 100% 100%;
padding-left: 40px;
@ -88,41 +94,51 @@ const qualityImageUrl = computed(() => {
}
.imgs-detail {
position: absolute;
bottom: 50px;
width: 100%;
bottom: 45px;
width: 184px;
height: 30px;
line-height: 30px;
display: flex;
justify-content: space-between;
align-items: center;
color: #000;
background: #333141;
div {
display: flex;
align-items: center;
img {
width: 30px;
height: 30px;
width: 20px;
height: 20px;
margin: 0 8px;
}
span {
color: #fff;
font-family: 'MEurostile';
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
}
}
}
.imgs-quality {
position: absolute;
bottom: 50px;
bottom: 45px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 50px;
height: 53px;
line-height: 50px;
text-align: center;
color: #000;
}
.imgs-name {
position: absolute;
bottom: 20px;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
font-family: 'Anton';
font-weight: 400;
font-size: 23px;
color: #D9E3FF;
}
}
</style>

15
src/components/assets/myCard.vue
View File

@ -198,12 +198,15 @@ const cardPrice = async (val) => {
// 赎回
const unStake = async (data) => {
// debugger
console.log(toRaw(data).contract_address,[toRaw(data).token_id])
const locker = new Locker()
// console.log(locker.sendUnlockOrMint)
let res = await locker.unlockOrMintGameNft(toRaw(data).contract_address,[toRaw(data).token_id])
console.log(res)
const bc = new BlockChain()
let res = await bc.locker.unlockOrMintGameNft(toRaw(data).contract_address,[toRaw(data).token_id])
if(res) {
let timer = setTimeout(() => {
message.success('Unstake success.')
emit('renewMyNft')
clearTimeout(timer);
}, 2000);
}
}
// 去详情页面

2
src/components/assets/staking.vue
View File

@ -66,14 +66,12 @@ const renewMyNft = async() => {
overviewValue.value = ''
nftList.value = []
getMyAssets()
// location.reload()
clearTimeout(timer);
}, 2000);
}
const next_cursor = ref()
const getMyAssets = async () => {
// nftList.value = []
const myADdress = localWalletStore.address
const data = {
type: 3,

14
src/components/chain/contract/Locker.js
View File

@ -65,23 +65,21 @@ export class Locker {
async unlockOrMintGameNft(nft, tokenIds) {
console.log('unlock nft', nft, tokenIds)
const blockChain = new BlockChain()
const { provider, address } = await blockChain.selectAddress({})
await blockChain.checkPassportLogin();
await blockChain.checkAndChangeChain();
const { provider, address } = await this.bc.selectAddress({})
await this.bc.checkPassportLogin();
await this.bc.checkAndChangeChain();
const preDatas = {
net_id: import.meta.env.VUE_APP_NET_ID,
to: address,
contract_address: nft,
tokens: tokenIds.map(tokenId => {return { tokenId }}),
tokens: tokenIds.map(token_id => {return { token_id }}),
}
console.log(await this.bc)
const passportToken = await blockChain.passportToken()
const passportToken = await this.bc.passportToken()
const { errcode, errmsg, trans_req } = await apiUnlockOrMint(preDatas, passportToken)
if (errcode) {
throw new Error(errmsg)
}
const web3Provider = this.bc.passportProvider || this.bc.web3Provider
console.log(web3Provider)
return this.sendUnlockOrMint(web3Provider, trans_req)
}
// 游戏内资产上链, 只用于mint
@ -100,6 +98,6 @@ export class Locker {
throw new Error(errmsg)
}
trans_req.from = address
return this.sendUnlockOrMint(this.bc.web3Provider, trans_req)
return this.sendUnlockOrMint(blockChain.web3Provider, trans_req)
}
}

2
src/components/common/searchView/nftStatusRadio.vue
View File

@ -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>