Skip to content

Y
ycc-website
Commit a6b78507 authored by wenglk's avatar wenglk
Browse files
Options

update

parent 9d30fb01
Hide whitespace changes
Inline Side-by-side
Showing with 433 additions and 429 deletions
package.json
View file @ a6b78507
......@@ -9,6 +9,7 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"@33cn/chain33-rpc-api": "^1.5.29",
"@33cn/chain33-transaction-parser": "^1.1.4",
"@tailwindcss/line-clamp": "^0.2.0",
"@tailwindcss/postcss7-compat": "^2.0.4",
......
src/assets/lang/en.ts
View file @ a6b78507
......@@ -47,6 +47,7 @@ export const lang = {
accountBalance: "Account Balance",
votingRecord: "Voting",
packingRecord: "Packing",
nodeAdr: "Node"
},
block: {
title: "All Blocks",
......@@ -54,6 +55,8 @@ export const lang = {
height: "Height",
time: "Block Age",
hash: "Block Hash",
tx: "Txn",
txs: 'Txns',
txCount: "Txns",
txCount_single: "Txn",
blockRevenue: "Block Revenue",
......@@ -111,8 +114,10 @@ export const lang = {
time: "Time",
token: "Token",
type: "Type",
pkgRewards: 'Rewards',
txAmount: "Txn Value",
txRecord: "Transaction",
consensusRecord: 'Consensus',
consensusNode: "Consensus Node",
txTotal: "A total of {0} txns were found",
consensusNodeTotal: "A total of {0} consensus nodes were found",
......
src/assets/lang/zh.ts
View file @ a6b78507
......@@ -47,6 +47,7 @@ export const lang = {
accountBalance: "账户余额",
votingRecord: "投票记录",
packingRecord: "打包记录",
nodeAdr: "节点地址"
},
block: {
title: "全部区块",
......@@ -54,6 +55,8 @@ export const lang = {
height: "高度",
time: "块龄",
hash: "区块哈希",
tx: "笔交易",
txs: '笔交易',
txCount: "交易数量",
txCount_single: "交易数量",
blockRevenue: "区块收益",
......@@ -111,8 +114,10 @@ export const lang = {
time: "时间",
token: "代币",
type: "类型",
pkgRewards: '打包奖励',
txAmount: "交易金额",
txRecord: "交易记录",
consensusRecord: '共识记录',
consensusNode: "共识节点",
txTotal: "共找到{0}笔交易",
consensusNodeTotal: "共找到{0}个共识节点",
......
src/components/charts.vue
View file @ a6b78507
......@@ -3,18 +3,18 @@
</template>
<script lang="ts">
import Vue from 'vue'
import * as echarts from 'echarts/core'
import { LineChart, LineSeriesOption } from 'echarts/charts'
import { TooltipComponent, GridComponent } from 'echarts/components'
import { CanvasRenderer } from 'echarts/renderers'
import { numOfOnChainTx } from '@/service/api'
import moment from 'moment'
import { nFormatter } from '@/utils/common'
import Vue from "vue";
import * as echarts from "echarts/core";
import { LineChart, LineSeriesOption } from "echarts/charts";
import { TooltipComponent, GridComponent } from "echarts/components";
import { CanvasRenderer } from "echarts/renderers";
import { numOfOnChainTx } from "@/service/api";
import moment from "moment";
import { nFormatter } from "@/utils/common";
type ECOption = echarts.ComposeOption<LineSeriesOption>
type ECOption = echarts.ComposeOption<LineSeriesOption>;
echarts.use([TooltipComponent, GridComponent, LineChart, CanvasRenderer])
echarts.use([TooltipComponent, GridComponent, LineChart, CanvasRenderer]);
export default Vue.extend({
props: {
......@@ -25,103 +25,103 @@ export default Vue.extend({
return {
xData: [],
seriesData: [],
}
};
},
methods: {
generateD1() {
const list = []
for (let i = 0; i < 7; ++i) {
const m = moment().startOf('days').add(-i, 'days')
list.push(m)
const list = [];
for (let i = 1; i < 8; ++i) {
const m = moment().startOf("days").add(-i, "days");
list.push(m);
}
return list.map((i) => {
return {
start: i.unix(),
format: i.format('YYYY.MM.DD'),
end: i.endOf('days').unix(),
}
})
format: i.format("YYYY.MM.DD"),
end: i.endOf("days").unix(),
};
});
},
generateW1() {
const list = []
for (let i = 0; i < 7; ++i) {
const list = [];
for (let i = 1; i < 8; ++i) {
const m = moment()
.hour(0)
.minute(0)
.second(0)
.add(-i * 7, 'days')
list.push(m)
.add(-i * 7, "days");
list.push(m);
}
return list.map((i) => {
return {
start: moment(i).add(-1, 'weeks').unix(),
start: moment(i).add(-1, "weeks").unix(),
end: moment(i).unix(),
format: `${moment(i).add(-1, 'weeks').format('MMMDD')} - ${moment(
i,
).format('MMMDD')}`,
}
})
format: `${moment(i).add(-1, "weeks").format("MMMDD")} - ${moment(
i
).format("MMMDD")}`,
};
});
},
generateM1() {
const list = []
for (let i = 0; i < 7; ++i) {
const m = moment().startOf('month').add(-i, 'month')
list.push(m)
const list = [];
for (let i = 1; i < 8; ++i) {
const m = moment().startOf("month").add(-i, "month");
list.push(m);
}
return list.map((i) => {
return {
start: moment(i).unix(),
end: moment(i).endOf('month').unix(),
format: `${moment(i).format('MMM')}`,
}
})
end: moment(i).endOf("month").unix(),
format: `${moment(i).format("MMM")}`,
};
});
},
generateY1() {
const list = []
const list = [];
for (let i = 0; i < 7; ++i) {
const m = moment().hour(0).minute(0).second(0).add(-i, 'year')
list.push(m)
const m = moment().hour(0).minute(0).second(0).add(-i, "year");
list.push(m);
}
return list.map((i) => {
return {
start: i.startOf('year').unix(),
end: i.endOf('year').unix(),
format: `${i.format('YYYY')}`,
}
})
start: i.startOf("year").unix(),
end: i.endOf("year").unix(),
format: `${i.format("YYYY")}`,
};
});
},
generate() {
switch (this.scale) {
case 'D1':
return this.generateD1()
case 'W1':
return this.generateW1()
case 'M1':
return this.generateM1()
case 'Y1':
return this.generateY1()
case "D1":
return this.generateD1();
case "W1":
return this.generateW1();
case "M1":
return this.generateM1();
case "Y1":
return this.generateY1();
}
},
draw() {
// 接下来的使用就跟之前一样，初始化图表，设置配置项
// filters: ['D1', 'W1', 'M1', 'Y1'],
const times = this.generate()
const times = this.generate();
times &&
numOfOnChainTx(times).then((ret) => {
if (ret.error == null) {
this.xData = ret.result
var myChart = echarts.init(this.$refs.charts as HTMLElement)
this.xData = ret.result;
var myChart = echarts.init(this.$refs.charts as HTMLElement);
myChart.setOption({
tooltip: {
trigger: 'axis',
trigger: "axis",
},
xAxis: {
type: 'category',
type: "category",
axisLabel: {
textStyle: {
color: '#7c88ad',
color: "#7c88ad",
},
},
axisTick: {
......@@ -129,47 +129,47 @@ export default Vue.extend({
},
data: times
?.map((i) => {
return i.format
return i.format;
})
.reverse(),
},
yAxis: {
type: 'value',
type: "value",
axisLabel: {
formatter: (item: number) => {
return nFormatter(item)
return nFormatter(item);
},
textStyle: {
color: '#7c88ad',
color: "#7c88ad",
},
},
},
series: [
{
type: 'line',
type: "line",
data: this.xData.map((i: any) => i || 0).reverse(),
areaStyle: {
color: 'red',
color: "red",
normal: {
// 颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: '#2545CB', // 0% 处的颜色
color: "#2545CB", // 0% 处的颜色
},
{
offset: 0.6,
color: '#9FAEE9', // 40% 处的颜色
color: "#9FAEE9", // 40% 处的颜色
},
{
offset: 1,
color: 'white', // 100% 处的颜色
color: "white", // 100% 处的颜色
},
]), //背景渐变色
lineStyle: {
// 系列级个性化折线样式
type: 'solid',
color: '#2545CB', //折线的颜色
type: "solid",
color: "#2545CB", //折线的颜色
},
},
},
......@@ -179,23 +179,23 @@ export default Vue.extend({
},
],
grid: { ...this.grid },
} as ECOption)
} as ECOption);
}
})
});
},
},
mounted() {
this.draw()
this.draw();
},
watch: {
scale(v) {
this.draw()
this.draw();
},
'$route.query.lang'() {
this.draw()
"$route.query.lang"() {
this.draw();
},
},
})
});
</script>
<style lang="scss" scoped>
.charts {
......
src/components/mobile/m-blockItem.vue
View file @ a6b78507
<template>
<div class="blockItem bg-white flex pr-3.5">
<div class="txNumBox text-center flex-shrink-0">
<div
class="text-footer-color text-base font-bold"
style="margin-top: 7px;"
<div class="txNumBox">
<router-link
:to="{
path: '/blockDetail',
query: {
height: height,
},
}"
>
{{ txCount }}
</div>
<div class="text-xs font-bold text-footer-color-light">
{{ txCount === 1 ? $t('lang.block.txCount_single') : $t('lang.block.txCount') }}
</div>
{{ height }}
</router-link>
</div>
<div class="msgBox flex-shrink-0 flex-grow mt-3.5 ml-2">
<div class="flex justify-between items-center w-full">
<div class="text-darkBlue font-bold text-sm">
<router-link
:to="{
path: '/blockDetail',
query: {
height: height,
},
}"
>
{{ height }}
</router-link>
</div>
<div class="text-text-color text-xs">
{{ blockTime | formatTime }}
</div>
</div>
<div>
<span class="text-text-color text-xs">
{{ $t('lang.block.packingAddress') }}:
{{ $t("lang.block.hash") }}：
</span>
<router-link
:to="{
path: '/blockDetail',
query: {
height: height,
},
}"
>
<span class="text-footer-color">
{{ hash | filterHash(9) }}
</span>
</router-link>
</div>
<div>
<span class="text-text-color text-xs" style="margin-right: 9px">
{{ $t("lang.block.packingAddress") }}:
</span>
<span class="text-footer-color">
<router-link
......@@ -42,42 +43,48 @@
},
}"
>
{{ packagingAddress | filterHash(12) }}
{{ packagingAddress | filterHash(9) }}
</router-link>
</span>
</div>
<div>
<span class="text-text-color text-xs">
{{ $t('lang.block.blockReward') }}
</span>
<span class="text-black text-xs">
{{ height | filterBlockReward }}
</span>
<div class="flex justify-between items-center w-full">
<div class="text-text-color text-xs">
{{ txCount }}
{{ txCount === 1 ? $t("lang.block.tx") : $t("lang.block.txs") }}
</div>
<div class="text-text-color text-xs">
{{ blockTime | formatTime }}
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import Vue from 'vue'
import Vue from "vue";
export default Vue.extend({
props: {
txCount: Number,
height: Number,
blockTime: Number,
packagingAddress: String,
hash: String,
},
})
});
</script>
<style lang="scss" scoped>
.blockItem {
height: 90px;
.txNumBox {
margin-top: 18px;
width: 62px;
height: 54px;
background: rgba(37, 69, 203, 0.1);
border-radius: 2px;
margin-left: 15px;
display: flex;
justify-content: center;
align-items: center;
padding: 15px;
margin: 15px 0 0 15px;
width: fit-content;
height: 55px;
background: #e8ecfc;
border-radius: 4px;
color: #2545cb;
}
border-bottom: 1px solid #f5f5ff;
}
......
src/components/mobile/m-chain-perf.vue
View file @ a6b78507
......@@ -5,9 +5,9 @@
v-for="(item, i) in list"
:key="i"
class="h-1/4 pt-2.5"
style="margin-left: 10px;"
style="margin-left: 10px"
>
<div class="text-text-color text-xs" style="margin-bottom: 2px;">
<div class="text-text-color text-xs" style="margin-bottom: 2px">
{{ item.name }}
</div>
<div class="text-title-color text-sm font-bold">
......@@ -18,8 +18,8 @@
</div>
</template>
<script lang="ts">
import { filterNum } from '@/utils/utils'
import Vue from 'vue'
import { filterNum } from "@/utils/utils";
import Vue from "vue";
export default Vue.extend({
props: {
speed: Number,
......@@ -31,25 +31,25 @@ export default Vue.extend({
list(): { name: string; value: string | number }[] {
return [
{
name: this.$t('lang.chainPerf.speed') as string,
value: this.speed + 's',
name: this.$t("lang.chainPerf.speed") as string,
value: this.speed + "s",
},
{
name: this.$t('lang.chainPerf.tps') as string,
value: this.tps,
name: this.$t("lang.chainPerf.tps") as string,
value: 1000,
},
{
name: this.$t('lang.chainPerf.txNumber') as string,
name: this.$t("lang.chainPerf.txNumber") as string,
value: filterNum(this.txNumber),
},
{
name: this.$t('lang.chainPerf.addressNumber') as string,
name: this.$t("lang.chainPerf.addressNumber") as string,
value: filterNum(this.addressNumber),
},
]
];
},
},
})
});
</script>
<style lang="scss" scoped>
.c-perf {
......
src/components/mobile/m-latestBlocks.vue
View file @ a6b78507
......@@ -2,10 +2,10 @@
<div class="c-latestBlocks">
<div class="top flex items-center justify-between px-3.5">
<div class="text-darkBlue text-sm font-bold">
{{ $t('lang.chainMsg.latestBlock') }}
{{ $t("lang.chainMsg.latestBlock") }}
</div>
<div class="text-footer-color text-xs" @click="$router.push('/block')">
{{ $t('lang.viewMore') }}
{{ $t("lang.viewMore") }}
</div>
</div>
<m-block-item
......@@ -14,22 +14,23 @@
:key="i"
:blockTime="item.blockTime"
:height="item.height"
:hash="item.hash"
:packagingAddress="item.minerHash"
:txCount="item.txs && item.txs.length"
></m-block-item>
</div>
</template>
<script lang="ts">
import Vue, { PropType } from 'vue'
import mBlockItem from './m-blockItem.vue'
import { iBlockMsg } from 'ycc-api/dist/cmjs/service/home/types'
import Vue, { PropType } from "vue";
import mBlockItem from "./m-blockItem.vue";
import { iBlockMsg } from "ycc-api/dist/cmjs/service/home/types";
export default Vue.extend({
components: { mBlockItem },
props: {
latestBlocks: Array as PropType<iBlockMsg[]>,
},
})
});
</script>
<style lang="scss" scoped>
.c-latestBlocks {
......
src/components/mobile/m-txItem.vue
View file @ a6b78507
......@@ -10,10 +10,15 @@
v-if="txGroup && txGroup === 'isGroupItem'"
class="w-5 h-5 txGroupIcon"
/>
<div class="flex justify-between items-center" style="margin-top: 14px;">
<div class="flex justify-between items-center" style="margin-top: 14px">
<div class="flex items-center">
<div class="text-text-color text-xs" style="margin-right: 3px;">
{{ $t('lang.trade.txAmount') }} :
<div class="text-text-color text-xs" style="margin-right: 3px">
{{
row.action_name == "miner"
? $t("lang.trade.pkgRewards")
: $t("lang.trade.txAmount")
}}
:
</div>
<div class="text-darkBlue text-sm font-bold">
{{ row | TradeValue }}
......@@ -25,11 +30,11 @@
</div>
<div
class="flex items-center justify-between"
style="margin-top: 3px; margin-bottom: 3px;"
style="margin-top: 3px; margin-bottom: 3px"
>
<div class="flex items-center">
<div class="text-text-color text-xs" style="margin-right: 3px;">
{{ $t('lang.txDetail.txHash') }} :
<div class="text-text-color text-xs" style="margin-right: 3px">
{{ $t("lang.txDetail.txHash") }} :
</div>
<div
class="text-xs"
......@@ -52,7 +57,7 @@
<div class="flex items-center justify-between">
<div>
<span class="text-text-color text-xs">
{{ $t('lang.trade.sender') }} :
{{ $t("lang.trade.sender") }} :
</span>
<span
class="text-xs"
......@@ -72,7 +77,7 @@
</div>
<div>
<span class="text-text-color text-xs">
{{ $t('lang.trade.receiver') }} :
{{ $t("lang.trade.receiver") }} :
</span>
<span
class="text-xs"
......@@ -94,9 +99,9 @@
</div>
</template>
<script lang="ts">
import Vue from 'vue'
import TxStatus from '../pc/txStatus.vue'
import txGroupIcon from '@/assets/images/blockChainBrowser/tradeDetail/txGroupIcon.png'
import Vue from "vue";
import TxStatus from "../pc/txStatus.vue";
import txGroupIcon from "@/assets/images/blockChainBrowser/tradeDetail/txGroupIcon.png";
export default Vue.extend({
components: {
TxStatus,
......@@ -118,20 +123,20 @@ export default Vue.extend({
data() {
return {
txGroupIcon,
}
};
},
computed: {
txGroup() {
if (this.tradeG === 1 || this.tradeG === 2) {
return 'isGroupItem'
return "isGroupItem";
} else if (this.tradeG === 3) {
return 'isGroupItemEnd'
return "isGroupItemEnd";
} else {
return ''
return "";
}
},
},
})
});
</script>
<style lang="scss" scoped>
.txItem {
......
src/components/pc/BlockChainBrowser/AddressOverview/Balance.vue
View file @ a6b78507
......@@ -6,18 +6,18 @@
alt=""
/>
<div class="balance-label">
{{ $t('lang.address.balance') }}
{{ $t("lang.address.balance") }}
</div>
<div class="balance-value">{{ filterNum(balance / 1e8) }} YCC</div>
<div class="text-sm text-white" style="margin-top: 10px;">
{{ $t('lang.address.freeze') }}
<div class="text-sm text-white" style="margin-top: 10px">
{{ $t("lang.address.freeze") }}
<span class="ml-2">
{{ filterNum(frozen / 1e8) }}
YCC
</span>
</div>
<Select
style="margin-top: 73px;"
style="margin-top: 73px"
:selectedValue="selectedValue"
:optionsList="optionsList"
:searchPlaceholder="$t('lang.searchCurrency')"
......@@ -27,9 +27,9 @@
</template>
<script lang="ts">
import { filterNum } from '@/utils/utils'
import VueTypedMixins from 'vue-typed-mixins'
import Select from '../../CurrencySelect.vue'
import { filterNum } from "@/utils/utils";
import VueTypedMixins from "vue-typed-mixins";
import Select from "../../CurrencySelect.vue";
export default VueTypedMixins().extend({
components: { Select },
props: {
......@@ -42,7 +42,7 @@ export default VueTypedMixins().extend({
methods: {
filterNum,
},
})
});
</script>
<style scoped lang="scss">
......@@ -51,11 +51,11 @@ export default VueTypedMixins().extend({
height: 360px;
background-color: #2545cb;
border-radius: 20px;
background-image: url('../../../../assets/images/blockChainBrowser/address/balanceBg.png');
background-image: url("../../../../assets/images/blockChainBrowser/address/balanceBg.png");
background-position: right bottom;
background-size: 281px 302px;
background-repeat: no-repeat;
padding-top: 60px;
padding-top: 30px;
padding-left: 28px;
.yccIcon {
......@@ -70,7 +70,7 @@ export default VueTypedMixins().extend({
margin-top: 20px;
}
.balance-value {
font-size: 32px;
font-size: 28px;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #ffffff;
......
src/components/pc/BlockChainBrowser/ChainOverview/ChainCardShowPerf.vue
View file @ a6b78507
......@@ -3,7 +3,12 @@
<div class="w-1/4 mt-10" v-for="(item, index) in list" :key="index">
<div class="text-text-color">{{ item.name }}</div>
<div
class="mt-4 text-title-color text-xl font-bold overflow-hidden overflow-ellipsis"
class="
mt-4
text-title-color text-xl
font-bold
overflow-hidden overflow-ellipsis
"
>
{{ item.value }}
</div>
......@@ -12,8 +17,8 @@
</template>
<script lang="ts">
import { filterNum } from '@/utils/utils'
import Vue from 'vue'
import { filterNum } from "@/utils/utils";
import Vue from "vue";
export default Vue.extend({
props: {
speed: Number,
......@@ -25,25 +30,25 @@ export default Vue.extend({
list(): { name: string; value: string | number }[] {
return [
{
name: this.$t('lang.chainPerf.speed') as string,
value: this.speed + 's',
name: this.$t("lang.chainPerf.speed") as string,
value: this.speed + "s",
},
{
name: this.$t('lang.chainPerf.tps') as string,
value: this.tps,
name: this.$t("lang.chainPerf.tps") as string,
value: 1000,
},
{
name: this.$t('lang.chainPerf.txNumber') as string,
name: this.$t("lang.chainPerf.txNumber") as string,
value: filterNum(this.txNumber),
},
{
name: this.$t('lang.chainPerf.addressNumber') as string,
name: this.$t("lang.chainPerf.addressNumber") as string,
value: filterNum(this.addressNumber),
},
]
];
},
},
})
});
</script>
<style scoped>
......
src/components/pc/BlockChainBrowser/LatestBlock/index.vue
View file @ a6b78507
......@@ -7,20 +7,33 @@
:key="i"
>
<div
class="txNumberBox text-footer-color text-sm font-bold text-center flex-shrink-0 items-center flex"
class="
txNumberBox
text-footer-color text-sm
font-bold
text-center
flex-shrink-0
items-center
flex
"
>
<div class="flex-grow overflow-hidden overflow-ellipsis">
{{ (item && item.txs && item.txs.length) || '' }}
{{
item && item.txs && item.txs.length === 1
? $t('lang.block.txCount_single')
: $t('lang.block.txCount')
}}
<router-link
:to="{
path: '/blockDetail',
query: {
height: item.height,
},
}"
>
{{ item.height }}
</router-link>
</div>
</div>
<div class="w-full ml-5">
<div class="flex justify-between">
<div class="height">
<div>
<span class="graytxt"> {{ $t("lang.block.hash") }}： </span>
<router-link
:to="{
path: '/blockDetail',
......@@ -29,20 +42,28 @@
},
}"
>
{{ item.height }}
<span class="text-footer-color">
{{ item.hash | filterHash(9) }}
</span>
</router-link>
</div>
<div>
<span class="graytxt">{{ $t('lang.block.blockReward') }}:</span>
<!-- <span class="graytxt">{{ $t("lang.block.blockReward") }}:</span> -->
<span>
{{ item.height | filterBlockReward }}
{{ (item && item.txs && item.txs.length) || "" }}
{{
item && item.txs && item.txs.length === 1
? $t("lang.block.tx")
: $t("lang.block.txs")
}}
<!-- {{ item.height | filterBlockReward }} -->
</span>
</div>
</div>
<div class="flex justify-between items-center">
<div>
<span class="graytxt">
{{ $t('lang.block.packingAddress') }}：
{{ $t("lang.block.packingAddress") }}：
</span>
<router-link
:to="{
......@@ -57,7 +78,7 @@
</span>
</router-link>
</div>
<div class="text-text-color" style="font-size: 12px;">
<div class="text-text-color" style="font-size: 12px">
{{ item.blockTime | formatTime }}
</div>
</div>
......@@ -68,16 +89,16 @@
</template>
<script lang="ts">
import Vue, { PropType } from 'vue'
import LatestContainer from '@/components/pc/BlockChainBrowser/LatestContainer.vue'
import { iBlockMsg } from 'ycc-api/dist/cmjs/service/home/types'
import Vue, { PropType } from "vue";
import LatestContainer from "@/components/pc/BlockChainBrowser/LatestContainer.vue";
import { iBlockMsg } from "ycc-api/dist/cmjs/service/home/types";
export default Vue.extend({
components: { LatestContainer },
props: {
latestBlocks: Array as PropType<iBlockMsg[]>,
},
})
});
</script>
<style scoped>
......
src/components/pc/BlockChainBrowser/LatestTx/index.vue
View file @ a6b78507
......@@ -6,9 +6,9 @@
v-for="(item, i) in latestTxs"
:key="i"
>
<div class="left" style="line-height: 20px;">
<div class="left" style="line-height: 20px">
<div>
<span class="graytxt">{{ $t('lang.trade.hash') }}：</span>
<span class="graytxt">{{ $t("lang.trade.hash") }}：</span>
<span class="text-footer-color">
<router-link
:to="{
......@@ -22,13 +22,13 @@
</router-link>
</span>
</div>
<div class="graytxt" style="font-size: 12px; margin-top: 6px;">
<div class="graytxt" style="font-size: 12px; margin-top: 6px">
{{ item.time_block | formatTime }}
</div>
</div>
<div class="middle" style="line-height: 20px;">
<div class="middle" style="line-height: 20px">
<div>
<span class="graytxt">{{ $t('lang.trade.sender') }}：</span>
<span class="graytxt">{{ $t("lang.trade.sender") }}：</span>
<span class="text-footer-color">
<router-link
:to="{
......@@ -42,8 +42,8 @@
</router-link>
</span>
</div>
<div class="graytxt" style="margin-top: 6px;">
<span class="graytxt">{{ $t('lang.trade.receiver') }}：</span>
<div class="graytxt" style="margin-top: 6px">
<span class="graytxt">{{ $t("lang.trade.receiver") }}：</span>
<span class="text-footer-color">
<router-link
:to="{
......@@ -58,9 +58,15 @@
</span>
</div>
</div>
<div class="right text-right" style="line-height: 20px;">
<div class="graytxt">{{ $t('lang.trade.txAmount') }}</div>
<div class="text-darkBlue" style="margin-top: 6px;">
<div class="right text-right" style="line-height: 20px">
<div class="graytxt">
{{
item.action_name == "miner"
? $t("lang.trade.pkgRewards")
: $t("lang.trade.txAmount")
}}
</div>
<div class="text-darkBlue" style="margin-top: 6px">
{{ item | filterTradeValue }}
</div>
</div>
......@@ -70,27 +76,27 @@
</template>
<script lang="ts">
import Vue, { PropType } from 'vue'
import LatestContainer from '@/components/pc/BlockChainBrowser/LatestContainer.vue'
import { iAsset } from '@/types/trade'
import Vue, { PropType } from "vue";
import LatestContainer from "@/components/pc/BlockChainBrowser/LatestContainer.vue";
import { iAsset } from "@/types/trade";
export default Vue.extend({
components: { LatestContainer },
props: {
latestTxs: Array as PropType<
{
hash: string
time_block: number
from: string
to: string
amount: number
assets: iAsset[]
hash: string;
time_block: number;
from: string;
to: string;
amount: number;
assets: iAsset[];
tx: {
execer?: string
}
execer?: string;
};
}[]
>,
},
})
});
</script>
<style scoped>
......
src/mixin/address.ts
View file @ a6b78507
import {
getAddressTxCountOrigin,
getAddrTxList_another,
getMakerAddr,
getMakerAddrCount,
getVoterAddr,
getVoterAddrCount,
yccApi,
......@@ -51,7 +49,6 @@ export default Vue.extend({
"$route.query.address"() {
this.getAllExecBalance();
this.getTxList();
this.getMaker();
this.getVoter();
},
selectedTxRecordFilterValue(newValue) {
......@@ -62,7 +59,6 @@ export default Vue.extend({
mounted() {
this.getAllExecBalance();
this.getTxList();
this.getMaker();
this.getVoter();
},
computed: {
......@@ -97,13 +93,9 @@ export default Vue.extend({
value: "txRecord",
},
{
name: this.$t("lang.address.votingRecord"),
value: "votingRecord",
},
{
name: this.$t("lang.address.packingRecord"),
value: "packingRecord",
},
name: this.$t("lang.trade.consensusRecord"),
value: "consensus",
}
];
},
optionList() {
......@@ -152,6 +144,12 @@ export default Vue.extend({
},
],
match: [],
"not": [
{
"key": "action_name",
"value": "miner"
}
]
},
];
case "filterSucceedTx":
......@@ -183,6 +181,12 @@ export default Vue.extend({
},
},
],
"not": [
{
"key": "action_name",
"value": "miner"
}
]
},
];
case "filterFailedTx":
......@@ -208,6 +212,12 @@ export default Vue.extend({
value: false,
},
],
"not": [
{
"key": "action_name",
"value": "miner"
}
]
},
];
case "filterSentTx":
......@@ -220,6 +230,12 @@ export default Vue.extend({
},
],
match: [],
"not": [
{
"key": "action_name",
"value": "miner"
}
]
},
];
case "filterReceivedTx":
......@@ -232,6 +248,12 @@ export default Vue.extend({
},
],
match: [],
"not": [
{
"key": "action_name",
"value": "miner"
}
]
},
];
default:
......@@ -292,36 +314,14 @@ export default Vue.extend({
setValue(v: string) {
this.value = v;
},
sizeChange3(size: number) {
this.pages3.pageSize = size;
this.pageChange3(1);
},
pageChange3(page: number) {
this.pages3.currentPage = page;
getMakerAddr(
this.$route.query.address as string,
this.pages3.currentPage,
this.pages3.pageSize
).then((res) => {
if (res.error === null) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
this.packList = res.result.map((i: any) => ({
...i,
sender: i.from,
receiver: i.to,
time: i.block_time,
}));
const txHashes = res.result.map((i: any) => i.hash);
this.setMakerReward(txHashes);
}
});
},
sizeChange2(size: number) {
this.pages2.pageSize = size;
this.pageChange2(1);
},
pageChange2(page: number) {
this.pages2.currentPage = page;
console.log('page2');
getVoterAddr(
this.$route.query.address as string,
this.pages2.currentPage,
......@@ -335,6 +335,8 @@ export default Vue.extend({
receiver: i.to,
time: i.block_time,
}));
const txHashes = res.result.map((i: any) => i.hash);
// this.setVoteReward(txHashes);
}
});
},
......@@ -401,60 +403,6 @@ export default Vue.extend({
this.voteList = [...this.voteList];
});
},
setMakerReward(txHashes: string[]) {
getTxByHashes("ycc", yccApi, txHashes).then((txRes) => {
const list = txRes
.map((i: any, index: number) => {
return {
txHash: txHashes[index],
receipt: i.receipt,
};
})
.map((i: any) => {
const res = getConsensusList([i]);
return {
txHash: i.txHash,
reward: res
.filter((m) => m.type === "pack")
.reduce((p, c) => {
return p + c.reward;
}, 0),
};
});
list.forEach((item: { txHash: string; reward: number }) => {
const the = this.packList.find((i) => i.hash === item.txHash);
if (the) {
the.reward = item.reward;
}
});
this.packList = [...this.packList];
});
},
getMaker() {
getMakerAddrCount(this.$route.query.address as string).then((res) => {
if (res.error === null) {
this.pages3.total = res.result;
getMakerAddr(
this.$route.query.address as string,
this.pages3.currentPage,
this.pages3.pageSize
).then((res) => {
if (res.error === null) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const txHashes = res.result.map((i: any) => i.hash);
this.packList = res.result.map((i: any) => ({
...i,
sender: i.from,
receiver: i.to,
time: i.block_time,
}));
this.setMakerReward(txHashes);
}
});
}
});
},
getVoter() {
getVoterAddrCount(this.$route.query.address as string).then((res) => {
if (res.error === null) {
......
src/mixin/blockChainBrowser.ts
View file @ a6b78507
......@@ -2,6 +2,7 @@ import Vue from "vue";
import { getLatestBlock } from "ycc-api/dist/cmjs/service/home/index";
import { iBlockMsg } from "ycc-api/dist/cmjs/service/home/types";
import { getRpc } from "ycc-api/src/service/Rpc";
import RPC from '../service/chain33rpc'
import Base64 from "@/utils/_base64";
import moment from "moment";
......@@ -30,7 +31,7 @@ export default Vue.extend({
latestHeight: NaN,
totalTx: NaN,
value: "",
latestBlocks: [] as iBlockMsg[],
latestBlocks: new Array(6).fill({}),
quoteChange: "",
price: "",
marketValue: 0,
......@@ -140,18 +141,16 @@ export default Vue.extend({
clickSearch(value: string) {
console.log(value, "show value");
},
getLatestBlockData() {
this.latestBlocks =
(this.latestBlocks.length && this.latestBlocks) ||
((" "
.repeat(5)
.split(" ")
.map(() => ({})) as unknown) as iBlockMsg[]);
return getLatestBlock("ycc", yccApi).then((ret) => {
this.latestBlocks = ret || [];
return ret;
});
async getLatestBlockData() {
let blocks = [] as any
const res = await getLatestBlock("ycc", yccApi)
const newHeight = (res as any)[0].height
const { result } = await RPC.getHeaders(newHeight - 5, newHeight, false)
const hashes = result.items.reverse()
blocks = res?.map((item, index) => {
return { ...item, ...hashes[index] }
})
this.latestBlocks = blocks
},
hexCharCodeToStr(hexCharCodeStr: string) {
const num = hexCharCodeStr;
......@@ -194,7 +193,7 @@ export default Vue.extend({
this.quoteChange = data.range;
this.marketValue = Math.floor(
Number(data.last) *
(100 * 1e8 + 30 * 725000 + 15 * (this.latestHeight - 725000))
(100 * 1e8 + 30 * 725000 + 15 * (this.latestHeight - 725000))
);
}
});
......
src/service/api.ts
View file @ a6b78507
......@@ -201,6 +201,8 @@ export function getAddressTxCount(addr: string, matches = [] as any[]) {
}
export function getAddressTxCountOrigin(params: any) {
console.log(params, 123);
return axios(expandApi, {
method: "post",
params: {
......@@ -279,6 +281,12 @@ export function getAddrTxList_another(
params: [
{
...objContainMatchOneAndMatch,
"not": [
{
"key": "action_name",
"value": "miner"
}
],
sort: [{ key: "height", ascending: false }],
page: { number, size },
},
......@@ -319,6 +327,10 @@ export function getVoterAddrCount(addr: string) {
key: "voter_addr",
value: addr,
},
{
"key": "action_name",
"value": "miner"
}
],
},
],
......@@ -375,6 +387,10 @@ export function getVoterAddr(addr: string, number: number, size: number) {
key: "voter_addr",
value: addr,
},
{
"key": "action_name",
"value": "miner"
}
],
page: {
number,
......
src/service/chain33rpc.ts 0 → 100644
View file @ a6b78507
import Chain33Rpc from '@33cn/chain33-rpc-api'
export default new Chain33Rpc('/yccApi', null, (e: Error) => {
throw e
})
\ No newline at end of file
src/utils/consensus.ts
View file @ a6b78507
......@@ -66,6 +66,7 @@ export const getConsensusList = (txs: any[]): iRetTypeOfGetConItem[] => {
txs.forEach((tx) => {
tx && tx.receipt && tx.receipt.logs && logsList.push(...tx.receipt.logs);
});
console.log(logsList);
return logsList
.filter((i) => i.ty === 8)
......
src/views/mobile/address/components/m-address-overview/m-address-blue-card.vue
View file @ a6b78507
......@@ -23,23 +23,23 @@
></Select>
</div>
<div class="text-white mt-3.5 text-xs">
{{ $t('lang.address.balance') }}
{{ $t("lang.address.balance") }}
</div>
<div class="text-white mt-1 text-3xl font-bold">
<div class="text-white mt-1 text-xl font-bold">
{{ filterNum(balance / 1e8) }}YCC
</div>
<div class="text-white text-xs" style="margin-top: 5px;">
{{ $t('lang.address.freeze') }}
<div class="text-white text-xs" style="margin-top: 5px">
{{ $t("lang.address.freeze") }}
{{ filterNum(forzen / 1e8) }} YCC
</div>
</div>
</template>
<script lang="ts">
import Select from '@/components/pc/CurrencySelect.vue'
import balanceBg from '@/assets/images/blockChainBrowser/address/balanceBg-mobile.png'
import Vue from 'vue'
import { filterNum } from '@/utils/utils'
import Select from "@/components/pc/CurrencySelect.vue";
import balanceBg from "@/assets/images/blockChainBrowser/address/balanceBg-mobile.png";
import Vue from "vue";
import { filterNum } from "@/utils/utils";
export default Vue.extend({
components: {
Select,
......@@ -57,9 +57,9 @@ export default Vue.extend({
data() {
return {
balanceBg,
}
};
},
})
});
</script>
<style lang="scss" scoped>
.c-address-blue-card {
......
src/views/pc/address/components/votePackTable.vue
View file @ a6b78507
<template>
<div class="c-votePackTable">
<el-table :data="list" v-loading="loading" stripe>
<TableColumn label width="40"></TableColumn>
<TableColumn :label="$t('lang.txDetail.height')">
<template slot-scope="{ row }">
<div class="text-footer-color">
<router-link
:to="{
path: '/blockDetail',
query: {
height: row.height,
},
}"
>
{{ row.height }}
</router-link>
<!-- <TableColumn label width="40"></TableColumn> -->
<TableColumn type="expand">
<template slot-scope="props">
<div
class="line"
v-for="item in props.row.voter_addr"
:key="item.hash"
>
<p class="adr">{{ item | filterHash(10) }}</p>
<span>投票节点</span>
<span> YCC</span>
</div>
</template>
</TableColumn>
......@@ -34,7 +31,7 @@
</div>
</template>
</TableColumn>
<TableColumn :label="$t('lang.trade.sender')">
<TableColumn :label="$t('lang.address.nodeAdr')">
<template slot-scope="{ row }">
<div class="text-footer-color">
<router-link
......@@ -45,38 +42,26 @@
},
}"
>
{{ row.sender | filterHash }}
{{ row.sender | filterHash(10) }}
</router-link>
</div>
</template>
</TableColumn>
<TableColumn label width="40">
<template slot-scope="">
<img :src="arrowRight" alt="" />
</template>
</TableColumn>
<TableColumn :label="$t('lang.trade.receiver')">
<template slot-scope="{ row }">
<div class="text-footer-color">
<router-link
:to="{
path: '/address',
query: {
address: row.receiver,
},
}"
>
{{ row.receiver | filterHash }}
</router-link>
</div>
<TableColumn :label="$t('lang.trade.type')" width="150" align="center">
<template>
<div class="text-text-color">打包节点</div>
</template>
</TableColumn>
<TableColumn :label="$t('lang.block.blockReward')">
<TableColumn
:label="$t('lang.block.blockReward')"
width="150"
align="center"
>
<template slot-scope="{ row }">
<div class="text-text-color">{{ row.reward | filterAmount }} YCC</div>
<div class="text-text-color">{{ row.amount / 1e8 }} YCC</div>
</template>
</TableColumn>
<TableColumn :label="$t('lang.trade.time')" align="right">
<TableColumn :label="$t('lang.trade.time')" align="right" width="220">
<template slot-scope="{ row }">
<div class="text-text-color">
{{ row.time | formatTime }}
......@@ -88,23 +73,31 @@
</div>
</template>
<script lang="ts">
import { Table, TableColumn } from 'element-ui'
import arrowRight from '@/assets/images/blockChainBrowser/blockDetail/arrow-right-dark.png'
import Vue from 'vue'
import { Table, TableColumn } from "element-ui";
import Vue from "vue";
export default Vue.extend({
components: {
'el-table': Table,
"el-table": Table,
TableColumn,
},
props: {
list: Array,
loading: Boolean,
},
data() {
return {
arrowRight,
}
},
})
});
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.line {
display: flex;
justify-items: center;
align-items: center;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
color: #1f3470;
line-height: 40px;
.adr {
margin-left: 355px;
width: 300px;
}
}
</style>
src/views/pc/address/index.vue
View file @ a6b78507
<template>
<div
style="padding-top: 64px; padding-bottom: 60px;"
style="padding-top: 64px; padding-bottom: 60px"
class="min-w-1200 md:w-bodySet mx-auto flow-root"
>
<chain-search
:value="value"
:setValue="setValue"
style="margin-top: 30px;"
style="margin-top: 30px"
></chain-search>
<address-overview
:balance="balance"
......@@ -16,10 +16,7 @@
:frozen="frozen"
class="mt-7"
></address-overview>
<div
style="margin-top: 30px; border-radius: 4px;"
class="shadow-shadow1 overflow-hidden"
>
<div style="margin-top: 30px; border-radius: 4px" class="shadow-shadow1">
<TabList
:setFocusedTab="(v) => (focusedTab = v)"
:tabList="tabList"
......@@ -32,7 +29,7 @@
:value="selectedTxRecordFilterValue"
>
<template #left>
{{ $t('lang.trade.txTotal', [total1]) }}
{{ $t("lang.trade.txTotal", [total1]) }}
<!-- ({{ $t('lang.trade.tip2') }}) -->
</template>
</DataFilter>
......@@ -44,20 +41,15 @@
:Trades="txRecordList"
></TradeTable2>
<vote-pack-table
v-if="focusedTab === 'votingRecord'"
v-if="focusedTab === 'consensus'"
:list="voteList"
:loading="loadingVote"
></vote-pack-table>
<vote-pack-table
v-if="focusedTab === 'packingRecord'"
:list="packList"
:loading="loadingPack"
></vote-pack-table>
</div>
<div class="flex justify-end">
<page-container
v-if="focusedTab === 'txRecord'"
style="margin-top: 30px;"
style="margin-top: 30px"
:currentPage="pages.currentPage"
:pageSize="pages.pageSize"
:total="pages.total"
......@@ -65,7 +57,7 @@
@pageChange="pageChange"
></page-container>
<page-container
v-if="focusedTab === 'votingRecord'"
v-if="focusedTab === 'consensus'"
@pageChange="pageChange2"
@sizeChange="sizeChange2"
:currentPage="pages2.currentPage"
......@@ -73,29 +65,20 @@
:total="pages2.total"
class="mt-5"
></page-container>
<page-container
v-if="focusedTab === 'packingRecord'"
@pageChange="pageChange3"
@sizeChange="sizeChange3"
:currentPage="pages3.currentPage"
:pageSize="pages3.pageSize"
:total="pages3.total"
class="mt-5"
></page-container>
</div>
</div>
</template>
<script lang="ts">
import ChainSearch from '@/components/pc/BlockChainBrowser/ChainSearch.vue'
import AddressOverview from '@/components/pc/BlockChainBrowser/AddressOverview/index.vue'
import VueTypedMixins from 'vue-typed-mixins'
import address from '@/mixin/address'
import PageContainer from '@/components/pc/BlockChainBrowser/PageContainer.vue'
import TabList from '@/components/pc/BlockChainBrowser/TabList/index.vue'
import TradeTable2 from '@/components/pc/BlockChainBrowser/TradeTable2.vue'
import DataFilter from '@/components/pc/BlockChainBrowser/DataFilter/index.vue'
import VotePackTable from './components/votePackTable.vue'
import ChainSearch from "@/components/pc/BlockChainBrowser/ChainSearch.vue";
import AddressOverview from "@/components/pc/BlockChainBrowser/AddressOverview/index.vue";
import VueTypedMixins from "vue-typed-mixins";
import address from "@/mixin/address";
import PageContainer from "@/components/pc/BlockChainBrowser/PageContainer.vue";
import TabList from "@/components/pc/BlockChainBrowser/TabList/index.vue";
import TradeTable2 from "@/components/pc/BlockChainBrowser/TradeTable2.vue";
import DataFilter from "@/components/pc/BlockChainBrowser/DataFilter/index.vue";
import VotePackTable from "./components/votePackTable.vue";
export default VueTypedMixins(address).extend({
components: {
ChainSearch,
......@@ -107,7 +90,7 @@ export default VueTypedMixins(address).extend({
PageContainer,
},
computed: {},
})
});
</script>
<style></style>
src/views/pc/blockDetail/index.vue
View file @ a6b78507
<template>
<div
class="block-detail min-w-1200 md:w-bodySet mx-auto flow-root"
style="padding-bottom: 60px;"
style="padding-bottom: 60px"
>
<chain-search
style="margin-top: 30px;"
style="margin-top: 30px"
:clickSearch="clickSearch"
:value="searchValue"
:setValue="setSearchValue"
></chain-search>
<block-overview
style="margin-top: 30px; margin-bottom: 30px;"
style="margin-top: 30px; margin-bottom: 30px"
:data="overview"
:init="init"
:loading="loadingOverview"
:loadingRelativeBlockHeight="loadingRelativeNumber"
></block-overview>
<!-- 记录表 -->
<div class="shadow-shadow1">
<TabList
:tabList="tabList"
......@@ -24,7 +25,7 @@
></TabList>
<DataFilter v-if="focusedTab === 'txRecordTab'" :hideSelect="true">
<template #left>
{{ $t('lang.trade.txTotal', [pages.total]) }}
{{ $t("lang.trade.txTotal", [pages.total]) }}
</template>
</DataFilter>
<TradeTable
......@@ -45,7 +46,7 @@
>
<template #left>
{{
$t('lang.trade.consensusNodeTotal', [consensusNodeTableList.length])
$t("lang.trade.consensusNodeTotal", [consensusNodeTableList.length])
}}
</template>
</DataFilter>
......@@ -57,7 +58,7 @@
</div>
<div
class="flex justify-end"
style="margin-top: 30px;"
style="margin-top: 30px"
v-if="focusedTab === 'txRecordTab'"
>
<page-container
......@@ -72,15 +73,15 @@
</template>
<script lang="ts">
import ChainSearch from '@/components/pc/BlockChainBrowser/ChainSearch.vue'
import BlockOverview from '@/components/pc/BlockChainBrowser/BlockOverview/index.vue'
import TabList from '@/components/pc/BlockChainBrowser/TabList/index.vue'
import DataFilter from '@/components/pc/BlockChainBrowser/DataFilter/index.vue'
import TradeTable from '@/components/pc/BlockChainBrowser/TradeTable/index.vue'
import PageContainer from '@/components/pc/BlockChainBrowser/PageContainer.vue'
import blockDetailMixin from '@/mixin/blockDetail'
import VueTypedMixins from 'vue-typed-mixins'
import ConsensusNodeTable from './components/consensusNodeTable.vue'
import ChainSearch from "@/components/pc/BlockChainBrowser/ChainSearch.vue";
import BlockOverview from "@/components/pc/BlockChainBrowser/BlockOverview/index.vue";
import TabList from "@/components/pc/BlockChainBrowser/TabList/index.vue";
import DataFilter from "@/components/pc/BlockChainBrowser/DataFilter/index.vue";
import TradeTable from "@/components/pc/BlockChainBrowser/TradeTable/index.vue";
import PageContainer from "@/components/pc/BlockChainBrowser/PageContainer.vue";
import blockDetailMixin from "@/mixin/blockDetail";
import VueTypedMixins from "vue-typed-mixins";
import ConsensusNodeTable from "./components/consensusNodeTable.vue";
export default VueTypedMixins(blockDetailMixin).extend({
components: {
......@@ -92,7 +93,7 @@ export default VueTypedMixins(blockDetailMixin).extend({
TradeTable,
ConsensusNodeTable,
},
})
});
</script>
<style scoped>
......
vue.config.js
View file @ a6b78507
......@@ -5,6 +5,7 @@ const MomentLocalesPlugin = require("moment-locales-webpack-plugin");
module.exports = {
outputDir: "dist",
publicPath: "./",
lintOnSave:false,
devServer: {
proxy: {
// 设置代理
......@@ -25,7 +26,7 @@ module.exports = {
"/yccApi": {
// target: "https://mainnet.yuan.org/api",
// target: "http://13.115.171.240:7901/",
target: "http://183.134.99.140:9901/",
target: "https://yuan.org/yccApi",
pathRewrite: {
"^/yccApi": "",
},
......@@ -39,7 +40,7 @@ module.exports = {
},
"/expandApi": {
// target: "http://121.37.141.165:19992/ycc",
target: "http://183.134.99.140:19993/pos33",
target: "https://yuan.org/expandApi",
pathRewrite: {
"^/expandApi": "",
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment