From 9dd7f22cda0b6af329aabe2b5ae05a518260e609 Mon Sep 17 00:00:00 2001
From: liangping <18786721@qq.com>
Date: Sun, 8 Aug 2021 11:42:12 +0800
Subject: [PATCH] Update UI
---
src/libs/data/data.js | 22 ++++++++++++++++++++--
src/libs/data/proposal.js | 6 +++---
src/libs/data/stdtx.js | 2 +-
src/libs/data/wrapstdtx.js | 22 ++++++++++++++--------
src/views/Block.vue | 12 +++++++-----
src/views/Blocks.vue | 20 ++++++++++++++------
src/views/Governance.vue | 3 ---
src/views/Staking.vue | 34 +++++++++++++++++-----------------
src/views/Transaction.vue | 6 +++++-
9 files changed, 81 insertions(+), 46 deletions(-)
diff --git a/src/libs/data/data.js b/src/libs/data/data.js
index 5a476d55..5c353eba 100644
--- a/src/libs/data/data.js
+++ b/src/libs/data/data.js
@@ -1,11 +1,29 @@
import dayjs from 'dayjs'
+import relativeTime from 'dayjs/plugin/relativeTime'
import {
Bech32, fromBase64, fromHex, toHex,
} from '@cosmjs/encoding'
import { sha256 } from '@cosmjs/crypto'
-export function toDay(time) {
- return dayjs(time).format('YYYY-MM-DD HH:mm')
+dayjs.extend(relativeTime)
+
+export function toDay(time, format = 'long') {
+ if (format === 'long') {
+ return dayjs(time).format('YYYY-MM-DD HH:mm')
+ }
+ if (format === 'date') {
+ return dayjs(time).format('YYYY-MM-DD')
+ }
+ if (format === 'time') {
+ return dayjs(time).format('HH:mm:ss')
+ }
+ if (format === 'from') {
+ return dayjs(time).fromNow()
+ }
+ if (format === 'to') {
+ return dayjs(time).toNow()
+ }
+ return dayjs(time).format('YYYY-MM-DD HH:mm:ss')
}
export function percent(num) {
diff --git a/src/libs/data/proposal.js b/src/libs/data/proposal.js
index 71738f74..81654771 100644
--- a/src/libs/data/proposal.js
+++ b/src/libs/data/proposal.js
@@ -28,9 +28,9 @@ export default class Proposal {
this.title = element.content.value.title
this.description = element.content.value.description
this.tally = new ProposalTally().init(element.final_tally_result, total)
- this.submit_time = toDay(element.submit_time)
- this.voting_end_time = toDay(element.voting_end_time)
- this.voting_start_time = toDay(element.voting_start_time)
+ this.submit_time = toDay(element.submit_time, 'date')
+ this.voting_end_time = toDay(element.voting_end_time, 'date')
+ this.voting_start_time = toDay(element.voting_start_time, 'date')
this.total_deposit = formatToken(element.total_deposit[0])
this.contents = element.content.value
return this
diff --git a/src/libs/data/stdtx.js b/src/libs/data/stdtx.js
index de1b5831..233e896c 100644
--- a/src/libs/data/stdtx.js
+++ b/src/libs/data/stdtx.js
@@ -7,7 +7,7 @@ export default class StdTx {
this.fee = [new Token()]
this.gas = 0
this.memo = ''
- this.messages = []
+ this.messages = null
this.signatures = []
this.timeout_height = 0
}
diff --git a/src/libs/data/wrapstdtx.js b/src/libs/data/wrapstdtx.js
index fa1aab1c..f973a98c 100644
--- a/src/libs/data/wrapstdtx.js
+++ b/src/libs/data/wrapstdtx.js
@@ -3,6 +3,7 @@ import StdTx from './stdtx'
export default class WrapStdTx {
constructor() {
+ this.std = true
this.code = 0
this.txhash = ''
this.data = ''
@@ -19,14 +20,19 @@ export default class WrapStdTx {
static create(element, version = '0.40') {
const self = new WrapStdTx()
if (compareVersions(version, '0.40') < 1) {
- self.txhash = element.txhash
- self.data = element.data
- self.gas_used = element.gas_used
- self.gas_wanted = element.gas_wanted
- self.height = Number(element.height)
- self.logs = element.logs
- self.timestamp = element.timestamp
- self.tx = StdTx.create(element.tx)
+ if (element.txhash) {
+ self.txhash = element.txhash
+ self.data = element.data
+ self.gas_used = element.gas_used
+ self.gas_wanted = element.gas_wanted
+ self.height = Number(element.height)
+ self.logs = element.logs
+ self.timestamp = element.timestamp
+ self.tx = StdTx.create(element.tx)
+ } else {
+ self.std = false
+ self.raw = element
+ }
} else {
self.code = element.tx_response.code
self.txhash = element.tx_response.txhash
diff --git a/src/views/Block.vue b/src/views/Block.vue
index d74ee507..06421289 100644
--- a/src/views/Block.vue
+++ b/src/views/Block.vue
@@ -82,16 +82,18 @@ export default {
this.$http.getBlockByHeight(height).then(res => {
this.block = res
const { txs } = res.block.data
+ if (txs === null) return
const array = []
- for (let i = 0; i <= txs.length; i += 1) {
+ for (let i = 0; i < txs.length; i += 1) {
+ let tx = new Tx()
try {
const origin = decodeTxRaw(fromBase64(txs[i]))
- const tx = Tx.create(origin)
- tx.setHash(txs[i])
- array.push(tx)
+ tx = Tx.create(origin)
} catch (e) {
- // catch errors
+ // catch errors
}
+ tx.setHash(txs[i])
+ array.push(tx)
}
if (array.length > 0) this.txs = array
})
diff --git a/src/views/Blocks.vue b/src/views/Blocks.vue
index d9c27499..069ea6be 100644
--- a/src/views/Blocks.vue
+++ b/src/views/Blocks.vue
@@ -20,11 +20,11 @@
- #{{ data.item.block.header.height }}
+ {{ data.item.block.header.height }}
- {{ data.item.block_id.hash }}
+ {{ data.item.block_id.hash }}
{{ formatTime(data.item.block.header.time) }}
@@ -65,10 +65,14 @@ export default {
islive: true,
blocks: [],
list_fields: [
- { key: 'height', sortable: true },
+ {
+ key: 'height',
+ sortable: true,
+ },
{
key: 'hash',
- tdClass: 'text-truncate',
+ thClass: 'd-none d-lg-block',
+ tdClass: 'd-none d-lg-block',
},
{
key: 'proposer',
@@ -80,7 +84,11 @@ export default {
tdClass: 'text-right',
thClass: 'text-right',
},
- { key: 'time' },
+ {
+ key: 'time',
+ thClass: 'd-none d-md-block',
+ tdClass: 'd-none d-md-block',
+ },
],
}
},
@@ -111,7 +119,7 @@ export default {
},
methods: {
length: v => (Array.isArray(v) ? v.length : 0),
- formatTime: v => toDay(v),
+ formatTime: v => toDay(v, 'time'),
fetch() {
this.$http.getLatestBlock().then(b => {
const has = this.blocks.findIndex(x => x.block.header.height === b.block.header.height)
diff --git a/src/views/Governance.vue b/src/views/Governance.vue
index 8b8ee2bf..25fae898 100644
--- a/src/views/Governance.vue
+++ b/src/views/Governance.vue
@@ -250,7 +250,4 @@ section {
border-radius: .357rem;
}
-.gov-wrapper .gov {
- width: 9.8rem;
-}
diff --git a/src/views/Staking.vue b/src/views/Staking.vue
index a3e16f76..1edf3b2d 100644
--- a/src/views/Staking.vue
+++ b/src/views/Staking.vue
@@ -3,19 +3,19 @@
-
+
+
+
+
+
+ Top 33%
+
+
+
+ Top 67% of Voting Power
+
- Validators (Max:{{ stakingParameters.max_validators }})
-
-
-
-
- Top 33%
-
-
-
- Top 67% of Voting Power
-
+ {{ validators.length }}/{{ stakingParameters.max_validators }} Validators
{
- this.stakingPool = res
- })
this.$http.getStakingParameters().then(res => {
this.stakingParameters = res
})
this.$http.getValidatorList().then(res => {
const identities = []
const temp = res
+ let total = 0
for (let i = 0; i < temp.length; i += 1) {
+ total += temp[i].tokens
const { identity } = temp[i].description
const url = this.$store.getters['chains/getAvatarById'](identity)
if (url) {
@@ -153,6 +152,7 @@ export default {
identities.push(identity)
}
}
+ this.stakingPool = total
this.validators = temp
// fetch avatar from keybase
@@ -179,7 +179,7 @@ export default {
} else {
window.sum += item.tokens
}
- const rank = window.sum / this.stakingPool.bondedToken
+ const rank = window.sum / this.stakingPool
if (rank < 0.333) {
return 'danger'
}
diff --git a/src/views/Transaction.vue b/src/views/Transaction.vue
index 85cdd4b7..a8f222d6 100644
--- a/src/views/Transaction.vue
+++ b/src/views/Transaction.vue
@@ -1,7 +1,11 @@
-
+
+
{{ 'txhash' }}