feat: 增加gas费数据监控,地址组横向滚动条

front/admin-front/src/layout/components/Sidebar/index.vue

@@ -114,8 +114,6 @@ export default {
       '5501cc476bc14e63ae6de0e8515d1f99','c05b49809dbe45f6a18695b7aef4558b','0c78a0fff4bd47bd9fef257f03f6410a',
       '4bf360eec98e432992019426ed430800','a9b295e9bbcc4a8580b8932589612442','c3b727c313e24e21b720ccbbc229395f']
       getUserRights().then(res=>{
-        console.log(res);
-        console.log(this.$router.options.routes);
         let showRoutes = this.$router.options.routes
         Arr.forEach((item,index)=>{
           let result = res.includes(item)

front/admin-front/src/views/address/index.vue

@@ -53,9 +53,13 @@
         </div>
       </div>
       <div class="app-container-table-select">
-        <div @click="selectAddressGroup(index)" v-for="(item,index) in table.walletNameGroup" :class="index === table.walletNameGroupIndex ? 'app-container-table-select-item-active' : 'app-container-table-select-item'">
+        <el-scrollbar>
+        <div class="scrollbar-flex-content">
+          <div @click="selectAddressGroup(index)" v-for="(item,index) in table.walletNameGroup" :class="index === table.walletNameGroupIndex ? 'app-container-table-select-item-active' : 'app-container-table-select-item'">
           {{item}}
+          </div>
         </div>
+        </el-scrollbar>
       </div>
       <div class="app-container-table-screening">
         <div class="app-container-table-screening-item">
@@ -635,12 +639,12 @@ export default {
       // console.log('输入的密码:', dataToEncrypt);
       // 获取当前北京时间
       const beijingDate = this.getCurrentBeijingTime();
-      // 生成keyByte
+      // 生成keyByte;
       const keyByte = this.generateKeyByteArray(beijingDate);
       // console.log('生成的toHex:', keyByte);
       // 加密数据
       const encryptedData = this.encryptData(dataToEncrypt, keyByte);
-      console.log('加密后的数据:', encryptedData);
+      // console.log('加密后的数据:', encryptedData);
       let params = {
         chainId : this.batchAddressObj.chainId,
         groupName : this.batchAddressObj.groupName,
@@ -793,7 +797,7 @@ export default {
         title: '错误',
         message: message
       });
-    }
+    },
   }
 }
 </script>
@@ -889,18 +893,25 @@ export default {
       display: flex;
       align-items: center;
       gap:56px;
-      border-bottom: 4px solid #f2f4f7;
+      //border-bottom: 4px solid #f2f4f7;
       width: 100%;
       margin-top: 28px;
+      .scrollbar-flex-content {
+        display: flex;
+        gap:56px;
+      }
+
       .app-container-table-select-item{
         font-weight: 400;
         font-size: 17px;
         line-height: 22px;
         color: #ABABAB;
         padding-bottom: 16px;
-        margin-bottom: -4px;
-        border-bottom: 4px solid #f2f4f7;
+        //margin-bottom: -4px;
+        border-bottom: 4px solid #f9fbff;
         cursor: pointer;
+        white-space:nowrap;
+        margin-bottom: 20px;
       }
       .app-container-table-select-item-active{
         font-weight: 700;
@@ -908,9 +919,11 @@ export default {
         line-height: 22px;
         color: #2980FF;
         padding-bottom: 16px;
-        margin-bottom: -4px;
+        //margin-bottom: -4px;
         border-bottom: 4px solid #2980FF;
         cursor: pointer;
+        white-space:nowrap;
+        margin-bottom: 20px;
       }
     }
     .app-container-table-screening{

front/admin-front/src/views/autoplay/index.vue

@@ -1056,6 +1056,7 @@ export default {
       this.currentRecordData.intervalMin = item.intervalMin
       this.currentRecordData.maxGas = item.maxGas
       this.currentRecordData.executeId = item.executeId
+      this.currentRecordData.airdropParams = []
       let params = {
         page: 1,
         pageSize: 10,

front/admin-front/src/views/dashboard/index.vue

@@ -148,10 +148,10 @@
       </div>
       <div class="right">
         <div class="title">
-          燃气报价(单位:元)
+          燃气报价(单位:gwei)
         </div>
         <div class="base">
-          当前基数:38基于以太坊交易内存池预测
+<!--          当前基数:38基于以太坊交易内存池预测-->
         </div>
         <div class="gasBox">
           <div class="top">
@@ -159,10 +159,10 @@
               <img src="../../assets/dashboard/Vector.svg" alt="Vector">
               <div class="info">
                 <div class="speed">
-                  Top 40
+                  High
                 </div>
                 <div class="price">
-                  $1.57 | for 15 seconds
+                  {{gas.FastGasPrice}} gwei
                 </div>
               </div>
             </div>
@@ -172,43 +172,49 @@
               <img src="../../assets/dashboard/Vector-1.svg" alt="Vector">
               <div class="info">
                 <div class="speed">
-                  High speed 40
+                  Average
                 </div>
                 <div class="price">
-                  $1.53 | 1 minute
-                </div>
-              </div>
-            </div>
-          </div>
-          <div class="general">
-            <div class="item">
-              <img src="../../assets/dashboard/Vector-2.svg" alt="Vector">
-              <div class="info">
-                <div class="speed">
-                  General 40
-                </div>
-                <div class="price">
-                  $1.49 | 3 minutes
+                  {{gas.ProposeGasPrice}} gwei
                 </div>
               </div>
             </div>
           </div>
+<!--          <div class="general">-->
+<!--            <div class="item">-->
+<!--              <img src="../../assets/dashboard/Vector-2.svg" alt="Vector">-->
+<!--              <div class="info">-->
+<!--                <div class="speed">-->
+<!--                  Low-->
+<!--                </div>-->
+<!--                <div class="price">-->
+<!--                  {{gas.SafeGasPrice}}-->
+<!--                </div>-->
+<!--              </div>-->
+<!--            </div>-->
+<!--          </div>-->
           <div class="slow">
             <div class="item">
               <img src="../../assets/dashboard/Vector-3.svg" alt="Vector">
               <div class="info">
                 <div class="speed">
-                  Slow 40
+                  Low
                 </div>
                 <div class="price">
-                  $1.49 | > 10 minutes
+                  {{gas.SafeGasPrice}} gwei
                 </div>
               </div>
             </div>
           </div>
         </div>
-        <div class="logo">
-          <img src="../../assets/dashboard/image.svg" alt="image">
+        <div class="logo"  @click="getGas">
+<!--          <img src="../../assets/dashboard/image.svg" alt="image">-->
+          <div v-if="!loading">
+            刷新数据
+          </div>
+          <div v-if="loading" style="width: 20px;height: 20px">
+            <Loading />
+          </div>
         </div>
       </div>
     </div>
@@ -293,9 +299,12 @@
 <script>
 import * as echarts from 'echarts';
 import {addressGroup, countFee, dailyCost, expectedInput, taskProgress} from "@/api/statistics";
+import Loading from "@/components/Loading";
+
 
 export default {
   name: "Dashboard",
+  components: {Loading},
   data() {
     return {
       progressData: [],
@@ -358,7 +367,9 @@ export default {
         xAxisData:[],
         seriesData:[]
       },
-      timer:null
+      timer:null,
+      gas:{},
+      loading:false
     };
   },
   mounted() {
@@ -368,6 +379,7 @@ export default {
     this.getTaskProgress()
     this.getAddressGroup()
     this.roll(60)
+    this.getGas()
   },
   beforeDestroy() {
     if(this.timer) clearInterval(this.timer)
@@ -610,7 +622,6 @@ export default {
       this.rollStart(t)
     },
     rollStart(t) {
-      console.log('2')
       let ul1 = document.getElementById('progressBoxOne')
       let ul2 = document.getElementById('progressBoxTwo')
       let ulbox = document.getElementById('progressViewBox')
@@ -625,8 +636,20 @@ export default {
     },
     rollStop(){
       clearInterval(this.timer)
-      console.log('1')
-    }
+    },
+    getGas() {
+      this.loading = true
+      fetch('https://api.etherscan.io/api?module=gastracker&action=gasoracle&apikey=DHB4H92CFC1EZTT8FINM3ETSF36T9TRXBZ')
+        .then( response =>{
+          let res = response.json()
+          res.then(result =>{
+            this.gas = result.result
+            this.loading = false
+          })
+        })
+
+    },
+
   },
 };
 </script>
@@ -918,7 +941,7 @@ export default {
       .gasBox {
         display: flex;
         flex-direction: column;
-        gap: 28px;
+        gap: 88px;
 
         .item {
           display: flex;
@@ -954,7 +977,9 @@ export default {
           border-radius: 10px;
           display: flex;
           align-items: center;
-          justify-content: center;
+          //justify-content: center;
+          padding-left: 80px;
+
         }
 
         .high {
@@ -965,7 +990,9 @@ export default {
           border-radius: 10px;
           display: flex;
           align-items: center;
-          justify-content: center;
+          //justify-content: center;
+          padding-left: 80px;
+
         }
 
         .general {
@@ -976,7 +1003,9 @@ export default {
           border-radius: 10px;
           display: flex;
           align-items: center;
-          justify-content: center;
+          //justify-content: center;
+          padding-left: 80px;
+
         }
 
         .slow {
@@ -987,7 +1016,8 @@ export default {
           border-radius: 10px;
           display: flex;
           align-items: center;
-          justify-content: center;
+          //justify-content: center;
+          padding-left: 80px;
         }
       }
 
@@ -995,6 +1025,8 @@ export default {
         margin-top: 72px;
         display: flex;
         justify-content: center;
+        color: #2980ff;
+        cursor: pointer;
       }
     }
   }