fix

src/components/mobile/m-vote-pack.vue

@@ -20,7 +20,16 @@
     <div class="flex-grow" style="margin-left: 10px;">
       <div class="flex justify-between" style="margin-bottom: 5px;">
         <div class="text-darkBlue text-sm font-bold">
-          102938
+          <router-link
+            :to="{
+              path: '/blockDetail',
+              query: {
+                height: height,
+              },
+            }"
+          >
+            102938
+          </router-link>
         </div>
         <div class="text-text-color">
           {{ 2039480923 | formatTime }}
@@ -31,7 +40,16 @@
           {{ $t('lang.txDetail.txHash') }}:
         </span>
         <span class="text-footer-color text-xs font-bold">
-          asdlfkjadlsfk
+          <router-link
+            :to="{
+              path: '/tradeHash',
+              query: {
+                hash: txHash,
+              },
+            }"
+          >
+            {{ 'alskdjflaksjdflkasdf' | filterHash(9) }}
+          </router-link>
         </span>
       </div>
       <div>
@@ -39,7 +57,16 @@
           {{ $t('lang.trade.sender') }}:
         </span>
         <span class="text-footer-color text-xs font-bold">
-          asdlfkjadlsfk
+          <router-link
+            :to="{
+              path: '/address',
+              query: {
+                address: sender,
+              },
+            }"
+          >
+            {{ 'lakjsdflkjaskdlfjasdf' | filterHash(9) }}
+          </router-link>
         </span>
       </div>
     </div>

src/mixin/blockDetail.ts

@@ -3,7 +3,7 @@ import Vue from "vue";
 import { getBlockOverviewAndRelativeHeight } from "ycc-api/dist/cmjs/service/blockDetail";
 import { message } from "ant-design-vue";
 import { tradeAccuracy } from "@/utils/common";
-import { getConsensusList, getPackList, getVoteList } from "@/utils/consensus";
+import { getConsensusList } from "@/utils/consensus";
 const Rpc = getRpc("/yccApi");
 export default Vue.extend({
   data() {
@@ -13,22 +13,7 @@ export default Vue.extend({
 
       txRecordFilterValue: "allTx",
       consensusNodeFilterValue: "allNode",
-      consensusNodeTableList: [
-        {
-          height: 111,
-          address: "aldjfasdf",
-          reward: 10 * 1e8,
-          time: 102938123,
-          type: "",
-        },
-        {
-          height: 111,
-          address: "aldjfasdf",
-          reward: 10 * 1e8,
-          time: 102938123,
-          type: "lakjsd",
-        },
-      ] as any[],
+      consensusNodeTableList: [] as any[],
       loadingConsensusNodeTable: false,
       overview: {
         txCount: 0,
@@ -42,7 +27,7 @@ export default Vue.extend({
       loadingOverview: false,
       loadingRelativeNumber: false,
       loadingTable: false,
-      Trades: [] as any[],
+      allTrades: [] as any[],
       txHashes: [],
       pages: {
         currentPage: 1,
@@ -57,25 +42,51 @@ export default Vue.extend({
     },
     fetchTradeFromTxHashes() {
       this.loadingTable = true;
-      const searchArr: string[] = [];
-      const end =
-        this.pages.pageSize * this.pages.currentPage - 1 < this.pages.total
-          ? this.pages.pageSize * this.pages.currentPage - 1
-          : this.pages.total - 1;
-      const start = this.pages.pageSize * (this.pages.currentPage - 1);
-      for (let i = start; i <= end; i++) {
-        searchArr.push(this.txHashes[i]);
-      }
-      Rpc.getTxByHashes(searchArr).then((data) => {
+      Rpc.getTxByHashes(this.txHashes).then((data) => {
         this.loadingTable = false;
         if (data.error == null) {
-          console.log(getConsensusList(data.result.txs)); // 共识节点
+          this.consensusNodeTableList = getConsensusList(data.result.txs).map(
+            (i) => {
+              return {
+                height: this.$route.query.height,
+                address: i.addr,
+                reward: i.reward,
+                time: data.result.txs[0].blockTime,
+                type: i.type,
+              };
+            }
+          );
           // this.searchIcon(data.result.txs);
-          this.Trades = this.checkGroup(data.result.txs);
+          this.allTrades = this.checkGroup(data.result.txs);
         } else {
           message.warning(this.$t("components.tip") + data.error);
         }
       });
+
+      // this.loadingTable = true;
+      // const searchArr: string[] = [];
+      // const end =
+      //   this.pages.pageSize * this.pages.currentPage - 1 < this.pages.total
+      //     ? this.pages.pageSize * this.pages.currentPage - 1
+      //     : this.pages.total - 1;
+      // const start = this.pages.pageSize * (this.pages.currentPage - 1);
+      // for (let i = start; i <= end; i++) {
+      //   searchArr.push(this.txHashes[i]);
+      // }
+      // Rpc.getTxByHashes(searchArr).then((data) => {
+      //   this.loadingTable = false;
+      //   if (data.error == null) {
+      //     console.log(
+      //       data.result.txs[0].blockTime,
+      //       "show data.result.txs[0].blockTime"
+      //     );
+      //     console.log(getConsensusList(data.result.txs)); // 共识节点
+      //     // this.searchIcon(data.result.txs);
+      //     this.Trades = this.checkGroup(data.result.txs);
+      //   } else {
+      //     message.warning(this.$t("components.tip") + data.error);
+      //   }
+      // });
     },
     checkGroup(arr: any[]) {
       arr.map((current, index) => {
@@ -164,6 +175,23 @@ export default Vue.extend({
     },
   },
   computed: {
+    consensusNodeTableListFiltered(): any[] {
+      if (this.consensusNodeFilterValue === "allNode")
+        return this.consensusNodeTableList;
+      return this.consensusNodeTableList.filter(
+        (i) =>
+          i.type ===
+          (this.consensusNodeFilterValue === "packingNode" ? "pack" : "vote")
+      );
+    },
+    Trades(): any[] {
+      const end =
+        this.pages.pageSize * this.pages.currentPage - 1 < this.pages.total
+          ? this.pages.pageSize * this.pages.currentPage - 1
+          : this.pages.total - 1;
+      const start = this.pages.pageSize * (this.pages.currentPage - 1);
+      return this.allTrades.slice(start, end + 1);
+    },
     tabList(): any[] {
       return [
         {

src/views/pc/blockDetail/components/consensusNodeTable.vue

@@ -26,7 +26,16 @@
               ' text-orange2': item.row.type === '',
             }"
           >
-            {{ item.row.height }}
+            <router-link
+              :to="{
+                path: '/blockDetail',
+                query: {
+                  height: item.row.height,
+                },
+              }"
+            >
+              {{ item.row.height }}
+            </router-link>
           </div>
         </template>
       </el-table-column>
@@ -46,16 +55,14 @@
                 },
               }"
             >
-              {{ item.row.address }}
+              {{ item.row.address | filterHash(10) }}
             </router-link>
           </div>
         </template>
       </el-table-column>
       <el-table-column :label="$t('lang.block.blockReward')">
         <template slot-scope="{ row }">
-          <div class="text-darkBlue">
-            {{ row.reward | filterAmount }}
-          </div>
+          <div class="text-darkBlue">{{ row.reward | filterAmount }} YCC</div>
         </template>
       </el-table-column>
       <el-table-column :label="$t('lang.txDetail.time')">
@@ -68,7 +75,7 @@
       <el-table-column :label="$t('lang.trade.type')" align="right" width="90">
         <template slot-scope="{ row }">
           <div class="text-darkBlue">
-            {{ row.type }}
+            {{ row.type === 'vote' ? '投票节点' : '打包节点' }}
           </div>
         </template>
       </el-table-column>
@@ -91,7 +98,7 @@ export default Vue.extend({
   methods: {
     cellStyle({ row }: any) {
       return {
-        backgroundColor: row.type === '' ? 'rgba(255, 164, 87, 0.06)' : '',
+        backgroundColor: row.type === 'pack' ? 'rgba(255, 164, 87, 0.06)' : '',
       }
     },
   },

src/views/pc/blockDetail/index.vue

 <template>
-  <div class="block-detail min-w-1200 md:w-bodySet mx-auto flow-root">
+  <div
+    class="block-detail min-w-1200 md:w-bodySet mx-auto flow-root"
+    style="padding-bottom: 60px;"
+  >
     <chain-search
       style="margin-top: 30px;"
       :clickSearch="clickSearch"
@@ -13,12 +16,7 @@
       :loading="loadingOverview"
       :loadingRelativeBlockHeight="loadingRelativeNumber"
     ></block-overview>
-    <div
-      style="
-        box-shadow: 0px 2px 15px 0px rgba(31, 52, 112, 0.06);
-        padding-bottom: 60px;
-      "
-    >
+    <div class="shadow-shadow1">
       <TabList
         :tabList="tabList"
         :setFocusedTab="(v) => (focusedTab = v)"
@@ -40,6 +38,7 @@
         :Loading="loadingTable"
         :Trades="Trades"
         :pages="pages"
+        :hidePageContainer="true"
         :sizeChange="sizeChange"
         :pageChange="pageChange"
       ></TradeTable>
@@ -57,10 +56,23 @@
       </DataFilter>
       <consensus-node-table
         v-if="focusedTab === 'consensusNodeTab'"
-        :list="consensusNodeTableList"
-        :loading="loadingConsensusNodeTable"
+        :list="consensusNodeTableListFiltered"
+        :loading="loadingTable"
       ></consensus-node-table>
     </div>
+    <div
+      class="flex justify-end"
+      style="margin-top: 30px;"
+      v-if="focusedTab === 'txRecordTab'"
+    >
+      <page-container
+        @pageChange="pageChange"
+        @sizeChange="sizeChange"
+        :currentPage="pages.currentPage"
+        :pageSize="pages.pageSize"
+        :total="pages.total"
+      ></page-container>
+    </div>
   </div>
 </template>
 
@@ -70,6 +82,7 @@ import BlockOverview from '@/components/pc/BlockChainBrowser/BlockOverview/index
 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'
@@ -78,6 +91,7 @@ export default VueTypedMixins(blockDetailMixin).extend({
   components: {
     ChainSearch,
     BlockOverview,
+    PageContainer,
     TabList,
     DataFilter,
     TradeTable,