1 line
18 KiB
JSON
1 line
18 KiB
JSON
{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\StateOperation.vue?vue&type=script&lang=js&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\views\\StateOperation.vue","mtime":1679361014435},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.typed.uint8-array\";\nimport _defineProperty from \"E:/\\u89C6\\u9891\\u8FB9\\u7F18\\u8BA1\\u7B97\\u7BA1\\u7406\\u5E73\\u53F0/TransFlow/node_modules/@babel/runtime/helpers/esm/defineProperty\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nexport default {\n data: function data() {\n return _defineProperty({\n runningState: {\n type: '',\n version: '',\n currentTime: '',\n startTime: '',\n runTime: ''\n },\n performance: {\n runTime: '',\n averageCpuUtilization: '',\n cpuUtilization: '',\n cpuTemperature: '',\n cpuName: '',\n gpuUtilization: '',\n gpuTemperature: '',\n memoryUsage: '',\n totalMemory: '',\n virtualMemoryUsed: '',\n totalVirtualMemory: ''\n },\n mountingPointTable: [{\n mountingPoint: '2016-05-02',\n equipmentName: '王小虎',\n occupancy: '上海市普陀区金沙江路 1518 弄',\n total: '上海市普陀区金沙江路 1518 弄'\n }],\n networkStatus: {\n internetAccess: '',\n internetDelay: '',\n DNS: '',\n VPNvisit: '',\n serverVPN: '',\n serverVPNOpen: ''\n }\n }, \"networkStatus\", [{\n connect: '2016-05-02',\n IP: '王小虎',\n acceptor: '上海市普陀区金沙江路 1518 弄',\n totalReceived: '上海市普陀区金沙江路 1518 弄',\n transmission: '上海市普陀区金沙江路 1518 弄',\n transmissionTotal: '上海市普陀区金沙江路 1518 弄'\n }]);\n },\n created: function created() {\n this.createMqtt(); // setTimeout(() => {\n // this.createMqtt()\n // }, 3000);\n },\n mounted: function mounted() {\n var _this = this;\n\n window.setInterval(function () {\n //每隔30秒自动请求一次方法 this.getdata() ，保证数据实时的更新\n _this.publishClient();\n }, 1000 * 5);\n },\n methods: {\n /** 创建mqtt */\n createMqtt: function createMqtt() {\n window.publish('Contorl_client', JSON.stringify({\n \"type\": \"getStatus\"\n })); //创建链接，接收数据\n\n var topicSends = ['Contorl_server'];\n window.PubScribe(topicSends, -1, this.realInfo);\n },\n publishClient: function publishClient() {\n window.publish('Contorl_client', JSON.stringify({\n \"type\": \"getStatus\"\n }));\n },\n\n /** 实时数据分类 */\n realInfo: function realInfo(topic, message) {\n // console.log(\"topic\",topic)\n switch (topic) {\n case \"Contorl_server\":\n try {\n // console.log(\"message\",message)\n var utf8decoder = new TextDecoder();\n var u8arr = new Uint8Array(message);\n var temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串\n\n var msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\n // console.log(\"msg\",msg)\n\n this.runningState.currentTime = msg.now_time;\n this.runningState.startTime = msg.starttime;\n this.runningState.runTime = msg.uptime; //平均Cpu利用率\n\n this.performance.averageCpuUtilization = msg.cpu_Average + '%';\n this.performance.cpuUtilization = msg.cpu_Every;\n this.performance.cpuTemperature = msg.cpu_Temperature + \"°C\";\n this.performance.cpuName = msg.cpu_Name;\n this.performance.gpuUtilization = msg.gpu_Average + '%';\n this.performance.gpuTemperature = msg.gpu_Temperature + \"°C\";\n var newmemoryUsed = msg.memory_used / 1024 / 1024 / 1024;\n this.performance.memoryUsage = msg.memory_percent + '%' + ' | ' + newmemoryUsed.toFixed(2) + 'GB';\n var totalMemoryN = msg.memory_total / 1024 / 1024 / 1024;\n this.performance.totalMemory = totalMemoryN.toFixed(2) + 'GB';\n var newswapUsed = msg.swap_used / 1024 / 1024 / 1024;\n this.performance.virtualMemoryUsed = msg.swap_percent + '%' + ' | ' + newswapUsed.toFixed(2) + 'GB';\n var totalVirtualMemoryN = msg.swap_total / 1024 / 1024 / 1024;\n this.performance.totalVirtualMemory = totalVirtualMemoryN.toFixed(2) + 'GB';\n } catch (error) {}\n\n break;\n }\n }\n }\n};",{"version":3,"sources":["StateOperation.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n <div class=\"content-box\">\r\n <div class=\"container\">\r\n <!-- <p>主体页面 1 - 2 </p>\r\n <div class=\"test-div\">\r\n <i class=\"el-icon-edit\"></i>\r\n <i class=\"el-icon-share\"></i>\r\n <i class=\"el-icon-delete\"></i>\r\n </div> -->\r\n <h1>运行状态</h1>\r\n <el-form :model=\"runningState\" label-position=\"left\" label-width=\"200px\" style=\"width:70%\">\r\n <el-form-item label=\"类型：\">{{ runningState.type }}</el-form-item>\r\n <el-form-item label=\"版本：\">{{ runningState.version }}</el-form-item>\r\n <el-form-item label=\"当前系统时间：\">{{ runningState.currentTime }}</el-form-item>\r\n <el-form-item label=\"开始运行时间：\">{{ runningState.startTime }}</el-form-item>\r\n <el-form-item label=\"正常运行时长：\">{{ runningState.runTime }}</el-form-item>\r\n </el-form>\r\n\r\n <h1 class=\"mar-top20\">系统性能状态</h1>\r\n <el-form :model=\"performance\" label-position=\"left\" label-width=\"200px\" style=\"width:70%\">\r\n <!-- <el-form-item label=\"正常运行时长：\">{{ performance.runTime }}</el-form-item> -->\r\n <el-form-item label=\"平均Cpu利用率：\">{{ performance.averageCpuUtilization }}</el-form-item>\r\n <el-form-item label=\"Cpu利用率：\"><span v-for=\"s in performance.cpuUtilization\"\r\n :key=\"s\">{{ s +'%'}} | </span> </el-form-item>\r\n <el-form-item label=\"Cpu温度：\">{{ performance.cpuTemperature }}</el-form-item>\r\n <el-form-item label=\"Cpu名称：\">{{ performance.cpuName }}</el-form-item>\r\n <el-form-item label=\"Gpu利用率：\">{{ performance.gpuUtilization }}</el-form-item>\r\n <el-form-item label=\"Gpu温度：\">{{ performance.gpuTemperature }}</el-form-item>\r\n <el-form-item label=\"使用的内存：\">{{ performance.memoryUsage }}</el-form-item>\r\n <el-form-item label=\"内存总数：\">{{ performance.totalMemory }}</el-form-item>\r\n <el-form-item label=\"已使用虚拟内存：\">{{ performance.virtualMemoryUsed }}</el-form-item>\r\n <el-form-item label=\"虚拟内存总计：\">{{ performance.totalVirtualMemory }}</el-form-item>\r\n </el-form>\r\n\r\n <!-- <el-table class=\"mar-top20\" :data=\"mountingPointTable\" border style=\"width: 100%\">\r\n <el-table-column prop=\"mountingPoint\" label=\"安装点\">\r\n </el-table-column>\r\n <el-table-column prop=\"equipmentName\" label=\"设备名称\">\r\n </el-table-column>\r\n <el-table-column prop=\"occupancy\" label=\"使用\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.occupancy }}GB\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"total\" label=\"容量\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.total }}GB\r\n </template>\r\n </el-table-column>\r\n </el-table> -->\r\n\r\n\r\n <h1 class=\"mar-top20\">系统网络状态</h1>\r\n <el-form :model=\"networkStatus\" label-position=\"left\" label-width=\"200px\" style=\"width:70%\">\r\n <el-form-item label=\"互联网接入：\">{{ networkStatus.internetAccess }}</el-form-item>\r\n <el-form-item label=\"互联网延迟：\">{{ networkStatus.internetDelay }}</el-form-item>\r\n <el-form-item label=\"DNS访问：\">{{ networkStatus.DNS }}</el-form-item>\r\n <el-form-item label=\"本地VPN访问：\">{{ networkStatus.VPNvisit }}</el-form-item>\r\n <el-form-item label=\"服务器VPN访问：\">{{ networkStatus.serverVPN }}</el-form-item>\r\n <el-form-item label=\"服务器VPN访问：\">{{ networkStatus.serverVPNOpen }}</el-form-item>\r\n </el-form>\r\n\r\n <el-table class=\"mar-top20\" :data=\"mountingPointTable\" border style=\"width: 100%\">\r\n <el-table-column prop=\"connect\" label=\"连接\">\r\n </el-table-column>\r\n <el-table-column prop=\"IP\" label=\"IP地址\">\r\n </el-table-column>\r\n <el-table-column prop=\"acceptor\" label=\"接受\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.occupancy }}K\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"totalReceived\" label=\"收到的总数\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.total }}GB\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"transmission\" label=\"传输\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.total }}Kb/s\r\n </template>\r\n </el-table-column>\r\n <el-table-column prop=\"transmissionTotal\" label=\"传输的总数\">\r\n <template slot-scope=\"scope\">\r\n {{ scope.row.total }}MB\r\n </template>\r\n </el-table-column>\r\n </el-table>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n data() {\r\n return {\r\n runningState: {\r\n type: '',\r\n version: '',\r\n currentTime: '',\r\n startTime: '',\r\n runTime: '',\r\n },\r\n performance: {\r\n runTime: '',\r\n averageCpuUtilization: '',\r\n cpuUtilization: '',\r\n cpuTemperature: '',\r\n cpuName: '',\r\n gpuUtilization: '',\r\n gpuTemperature: '',\r\n memoryUsage: '',\r\n totalMemory: '',\r\n virtualMemoryUsed: '',\r\n totalVirtualMemory: '',\r\n },\r\n mountingPointTable: [\r\n {\r\n mountingPoint: '2016-05-02',\r\n equipmentName: '王小虎',\r\n occupancy: '上海市普陀区金沙江路 1518 弄',\r\n total: '上海市普陀区金沙江路 1518 弄',\r\n },\r\n ],\r\n networkStatus: {\r\n internetAccess: '',\r\n internetDelay: '',\r\n DNS: '',\r\n VPNvisit: '',\r\n serverVPN: '',\r\n serverVPNOpen: '',\r\n },\r\n networkStatus: [\r\n {\r\n connect: '2016-05-02',\r\n IP: '王小虎',\r\n acceptor: '上海市普陀区金沙江路 1518 弄',\r\n totalReceived: '上海市普陀区金沙江路 1518 弄',\r\n transmission: '上海市普陀区金沙江路 1518 弄',\r\n transmissionTotal: '上海市普陀区金沙江路 1518 弄',\r\n },\r\n ]\r\n }\r\n },\r\n created() {\r\n this.createMqtt()\r\n // setTimeout(() => {\r\n // this.createMqtt()\r\n // }, 3000);\r\n},\r\n mounted() {\r\n\r\n window.setInterval( () => { //每隔30秒自动请求一次方法 this.getdata() ，保证数据实时的更新\r\n\tthis.publishClient()\r\n}, 1000 * 5 )\r\n },\r\n methods: {\r\n /** 创建mqtt */\r\n createMqtt() {\r\n window.publish('Contorl_client',JSON.stringify({\"type\":\"getStatus\"})); \r\n //创建链接，接收数据\r\n var topicSends = ['Contorl_server'];\r\n window.PubScribe(topicSends,-1,this.realInfo);\r\n \r\n },\r\n publishClient(){\r\n window.publish('Contorl_client',JSON.stringify({\"type\":\"getStatus\"})); \r\n },\r\n /** 实时数据分类 */\r\n realInfo(topic, message) {\r\n // console.log(\"topic\",topic)\r\n switch (topic) {\r\n case \"Contorl_server\":\r\n try {\r\n // console.log(\"message\",message)\r\n const utf8decoder = new TextDecoder()\r\n const u8arr = new Uint8Array(message)\r\n const temp = utf8decoder.decode(u8arr)\t// 将二进制数据转为字符串\r\n const msg = JSON.parse(temp)\t\t//这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据\r\n // console.log(\"msg\",msg)\r\n this.runningState.currentTime = msg.now_time\r\n this.runningState.startTime = msg.starttime\r\n this.runningState.runTime = msg.uptime\r\n //平均Cpu利用率\r\n this.performance.averageCpuUtilization = msg.cpu_Average+'%'\r\n this.performance.cpuUtilization = msg.cpu_Every\r\n this.performance.cpuTemperature = msg.cpu_Temperature+\"°C\"\r\n this.performance.cpuName = msg.cpu_Name\r\n this.performance.gpuUtilization = msg.gpu_Average+'%' \r\n this.performance.gpuTemperature = msg.gpu_Temperature+\"°C\"\r\n var newmemoryUsed = msg.memory_used/1024/1024/1024\r\n this.performance.memoryUsage = msg.memory_percent+'%'+' | '+ newmemoryUsed.toFixed(2)+'GB'\r\n var totalMemoryN = msg.memory_total/1024/1024/1024\r\n this.performance.totalMemory = totalMemoryN.toFixed(2)+'GB'\r\n var newswapUsed = msg.swap_used/1024/1024/1024\r\n this.performance.virtualMemoryUsed = msg.swap_percent+'%' +' | '+ newswapUsed.toFixed(2)+'GB'\r\n var totalVirtualMemoryN = msg.swap_total/1024/1024/1024\r\n this.performance.totalVirtualMemory = totalVirtualMemoryN.toFixed(2)+'GB'\r\n } catch (error) {\r\n\r\n }\r\n break;\r\n }\r\n },\r\n}\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.test-div i {\r\n font-size: 25px;\r\n}\r\n\r\n.el-form-item {\r\n margin-bottom: 0px;\r\n}\r\n\r\n.mar-top20 {\r\n margin-top: 20px;\r\n}\r\n</style>"],"sourceRoot":"src/views"}]} |