设备监控-tabs添加icon

src/views/govern/device/control/index.vue

@@ -9,9 +9,9 @@
         <div class="device-control-right" v-if="deviceData">
             <el-descriptions title="设备基本信息" class="mb10" :column="3" border>
                 <template #extra>
-                    <el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleDownLoadTemplate">
+                    <!-- <el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleDownLoadTemplate">
                         模版下载
-                    </el-button>
+                    </el-button> -->
                     <el-button v-if="deviceType == '1'" size="small" type="primary" @click="handleImport">
                         离线数据导入
                     </el-button>
@@ -49,7 +49,40 @@
                     :name="item.id"
                     v-for="(item, index) in deviceData.dataSetList"
                     :key="index"
-                ></el-tab-pane>
+                >
+                    <template #label>
+                        <span class="custom-tabs-label">
+                            <el-icon>
+                                <TrendCharts v-if="item.name == 'APF模块数据'" />
+                                <DataLine v-if="item.name == '历史APF模块数据'" />
+                                <DataAnalysis v-if="item.name.includes('趋势数据')" />
+                                <Timer v-if="item.name.includes('实时数据')" />
+                                <Monitor v-if="item.name.includes('暂态事件')" />
+                                <Odometer
+                                    v-if="
+                                        item.name != 'APF模块数据' &&
+                                        item.name != '历史APF模块数据' &&
+                                        !item.name.includes('历史监测') &&
+                                        !item.name.includes('趋势数据') &&
+                                        !item.name.includes('实时数据') &&
+                                        !item.name.includes('暂态事件')
+                                    "
+                                />
+                                <Histogram
+                                    v-if="
+                                        item.name != 'APF模块数据' &&
+                                        item.name != '历史APF模块数据' &&
+                                        item.name.includes('历史监测') &&
+                                        !item.name.includes('趋势数据') &&
+                                        !item.name.includes('实时数据') &&
+                                        !item.name.includes('暂态事件')
+                                    "
+                                />
+                            </el-icon>
+                            <span>{{ item.name }}</span>
+                        </span>
+                    </template>
+                </el-tab-pane>
                 <el-form
                     :inline="true"
                     style="white-space: nowrap; margin-top: 10px"
@@ -264,7 +297,17 @@ import Event from './tabs/event.vue'
 import { useRouter } from 'vue-router'
 import { defineConfig, loadEnv } from 'vite'
 import type { UserConfig, ConfigEnv } from 'vite'
-import { Platform, TrendCharts, DataLine, ArrowLeft } from '@element-plus/icons-vue'
+import {
+    Platform,
+    Histogram,
+    TrendCharts,
+    DataLine,
+    ArrowLeft,
+    DataAnalysis,
+    Odometer,
+    Monitor,
+    Timer
+} from '@element-plus/icons-vue'
 import analysisList from './analysisList/index.vue'
 defineOptions({
     name: 'govern/device/control'
@@ -652,4 +695,12 @@ onMounted(() => {})
     align-items: center;
     justify-content: flex-end;
 }
+.custom-tabs-label {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .el-icon {
+        margin-right: 5px;
+    }
+}
 </style>