Explorar o código

feat: 优化和修复BUG

zhangwenya hai 9 meses
pai
achega
7b1a7277bf
Modificáronse 3 ficheiros con 101 adicións e 7 borrados
  1. 1 0
      src/views/hl/bm/index.vue
  2. 48 5
      src/views/hl/check/css/style.scss
  3. 52 2
      src/views/hl/check/index.vue

+ 1 - 0
src/views/hl/bm/index.vue

@@ -90,6 +90,7 @@
 import {addBm, delBm, listBm, updateBm} from "@/api/hl/bm";
 import {history} from "@/api/hl/hlScore";
 import {history as dayHistory} from "@/api/hl/hlDay";
+import addBmInfo from "./component/addBm.vue"
 import healthSetting from "./component/healthSetting.vue"
 import historyHealth from "./component/historyHealth.vue"
 import * as echarts from 'echarts'

+ 48 - 5
src/views/hl/check/css/style.scss

@@ -113,11 +113,6 @@
     }
     .check-progress{
       @include flexStart();
-      .t-span{
-        margin-right:5px;
-        font-weight: bold;
-        color:#444;
-      }
     }
     .progress-bar-inner {
       background-image: linear-gradient(to right, #3d5afe 0%, #2196f3 100%);
@@ -127,4 +122,52 @@
       transition: all .2s;
     }
   }
+  .t-span{
+    margin-right:5px;
+    font-weight: bold;
+    color: #2c3e50;
+  }
+  .check-time{
+    font-size: 12px;
+    color: #2c3e50;
+  }
+  .check-info{
+    @include flexBetween();
+    margin-top:15px;
+    font-size: 18px;
+    .sub-col{
+      @include flexStart();
+      .s-c-text{
+        text-align: center;
+        color:#409EFF;
+        margin-left:10px;
+        line-height:26px;
+        .s-c-num{
+          font-size: 24px;
+          font-weight: bold;
+        }
+      }
+    }
+  }
+  .rotate{
+    animation: spin 1s linear infinite;
+  }
+  .check-result{
+    @include flexCenter();
+    .res-text{
+      margin-left:5px;
+      color:#e43;
+      font-weight: bold;
+    }
+  }
+
+  /* 定义动画 */
+  @keyframes spin {
+    from {
+      transform: rotate(0deg); /* 从0度开始 */
+    }
+    to {
+      transform: rotate(360deg); /* 旋转一圈(360度) */
+    }
+  }
 }

+ 52 - 2
src/views/hl/check/index.vue

@@ -25,17 +25,59 @@
             </template>
           </el-progress>
         </span>
-        <span></span>
+        <span>
+          <span v-show="checkTime" class="check-time">
+            <span class="t-span">巡检时间:</span>
+            <span class="check-time">{{parseTime(checkTime, '{y}-{m}-{d} {h}:{mi}:{s}')}}</span>
+          </span>
+        </span>
       </div>
       <div class="progress-bar">
         <div class="progress-bar-inner" :style="`width: ${currentProgress}%`"/>
       </div>
 
+      <div class="check-info">
+        <div class="sub-col">
+          <el-icon :size="46" color="#409EFF"><Timer /></el-icon>
+          <div class="s-c-text">
+            {{cIndex!=null?cIndex+1:0}}/{{checkList.length}}<br/>已检测模型</div>
+        </div>
+        <div class="sub-col">
+          <el-icon :size="46" color="#409EFF"><Compass /></el-icon>
+          <div class="s-c-text">{{cIndex!=null?Math.ceil((314/checkList.length)*(cIndex+1)):0}}/314<br/>已检测指标{{cIndex}}</div>
+        </div>
+        <div class="sub-col">
+          <el-icon :size="46" color="#409EFF"><Warning /></el-icon>
+          <div class="s-c-text">
+            <span class="s-c-num">{{totalError}}</span>
+            <br/>已发现问题</div>
+        </div>
+      </div>
       <el-table :data="listData" style="width: 100%" border class="mt20">
         <el-table-column prop="class" label="分类" width="180" />
         <el-table-column prop="option" label="巡检项" />
+        <el-table-column label="巡检进度" align="center" width="180">
+          <template #default="{row}">
+            <span v-if="checkTime">
+              <el-icon size="25" color="#90a4ae" class="rotate" v-if="row.checkProess!=='done'"><Loading /></el-icon>
+              <el-icon size="25" color="#388e3c" v-else><CircleCheck /></el-icon>
+            </span>
+            <span v-else>-</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="巡检结果" align="center" width="180">
+          <template #default="{row}">
+            <span v-if="checkTime">
+              <el-icon size="25" color="#90a4ae" class="rotate" v-if="!row.checkResult"><Loading /></el-icon>
+              <span v-else class="check-result">
+                <el-icon size="20" color="#e43"><WarnTriangleFilled /></el-icon>
+                <span class="res-text">{{row.checkResult}} 项</span>
+              </span>
+            </span>
+            <span v-else>-</span>
+          </template>
+        </el-table-column>
       </el-table>
-
     </div>
 
   </div>
@@ -43,11 +85,14 @@
 <script setup lang="ts">
 import {getCheckList,getCheckModel} from "@/api/hl/bm"
 import {onMounted} from "vue";
+import {Timer,Compass,Warning,Loading,CircleCheck,WarnTriangleFilled} from "@element-plus/icons-vue"
 const checkList = ref([])
 const cLoading = ref(false)
 const currentProgress = ref(0)
 const cIndex=ref(null)
 const listData = ref([])
+const checkTime = ref(null)
+const totalError=ref(0)
 
 const colors = [
   { color: '#bbdefb', percentage: 20 },
@@ -93,6 +138,7 @@ function handleNowCheck(sub){
   if(!cLoading.value){
     cLoading.value = true
     cIndex.value = null;
+    checkTime.value = new Date()
   }
   let index = checkList.value.length-sub
   currentProgress.value = Number(Number(index / checkList.value.length * 100).toFixed(2))
@@ -102,6 +148,10 @@ function handleNowCheck(sub){
   setTimeout(async ()=>{
     const res = await getCheckModel(checkList.value[index].modelId)
     console.log(res)
+    listData.value[index].checkProess = 'done'
+    let e = Math.ceil(Math.random()*100)
+    totalError.value += e
+    listData.value[index].checkResult = e
     cIndex.value = index
     handleNowCheck(sub-1)
   }, getRandomInt(500, 500))