zramsay/cosmos-explorer
1
0
Fork 0
forked from cerc-io/cosmos-explorer
Code Pull Requests Actions Activity

Merge pull request #382 from alisaweb3/v3-single

Browse Source 
Update ProposalListItem
This commit is contained in:
ping 2023-05-18 06:45:48 +08:00 committed by GitHub
commit 9baa8d4705
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 306 additions and 150 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -41,7 +41,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.9", "ping-widget": "^0.0.13",
"pinia": "^2.0.28", "pinia": "^2.0.28",
"postcss": "^8.4.23", "postcss": "^8.4.23",
"prismjs": "^1.29.0", "prismjs": "^1.29.0",

6
src/components/Countdown.vue
View File

@ -1,17 +1,17 @@
<script lang="ts" setup> <script lang="ts" setup>
import VueCountdown from '@chenfengyuan/vue-countdown'; import Countdown from '@chenfengyuan/vue-countdown';
const props = defineProps({ const props = defineProps({
time: { type: Number }, time: { type: Number },
}); });
</script> </script>
<template> <template>
<vue-countdown <Countdown
v-if="time" v-if="time"
:time="time > 0 ? time : 0" :time="time > 0 ? time : 0"
v-slot="{ days, hours, minutes, seconds }" v-slot="{ days, hours, minutes, seconds }"
> >
Time Remaining：{{ days }} days, {{ hours }} hours, {{ minutes }} minutes, Time Remaining：{{ days }} days, {{ hours }} hours, {{ minutes }} minutes,
{{ seconds }} seconds. {{ seconds }} seconds.
</vue-countdown> </Countdown>
</template> </template>

115
src/components/ProposalListItem.vue
View File

@ -1,13 +1,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useBlockchain, useFormatter, useStakingStore } from '@/stores'; import {
useBlockchain,
useFormatter,
useStakingStore,
useWalletStore,
useTxDialog
} from '@/stores';
import { select } from '@/components/dynamic/index'; import { select } from '@/components/dynamic/index';
import type { PaginatedProposals } from '@/types'; import type { PaginatedProposals } from '@/types';
import ProposalProcess from './ProposalProcess.vue'; import ProposalProcess from './ProposalProcess.vue';
import type { PropType } from 'vue'; import type { PropType } from 'vue';
import { ref } from 'vue';
const dialog = useTxDialog();
defineProps({ defineProps({
proposals: { type: Object as PropType<PaginatedProposals> }, proposals: { type: Object as PropType<PaginatedProposals> },
votable: { type: Boolean, default: false }
}); });
const format = useFormatter(); const format = useFormatter();
@ -25,16 +31,25 @@ const statusMap: Record<string, string> = {
PROPOSAL_STATUS_PASSED: 'PASSED', PROPOSAL_STATUS_PASSED: 'PASSED',
PROPOSAL_STATUS_REJECTED: 'REJECTED', PROPOSAL_STATUS_REJECTED: 'REJECTED',
}; };
const voterStatusMap: Record<string, string> = {
No_With_Veto: '',
VOTE_OPTION_YES: 'success',
VOTE_OPTION_NO: 'error',
VOTE_OPTION_ABSTAIN: 'warning',
};
const proposalInfo = ref();
</script> </script>
<template> <template>
<div class="bg-white dark:bg-[#28334e] rounded text-sm"> <div class="bg-white dark:bg-[#28334e] rounded text-sm">
<table class="table-compact w-full table-fixed lg:table"> <table class="table-compact w-full table-fixed hidden lg:table">
<tbody> <tbody>
<tr v-for="(item, index) in proposals?.proposals" :key="index"> <tr v-for="(item, index) in proposals?.proposals" :key="index">
<td class="px-4 w-20"> <td class="px-4 w-20">
<label <label
for="" for="proposal-detail-modal"
class="text-main text-base hover:text-indigo-400 cursor-pointer" class="text-main text-base hover:text-indigo-400 cursor-pointer"
@click="proposalInfo = item"
> >
#{{ item?.proposal_id }}</label #{{ item?.proposal_id }}</label
> >
@ -94,9 +109,25 @@ const statusMap: Record<string, string> = {
</div> </div>
</td> </td>
<td v-if="votable"> <td v-if="statusMap?.[item?.status] === 'VOTING'">
<div> <div class="" v-show="item?.voterStatus === 'No With Veto'">
<button class="btn btn-xs btn-primary rounded-sm">Vote</button> <label
for="vote"
class="btn btn-xs btn-primary rounded-sm"
@click="dialog.open('vote', { proposal_id: item?.proposal_id })"
>Vote</label
>
<div
class="text-xs truncate relative py-1 px-3 rounded-full w-fit"
:class="`text-${voterStatusMap?.[item?.voterStatus]}`"
v-show="item?.voterStatus !== 'No With Veto'"
>
<span
class="inset-x-0 inset-y-0 opacity-10 absolute"
:class="`bg-${voterStatusMap?.[item?.voterStatus]}`"
></span>
{{ item?.voterStatus }}
</div>
</div> </div>
</td> </td>
</tr> </tr>
@ -118,35 +149,12 @@ const statusMap: Record<string, string> = {
>{{ item?.content?.title }}</RouterLink >{{ item?.content?.title }}</RouterLink
> >
<label <label
for="proposal-detail-modals" for="proposal-detail-modal"
class="text-main text-base hover:text-indigo-400 cursor-pointer" class="text-main text-base hover:text-indigo-400 cursor-pointer"
@click="proposalInfo = item"
> >
#{{ item?.proposal_id }}</label #{{ item?.proposal_id }}</label
> >
<input
type="checkbox"
id="proposal-detail-modals"
class="modal-toggle"
/>
<div class="modal modal-bottom sm:modal-middle">
<div class="modal-box">
<h3 class="font-bold text-lg">Description</h3>
<p class="py-4">
<Component
v-if="item.content?.description"
:is="select(item.content?.description, 'horizontal')"
:value="item.content?.description"
></Component>
</p>
<div class="modal-action">
<label
for="proposal-detail-modals"
class="btn btn-sm btn-primary"
>Close</label
>
</div>
</div>
</div>
</div> </div>
<div class="grid grid-cols-4 mt-2 mb-2"> <div class="grid grid-cols-4 mt-2 mb-2">
@ -195,10 +203,47 @@ const statusMap: Record<string, string> = {
></ProposalProcess> ></ProposalProcess>
</div> </div>
<div class="mt-4"> <div class="mt-4" v-if="statusMap?.[item?.status] === 'VOTING'">
<button class="btn btn-xs btn-primary rounded-sm px-4">Vote</button> <div class="" v-show="item?.voterStatus === 'No With Veto'">
<label
for="vote"
class="btn btn-xs btn-primary rounded-sm"
@click="dialog.open('vote', { proposal_id: item?.proposal_id })"
>Vote</label
>
<div
class="text-xs truncate relative py-1 px-3 rounded-full w-fit"
:class="`text-${voterStatusMap?.[item?.voterStatus]}`"
v-show="item?.voterStatus !== 'No With Veto'"
>
<span
class="inset-x-0 inset-y-0 opacity-10 absolute"
:class="`bg-${voterStatusMap?.[item?.voterStatus]}`"
></span>
{{ item?.voterStatus }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<input type="checkbox" id="proposal-detail-modal" class="modal-toggle" />
<label for="proposal-detail-modal" class="modal sm:modal-middle">
<label class="modal-box relative" for="">
<label
for="proposal-detail-modal"
class="btn btn-sm btn-circle absolute right-2 top-2"
>✕</label
>
<h3 class="font-bold text-lg">Description</h3>
<p class="py-4">
<Component
v-if="proposalInfo?.content?.description"
:is="select(proposalInfo?.content?.description, 'horizontal')"
:value="proposalInfo?.content?.description"
></Component>
</p>
</label>
</label>
</div>
</template> </template>

10
src/layouts/components/DefaultLayout.vue
View File

@ -110,11 +110,15 @@ const changeOpen = (index: Number) => {
$route.path === el?.to?.path && item?.title !== 'Favorite', $route.path === el?.to?.path && item?.title !== 'Favorite',
}" }"
> >
<Icon icon="mdi:chevron-right" class="mr-2 ml-3"/> <Icon
v-if="!el?.icon?.image"
icon="mdi:chevron-right"
class="mr-2 ml-3"
/>
<img <img
v-if="el?.icon?.image" v-if="el?.icon?.image"
:src="el?.icon?.image" :src="el?.icon?.image"
class="w-6 h-6 rounded-full mr-3" class="w-6 h-6 rounded-full mr-3 ml-4"
/> />
<div <div
class="text-base text-gray-500 dark:text-gray-300" class="text-base text-gray-500 dark:text-gray-300"
@ -194,8 +198,6 @@ const changeOpen = (index: Number) => {
<NavBarWallet <NavBarWallet
class="block truncate md:inline-block text-xs md:text-sm" class="block truncate md:inline-block text-xs md:text-sm"
/> />
</div> </div>
<!-- 👉 Pages --> <!-- 👉 Pages -->

20
src/layouts/components/NavBarWallet.vue
View File

@ -5,6 +5,9 @@ const walletStore = useWalletStore();
walletStore.$subscribe((m, s) => { walletStore.$subscribe((m, s) => {
console.log(m, s); console.log(m, s);
}); });
function walletStateChange(res: any) {
walletStore.setConnectedWallet(res.detail?.value);
}
let showCopyToast = ref(0); let showCopyToast = ref(0);
async function copyAdress(address: string) { async function copyAdress(address: string) {
try { try {
@ -89,6 +92,7 @@ const addressChange = computed(() => {
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<label <label
v-if="!walletStore?.currentAddress" v-if="!walletStore?.currentAddress"
@ -96,4 +100,20 @@ const addressChange = computed(() => {
class="btn btn-sm ml-4 ping-connect-btn" class="btn btn-sm ml-4 ping-connect-btn"
>Connect Wallet</label >Connect Wallet</label
> >
<div class="footer-modal">
<Teleport to="body">
<ping-connect-wallet
:chain-id="'juno-1'"
:hd-path="`m/44'/118/0'/0/0`"
@change="walletStateChange"
/>
</Teleport>
</div>
</template> </template>
<style>
.footer-modal .ping-connect-btn,
.footer-modal .ping-connect-dropdown {
display: none;
}
</style>

18
src/layouts/components/NavFooter.vue
View File

@ -1,11 +1,3 @@
<script setup lang="ts">
import { useWalletStore } from '@/stores';
const walletStore = useWalletStore();
function walletStateChange(res:any){
console.log(res.detail?.value, 8888888)
walletStore.setConnectedWallet(res.detail?.value)
}
</script>
<template> <template>
<footer class="footer items-center p-4 text-sm mb-4"> <footer class="footer items-center p-4 text-sm mb-4">
<div class="items-center grid-flow-col"> <div class="items-center grid-flow-col">
@ -39,14 +31,6 @@ function walletStateChange(res:any){
> >
</div> </div>
</footer> </footer>
<div class="footer-modal">
<ping-connect-wallet :chain-id="'juno-1'" :hd-path="`m/44'/118/0'/0/0`" @change="walletStateChange"/>
</div>
</template> </template>
<style>
.footer-modal .ping-connect-btn,
.footer-modal .ping-connect-dropdown {
display: none;
}
</style>

128
src/modules/[chain]/cosmwasm/[code_id]/contracts.vue
View File

@ -29,17 +29,14 @@ const selected = ref('');
function showInfo(address: string) { function showInfo(address: string) {
wasmStore.wasmClient.getWasmContracts(address).then((x) => { wasmStore.wasmClient.getWasmContracts(address).then((x) => {
info.value = x.contract_info; info.value = x.contract_info;
// infoDialog.value = true;
}); });
} }
function showState(address: string) { function showState(address: string) {
wasmStore.wasmClient.getWasmContractStates(address).then((x) => { wasmStore.wasmClient.getWasmContractStates(address).then((x) => {
state.value = x; state.value = x;
stateDialog.value = true;
}); });
} }
function showQuery(address: string) { function showQuery(address: string) {
queryDialog.value = true;
selected.value = address; selected.value = address;
query.value = ''; query.value = '';
result.value = ''; result.value = '';
@ -114,18 +111,20 @@ const result = ref('');
>contract</label >contract</label
> >
<button <label
class="btn btn-primary btn-sm text-xs mr-2" class="btn btn-primary btn-sm text-xs mr-2"
for="modal-contract-states"
@click="showState(v)" @click="showState(v)"
> >
States States
</button> </label>
<button <label
for="modal-contract-query"
class="btn btn-primary btn-sm text-xs" class="btn btn-primary btn-sm text-xs"
@click="showQuery(v)" @click="showQuery(v)"
> >
Query Query
</button> </label>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@ -153,47 +152,92 @@ const result = ref('');
</label> </label>
</label> </label>
<v-dialog v-model="stateDialog" width="auto"> <input type="checkbox" id="modal-contract-states" class="modal-toggle" />
<v-card> <label for="modal-contract-states" class="modal cursor-pointer">
<VCardTitle>Contract States</VCardTitle> <label class="modal-box relative p-2" for="">
<VList> <div>
<VListItem v-for="v in state.models"> <div class="flex items-center justify-between px-3 pt-2">
<VListItemTitle> <div class="text-lg">Contract States</div>
{{ format.hexToString(v.key) }} <label
</VListItemTitle> @click="infoDialog = false"
<VListItemSubtitle :title="format.base64ToString(v.value)"> for="modal-contract-states"
{{ format.base64ToString(v.value) }} class="btn btn-sm btn-circle"
</VListItemSubtitle> >✕</label
</VListItem>
</VList>
<v-card-actions>
<v-btn color="primary" block @click="stateDialog = false"
>Close Dialog</v-btn
> >
</v-card-actions> </div>
</v-card> <div class="overflow-auto">
</v-dialog> <table class="table table-compact w-full text-sm">
<tr v-for="(v, index) in state.models" :key="index">
<td class="">
{{ format.hexToString(v.key) }}
</td>
<td class="" :title="format.base64ToString(v.value)">
{{ format.base64ToString(v.value) }}
</td>
</tr>
</table>
</div>
</div>
</label>
</label>
<v-dialog v-model="queryDialog" width="auto"> <input type="checkbox" id="modal-contract-query" class="modal-toggle" />
<v-card> <label for="modal-contract-states" class="modal cursor-pointer">
<VCardTitle>Query Contract</VCardTitle> <label class="modal-box relative p-2" for="">
<v-card-text> <div>
<CustomRadios <div class="flex items-center justify-between px-3 pt-2 mb-4">
v-model:selected-radio="selectedRadio" <div class="text-lg font-semibold">Query Contract</div>
:radio-content="radioContent" <label
:grid-column="{ sm: '6', cols: '12' }" @click="infoDialog = false"
for="modal-contract-query"
class="btn btn-sm btn-circle"
>✕</label
>
</div>
<div class="px-3">
<div>
<div class="grid grid-cols-2 gap-4 mb-4">
<div
class="form-control border rounded px-4"
v-for="(item, index) of radioContent"
:key="index"
:class="{ 'pt-2': index === 0 }"
>
<label
class="label cursor-pointer justify-start"
@click="selectedRadio = item?.value"
>
<input
type="radio"
name="radio-10"
class="radio radio-sm radio-primary mr-4"
:checked="item?.value === selectedRadio"
style="border: 1px solid #d2d6dc"
/> />
<div>
<div class="text-base font-semibold">
{{ item?.title }}
</div>
<div class="text-xs">{{ item?.desc }}</div>
</div>
</label>
</div>
</div>
<VTextarea v-model="query" label="Query String" class="my-2" /> <VTextarea v-model="query" label="Query String" class="my-2" />
<VTextarea v-model="result" label="Result" /> <VTextarea v-model="result" label="Result" />
</v-card-text> </div>
<v-card-actions> <div class="mt-4 mb-4">
<v-btn color="primary" @click="queryDialog = false" <button
>Close Dialog</v-btn class="btn btn-success px-4 text-white"
@click="queryContract()"
> >
<v-btn color="success" @click="queryContract()">Query Contract</v-btn> Query Contract
</v-card-actions> </button>
</v-card> </div>
</v-dialog> </div>
</div>
</label>
</label>
</div> </div>
</template> </template>

11
src/modules/[chain]/cosmwasm/index.vue
View File

@ -17,10 +17,10 @@ wasmStore.wasmClient.getWasmCodeList().then((x) => {
<div class="bg-base-100 px-4 pt-3 pb-4 rounded mb-4 shadow"> <div class="bg-base-100 px-4 pt-3 pb-4 rounded mb-4 shadow">
<h2 class="card-title truncate w-full">Cosmos Wasm Smart Contracts</h2> <h2 class="card-title truncate w-full">Cosmos Wasm Smart Contracts</h2>
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table class="table w-full mt-4 text-sm"> <table class="table table-compact w-full mt-4 text-sm">
<thead> <thead>
<tr> <tr>
<th style="position: relative; z-index: 2;">Code Id</th> <th>Code Id</th>
<th>Code Hash</th> <th>Code Hash</th>
<th>Creator</th> <th>Creator</th>
<th>Permissions</th> <th>Permissions</th>
@ -32,10 +32,11 @@ wasmStore.wasmClient.getWasmCodeList().then((x) => {
<td> <td>
<RouterLink <RouterLink
:to="`/${props.chain}/cosmwasm/${v.code_id}/contracts`" :to="`/${props.chain}/cosmwasm/${v.code_id}/contracts`"
><div class="text-truncate" style="max-width: 200px"> class="text-truncate max-w-[200px] block text-primary"
{{ v.data_hash }} :title="v.data_hash"
</div></RouterLink
> >
{{ v.data_hash }}
</RouterLink>
</td> </td>
<td>{{ v.creator }}</td> <td>{{ v.creator }}</td>
<td> <td>

2
src/modules/[chain]/gov/index.vue
View File

@ -41,7 +41,7 @@ const changeTab = (val: '2' | '3' | '4') => {
>Rejected</a >Rejected</a
> >
</div> </div>
<ProposalListItem :proposals="store?.proposals[tab]" :votable="tab === '2'" /> <ProposalListItem :proposals="store?.proposals[tab]"/>
</div> </div>
</template> </template>
<route> <route>

13
src/modules/[chain]/ibc/[connection_id].vue
View File

@ -85,7 +85,7 @@ function color(v: string) {
<div class="bg-base-100 px-4 pt-3 pb-4 rounded mb-4 shadow"> <div class="bg-base-100 px-4 pt-3 pb-4 rounded mb-4 shadow">
<h2 class="card-title mb-4">IBC Client State</h2> <h2 class="card-title mb-4">IBC Client State</h2>
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table class="table text-sm w-full"> <table class="table table-compact text-sm w-full">
<tbody> <tbody>
<tr> <tr>
<td class="w-52">update after expiry:</td> <td class="w-52">update after expiry:</td>
@ -93,12 +93,17 @@ function color(v: string) {
</tr> </tr>
<tr> <tr>
<td class="w-52">allow_update_after_misbehaviour:</td> <td class="w-52">allow_update_after_misbehaviour:</td>
<td>{{ clientState.client_state?.allow_update_after_misbehaviour }}</td> <td>
{{ clientState.client_state?.allow_update_after_misbehaviour }}
</td>
</tr> </tr>
<tr> <tr>
<td class="w-52">trust_level:</td> <td class="w-52">trust_level:</td>
<td> {{ clientState.client_state?.trust_level?.numerator }}/{{ <td>
clientState.client_state?.trust_level?.denominator}}</td> {{ clientState.client_state?.trust_level?.numerator }}/{{
clientState.client_state?.trust_level?.denominator
}}
</td>
</tr> </tr>
<tr> <tr>
<td class="w-52">trusting_period:</td> <td class="w-52">trusting_period:</td>

4
src/modules/[chain]/ibc/index.vue
View File

@ -25,7 +25,7 @@ function color(v: string) {
<div class="bg-base-100 px-4 pt-3 pb-4 rounded shadow"> <div class="bg-base-100 px-4 pt-3 pb-4 rounded shadow">
<h2 class="card-title">IBC Connections</h2> <h2 class="card-title">IBC Connections</h2>
<div class="overflow-x-auto mt-4"> <div class="overflow-x-auto mt-4">
<table class="table w-full table-zebra"> <table class="table table-compact w-full table-zebra">
<thead> <thead>
<tr> <tr>
<th class="py-3">Connection Id</th> <th class="py-3">Connection Id</th>
@ -49,7 +49,7 @@ function color(v: string) {
<td class="py-2">{{ v.delay_period }}</td> <td class="py-2">{{ v.delay_period }}</td>
<td class="py-2"> <td class="py-2">
<div <div
class="text-xs truncate relative py-1 px-3 rounded-full w-fit" class="text-xs truncate relative py-[2px] px-3 rounded-full w-fit"
:class="`text-${color(v.state)}`" :class="`text-${color(v.state)}`"
> >
<span <span

33
src/modules/[chain]/index.vue
View File

@ -23,7 +23,6 @@ const walletStore = useWalletStore();
const format = useFormatter(); const format = useFormatter();
const dialog = useTxDialog(); const dialog = useTxDialog();
const stakingStore = useStakingStore(); const stakingStore = useStakingStore();
const coinInfo = computed(() => { const coinInfo = computed(() => {
return store.coinInfo; return store.coinInfo;
}); });
@ -32,7 +31,6 @@ onMounted(() => {
store.loadDashboard(); store.loadDashboard();
walletStore.loadMyAsset(); walletStore.loadMyAsset();
}); });
const ticker = computed(() => store.coinInfo.tickers[store.tickerIndex]); const ticker = computed(() => store.coinInfo.tickers[store.tickerIndex]);
blockchain.$subscribe((m, s) => { blockchain.$subscribe((m, s) => {
@ -246,10 +244,11 @@ const color = computed(() => {
<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-main"> <div class="px-4 pt-4 pb-2 text-lg font-semibold text-main">
{{ walletStore.currentAddress || 'Not Connected' }} {{ walletStore.currentAddress || 'Not Connected' }}
<span <RouterLink
v-if="walletStore.currentAddress" v-if="walletStore.currentAddress"
class="float-right font-light text-sm" class="float-right font-light text-sm cursor-pointert link link-primary no-underline font-medium"
>More</span to="/wallet/portfolio"
>More</RouterLink
> >
</div> </div>
<div <div
@ -317,10 +316,13 @@ const color = computed(() => {
<td>{{ format.formatToken(item?.balance) }}</td> <td>{{ format.formatToken(item?.balance) }}</td>
<td> <td>
{{ {{
format.formatToken({ format.formatToken(
denom: item?.balance?.denom, walletStore?.rewards?.rewards?.find(
amount: item?.delegation?.shares, (el) =>
}) el?.validator_address ===
item?.delegation?.validator_address
)?.reward?.[0]
)
}} }}
</td> </td>
<td> <td>
@ -343,12 +345,21 @@ const color = computed(() => {
</div> </div>
<div class="grid grid-cols-3 gap-4 px-4 pb-6 mt-4"> <div class="grid grid-cols-3 gap-4 px-4 pb-6 mt-4">
<button class="btn btn-success text-white">Send</button> <label for="send" class="btn btn-success text-white">Send</label>
<RouterLink to="/wallet/receive" class="btn btn-info text-white" <RouterLink to="/wallet/receive" class="btn btn-info text-white"
>Receive</RouterLink >Receive</RouterLink
> >
<button class="btn btn-primary text-white">Convert</button> <label for="PingTokenConvert" class="btn btn-primary text-white"
>Convert</label
>
</div> </div>
<Teleport to="body">
<ping-token-convert
:chain-name="blockchain?.chainName"
:endpoint="blockchain?.endpoint?.address"
:params="walletStore?.connectedWallet?.hdPath"
></ping-token-convert>
</Teleport>
</div> </div>
</div> </div>
</template> </template>

7
src/modules/[chain]/staking/[validator].vue
View File

@ -1,6 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { import {
useBankStore,
useBlockchain, useBlockchain,
useFormatter, useFormatter,
useMintStore, useMintStore,
@ -9,7 +8,7 @@ import {
} from '@/stores'; } from '@/stores';
import { onMounted, computed, ref } from 'vue'; import { onMounted, computed, ref } from 'vue';
import { Icon } from '@iconify/vue'; import { Icon } from '@iconify/vue';
import ValidatorCommissionRate from '@/components/ValidatorCommissionRate.vue'; import CommissionRate from '@/components/ValidatorCommissionRate.vue';
import { import {
consensusPubkeyToHexAddress, consensusPubkeyToHexAddress,
operatorAddressToAccount, operatorAddressToAccount,
@ -303,9 +302,7 @@ onMounted(() => {
<div class="mt-3 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="mt-3 grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="h-100"> <div class="h-100">
<ValidatorCommissionRate <CommissionRate :commission="v.commission"></CommissionRate>
:commission="v.commission"
></ValidatorCommissionRate>
</div> </div>
<div> <div>
<div class="h-100 bg-base-100 rounded shadow"> <div class="h-100 bg-base-100 rounded shadow">

4
src/modules/[chain]/tx/[hash].vue
View File

@ -3,7 +3,7 @@ import { useBlockchain, useFormatter } from '@/stores';
import DynamicComponent from '@/components/dynamic/DynamicComponent.vue'; import DynamicComponent from '@/components/dynamic/DynamicComponent.vue';
import { computed, ref } from '@vue/reactivity'; import { computed, ref } from '@vue/reactivity';
import type { Tx, TxResponse } from '@/types'; import type { Tx, TxResponse } from '@/types';
import VueJsonPretty from 'vue-json-pretty'; import JsonPretty from 'vue-json-pretty';
import 'vue-json-pretty/lib/styles.css'; import 'vue-json-pretty/lib/styles.css';
const props = defineProps(['hash', 'chain']); const props = defineProps(['hash', 'chain']);
@ -119,7 +119,7 @@ const messages = computed(() => {
class="bg-base-100 px-4 pt-3 pb-4 rounded shadow" class="bg-base-100 px-4 pt-3 pb-4 rounded shadow"
> >
<h2 class="card-title truncate mb-2">JSON</h2> <h2 class="card-title truncate mb-2">JSON</h2>
<vue-json-pretty :data="tx" :deep="3" /> <JsonPretty :data="tx" :deep="3" />
</div> </div>
</div> </div>
</template> </template>

25
src/stores/useGovStore.ts
View File

@ -2,6 +2,7 @@ import { defineStore } from 'pinia';
import { useBlockchain } from './useBlockchain'; import { useBlockchain } from './useBlockchain';
import type { PageRequest, PaginatedProposals } from '@/types'; import type { PageRequest, PaginatedProposals } from '@/types';
import { LoadingStatus } from './useDashboard'; import { LoadingStatus } from './useDashboard';
import { useWalletStore } from './useWalletStore'
import { reactive } from 'vue'; import { reactive } from 'vue';
export const useGovStore = defineStore('govStore', { export const useGovStore = defineStore('govStore', {
@ -20,6 +21,9 @@ export const useGovStore = defineStore('govStore', {
blockchain() { blockchain() {
return useBlockchain(); return useBlockchain();
}, },
walletstore() {
return useWalletStore();
}
}, },
actions: { actions: {
initial() { initial() {
@ -34,12 +38,24 @@ export const useGovStore = defineStore('govStore', {
await this.blockchain.rpc?.getGovProposals(status) await this.blockchain.rpc?.getGovProposals(status)
); );
if (status === '2') { if (status === '2') {
proposals?.proposals?.forEach(async (x1) => { proposals?.proposals?.forEach((item) => {
await this.fetchTally(x1.proposal_id).then((res) => { this.fetchTally(item.proposal_id).then((res) => {
x1.final_tally_result = res?.tally; item.final_tally_result = res?.tally;
}); });
if (this.walletstore.currentAddress) {
try {
this.fetchProposalVotesVoter(item.proposal_id,this.walletstore.currentAddress).then((res) => {
item.voterStatus = res?.vote?.option || 'No With Veto'
});
} catch (error) {
item.voterStatus = 'No With Veto'
}
} else {
item.voterStatus = 'No With Veto'
}
}); });
} }
this.loading[status] = LoadingStatus.Loaded; this.loading[status] = LoadingStatus.Loaded;
this.proposals[status] = proposals; this.proposals[status] = proposals;
} }
@ -62,5 +78,8 @@ export const useGovStore = defineStore('govStore', {
async fetchProposalVotes(proposalId: string, next_key?: string) { async fetchProposalVotes(proposalId: string, next_key?: string) {
return this.blockchain.rpc.getGovProposalVotes(proposalId, next_key); return this.blockchain.rpc.getGovProposalVotes(proposalId, next_key);
}, },
async fetchProposalVotesVoter(proposalId: string, voter: string) {
return this.blockchain.rpc.getGovProposalVotesVoter(proposalId, voter);
},
}, },
}); });

3
src/types/gov.ts
View File

@ -44,7 +44,8 @@ export interface GovProposal {
"total_deposit": Coin[], "total_deposit": Coin[],
"voting_start_time": string, "voting_start_time": string,
"voting_end_time": string, "voting_end_time": string,
"is_expedited": boolean "is_expedited": boolean,
"voterStatus"?: string,
} }
export interface Tally { export interface Tally {

37
yarn.lock
View File

@ -2572,6 +2572,13 @@
dependencies: dependencies:
"@babel/types" "^7.3.0" "@babel/types" "^7.3.0"
"@types/bignumber.js@^5.0.0":
version "5.0.0"
resolved "https://registry.yarnpkg.com/@types/bignumber.js/-/bignumber.js-5.0.0.tgz#d9f1a378509f3010a3255e9cc822ad0eeb4ab969"
integrity sha512-0DH7aPGCClywOFaxxjE6UwpN2kQYe9LwuDQMv+zYA97j5GkOMo8e66LYT+a8JYU7jfmUFRZLa9KycxHDsKXJCA==
dependencies:
bignumber.js "*"
"@types/debug@^4.1.7": "@types/debug@^4.1.7":
version "4.1.7" version "4.1.7"
resolved "https://registry.npmjs.org/@types/debug/-/debug-4.1.7.tgz" resolved "https://registry.npmjs.org/@types/debug/-/debug-4.1.7.tgz"
@ -2960,7 +2967,7 @@
"@vue/compiler-dom" "3.2.47" "@vue/compiler-dom" "3.2.47"
"@vue/shared" "3.2.47" "@vue/shared" "3.2.47"
"@vue/devtools-api@^6.2.1", "@vue/devtools-api@^6.4.5": "@vue/devtools-api@^6.2.1", "@vue/devtools-api@^6.4.5", "@vue/devtools-api@^6.5.0":
version "6.5.0" version "6.5.0"
resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.0.tgz" resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.0.tgz"
integrity sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q== integrity sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==
@ -3429,6 +3436,11 @@ big-integer@1.6.36:
resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.36.tgz#78631076265d4ae3555c04f85e7d9d2f3a071a36" resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.36.tgz#78631076265d4ae3555c04f85e7d9d2f3a071a36"
integrity sha512-t70bfa7HYEA1D9idDbmuv7YbsbVkQ+Hp+8KFSul4aE5e/i1bjCNIRYJZlA8Q8p0r9T8cF/RVvwUgRA//FydEyg== integrity sha512-t70bfa7HYEA1D9idDbmuv7YbsbVkQ+Hp+8KFSul4aE5e/i1bjCNIRYJZlA8Q8p0r9T8cF/RVvwUgRA//FydEyg==
bignumber.js@*:
version "9.1.1"
resolved "https://registry.yarnpkg.com/bignumber.js/-/bignumber.js-9.1.1.tgz#c4df7dc496bd849d4c9464344c1aa74228b4dac6"
integrity sha512-pHm4LsMJ6lzgNGVfZHjMoO8sdoRhOzOH4MLmY65Jg70bpxCKu5iOHNJyfF6OyvYw7t8Fpf35RuzUyqnQsj8Vig==
binary-extensions@^2.0.0: binary-extensions@^2.0.0:
version "2.2.0" version "2.2.0"
resolved "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz" resolved "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz"
@ -6796,10 +6808,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.9: ping-widget@^0.0.13:
version "0.0.9" version "0.0.13"
resolved "https://registry.yarnpkg.com/ping-widget/-/ping-widget-0.0.9.tgz#56de5ee68320a37aadda614008d8c42c4cac39a0" resolved "https://registry.yarnpkg.com/ping-widget/-/ping-widget-0.0.13.tgz#3738882da243871f7ed322cd75ef7b1bed8fd3bb"
integrity sha512-HXfH58FBCbuDMD56X1Wsxi4jKRWxWK7TsKYfGcDJPGOFQOreT2WDc6wEZr1pfG5Mjr4SOVJz84xR4S5SptXJqA== integrity sha512-BPpPcwDdffqHFO/6MeD3JleGWLFhOSSQLG2L0WaI1aiAe1em8gTC03refg86CjjwXtU4XtwJ0xnXgbJAVvZzjA==
dependencies: dependencies:
"@cosmjs/amino" "^0.30.1" "@cosmjs/amino" "^0.30.1"
"@cosmjs/ledger-amino" "^0.30.1" "@cosmjs/ledger-amino" "^0.30.1"
@ -6811,10 +6823,12 @@ ping-widget@^0.0.9:
"@tharsis/eip712" "^0.2.4" "@tharsis/eip712" "^0.2.4"
"@tharsis/proto" "^0.1.20" "@tharsis/proto" "^0.1.20"
"@tharsis/transactions" "^0.2.6" "@tharsis/transactions" "^0.2.6"
"@types/bignumber.js" "^5.0.0"
cross-fetch "^3.1.5" cross-fetch "^3.1.5"
daisyui "^2.51.6" daisyui "^2.51.6"
dayjs "^1.11.7" dayjs "^1.11.7"
osmojs "^15.2.1" osmojs "^15.2.1"
pinia "^2.0.36"
vue "^3.2.47" vue "^3.2.47"
vue3-webcomponent-wrapper "^0.2.0" vue3-webcomponent-wrapper "^0.2.0"
@ -6826,6 +6840,14 @@ pinia@^2.0.28:
"@vue/devtools-api" "^6.4.5" "@vue/devtools-api" "^6.4.5"
vue-demi "*" vue-demi "*"
pinia@^2.0.36:
version "2.1.1"
resolved "https://registry.yarnpkg.com/pinia/-/pinia-2.1.1.tgz#542c6bb8a7c27b342082f431bccd6124b63c5b55"
integrity sha512-Y2CgpcUtD8Ogdvo5LW5g20ykSZgnVDMgTSZFr40EvO6HB8axQk+0lHa1UrRah9wworFaxjovwRlY/wRICWj/KQ==
dependencies:
"@vue/devtools-api" "^6.5.0"
vue-demi ">=0.14.2"
pirates@^4.0.1, pirates@^4.0.4: pirates@^4.0.1, pirates@^4.0.4:
version "4.0.5" version "4.0.5"
resolved "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz" resolved "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz"
@ -8443,6 +8465,11 @@ vue-demi@>=0.14.0:
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.1.tgz#1ed9af03a27642762bfed83d8750805302d0398d" resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.1.tgz#1ed9af03a27642762bfed83d8750805302d0398d"
integrity sha512-rt+yuCtXvscYot9SQQj3WKZJVSriPNqVkpVBNEHPzSgBv7QIYzsS410VqVgvx8f9AAPgjg+XPKvmV3vOqqkJQQ== integrity sha512-rt+yuCtXvscYot9SQQj3WKZJVSriPNqVkpVBNEHPzSgBv7QIYzsS410VqVgvx8f9AAPgjg+XPKvmV3vOqqkJQQ==
vue-demi@>=0.14.2:
version "0.14.3"
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.3.tgz#5c7375527ad32580a7d8d28ee322bc059dbc1b99"
integrity sha512-aknytzARm7U20nMhvOdfa5IRiS+oyATtd55s3fICsT7wEtN/qoOiOINsNsNJjeZCOsPNOGS4p1yDOwH9cTxgjg==
vue-eslint-parser@^9.0.0, vue-eslint-parser@^9.0.1: vue-eslint-parser@^9.0.0, vue-eslint-parser@^9.0.1:
version "9.1.0" version "9.1.0"
resolved "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.1.0.tgz" resolved "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.1.0.tgz"