更新设备监控
This commit is contained in:
parent
c19229e37d
commit
d77f06aebd
@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2021-10-12 14:02:20
|
* @Date: 2021-10-12 14:02:20
|
||||||
* @LastEditors: zwq
|
* @LastEditors: zwq
|
||||||
* @LastEditTime: 2021-11-11 10:11:22
|
* @LastEditTime: 2022-02-15 11:00:05
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@ -37,9 +37,41 @@ export default {
|
|||||||
this.top = canvas.getBoundingClientRect().top;
|
this.top = canvas.getBoundingClientRect().top;
|
||||||
this.left = canvas.getBoundingClientRect().left;
|
this.left = canvas.getBoundingClientRect().left;
|
||||||
|
|
||||||
this.Rgvcvs(); //RGV 绘图
|
this.ctx.beginPath(); // 颜色1信息
|
||||||
this.Kilncvs(); //窑炉 绘图
|
this.ctx.fillStyle = '#a2a2a2';
|
||||||
this.Storage(); //库位 绘图
|
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() {
|
created() {
|
||||||
this.init();
|
this.init();
|
||||||
@ -48,7 +80,8 @@ export default {
|
|||||||
init() {
|
init() {
|
||||||
console.log("aaa");
|
console.log("aaa");
|
||||||
},
|
},
|
||||||
Rgvcvs() {
|
Trackcvs() {
|
||||||
|
this.ctx.clearRect(0, 150, this.ctxWidth, this.ctxHeight-300)
|
||||||
this.ctx.beginPath(); //轨道
|
this.ctx.beginPath(); //轨道
|
||||||
this.ctx.lineWidth = 3;
|
this.ctx.lineWidth = 3;
|
||||||
this.ctx.strokeStyle = "#FD8829";
|
this.ctx.strokeStyle = "#FD8829";
|
||||||
@ -66,13 +99,73 @@ export default {
|
|||||||
);
|
);
|
||||||
this.ctx.closePath();
|
this.ctx.closePath();
|
||||||
|
|
||||||
this.ctx.beginPath(); // rgv
|
this.$axios({
|
||||||
this.ctx.fillStyle = "#c1d8fc";
|
method: "post",
|
||||||
this.ctx.fillRect(20, window.innerHeight / 2 - 115, 100, 80);
|
url: "/api/view/getAllInfo",
|
||||||
this.ctx.strokeStyle = "#dcf4e3";
|
}).then(res => {
|
||||||
this.ctx.strokeRect(20, window.innerHeight / 2 - 115, 100, 80);
|
this.Rgvcvs(res.data)
|
||||||
this.ctx.closePath();
|
});
|
||||||
},
|
},
|
||||||
|
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() {
|
Kilncvs() {
|
||||||
this.ctx.beginPath(); // 窑炉虚线
|
this.ctx.beginPath(); // 窑炉虚线
|
||||||
this.ctx.strokeStyle = "#FD8829";
|
this.ctx.strokeStyle = "#FD8829";
|
||||||
|
Loading…
Reference in New Issue
Block a user