crypto/bemarket
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加nft列表隐藏属性的功能

Browse Source
This commit is contained in:
cebgcontract 2022-04-16 16:02:04 +08:00
parent d3befa5b2e
commit cd051bd5d0
3 changed files with 25 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/market/NftInfo.vue
View File

@ -1,9 +1,8 @@
<template>
<div class="card-info-outlet">
<a class="card-root" :href="nftData.id? `/item/${nftData.id}`: 'javascript:void(0)'">
<a class="card-root" :href="!nftData.hideAttr? `/item/${nftData.id}`: 'javascript:void(0)'">
<hero-nft :nft-data="nftData" class="item"></hero-nft>
<div class="attr-div" v-if="nftData.type === 1">
<div class="attr-div" v-if="!nftData.hideAttr && nftData.type === 1">
<div class="one-col-info">
<div class="one-info">
<div class="info-title">Level</div>
@ -37,7 +36,7 @@
</div>
</div>
</div>
<div class="attr-div" v-if="nftData.type === 2">
<div class="attr-div" v-if="!nftData.hideAttr && nftData.type === 2">
<div class="one-col-info">
<div class="one-info">
<div class="info-title w50">Level</div>
@ -51,6 +50,9 @@
</div>
</div>
</div>
<div class="attr-div" v-if="nftData.hideAttr">
<div class="coming">-- COMING SOON --</div>
</div>
</a>
</div>
</template>
@ -107,6 +109,15 @@ export default class extends Vue {
color: white;
flex-direction: column;
font-size: 11px;
box-sizing: border-box;
.coming{
width: 100%;
height: 55px;
color: #6B6E91;
text-align: center;
line-height: 55px;
font-size: 1.5em;
}
.two-col-info {
display: flex;
flex-direction: row;
@ -188,6 +199,13 @@ export default class extends Vue {
display: flex;
}
}
.coming{
color: #6B6E91;
text-align: center;
line-height: 55px;
margin-top: auto;
margin-bottom: auto;
}
.one-info{
display: flex;
flex-direction: row;

2
src/components/market/nft/HeroNft.vue
View File

@ -1,5 +1,5 @@
<template>
<a class="card-outlet" :href="`/item/${nftData.id}`">
<a class="card-outlet" :href="!nftData.hideAttr? `/item/${nftData.id}`: 'javascript:void(0)'">
<div class="nft-id">#{{nftData.id}}</div>
<div class="card" >
<img v-if="nftData.id" class="bg-img" src="@/assets/main/card/card_border.png" alt="">

2
src/types/Nft.ts
View File

@ -42,6 +42,7 @@ export interface INftData{
attrMap: Map<string, string>
extAttrList: KeyValuePair[]
showBuy?: boolean
hideAttr?: boolean
}
export const defaultINftData = () => {
return {
@ -87,6 +88,7 @@ export function parseNftData(data: any) {
state: data.state,
mintTime: data.mint_time,
job: info.job,
hideAttr: data.hide_attr,
attrMap,
extAttrList
}