From c37c4cbc8da202a5d5adac4dece15b520b6df213 Mon Sep 17 00:00:00 2001 From: liangping <18786721@qq.com> Date: Wed, 10 May 2023 13:04:57 +0800 Subject: [PATCH 1/5] add asset panel --- src/layouts/components/NavBarWallet.vue | 6 ++++-- src/modules/[chain]/index.vue | 18 +++++++++++++----- 2 files changed, 17 insertions(+), 7 deletions(-) diff --git a/src/layouts/components/NavBarWallet.vue b/src/layouts/components/NavBarWallet.vue index 55aeaf47..df8c1ff7 100644 --- a/src/layouts/components/NavBarWallet.vue +++ b/src/layouts/components/NavBarWallet.vue @@ -3,12 +3,14 @@ import { ref } from 'vue'; import { useBlockchain, useWalletStore } from '@/stores'; const walletStore = useWalletStore() - +walletStore.$subscribe((m, s) => { + console.log(m, s) +}) diff --git a/src/modules/[chain]/index.vue b/src/modules/[chain]/index.vue index 4e8d09f0..521dd631 100644 --- a/src/modules/[chain]/index.vue +++ b/src/modules/[chain]/index.vue @@ -14,6 +14,7 @@ import ProposalListItem from '@/components/ProposalListItem.vue'; const blockchain = useBlockchain(); const store = useIndexModule(); const walletStore = useWalletStore() +const format = useFormatter() const coinInfo = computed(() => { return store.coinInfo; @@ -21,9 +22,9 @@ const coinInfo = computed(() => { onMounted(() => { store.loadDashboard(); + walletStore.loadMyAsset() }); -const format = useFormatter(); const ticker = computed(() => store.coinInfo.tickers[store.tickerIndex]); blockchain.$subscribe((m, s) => { @@ -32,6 +33,7 @@ blockchain.$subscribe((m, s) => { ['chainName', 'endpoint'].includes(m.events.key) ) { store.loadDashboard(); + walletStore.loadMyAsset() } }); function shortName(name: string, id: string) { @@ -226,10 +228,16 @@ const comLinks = [ More
-
1
-
2
-
1
-
2
+
{{ format.formatToken(walletStore.balanceOfStakingToken) }}
+
{{ format.formatToken(walletStore.stakingAmount) }}
+
{{ format.formatToken(walletStore.rewardAmount) }}
+
{{ format.formatToken(walletStore.unbondingAmount) }}
+
+ +
+
+ {{ v }} +
From 28854156304c3341947bead4c2da8c4a958fa16a Mon Sep 17 00:00:00 2001 From: liangping <18786721@qq.com> Date: Wed, 10 May 2023 13:33:59 +0800 Subject: [PATCH 2/5] fix rewards amount --- src/libs/registry.ts | 8 ++++- src/stores/useWalletStore.ts | 65 +++++++++++++++++++++++++++++++++--- 2 files changed, 68 insertions(+), 5 deletions(-) diff --git a/src/libs/registry.ts b/src/libs/registry.ts index 9ea94ea3..e3da974c 100644 --- a/src/libs/registry.ts +++ b/src/libs/registry.ts @@ -73,7 +73,13 @@ export interface RequestRegistry extends AbstractRegistry { }>; distribution_validator_slashes: Request; distribution_community_pool: Request<{ pool: Coin[] }>; - distribution_delegator_rewards: Request; + distribution_delegator_rewards: Request<{ + rewards: { + validator_address: string, + reward: Coin[] + }[], + total: Coin[] + }>; mint_inflation: Request<{ inflation: string }>; mint_params: Request<{ diff --git a/src/stores/useWalletStore.ts b/src/stores/useWalletStore.ts index c8d54718..b0c9f2a4 100644 --- a/src/stores/useWalletStore.ts +++ b/src/stores/useWalletStore.ts @@ -1,10 +1,17 @@ import { defineStore } from 'pinia'; import { useBlockchain } from './useBlockchain'; import { fromBech32, toBech32 } from '@cosmjs/encoding'; +import type { Delegation, Coin, UnbondingResponses, DelegatorRewards } from '@/types'; +import { useStakingStore } from './useStakingStore'; export const useWalletStore = defineStore('walletStore', { state: () => { - return {}; + return { + balances: [] as Coin[], + delegations: [] as Delegation[], + unbonding: [] as UnbondingResponses[], + rewards: {} as DelegatorRewards, + }; }, getters: { blockchain() { @@ -17,13 +24,63 @@ export const useWalletStore = defineStore('walletStore', { const connected = JSON.parse(localStorage.getItem(key)||"{}") return connected }, + balanceOfStakingToken(): Coin { + const stakingStore = useStakingStore() + return this.balances.find( x => x.denom === stakingStore.params.bond_denom) || {amount: "0", denom: stakingStore.params.bond_denom} + }, + stakingAmount() { + let amt = 0 + let denom = '' + this.delegations.forEach((i) => { + amt += Number(i.balance.amount) + denom = i.balance.denom + }) + return {amount: String(amt), denom} + }, + rewardAmount() { + + const stakingStore = useStakingStore() + const reward = this.rewards.total?.find(x => x.denom === stakingStore.params.bond_denom) + return reward || {amount: "0", denom: stakingStore.params.bond_denom} + }, + unbondingAmount() { + let amt = 0 + let denom = '' + this.unbonding.forEach((i) => { + i.entries.forEach(e => { + amt += Number(e.balance) + }) + }) + + const stakingStore = useStakingStore() + return {amount: String(amt), denom: stakingStore.params.bond_denom} + }, currentAddress() { - const {prefix, data} = fromBech32(this.connectedWallet.cosmosAddress); - const chainStore = useBlockchain() - return toBech32(chainStore.current?.bech32Prefix || prefix, data) + if(this.connectedWallet.cosmosAddress) { + const {prefix, data} = fromBech32(this.connectedWallet.cosmosAddress); + const chainStore = useBlockchain() + return toBech32(chainStore.current?.bech32Prefix || prefix, data) + } else { + return "" + } } }, actions: { + async loadMyAsset() { + if(!this.currentAddress) return + this.blockchain.rpc.getBankBalances(this.currentAddress).then(x => { + this.balances = x.balances + }) + this.blockchain.rpc.getStakingDelegations(this.currentAddress).then(x => { + this.delegations = x.delegation_responses + }) + this.blockchain.rpc.getStakingDelegatorUnbonding(this.currentAddress).then(x => { + this.unbonding = x.unbonding_responses + }) + this.blockchain.rpc.getDistributionDelegatorRewards(this.currentAddress).then(x => { + this.rewards = x + }) + }, myBalance() { return this.blockchain.rpc.getBankBalances(this.currentAddress) }, From df359ca684f6a6a4decee9262d4ce0534a03f8b9 Mon Sep 17 00:00:00 2001 From: liangping <18786721@qq.com> Date: Wed, 10 May 2023 16:19:22 +0800 Subject: [PATCH 3/5] add price load --- src/modules/[chain]/index.vue | 21 ++++++++++++++++++--- src/pages/index.vue | 2 +- src/stores/useDashboard.ts | 26 ++++++++++++++++++++++++++ src/stores/useFormatter.ts | 33 ++++++++++++++++++++++++++++++++- 4 files changed, 77 insertions(+), 5 deletions(-) diff --git a/src/modules/[chain]/index.vue b/src/modules/[chain]/index.vue index 521dd631..f3afbd37 100644 --- a/src/modules/[chain]/index.vue +++ b/src/modules/[chain]/index.vue @@ -67,7 +67,20 @@ const comLinks = [ ]; // wallet box - +const change = computed(() => { + const token = walletStore.balanceOfStakingToken + return token? format.priceChanges(token.denom) : 0 +}) +const color= computed(() => { + switch(true) { + case change.value > 0: + return "text-green-600" + case change.value === 0: + return "text-grey-500" + case change.value < 0: + return "text-red-600" + } +})