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

Merge branch 'v2' of https://e.coding.net/ctcdevteam/ehs/ehs_web into v2

This commit is contained in:
shijing 2024-01-23 11:19:14 +08:00
parent fa600610d9 9ea6c53725
commit 376a0900e1
1 changed files with 183 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

236
src/views/bigScreen/index_enm.vue
View File

@ -170,8 +170,9 @@ export default {
currentLightMesh: null,
activeSection: 2,
activeSectionName: '回转窑',
updateTime: '2023-08-17 16:00:00',
updateTime: '',
basicOption: {
color: 'rgb(1,235,239)',
backgroundColor: '',
xAxis: {
data: ['一月', '二月', '三月', '四月', '五月', '六月'],
@ -225,6 +226,7 @@ export default {
chart6Option: {},
seriesData1: [0, 0, 0, 0, 0, 0],
seriesData2: [0, 0, 0, 0, 0, 0],
seriesData2_2: [0, 0, 0, 0, 0, 0],
seriesData3: [0, 0, 0, 0, 0, 0],
seriesData3_2: [0, 0, 0, 0, 0, 0],
seriesData4: [0, 0, 0, 0, 0, 0],
@ -240,6 +242,62 @@ export default {
水泥磨: { total: '0', elec: '0' },
水泥包装: { total: '0', elec: '0' }
},
sectionDatas: {
回转窑: {
elec_consume_unit: 29,
total_production: 2541,
coal_consume_unit: 105,
run_rate: 100,
charts_ele: [30, 29, 28, 31, 28, 16],
charts_prod: [2530, 2698, 2600, 2550, 2610, 2000],
charts_rate: [100, 100, 100, 100, 100, 100],
},
电石渣: {
elec_consume_unit: 4,
total_production: 1523,
coal_consume_unit: '',
run_rate: 100,
charts_ele: [3, 6, 4, 7, 5, 3],
charts_prod: [2015, 2698, 2904, 2550, 2610, 1200],
charts_rate: [100, 100, 100, 100, 100, 100],
},
原料磨: {
elec_consume_unit: 15,
total_production: 3230,
coal_consume_unit: '',
run_rate: 100,
charts_ele: [16, 15, 17, 15, 16, 10],
charts_prod: [3204, 3500, 3385, 3461, 3359, 2000],
charts_rate: [100, 100, 100, 100, 100, 100],
},
煤磨: {
elec_consume_unit: 36,
total_production: 420,
coal_consume_unit: '',
run_rate: 100,
charts_ele: [35, 37, 36, 37, 36, 20],
charts_prod: [426, 445, 425, 449, 438, 265],
charts_rate: [100, 100, 100, 100, 100, 100],
},
水泥磨: {
elec_consume_unit: 35,
total_production: 3063,
coal_consume_unit: '',
run_rate: 100,
charts_ele: [35, 37, 36, 37, 36, 20],
charts_prod: [3204, 3500, 3385, 3461, 3359, 2000],
charts_rate: [100, 100, 100, 100, 100, 100],
},
水泥包装: {
elec_consume_unit: 2,
total_production: 1000,
coal_consume_unit: '',
run_rate: 100,
charts_ele: [1, 3, 2, 3, 2, 1],
charts_prod: [1052, 1462, 1268, 1389, 1156, 800],
charts_rate: [100, 100, 100, 100, 100, 100],
}
}
}
},
mounted() {
@ -253,6 +311,7 @@ export default {
that.nowDay = day;
that.query.year_s = year;
that.query.month_s = month;
that.updateTime = myDate.getFullYear() + '-' + (myDate.getMonth() + 1) + '-' + myDate.getDate() + ' ' + myDate.getHours() + ':' + myDate.getMinutes() + ':' + myDate.getSeconds();
this.initDomStyle();
this.$nextTick(() => {
this.$API.enm.enstat.req({ type: 'month_s', month_s: month, year_s: year, page: 0 }).then((res1) => {
@ -305,6 +364,8 @@ export default {
let item = arr[i] + '月'
xAxisData.push(item);
}
// 模拟数据
xAxisData = ['1.19', '1.20', '1.21', '1.22', '1.23', '1.24'];
let month0 = arr[0] > 9 ? arr[0] : '0' + arr[0];
let start_time = year_s + '-' + month0 + '-01 10:00:00';
that.arrMonth = arr;
@ -316,6 +377,9 @@ export default {
this.getSectionData();
this.getDayData();
this.init();
setTimeout(() => {
this.getMockData()
}, 1000);
},
beforeUnmount() {
// 性能优化
@ -366,10 +430,10 @@ export default {
// 监听并处理error事件
this.ws.onerror = function (error) {
console.log('ws断开,尝试重连')
setTimeout(() => {
this.ws = null;
this.init()
}, 5000)
// setTimeout(() => {
// this.ws = null;
// this.init()
// }, 5000)
}
}
@ -389,6 +453,37 @@ export default {
return a[property] - b[property];
}
},
getMockData() {
let that = this;
this.factoryData = {
elec_consume: 10983267,
pcoal_consume: 9500,
water_consume: 12825,
cair_consume: 676534
}
this.mgroupValues = {
电石渣: { total: 1523, elec: 4 },
原料磨: { total: 3230, elec: 15 },
煤磨: { total: 420, elec: 36 },
回转窑: { total: 2541, elec: 29 },
水泥磨: { total: 3063, elec: 35 },
水泥包装: { total: 1000, elec: 2 }
}
this.sectionData = this.sectionDatas[this.activeSectionName]
setInterval(() => {
this.factoryData.elec_consume += Math.floor(Math.random() * 10);
this.factoryData.pcoal_consume += Math.floor(Math.random() * 10);
this.factoryData.water_consume += Math.floor(Math.random() * 10);
this.factoryData.cair_consume += Math.floor(Math.random() * 10);
this.sectionDatas[this.activeSectionName].total_production += Math.floor(Math.random() * 10);
this.sectionDatas[this.activeSectionName].elec_consume_unit += Math.floor(Math.random() * 1);
this.sectionDatas[this.activeSectionName].charts_ele[5] = this.sectionDatas[this.activeSectionName].elec_consume_unit;
this.sectionDatas[this.activeSectionName].charts_prod[5] = this.sectionDatas[this.activeSectionName].total_production;
let data = new Date();
that.updateTime = data.getFullYear() + '-' + (data.getMonth() + 1) + '-' + data.getDate() + ' ' + data.getHours() + ':' + data.getMinutes() + ':' + data.getSeconds();
}, 10000)
},
getFactoryData() {
var that = this;
that.$API.enm.enstat2.req(that.query).then((res) => {
@ -420,6 +515,15 @@ export default {
that.seriesData2 = seriesData2;
that.seriesData3 = seriesData3;
that.seriesData3_2 = seriesData3_2;
// 模拟数据
that.seriesData1 = [303468, 303524, 312095, 305684, 307468, 223420]
that.chart1Option.yAxis.min = 200000;
that.seriesData2 = [425, 430, 436, 430, 443, 340];
that.seriesData2_2 = [586, 560, 576, 555, 543, 205];
that.chart2Option.yAxis.min = 100;
that.seriesData3 = [20456, 24783, 21430, 22354, 25531, 15687];
// that.seriesData3 = [586, 560, 576, 555, 543, 205]
that.chart3Option.yAxis.min = 15000;
that.initCharts();
})
},
@ -446,6 +550,15 @@ export default {
that.seriesData4 = seriesData4;
that.seriesData5 = seriesData5;
that.seriesData6 = seriesData6;
// 模拟数据
that.seriesData4 = this.sectionDatas.回转窑.charts_ele;
that.seriesData5 = this.sectionDatas.回转窑.charts_prod;
that.seriesData6 = this.sectionDatas.回转窑.charts_rate;
// that.chart4Option.yAxis.min = 200000;
// that.seriesData5 = [425, 430, 436, 430, 443, 340];
// that.chart5Option.yAxis.min = 300;
// that.seriesData6 = [586, 560, 576, 555, 543, 205]
// that.chart6Option.yAxis.min = 500;
that.initCharts1();
})
},
@ -487,23 +600,23 @@ export default {
that.setChart('chart1', that.chart1Option);
this.chart2Option = deepCopy(that.basicOption)
this.chart2Option.series[0].type = 'line';
this.chart2Option.series[0].data = that.seriesData2;
this.chart2Option.series[1] = {
name: '工业水',
type: 'line',
barWidth: 15,
label: {
show: true,
position: 'top'
},
emphasis: {
focus: 'series'
},
data: that.seriesData2_2
},
this.chart2Option.series[0].data = that.seriesData2;
this.setChart('chart2', this.chart2Option);
this.chart3Option = deepCopy(that.basicOption)
this.chart3Option.series = [
{
name: '工业水',
type: 'bar',
barWidth: 15,
label: {
show: true,
position: 'top'
},
emphasis: {
focus: 'series'
},
data: that.seriesData3
},
{
name: '压缩空气',
type: 'bar',
@ -511,7 +624,7 @@ export default {
emphasis: {
focus: 'series'
},
data: that.seriesData3_2
data: that.seriesData3
}]
this.setChart('chart3', this.chart3Option);
},
@ -522,7 +635,8 @@ export default {
}
that.basicOption.xAxis.data = that.xAxisData;
this.chart4Option = deepCopy(that.basicOption)
this.chart4Option.series[0].type = 'line';
this.chart4Option.series[0].type = 'bar';
this.chart4Option.series[0].barWidth = 20;
this.chart4Option.series[0].data = that.seriesData4;
this.setChart('chart4', this.chart4Option);
this.chart5Option = deepCopy(that.basicOption)
@ -530,7 +644,8 @@ export default {
this.chart5Option.series[0].data = that.seriesData5;
this.setChart('chart5', this.chart5Option);
this.chart6Option = deepCopy(that.basicOption)
this.chart6Option.series[0].type = 'line';
this.chart6Option.series[0].type = 'bar';
this.chart6Option.series[0].barWidth = 20;
this.chart6Option.series[0].data = that.seriesData6;
this.setChart('chart6', this.chart6Option);
},
@ -833,10 +948,11 @@ export default {
BABYLON.Animation.CreateAndStartAnimation('at5', camera, 'position', 45, 200, camera.position, cameraPosition, 0, ease);
BABYLON.Animation.CreateAndStartAnimation('at51', camera, 'target', 45, 200, camera.target, position, 0, ease);
}
let dataViewName = rect1.name.split('_')[0] + '_data_view';
that.getMgroupChartData(dataViewName);
// let dataViewName = rect1.name.split('_')[0] + '_data_view';
let dataViewName = rect1.name.split('_')[0];
that.activeSectionName = dataViewName;
that.activeSection = 2;
that.getMgroupChartData(dataViewName);
let dataView = advancedTexture.getControlByName(dataViewName);
if (dataView) {
// // 在这里进行矩形的操作
@ -895,13 +1011,13 @@ export default {
rc.text = "单位产品电耗：";
} else if (j == 1 && i == 0) {
// rc.text = that.mgroupValues[value].total;
rc.text = "123";
rc.text = that.mgroupValues[value].total;
rc.width = "80px";
rc.fontSize = '18px';
rc.color = "rgb(44,237,255)";
} else if (j == 1 && i == 1) {
// rc.text = that.mgroupValues[value].total;
rc.text = "456";
rc.text = that.mgroupValues[value].elec;
rc.width = "80px";
rc.fontSize = '18px';
rc.color = "rgb(44,237,255)";
@ -1071,6 +1187,10 @@ export default {
that.seriesData4 = seriesData4;
that.seriesData5 = seriesData5;
that.seriesData6 = seriesData6;
//模拟数据
that.seriesData4 = this.sectionDatas[this.activeSectionName].charts_ele;
that.seriesData5 = this.sectionDatas[this.activeSectionName].charts_prod;
that.seriesData6 = this.sectionDatas[this.activeSectionName].charts_rate;
that.initCharts1();
const element_main = document.querySelector('.right_main');
element_main.classList.add('animate__animated', 'animate__fadeIn');
@ -1091,30 +1211,39 @@ 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 = 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();
})
let that = this;
this.sectionData = this.sectionDatas[this.activeSectionName];
//模拟数据
that.seriesData4 = this.sectionDatas[this.activeSectionName].charts_ele;
that.seriesData5 = this.sectionDatas[this.activeSectionName].charts_prod;
that.seriesData6 = this.sectionDatas[this.activeSectionName].charts_rate;
that.initCharts1();
console.log(this.sectionData, this.activeSectionName)
// 模拟数据
// 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() {
@ -1245,7 +1374,7 @@ header {
.panel_value {
padding-left: 1em;
font-size: 22px;
font-size: 20px;
font-weight: bold;
text-align: right;
}
@ -1253,7 +1382,7 @@ header {
.panel_unit {
right: 5px;
color: #aebfe9;
font-size: 16px;
font-size: 12px;
text-align: right;
position: absolute;
}
@ -1314,4 +1443,5 @@ header {
text-align: center;
background: url(./../../../public/img/menu_active.png) no-repeat;
background-size: 100%;
}</style>
}
</style>