174 lines
3.7 KiB
Vue
174 lines
3.7 KiB
Vue
<template>
|
||
<view>
|
||
<view class="deal-back"></view>
|
||
<!-- 区块信息 -->
|
||
<view class="block-shadow chian-hash">
|
||
<view class="title">区块HASH</view>
|
||
<view class="hash">{{info.hash || '-'}}</view>
|
||
<view class="button" @click="copyHash">复制</view>
|
||
<view class="chian-info">
|
||
<view class="item-flex">
|
||
<view class="label webkit-box">交易数据</view>
|
||
<view class="ellipsis">
|
||
{{ info.tx_count || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex">
|
||
<view class="label webkit-box">区块高度</view>
|
||
<view class="ellipsis">
|
||
{{ info.height || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex">
|
||
<view class="label webkit-box">时间</view>
|
||
<view class="ellipsis">
|
||
{{ info.block_time || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex webkit-box">
|
||
<view class="label">上一块</view>
|
||
<view class="ellipsis">
|
||
{{ info.parent_hash || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex webkit-box">
|
||
<view class="label">区块难度</view>
|
||
<view class="ellipsis">
|
||
{{ info.difficulty || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex webkit-box">
|
||
<view class="label">默克尔跟</view>
|
||
<view class="ellipsis">
|
||
{{ info.tx_hash || '-' }}
|
||
</view>
|
||
</view>
|
||
<view class="item-flex">
|
||
<view class="label">状态哈希</view>
|
||
<view class="ellipsis">
|
||
{{ info.state_hash || '-' }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 交易记录 -->
|
||
<view class="deals">
|
||
<view class="title">交易记录</view>
|
||
<deal-list :list="deal" />
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { hash } from '@/apis/interfaces/chain'
|
||
import dealList from '@/components/chain/deal'
|
||
export default {
|
||
components:{
|
||
dealList
|
||
},
|
||
data() {
|
||
return {
|
||
info: {},
|
||
deal: [],
|
||
}
|
||
},
|
||
onLoad(e){
|
||
// 交易详情
|
||
if(e.hash && e.hash != '') hash(e.hash).then(res=>{
|
||
this.info = res.head
|
||
this.deal = res.trades
|
||
}).catch(err => {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '错误 22 line in chain/deal'
|
||
})
|
||
})
|
||
else uni.showToast({
|
||
icon: 'none',
|
||
title: 'hash值不存在，系统错误'
|
||
})
|
||
},
|
||
methods:{
|
||
copyHash(){
|
||
if(this.info.hash) uni.setClipboardData({
|
||
data: this.info.hash
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.block-shadow{
|
||
box-shadow: 0 0 2rpx 2rpx rgba($color: #000000, $alpha: .02);
|
||
}
|
||
// 背景
|
||
.deal-back {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: -1;
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background: linear-gradient(to bottom, #009B69, #00562d);
|
||
}
|
||
// 区块详情
|
||
.chian-hash{
|
||
margin: $margin + ($margin/2);
|
||
background-color: white;
|
||
padding: ($padding * 3) ($padding * 2);
|
||
border-radius: $radius;
|
||
text-align: center;
|
||
.title{
|
||
font-size: $title-size + 8;
|
||
font-weight: bold;
|
||
color: $text-color;
|
||
}
|
||
.hash{
|
||
padding: $padding 0 ($padding*2) 0;
|
||
word-wrap: break-word;
|
||
color: $text-gray;
|
||
}
|
||
.button{
|
||
background-color: $red-color;
|
||
width: 50%;
|
||
display: inline-block;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
color: white;
|
||
font-size: $title-size;
|
||
border-radius: 45rpx;
|
||
font-weight: bold;
|
||
}
|
||
.chian-info{
|
||
margin-top: $margin * 2;
|
||
background-color: $border-color-lg;
|
||
padding: $padding;
|
||
.item-flex{
|
||
padding-left: 220rpx;
|
||
text-align: right;
|
||
position: relative;
|
||
line-height: 70rpx;
|
||
min-height: 70rpx;
|
||
.label{
|
||
position: absolute;
|
||
left: 0;
|
||
width: 200rpx;
|
||
text-align: left;
|
||
color: $text-gray;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// 区块交易信息
|
||
.deals{
|
||
padding: $padding;
|
||
.title{
|
||
text-align: center;
|
||
font-weight: bold;
|
||
color: white;
|
||
font-size: $title-size;
|
||
}
|
||
}
|
||
</style>
|