Improvme ui

This commit is contained in:
liangping 2021-08-06 11:58:54 +08:00
parent 523b952957
commit 4646e335c3
15 changed files with 138 additions and 26 deletions

View File

@ -5,10 +5,13 @@
"cosmos": "Cosmos Hub", "cosmos": "Cosmos Hub",
"kava": "Kava", "kava": "Kava",
"akash": "Akash Decloud", "akash": "Akash Decloud",
"iris": "Irisnet", "iris": "Iris Hub",
"crypto": "Crypto.com",
"staking": "Staking", "staking": "Staking",
"governance": "Governance", "governance": "Governance",
"summary": "Summary", "summary": "Summary",
"blocks": "Blocks",
"blockchains": "Blockchains", "blockchains": "Blockchains",
"proposal_id": "Proposal ID", "proposal_id": "Proposal ID",

View File

@ -49,7 +49,7 @@ export function formatToken(token) {
return '' return ''
} }
const COUNT_ABBRS = ['', 'K', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y'] const COUNT_ABBRS = ['', 'K', 'M', 'B', 'T', 'P', 'E', 'Z', 'Y']
export function formatNumber(count, withAbbr = false, decimals = 2) { export function formatNumber(count, withAbbr = false, decimals = 2) {
const i = count === 0 ? count : Math.floor(Math.log(count) / Math.log(1000)) const i = count === 0 ? count : Math.floor(Math.log(count) / Math.log(1000))

View File

@ -6,6 +6,11 @@ const modules = [
title: 'summary', title: 'summary',
route: 'info', route: 'info',
}, },
{
scope: 'normal',
title: 'blocks',
route: 'blocks',
},
{ {
scope: 'normal', scope: 'normal',
title: 'staking', title: 'staking',

View File

@ -116,7 +116,7 @@ const router = new VueRouter({
name: 'blocks', name: 'blocks',
component: () => import('@/views/Blocks.vue'), component: () => import('@/views/Blocks.vue'),
meta: { meta: {
pageTitle: 'Block', pageTitle: 'Blocks',
breadcrumb: [ breadcrumb: [
{ {
text: 'Blocks', text: 'Blocks',
@ -126,12 +126,16 @@ const router = new VueRouter({
}, },
}, },
{ {
path: '/:chain/block/:height', path: '/:chain/blocks/:height',
name: 'block', name: 'block',
component: () => import('@/views/Block.vue'), component: () => import('@/views/Block.vue'),
meta: { meta: {
pageTitle: 'Block', pageTitle: 'Block',
breadcrumb: [ breadcrumb: [
{
text: 'Blocks',
active: true,
},
{ {
text: 'Block', text: 'Block',
active: true, active: true,
@ -169,9 +173,17 @@ const router = new VueRouter({
layout: 'full', layout: 'full',
}, },
}, },
{
path: '/error/chain-not-exists',
name: 'chain-404',
component: () => import('@/views/error/ChainNotExist.vue'),
meta: {
layout: 'full',
},
},
{ {
path: '*', path: '*',
redirect: 'error-404', redirect: '/error/error-404',
}, },
], ],
}) })
@ -192,8 +204,14 @@ router.beforeEach((to, from, next) => {
store.commit('setup_sdk_version', { chain_name: c, version: version[0] }) store.commit('setup_sdk_version', { chain_name: c, version: version[0] })
}) })
} }
}
next() next()
} else if (c) {
console.log(from, to, c)
// if (c) {
next({ name: 'chain-404' })
} else {
next()
}
}) })
// ? For splash screen // ? For splash screen

View File

@ -1,5 +1,5 @@
{ {
"chain_name": "cosmos", "chain_name": "cosmos",
"api":"https://lcd-cosmoshub.keplr.app", "api":"https://cosmos.api.ping.pub",
"logo": "https://dl.airtable.com/.attachments/e54f814bba8c0f9af8a3056020210de0/2d1155fb/cosmos-hub.svg" "logo": "https://dl.airtable.com/.attachments/e54f814bba8c0f9af8a3056020210de0/2d1155fb/cosmos-hub.svg"
} }

View File

@ -3,18 +3,18 @@ let chains = {}
const localChains = localStorage.getItem('chains') const localChains = localStorage.getItem('chains')
if (localChains) { if (localChains) {
chains = JSON.parse(localChains) chains = JSON.parse(localChains)
} else {
const configs = require.context('.', false, /\.json$/)
configs.keys().forEach(k => {
const c = configs(k)
chains[c.chain_name] = c
})
localStorage.setItem('chains', JSON.stringify(chains))
} }
Object.keys(chains).forEach(key => { const configs = require.context('.', false, /\.json$/)
const chain = chains[key]
const update = {}
configs.keys().forEach(k => {
const c = configs(k)
update[c.chain_name] = c
})
Object.keys(update).forEach(key => {
const chain = update[key]
fetch(`${chain.api}/node_info`) fetch(`${chain.api}/node_info`)
.then(res => res.json()) .then(res => res.json())
.then(json => { .then(json => {
@ -23,7 +23,7 @@ Object.keys(chains).forEach(key => {
const version = sdk.match(re) const version = sdk.match(re)
// eslint-disable-next-line prefer-destructuring // eslint-disable-next-line prefer-destructuring
chain.sdk_version = version[0] chain.sdk_version = version[0]
localStorage.setItem('chains', JSON.stringify(chains)) localStorage.setItem('chains', JSON.stringify(update))
}) })
}) })

View File

@ -0,0 +1,5 @@
{
"chain_name": "iris",
"api": "https://lcd-iris.keplr.app",
"logo": "https://dl.airtable.com/.attachments/2d6d51b1b262db00ecc51616ffc3bdf5/90ff00d0/IRISnet.svg"
}

View File

@ -19,7 +19,7 @@
> >
<!-- Column: Height --> <!-- Column: Height -->
<template #cell(height)="data"> <template #cell(height)="data">
<router-link :to="`./block/${data.item.block.header.height}`"> <router-link :to="`./blocks/${data.item.block.header.height}`">
#{{ data.item.block.header.height }} #{{ data.item.block.header.height }}
</router-link> </router-link>
</template> </template>

View File

@ -14,7 +14,7 @@
</h2> </h2>
<p class="mb-3"> <p class="mb-3">
If you want add your chain to our explorer, be free to contact us. If you want to add your chain to our explorer, be free to contact us.
</p> </p>
<div> <div>

View File

@ -2,7 +2,7 @@
<b-table-simple <b-table-simple
v-if="typeof tablefield === 'object'" v-if="typeof tablefield === 'object'"
hover hover
small :small="small"
striped striped
responsive responsive
> >
@ -24,6 +24,7 @@
<b-td <b-td
v-else-if="typeof (value) ==='object'" v-else-if="typeof (value) ==='object'"
hover hover
class="overflow-hidden"
> >
<b-tabs> <b-tabs>
<b-tab <b-tab
@ -45,7 +46,7 @@
</b-tabs> </b-tabs>
</b-td> </b-td>
<b-td v-else> <b-td v-else>
{{ formatText(value) }} {{ value }}
</b-td> </b-td>
</b-tr> </b-tr>
</b-table-simple> </b-table-simple>
@ -73,6 +74,10 @@ export default {
type: [Array, Object], type: [Array, Object],
default: () => {}, default: () => {},
}, },
small: {
type: Boolean,
default: true,
},
}, },
methods: { methods: {
formatObject(value) { formatObject(value) {

View File

@ -76,7 +76,10 @@
</b-td><b-td>{{ proposal.type }}</b-td> </b-td><b-td>{{ proposal.type }}</b-td>
</b-tr> </b-tr>
</b-table-simple> </b-table-simple>
<object-field-component :tablefield="proposal.contents" /> <object-field-component
:tablefield="proposal.contents"
:small="false"
/>
</b-card-body> </b-card-body>
<b-card-footer> <b-card-footer>
<router-link :to="`../gov`"> <router-link :to="`../gov`">

View File

@ -25,7 +25,7 @@
sort-by="tokens" sort-by="tokens"
striped striped
hover hover
responsive="sm" responsive
> >
<!-- A virtual column --> <!-- A virtual column -->
<template #cell(index)="data"> <template #cell(index)="data">

View File

@ -0,0 +1,73 @@
<template>
<!-- Error page-->
<div class="misc-wrapper">
<b-link class="brand-logo">
<vuexy-logo />
<h2 class="brand-text text-primary ml-1">
PING.PUB
</h2>
</b-link>
<div class="misc-inner p-2 p-sm-3">
<div class="w-100 text-center">
<h2 class="mb-1">
Sorry, The chain is not found
</h2>
<p class="mb-2">
Be free to contact us if you want to add your chain.
</p>
<b-button
variant="primary"
class="mb-2 btn-sm-block"
:to="{path:'/'}"
>
Back to home
</b-button>
<!-- image -->
<b-img
fluid
:src="imgUrl"
alt="Error page"
/>
</div>
</div>
</div>
<!-- / Error page-->
</template>
<script>
/* eslint-disable global-require */
import { BLink, BButton, BImg } from 'bootstrap-vue'
import VuexyLogo from '@core/layouts/components/Logo.vue'
import store from '@/store/index'
export default {
components: {
VuexyLogo,
BLink,
BButton,
BImg,
},
data() {
return {
downImg: require('@/assets/images/pages/error.svg'),
}
},
computed: {
imgUrl() {
if (store.state.appConfig.layout.skin === 'dark') {
// eslint-disable-next-line vue/no-side-effects-in-computed-properties
this.downImg = require('@/assets/images/pages/error-dark.svg')
return this.downImg
}
return this.downImg
},
},
}
</script>
<style lang="scss">
@import '@core/scss/vue/pages/page-misc.scss';
</style>

View File

@ -4,7 +4,7 @@
<b-link class="brand-logo"> <b-link class="brand-logo">
<vuexy-logo /> <vuexy-logo />
<h2 class="brand-text text-primary ml-1"> <h2 class="brand-text text-primary ml-1">
Vuexy PING.PUB
</h2> </h2>
</b-link> </b-link>

View File

@ -9,7 +9,7 @@ export const $themeBreakpoints = {}
// APP CONFIG // APP CONFIG
export const $themeConfig = { export const $themeConfig = {
app: { app: {
appName: 'Ping.pub', // Will update name in navigation menu (Branding) appName: 'PING.PUB', // Will update name in navigation menu (Branding)
// eslint-disable-next-line global-require // eslint-disable-next-line global-require
appLogoImage: require('@/assets/images/logo/logo.svg'), // Will update logo in navigation menu (Branding) appLogoImage: require('@/assets/images/logo/logo.svg'), // Will update logo in navigation menu (Branding)
}, },