mt-ck/mt-qj-wcs-ui
5
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

更新设备监控

Browse Source
This commit is contained in:
朱文强 2022-02-15 11:22:52 +08:00
parent c19229e37d
commit d77f06aebd
1 changed files with 104 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
src/components/equipment-monitor.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-10-12 14:02:20
* @LastEditors: zwq
* @LastEditTime: 2021-11-11 10:11:22
* @LastEditTime: 2022-02-15 11:00:05
* @Description:
-->
<template>
@ -37,9 +37,41 @@ export default {
this.top = canvas.getBoundingClientRect().top;
this.left = canvas.getBoundingClientRect().left;
this.Rgvcvs(); //RGV 绘图
this.Kilncvs(); //窑炉 绘图
this.Storage(); //库位 绘图
this.ctx.beginPath(); // 颜色1信息
this.ctx.fillStyle = '#a2a2a2';
this.ctx.fillRect(10, 10, 30, 20);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(10, 10, 30, 20);
this.ctx.closePath();
this.ctx.beginPath(); // 颜色2信息
this.ctx.fillStyle = '#00c297';
this.ctx.fillRect(10, 40, 30, 20);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(10, 40, 30, 20);
this.ctx.closePath();
this.ctx.beginPath(); // 颜色3信息
this.ctx.fillStyle = '#c1d8fc';
this.ctx.fillRect(10, 70, 30, 20);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(10, 70, 30, 20);
this.ctx.closePath();
this.ctx.beginPath(); // rgv1
this.ctx.fillStyle = '#2c2c2c';
this.ctx.font="10px Arial";
this.ctx.fillText("无信号",50,22);
this.ctx.fillText("空闲",50,52);
this.ctx.fillText("任务中",50,82);
this.ctx.closePath();
this.Trackcvs(); //轨道 绘图
setInterval(()=>{
this.Trackcvs()
}, 5000);
//this.Kilncvs(); //窑炉 绘图
//this.Storage(); //库位 绘图
},
created() {
this.init();
@ -48,7 +80,8 @@ export default {
init() {
console.log("aaa");
},
Rgvcvs() {
Trackcvs() {
this.ctx.clearRect(0, 150, this.ctxWidth, this.ctxHeight-300)
this.ctx.beginPath(); //轨道
this.ctx.lineWidth = 3;
this.ctx.strokeStyle = "#FD8829";
@ -66,13 +99,73 @@ export default {
);
this.ctx.closePath();
this.ctx.beginPath(); // rgv
this.ctx.fillStyle = "#c1d8fc";
this.ctx.fillRect(20, window.innerHeight / 2 - 115, 100, 80);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(20, window.innerHeight / 2 - 115, 100, 80);
this.ctx.closePath();
this.$axios({
method: "post",
url: "/api/view/getAllInfo",
}).then(res => {
this.Rgvcvs(res.data)
});
},
Rgvcvs({rgv1,rgv2}){
//this.ctx.clearRect(100, window.innerHeight / 2 - 115, w, h);
let color1,color2
if(rgv1.communiStatus){
if(rgv1.isFree){
color1 = '#00c297'
}else if(rgv1.taskNumber){
color1 = '#c1d8fc'
}
}else{
color1 = '#a2a2a2'
}
if(rgv2.communiStatus){
if(rgv2.isFree){
color2 = '#00c297'
}else if(rgv2.taskNumber){
color2 = '#c1d8fc'
}
}else{
color2 = '#a2a2a2'
}
this.ctx.beginPath(); // rgv1
this.ctx.fillStyle = color1;
this.ctx.fillRect(100, window.innerHeight / 2 - 115, 100, 80);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(100, window.innerHeight / 2 - 115, 100, 80);
this.ctx.closePath();
this.ctx.beginPath(); // rgv1
this.ctx.fillStyle = '#2c2c2c';
this.ctx.font="20px Arial";
this.ctx.fillText("RGV1",110,window.innerHeight / 2 - 70);
this.ctx.closePath();
this.ctx.beginPath(); // rgv2
this.ctx.fillStyle = color2;
this.ctx.fillRect(window.innerWidth - 612, window.innerHeight / 2 - 115, 100, 80);
this.ctx.strokeStyle = "#dcf4e3";
this.ctx.strokeRect(window.innerWidth - 612, window.innerHeight / 2 - 115, 100, 80);
this.ctx.closePath();
this.ctx.beginPath(); // rgv1
this.ctx.fillStyle = '#2c2c2c';
this.ctx.font="20px Arial";
this.ctx.fillText("RGV2",window.innerWidth - 602,window.innerHeight / 2 - 70);
this.ctx.closePath();
if(color1 === '#c1d8fc'){
this.ctx.beginPath(); // rgv1
this.ctx.fillStyle = '#2c2c2c';
this.ctx.font="20px Arial";
this.ctx.fillText("任务号:"+rgv1.taskNumber,110,window.innerHeight / 2 - 10);
this.ctx.closePath();
}
if(color2 === '#c1d8fc'){
this.ctx.beginPath(); // rgv2
this.ctx.fillStyle = '#2c2c2c';
this.ctx.font="20px Arial";
this.ctx.fillText("任务号:"+rgv2.taskNumber,window.innerWidth - 602,window.innerHeight / 2 - 10);
this.ctx.closePath();
}
},
Kilncvs() {
this.ctx.beginPath(); // 窑炉虚线
this.ctx.strokeStyle = "#FD8829";