Merge branch 'master' of http://94.191.59.107:3000/wukai/jy2024-ui

src/views/alarm/record/bizAccess.vue

@@ -23,21 +23,21 @@
       </el-form-item>
     </el-form>
     <el-row>
-      <el-col :span="12">
+      <el-col :span="15">
         <div ref="chartAccess" style="height: 600px;"></div>
       </el-col>
-      <el-col :span="12">
+      <el-col :span="9">
         <template #header>
           <Tickets style="width: 1em; height: 1em; vertical-align: middle;"/>
           <span style="vertical-align: middle;">{{ title }}</span></template>
         <el-table v-loading="loading" :data="leftList" v-show="sl" border style="height:300px;overflow-y: auto;">
-          <el-table-column label="序号" align="center" width="80">
+          <el-table-column label="序号" align="center" width="60">
             <template #default="scope">
               <span>{{ scope.$index + 1 }}</span>
             </template>
           </el-table-column>
-          <el-table-column label="组件名称" align="left" prop="modelName"/>
-          <el-table-column label="应用编码" align="left" prop="code" width="300">
+          <el-table-column label="组件名称" align="left" prop="modelName" width="150"/>
+          <el-table-column label="应用编码" align="left" prop="code" width="150">
             <template #default="scope">
               <el-button link type="primary" @click="jumpPP(scope.row)">{{ scope.row.code }}</el-button>
             </template>
@@ -191,14 +191,30 @@ function initChart(res) {
   let datas = [];
   let legendData1 = [];
   let legendData2 = [];
+  let legendData3 = [];
+  let legendData4 = [];
+  let legendData5 = [];
+  let dataheng = [];
+
   let xMax1 = 50;
-  let xMax2 = 50;
+  let xMax2 = 1;
+  let xMax3 = 10000;
+  let xMax4 = 10000;
+  let xMax5 = 10000;
 
   for (let i in res.data) {
     let obj = res.data[i];
     datas.push(obj.modelName);
+    //访问次数
     legendData1.push({id: obj.modelId, value: obj.access});
+    //访问错误
     legendData2.push({id: obj.modelId, value: obj.num});
+    //告警
+    legendData3.push({id: obj.modelId, value: obj.n1});
+    //服务数量
+    legendData4.push({id: obj.modelId, value: obj.n2});
+    //容器数量
+    legendData5.push({id: obj.modelId, value: obj.n3});
     if (i == 0) {
       dl(obj.modelId, obj.modelName);
     }
@@ -208,8 +224,20 @@ function initChart(res) {
     if (obj.num > xMax2) {
       xMax2 = obj.num;
     }
+    if (obj.n1 > xMax3) {
+      xMax3 = obj.n1;
+    }
+    if (obj.n2 > xMax4) {
+      xMax4 = obj.n2;
+    }
+    if (obj.n3 > xMax5) {
+      xMax5 = obj.n3;
+    }
+  }
+  for (let i in res.data) {
+    dataheng.push(xMax1 + 2);
   }
-  let dataheng = [xMax1 + 2, xMax1 + 2, xMax1 + 2, xMax1 + 2, xMax1 + 2];
+  // let dataheng = [xMax1 + 2, xMax1 + 2, xMax1 + 2, xMax1 + 2, xMax1 + 2, xMax1 + 2];
   let option = {
     backgroundColor: '#fff',
     tooltip: {
@@ -226,22 +254,50 @@ function initChart(res) {
     grid: [{
       show: false,
       left: '0',
-      top: 0,
+      top: 30,
       bottom: 22,
-      width: '15%',
+      width: '14%',
     },
       {
         containLabel: true,
-        top: 0,
+        top: 30,
         left: '20%',
         bottom: '0%',
-        width: '40%',
+        width: '30%',
         show: false
       },
       {
-        left: '64%',
+        left: '52%',
         right: '10%',
-        top: 0,
+        top: 30,
+        bottom: '0%',
+        width: '10%',
+        containLabel: true,
+        show: false
+      },
+      {
+        left: '70%',
+        // right: '2%',
+        top: 30,
+        bottom: '0%',
+        width: '10%',
+        containLabel: true,
+        show: false
+      },
+      {
+        left: '80%',
+        // right: '2%',
+        width: '10%',
+        top: 30,
+        bottom: '0%',
+        containLabel: true,
+        show: false
+      },
+      {
+        left: '90%',
+        // right: '2%',
+        width: '10%',
+        top: 30,
         bottom: '0%',
         containLabel: true,
         show: false
@@ -257,11 +313,25 @@ function initChart(res) {
         max: xMax1,
       },
       {
-
         gridIndex: 2,
         show: false,
         max: xMax2,
       },
+      {
+        gridIndex: 3,
+        show: false,
+        max: xMax3,
+      },
+      {
+        gridIndex: 4,
+        show: false,
+        max: xMax4,
+      },
+      {
+        gridIndex: 5,
+        show: false,
+        max: xMax5,
+      },
     ],
     yAxis: [{
       gridIndex: 0,
@@ -379,6 +449,69 @@ function initChart(res) {
           },
         },
       },
+      {
+        gridIndex: 3,
+        inverse: true,
+        data: datas,
+        //   max:10,
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          show: false,
+        },
+        axisPointer: {
+          label: {
+            show: false,
+            margin: 30,
+          },
+        },
+      },
+      {
+        gridIndex: 4,
+        inverse: true,
+        data: datas,
+        //   max:10,
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          show: false,
+        },
+        axisPointer: {
+          label: {
+            show: false,
+            margin: 30,
+          },
+        },
+      },
+      {
+        gridIndex: 5,
+        inverse: true,
+        data: datas,
+        //   max:10,
+        axisLine: {
+          show: false,
+        },
+        axisTick: {
+          show: false,
+        },
+        axisLabel: {
+          show: false,
+        },
+        axisPointer: {
+          label: {
+            show: false,
+            margin: 30,
+          },
+        },
+      },
     ],
     series: [{
       type: 'bar',
@@ -425,7 +558,7 @@ function initChart(res) {
         symbol: 'image://' + img,
         symbolPosition: 'end',
         barWidth: "20",
-        z: 12,
+        z: 999,
         color: '#fe5959',
         data: dataheng,
         tooltip: {
@@ -437,9 +570,9 @@ function initChart(res) {
         xAxisIndex: 2,
         yAxisIndex: 2,
         type: 'bar',
-        name: '告警数量（次）',
+        name: '访问错误（次）',
         stack: '3',
-        barWidth: 30,
+        barWidth: 20,
         barCategoryGap: 15,
         // barGap:i==1?'-100%':'0',
         itemStyle: {
@@ -452,7 +585,7 @@ function initChart(res) {
         // 数字
         label: {
           normal: {
-            color: '#000',
+            color: '#FFB25C',
             show: true,
             position: 'right',
             distance: 4,
@@ -464,17 +597,123 @@ function initChart(res) {
         },
         data: legendData2,
       },
+
+      //右边的柱状图
+      {
+        xAxisIndex: 3,
+        yAxisIndex: 3,
+        type: 'bar',
+        name: '告警（次）',
+        barWidth: 1,
+        barCategoryGap: 15,
+        // barGap:i==1?'-100%':'0',
+        itemStyle: {
+          color: '#333333',
+          barBorderRadius: [0, 20, 20, 0],
+          emphasis: {
+            color: '#333333',
+          },
+        },
+        // 数字
+        label: {
+          normal: {
+            color: '#333333',
+            show: true,
+            position: 'right',
+            distance: 4,
+            textStyle: {
+              fontSize: 16,
+            },
+            formatter: '{c}',
+          },
+        },
+        data: legendData3,
+      },
+
+      //右边的柱状图
+      {
+        xAxisIndex: 4,
+        yAxisIndex: 4,
+        type: 'bar',
+        name: '服务数量（个）',
+        barWidth: 1,
+        barCategoryGap: 15,
+        // barGap:i==1?'-100%':'0',
+        itemStyle: {
+          color: '#555555',
+          barBorderRadius: [0, 20, 20, 0],
+          emphasis: {
+            color: '#555555',
+          },
+        },
+        // 数字
+        label: {
+          normal: {
+            color: '#555555',
+            show: true,
+            position: 'right',
+            distance: 4,
+            textStyle: {
+              fontSize: 16,
+            },
+            formatter: '{c}',
+          },
+        },
+        data: legendData4,
+      },
+
+      //右边的柱状图
+      {
+        xAxisIndex: 5,
+        yAxisIndex: 5,
+        type: 'bar',
+        name: '容器数量（个）',
+        barWidth: 1,
+        barCategoryGap: 15,
+        // barGap:i==1?'-100%':'0',
+        itemStyle: {
+          color: '#888888',
+          barBorderRadius: [0, 20, 20, 0],
+          emphasis: {
+            color: '#888888',
+          },
+        },
+        // 数字
+        label: {
+          normal: {
+            color: '#888888',
+            show: true,
+            position: 'right',
+            distance: 4,
+            textStyle: {
+              fontSize: 16,
+            },
+            formatter: '{c}',
+          },
+        },
+        data: legendData5,
+      },
     ],
   };
   // 3.配置项和数据给实例化对象
   myChart.setOption(option);
   myChart.on("click", function (param) {
-    if (param.seriesIndex == 0) {
-      dl(param.data.id, param.name);
-    } else {
-      dr(param.data.id, param.name);
+    switch (param.seriesIndex) {
+      case 0:
+      case 1:
+      case 2:
+        dl(param.data.id, param.name);
+        break;
+      case 3:
+        dr(param.data.id, param.name);
+        break;
     }
-    console.log(param);
+    // if (param.seriesIndex == 0) {
+    //   dl(param.data.id, param.name);
+    // } else {
+    //   dr(param.data.id, param.name);
+    // }
+    // console.log(param);
     // console.error(param,param.data.id,param.data.value,param.name);
     // let url = '/zabbix/zabbix.php?action=map.view&sysmapid=2&kiosk=1&line';
   });

src/views/push/pushRecord/mail.vue

@@ -108,11 +108,6 @@
     <el-table v-loading="loading" :data="pushRecordList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="记录ID" align="center" prop="prId" />
-      <el-table-column label="推送类型" align="center" prop="pushType">
-        <template #default="scope">
-          <dict-tag :options="push_type" :value="scope.row.pushType"/>
-        </template>
-      </el-table-column>
       <el-table-column label="告警级别" align="center" prop="alarmLevel">
         <template #default="scope">
           <dict-tag :options="alarm_level" :value="scope.row.alarmLevel"/>

src/views/push/pushRecord/sms.vue

@@ -108,11 +108,6 @@
     <el-table v-loading="loading" :data="pushRecordList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="记录ID" align="center" prop="prId" />
-      <el-table-column label="推送类型" align="center" prop="pushType">
-        <template #default="scope">
-          <dict-tag :options="push_type" :value="scope.row.pushType"/>
-        </template>
-      </el-table-column>
       <el-table-column label="告警级别" align="center" prop="alarmLevel">
         <template #default="scope">
           <dict-tag :options="alarm_level" :value="scope.row.alarmLevel"/>