✨ feat: 更新监视器

backend/controller/monitor.py

@@ -10,6 +10,7 @@ import jwt
 import json
 import time
 import logging
+from copy import deepcopy
 from app import config
 from model.monitor import session, System, Lvgl, Evm, Image, Device, Request, User
 
@@ -71,7 +72,7 @@ class EvmResource(object):
         result = Evm(**data)
         session.add(result)
         return session.commit()
-        
+
     def put(self):
         pass
 
@@ -237,26 +238,31 @@ class MonitorManager(object):
                 return None
 
         if msg.get("request"):
-            msg.get("request").update({ "watch": watch_id })
-            result = Request(**msg.get("request"))
+            obj = deepcopy(msg.get("request"))
+            obj.update({ "watch": watch_id })
+            result = Request(**obj)
             session.add(result)
             session.flush()
             session.commit()
 
         if msg.get("system"):
-            msg.get("system").update({ "watch": watch_id })
-            systemResource.post(msg.get("system"))
+            obj = deepcopy(msg.get("system"))
+            obj.update({ "watch": watch_id })
+            systemResource.post(obj)
 
         if msg.get("lvgl"):
-            msg.get("lvgl").update({ "watch": watch_id })
-            lvglResource.post(msg.get("lvgl"))
+            obj = deepcopy(msg.get("lvgl"))
+            obj.update({ "watch": watch_id })
+            lvglResource.post(obj)
 
         if msg.get("evm"):
-            msg.get("evm").update({ "watch": watch_id })
-            evmResource.post(msg.get("evm"))
+            obj = deepcopy(msg.get("evm"))
+            obj.update({ "watch": watch_id })
+            evmResource.post(obj)
 
         if msg.get("image"):
-            imageResource.post_array(msg.get("image"), watch_id)
+            obj = deepcopy(msg.get("image"))
+            imageResource.post_array(obj, watch_id)
 
     def check_client(self, instance):
         index = -1
@@ -267,7 +273,6 @@ class MonitorManager(object):
         return index
 
     def receive_message(self, instance, message):
-        print(instance._clients, message)
         if message.get("type") and message.get("token"):
             # 获取token值，检验正确与否，获取uuid
             payload = jwt.decode(message.get("token"), config['SECRET_KEY'], verify=True, algorithms=['HS256'], options={ 'verify_aud': False })
@@ -297,8 +302,6 @@ class MonitorManager(object):
                 return json.dumps({ 'code': 200, 'data': None, 'msg': 'unkonw message packet, disconnect by server' })
 
     def broadcast_message(self, clients, message):
-        print(clients, message)
-
         if not message.get("imei"):
             return False
 

frontend/src/utils/eventBus.js

-/*
- * @Author: your name
- * @Date: 2021-07-01 15:02:16
- * @LastEditTime: 2021-08-07 18:29:02
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \evm-store\frontend\src\utils\eventBus.js
- */
 import Vue from "vue";
 // import store from "@/store";
 
 export let wsNotify = new WebSocket(
-  `ws://${window.location.hostname}:3000/ws/v1/notify`
+  `ws://localhost:3000/ws/v1/notify`
 );
 
 window.wsNotify = wsNotify;
@@ -19,9 +11,9 @@ wsNotify.eventBus = new Vue();
 
 wsNotify.eventBus.$on("reconnect", () => {
   wsNotify = new WebSocket(
-    `ws://${window.location.hostname}:3000/ws/v1/notify`
+    `ws://localhost:3000/ws/v1/notify`
   );
-})
+});
 
 // let timer = null;
 

frontend/src/views/system/bytecode-tool.vue

@@ -18,7 +18,7 @@
             <div class="el-upload__text">
               将文件拖到此处，或<em>点击上传</em>
             </div>
-            <div class="el-upload__tip" slot="tip">请选择evue文件</div>
+            <div class="el-upload__tip" slot="tip">请选择文件（目前支持.js/.evue格式）</div>
           </el-upload>
         </el-form-item>
         <el-form-item>

frontend/src/views/system/components/EvmChart.vue

@@ -9,40 +9,15 @@ import resize from "./mixins/resize";
 import { getDateTimeString } from "@/utils/utils";
 import { wsNotify } from "@/utils/eventBus.js";
 
-// function randomData() {
-//   now = new Date(+now + oneDay);
-//   value = value + Math.random() * 21 - 10;
-//   return {
-//     name: "EVM",
-//     value: [
-//       [now.getFullYear(), now.getMonth() + 1, now.getDate()].join("/") +
-//         " " +
-//         [now.getHours(), now.getMinutes() + 1, now.getSeconds()].join(":"),
-//       Math.round(value),
-//     ],
-//   };
-// }
-
-// const dataList = [];
-// let now = +new Date(1997, 9, 3);
-// const oneDay = 24 * 3600 * 1000;
-// var value = Math.random() * 1000;
-// for (var i = 0; i < 1000; i++) {
-//   dataList.push(randomData());
-// }
-
 let chart = null;
 
 const seriesData = {
   evue_free_size: [],
-  evue_total_size: [],
   evue_used_size: [],
-  ext_total_size: [],
-  ext_used_size: [],
-  heap_total_size: [],
   heap_used_size: [],
-  stack_total_size: [],
-  stack_used_size: []
+  stack_used_size: [],
+  ext_used_size: [],
+  app_size: []
 };
 
 export default {

frontend/src/views/system/components/LvglChart.vue

@@ -4,7 +4,7 @@
 
 <script>
 import * as echarts from "echarts";
-require("echarts/theme/macarons"); // echarts theme
+require("echarts/theme/macarons");
 import resize from "./mixins/resize";
 import { getDateTimeString } from "@/utils/utils";
 import { wsNotify } from "@/utils/eventBus.js";
@@ -44,96 +44,11 @@ export default {
       type: Object,
       required: true,
     },
-    dataList: {
-      type: Array,
-      required: false,
-      default: () => [],
-    },
   },
   data() {
     return {
-      series: [
-        {
-          name: "frag_pct",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            scale: false,
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.frag_pct,
-        },
-        {
-          name: "free_biggest_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.free_biggest_size,
-        },
-        {
-          name: "free_cnt",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.free_cnt,
-        },
-        {
-          name: "free_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.free_size,
-        },
-        {
-          name: "total_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.total_size,
-        },
-        {
-          name: "used_cnt",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.used_cnt,
-        },
-        {
-          name: "used_pct",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.used_pct,
-        },
-      ],
-      legendData: [
-        "frag_pct",
-        "free_biggest_size",
-        "free_cnt",
-        "free_size",
-        "total_size",
-        "used_cnt",
-        "used_pct",
-      ],
+      series: [],
+      legendData: Object.keys(seriesData),
     };
   },
   watch: {
@@ -143,14 +58,23 @@ export default {
         this.handleMessage(val);
       },
     },
-    dataList: {
-      deep: true,
-      handler(val) {
-        if (val.length > 0) this.handleData(val);
-      },
-    },
   },
   mounted() {
+    let array = [];
+    Object.keys(seriesData).forEach((k) => {
+      array.push({
+        name: k,
+        type: "line",
+        showSymbol: false,
+        emphasis: {
+          focus: "series",
+          blurScope: "coordinateSystem",
+        },
+        data: seriesData[k],
+      });
+    });
+    this.series = array;
+
     this.$nextTick(() => {
       this.initChart();
     });

frontend/src/views/system/components/SystemChart.vue

@@ -4,7 +4,7 @@
 
 <script>
 import * as echarts from "echarts";
-require("echarts/theme/macarons"); // echarts theme
+require("echarts/theme/macarons");
 import resize from "./mixins/resize";
 import { getDateTimeString } from "@/utils/utils";
 import { wsNotify } from "@/utils/eventBus.js";
@@ -15,7 +15,7 @@ const seriesData = {
   used_space_size: [],
 };
 
-let chart = null
+let chart = null;
 
 export default {
   mixins: [resize],
@@ -40,47 +40,10 @@ export default {
       type: Object,
       required: true,
     },
-    dataList: {
-      type: Array,
-      required: false,
-      default: () => [],
-    },
   },
   data() {
     return {
-      series: [
-        {
-          name: "free_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            scale: false,
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.free_size,
-        },
-        {
-          name: "free_space_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.free_space_size,
-        },
-        {
-          name: "used_space_size",
-          type: "line",
-          showSymbol: false,
-          emphasis: {
-            focus: "series",
-            blurScope: "coordinateSystem",
-          },
-          data: seriesData.used_space_size,
-        },
-      ],
+      series: [],
       legendData: Object.keys(seriesData),
     };
   },
@@ -91,14 +54,23 @@ export default {
         this.handleMessage(val);
       },
     },
-    dataList: {
-      deep: true,
-      handler(val) {
-        if (val.length > 0) this.handleData(val);
-      },
-    },
   },
   mounted() {
+    let array = [];
+    Object.keys(seriesData).forEach((k) => {
+      array.push({
+        name: k,
+        type: "line",
+        showSymbol: false,
+        emphasis: {
+          focus: "series",
+          blurScope: "coordinateSystem",
+        },
+        data: seriesData[k],
+      });
+    });
+    this.series = array;
+
     this.$nextTick(() => {
       this.initChart();
     });
@@ -113,13 +85,13 @@ export default {
     });
 
     wsNotify.eventBus.$on("resize", () => {
-      if (chart) chart.resize()
+      if (chart) chart.resize();
     });
 
     wsNotify.eventBus.$on("clear-system-chart", () => {
-      chart.clear()
-      this.setOptions()
-    })
+      chart.clear();
+      this.setOptions();
+    });
   },
   beforeDestroy() {
     if (!chart) {
@@ -130,11 +102,11 @@ export default {
   },
   methods: {
     handleData(data) {
-      Object.keys(seriesData).forEach(key => {
-        seriesData[key] = []
+      Object.keys(seriesData).forEach((key) => {
+        seriesData[key] = [];
       });
-      this.series.forEach(item => {
-        item.data = []
+      this.series.forEach((item) => {
+        item.data = [];
       });
       // chart.dispose();
       chart.setOption({ series: this.series });
@@ -180,9 +152,7 @@ export default {
         },
         xAxis: {
           type: "time",
-          splitLine: {
-
-          },
+          splitLine: {},
           axisLabel: {
             formatter: "{HH}:{mm}:{ss}",
           },
@@ -190,9 +160,7 @@ export default {
         yAxis: {
           type: "value",
           // boundaryGap: [0, "100%"],
-          splitLine: {
-
-          },
+          splitLine: {},
         },
         tooltip: {
           trigger: "axis",
@@ -207,7 +175,7 @@ export default {
           selected: {
             free_size: true,
             free_space_size: true,
-            used_space_size: false
+            used_space_size: false,
           },
         },
         series: this.series,