v1.2版

2025-11-11 14:06:13 +08:00
parent ee295230ac
commit 54ab4046f6
387 changed files with 46032 additions and 0 deletions
@@ -0,0 +1,126 @@
+<template>
+  <div style="padding: 8px 20px 20px;">
+    <el-collapse v-model="activeNames">
+      <el-collapse-item v-for="(val,index) of linuxSystem" :title="val.title" :name="index">
+        <div class="mt10 w100">
+<!--          <Form :formList="val.formList" :ruleFormData="val.formModel" :config="val.config" @fnClick="callback"></Form>-->
+          <div class="w100 plr-20" style="font-size: 14px">
+            <div v-for="item of val.formList" class="w50 disInlineBlock p10">
+              <span class="w50 disInlineBlock">{{item.name}}</span><span class="w50">{{item.value}}</span>
+            </div>
+          </div>
+          <div v-for="item of val.echartList" class="w100 mt20 mb20" style="height: 200px;border-top: 1px solid #d8dce5">
+            <EchartsLine class="w100 h100" :sideIcon="{iconName: [{name: '添加到首页',type: 'add'}]}" :lineData="item.dataVal" :title="item.title" :chartData="(valData) => chartDataEvent(valData, item)"></EchartsLine>
+          </div>
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+  </div>
+</template>
+
+<script setup>
+  import EchartsLine from "@/components/echartsList/line.vue";
+  export default {
+    name: 'ResMonitorDigitalAutoFind',
+    components: {EchartsLine},
+    data() {
+      return {
+        activeNames: [0, 1],
+        linuxSystem: [],
+      }
+    },
+    created() {
+      // this.$nextTick(() => {
+        this.secondList();
+      // });
+    },
+    methods: {
+      // 第二节点 自动发现项
+      secondList(){
+        this.linuxSystem = [{
+          title: '网络端口GE1/0/1',
+          formList: [
+            {name: '端口名称', value: 'aaa'},
+            {name: '端口类型', value: 'aaa'},
+            {name: '端口状态', value: 'aaa'},
+            {name: '端口适配速率(Mbps)', value: 'aaa'},
+          ],
+          formModel: {},
+          config: {labelWidth: '160px', buttonGroup: []},
+          echartList: [{
+            title: '设备CPU使用率(%)',
+            dataVal: {
+              titleVal: {textAlign: 'left', left: '1%'},
+              gridTop: '35%',
+              legend: {top: '15%', left: '10%'},
+              lineXData: ['2025-9-1', '2025-9-2', '2025-9-3', '2025-9-4', '2025-9-5', '2025-9-6', '2025-9-7'],
+              dataList: [{
+                name: '设备CPU使用率',
+                data: [120, 132, 101, 134, 90, 230, 210],
+              }]
+            }
+          },{
+            title: '设备内存使用率(%)',
+            dataVal: {
+              titleVal: {textAlign: 'left', left: '1%'},
+              gridTop: '35%',
+              legend: {top: '15%', left: '10%'},
+              lineXData: ['2025-9-1', '2025-9-2', '2025-9-3', '2025-9-4', '2025-9-5', '2025-9-6', '2025-9-7'],
+              dataList: [{
+                name: '设备内存使用率',
+                data: [120, 132, 101, 134, 90, 230, 210],
+              },{
+                name: 'CPU运行用户进程所花费的时间',
+                data: [220, 182, 191, 234, 290, 330, 310]
+              }]
+            }
+          }]
+        },{
+          title: '光模块sabc',
+          formList: [{name: '光模块端口名称', value: 'aaa'}],
+          formModel: {},
+          config: {buttonGroup: []},
+          echartList: [{
+            title: '设备CPU使用率(%)',
+            dataVal: {
+              titleVal: {textAlign: 'left', left: '1%'},
+              gridTop: '35%',
+              legend: {top: '15%', left: '10%'},
+              lineXData: ['2025-9-1', '2025-9-2', '2025-9-3', '2025-9-4', '2025-9-5', '2025-9-6', '2025-9-7'],
+              dataList: [{
+                name: '设备CPU使用率',
+                data: [120, 132, 101, 134, 90, 230, 210],
+              }]
+            }
+          },{
+            title: '设备内存使用率(%)',
+            dataVal: {
+              titleVal: {textAlign: 'left', left: '1%'},
+              gridTop: '35%',
+              legend: {top: '15%', left: '10%'},
+              lineXData: ['2025-9-1', '2025-9-2', '2025-9-3', '2025-9-4', '2025-9-5', '2025-9-6', '2025-9-7'],
+              dataList: [{
+                name: '设备内存使用率',
+                data: [120, 132, 101, 134, 90, 230, 210],
+              },{
+                name: 'CPU运行用户进程所花费的时间',
+                data: [220, 182, 191, 234, 290, 330, 310]
+              }]
+            }
+          }]
+        }];
+      },
+      chartDataEvent(val, itemVal) {
+        console.log('val===',val);
+      }
+    }
+  }
+</script>
+<style scoped>
+  ::v-deep .el-collapse-item__header {
+    background-color: #d4e3fc!important;
+    /*color: #fff!important;*/
+    padding-left: 20px;
+    font-size: 1rem;
+  }
+</style>