add nft module
This commit is contained in:
parent
0bdacf279d
commit
b3949e600e
@ -25,6 +25,11 @@ export default () => ([
|
|||||||
title: 'dashboard.uptime',
|
title: 'dashboard.uptime',
|
||||||
route: 'uptime',
|
route: 'uptime',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
scope: 'normal',
|
||||||
|
title: 'NFT',
|
||||||
|
route: 'nftdenom',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
scope: 'normal',
|
scope: 'normal',
|
||||||
title: 'dashboard.parameters',
|
title: 'dashboard.parameters',
|
||||||
|
@ -95,6 +95,28 @@ export default class ChainFetch {
|
|||||||
return this.get('/cosmos/slashing/v1beta1/signing_infos?pagination.limit=500', config)
|
return this.get('/cosmos/slashing/v1beta1/signing_infos?pagination.limit=500', config)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async getNFTsByOwner(address) {
|
||||||
|
return this.get(`/irismod/nft/nfts?owner=${address}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
async getNFTDenom(denom_id) {
|
||||||
|
return this.get(`/irismod/nft/denoms/${denom_id}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
async getWasmQuery(contract, query) {
|
||||||
|
const query_data = toBase64(Buffer.from(query))
|
||||||
|
console.log(contract, query_data)
|
||||||
|
return this.get(`/cosmwasm/wasm/v1/contract/${contract}/smart/${query_data}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
async getNFTdetails(denom_id, token_id) {
|
||||||
|
return this.get(`/irismod/nft/nfts/${denom_id}/${token_id}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
async getWasmNFTsByOwner(address) {
|
||||||
|
return this.get(`/irismod/nft/nfts?owner=${address}`)
|
||||||
|
}
|
||||||
|
|
||||||
async getTxs(hash, config = null) {
|
async getTxs(hash, config = null) {
|
||||||
const conf = config || this.getSelectedConfig()
|
const conf = config || this.getSelectedConfig()
|
||||||
const ver = conf.sdk_version || '0.41'
|
const ver = conf.sdk_version || '0.41'
|
||||||
|
@ -343,6 +343,20 @@ const router = new VueRouter({
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/:chain/nft/:denom',
|
||||||
|
name: 'nftdenom',
|
||||||
|
component: () => import('@/views/NFTDenom.vue'),
|
||||||
|
meta: {
|
||||||
|
pageTitle: 'NFT',
|
||||||
|
breadcrumb: [
|
||||||
|
{
|
||||||
|
text: 'NFT',
|
||||||
|
active: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
// custom modules for specified chains
|
// custom modules for specified chains
|
||||||
// 1. cosmos
|
// 1. cosmos
|
||||||
{
|
{
|
||||||
|
83
src/views/NFTDenom.vue
Normal file
83
src/views/NFTDenom.vue
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<b-card title="Query NFT">
|
||||||
|
<b-form-group>
|
||||||
|
<b-form-input
|
||||||
|
v-if="isWasm"
|
||||||
|
v-model="contractId"
|
||||||
|
placeholder="Wasm Contract Id: e.g. stars1y26zydcynhdz3t93wzsx4ww9nh9fz9gup6s5k45jqn7nsl36kefsdhdnvv"
|
||||||
|
/>
|
||||||
|
<b-form-input
|
||||||
|
v-model="tokenId"
|
||||||
|
placeholder="Token ID, e.g. mynft"
|
||||||
|
/>
|
||||||
|
</b-form-group>
|
||||||
|
<b-button @click="fetchWasmNFT()">
|
||||||
|
Search
|
||||||
|
</b-button>
|
||||||
|
</b-card>
|
||||||
|
<b-card
|
||||||
|
v-if="data"
|
||||||
|
title="NFT Details"
|
||||||
|
>
|
||||||
|
<object-field-component :tablefield="data" />
|
||||||
|
</b-card>
|
||||||
|
<b-card v-else>
|
||||||
|
No NFT found!
|
||||||
|
</b-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
BCard, BFormGroup, BFormInput, BButton,
|
||||||
|
} from 'bootstrap-vue'
|
||||||
|
import ObjectFieldComponent from './components/ObjectFieldComponent'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
BButton,
|
||||||
|
BCard,
|
||||||
|
BFormGroup,
|
||||||
|
BFormInput,
|
||||||
|
ObjectFieldComponent,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
data: {},
|
||||||
|
contractId: '',
|
||||||
|
tokenId: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
chainName() {
|
||||||
|
return this.$store.state.chains.selected.chain_name
|
||||||
|
},
|
||||||
|
isWasm() {
|
||||||
|
return ['juno', 'stargaze'].includes(this.chainName)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
const { denom } = this.$route.params
|
||||||
|
if (denom && denom !== 'nft') {
|
||||||
|
this.$http.getNFTDenom(denom).then(res => {
|
||||||
|
this.data = res.denom
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
fetchWasmNFT() {
|
||||||
|
if (this.isWasm) {
|
||||||
|
this.$http.getWasmQuery(this.contractId, `{"all_nft_info":{"token_id": "${this.tokenId}"}}`)
|
||||||
|
.then(res => {
|
||||||
|
this.data = res
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$http.getNFTDenom(this.tokenId).then(res => {
|
||||||
|
this.data = res.denom
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
@ -253,6 +253,25 @@
|
|||||||
</b-card-body>
|
</b-card-body>
|
||||||
</b-card>
|
</b-card>
|
||||||
|
|
||||||
|
<b-card title="NFTs">
|
||||||
|
<b-table
|
||||||
|
:items="nfts"
|
||||||
|
striped
|
||||||
|
hover
|
||||||
|
responsive="sm"
|
||||||
|
stacked="sm"
|
||||||
|
>
|
||||||
|
<template #cell(denom_id)="data">
|
||||||
|
<router-link :to="`../nft/${data.item.denom_id}`">
|
||||||
|
{{ data.item.denom_id }}
|
||||||
|
</router-link>
|
||||||
|
</template>
|
||||||
|
<template #cell(token_ids)="data">
|
||||||
|
<div>{{ data.item.token_ids.join(',') }}</div>
|
||||||
|
</template>
|
||||||
|
</b-table>
|
||||||
|
</b-card>
|
||||||
|
|
||||||
<b-card title="Transactions">
|
<b-card title="Transactions">
|
||||||
<b-table
|
<b-table
|
||||||
:items="txs"
|
:items="txs"
|
||||||
@ -483,8 +502,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<b-modal
|
||||||
|
id="bv-nft-viewer"
|
||||||
|
hide-footer
|
||||||
|
title="NFT Viewer"
|
||||||
|
>
|
||||||
|
<div class="d-block text-center">
|
||||||
|
<object-field-component tablefield="nft" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
<b-button
|
||||||
|
class="mt-3"
|
||||||
|
block
|
||||||
|
@click="$bvModal.hide('bv-nft-viewer')"
|
||||||
|
>
|
||||||
|
Close
|
||||||
|
</b-button>
|
||||||
|
</b-modal>
|
||||||
|
</div></template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { $themeColors } from '@themeConfig'
|
import { $themeColors } from '@themeConfig'
|
||||||
@ -584,6 +618,8 @@ export default {
|
|||||||
operationModalType: '',
|
operationModalType: '',
|
||||||
error: null,
|
error: null,
|
||||||
names: [],
|
names: [],
|
||||||
|
nfts: [],
|
||||||
|
nft: {},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -794,6 +830,23 @@ export default {
|
|||||||
this.$http.getStakingUnbonding(this.address).then(res => {
|
this.$http.getStakingUnbonding(this.address).then(res => {
|
||||||
this.unbonding = res.unbonding_responses || res
|
this.unbonding = res.unbonding_responses || res
|
||||||
})
|
})
|
||||||
|
this.$http.getNFTsByOwner(this.address).then(res => {
|
||||||
|
this.nfts = res.owner.id_collections
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showNft(denom, token) {
|
||||||
|
console.log(denom, token)
|
||||||
|
if (token) {
|
||||||
|
this.$http.getNFTdetails(denom, token).then(res => {
|
||||||
|
this.nft = res
|
||||||
|
this.$bvModal.show('bv-nft-viewer')
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$http.getNFTDenom(denom).then(res => {
|
||||||
|
this.nft = res
|
||||||
|
this.$bvModal.show('bv-nft-viewer')
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
formatNumber(v) {
|
formatNumber(v) {
|
||||||
return numberWithCommas(v)
|
return numberWithCommas(v)
|
||||||
|
Loading…
Reference in New Issue
Block a user