zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

数据大屏多次请求问题

This commit is contained in:
shijing 2024-01-22 13:45:09 +08:00
parent 940c1b6337
commit f916b09ec6
1 changed files with 197 additions and 188 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

301
src/views/bigScreen/index_photon.vue
View File

@ -121,32 +121,36 @@
<p class="title">{{ dialogData.deptName }}</p> <p class="title">{{ dialogData.deptName }}</p>
<div class="infoCantier"> <div class="infoCantier">
<div class="leftBlock"> <div class="leftBlock">
<el-progress :width="70" type="circle" color="rgba(54, 217, 187, 1)" :percentage="25" <el-progress :width="70" type="circle" color="rgba(54, 217, 187, 1)" :percentage="dialogData.percentage"
id="dashbordProcess"> id="dashbordProcess">
<template #default="{ percentage }"> <span class="percentage-value" style="font-size: 16px">{{ dialogData.percentage }}%</span>
<span class="percentage-value" style="font-size: 16px">{{ percentage }}%</span>
</template>
</el-progress> </el-progress>
<span>完成进度</span> <span>完成进度</span>
</div> </div>
<div class="rightBlock"> <div class="rightBlock">
<div> <div>
<p>昨日产量</p> <p>昨日产量</p>
<p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> <!-- <p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> -->
</div> </div>
<div class="countWrap"> <div class="countWrap">
<div v-if="currentObj.deptName == '10车间' || currentObj.deptName == '6车间'"> <div v-if="dialogData.deptName == '光纤预制管生产车间' || dialogData.deptName == '光学精密加工车间'">
<p>光纤预制管</p> <p>光纤预制管</p>
<p> <span class="numberFont">390{{ currentObj.生产数 }}</span><span class="numberUnit">件</span></p> <p> <span class="numberFont">{{ dialogData.count_guan }}</span><span class="numberUnit">件</span>
</p>
</div> </div>
<div v-if="currentObj.deptName == '7车间' || currentObj.deptName == '6车间'"> <div v-if="dialogData.deptName == '光纤预制棒生产车间' || dialogData.deptName == '光学精密加工车间'">
<p>光纤预制棒</p> <p>光纤预制棒</p>
<p> <span class="numberFont">390{{ currentObj.生产数 }}</span><span class="numberUnit">件</span></p> <p> <span class="numberFont">{{ dialogData.count_bang }}</span><span class="numberUnit">件</span>
</p>
</div>
<div v-if="dialogData.deptName == '玻璃配合料制备车间'">
<p>配粉重量</p>
<p> <span class="numberFont">{{ dialogData.count }}</span><span class="numberUnit">kg</span>
</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- click --> <!-- click -->
<div id="cilckInfoBlock" class="inforBlock clickBlock" v-show="clickVisible"> <div id="cilckInfoBlock" class="inforBlock clickBlock" v-show="clickVisible">
@ -154,30 +158,37 @@
<div class="border_corner border_right_top"></div> <div class="border_corner border_right_top"></div>
<div class="border_corner border_left_bottom"></div> <div class="border_corner border_left_bottom"></div>
<div class="border_corner border_right_bottom"></div> <div class="border_corner border_right_bottom"></div>
<p class="title">{{ currentObj.deptName }}</p> <p class="title">{{ currentData.deptName }}</p>
<div class="infoCantier"> <div class="infoCantier">
<div class="leftBlock"> <div class="leftBlock">
<el-progress :width="100" type="circle" color="rgba(54, 217, 187, 1)" :percentage="25" <el-progress :width="100" type="circle" color="rgba(54, 217, 187, 1)"
id="dashbordProcess"> :percentage="currentData.percentage" id="dashbordProcess">
<template #default="{ percentage }"> <span class="percentage-value" style="font-size: 16px">{{ currentData.percentage }}%</span>
<span class="percentage-value">{{ percentage }}%</span>
</template>
</el-progress> </el-progress>
<p style="text-align:center">完成进度</p> <p style="text-align:center">完成进度</p>
</div> </div>
<div class="rightBlock"> <div class="rightBlock">
<div> <div>
<p>昨日产量</p> <p>昨日产量</p>
<p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> <!-- <p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> -->
</div> </div>
<div class="countWrap"> <div class="countWrap">
<div v-if="dialogData.deptName=='10车间'||dialogData.deptName=='6车间'"> <div v-if="currentData.deptName == '光纤预制管生产车间' || currentData.deptName == '光学精密加工车间'">
<p>预制管</p> <p>光纤预制管</p>
<p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> <p> <span class="numberFont">{{ currentData.count_guan }}</span><span
class="numberUnit">件</span>
</p>
</div> </div>
<div v-if="dialogData.deptName=='7车间'||dialogData.deptName=='6车间'"> <div v-if="currentData.deptName == '光纤预制棒生产车间' || currentData.deptName == '光学精密加工车间'">
<p>预制棒</p> <p>光纤预制棒</p>
<p> <span class="numberFont">390</span><span class="numberUnit">件</span></p> <p> <span class="numberFont">{{ currentData.count_bang }}</span><span
class="numberUnit">件</span>
</p>
</div>
<div v-if="currentData.deptName == '玻璃配合料制备车间'">
<p>配粉重量</p>
<p> <span class="numberFont">{{ currentData.count }}</span><span class="numberUnit">kg</span>
</p>
</div> </div>
</div> </div>
</div> </div>
@ -255,12 +266,13 @@ export default {
currentWeek: '', currentWeek: '',
currentDay: '', currentDay: '',
timerTime: null, timerTime: null,
timerData: null,
start_date: '', start_date: '',
end_date: '', end_date: '',
dialogData: { dialogData: {
deptName: '' deptName: ''
}, },
currentObj: { currentData: {
deptName: '' deptName: ''
}, },
deptName: '10车间', deptName: '10车间',
@ -309,7 +321,8 @@ export default {
label: { label: {
minMargin: 10, minMargin: 10,
edgeDistance: 10, edgeDistance: 10,
fontSize: '12px' fontSize: '12px',
formatter: '{b}: {c}'
}, },
labelLine: { labelLine: {
lineStyle: { lineStyle: {
@ -330,7 +343,28 @@ export default {
data: [] data: []
} }
}, },
yesterday:'' yesterday: '',
dept6Obj: {
deptName: '光学精密加工车间',
percentage: 100,
count_bang: 0,
count_guan: 0,
},
dept7Obj: {
deptName: '光纤预制棒生产车间',
percentage: 100,
count_bang: 0,
},
dept8Obj: {
deptName: '玻璃配合料制备车间',
percentage: 100,
count: 0,
},
dept10Obj: {
deptName: '光纤预制管生产车间',
percentage: 100,
count_guan: 0,
},
} }
}, },
mounted() { mounted() {
@ -342,6 +376,7 @@ export default {
this.blockTableHeight = height1 + 'px'; this.blockTableHeight = height1 + 'px';
document.getElementById('scrollTable').style.height = height1 + 'px' document.getElementById('scrollTable').style.height = height1 + 'px'
this.showTime(); this.showTime();
this.getDeptDetail();
this.$nextTick(() => { this.$nextTick(() => {
that.getsaleOut(); that.getsaleOut();
that.initDomStyle(); that.initDomStyle();
@ -371,7 +406,9 @@ export default {
pieChart.setOption(pieoption, true); pieChart.setOption(pieoption, true);
} }
}, 5000); }, 5000);
that.timerData = setInterval(() => {
that.getDeptDetail();
}, 60000);
that.initChart(); that.initChart();
}) })
//一天的毫秒数 //一天的毫秒数
@ -389,8 +426,6 @@ export default {
weekFirst = week - 1; weekFirst = week - 1;
weekLast = 7 - week; weekLast = 7 - week;
} }
// let time = ' 星期' + '日一二三四五六'.charAt(week);//当前时间周几
let first = new Date(new Date(yesterday.getTime() - (weekFirst * ondDayTime)));//本周周一 let first = new Date(new Date(yesterday.getTime() - (weekFirst * ondDayTime)));//本周周一
let last = new Date(new Date(yesterday.getTime() + (weekLast * ondDayTime)));//本周周日 let last = new Date(new Date(yesterday.getTime() + (weekLast * ondDayTime)));//本周周日
let dateArr = []; let dateArr = [];
@ -402,11 +437,8 @@ export default {
this.weekDateList = dateArr; this.weekDateList = dateArr;
this.start_date = first.getFullYear() + '-' + (first.getMonth() + 1) + '-' + first.getDate(); this.start_date = first.getFullYear() + '-' + (first.getMonth() + 1) + '-' + first.getDate();
this.end_date = last.getFullYear() + '-' + (last.getMonth() + 1) + '-' + last.getDate(); this.end_date = last.getFullYear() + '-' + (last.getMonth() + 1) + '-' + last.getDate();
// let yesterday = new Date(cDate.getTime()-ondDayTime);
this.yesterday = yesterday.getFullYear() + "-" + (yesterday.getMonth() + 1) + "-" + yesterday.getDate(); this.yesterday = yesterday.getFullYear() + "-" + (yesterday.getMonth() + 1) + "-" + yesterday.getDate();
console.log(this.start_date);
console.log(this.end_date);
console.log(this.yesterday);
this.getsaleOut(); this.getsaleOut();
this.getPlanRate(); this.getPlanRate();
this.getMaterialList(); this.getMaterialList();
@ -810,51 +842,6 @@ export default {
line3Chart.setOption(line3option); line3Chart.setOption(line3option);
}) })
}, },
// deptNameChange(deptName) {
// let that = this;
// let obj = {
// query: { start_date: that.start_date, end_date: that.end_date, dept_name: deptName },
// };
// that.$API.bi.dataset.exec.req('lineDay', obj).then((res) => {
// let list = res.data2.ds0;
// let deptData = [];
// if (list.length > 0) {
// list.forEach(item => {
// if (that.deptName == '7车间') {
// that.dept7Data[0].value = that.dept7Data[0].value + item.炸纹;
// that.dept7Data[1].value = that.dept7Data[1].value + item.条纹;
// that.dept7Data[2].value = that.dept7Data[2].value + item.气泡;
// that.dept7Data[3].value = that.dept7Data[3].value + item.弯曲;
// that.dept7Data[4].value = that.dept7Data[4].value + item.其他;
// that.dept7Data[5].value = that.dept7Data[5].value + item.合格数;
// deptData = that.dept7Data;
// } else {
// that.dept10Data[0].value = that.dept10Data[0].value + item.弯曲;
// that.dept10Data[1].value = that.dept10Data[1].value + item.大小头;
// that.dept10Data[2].value = that.dept10Data[2].value + item.偏壁;
// that.dept10Data[3].value = that.dept10Data[3].value + item.结石;
// that.dept10Data[4].value = that.dept10Data[4].value + item.气线;
// that.dept10Data[5].value = that.dept10Data[5].value + item.合格数;
// deptData = that.dept10Data;
// }
// });
// } else {
// if (that.deptName == '7车间') {
// deptData = that.dept7Data;
// } else {
// deptData = that.dept10Data;
// }
// }
// that.deptData = deptData;
// that.pieoption.series.data = deptData;
// let pieoption = that.pieoption;
// let pieDom = document.getElementById('pie');
// let pieChart = echarts.init(pieDom);
// pieChart.clear();
// pieChart.setOption(pieoption, true);
// });
// },
//库存情况
getMaterialList() { getMaterialList() {
let that = this; let that = this;
this.$API.mtm.material.list.req({ page: 0, type: 10, count__gte: 1 }).then(res => { this.$API.mtm.material.list.req({ page: 0, type: 10, count__gte: 1 }).then(res => {
@ -999,50 +986,6 @@ export default {
//关闭灯光 //关闭灯光
// scene.lights[1].setEnabled(false); // scene.lights[1].setEnabled(false);
engine.hideLoadingUI() engine.hideLoadingUI()
// let arrKey = [];
// for (let key in that.nodesLists) {
// arrKey.push(key);
// }
// let heightI = 0;
// that.heightTimer = setInterval(() => {
// let heightKey = arrKey[heightI];
// const meshTimer = scene.getMeshByName(heightKey);
// const hl1Timer = new BABYLON.HighlightLayer("hl1Timer", scene);
// if (meshTimer) {
// if (that.nodesLists[heightKey]) {
// hl1Timer.removeAllMeshes();
// if (highlightLayer) {
// highlightLayer.removeAllMeshes();
// }
// that.getDeptDetail(that.nodesLists[heightKey])
// // 在选中的 meshTimer 上添加高亮效果
// highlightLayer.addMesh(meshTimer, new BABYLON.Color3(0.1, 0.9, 0.9));
// that.currentLightMesh = meshTimer;
// mesh_rect.linkWithMesh(meshTimer);
// let name = meshTimer.name.split('_')[0];
// mesh_name.text = name;
// that.infoVisibel = true;
// hl1Timer.addMesh(meshTimer, new BABYLON.Color3(12 / 255, 250 / 255, 252 / 255), true);
// hl1Timer.blurVerticalSize = 5;
// hl1Timer.blurHorizontalSize = 5;
// function worldToScreen(point, camera, scene, engine) {
// return BABYLON.Vector3.Project(point,
// BABYLON.Matrix.Identity(),
// scene.getTransformMatrix(),
// camera.viewport.toGlobal(engine.getRenderWidth(), engine.getRenderHeight()));
// }
// var pos = worldToScreen(meshTimer.absolutePosition, camera, scene, engine);
// let infoBlock = document.getElementById('inforBlock');
// infoBlock.style.left = (Math.floor(pos.x)) + 'px';
// infoBlock.style.top = (Math.floor(pos.y) - 250) + 'px';
// }
// }
// heightI+=1;
// // if(heightI>4){
// // heightI=0
// // }
// }, 1000);
}, },
//进度条 //进度条
function (evt) { function (evt) {
@ -1097,7 +1040,8 @@ export default {
if (that.nodesLists[key]) { if (that.nodesLists[key]) {
hl1.removeAllMeshes(); hl1.removeAllMeshes();
highlightLayer.removeAllMeshes(); highlightLayer.removeAllMeshes();
that.getDeptDetail(that.nodesLists[key]) that.getDeptData(that.nodesLists[key])
that.dialogData.deptName = that.nodesLists[key];
//单身宿舍.003_primitive3 //单身宿舍.003_primitive3
// 在选中的 mesh 上添加高亮效果 // 在选中的 mesh 上添加高亮效果
highlightLayer.addMesh(mesh, new BABYLON.Color3(0.1, 0.9, 0.9)); highlightLayer.addMesh(mesh, new BABYLON.Color3(0.1, 0.9, 0.9));
@ -1132,14 +1076,14 @@ export default {
const mesh = pickResult.pickedMesh; const mesh = pickResult.pickedMesh;
console.log('mesh', mesh) console.log('mesh', mesh)
if (that.nodesLists[mesh.name]) { if (that.nodesLists[mesh.name]) {
that.getDeptClickData(that.nodesLists[mesh.name])
hl1Click.removeAllMeshes(); hl1Click.removeAllMeshes();
highlightLayer.removeAllMeshes(); highlightLayer.removeAllMeshes();
highlightLayer.addMesh(mesh, new BABYLON.Color3(0.1, 0.9, 0.9)); highlightLayer.addMesh(mesh, new BABYLON.Color3(0.1, 0.9, 0.9));
hl1Click.addMesh(mesh, new BABYLON.Color3(12 / 255, 250 / 255, 252 / 255), true); hl1Click.addMesh(mesh, new BABYLON.Color3(12 / 255, 250 / 255, 252 / 255), true);
hl1Click.blurVerticalSize = 5; hl1Click.blurVerticalSize = 5;
hl1Click.blurHorizontalSize = 5; hl1Click.blurHorizontalSize = 5;
that.currentObj.deptName = that.nodesLists[mesh.name]; that.currentData.deptName = that.nodesLists[mesh.name];
if (camera.target != mesh.position) { if (camera.target != mesh.position) {
that.clickVisible = true; that.clickVisible = true;
// 计算新的相机位置 // 计算新的相机位置
@ -1169,33 +1113,94 @@ export default {
}); });
this.engine = engine; this.engine = engine;
this.scene = scene; this.scene = scene;
// console.log('scene:',scene)
window.addEventListener("resize", function () { window.addEventListener("resize", function () {
engine.resize(); engine.resize();
}); });
}, },
getDeptDetail(name) { getDeptData(name) {
this.infoVisibel = true;
console.log('hoverName', name)
if (name == '光学精密加工车间') { //6
this.dialogData = this.dept6Obj;
} else if (name == '光纤预制棒生产车间') {//7
this.dialogData = this.dept7Obj;
} else if (name == '光纤预制管生产车间') {//8
this.dialogData = this.dept8Obj;
} else if (name == '玻璃配合料制备车间') {//10
this.dialogData = this.dept10Obj;
}
},
getDeptClickData(name) {
console.log('clickName', name)
if (name == '光学精密加工车间') { //6
this.currentData = this.dept6Obj;
} else if (name == '光纤预制棒生产车间') {//7
this.currentData = this.dept7Obj;
} else if (name == '玻璃配合料制备车间') {//8
this.currentData = this.dept8Obj;
} else if (name == '光纤预制管生产车间') {//10
this.currentData = this.dept10Obj;
}
},
getDeptDetail() {
let that = this; let that = this;
if (that.currentObj.deptName == name && that.clickVisible) { let obj6 = { query: { start_date: that.yesterday, end_date: that.yesterday, dept_name: '6车间' } };
that.dialogData.deptName = name; let obj7 = { query: { start_date: that.yesterday, end_date: that.yesterday, dept_name: '7车间' } };
} else { let obj8 = { handle_date: that.yesterday, page: 0, mgroup__belong_dept__name: '8车间' };
that.infoVisibel = true; let obj10 = { query: { start_date: that.yesterday, end_date: that.yesterday, dept_name: '10车间' } };
that.dialogData.deptName = name; that.$API.bi.dataset.exec.req('lineDay', obj6).then((res6) => {
// console.log('6生产车间昨日统计:', res6);
let data = res6.data2.ds0;
let count = 0, count_real = 0;
if (data.length > 0) {
data.forEach((item) => {
if (item.物料名.indexOf('棒')) {
that.dept6Obj.count_bang = item.合格数;
count += item.合格数;
count_real += item.生产数;
}
if (item.物料名.indexOf('管')) {
that.dept6Obj.count_guan = item.合格数;
count += item.合格数;
count_real += item.生产数;
}
})
if (count_real !== 0) {
that.dept6Obj.percentage = (count / count_real).toFixed(2) * 100 + '%';
}
}
});
that.$API.bi.dataset.exec.req('lineDay', obj7).then((res7) => {
// console.log('7生产车间昨日统计:', res7);
let data = res7.data2.ds0;
if (data.length > 0) {
that.dept7Obj.count_bang = data[0].合格数;
if (data[0].生产数 !== 0) {
that.dept7Obj.percentage = (data[0].合格数 / data[0].生产数).toFixed(2) * 100 + '%';
}
}
});
//8车间配粉接口调用
that.$API.wpm.mlog.list.req(obj8).then((res8) => {
// console.log('8生产车间昨日统计:', res8);
let count = 0;
if (res8.length > 0) {
res8.forEach((item) => {
let itemcount = item.count_real * item.count_real_eweight;
count += itemcount;
})
}
that.dept8Obj.count = count;
});
that.$API.bi.dataset.exec.req('lineDay', obj10).then((res10) => {
// console.log('10生产车间昨日统计:', res10);
let data = res10.data2.ds0;
if (data.length > 0) {
that.dept10Obj.count_guan = data[0].合格数;
if (data[0].生产数 !== 0) {
that.dept10Obj.percentage = (data[0].合格数 / data[0].生产数).toFixed(2) * 100 + '%';
} }
let obj = {
query: { start_date: that.yesterday, end_date: that.yesterday, dept_name: name },
};
that.$API.bi.dataset.exec.req('lineDay', obj).then((res1) => {
console.log('生产车间按日统计:', res1);
let list1 = res1.data2.ds0;
if (name == '6车间') {
that.currentObj = list1[0];
that.currentObj = list1[0]
} else if (name == '7车间' || name == '10车间') {
that.currentObj = list1[0];
} }
debugger;
}); });
}, },
initChart() { initChart() {
@ -1611,21 +1616,25 @@ export default {
}, },
circleClose() { circleClose() {
this.clickVisible = false; this.clickVisible = false;
this.currentObj.deptName = ''; this.currentData.deptName = '';
}, },
}, },
beforeUnmount() { beforeUnmount() {
let that = this; let that = this;
clearInterval(that.timerTime); clearInterval(that.timerTime);
clearInterval(that.timerData);
clearInterval(that.notokTimer); clearInterval(that.notokTimer);
that.timerTime = null; that.timerTime = null;
that.timerData = null;
that.notokTimer = null; that.notokTimer = null;
}, },
beforeDestoryed() { beforeDestoryed() {
let that = this; let that = this;
clearInterval(that.timerTime); clearInterval(that.timerTime);
clearInterval(that.timerData);
clearInterval(that.notokTimer); clearInterval(that.notokTimer);
that.timerTime = null; that.timerTime = null;
that.timerData = null;
that.notokTimer = null; that.notokTimer = null;
}, },