Skip to content

E
evm-store
Commit 9f9b222a authored by wanli's avatar wanli
Browse files
Options

🐞 fix(): 解决资源监视器若干问题 

一、解决用户先于设备登录，设备发送消息用户无法接收问题；二、解决用户切换页面再回到资源监视页面，无法接收数据问题；三、解决重新进入页面数据被污染问题；
parent 8bd856c3
Show whitespace changes
Inline Side-by-side
Showing with 169 additions and 94 deletions
backend/view/monitor.py
View file @ 9f9b222a
''' '''
Author: your name Author: your name
Date: 2021-06-29 19:33:41 Date: 2021-06-29 19:33:41
LastEditTime: 2021-07-24 09:49:30 LastEditTime: 2021-07-25 17:18:11
LastEditors: Please set LastEditors LastEditors: Please set LastEditors
Description: In User Settings Edit Description: In User Settings Edit
FilePath: \evm-store\backend\view\monitor.py FilePath: \evm-store\backend\view\monitor.py
...@@ -177,7 +177,7 @@ class NotifyHandler(BaseWebsocket): ...@@ -177,7 +177,7 @@ class NotifyHandler(BaseWebsocket):
self.write_message(json.dumps({ "code": 400, "data": None, "msg": "token can not be null" })) self.write_message(json.dumps({ "code": 400, "data": None, "msg": "token can not be null" }))
return return
user = session.query(User).filter(User.id == payload.get("data").get("id")).all() user = session.query(User).filter(User.id == payload.get("data").get("id")).one_or_none()
if not user: if not user:
self.write_message(json.dumps({ "code": 400, "data": None, "msg": "user not exists" })) self.write_message(json.dumps({ "code": 400, "data": None, "msg": "user not exists" }))
# self.close() # self.close()
...@@ -185,7 +185,6 @@ class NotifyHandler(BaseWebsocket): ...@@ -185,7 +185,6 @@ class NotifyHandler(BaseWebsocket):
# 查询该用户可查看设备 # 查询该用户可查看设备
devices = session.query(Device).filter(Device.create_by==payload.get("data").get("id")).all() devices = session.query(Device).filter(Device.create_by==payload.get("data").get("id")).all()
if len(devices): if len(devices):
self._clients.append({ self._clients.append({
'uuid': payload.get("data").get("uuid"), 'uuid': payload.get("data").get("uuid"),
...@@ -198,11 +197,31 @@ class NotifyHandler(BaseWebsocket): ...@@ -198,11 +197,31 @@ class NotifyHandler(BaseWebsocket):
self.write_message(json.dumps({ 'code': 400, 'data': None, 'msg': 'no devices' })) self.write_message(json.dumps({ 'code': 400, 'data': None, 'msg': 'no devices' }))
# self.close() # self.close()
elif message.get("type") == "heartbeat": # 心跳包 elif message.get("type") == "heartbeat": # 心跳包
exists_flag = False
# 收到心跳包消息，更新接收数据时间 # 收到心跳包消息，更新接收数据时间
for c in self._clients: for c in self._clients:
if c.get("uuid") == payload.get("data").get("uuid"): if c.get("uuid") == payload.get("data").get("uuid"):
c["ts"] = int(time.time()) c["ts"] = int(time.time())
self.write_message(json.dumps({ 'code': 200, 'data': None, 'msg': 'update session timestamp success' })) self.write_message(json.dumps({ 'code': 200, 'data': None, 'msg': 'update session timestamp success' }))
exists_flag = True
if not exists_flag and message.get("token"):
payload = jwt.decode(message.get("token"), config['SECRET_KEY'], verify=True, algorithms=['HS256'], options={ 'verify_aud': False })
user = session.query(User).filter(User.id == payload.get("data").get("id")).one_or_none()
if not user:
self.write_message(json.dumps({ 'code': 402, 'data': None, 'msg': 'user not exists' }))
return
devices = session.query(Device).filter(Device.create_by==payload.get("data").get("id")).all()
if len(devices):
self._clients.append({
'uuid': payload.get("data").get("uuid"),
'context': self,
'devices': list(map(lambda d:d.imei, devices)),
'ts': int(time.time())
})
self.write_message(json.dumps({ 'code': 200, 'data': None, 'msg': 'auth passed' }))
else: # 没有设备，是否断开连接
self.write_message(json.dumps({ 'code': 400, 'data': None, 'msg': 'no devices' }))
else: else:
self.write_message(json.dumps({ 'code': 200, 'data': None, 'msg': 'unkonw message packet, disconnect by server' })) self.write_message(json.dumps({ 'code': 200, 'data': None, 'msg': 'unkonw message packet, disconnect by server' }))
self.handlers[className].remove(self) self.handlers[className].remove(self)
...@@ -322,9 +341,7 @@ class DeviceMessageHandler(BaseHandler): ...@@ -322,9 +341,7 @@ class DeviceMessageHandler(BaseHandler):
# data = tornado.escape.json_decode(self.request.body) # data = tornado.escape.json_decode(self.request.body)
data = str(self.request.body, encoding="ISO-8859-1") data = str(self.request.body, encoding="ISO-8859-1")
data = json.loads(data) data = json.loads(data)
logger.info(data) logger.info(data)
data.get("system", {}).update({ data.get("system", {}).update({
'host': self.request.remote_ip, 'host': self.request.remote_ip,
'path': self.request.path, 'path': self.request.path,
...@@ -332,7 +349,6 @@ class DeviceMessageHandler(BaseHandler): ...@@ -332,7 +349,6 @@ class DeviceMessageHandler(BaseHandler):
}) })
insert_data(data) insert_data(data)
data['type'] = 'report' data['type'] = 'report'
data['system'].update({ 'timestamp': datetime.now().strftime("%Y-%m-%d %H:%M:%S") }) data['system'].update({ 'timestamp': datetime.now().strftime("%Y-%m-%d %H:%M:%S") })
NotifyHandler.broadcastMessage(data) NotifyHandler.broadcastMessage(data)
......
frontend/src/api/index.js
View file @ 9f9b222a
import request from "@/utils/request"; import request from "@/utils/request";
export function getTemplate(params) {
return request({
url: "/report/reportmanage/templatesList",
method: "get",
params,
});
}
export function getReport(data) {
return request({
url: "/report/reportmanage/pdfGenerate",
method: "post",
data,
});
}
export function getWorkbenckData(params) { export function getWorkbenckData(params) {
return request({ return request({
url: "/api/v1/evm_store/workbench/query", url: "/api/v1/evm_store/workbench/query",
......
frontend/src/utils/eventBus.js
View file @ 9f9b222a
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-07-01 15:02:16 * @Date: 2021-07-01 15:02:16
* @LastEditTime: 2021-07-21 16:16:36 * @LastEditTime: 2021-07-25 18:24:48
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: \evm-store\frontend\src\utils\eventBus.js * @FilePath: \evm-store\frontend\src\utils\eventBus.js
...@@ -28,7 +28,7 @@ wsNotify.onopen = function (event) { ...@@ -28,7 +28,7 @@ wsNotify.onopen = function (event) {
}; };
wsNotify.onmessage = function (event) { wsNotify.onmessage = function (event) {
var message = JSON.parse(event.data); const message = JSON.parse(event.data);
wsNotify.eventBus.$emit("message", message); wsNotify.eventBus.$emit("message", message);
}; };
......
frontend/src/views/system/monitor.vue
View file @ 9f9b222a
...@@ -29,6 +29,8 @@ ...@@ -29,6 +29,8 @@
> >
<p class="item-title">DEVICE</p> <p class="item-title">DEVICE</p>
<div style="padding: 15px"> <div style="padding: 15px">
<el-form :inline="true">
<el-form-item label="选择设备">
<el-select <el-select
size="mini" size="mini"
v-model="device" v-model="device"
...@@ -42,6 +44,11 @@ ...@@ -42,6 +44,11 @@
:value="item" :value="item"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item>
<el-form-item label="资源监控报告">
<el-button size="mini" @click="getReport">导出报告</el-button>
</el-form-item>
</el-form>
</div> </div>
</grid-item> </grid-item>
<grid-item <grid-item
...@@ -245,7 +252,7 @@ ...@@ -245,7 +252,7 @@
@container-resized="containerResizedEvent" @container-resized="containerResizedEvent"
@moved="movedEvent" @moved="movedEvent"
> >
<div style="width: 100%; height: 100%;overflow-y: auto;"> <div style="width: 100%; height: 100%; overflow-y: auto">
<p class="item-title">APP</p> <p class="item-title">APP</p>
<el-table <el-table
element-loading-text="Loading" element-loading-text="Loading"
...@@ -309,12 +316,25 @@ ...@@ -309,12 +316,25 @@
@container-resized="containerResizedEvent" @container-resized="containerResizedEvent"
@moved="movedEvent" @moved="movedEvent"
> >
<div style="width: 100%; height: 100%;overflow-y: auto;"> <div style="width: 100%; height: 100%; overflow-y: auto">
<el-table :data="pngList" style="width: 100%"> <el-table :data="pngList" style="width: 100%">
<el-table-column prop="uri" label="uri" min-width="180"></el-table-column> <el-table-column
<el-table-column prop="filesize" label="file size" width="100"></el-table-column> prop="uri"
<el-table-column prop="uncompressed_size" label="origin size" width="100"></el-table-column> label="uri"
<el-table-column prop="ratio" label="ratio" width="100"> </el-table-column> min-width="180"
></el-table-column>
<el-table-column
prop="filesize"
label="file size"
width="100"
></el-table-column>
<el-table-column
prop="uncompressed_size"
label="origin size"
width="100"
></el-table-column>
<el-table-column prop="ratio" label="ratio" width="100">
</el-table-column>
</el-table> </el-table>
</div> </div>
</grid-item> </grid-item>
...@@ -368,12 +388,18 @@ ...@@ -368,12 +388,18 @@
</div> </div>
</template> </template>
<script> <script>
import { getWatchList, getMonitorData } from "@/api/index"; import {
getWatchList,
getMonitorData,
getReport,
getTemplate,
} from "@/api/index";
import EvmChart from "./components/EvmChart"; import EvmChart from "./components/EvmChart";
import LvglChart from "./components/LvglChart"; import LvglChart from "./components/LvglChart";
import SystemChart from "./components/SystemChart"; import SystemChart from "./components/SystemChart";
import { GridLayout, GridItem } from "vue-grid-layout"; import { GridLayout, GridItem } from "vue-grid-layout";
import { wsNotify } from "@/utils/eventBus.js"; import { wsNotify } from "@/utils/eventBus.js";
import { deepClone } from "@/utils/index"
import Database from "@/utils/indexedDB"; import Database from "@/utils/indexedDB";
const dbObject = { const dbObject = {
...@@ -422,8 +448,6 @@ export default { ...@@ -422,8 +448,6 @@ export default {
system: ["free_size", "free_space_size", "used_space_size"], system: ["free_size", "free_space_size", "used_space_size"],
lvgl: ["total_size", "free_size", "free_biggest_size"], lvgl: ["total_size", "free_size", "free_biggest_size"],
evm: [ evm: [
"total_size",
"free_size",
"heap_map_size", "heap_map_size",
"heap_total_size", "heap_total_size",
"heap_used_size", "heap_used_size",
...@@ -455,6 +479,46 @@ export default { ...@@ -455,6 +479,46 @@ export default {
SystemChart, SystemChart,
}, },
methods: { methods: {
getTemplate() {
getTemplate()
.then((res) => {
console.log(res);
})
.catch((err) => {
this.$message.error(err.msg);
});
},
getReport() {
monitor
.getAllData((params) => {
return params.imei && params.imei == this.device;
})
.then((res) => {
console.log(res);
// const systemList = [],
// evmList = [],
// lvglList = [];
// res.forEach((item) => {
// systemList.push(item.system);
// evmList.push(item.evm);
// lvglList.push(item.lvgl);
// });
let params = {
templateName: "evue-monitor.json",
dataJson: res,
};
return getReport(params);
})
.then((res) => {
console.log(res);
})
.catch((err) => {
this.$message.error(err.msg);
console.log(err);
});
},
tableRowClassName({ row }) { tableRowClassName({ row }) {
return row.highlight ? "success-row" : ""; return row.highlight ? "success-row" : "";
}, },
...@@ -546,6 +610,7 @@ export default { ...@@ -546,6 +610,7 @@ export default {
// 将设备发送过来的消息存储到浏览器中 // 将设备发送过来的消息存储到浏览器中
// 这里可以优化，将所有数据，保存到indexed datebase中 // 这里可以优化，将所有数据，保存到indexed datebase中
const m = deepClone(msg);
if (monitor.db) monitor.set(msg); if (monitor.db) monitor.set(msg);
if (!this.deviceList) { if (!this.deviceList) {
...@@ -566,9 +631,9 @@ export default { ...@@ -566,9 +631,9 @@ export default {
} }
// 处理单位 // 处理单位
this.processData(msg); this.processData(m);
this.globalData = msg; this.globalData = msg;
this.resetData(); this.resetData(m);
}, },
processData(msg) { processData(msg) {
if (!msg) return null; if (!msg) return null;
...@@ -590,37 +655,16 @@ export default { ...@@ -590,37 +655,16 @@ export default {
}, },
onSelectChange(res) { onSelectChange(res) {
this.device = res; this.device = res;
monitor
.getAllData((params) => {
return params.imei && params.imei == res;
})
.then((res) => {
console.log(res);
const systemList = [],
evmList = [],
lvglList = [];
res.forEach((item) => {
systemList.push(item.system);
evmList.push(item.evm);
lvglList.push(item.lvgl);
});
// 清空图表数据
wsNotify.eventBus.$emit("clear-system-chart"); wsNotify.eventBus.$emit("clear-system-chart");
wsNotify.eventBus.$emit("clear-evm-chart"); wsNotify.eventBus.$emit("clear-evm-chart");
wsNotify.eventBus.$emit("clear-lvgl-chart"); wsNotify.eventBus.$emit("clear-lvgl-chart");
// this.systemHistory = systemList;
// this.evmHistory = evmList;
// this.lvglHistory = lvglList;
// 清空图表数据
})
.catch((err) => {
console.log(err);
});
// this.processData(this.devices[this.device]); // this.processData(this.devices[this.device]);
// this.resetData(); // this.resetData();
}, },
resetData() { resetData(m) {
wsNotify.eventBus.$emit("resize"); wsNotify.eventBus.$emit("resize");
this.evmList = [{ ...this.globalData.evm }]; this.evmList = [{ ...this.globalData.evm }];
...@@ -628,12 +672,10 @@ export default { ...@@ -628,12 +672,10 @@ export default {
this.systemList = [ this.systemList = [
{ {
imei: this.globalData.imei, imei: this.globalData.imei,
...this.globalData.system ...this.globalData.system,
}, },
]; ];
console.log(this.globalData)
// 这里需要特殊处理下，先判断uri是否存在，不存在则添加，存在则更新 // 这里需要特殊处理下，先判断uri是否存在，不存在则添加，存在则更新
let uris = []; let uris = [];
this.imageList.forEach((item) => { this.imageList.forEach((item) => {
...@@ -648,7 +690,8 @@ export default { ...@@ -648,7 +690,8 @@ export default {
item.highlight = false; item.highlight = false;
} }
if (item.png_detail && item.png_detail.length) this.pngList = item.png_detail if (item.png_detail && item.png_detail.length)
this.pngList = item.png_detail;
const target = this.imageList.find((img) => img.uri === item.uri); const target = this.imageList.find((img) => img.uri === item.uri);
if (target) { if (target) {
...@@ -672,18 +715,37 @@ export default { ...@@ -672,18 +715,37 @@ export default {
} }
}); });
if (this.globalData) { if (m) {
if (this.globalData.evm) this.evm = this.globalData.evm; if (m.evm) this.evm = m.evm;
if (this.globalData.lvgl) this.lvgl = this.globalData.lvgl; if (m.lvgl) this.lvgl = m.lvgl;
if (this.globalData.image) this.image = this.globalData.image; if (m.image) this.image = m.image;
if (this.globalData.system) this.system = this.globalData.system; if (m.system) this.system = m.system;
} }
}, },
}, },
mounted() {}, mounted() {
this.socket = wsNotify;
wsNotify.eventBus.$on("open", (message) => {
this.sendMsg();
this.$nextTick(() => {
console.log(message);
});
// 这里启动一个定时器，10秒钟后，如果没有消息进来，说明当前没有在线设备
});
wsNotify.eventBus.$on("close", (message) => {
this.$nextTick(() => {
console.log(message);
});
});
wsNotify.eventBus.$on("message", (message) => {
this.$nextTick(() => {
this.handleMessage(deepClone(message));
});
});
},
destroyed() { destroyed() {
// 页面关闭则销毁该数据库 // 页面关闭则销毁该数据库
monitor.deleteDB() monitor.deleteDB();
}, },
created() { created() {
monitor monitor
...@@ -703,25 +765,6 @@ export default { ...@@ -703,25 +765,6 @@ export default {
.catch((err) => { .catch((err) => {
console.log(err); console.log(err);
}); });
this.socket = wsNotify;
wsNotify.eventBus.$on("open", (message) => {
this.sendMsg();
this.$nextTick(() => {
console.log(message);
});
// 这里启动一个定时器，10秒钟后，如果没有消息进来，说明当前没有在线设备
});
wsNotify.eventBus.$on("close", (message) => {
this.$nextTick(() => {
console.log(message);
});
});
wsNotify.eventBus.$on("message", (message) => {
this.$nextTick(() => {
this.handleMessage(message);
});
});
}, },
}; };
</script> </script>
......
frontend/vue.config.js
View file @ 9f9b222a
...@@ -30,11 +30,11 @@ module.exports = { ...@@ -30,11 +30,11 @@ module.exports = {
proxy: { proxy: {
// change xxx-api/login => mock/login // change xxx-api/login => mock/login
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
// "/api/v1": { "/report": {
// target: "http://127.0.0.1:3000/", target: "http://127.0.0.1:8800/",
// changeOrigin: true, changeOrigin: true,
// pathRewrite: {}, pathRewrite: {},
// }, },
"/api/v1/evm_store": { "/api/v1/evm_store": {
target: "http://store.evmiot.com/", target: "http://store.evmiot.com/",
changeOrigin: true, changeOrigin: true,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment