tab change

src/ElementConfig/index.ts

@@ -7,7 +7,9 @@ import {
   Select,
   Option,
   Message,
-  MessageBox
+  MessageBox,
+  RadioGroup,
+  RadioButton
 } from 'element-ui'
 
 export default {
@@ -18,6 +20,8 @@ export default {
     V.use(Option)
     V.use(Table)
     V.use(TableColumn)
+    V.use(RadioGroup)
+    V.use(RadioButton)
     V.use(Loading.directive)
     V.prototype.$notify = Notification
     V.prototype.$confirm = MessageBox.confirm

src/assets/lang/en.ts

@@ -70,7 +70,8 @@ export const lang = {
     nextBlock: "Next Block",
     no: "Nothing",
     consensusAddress: "Consensus",
-    txnsBlocks: "Block with more than {0} txns"
+    txnsBlocks: "Block with more than {0} txns",
+    mtxnsBlocks: '>{0} txns'
   },
   txDetail: {
     detail: "Transaction details",

src/assets/lang/zh.ts

@@ -70,7 +70,8 @@ export const lang = {
     nextBlock: "下个区块",
     no: "无",
     consensusAddress: "共识地址",
-    txnsBlocks: '> {0}交易数量的区块'
+    txnsBlocks: '> {0}交易数量的区块',
+    mtxnsBlocks: '>{0}交易数'
   },
   txDetail: {
     detail: "交易详情",

src/views/mobile/block.vue

@@ -16,20 +16,17 @@
         )})`"
       ></m-title>
       <div class="search-container">
-        <el-select
-          v-model="range"
-          class="range-select"
-          size="small"
-          @change="filterBlocks"
-        >
-          <el-option
-            v-for="item in selectOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
-          </el-option>
-        </el-select>
+        <el-radio-group v-model="range" @change="filterBlocks" size="small">
+          <el-radio-button :label="0">{{
+            $t("lang.block.title")
+          }}</el-radio-button>
+          <el-radio-button :label="100">{{
+            $t("lang.block.mtxnsBlocks", [100])
+          }}</el-radio-button>
+          <el-radio-button :label="1000">{{
+            $t("lang.block.mtxnsBlocks", [1000])
+          }}</el-radio-button>
+        </el-radio-group>
       </div>
       <m-block-item
         v-for="(item, i) in Blocks"
@@ -77,9 +74,8 @@ export default VueTypedMixins(blockMixin).extend({
   align-items: flex-start;
 }
 .search-container {
-  padding: 0 25px;
   display: flex;
-  justify-content: flex-end;
+  justify-content: center;
   align-items: center;
   position: absolute;
   top: 50px;

src/views/pc/block.vue

@@ -25,20 +25,17 @@
       <!-- 表格部分 -->
       <div class="table-container">
         <div class="search-container">
-          <el-select
-            v-model="range"
-            class="range-select"
-            size="small"
-            @change="filterBlocks"
-          >
-            <el-option
-              v-for="item in selectOptions"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
-            </el-option>
-          </el-select>
+          <el-radio-group v-model="range" @change="filterBlocks">
+            <el-radio-button :label="0">{{
+              $t("lang.block.title")
+            }}</el-radio-button>
+            <el-radio-button :label="100">{{
+              $t("lang.block.txnsBlocks", [100])
+            }}</el-radio-button>
+            <el-radio-button :label="1000">{{
+              $t("lang.block.txnsBlocks", [1000])
+            }}</el-radio-button>
+          </el-radio-group>
         </div>
         <el-table
           :data="Blocks"
@@ -162,9 +159,6 @@ export default VueTypedMixins(blockMixin).extend({
   width: 100%;
   background: #fafbfc;
 }
-.range-select {
-  width: 310px;
-}
 .title {
   margin-top: 30px;
 }
@@ -223,7 +217,4 @@ export default VueTypedMixins(blockMixin).extend({
   height: 150px;
   vertical-align: baseline !important;
 }
-.range-select input {
-  border-radius: 20px;
-}
 </style>
\ No newline at end of file