improve active proposal
This commit is contained in:
liangping
parent
d25c9d1954
commit
4cb900ed17
@ -93,33 +93,128 @@
|
||||
<b-card-title>Active Proposals</b-card-title>
|
||||
</b-card-header>
|
||||
<b-card-body>
|
||||
<b-media
|
||||
<b-row
|
||||
v-for="prop in proprosals2"
|
||||
:key="prop.id"
|
||||
no-body
|
||||
class="mb-1"
|
||||
>
|
||||
<b-media-aside
|
||||
v-b-modal.operation-modal
|
||||
@click="selectProposal('Vote',prop.id, prop.title)"
|
||||
<b-col
|
||||
md="6"
|
||||
sm="12"
|
||||
>
|
||||
<b-avatar
|
||||
rounded
|
||||
size="42"
|
||||
:variant="myVotes[prop.id] ? 'light-primary': 'primary'"
|
||||
<b-media
|
||||
no-body
|
||||
class="mb-1"
|
||||
>
|
||||
{{ myVotes[prop.id] || 'Vote' }}
|
||||
</b-avatar>
|
||||
</b-media-aside>
|
||||
<b-link :to="`./${chain}/gov/${prop.id}`">
|
||||
<b-media-body class="d-flex flex-column justify-content-center">
|
||||
<h6 class="transaction-title">
|
||||
{{ prop.id }}. {{ prop.title }}
|
||||
</h6>
|
||||
<small>{{ formatType(prop.contents['@type']) }} {{ formatEnding(prop.voting_end_time) }}</small>
|
||||
</b-media-body>
|
||||
</b-link>
|
||||
</b-media>
|
||||
<b-media-aside
|
||||
@click="showDetail(prop.id)"
|
||||
>
|
||||
<b-avatar
|
||||
rounded
|
||||
size="42"
|
||||
variant="light-primary"
|
||||
>
|
||||
{{ prop.id }}
|
||||
</b-avatar>
|
||||
</b-media-aside>
|
||||
<b-link :to="`./${chain}/gov/${prop.id}`">
|
||||
<b-media-body class="d-flex flex-column justify-content-center">
|
||||
<h6 class="transaction-title">
|
||||
{{ prop.title }}
|
||||
</h6>
|
||||
<small>{{ formatType(prop.contents['@type']) }} {{ formatEnding(prop.voting_end_time) }}</small>
|
||||
</b-media-body>
|
||||
</b-link>
|
||||
</b-media>
|
||||
</b-col>
|
||||
<b-col
|
||||
md="6"
|
||||
sm="12"
|
||||
>
|
||||
<b-row>
|
||||
<b-col cols="8">
|
||||
<b-progress
|
||||
:max="100"
|
||||
height="2rem"
|
||||
show-progress
|
||||
>
|
||||
<b-progress-bar
|
||||
:id="'vote-yes'+prop.id"
|
||||
variant="success"
|
||||
:value="percent(prop.tally.yes)"
|
||||
show-progress
|
||||
:label="`${percent(prop.tally.yes).toFixed()}%`"
|
||||
/>
|
||||
<b-progress-bar
|
||||
:id="'vote-no'+prop.id"
|
||||
variant="warning"
|
||||
:value="percent(prop.tally.no)"
|
||||
:label="`${percent(prop.tally.no).toFixed()}%`"
|
||||
show-progress
|
||||
/>
|
||||
<b-progress-bar
|
||||
:id="'vote-veto'+prop.id"
|
||||
variant="danger"
|
||||
:value="percent(prop.tally.veto)"
|
||||
:label="`${percent(prop.tally.veto).toFixed()}%`"
|
||||
show-progress
|
||||
/>
|
||||
<b-progress-bar
|
||||
:id="'vote-abstain'+prop.id"
|
||||
variant="secondary"
|
||||
:value="percent(prop.tally.abstain)"
|
||||
:label="`${percent(prop.tally.abstain).toFixed()}%`"
|
||||
show-progress
|
||||
/>
|
||||
</b-progress>
|
||||
<b-tooltip
|
||||
:target="'vote-yes'+prop.id"
|
||||
>
|
||||
{{ percent(prop.tally.yes) }}% voted Yes
|
||||
</b-tooltip>
|
||||
<b-tooltip
|
||||
:target="'vote-no'+prop.id"
|
||||
>
|
||||
{{ percent(prop.tally.no) }}% voted No
|
||||
</b-tooltip>
|
||||
<b-tooltip
|
||||
:target="'vote-veto'+prop.id"
|
||||
>
|
||||
{{ percent(prop.tally.veto) }}% voted No With Veto
|
||||
</b-tooltip>
|
||||
<b-tooltip
|
||||
:target="'vote-abstain'+prop.id"
|
||||
>
|
||||
{{ percent(prop.tally.abstain) }}% voted Abstain
|
||||
</b-tooltip>
|
||||
</b-col>
|
||||
<b-col cols="4">
|
||||
<b-button
|
||||
v-b-modal.operation-modal
|
||||
variant="primary"
|
||||
size="sm"
|
||||
@click="selectProposal('Vote',prop.id, prop.title)"
|
||||
>
|
||||
{{ myVotes[prop.id] ? `${myVotes[prop.id]}`: 'Vote' }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
<b-col
|
||||
cols="12"
|
||||
:class="detailId === prop.id? 'd-block': 'd-none'"
|
||||
>
|
||||
<b-card
|
||||
border-variant="primary"
|
||||
bg-variant="transparent"
|
||||
class="shadow-none"
|
||||
style="max-height:350px;overflow: auto;"
|
||||
>
|
||||
<VueMarkdown>
|
||||
{{ addNewLine(prop.description) }}
|
||||
</VueMarkdown>
|
||||
</b-card>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div v-if="proprosals2.length === 0">
|
||||
No active proposal!
|
||||
<b-link :to="`./${chain}/gov`">
|
||||
@ -343,7 +438,7 @@
|
||||
<script>
|
||||
import {
|
||||
BRow, BCol, BAlert, BCard, BTable, BFormCheckbox, BCardHeader, BCardTitle, BMedia, BMediaAside, BMediaBody, BAvatar,
|
||||
BCardBody, BLink, BButtonGroup, BButton, BTooltip, VBModal, VBTooltip, BCardFooter,
|
||||
BCardBody, BLink, BButtonGroup, BButton, BTooltip, VBModal, VBTooltip, BCardFooter, BProgress, BProgressBar,
|
||||
} from 'bootstrap-vue'
|
||||
import {
|
||||
formatNumber, formatTokenAmount, isToken, percent, timeIn, toDay, toDuration, tokenFormatter, getLocalAccounts,
|
||||
@ -352,6 +447,7 @@ import {
|
||||
import OperationModal from '@/views/components/OperationModal/index.vue'
|
||||
import Ripple from 'vue-ripple-directive'
|
||||
import dayjs from 'dayjs'
|
||||
import VueMarkdown from 'vue-markdown'
|
||||
import ParametersModuleComponent from './components/parameters/ParametersModuleComponent.vue'
|
||||
import DashboardCardHorizontal from './components/dashboard/DashboardCardHorizontal.vue'
|
||||
import DashboardCardVertical from './components/dashboard/DashboardCardVertical.vue'
|
||||
@ -378,6 +474,9 @@ export default {
|
||||
BCardBody,
|
||||
BLink,
|
||||
BCardFooter,
|
||||
BProgress,
|
||||
BProgressBar,
|
||||
VueMarkdown,
|
||||
|
||||
OperationModal,
|
||||
ParametersModuleComponent,
|
||||
@ -393,6 +492,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detailId: 0,
|
||||
fields: ['validator', 'delegation', 'rewards', 'action'],
|
||||
delegations: [],
|
||||
rewards: [],
|
||||
@ -461,9 +561,26 @@ export default {
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.$http.getGovernanceListByStatus(2).then(res => {
|
||||
this.proposals = res.proposals
|
||||
this.$http.getStakingParameters().then(res => {
|
||||
Promise.all([this.$http.getStakingPool(), this.$http.getBankTotal(res.bond_denom)])
|
||||
.then(pool => {
|
||||
this.supply = `${formatNumber(formatTokenAmount(pool[1].amount, 2, res.bond_denom, false), true, 2)}`
|
||||
this.bonded = `${formatNumber(formatTokenAmount(pool[0].bondedToken, 2, res.bond_denom, false), true, 2)}`
|
||||
this.ratio = `${percent(pool[0].bondedToken / pool[1].amount)}%`
|
||||
|
||||
this.$http.getGovernanceListByStatus(2).then(gov => {
|
||||
gov.proposals.forEach(p => {
|
||||
this.$http.getGovernanceTally(p.id, pool[0].bondedToken).then(update => {
|
||||
const p2 = p
|
||||
p2.tally = update
|
||||
this.proposals.push(p2)
|
||||
this.proposals.sort((a, b) => a.id - b.id)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
this.$http.getLatestBlock().then(res => {
|
||||
this.height = res.block.header.height
|
||||
if (timeIn(res.block.header.time, 3, 'm')) {
|
||||
@ -475,15 +592,6 @@ export default {
|
||||
this.validators = res.block.last_commit.signatures.length
|
||||
})
|
||||
|
||||
this.$http.getStakingParameters().then(res => {
|
||||
Promise.all([this.$http.getStakingPool(), this.$http.getBankTotal(res.bond_denom)])
|
||||
.then(pool => {
|
||||
this.supply = `${formatNumber(formatTokenAmount(pool[1].amount, 2, res.bond_denom, false), true, 2)}`
|
||||
this.bonded = `${formatNumber(formatTokenAmount(pool[0].bondedToken, 2, res.bond_denom, false), true, 2)}`
|
||||
this.ratio = `${percent(pool[0].bondedToken / pool[1].amount)}%`
|
||||
})
|
||||
})
|
||||
|
||||
this.$http.getCommunityPool().then(res => {
|
||||
this.communityPool = this.formatToken(res.pool)
|
||||
})
|
||||
@ -609,6 +717,10 @@ export default {
|
||||
return { title: this.convert(data[k]), subtitle: k }
|
||||
})
|
||||
},
|
||||
addNewLine(value) {
|
||||
return value ? value.replace(/(?:\\[rn])+/g, '\n') : '-'
|
||||
},
|
||||
percent: v => percent(v),
|
||||
formatDate: v => dayjs(v).format('YYYY-MM-DD HH:mm:ss'),
|
||||
convert(v) {
|
||||
if (typeof v === 'object') {
|
||||
@ -633,6 +745,13 @@ export default {
|
||||
}
|
||||
return v
|
||||
},
|
||||
showDetail(id) {
|
||||
if (this.detailId !== id) {
|
||||
this.detailId = id
|
||||
} else {
|
||||
this.detailId = 0
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user