From eb394d11e8f14e87acd705dc9507de388bc2add1 Mon Sep 17 00:00:00 2001
From: orgin <feixingyuanup@gmail.com>
Date: Wed, 27 Dec 2023 17:19:40 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=95=B0=E6=8D=AE=E5=BA=93?=
 =?UTF-8?q?=E7=9B=91=E6=8E=A7=E9=A1=B5=E9=9D=A2=E6=9B=B2=E7=BA=BF=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../databaseMonitor/instances/areaChart.vue   |   67 +-
 .../databaseMonitor/instances/monitor.vue     | 1267 ++++++++++++++++-
 2 files changed, 1280 insertions(+), 54 deletions(-)

diff --git a/src/views/abnormalAlarm/databaseMonitor/instances/areaChart.vue b/src/views/abnormalAlarm/databaseMonitor/instances/areaChart.vue
index 8e24d85..e84e498 100644
--- a/src/views/abnormalAlarm/databaseMonitor/instances/areaChart.vue
+++ b/src/views/abnormalAlarm/databaseMonitor/instances/areaChart.vue
@@ -8,8 +8,9 @@
 <script>
 import * as echarts from 'echarts'
 import BoxTitle from '../../components/boxTitle.vue';
+import moment from 'moment'
 export default {
-  props: ["title", "layout", "color", "dataSource"],
+  props: ["title", "layout", "color", "dataSource", "units", "newUnits"],
   components: {
     BoxTitle,
   },
@@ -28,11 +29,26 @@ export default {
   },
   methods: {
     drawChart() {
+      let seriesData = this.dataSource.map(function(item) {
+        return [item.date, item.value];
+      })
+      seriesData.forEach(function(item) {
+          item.date = new Date(item.date * 1000); // 将时间戳转换为日期对象
+      });
+      const isCompute = this.units === 'B' || this.units === 'Kb'
       let myLine = echarts.init(document.getElementById(`${this.layout}`))
       this.option = {
         color: this.color,
         tooltip: {
-          trigger: 'axis'
+          trigger: 'axis',
+          title: this.title,
+          formatter: (text) => {
+            let num = text.value
+            if(isCompute){
+              num = text.value + this.newUnits
+            }
+            return { name: moment(text.date * 1000).format('HH:mm'), value: num}
+          },
         },
         grid: {
           left: 0,
@@ -42,7 +58,8 @@ export default {
           containLabel: true
         },
         xAxis: {
-          type: 'category',
+          type: 'time',
+          // type: 'category',
           axisTick: {
             show:false
           },
@@ -53,21 +70,24 @@ export default {
           },
           axisLabel: {
             color: "rgba(173, 230, 238, 1)",
-            formatter: (value,index)=>{
-              if(index === 0) {
-                return '        ' + value;
-              }
-              if(index === this.xData.length -1) {
-                return value + '        ';
-              }
-              return value
-            }
+            // formatter: (value,index)=>{
+            //   if(index === 0) {
+            //     return '        ' + value;
+            //   }
+            //   if(index === this.xData.length -1) {
+            //     return value + '        ';
+            //   }
+            //   return value
+            // }
           },
           boundaryGap: false,
-          data: this.xData
+          // data: this.xData
         },
         yAxis: {
           type: 'value',
+          title:{
+            text: isCompute ? "unit:" + this.newUnits : null,
+          },
           splitLine: {
             show: true,
             lineStyle: {
@@ -86,19 +106,20 @@ export default {
         },
         series: [
           {
+            name: 'login',
             type: 'line',
-            symbol: 'none',
+            // symbol: 'none',
             lineStyle: {
-              width: 0.8
+              width: 8
             },
-            areaStyle: {
-              opacity: 1,
-              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: this.color[0] },
-                { offset: 1, color:  this.color[1] },
-              ])
-            },
-            data: this.dataSource
+            // areaStyle: {
+            //   opacity: 1,
+            //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+            //     { offset: 0, color: this.color[0] },
+            //     { offset: 1, color:  this.color[1] },
+            //   ])
+            // },   
+            data: seriesData
           }
         ]
       };
diff --git a/src/views/abnormalAlarm/databaseMonitor/instances/monitor.vue b/src/views/abnormalAlarm/databaseMonitor/instances/monitor.vue
index 97bed6c..dbee0a2 100644
--- a/src/views/abnormalAlarm/databaseMonitor/instances/monitor.vue
+++ b/src/views/abnormalAlarm/databaseMonitor/instances/monitor.vue
@@ -6,10 +6,12 @@
         <a-col :span="12" style="height: 240px" v-for="(el,i) in chartData" :key="i">
           <div class="monitor-content-item">
             <AreaChart
-              :title="el.title"
+              :title="el.name"
               :layout="`area${i}`"
               :color="el.color"
-              :dataSource="el.data"
+              :dataSource="el.list"
+              :newUnits="el.newUnits"
+              :units="el.units"
             > 
             </AreaChart>
           </div>
@@ -66,34 +68,34 @@ export default {
   data() {
     return {
       data:[5, 23, 12, 48, 15, 27, 56],
-      chartData: [
-        {
-          title: "Database memory state(Total memory)",
-          color:["rgba(38, 180, 246,1)","rgba(38, 180, 246,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        },{
-          title: "Database user status(Logins per second)",
-          color:["rgba(214, 238, 80,1)","rgba(214, 238, 80,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        },{
-          title: "Database connection number",
-          color:["#ec8929"],
-          color:["rgba(236, 137, 41,1)","rgba(236, 137, 41,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        },{
-          title: "Database connection response time",
-          color:["rgba(84, 95, 213,1)","rgba(84, 95, 213,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        },{
-          title: "Remaining space of the databasce log file",
-          color:["rgba(1, 238, 206,1)","rgba(1, 238, 206,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        },{
-          title: "Database file size",
-          color:["rgba(237, 190, 61,1)","rgba(237, 190, 61,0.2)"],
-          data:[5, 23, 12, 48, 15, 27, 56]
-        }
-      ],
+      // chartData: [
+      //   {
+      //     title: "Database memory state(Total memory)",
+      //     color:["rgba(38, 180, 246,1)","rgba(38, 180, 246,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   },{
+      //     title: "Database user status(Logins per second)",
+      //     color:["rgba(214, 238, 80,1)","rgba(214, 238, 80,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   },{
+      //     title: "Database connection number",
+      //     color:["#ec8929"],
+      //     color:["rgba(236, 137, 41,1)","rgba(236, 137, 41,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   },{
+      //     title: "Database connection response time",
+      //     color:["rgba(84, 95, 213,1)","rgba(84, 95, 213,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   },{
+      //     title: "Remaining space of the databasce log file",
+      //     color:["rgba(1, 238, 206,1)","rgba(1, 238, 206,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   },{
+      //     title: "Database file size",
+      //     color:["rgba(237, 190, 61,1)","rgba(237, 190, 61,0.2)"],
+      //     data:[5, 23, 12, 48, 15, 27, 56]
+      //   }
+      // ],
       mailData: [
         {
           legends: [
@@ -270,12 +272,1215 @@ export default {
             },
           ]
         },
-      ]
+      ],
+      chartData:[
+        {
+            "min": 781136.00,
+            "avg": 789461.20,
+            "max": 815648.00,
+            "now": 781232.00,
+            "name": "dbMemory",
+            "units": "Kb",
+            "list": [
+                {
+                    "name": "dbMemory",
+                    "date": 1703634395,
+                    "value": 781232.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634455,
+                    "value": 781332.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634515,
+                    "value": 781172.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634575,
+                    "value": 781428.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634635,
+                    "value": 781348.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634695,
+                    "value": 781404.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634755,
+                    "value": 781376.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634815,
+                    "value": 781248.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634875,
+                    "value": 781136.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634935,
+                    "value": 781376.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703634995,
+                    "value": 781268.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635055,
+                    "value": 781540.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635115,
+                    "value": 781536.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635175,
+                    "value": 781464.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635235,
+                    "value": 781860.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635295,
+                    "value": 782124.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635355,
+                    "value": 782316.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635415,
+                    "value": 782204.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635475,
+                    "value": 782216.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635535,
+                    "value": 782344.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635595,
+                    "value": 782100.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635655,
+                    "value": 782712.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635715,
+                    "value": 782368.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635775,
+                    "value": 782512.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635835,
+                    "value": 782588.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635895,
+                    "value": 782716.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703635955,
+                    "value": 782764.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636015,
+                    "value": 782892.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636075,
+                    "value": 782868.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636135,
+                    "value": 782616.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636195,
+                    "value": 782616.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636255,
+                    "value": 782624.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636315,
+                    "value": 782820.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636375,
+                    "value": 783008.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636435,
+                    "value": 800112.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636513,
+                    "value": 797056.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636555,
+                    "value": 797572.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636615,
+                    "value": 797828.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636675,
+                    "value": 797828.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636735,
+                    "value": 797884.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636795,
+                    "value": 798440.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636855,
+                    "value": 798200.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636915,
+                    "value": 798200.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703636975,
+                    "value": 798176.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637035,
+                    "value": 798364.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637095,
+                    "value": 798348.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637155,
+                    "value": 798604.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637215,
+                    "value": 798664.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637275,
+                    "value": 798920.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637335,
+                    "value": 798792.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637395,
+                    "value": 815648.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637455,
+                    "value": 799016.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637515,
+                    "value": 798848.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637575,
+                    "value": 798736.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637635,
+                    "value": 798784.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637695,
+                    "value": 798912.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637755,
+                    "value": 799004.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637815,
+                    "value": 798724.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637875,
+                    "value": 799040.0
+                },
+                {
+                    "name": "dbMemory",
+                    "date": 1703637935,
+                    "value": 798844.0
+                }
+            ],
+            "title": "数据库内存状态(总内存)"
+        },
+        {
+            "min": 1.00,
+            "avg": 1.13,
+            "max": 2.00,
+            "now": 1.00,
+            "name": "login",
+            "units": "",
+            "list": [
+                {
+                    "name": "login",
+                    "date": 1703634391,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634451,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634511,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634571,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634631,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634691,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634751,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634811,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634871,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634932,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703634991,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635051,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635111,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635171,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635231,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635291,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635351,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635411,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635471,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635531,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635591,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635651,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635711,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635771,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635831,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635891,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703635951,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636011,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636071,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636131,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636191,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636251,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636311,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636371,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636431,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636491,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636551,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636611,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636671,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636731,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636791,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636851,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636911,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703636971,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637031,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637091,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637151,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637211,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637271,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637331,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637391,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637451,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637511,
+                    "value": 2.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637571,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637631,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637691,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637751,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637811,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637871,
+                    "value": 1.0
+                },
+                {
+                    "name": "login",
+                    "date": 1703637931,
+                    "value": 1.0
+                }
+            ],
+            "title": "数据库用户状况(每秒登录数)"
+        },
+        {
+            "min": 30.00,
+            "avg": 30.50,
+            "max": 33.00,
+            "now": 30.00,
+            "name": "connections",
+            "units": "",
+            "list": [
+                {
+                    "name": "connections",
+                    "date": 1703634388,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634448,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634508,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634568,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634628,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634688,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634748,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634808,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634868,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634928,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703634988,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635048,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635108,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635168,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635228,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635288,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635348,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635408,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635468,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635528,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635588,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635648,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635708,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635768,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635829,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635888,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703635948,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636008,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636068,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636128,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636188,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636248,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636308,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636368,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636428,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636488,
+                    "value": 30.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636548,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636608,
+                    "value": 33.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636668,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636728,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636788,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636848,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636908,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703636968,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637028,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637088,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637148,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637208,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637268,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637328,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637388,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637448,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637508,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637568,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637628,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637688,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637748,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637808,
+                    "value": 32.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637868,
+                    "value": 31.0
+                },
+                {
+                    "name": "connections",
+                    "date": 1703637928,
+                    "value": 31.0
+                }
+            ],
+            "title": "数据库连接数"
+        },
+        {
+            "min": 0.00,
+            "avg": 0.00,
+            "max": 0.00,
+            "now": 0.00,
+            "name": "latency",
+            "units": "s",
+            "list": [
+                {
+                    "name": "latency",
+                    "date": 1703634389,
+                    "value": 7.08E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634449,
+                    "value": 6.51E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634509,
+                    "value": 6.94E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634569,
+                    "value": 7.430000000000001E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634629,
+                    "value": 6.65E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634689,
+                    "value": 6.51E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634749,
+                    "value": 4.4E-4
+                },
+                {
+                    "name": "latency",
+                    "date": 1703634809,
+                    "value": 7.46E-4
+                },
+                
+            ],
+            "title": "数据库连接响应时间"
+        },
+        {
+            "min": 1006632960.00,
+            "avg": 1006632960.00,
+            "max": 1006632960.00,
+            "now": 1006632960.00,
+            "name": "logRemainingSize",
+            "units": "B",
+            "list": [
+                {
+                    "name": "logRemainingSize",
+                    "date": 1703634394,
+                    "value": 1.00663296E9
+                },
+                {
+                    "name": "logRemainingSize",
+                    "date": 1703634454,
+                    "value": 1.00663296E9
+                },
+                {
+                    "name": "logRemainingSize",
+                    "date": 1703634514,
+                    "value": 1.00663296E9
+                },
+                {
+                    "name": "logRemainingSize",
+                    "date": 1703634574,
+                    "value": 1.00663296E9
+                },
+                
+            ],
+            "title": "数据库日志文件剩余空间"
+        },
+        {
+            "min": 150313619.00,
+            "avg": 150519784.33,
+            "max": 150731411.00,
+            "now": 150313619.00,
+            "name": "dblSize",
+            "units": "B",
+            "list": [
+                {
+                    "name": "dblSize",
+                    "date": 1703634390,
+                    "value": 1.50313619E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634451,
+                    "value": 1.50321811E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634510,
+                    "value": 1.50321811E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634570,
+                    "value": 1.50321811E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634630,
+                    "value": 1.50330003E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634690,
+                    "value": 1.50346387E8
+                },
+                {
+                    "name": "dblSize",
+                    "date": 1703634750,
+                    "value": 1.50346387E8
+                },
+                
+            ],
+            "title": "数据库数据文件大小"
+        }
+    ]
     }
   },
+  computed: {
+    unitConversion(){
+      return function(number,units){
+        if( units === 'Kb') {
+         number =  number *1024
+        }
+        if (number < 1024 ) return "B"
+        number = number / 1024
+        if (number < 1024) return "KB"
+        number = number / 1024
+        if (number < 1024) return "MB"
+        number = number / 1024
+        console.log('TB',number)
+        if (number < 1024) return 'GB'
+        number = number / 1024
+        if (number < 1024) return 'TB'
+        number = number / 1024
+        if (number < 1024) return 'PB'
+        number = number / 1024
+        if (number < 1024) return 'EB'
+      }
+    },
+    dataConversion(){
+      return function(number,units){
+        const obj = {
+          KB: 1024,
+          MB: Math.pow(1024,2),
+          GB: Math.pow(1024,3),
+          TB: Math.pow(1024,4),
+          PB: Math.pow(1024,5),
+          EB: Math.pow(1024,6),
+        }
+        // console.log(obj[units],number / obj[units])
+        return (number / obj[units]).toFixed(2)
+      }
+    }
+    },
   mounted () {
+    // 聂子炎的接口好了之后 就用这个请求接口，换一下接口地址
+    // const params = {
+      // hostId: '10488',
+      // hostId: this.$route.params.id,
+      // end: moment().format('YYYY-MM-DD HH:mm:ss'),
+      // start: moment().subtract('hour', +1).format('YYYY-MM-DD HH:mm:ss'),
+    // }
+    // this.text = this.$route.query.name
+    // getAction('/omms/monitor/db/item/detail', params).then((res) => {
+    //   this.list = res.result
+    //   this.list.map(item=>{
+    //     if(item.units === 'B' || item.units === 'Kb'){
+    //      item.newUnits = this.unitConversion(item.min,item.units)
+    //       item.list.map(val =>{
+    //         let number = val.value
+    //         if(item.units ==="Kb"){
+    //           number = val.value *1024
+    //         }
+    //           val.value = Number(this.dataConversion(number,item.newUnits))
+    //       })
+    //       console.log(item)
+    //     }
+    //   })
+    // 这个不需要
+    //   this.$nextTick(() => {
+    //     this.generateChart()
+    //   })
+    // })
+    // 聂子炎的接口好了之后，这些就可删掉了
+    this.chartData.map(item=>{
+        if(item.units === 'B' || item.units === 'Kb'){
+         item.newUnits = this.unitConversion(item.min,item.units)
+          item.list.map(val =>{
+            let number = val.value
+            if(item.units ==="Kb"){
+              number = val.value *1024
+            }
+              val.value = Number(this.dataConversion(number,item.newUnits))
+          })
+          console.log(item)
+        }
+      })
   },
   methods: {
+    //生成图表（运管系统代码）
+    generateChart() {
+      this.list.map((item,index) => {
+        let color = '#49A8F0'
+        switch (index) {
+          case 1:
+            color = '#A364F2'
+            break
+          case 2:
+            color = '#A364F2'
+            break
+          case 3:
+            color = '#FF8A00'
+            break
+          case 4:
+            color = '#FF8A00'
+            break
+        }
+        const isCompute = item.units === 'B' || item.units === 'Kb'
+        this.echartObj[item.name] = new Area('echart_db_' + index, {
+          data: item.list,
+          xField: 'date',
+          yField: 'value',
+          appendPadding: 10,
+          xAxis: {
+            label: {
+              formatter: (text) => {
+                return moment(text * 1000).format('HH:mm')
+              },
+            },
+          },
+          yAxis:{
+            title:{
+              text:isCompute?"单位:"+item.newUnits:null,
+            }          
+          },
+          
+          color: color,
+          // seriesField: 'name',
+          areaStyle: () => {
+            return {
+              fill: 'l(270) 0:#ffffff  1:' + color,
+            }
+          },
+          tooltip: {
+            title: item.title,
+            formatter: (text) => {
+              let num = text.value
+              if(isCompute){
+                num = text.value + item.newUnits
+              }
+              return { name: moment(text.date * 1000).format('HH:mm'), value: num}
+            },
+          },
+        })
+        this.echartObj[item.name].render()
+      })
+    },
   },
 }
 </script>