fix:0915会议123456
This commit is contained in:
parent
ed9698aeea
commit
2d2e9c9f74
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
|
|
@ -1,183 +1,180 @@
|
|||
<template>
|
||||
<div class="faceLoginWrap">
|
||||
<div style="height:fit-content;">
|
||||
<div class="video-box">
|
||||
<video id="video" width="600" preload autoplay muted></video>
|
||||
<canvas id="canvas" width="600" height="500"></canvas>
|
||||
</div>
|
||||
<canvas id="screenshotCanvas" width="600" height="500"></canvas>
|
||||
<div class="faceLoginWrap">
|
||||
<div style="height:fit-content;">
|
||||
<div class="video-box">
|
||||
<video id="video" width="600" preload autoplay muted></video>
|
||||
<canvas id="canvas" width="600" height="500"></canvas>
|
||||
</div>
|
||||
<canvas id="screenshotCanvas" width="600" height="500"></canvas>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import tracking from './tracking/tracking-min.js';
|
||||
import './tracking/data/face-min.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
video: null,
|
||||
screenshotCanvas: null,
|
||||
uploadLock: false // 上传锁
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.openTheCamera();
|
||||
},
|
||||
methods: {
|
||||
openTheCamera() {
|
||||
this.$nextTick(function () {
|
||||
let _this = this;
|
||||
this.video = document.getElementById('video');
|
||||
// 旧版本浏览器可能根本不支持mediaDevices，我们首先设置一个空对象
|
||||
if (navigator.mediaDevices === undefined) {
|
||||
navigator.mediaDevices = {}
|
||||
}
|
||||
// 一些浏览器实现了部分mediaDevices，我们不能只分配一个对象
|
||||
// 使用getUserMedia，因为它会覆盖现有的属性。
|
||||
// 这里，如果缺少getUserMedia属性，就添加它。
|
||||
if (navigator.mediaDevices.getUserMedia === undefined) {
|
||||
navigator.mediaDevices.getUserMedia = function (constraints) {
|
||||
// 首先获取现存的getUserMedia(如果存在)
|
||||
let getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.getUserMedia;
|
||||
// 有些浏览器不支持，会返回错误信息
|
||||
// 保持接口一致
|
||||
if (!getUserMedia) {
|
||||
return Promise.reject(new Error('getUserMedia is not implemented in this browser'))
|
||||
}
|
||||
// 否则，使用Promise将调用包装到旧的navigator.getUserMedia
|
||||
return new Promise(function (resolve, reject) {
|
||||
getUserMedia.call(navigator, constraints, resolve, reject)
|
||||
})
|
||||
}
|
||||
}
|
||||
let constraints = {
|
||||
audio: false,
|
||||
video: {width: this.videoWidth, height: this.videoHeight, transform: 'scaleX(-1)'}
|
||||
};
|
||||
navigator.mediaDevices.getUserMedia(constraints).then(function (stream) {
|
||||
// 旧的浏览器可能没有srcObject
|
||||
if ('srcObject' in _this.video) {
|
||||
_this.video.srcObject = stream
|
||||
} else {
|
||||
// 避免在新的浏览器中使用它，因为它正在被弃用。
|
||||
_this.video.src = window.URL.createObjectURL(stream)
|
||||
}
|
||||
_this.video.onloadedmetadata = function () {
|
||||
_this.video.play();
|
||||
};
|
||||
_this.init();
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
});
|
||||
},
|
||||
// 初始化设置
|
||||
init() {
|
||||
this.screenshotCanvas = document.getElementById('screenshotCanvas');
|
||||
let canvas = document.getElementById('canvas');
|
||||
let context = canvas.getContext('2d');
|
||||
|
||||
// 实例化tracker对象
|
||||
let tracker = new window.tracking.ObjectTracker('face');
|
||||
tracker.setInitialScale(4);
|
||||
tracker.setStepSize(2);
|
||||
tracker.setEdgesDensity(0.1);
|
||||
//tracker对象和标签关联
|
||||
window.tracking.track('#video', tracker, {
|
||||
camera: true
|
||||
});
|
||||
let _this = this;
|
||||
//添加事件
|
||||
tracker.on('track', function (event) {
|
||||
// 检测出人脸 绘画人脸位置
|
||||
context.clearRect(0, 0, canvas.width, canvas.height);
|
||||
// 给每个人脸绘制对应的框
|
||||
event.data.forEach(function (rect) {
|
||||
context.strokeStyle = '#0764B7';
|
||||
context.strokeRect(rect.x, rect.y, rect.width, rect.height);
|
||||
// window.plot(rect.x, rect.y, rect.width, rect.height+20);
|
||||
// 避免重复发送请求
|
||||
if (!_this.uploadLock) {
|
||||
_this.uploadLock = true;
|
||||
// 上传图片
|
||||
_this.screenshotAndUpload();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
// 上传图片
|
||||
screenshotAndUpload() {
|
||||
let that = this;
|
||||
// 绘制当前帧图片转换为base64格式
|
||||
let canvas = this.screenshotCanvas;
|
||||
let video = this.video;
|
||||
let ctx = canvas.getContext('2d');
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
|
||||
let base64Img = canvas.toDataURL('image/jpeg');
|
||||
let img = base64Img.split(',')[1];
|
||||
let tolerance = parseFloat(localStorage.getItem('tolerance'));
|
||||
let imgData = {base64: img,tolerance};
|
||||
|
||||
this.$API.auth.login_face.req(imgData).then((res) => {
|
||||
// debugger;
|
||||
if (res.username) {
|
||||
// this.$message.success(res.username + '识别成功！');
|
||||
let messag = '<div style="font-size:30px"><strong> <i style="font-size:40px">'+res.username+'</i> 识别成功！</strong></div>';
|
||||
this.$message.success({
|
||||
dangerouslyUseHTMLString: true,
|
||||
duration:4000,
|
||||
message: messag
|
||||
});
|
||||
setTimeout(() => {
|
||||
that.uploadLock = false;
|
||||
}, 5000)
|
||||
this.$emit('close')
|
||||
} else {
|
||||
that.uploadLock = false;
|
||||
}
|
||||
}).catch(() => {
|
||||
// 打开锁
|
||||
that.uploadLock = false;
|
||||
});
|
||||
},
|
||||
closeCamera() {
|
||||
this.video.srcObject.getTracks()[0].stop();
|
||||
},
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import tracking from './/tracking/tracking-min.js';
|
||||
import './/tracking/data/face-min.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
video: null,
|
||||
screenshotCanvas: null,
|
||||
uploadLock: false // 上传锁
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.openTheCamera();
|
||||
},
|
||||
methods: {
|
||||
openTheCamera() {
|
||||
this.$nextTick(function () {
|
||||
let _this = this;
|
||||
this.video = document.getElementById('video');
|
||||
// 旧版本浏览器可能根本不支持mediaDevices，我们首先设置一个空对象
|
||||
if (navigator.mediaDevices === undefined) {
|
||||
navigator.mediaDevices = {}
|
||||
}
|
||||
// 一些浏览器实现了部分mediaDevices，我们不能只分配一个对象
|
||||
// 使用getUserMedia，因为它会覆盖现有的属性。
|
||||
// 这里，如果缺少getUserMedia属性，就添加它。
|
||||
if (navigator.mediaDevices.getUserMedia === undefined) {
|
||||
navigator.mediaDevices.getUserMedia = function (constraints) {
|
||||
// 首先获取现存的getUserMedia(如果存在)
|
||||
let getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.getUserMedia;
|
||||
// 有些浏览器不支持，会返回错误信息
|
||||
// 保持接口一致
|
||||
if (!getUserMedia) {
|
||||
return Promise.reject(new Error('getUserMedia is not implemented in this browser'))
|
||||
}
|
||||
// 否则，使用Promise将调用包装到旧的navigator.getUserMedia
|
||||
return new Promise(function (resolve, reject) {
|
||||
getUserMedia.call(navigator, constraints, resolve, reject)
|
||||
})
|
||||
}
|
||||
}
|
||||
let constraints = {
|
||||
audio: false,
|
||||
video: {width: this.videoWidth, height: this.videoHeight, transform: 'scaleX(-1)'}
|
||||
};
|
||||
navigator.mediaDevices.getUserMedia(constraints).then(function (stream) {
|
||||
// 旧的浏览器可能没有srcObject
|
||||
if ('srcObject' in _this.video) {
|
||||
_this.video.srcObject = stream
|
||||
} else {
|
||||
// 避免在新的浏览器中使用它，因为它正在被弃用。
|
||||
_this.video.src = window.URL.createObjectURL(stream)
|
||||
}
|
||||
_this.video.onloadedmetadata = function () {
|
||||
_this.video.play();
|
||||
};
|
||||
_this.init();
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
});
|
||||
},
|
||||
// 初始化设置
|
||||
init() {
|
||||
this.screenshotCanvas = document.getElementById('screenshotCanvas');
|
||||
let canvas = document.getElementById('canvas');
|
||||
let context = canvas.getContext('2d');
|
||||
// 实例化tracker对象
|
||||
let tracker = new window.tracking.ObjectTracker('face');
|
||||
tracker.setInitialScale(4);
|
||||
tracker.setStepSize(2);
|
||||
tracker.setEdgesDensity(0.1);
|
||||
//tracker对象和标签关联
|
||||
window.tracking.track('#video', tracker, {
|
||||
camera: true
|
||||
});
|
||||
let _this = this;
|
||||
//添加事件
|
||||
tracker.on('track', function (event) {
|
||||
// 检测出人脸 绘画人脸位置
|
||||
context.clearRect(0, 0, canvas.width, canvas.height);
|
||||
// 给每个人脸绘制对应的框
|
||||
event.data.forEach(function (rect) {
|
||||
context.strokeStyle = '#0764B7';
|
||||
context.strokeRect(rect.x, rect.y, rect.width, rect.height);
|
||||
// window.plot(rect.x, rect.y, rect.width, rect.height+20);
|
||||
// 避免重复发送请求
|
||||
if (!_this.uploadLock) {
|
||||
_this.uploadLock = true;
|
||||
// 上传图片
|
||||
_this.screenshotAndUpload();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
// 上传图片
|
||||
screenshotAndUpload() {
|
||||
let that = this;
|
||||
// 绘制当前帧图片转换为base64格式
|
||||
let canvas = this.screenshotCanvas;
|
||||
let video = this.video;
|
||||
let ctx = canvas.getContext('2d');
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
|
||||
let base64Img = canvas.toDataURL('image/jpeg');
|
||||
let img = base64Img.split(',')[1];
|
||||
let tolerance = parseFloat(localStorage.getItem('tolerance'));
|
||||
let imgData = {base64: img,tolerance};
|
||||
this.$API.auth.login_face.req(imgData).then((res) => {
|
||||
// debugger;
|
||||
if (res.username) {
|
||||
// this.$message.success(res.username + '识别成功！');
|
||||
let messag = '<div style="font-size:30px"><strong> <i style="font-size:40px">'+res.username+'</i> 识别成功！</strong></div>';
|
||||
this.$message.success({
|
||||
dangerouslyUseHTMLString: true,
|
||||
duration:4000,
|
||||
message: messag
|
||||
});
|
||||
setTimeout(() => {
|
||||
that.uploadLock = false;
|
||||
}, 5000)
|
||||
this.$emit('close')
|
||||
} else {
|
||||
that.uploadLock = false;
|
||||
}
|
||||
}).catch(() => {
|
||||
// 打开锁
|
||||
that.uploadLock = false;
|
||||
});
|
||||
},
|
||||
closeCamera() {
|
||||
this.video.srcObject.getTracks()[0].stop();
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-message .el-icon-success{
|
||||
font-size: 35px!important;
|
||||
}
|
||||
.faceLoginWrap{
|
||||
margin:50px auto 0 auto;
|
||||
}
|
||||
|
||||
#screenshotCanvas {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-box {
|
||||
width: 600px;
|
||||
height: fit-content;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#video {
|
||||
object-fit: fill;
|
||||
-webkit-border-radius: 250px;
|
||||
-moz-border-radius: 250px;
|
||||
border-radius: 250px;
|
||||
}
|
||||
|
||||
video, canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-message .el-icon-success{
|
||||
font-size: 35px!important;
|
||||
}
|
||||
.faceLoginWrap{
|
||||
margin:50px auto 0 auto;
|
||||
}
|
||||
|
||||
#screenshotCanvas {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-box {
|
||||
width: 600px;
|
||||
height: fit-content;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#video {
|
||||
object-fit: fill;
|
||||
-webkit-border-radius: 250px;
|
||||
-moz-border-radius: 250px;
|
||||
border-radius: 250px;
|
||||
}
|
||||
|
||||
video, canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -565,6 +565,16 @@ const routes = [
|
|||
},
|
||||
"component": "ungrouped/electric_hour"
|
||||
},
|
||||
{
|
||||
"name": "energyPicture",
|
||||
"path": "/ungrouped/energyPicture",
|
||||
"meta": {
|
||||
"title": "能源流向",
|
||||
"icon": "el-icon-grid",
|
||||
"perms": ["enm"]
|
||||
},
|
||||
"component": "ungrouped/energyPicture"
|
||||
},
|
||||
{
|
||||
"name": "electricDay",
|
||||
"path": "/ungrouped/electricDay",
|
||||
|
|
|
|||
|
|
@ -232,12 +232,12 @@ export default {
|
|||
path:"ws://49.232.14.174:2226/ws/my/?token=",
|
||||
ws:null,
|
||||
mgroupValues:{
|
||||
电石渣:{total:0,elec:0},
|
||||
原料磨:{total:0,elec:0},
|
||||
煤磨:{total:0,elec:0},
|
||||
回转窑:{total:0,elec:0},
|
||||
水泥磨:{total:0,elec:0},
|
||||
水泥包装:{total:0,elec:0}
|
||||
电石渣:{total:'0',elec:'0'},
|
||||
原料磨:{total:'0',elec:'0'},
|
||||
煤磨:{total:'0',elec:'0'},
|
||||
回转窑:{total:'0',elec:'0'},
|
||||
水泥磨:{total:'0',elec:'0'},
|
||||
水泥包装:{total:'0',elec:'0'}
|
||||
},
|
||||
}
|
||||
},
|
||||
|
|
@ -256,26 +256,26 @@ export default {
|
|||
this.$nextTick(() => {
|
||||
this.$API.enm.enstat.req({type:'month_s',month_s:month,year_s:year,page:0}).then((res1) => {
|
||||
console.log('工段数据：',res1)
|
||||
debugger
|
||||
// debugger
|
||||
res1.forEach(item=>{
|
||||
if(item.mgroup_name=='电石渣'){
|
||||
that.mgroupValues.电石渣.total = item.total_production;
|
||||
that.mgroupValues.电石渣.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.电石渣.total = item.total_production+'';
|
||||
that.mgroupValues.电石渣.elec=item.elec_consume_unit+'';
|
||||
}else if(item.mgroup_name=='原料磨'){
|
||||
that.mgroupValues.原料磨.total=item.total_production;
|
||||
that.mgroupValues.原料磨.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.原料磨.total=item.total_production+'';
|
||||
that.mgroupValues.原料磨.elec=item.elec_consume_unit+'';
|
||||
}else if(item.mgroup_name=='煤磨'){
|
||||
that.mgroupValues.煤磨.total=item.total_production;
|
||||
that.mgroupValues.煤磨.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.煤磨.total=item.total_production+'';
|
||||
that.mgroupValues.煤磨.elec=item.elec_consume_unit+'';
|
||||
}else if(item.mgroup_name=='回转窑'){
|
||||
that.mgroupValues.回转窑.total=item.total_production;
|
||||
that.mgroupValues.回转窑.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.回转窑.total=item.total_production+'';
|
||||
that.mgroupValues.回转窑.elec=item.elec_consume_unit+'';
|
||||
}else if(item.mgroup_name=='水泥磨'){
|
||||
that.mgroupValues.水泥磨.total=item.total_production;
|
||||
that.mgroupValues.水泥磨.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.水泥磨.total=item.total_production+'';
|
||||
that.mgroupValues.水泥磨.elec=item.elec_consume_unit+'';
|
||||
}else if(item.mgroup_name=='水泥包装'){
|
||||
that.mgroupValues.水泥包装.total=item.total_production;
|
||||
that.mgroupValues.水泥包装.elec=item.elec_consume_unit;
|
||||
that.mgroupValues.水泥包装.total=item.total_production+'';
|
||||
that.mgroupValues.水泥包装.elec=item.elec_consume_unit+'';
|
||||
}
|
||||
})
|
||||
})
|
||||
|
|
@ -730,7 +730,6 @@ export default {
|
|||
control_main.isVertical = false
|
||||
control_main.top = '-40%';
|
||||
control_main.left = '-20%';
|
||||
let meshList = [];
|
||||
advancedTexture.addControl(control_main);
|
||||
|
||||
var button_main = BABYLON_GUI.Button.CreateSimpleButton("button_main", "主视角");
|
||||
|
|
@ -753,6 +752,7 @@ export default {
|
|||
BABYLON.Animation.CreateAndStartAnimation('at61', camera, 'target', 45, 200, camera.target, that.initialTarget, 0, ease);
|
||||
}
|
||||
})
|
||||
|
||||
// 高亮显示mesh名
|
||||
const mesh_rect = new BABYLON_GUI.Rectangle('mesh_rect');
|
||||
mesh_rect.width = "100px";
|
||||
|
|
@ -774,8 +774,8 @@ export default {
|
|||
// console.table(scene.meshes)
|
||||
// 判断字符串是否包含中文------ /[\u4E00-\u9FA5]+/g.test(str)
|
||||
for (let key in that.sectionNames) {
|
||||
var value = that.sectionNames[key];
|
||||
var mesh = scene.getMeshByName(key);
|
||||
const value = that.sectionNames[key];
|
||||
const mesh = scene.getMeshByName(key);
|
||||
if (mesh) {
|
||||
//建筑标签
|
||||
const rect1 = new BABYLON_GUI.Rectangle(value + '_rect');
|
||||
|
|
@ -785,18 +785,30 @@ export default {
|
|||
rect1.color = "Orange";
|
||||
rect1.thickness = 2;
|
||||
rect1.background = "green";
|
||||
advancedTexture.addControl(rect1);
|
||||
|
||||
var label = new BABYLON_GUI.TextBlock(value + '_label');
|
||||
label.text = value;
|
||||
label.color = 'white';
|
||||
label.fontSize = '14px';
|
||||
rect1.addControl(label);
|
||||
|
||||
rect1.isPointerBlocker = true; // 防止点击穿透
|
||||
advancedTexture.addControl(rect1);
|
||||
var label = new BABYLON_GUI.TextBlock(value + '_label');
|
||||
label.text = value;
|
||||
label.color = 'white';
|
||||
label.fontSize = '14px';
|
||||
rect1.addControl(label);
|
||||
rect1.linkWithMesh(mesh);
|
||||
rect1.linkOffsetY = -30;
|
||||
if(value=='电石渣'){
|
||||
rect1.linkOffsetY = -200;
|
||||
var line = new BABYLON_GUI.Line();
|
||||
line.lineWidth = 4;
|
||||
line.color = "Orange";
|
||||
line.y1 = 10;
|
||||
line.y2 = 15;
|
||||
line.linkOffsetY = -15;
|
||||
line.dash = [3, 3];
|
||||
advancedTexture.addControl(line);
|
||||
line.linkWithMesh(mesh);
|
||||
let connectedControl = advancedTexture.getControlByName('电石渣_rect')
|
||||
line.connectedControl = connectedControl;
|
||||
// line.connectedControl = rect1;
|
||||
// line.connectedControl = data_view;
|
||||
}
|
||||
rect1.onPointerDownObservable.add(() => {
|
||||
|
||||
|
|
@ -820,6 +832,8 @@ export default {
|
|||
}
|
||||
let dataViewName = rect1.name.split('_')[0] + '_data_view';
|
||||
that.getMgroupChartData(dataViewName);
|
||||
that.activeSectionName = dataViewName;
|
||||
that.activeSection = 2;
|
||||
let dataView = advancedTexture.getControlByName(dataViewName);
|
||||
if (dataView) {
|
||||
// // 在这里进行矩形的操作
|
||||
|
|
@ -877,12 +891,14 @@ export default {
|
|||
rc.fontSize = '16px';
|
||||
rc.text = "单位产品电耗：";
|
||||
}else if(j==1&&i==0){
|
||||
rc.text = that.mgroupValues[value].total;
|
||||
// rc.text = that.mgroupValues[value].total;
|
||||
rc.text = "123";
|
||||
rc.width = "80px";
|
||||
rc.fontSize = '18px';
|
||||
rc.color = "rgb(44,237,255)";
|
||||
}else if(j==1&&i==1){
|
||||
rc.text = that.mgroupValues[value].elec;
|
||||
// rc.text = that.mgroupValues[value].total;
|
||||
rc.text = "456";
|
||||
rc.width = "80px";
|
||||
rc.fontSize = '18px';
|
||||
rc.color = "rgb(44,237,255)";
|
||||
|
|
@ -910,15 +926,6 @@ export default {
|
|||
data_view.linkOffsetY = -120;
|
||||
if(value=='电石渣'){
|
||||
data_view.linkOffsetY = -290;
|
||||
var line = new BABYLON_GUI.Line();
|
||||
line.lineWidth = 4;
|
||||
line.color = "Orange";
|
||||
line.y2 = 110;
|
||||
line.linkOffsetY = -15;
|
||||
line.dash = [3, 3];
|
||||
advancedTexture.addControl(line);
|
||||
line.linkWithMesh(mesh);
|
||||
line.connectedControl = data_view;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -952,13 +959,45 @@ export default {
|
|||
control_main.addControl(checkbox);
|
||||
|
||||
var header = new BABYLON_GUI.TextBlock();
|
||||
|
||||
header.text = "自动旋转";
|
||||
header.width = "80px";
|
||||
header.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
|
||||
header.color = "white";
|
||||
control_main.addControl(header);
|
||||
// 工段数据checkbox
|
||||
var checkbox1 = new BABYLON_GUI.Checkbox();
|
||||
checkbox1.width = "20px";
|
||||
checkbox1.height = "20px";
|
||||
checkbox1.isChecked = true;
|
||||
checkbox1.marginLeft = '16px'
|
||||
checkbox1.color = "green";
|
||||
checkbox1.onIsCheckedChangedObservable.add(function (value) {
|
||||
// debugger;
|
||||
if (value) {
|
||||
for (let key in that.sectionNames) {
|
||||
let name = that.sectionNames[key] + '_data_view';
|
||||
console.log(name)
|
||||
let dataView = advancedTexture.getControlByName(name);
|
||||
dataView.isVisible = true;
|
||||
}
|
||||
} else {
|
||||
for (let key in that.sectionNames) {
|
||||
let name = that.sectionNames[key] + '_data_view';
|
||||
console.log(name)
|
||||
let dataView = advancedTexture.getControlByName(name);
|
||||
dataView.isVisible = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
control_main.addControl(checkbox1);
|
||||
|
||||
var header1 = new BABYLON_GUI.TextBlock();
|
||||
header1.text = "工段数据";
|
||||
header1.width = "80px";
|
||||
header1.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
|
||||
header1.color = "white";
|
||||
control_main.addControl(header1);
|
||||
|
||||
// 添加抓取事件
|
||||
canvas.addEventListener('mousemove', (event) => {
|
||||
// 使用 scene.pick 检测鼠标拾取
|
||||
|
|
@ -1048,32 +1087,32 @@ export default {
|
|||
|
||||
|
||||
},
|
||||
// getMgroupChartData(name){
|
||||
// var that = this;
|
||||
// let obj = {};
|
||||
// obj.type = 'month_s';
|
||||
// obj.start_time = that.start_time;
|
||||
// obj.end_time = that.end_time;
|
||||
// obj.mgroup__name=val;
|
||||
// obj.page=0;
|
||||
// this.$API.enm.enstat.req(obj).then((res) => {
|
||||
// let list0 = res.sort(this.compare('month_s'));
|
||||
// let list = list0.sort(this.compare('year_s'));
|
||||
// let seriesData4 = [0,0,0,0,0,0],
|
||||
// seriesData5 = [0,0,0,0,0,0],
|
||||
// seriesData6 = [0,0,0,0,0,0];
|
||||
// list.forEach(item=>{
|
||||
// let index = that.arrMonth.indexOf(item.month_s);
|
||||
// seriesData4[index] = Number(item.elec_consume_unit)
|
||||
// seriesData5[index] = Number(item.total_production)
|
||||
// seriesData6[index] = Number(item.run_rate)
|
||||
// })
|
||||
// that.seriesData4=seriesData4;
|
||||
// that.seriesData5=seriesData5;
|
||||
// that.seriesData6=seriesData6;
|
||||
// that.initCharts1();
|
||||
// })
|
||||
// },
|
||||
getMgroupChartData(name){
|
||||
var that = this;
|
||||
let obj = {};
|
||||
obj.type = 'month_s';
|
||||
obj.start_time = that.start_time;
|
||||
obj.end_time = that.end_time;
|
||||
obj.mgroup__name=name;
|
||||
obj.page=0;
|
||||
this.$API.enm.enstat.req(obj).then((res) => {
|
||||
let list0 = res.sort(this.compare('month_s'));
|
||||
let list = list0.sort(this.compare('year_s'));
|
||||
let seriesData4 = [0,0,0,0,0,0],
|
||||
seriesData5 = [0,0,0,0,0,0],
|
||||
seriesData6 = [0,0,0,0,0,0];
|
||||
list.forEach(item=>{
|
||||
let index = that.arrMonth.indexOf(item.month_s);
|
||||
seriesData4[index] = Number(item.elec_consume_unit)
|
||||
seriesData5[index] = Number(item.total_production)
|
||||
seriesData6[index] = Number(item.run_rate)
|
||||
})
|
||||
that.seriesData4=seriesData4;
|
||||
that.seriesData5=seriesData5;
|
||||
that.seriesData6=seriesData6;
|
||||
that.initCharts1();
|
||||
})
|
||||
},
|
||||
},
|
||||
unmounted() {
|
||||
this.close();
|
||||
|
|
|
|||
|
|
@ -37,17 +37,16 @@
|
|||
stripe
|
||||
@resetQuery="resetQuery"
|
||||
>
|
||||
<el-table-column label="所属部门" prop="deptName" show-overflow-tooltip>
|
||||
<el-table-column label="发生类型" prop="buy_date">
|
||||
</el-table-column>
|
||||
<el-table-column label="事件信息" prop="voice_msg" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column label="所属工段" prop="mgroupName">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.enm_data">{{ scope.row.enm_data.mgroup_name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所在班组" prop="teamName">
|
||||
</el-table-column>
|
||||
<el-table-column label="所在班次" prop="shiftName" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column label="发生时间" prop="production_date">
|
||||
</el-table-column>
|
||||
<el-table-column label="发生类型" prop="buy_date">
|
||||
<el-table-column label="发生时间" prop="happen_time">
|
||||
</el-table-column>
|
||||
<el-table-column label="处理超时">
|
||||
<template #default="scope">
|
||||
|
|
@ -56,11 +55,13 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.mark" type="warning">是</el-tag>
|
||||
<el-tag v-else type="success" effect="plain">否</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="处理人">
|
||||
<template #default="scope">{{ scope.row.keeper_name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" show-overflow-tooltip prop="memo">
|
||||
<template #default="scope">{{ scope.row.handle_user }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="center" width="120px">
|
||||
<template #default="scope">
|
||||
|
|
|
|||
|
|
@ -170,14 +170,16 @@
|
|||
</el-col>
|
||||
<el-col>
|
||||
<el-card header="报警" style="border-radius: 5px;box-shadow: none;">
|
||||
<div class="itemsWrap" style="margin-bottom:10px;margin-left:10px">
|
||||
<el-badge :value="warningNum" :max="99" class="item">
|
||||
<div class="items" style="margin:0">
|
||||
<div class="item-number">能耗超标报警</div>
|
||||
</div>
|
||||
</el-badge>
|
||||
|
||||
</div>
|
||||
<el-badge :value="warningNum" :max="99" style="margin: 10px;">
|
||||
<div class="items" style="margin:0;" @click="interEvent">
|
||||
<div class="item-number">能耗超标报警</div>
|
||||
</div>
|
||||
</el-badge>
|
||||
<el-badge :value="warningNum2" :max="99" style="margin: 10px;">
|
||||
<div class="items" style="margin:0" @click="interEquipment">
|
||||
<div class="item-number">设备检验</div>
|
||||
</div>
|
||||
</el-badge>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
@ -197,6 +199,7 @@
|
|||
yearData:[],
|
||||
monthData:[],
|
||||
warningNum:0,
|
||||
warningNum2:0,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -273,11 +276,16 @@
|
|||
console.log("socket已经关闭");
|
||||
}
|
||||
},
|
||||
//获取报警事件数量
|
||||
getWraningNum(){
|
||||
let that = this;
|
||||
that.$API.ecm.event.list.req({cates__code__in:'consume_exceed',is_handled:0,page:1}).then((res) => {
|
||||
that.warningNum = res.count;
|
||||
})
|
||||
that.$API.em.equipment.list.req({tag:'near_check',type:20,page:1}).then((res) => {
|
||||
debugger;
|
||||
that.warningNum2 = res.count;
|
||||
})
|
||||
},
|
||||
getYearData(){
|
||||
let that = this;
|
||||
|
|
@ -314,6 +322,12 @@
|
|||
this.time = this.$TOOL.dateFormat(new Date(), 'hh:mm:ss')
|
||||
this.day = this.$TOOL.dateFormat(new Date(), 'yyyy年MM月dd日')
|
||||
},
|
||||
interEvent(){
|
||||
this.$router.replace({path:'/events'})
|
||||
},
|
||||
interEquipment(){
|
||||
this.$router.replace({path:'/em/equipmentc'})
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -85,9 +85,7 @@
|
|||
</el-table-column> -->
|
||||
<el-table-column label="考勤推测">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.type==10 || scope.row.type==20">
|
||||
<el-tag :type="type_[scope.row.type].color">{{type_[scope.row.type].label}}</el-tag>
|
||||
</span>
|
||||
<span><el-tag :type="type_[scope.row.type].color">{{type_[scope.row.type].label}}</el-tag></span>
|
||||
<span v-if="(scope.row.type==10 || scope.row.type==20)&&scope.row.exception_type!==null">-</span>
|
||||
<span v-if="scope.row.exception_type==10" class="nomalState type1">在岗时间短</span>
|
||||
<span v-if="scope.row.exception_type==20" class="nomalState type2">在岗时间长</span>
|
||||
|
|
@ -120,6 +118,7 @@
|
|||
type_:{
|
||||
10: {"label": "上班打卡", "color": ""},
|
||||
20: {"label": "下班打卡", "color": "success"},
|
||||
30: {"label": "忽略", "color": "info"},
|
||||
},
|
||||
epOptions:{
|
||||
"employee": "正式员工",
|
||||
|
|
|
|||
|
|
@ -56,6 +56,18 @@
|
|||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<charts
|
||||
v-if="asynDialog"
|
||||
:type="type"
|
||||
:title="title"
|
||||
:cate="cate"
|
||||
:apiObj = "apiObj"
|
||||
:mgroup="query.mgroup"
|
||||
:modelValue="modelValue"
|
||||
:showClose="showClose"
|
||||
:echartType='echartType'
|
||||
@closed="asynDialog = false"
|
||||
></charts>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -68,6 +80,14 @@
|
|||
month:'',
|
||||
days:'',
|
||||
},
|
||||
cate:'设备名',
|
||||
type:'hour_s',
|
||||
showClose:true,
|
||||
modelValue:true,
|
||||
echartType:'line',
|
||||
apiObj:this.$API.enm.mpoint.stat,
|
||||
title:'全场电量小时统计',
|
||||
asynDialog:false,//趋势图显示
|
||||
tableDatas:[
|
||||
['原料车间','电石渣','烘干破主电机',0,0,0,0 ],//0
|
||||
['原料车间','电石渣合计',0,0,0,0 ],
|
||||
|
|
@ -249,19 +269,6 @@
|
|||
if(b&&Number(b)){sum=sum+b;}
|
||||
if(c&&Number(c)){sum=sum+c;}
|
||||
if(d&&Number(d)){sum=sum+d;}
|
||||
// if(a!==''){
|
||||
// if(b!==''){
|
||||
// sum = a + b;
|
||||
// }else{
|
||||
// sum = a;
|
||||
// }
|
||||
// }else{
|
||||
// if(b!==''){
|
||||
// sum = b;
|
||||
// }else{
|
||||
// sum = '';
|
||||
// }
|
||||
// }
|
||||
return sum;
|
||||
}
|
||||
let obj = {};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,28 @@
|
|||
<template>
|
||||
<el-card style="height: 100%;background-image: url('/img/elec_flow.png');background-size: contain;background-repeat: no-repeat;">
|
||||
<!-- <el-card style="height: 100%;"> -->
|
||||
<!-- <img src="/img/elec_flow.png" class="flowImg" style="max-height: 100%;object-fit:contain;" > -->
|
||||
</el-card>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
imgSrc:''
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.flowImg{
|
||||
display: inline-block;
|
||||
width: clac(100%-210px);
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue