From 4f97657270b7aef0d3b7a6b25ea2b4adb07a77c7 Mon Sep 17 00:00:00 2001
From: zhouwenxuan <1175765986@qq.com>
Date: 星期五, 10 十一月 2023 16:55:34 +0800
Subject: [PATCH] 新增风险等级筛选条件、等级颜色

---
 src/views/experiment/developing/index.vue |   43 +++++++++++++++++++++++++++++++++++++------
 1 files changed, 37 insertions(+), 6 deletions(-)

diff --git a/src/views/experiment/developing/index.vue b/src/views/experiment/developing/index.vue
index 1b78e08..9500ff9 100644
--- a/src/views/experiment/developing/index.vue
+++ b/src/views/experiment/developing/index.vue
@@ -13,6 +13,12 @@
                         <el-option v-for="item in developState.experimentTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                     </el-select>
                 </div>
+                <div class="basic-line">
+                    <span>风险等级:</span>
+                    <el-select v-model="developState.searchQuery.searchParams.assessLevel" clearable filterable class="input-box" placeholder="风险等级">
+                        <el-option v-for="item in developState.riskLevelList" :key="item.id" :label="item.name" :value="item.id"></el-option>
+                    </el-select>
+                </div>
                 <div style="padding-bottom: 10px">
                     <el-button type="primary" @click="getdevelopData">查询</el-button>
                     <el-button plain @click="reset">重置</el-button>
@@ -74,11 +80,11 @@
                           </template>
                         </el-table-column>
                         <el-table-column prop="assessLevel" label="风险等级">
-                          <template #default="scope">
-                            <el-tag :type="scope.row.assessLevel == 4?'danger':scope.row.assessLevel == 3 || scope.row.assessLevel == 2?'warning':''">
-                              {{scope.row.assessLevel == 1?'重大风险':scope.row.assessLevel == 2?'较大风险':scope.row.assessLevel == 3?'一般风险':scope.row.assessLevel == 4?'低风险':'--'}}
-                            </el-tag>
-                          </template>
+                            <template #default="scope">
+                                <el-tag type="info" :class="developState.tagBg[scope.row.assessLevel - 1]" style="color:#383838;">
+                                    {{scope.row.assessLevel == 1 ?'重大风险':scope.row.assessLevel == 2?'较大风险':scope.row.assessLevel == 3?'一般风险':scope.row.assessLevel == 4?'低风险':'--'}}
+                                </el-tag>
+                            </template>
                         </el-table-column>
 <!--                        <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column>-->
 <!--                        <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column>-->
@@ -128,6 +134,7 @@
         searchParams: {
             experimentName: '',
             experimentType: null,
+            assessLevel: null
         }
     },
     total: 0,
@@ -139,7 +146,14 @@
         {id: 5, name: '特种设备类'},
         {id: 6, name: '其它类'},
     ],
-    allRoomList: []
+    allRoomList: [],
+    riskLevelList: [
+        {id: 1, name: '重大风险'},
+        {id: 2, name: '较大风险'},
+        {id: 3, name: '一般风险'},
+        {id: 4, name: '低风险'},
+    ],
+    tagBg: ['red', 'orange', 'yellow', 'blue']
 })
 
 const getdevelopData = async () => {
@@ -259,8 +273,10 @@
         searchParams: {
             experimentName: '',
             experimentType: null,
+            assessLevel: null
         }
     }
+    getdevelopData()
 };
 
 const getRoomData = async () => {
@@ -408,6 +424,18 @@
         color: #0098f5;
     }
 }
+.red {
+    background: rgba(255,0,0,0.6);
+}
+.orange {
+    background: rgba(248,82,8,0.6);
+}
+.yellow {
+    background: rgba(247,255,0,0.6);
+}
+.blue {
+    background: rgba(0,112,192,0.6);
+}
 
 :deep(.el-date-editor) {
     width: 100%;
@@ -426,4 +454,7 @@
     background-color: var(--el-card-bg-color);
     box-shadow: none;
 }
+:deep(.el-tag){
+    border: none;
+}
 </style>

--
Gitblit v1.9.2