feat: Dashboard Delegations List
This commit is contained in:
parent
4c5ba81494
commit
d148bbe3b1
@ -40,7 +40,7 @@
|
|||||||
"md-editor-v3": "^2.8.1",
|
"md-editor-v3": "^2.8.1",
|
||||||
"numeral": "^2.0.6",
|
"numeral": "^2.0.6",
|
||||||
"osmojs": "^14.0.0-rc.0",
|
"osmojs": "^14.0.0-rc.0",
|
||||||
"ping-widget": "^0.0.7",
|
"ping-widget": "^0.0.8",
|
||||||
"pinia": "^2.0.28",
|
"pinia": "^2.0.28",
|
||||||
"postcss": "^8.4.23",
|
"postcss": "^8.4.23",
|
||||||
"prismjs": "^1.29.0",
|
"prismjs": "^1.29.0",
|
||||||
|
@ -1,29 +1,30 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useWalletStore } from '@/stores';
|
import { useWalletStore } from '@/stores';
|
||||||
import {ref, computed} from 'vue'
|
import { ref, computed } from 'vue';
|
||||||
const walletStore = useWalletStore();
|
const walletStore = useWalletStore();
|
||||||
walletStore.$subscribe((m, s) => {
|
walletStore.$subscribe((m, s) => {
|
||||||
console.log(m, s);
|
console.log(m, s);
|
||||||
});
|
});
|
||||||
let showCopyToast = ref(0)
|
let showCopyToast = ref(0);
|
||||||
async function copyAdress(address: string){
|
async function copyAdress(address: string) {
|
||||||
try {
|
try {
|
||||||
await navigator.clipboard.writeText(address);
|
await navigator.clipboard.writeText(address);
|
||||||
showCopyToast.value = 1
|
showCopyToast.value = 1;
|
||||||
setTimeout(()=>{
|
setTimeout(() => {
|
||||||
showCopyToast.value = 0
|
showCopyToast.value = 0;
|
||||||
},1000)
|
}, 1000);
|
||||||
/* Resolved - 文本被成功复制到剪贴板 */
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
showCopyToast.value = 2
|
showCopyToast.value = 2;
|
||||||
setTimeout(()=>{
|
setTimeout(() => {
|
||||||
showCopyToast.value = 0
|
showCopyToast.value = 0;
|
||||||
},1000)
|
}, 1000);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const tipMsg = computed(()=> {
|
const tipMsg = computed(() => {
|
||||||
return showCopyToast.value === 2 ? {class: 'error', msg: 'Copy Error!'}: {class: 'success', msg: 'Copy Success!'}
|
return showCopyToast.value === 2
|
||||||
})
|
? { class: 'error', msg: 'Copy Error!' }
|
||||||
|
: { class: 'success', msg: 'Copy Success!' };
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -68,14 +69,14 @@ const tipMsg = computed(()=> {
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="toast" v-show="showCopyToast===1">
|
<div class="toast" v-show="showCopyToast === 1">
|
||||||
<div class="alert alert-success">
|
<div class="alert alert-success">
|
||||||
<div class="text-sm">
|
<div class="text-sm">
|
||||||
<span>{{ tipMsg.msg }}</span>
|
<span>{{ tipMsg.msg }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="toast" v-show="showCopyToast===2">
|
<div class="toast" v-show="showCopyToast === 2">
|
||||||
<div class="alert alert-error">
|
<div class="alert alert-error">
|
||||||
<div class="text-sm">
|
<div class="text-sm">
|
||||||
<span>{{ tipMsg.msg }}</span>
|
<span>{{ tipMsg.msg }}</span>
|
||||||
|
@ -8,6 +8,7 @@ import {
|
|||||||
useFormatter,
|
useFormatter,
|
||||||
useTxDialog,
|
useTxDialog,
|
||||||
useWalletStore,
|
useWalletStore,
|
||||||
|
useStakingStore,
|
||||||
} from '@/stores';
|
} from '@/stores';
|
||||||
import { onMounted, ref } from 'vue';
|
import { onMounted, ref } from 'vue';
|
||||||
import { useIndexModule } from './indexStore';
|
import { useIndexModule } from './indexStore';
|
||||||
@ -21,6 +22,7 @@ const store = useIndexModule();
|
|||||||
const walletStore = useWalletStore();
|
const walletStore = useWalletStore();
|
||||||
const format = useFormatter();
|
const format = useFormatter();
|
||||||
const dialog = useTxDialog();
|
const dialog = useTxDialog();
|
||||||
|
const stakingStore = useStakingStore();
|
||||||
|
|
||||||
const coinInfo = computed(() => {
|
const coinInfo = computed(() => {
|
||||||
return store.coinInfo;
|
return store.coinInfo;
|
||||||
@ -230,7 +232,7 @@ const color = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="bg-base-100 rounded mt-4 shadow">
|
<div class="bg-base-100 rounded mt-4 shadow">
|
||||||
<div class="px-4 pt-4 pb-2 text-lg font-semibold text-secondary">
|
<div class="px-4 pt-4 pb-2 text-lg font-semibold text-main">
|
||||||
Active Proposals
|
Active Proposals
|
||||||
</div>
|
</div>
|
||||||
<div class="px-4 pb-4">
|
<div class="px-4 pb-4">
|
||||||
@ -242,7 +244,7 @@ const color = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="bg-base-100 rounded mt-4 shadow">
|
<div class="bg-base-100 rounded mt-4 shadow">
|
||||||
<div class="px-4 pt-4 pb-2 text-lg font-semibold text-secondary">
|
<div class="px-4 pt-4 pb-2 text-lg font-semibold text-main">
|
||||||
{{ walletStore.currentAddress || 'Not Connected' }}
|
{{ walletStore.currentAddress || 'Not Connected' }}
|
||||||
<span
|
<span
|
||||||
v-if="walletStore.currentAddress"
|
v-if="walletStore.currentAddress"
|
||||||
@ -293,13 +295,58 @@ const color = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="px-4 pb-4">
|
||||||
<div v-for="v in walletStore.delegations">
|
<table class="table table-compact w-full table-zebra">
|
||||||
{{ v }}
|
<thead>
|
||||||
</div>
|
<tr>
|
||||||
|
<th>Validator</th>
|
||||||
|
<th>Delegations</th>
|
||||||
|
<th>Rewards</th>
|
||||||
|
<th>Actions</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr v-for="(item, index) in walletStore.delegations" :key="index">
|
||||||
|
<td>
|
||||||
|
{{
|
||||||
|
format.validatorFromBech32(
|
||||||
|
item?.delegation?.validator_address
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</td>
|
||||||
|
<td>{{ format.formatToken(item?.balance) }}</td>
|
||||||
|
<td>
|
||||||
|
{{
|
||||||
|
format.formatToken({
|
||||||
|
denom: item?.balance?.denom,
|
||||||
|
amount: item?.delegation?.shares,
|
||||||
|
})
|
||||||
|
}}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<div>
|
||||||
|
<button
|
||||||
|
class="btn btn-xs btn-primary btn-ghost text-primary rounded-sm mr-2"
|
||||||
|
>
|
||||||
|
Delegate
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
class="btn btn-xs btn-primary btn-ghost text-primary rounded-sm"
|
||||||
|
>
|
||||||
|
Withdraw Rewards
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div></div>
|
<div class="grid grid-cols-3 gap-4 px-4 pb-6 mt-4">
|
||||||
|
<button class="btn btn-success text-white">Send</button>
|
||||||
|
<button class="btn btn-info text-white">Receive</button>
|
||||||
|
<button class="btn btn-primary text-white">Convert</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -6736,10 +6736,10 @@ pify@^3.0.0:
|
|||||||
resolved "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz"
|
resolved "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz"
|
||||||
integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==
|
integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==
|
||||||
|
|
||||||
ping-widget@^0.0.7:
|
ping-widget@^0.0.8:
|
||||||
version "0.0.7"
|
version "0.0.8"
|
||||||
resolved "https://registry.yarnpkg.com/ping-widget/-/ping-widget-0.0.7.tgz#441fdc03d1447a24bffb8233a2f55e734948820b"
|
resolved "https://registry.yarnpkg.com/ping-widget/-/ping-widget-0.0.8.tgz#378ef1f3ac59645921a98920ebe83cc74c42e6db"
|
||||||
integrity sha512-LbMBnXZUxh0goJXSyGHkM1kzdShmlHq5836QNGbIZFS6oSoCbKyYtbhVhR0l7BuqHpiYYpXbnUM+SN60yqOHVQ==
|
integrity sha512-NAFB6n+jJhjk4Xp8LCtRFzPOZdkKhecAKFg0Rimi0yilXL6EBRWJB+09zH89sjHcnUyhW6B2vSg42DpT8n3Rpw==
|
||||||
dependencies:
|
dependencies:
|
||||||
"@cosmjs/amino" "^0.30.1"
|
"@cosmjs/amino" "^0.30.1"
|
||||||
"@cosmjs/ledger-amino" "^0.30.1"
|
"@cosmjs/ledger-amino" "^0.30.1"
|
||||||
|
Loading…
Reference in New Issue
Block a user