feat: 修改 enm 报表
This commit is contained in:
parent
c1a4150080
commit
64c738acd2
|
@ -148,6 +148,11 @@ export default {
|
|||
.el-calendar {
|
||||
border-radius: 15px;
|
||||
}
|
||||
#greenHeadTable .el-table th.el-table__cell,
|
||||
#greenHeadTable .el-table.is-scrolling-left th.el-table-fixed-column--left,
|
||||
#greenHeadTable .el-table.is-scrolling-none th.el-table-fixed-column--left{
|
||||
background-color: #80f116!important;
|
||||
}
|
||||
|
||||
.el-calendar > .el-calendar__body {
|
||||
padding: 0 20px 20px;
|
||||
|
|
|
@ -33,9 +33,10 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th @click="goToTarget('3626253231757619200')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;">月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th @click="goToTarget('3626253231757619200')">年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -843,6 +844,14 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
console.log(val);
|
||||
|
|
|
@ -38,7 +38,7 @@
|
|||
>
|
||||
<thead class="myTableHead">
|
||||
<tr>
|
||||
<th colspan="16">煤磨工序班组月度对比分析</th>
|
||||
<th colspan="15">煤磨工序班组月度对比分析</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th rowspan="2">月份</th>
|
||||
|
@ -47,13 +47,13 @@
|
|||
<th rowspan="2">台时产量(t/h)</th>
|
||||
<th rowspan="2">运转率(%)</th>
|
||||
<th colspan="2">质量</th>
|
||||
<th colspan="8">单位产品电耗</th>
|
||||
<th colspan="7">单位产品电耗</th>
|
||||
<th rowspan="2">得分</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>细度(%)</th>
|
||||
<th>水分(%)</th>
|
||||
<th>煤磨排风机主电机(kW·h/t)</th>
|
||||
<!-- <th>煤磨排风机主电机(kW·h/t)</th> -->
|
||||
<th>当期值(kW·h/t)</th>
|
||||
<th>目标值(kW·h/t)</th>
|
||||
<th>当期与目标值差值(kW·h/t)</th>
|
||||
|
@ -214,16 +214,16 @@ export default {
|
|||
? item.出磨煤粉_水分_rate_pass
|
||||
: 0;
|
||||
//设备
|
||||
arr[7] =
|
||||
item.煤磨排风机主电机_consume_unit
|
||||
!== undefined && item.煤磨排风机主电机_consume_unit
|
||||
!== null
|
||||
? item.煤磨排风机主电机_consume_unit
|
||||
: 0;
|
||||
// arr[7] =
|
||||
// item.煤磨排风机主电机_consume_unit
|
||||
// !== undefined && item.煤磨排风机主电机_consume_unit
|
||||
// !== null
|
||||
// ? item.煤磨排风机主电机_consume_unit
|
||||
// : 0;
|
||||
let keyVale = "goal_val_" + n;
|
||||
arr[8] = item.elec_consume_unit; //当期值(kW·h/t)
|
||||
arr[9] = goalData[keyVale]; //目标值(kW·h/t)//需要接口获取
|
||||
arr[10] = (arr[8] - arr[9]).toFixed(2); //当期与目标差值(kW·h/t)
|
||||
arr[7] = item.elec_consume_unit; //当期值(kW·h/t)
|
||||
arr[8] = goalData[keyVale]; //目标值(kW·h/t)//需要接口获取
|
||||
arr[9] = (arr[7] - arr[8]).toFixed(2); //当期与目标差值(kW·h/t)
|
||||
let ind_pre = 0,
|
||||
huanqi = 0;
|
||||
if (item.month_s == 1) {
|
||||
|
@ -245,23 +245,23 @@ export default {
|
|||
}
|
||||
})
|
||||
}
|
||||
arr[11] = huanqi; //环期值(kW·h/t)上个月的值
|
||||
arr[10] = huanqi; //环期值(kW·h/t)上个月的值
|
||||
let huanqicha = 0;
|
||||
if (huanqi !== "/") {
|
||||
huanqicha = (arr[8] - arr[11]).toFixed(2);
|
||||
huanqicha = (arr[7] - arr[10]).toFixed(2);
|
||||
} else {
|
||||
huanqicha = 0;
|
||||
}
|
||||
arr[12] = huanqicha; //当期与环期差值(kW·h/t)
|
||||
arr[11] = huanqicha; //当期与环期差值(kW·h/t)
|
||||
// arr[13] =
|
||||
if (arr[11] !=="/" && arr[11]!=0 && arr[12] !=0 && arr[12] !== "undefined"){
|
||||
arr[13] = ((arr[12]/arr[11])*100).toFixed(2);
|
||||
if (arr[12] !=="/" && arr[10]!=0 && arr[11] !=0 && arr[11] !== "undefined"){
|
||||
arr[12] = ((arr[11]/arr[10])*100).toFixed(2);
|
||||
}else{
|
||||
arr[13] = "/"; //环比增长率(%)= 当期与环期差值(kW·h/t)/环期值(kW·h/t)*100%
|
||||
arr[12] = "/"; //环比增长率(%)= 当期与环期差值(kW·h/t)/环期值(kW·h/t)*100%
|
||||
}
|
||||
arr[14] = 0; //同比增长率(%)
|
||||
arr[13] = 0; //同比增长率(%)
|
||||
// arr[15] = 0.0; //得分
|
||||
arr[15] = 0;
|
||||
arr[14] = 0;
|
||||
if (month_obj[n]) {
|
||||
const monthData = month_obj[n];
|
||||
const itemValue = item.elec_consume_unit; // 单位产品电耗的值
|
||||
|
@ -277,7 +277,7 @@ export default {
|
|||
} else if (index === 3) {
|
||||
elec_score= 15;
|
||||
}
|
||||
arr[15] += elec_score;
|
||||
arr[14] += elec_score;
|
||||
|
||||
// const run_rate_itemValue = item.run_rate; // 运转率的值
|
||||
// const run_rate_sortedData = monthData.sort((a, b) => parseFloat(b.run_rate) - parseFloat(a.run_rate));
|
||||
|
@ -307,7 +307,7 @@ export default {
|
|||
} else if (production_hour_index === 3) {
|
||||
production_hour_score= 4;
|
||||
}
|
||||
arr[15] += production_hour_score;
|
||||
arr[14] += production_hour_score;
|
||||
|
||||
const xidu_itemValue = item.出磨煤粉_细度_rate_pass; // 出磨煤粉细度的值
|
||||
const xidu_sortedData = monthData.sort((a, b) => parseFloat(b.xidu) - parseFloat(a.xidu));
|
||||
|
@ -322,7 +322,7 @@ export default {
|
|||
} else if (xidu_index === 3) {
|
||||
xidu_score= 3;
|
||||
}
|
||||
arr[15] += xidu_score;
|
||||
arr[14] += xidu_score;
|
||||
|
||||
const coal_powder_itemValue = item.出磨煤粉_水分_rate_pass; // 出磨煤粉水分的值
|
||||
const coal_powder_sortedData = monthData.sort((a, b) => parseFloat(b.coal_powder) - parseFloat(a.coal_powder));
|
||||
|
@ -337,8 +337,8 @@ export default {
|
|||
} else if (coal_powder_index === 3) {
|
||||
coal_powder_score= 2;
|
||||
}
|
||||
arr[15] += coal_powder_score;
|
||||
arr[15] += 60;
|
||||
arr[14] += coal_powder_score;
|
||||
arr[14] += 60;
|
||||
}
|
||||
wrapArr.push(arr);
|
||||
});
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<!-- 全厂水量统计 -->
|
||||
<template>
|
||||
<div class="app-container" id="app-container" style="height: 50%">
|
||||
<div class="app-container" id="app-container" style="height: 40%">
|
||||
<el-header id="app-header">
|
||||
<div class="left-panel">
|
||||
<el-select
|
||||
|
@ -201,14 +201,14 @@
|
|||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="chartWrap" v-show="query.type==0">
|
||||
<div class="chartWrap" v-show="query.type==0">
|
||||
<div class="chartTitle">本日生产参数统计图</div>
|
||||
<scEcharts
|
||||
height="400px"
|
||||
width="1500px"
|
||||
:option="optionHour"
|
||||
></scEcharts>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="chartWrap" v-show="query.type==1">
|
||||
<div class="chartTitle">本月生产参数统计图</div>
|
||||
<scEcharts
|
||||
|
@ -275,6 +275,7 @@ export default {
|
|||
optionDay: {},
|
||||
optionMonth: {},
|
||||
options: [
|
||||
{id:0,name:'日统计'},
|
||||
{id:1,name:'月统计'},
|
||||
{id:2,name:'年统计'},
|
||||
{id:3,name:'时间段'},
|
||||
|
@ -604,7 +605,7 @@ export default {
|
|||
name: ''
|
||||
},
|
||||
series: [{
|
||||
name: '工业水(t)', // 此处修改为对应分类的名称
|
||||
name: '碳排放量(t)', // 此处修改为对应分类的名称
|
||||
type: 'bar',
|
||||
data: gyhourlyData, // 每小时的用水量
|
||||
itemStyle: {
|
||||
|
@ -612,24 +613,6 @@ export default {
|
|||
},
|
||||
|
||||
},
|
||||
{
|
||||
name: '绿化水(t)', // 此处修改为对应分类的名称
|
||||
type: 'bar',
|
||||
data: lvhourlyData, // 每小时的用水量
|
||||
itemStyle: {
|
||||
color: '#DCE6CB',
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
name: '生活水(t)', // 此处修改为对应分类的名称
|
||||
type: 'bar',
|
||||
data: shhourlyData, // 每小时的用水量
|
||||
itemStyle: {
|
||||
color: '#93F607',
|
||||
},
|
||||
|
||||
},
|
||||
]
|
||||
};
|
||||
that.optionHour = option;
|
||||
|
|
|
@ -0,0 +1,344 @@
|
|||
<template>
|
||||
<div class="app-container" id="app-container" style="height: 100%">
|
||||
<el-header id="app-header">
|
||||
<div class="left-panel">
|
||||
<el-select
|
||||
v-model="query.type"
|
||||
placeholder="查询类型"
|
||||
clearable
|
||||
class="headerSearch"
|
||||
@change="typeCange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
v-model="query.day"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
format="YYYY-MM-DD"
|
||||
placeholder="天"
|
||||
v-if="query.type==0"
|
||||
style="margin-right: 6px"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.month"
|
||||
type="month"
|
||||
value-format="YYYY-MM"
|
||||
format="YYYY-MM"
|
||||
placeholder="查询月份"
|
||||
v-if="query.type==1"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
value-format="YYYY"
|
||||
format="YYYY"
|
||||
placeholder="查询年份"
|
||||
v-if="query.type==2"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="daterange"
|
||||
type="datetimerange"
|
||||
:shortcuts="shortcuts"
|
||||
range-separator="To"
|
||||
start-placeholder="Start date"
|
||||
end-placeholder="End date"
|
||||
placeholder="时间范围"
|
||||
value-format="YYYY-MM-DD hh:mm:ss"
|
||||
v-if="query.type==3"
|
||||
style="margin-right: 6px"
|
||||
@change="changeDate"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="dateChange"
|
||||
></el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="exportExcel()"
|
||||
:loading="exportLoading"
|
||||
>导出xlsx
|
||||
</el-button>
|
||||
<!-- <el-button type="primary" @click="handlePrint">打印 </el-button> -->
|
||||
</div>
|
||||
</el-header>
|
||||
<el-card style="margin-top:5px">
|
||||
<div>
|
||||
<table id="myTable" class="myTable" border="1" cellspacing="0" style="width: 100%; text-align: center;">
|
||||
<thead class="myTableHead">
|
||||
<tr>
|
||||
<th colspan="2">主要用能设备(100KW以上)</th>
|
||||
<th v-for="(header, index) in headers" :key="index">{{ header }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, rowIndex) in tableData" :key="rowIndex">
|
||||
<td
|
||||
v-if="rowIndex === 0 || rowIndex === 2 || rowIndex === 4"
|
||||
:rowspan="rowIndex === 0 || rowIndex === 2 ? 2 : 1"
|
||||
>
|
||||
{{ row[0] }}
|
||||
</td>
|
||||
<td>{{ row[1] }}</td>
|
||||
<td v-for="(cell, cellIndex) in row.slice(2)" :key="cellIndex"
|
||||
>{{ cell }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
<div id="barChart" style="width: 100%; height: 400px;"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
query:{
|
||||
type:0,
|
||||
day:'',
|
||||
year:'',
|
||||
month:'',
|
||||
yearStart:'',
|
||||
start_time:'',
|
||||
end_time:'',
|
||||
},
|
||||
tableDatas_range:[],
|
||||
daterange:[],
|
||||
headers: ['生料立磨','循环风机','高温风机','尾排风机','回转窑','水泥磨','水泥循环风机','水泥系统风机','电石渣','原料磨','煤磨','水泥粉磨','水泥包装'],
|
||||
mpoint_name: ['原料立磨主电机','循环风机-原料磨','高温风机','尾排风机','烧成工序用电合计','水泥高压进线','循环风机-水泥磨','系统风机','电石渣用电合计','生料辅料工序用电量','煤磨合计','水泥磨主电机','包装进线'],
|
||||
tableData: [
|
||||
['用电峰','用电尖峰','','','','','','','','','','','','',''],
|
||||
['用电峰','用电高峰','','','','','','','','','','','','',''],
|
||||
['用电谷','用电低谷','','','','','','','','','','','','',''],
|
||||
['用电谷','用电深谷','','','','','','','','','','','','',''],
|
||||
['用电平','用电平谷','','','','','','','','','','','','',''],
|
||||
],
|
||||
mpointList:["3631338253279723520,3631338547577257984,3631332708552392704,3631333116071026688,3631877739432493056,3631344327579828224,3631853750379200512,3631853436771090432,3631869508278722560,3745109632247812096,3631878174063050752,3631852596106797056,3631854361455820800"],
|
||||
tableName:'峰谷平',
|
||||
options:[
|
||||
{id:0,name:'日统计'},
|
||||
{id:1,name:'月统计'},
|
||||
{id:2,name:'年统计'},
|
||||
{id:3,name:'时间范围'},
|
||||
],
|
||||
row_list : ['peak','high','low','deep','flat'],
|
||||
row_translate: ['尖峰', '高峰', '低谷', '深谷', '平谷'],
|
||||
colors :["#EB1B1D", "#FE9900", "#0E4E51", "#2B8C05", "#A9C0A0"],// 自定义颜色
|
||||
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
var myDate = new Date();
|
||||
let month = myDate.getMonth()+1;
|
||||
if(month<10){
|
||||
month = '0'+month;
|
||||
}
|
||||
this.query.month = myDate.getFullYear()+'-'+month;
|
||||
this.query.day = myDate.getFullYear()+'-'+(myDate.getMonth()+1)+'-'+myDate.getDate();
|
||||
this.query.year = myDate.getFullYear();
|
||||
this.dateChange();
|
||||
|
||||
},
|
||||
methods: {
|
||||
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
||||
let that = this;
|
||||
if (columnIndex == 0) {
|
||||
if (that.indexList.indexOf(rowIndex) > -1) {
|
||||
let rowspans = that.mgroupObj[row.mgroupName];
|
||||
return {
|
||||
rowspan: rowspans,
|
||||
colspan: 1,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
rowspan: 1,
|
||||
colspan: 0,
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
changeDate(){
|
||||
let obj = {};
|
||||
obj.type = "hour";
|
||||
obj.start_time = this.daterange[0];
|
||||
obj.end_time = this.daterange[1];
|
||||
obj.mpoint__in = this.mpointList[0];
|
||||
obj.page = 0;
|
||||
this.$API.enm.mpointstat.groupValues.req(obj).then((res) => {
|
||||
//处理res数组中的 total_val 字段 保留两位
|
||||
res.forEach(item => {
|
||||
item.total_val = Number(item.total_val).toFixed(2);
|
||||
});
|
||||
this.tableDatas_range = res;
|
||||
});
|
||||
},
|
||||
dateChange() {
|
||||
let that = this;
|
||||
let arr = [],
|
||||
obj = {};
|
||||
|
||||
// 根据 type 设置 obj 的值
|
||||
if (that.query.type === 0) { // 日
|
||||
arr = that.query.day.split('-');
|
||||
obj.year = Number(arr[0]);
|
||||
obj.month = Number(arr[1]);
|
||||
obj.day = Number(arr[2]);
|
||||
} else if (that.query.type === 1) { // 月
|
||||
arr = that.query.month.split('-');
|
||||
obj.year = Number(arr[0]);
|
||||
obj.month = Number(arr[1]);
|
||||
obj.days = new Date(that.query.year, that.query.month, 0).getDate(); // 获取该月的天数
|
||||
} else if (that.query.type === 2) { // 年
|
||||
obj.year = that.query.year;
|
||||
} else if (that.query.type === 3) { // 时间范围
|
||||
obj.start_time = that.daterange[0];
|
||||
obj.end_time = that.daterange[1];
|
||||
}
|
||||
obj.page = 0;
|
||||
obj.type = 'hour';
|
||||
obj.group_by = 'val_level';
|
||||
obj.mpoint__in = that.mpointList[0];
|
||||
this.$API.enm.mpointstat.groupValues.req(obj)
|
||||
.then((res) => {
|
||||
let chartData = {};
|
||||
res.forEach(item => {
|
||||
// 查找对应的列索引
|
||||
const colIndex = this.mpoint_name.indexOf(item.mpoint__name) + 2;
|
||||
const rowIndex = this.row_list.indexOf(item.val_level);
|
||||
if (rowIndex > -1 && colIndex > 1) {
|
||||
this.tableData[rowIndex][colIndex] = (item.total_val).toFixed(2);
|
||||
}
|
||||
// 保存柱状图数据
|
||||
if (!chartData[item.mpoint__name]) {
|
||||
chartData[item.mpoint__name] = [];
|
||||
}
|
||||
chartData[item.mpoint__name].push({
|
||||
level: item.val_level,
|
||||
total_val: item.total_val
|
||||
});
|
||||
});
|
||||
// 生成柱状图
|
||||
that.createBarChart(chartData);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("API 请求错误: ", error);
|
||||
});
|
||||
|
||||
},
|
||||
// 用于生成柱状图的函数
|
||||
createBarChart(chartData) {
|
||||
// 获取图表容器
|
||||
let chartDom = document.getElementById('barChart');
|
||||
let myChart = echarts.init(chartDom);
|
||||
|
||||
// 准备数据
|
||||
let seriesData = [];
|
||||
let categories = this.mpoint_name; // 横轴设备名称
|
||||
let rowList = this.row_list; // ['peak', 'high', 'low', 'deep', 'flat']
|
||||
let row_translate = this.row_translate; // ['尖峰', '高峰', '低谷', '深谷', '平谷']
|
||||
// 为每个电量级别('peak', 'high', 'low', 'deep', 'flat')创建一个系列
|
||||
rowList.forEach((level, index) => {
|
||||
let data = categories.map(device => {
|
||||
// 查找对应设备和电量级别的数据
|
||||
let deviceData = chartData[device]?.find(item => item.level === level);
|
||||
return deviceData ? Math.round(deviceData.total_val) : ''; // 如果没有数据,返回 0
|
||||
});
|
||||
|
||||
seriesData.push({
|
||||
name: row_translate[index], // 系列名称(如 peak、high 等)
|
||||
type: 'bar',
|
||||
data: data, // 数据数组
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
formatter: '{c}' // 显示数值
|
||||
},
|
||||
itemStyle: {
|
||||
color: this.colors[index] // 根据索引获取颜色
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 配置图表选项
|
||||
let option = {
|
||||
title: {
|
||||
text: '电量统计柱状图',
|
||||
left: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { type: 'shadow' } // 鼠标悬停提示
|
||||
},
|
||||
legend: {
|
||||
data: row_translate, // 显示 'peak', 'high' 等级别的图例
|
||||
top: '10%'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: this.headers, // 横轴设备名称
|
||||
axisLabel: {
|
||||
rotate: 45 // 旋转标签,防止重叠
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value} kW·h' // 单位为 kW·h
|
||||
}
|
||||
},
|
||||
series: seriesData
|
||||
};
|
||||
|
||||
// 设置图表选项
|
||||
myChart.setOption(option);
|
||||
},
|
||||
|
||||
handlePrint() {
|
||||
this.$PRINT('#myReport');
|
||||
},
|
||||
exportExcel() {
|
||||
this.exportLoading = true;
|
||||
this.$XLSX('#myTable', this.tableName)
|
||||
this.exportLoading = false;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
#numTable{
|
||||
margin-left: 37px;
|
||||
}
|
||||
#numTable td{
|
||||
height: 32px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.numCell{
|
||||
width: 80px;
|
||||
}
|
||||
.numCell.numCell_last{
|
||||
width: 100px;
|
||||
}
|
||||
.searchHead{
|
||||
display:flex
|
||||
}
|
||||
.middleText{
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
margin: 0 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
.searchBtn{
|
||||
margin-left: 5px;
|
||||
}
|
||||
</style>
|
|
@ -7,13 +7,26 @@
|
|||
placeholder="查询类型"
|
||||
clearable
|
||||
class="headerSearch"
|
||||
@change="typeCange"
|
||||
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="query.mgroupName"
|
||||
placeholder="查询工段"
|
||||
clearable
|
||||
class="headerSearch"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in mgroups"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
|
@ -35,26 +48,26 @@
|
|||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
value-format="YYYY"
|
||||
format="YYYY"
|
||||
placeholder="查询年份"
|
||||
v-if="query.type==2"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="daterange"
|
||||
type="datetimerange"
|
||||
:shortcuts="shortcuts"
|
||||
range-separator="To"
|
||||
start-placeholder="Start date"
|
||||
end-placeholder="End date"
|
||||
placeholder="时间范围"
|
||||
value-format="YYYY-MM-DD hh:mm:ss"
|
||||
v-if="query.type==3"
|
||||
style="margin-right: 6px"
|
||||
@change="changeDate"
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
value-format="YYYY"
|
||||
format="YYYY"
|
||||
placeholder="查询年份"
|
||||
v-if="query.type==2"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="daterange"
|
||||
type="datetimerange"
|
||||
:shortcuts="shortcuts"
|
||||
range-separator="To"
|
||||
start-placeholder="Start date"
|
||||
end-placeholder="End date"
|
||||
placeholder="时间范围"
|
||||
value-format="YYYY-MM-DD hh:mm:ss"
|
||||
v-if="query.type==3"
|
||||
style="margin-right: 6px"
|
||||
@change="changeDate"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
|
@ -67,36 +80,78 @@
|
|||
:loading="exportLoading"
|
||||
>导出xlsx
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="showBarChart()"
|
||||
icon="el-icon-pie-chart"
|
||||
>趋势图
|
||||
</el-button>
|
||||
<!-- <el-button type="primary" @click="handlePrint">打印 </el-button> -->
|
||||
</div>
|
||||
</el-header>
|
||||
<el-card style="margin-top:5px">
|
||||
<div>
|
||||
<table id="myTable" class="myTable" border="1" cellspacing="0" style="width: 100%; text-align: center;">
|
||||
<thead class="myTableHead">
|
||||
<tr>
|
||||
<th colspan="2">主要用能设备(100KW以上)</th>
|
||||
<th v-for="(header, index) in headers" :key="index">{{ header }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, rowIndex) in tableData" :key="rowIndex">
|
||||
<td
|
||||
v-if="rowIndex === 0 || rowIndex === 2 || rowIndex === 4"
|
||||
:rowspan="rowIndex === 0 || rowIndex === 2 ? 2 : 1"
|
||||
<el-card style="margin-top:5px">
|
||||
<div style="display: flex; justify-content: space-between; align-items: flex-start;">
|
||||
<el-table
|
||||
id = "greenHeadTable"
|
||||
:data="tableData"
|
||||
style="width: 70%"
|
||||
border
|
||||
:height="tableHeight"
|
||||
>
|
||||
<el-table-column label="(100KW以上)设备用电峰谷平" align="center" width="100" fixed>
|
||||
<el-table-column label="设备" prop="mpoint__name" min-width="110" fixed></el-table-column>
|
||||
<el-table-column label="单位" prop="unit" min-width="110" fixed></el-table-column>
|
||||
|
||||
<!-- 动态渲染尖峰、波峰、平谷、波谷、深谷 -->
|
||||
<el-table-column
|
||||
v-for="column in columns"
|
||||
:key="column.prop"
|
||||
:label="column.label"
|
||||
:prop="column.prop"
|
||||
min-width="120"
|
||||
></el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-table
|
||||
:data="tableDatas2"
|
||||
border
|
||||
style="margin-left: 10px; margin-top: 10px; width: 500px; table-layout: fixed;"
|
||||
:key="timeStamp"
|
||||
class="myTable"
|
||||
>
|
||||
<!-- 第一列 -->
|
||||
<el-table-column
|
||||
label="峰谷平时间段划分"
|
||||
prop="type"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
{{ row[0] }}
|
||||
</td>
|
||||
<td>{{ row[1] }}</td>
|
||||
<td v-for="(cell, cellIndex) in row.slice(2)" :key="cellIndex"
|
||||
>{{ cell }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
<div id="barChart" style="width: 100%; height: 400px;"></div>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 第二列 -->
|
||||
<el-table-column
|
||||
label="时间段"
|
||||
prop="time"
|
||||
align="left"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<el-dialog
|
||||
title="柱状图"
|
||||
v-model="isChartDialogVisible"
|
||||
width="80%"
|
||||
@close="onDialogClose">
|
||||
<div
|
||||
id="barChart"
|
||||
style="width: 100%; height: 400px;"
|
||||
></div>
|
||||
<template #footer>
|
||||
<el-button @click="isChartDialogVisible = false">关闭</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
|
@ -106,33 +161,53 @@ import * as echarts from 'echarts';
|
|||
query:{
|
||||
type:0,
|
||||
day:'',
|
||||
mgroupName:'',
|
||||
year:'',
|
||||
month:'',
|
||||
yearStart:'',
|
||||
start_time:'',
|
||||
end_time:'',
|
||||
},
|
||||
tableHeight:800,
|
||||
columns: [
|
||||
{ label: '尖峰', prop: 'peak' },
|
||||
{ label: '波峰', prop: 'high' },
|
||||
{ label: '平谷', prop: 'flat' },
|
||||
{ label: '波谷', prop: 'low' },
|
||||
{ label: '深谷', prop: 'deep' },
|
||||
],
|
||||
tableData:[],
|
||||
tableDatas2: [
|
||||
{ type: "波峰", time: "8:00--11:00 19:00-24:00" },
|
||||
{ type: "尖峰", time: "7月 21:00--23:00, 1、11、12月19:00--21:00" },
|
||||
{ type: "平谷", time: "11:00--13:00 17:00-19:00 00:00-4:00" },
|
||||
{ type: "波谷", time: "4:00--8:00 13:00-17:00" },
|
||||
{ type: "深谷", time: "5、6、7、8月 14:00--16:00" },
|
||||
],
|
||||
tableDatas_day: [],
|
||||
tableDatas_range:[],
|
||||
mpoint_name: [],
|
||||
isChartDialogVisible: false, // 控制弹窗显示状态
|
||||
mpointList: [],
|
||||
daterange:[],
|
||||
headers: ['生料立磨','循环风机','高温风机','尾排风机','回转窑','水泥磨','水泥循环风机','水泥系统风机','电石渣','原料磨','煤磨','水泥粉磨','水泥包装'],
|
||||
mpoint_name: ['原料立磨主电机','循环风机-原料磨','高温风机','尾排风机','烧成工序用电合计','水泥高压进线','循环风机-水泥磨','系统风机','电石渣用电合计','生料辅料工序用电量','煤磨合计','水泥磨主电机','包装进线'],
|
||||
tableData: [
|
||||
['用电峰','用电尖峰','','','','','','','','','','','','',''],
|
||||
['用电峰','用电高峰','','','','','','','','','','','','',''],
|
||||
['用电谷','用电低谷','','','','','','','','','','','','',''],
|
||||
['用电谷','用电深谷','','','','','','','','','','','','',''],
|
||||
['用电平','用电平谷','','','','','','','','','','','','',''],
|
||||
],
|
||||
mpointList:["3631338253279723520,3631338547577257984,3631332708552392704,3631333116071026688,3631877739432493056,3631344327579828224,3631853750379200512,3631853436771090432,3631869508278722560,3745109632247812096,3631878174063050752,3631852596106797056,3631854361455820800"],
|
||||
tableName:'峰谷平',
|
||||
barChartData: {},
|
||||
options:[
|
||||
{id:0,name:'日统计'},
|
||||
{id:1,name:'月统计'},
|
||||
{id:2,name:'年统计'},
|
||||
{id:3,name:'时间范围'},
|
||||
],
|
||||
row_list : ['peak','high','low','deep','flat'],
|
||||
row_translate: ['尖峰', '高峰', '低谷', '深谷', '平谷'],
|
||||
mgroups: [
|
||||
{id:0,name:'电石渣'},
|
||||
{id:1,name:'原料磨'},
|
||||
{id:2,name:'生料工序(二次配料)'},
|
||||
{id:3,name:'回转窑'},
|
||||
{id:4,name:'煤磨'},
|
||||
{id:5,name:'水泥磨'},
|
||||
{id:6,name:'水泥包装'},
|
||||
],
|
||||
col_list : ['peak','high','low','deep','flat'],
|
||||
row_translate: ['尖峰', '波峰', '波谷', '深谷', '平谷'],
|
||||
colors :["#EB1B1D", "#FE9900", "#0E4E51", "#2B8C05", "#A9C0A0"],// 自定义颜色
|
||||
|
||||
};
|
||||
|
@ -167,28 +242,49 @@ import * as echarts from 'echarts';
|
|||
}
|
||||
}
|
||||
},
|
||||
|
||||
changeDate(){
|
||||
let obj = {};
|
||||
obj.type = "hour";
|
||||
obj.start_time = this.daterange[0];
|
||||
obj.end_time = this.daterange[1];
|
||||
obj.mpoint__in = this.mpointList[0];
|
||||
obj.page = 0;
|
||||
this.$API.enm.mpointstat.groupValues.req(obj).then((res) => {
|
||||
//处理res数组中的 total_val 字段 保留两位
|
||||
res.forEach(item => {
|
||||
item.total_val = Number(item.total_val).toFixed(2);
|
||||
});
|
||||
this.tableDatas_range = res;
|
||||
});
|
||||
},
|
||||
let obj = {};
|
||||
obj.type = "hour";
|
||||
obj.start_time = this.daterange[0];
|
||||
obj.end_time = this.daterange[1];
|
||||
obj.mpoint__in = this.mpointList[0];
|
||||
obj.page = 0;
|
||||
this.$API.enm.mpointstat.groupValues.req(obj).then((res) => {
|
||||
//处理res数组中的 total_val 字段 保留两位
|
||||
res.forEach(item => {
|
||||
item.total_val = Number(item.total_val).toFixed(2);
|
||||
});
|
||||
this.tableDatas_range = res;
|
||||
});
|
||||
},
|
||||
|
||||
dateChange() {
|
||||
let that = this;
|
||||
that.mpointList = []; // 清空数组
|
||||
let arr = [],
|
||||
obj = {};
|
||||
|
||||
// 根据 type 设置 obj 的值
|
||||
console.log(that.query.mgroupName, 'that.query.mgroupName')
|
||||
that.$API.enm.mpoint.list
|
||||
.req({
|
||||
page: 0,
|
||||
enabled: 1,
|
||||
need_display: 1,
|
||||
mgroup__name: that.query.mgroupName,
|
||||
mpoint_ep_monitored__power_kw__gte: 100,
|
||||
ordering: "report_sortstr",
|
||||
material__code__in: "elec",
|
||||
query: "{ id, name, nickname, mgroup_name, unit, report_sortstr, ep_monitored_name, }",
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.length === 0) {
|
||||
return;
|
||||
}
|
||||
console.log(res, 'res-----------')
|
||||
that.mpointList = res
|
||||
.filter((item) => item.report_sortstr !== "" && item.mgroup_name !== '生活区')
|
||||
.map((item) => item.id); // 提取 id
|
||||
}).then(() => {
|
||||
// 根据 type 设置 obj 的值
|
||||
if (that.query.type === 0) { // 日
|
||||
arr = that.query.day.split('-');
|
||||
obj.year = Number(arr[0]);
|
||||
|
@ -205,70 +301,81 @@ import * as echarts from 'echarts';
|
|||
obj.start_time = that.daterange[0];
|
||||
obj.end_time = that.daterange[1];
|
||||
}
|
||||
console.log(that.mpointList.length, 'that.mpointList')
|
||||
let mpointID = that.mpointList.join(',');
|
||||
obj.page = 0;
|
||||
obj.type = 'hour';
|
||||
obj.group_by = 'val_level';
|
||||
obj.mpoint__in = that.mpointList[0];
|
||||
obj.mpoint__in = mpointID;
|
||||
this.$API.enm.mpointstat.groupValues.req(obj)
|
||||
.then((res) => {
|
||||
let chartData = {};
|
||||
res.forEach(item => {
|
||||
// 查找对应的列索引
|
||||
const colIndex = this.mpoint_name.indexOf(item.mpoint__name) + 2;
|
||||
const rowIndex = this.row_list.indexOf(item.val_level);
|
||||
if (rowIndex > -1 && colIndex > 1) {
|
||||
this.tableData[rowIndex][colIndex] = (item.total_val).toFixed(2);
|
||||
}
|
||||
// 保存柱状图数据
|
||||
if (!chartData[item.mpoint__name]) {
|
||||
chartData[item.mpoint__name] = [];
|
||||
}
|
||||
chartData[item.mpoint__name].push({
|
||||
level: item.val_level,
|
||||
total_val: item.total_val
|
||||
});
|
||||
});
|
||||
// 生成柱状图
|
||||
that.createBarChart(chartData);
|
||||
const groupedData = res.reduce((acc, item) => {
|
||||
// 查找是否已有当前 mpoint__name 的分组
|
||||
let group = acc.find(g => g.mpoint__name === item.mpoint__name);
|
||||
|
||||
// 如果没有,创建一个新的分组对象
|
||||
if (!group) {
|
||||
group = {
|
||||
mpoint__name: item.mpoint__name,
|
||||
unit: item.mpoint__unit,
|
||||
flat: null,
|
||||
high: null,
|
||||
low: null,
|
||||
peak: null,
|
||||
deep: null,
|
||||
};
|
||||
acc.push(group);
|
||||
}
|
||||
// 根据 val_level 将 total_val 填入对应字段
|
||||
group[item.val_level] = (item.total_val.toFixed(2));
|
||||
return acc;
|
||||
}, []);
|
||||
this.tableData = groupedData;
|
||||
console.log("groupedData",groupedData)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("API 请求错误: ", error);
|
||||
});
|
||||
|
||||
});
|
||||
},
|
||||
// 显示图表
|
||||
showBarChart(){
|
||||
this.isChartDialogVisible = true;
|
||||
this.$nextTick(() => {
|
||||
this.createBarChart();
|
||||
});
|
||||
},
|
||||
onDialogClose() {
|
||||
this.isChartDialogVisible = false;
|
||||
},
|
||||
|
||||
// 用于生成柱状图的函数
|
||||
createBarChart(chartData) {
|
||||
createBarChart() {
|
||||
// 获取图表容器
|
||||
let chartDom = document.getElementById('barChart');
|
||||
if (!chartDom) {
|
||||
console.error('无法找到 #barChart 元素');
|
||||
return;
|
||||
}
|
||||
let myChart = echarts.init(chartDom);
|
||||
|
||||
// 准备数据
|
||||
let seriesData = [];
|
||||
let categories = this.mpoint_name; // 横轴设备名称
|
||||
let rowList = this.row_list; // ['peak', 'high', 'low', 'deep', 'flat']
|
||||
let row_translate = this.row_translate; // ['尖峰', '高峰', '低谷', '深谷', '平谷']
|
||||
// 为每个电量级别('peak', 'high', 'low', 'deep', 'flat')创建一个系列
|
||||
rowList.forEach((level, index) => {
|
||||
let data = categories.map(device => {
|
||||
// 查找对应设备和电量级别的数据
|
||||
let deviceData = chartData[device]?.find(item => item.level === level);
|
||||
return deviceData ? Math.round(deviceData.total_val) : ''; // 如果没有数据,返回 0
|
||||
});
|
||||
|
||||
seriesData.push({
|
||||
name: row_translate[index], // 系列名称(如 peak、high 等)
|
||||
type: 'bar',
|
||||
data: data, // 数据数组
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
formatter: '{c}' // 显示数值
|
||||
},
|
||||
itemStyle: {
|
||||
color: this.colors[index] // 根据索引获取颜色
|
||||
}
|
||||
});
|
||||
});
|
||||
let seriesData = [
|
||||
{ name: '平谷', data: [] },
|
||||
{ name: '波峰', data: [] },
|
||||
{ name: '波谷', data: [] },
|
||||
{ name: '尖峰', data: [] },
|
||||
{ name: '深谷', data: [] }
|
||||
];
|
||||
let categories = this.tableData.map(item => item.mpoint__name); // 横轴设备名称
|
||||
this.tableData.forEach(item => {
|
||||
seriesData[0].data.push(item.flat ? parseFloat(item.flat) : 0); // 平谷
|
||||
seriesData[1].data.push(item.high ? parseFloat(item.high) : 0); // 波峰
|
||||
seriesData[2].data.push(item.low ? parseFloat(item.low) : 0); // 波谷
|
||||
seriesData[3].data.push(item.peak ? parseFloat(item.peak) : 0); // 尖峰
|
||||
seriesData[4].data.push(item.deep ? parseFloat(item.deep) : 0); // 深谷
|
||||
});
|
||||
|
||||
// 配置图表选项
|
||||
let option = {
|
||||
|
@ -281,27 +388,36 @@ import * as echarts from 'echarts';
|
|||
axisPointer: { type: 'shadow' } // 鼠标悬停提示
|
||||
},
|
||||
legend: {
|
||||
data: row_translate, // 显示 'peak', 'high' 等级别的图例
|
||||
data: this.row_translate, // 显示 'peak', 'high' 等级别的图例
|
||||
top: '10%'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: this.headers, // 横轴设备名称
|
||||
data: categories, // 横轴设备名称
|
||||
axisLabel: {
|
||||
rotate: 45 // 旋转标签,防止重叠
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value} kW·h' // 单位为 kW·h
|
||||
}
|
||||
},
|
||||
series: seriesData
|
||||
};
|
||||
},
|
||||
series: seriesData.map(item => ({
|
||||
name: item.name,
|
||||
type: 'bar',
|
||||
data: item.data, // 数据数组
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
formatter: '{c}' // 显示数值
|
||||
}
|
||||
}))
|
||||
};
|
||||
|
||||
// 设置图表选项
|
||||
myChart.setOption(option);
|
||||
// 设置图表选项
|
||||
myChart.setOption(option);
|
||||
},
|
||||
|
||||
handlePrint() {
|
||||
|
@ -341,4 +457,7 @@ import * as echarts from 'echarts';
|
|||
.searchBtn{
|
||||
margin-left: 5px;
|
||||
}
|
||||
.myTable td:first-child {
|
||||
width: 150px !important; /* 使用 !important 确保优先级足够高 */
|
||||
}
|
||||
</style>
|
|
@ -298,7 +298,7 @@
|
|||
itemArr.push( item1[0].out_steam_coal)//余热锅炉外送蒸汽折标煤(tce)
|
||||
}
|
||||
itemArr.push( item1[0].total_production) //总产量
|
||||
if(item1[1].mgroup_name == '回转窑'){
|
||||
if(item1[0].mgroup_name == '回转窑'){
|
||||
itemArr.push( item1[0].cen_consume_unit)
|
||||
}else{
|
||||
itemArr.push( item1[0].en_consume_unit) // 单位产品综合能耗
|
||||
|
@ -310,12 +310,14 @@
|
|||
itemArr.push( 0)
|
||||
itemArr.push( 0)
|
||||
}
|
||||
// if(that.deptName=='原料车间'){
|
||||
// // itemArr.push( item1[1].water_consume)//水
|
||||
// // itemArr.push( item1[1].kiln_end_heat)//窑尾余热
|
||||
// }
|
||||
itemArr.push( item1[1].total_production)
|
||||
itemArr.push( item1[1].en_consume_unit)
|
||||
if (item1[4] && item1[4].mgroup_name=='生料工序(二次配料)'){
|
||||
itemArr.push( item1[4].elec_consume)
|
||||
itemArr.push( item1[4].elec_coal_consume)
|
||||
itemArr.push( item1[4].total_production)
|
||||
itemArr.push( item1[4].en_consume_unit)
|
||||
}
|
||||
if(item1 &&item1[2]){
|
||||
itemArr.push(item1[2].cair_consume)//压缩空气
|
||||
}else{
|
||||
|
@ -331,21 +333,17 @@
|
|||
}else{
|
||||
if(parseFloat(item1[1].total_production) != 0 && item1[3]){
|
||||
|
||||
itemArr.push((item1[3].cair_consume/item1[1].total_production).toFixed(2))//单位产品压缩空气
|
||||
itemArr.push((item1[3].cair_consume/item1[1].total_production).toFixed(2))//除以生料辅料
|
||||
}else{
|
||||
itemArr.push(0)
|
||||
}
|
||||
}
|
||||
if (item1[4]){
|
||||
itemArr.push( item1[4].elec_consume)
|
||||
itemArr.push( item1[4].elec_coal_consume)
|
||||
itemArr.push( item1[4].total_production)
|
||||
itemArr.push( item1[4].en_consume_unit)
|
||||
}
|
||||
|
||||
innerArr.push(itemArr)
|
||||
}
|
||||
})
|
||||
that.tableDatas3 = innerArr;
|
||||
console.log(that.tableDatas3, "-----------tableDatas3");
|
||||
});
|
||||
},
|
||||
getTableData(){
|
||||
|
|
|
@ -5,7 +5,54 @@
|
|||
<img src="/media/elec_flow.png" class="flowImg" >
|
||||
<!-- <img src="/img/energy.png" class="flowImg" /> -->
|
||||
<div class="pictureHeader" style="top: 35px;">
|
||||
本日数据 时间段 00:00--24:00
|
||||
<div class="left-panel">
|
||||
<el-select
|
||||
v-model="query.type"
|
||||
placeholder="查询类型"
|
||||
clearable
|
||||
class="headerSearch"
|
||||
@change="typeCange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
v-model="query.day"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
format="YYYY-MM-DD"
|
||||
placeholder="天"
|
||||
v-if="query.type==0"
|
||||
style="margin-right: 6px"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.month"
|
||||
type="month"
|
||||
value-format="YYYY-MM"
|
||||
format="YYYY-MM"
|
||||
placeholder="查询月份"
|
||||
v-if="query.type==1"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
value-format="YYYY"
|
||||
format="YYYY"
|
||||
placeholder="查询年份"
|
||||
v-if="query.type==2"
|
||||
class="headerSearch"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="dateChange"
|
||||
></el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="energyNumber energyNumberLeft" style="top: 183px;">
|
||||
<img v-if="dataObj.全厂用电合计" class="iconImg" src="img/tkx_ele.png">
|
||||
|
@ -164,8 +211,21 @@
|
|||
data() {
|
||||
return {
|
||||
imgSrc:'',
|
||||
dataObj:{ }
|
||||
dataObj:{ },
|
||||
options: [
|
||||
{id:0,name:'日统计'},
|
||||
{id:1,name:'月统计'},
|
||||
{id:2,name:'年统计'},
|
||||
],
|
||||
query:{
|
||||
type:0,
|
||||
day:'',
|
||||
year:'',
|
||||
month:'',
|
||||
yearStart:'',
|
||||
},
|
||||
};
|
||||
|
||||
},
|
||||
mounted() {
|
||||
let that = this;
|
||||
|
@ -261,7 +321,7 @@
|
|||
.pictureHeader {
|
||||
position: absolute;
|
||||
top: -30px; /* 调整表头距离图片的高度 */
|
||||
left: 50%;
|
||||
left: 20%;
|
||||
transform: translateX(-50%);
|
||||
background-color: #f8f9fa; /* 表头背景颜色 */
|
||||
padding: 5px 10px;
|
||||
|
|
|
@ -446,15 +446,15 @@ export default {
|
|||
that.dataLoop();
|
||||
});
|
||||
},
|
||||
getLengthData() {
|
||||
let that = this;
|
||||
let arrs = [];
|
||||
that.mpointList.forEach((item, index) => {
|
||||
if (arrs.indexOf(item.mgroup_name) == -1) {
|
||||
arrs.push(item.mgroup_name);
|
||||
}
|
||||
});
|
||||
},
|
||||
// getLengthData() {
|
||||
// let that = this;
|
||||
// let arrs = [];
|
||||
// that.mpointList.forEach((item, index) => {
|
||||
// if (arrs.indexOf(item.mgroup_name) == -1) {
|
||||
// arrs.push(item.mgroup_name);
|
||||
// }
|
||||
// });
|
||||
// },
|
||||
dataLoop() {
|
||||
let that = this;
|
||||
that.tableDatas = [];
|
||||
|
|
|
@ -33,9 +33,12 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th
|
||||
@click="goToTarget('3626253029718056960')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;"
|
||||
>月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th @click="goToTarget('3626253029718056960')">年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -1179,6 +1182,14 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
console.log(val);
|
||||
|
|
|
@ -382,10 +382,9 @@ export default {
|
|||
this.$API.mtm.mgroup.list
|
||||
.req({ page: 0, search: "回转窑" })
|
||||
.then((res) => {
|
||||
console.log("回转窑", res);
|
||||
that.query.mgroup = res[0].id;
|
||||
//月目标
|
||||
this.getMonthGoal();
|
||||
that.getMonthGoal();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
|
@ -459,6 +458,7 @@ export default {
|
|||
let that = this;
|
||||
let paramsGoal = {};
|
||||
paramsGoal.page = 0;
|
||||
paramsGoal.year = that.query.year_s;
|
||||
paramsGoal.mgroup = that.query.mgroup;
|
||||
that.$API.mtm.goal.list.req(paramsGoal).then((ress) => {
|
||||
if (ress.length > 0) {
|
||||
|
@ -485,8 +485,8 @@ export default {
|
|||
monthGoal[12] = goal.goal_val_12;
|
||||
that.monthGoal = monthGoal;
|
||||
}
|
||||
if (
|
||||
goal.goal_cate_name == "单位产品综合电耗(kW·h/t)"
|
||||
else if (
|
||||
goal.goal_cate_name == "单位产品综合电耗(KW·h/t)"
|
||||
) {
|
||||
monthGoal2[0] = goal.goal_val;
|
||||
monthGoal2[1] = goal.goal_val_1;
|
||||
|
@ -503,7 +503,8 @@ export default {
|
|||
monthGoal2[12] = goal.goal_val_12;
|
||||
that.monthGoal2 = monthGoal2;
|
||||
}
|
||||
if (goal.goal_cate_name == "单位产品标煤耗(kgce/t)") {
|
||||
|
||||
else if (goal.goal_cate_name == "单位产品标煤耗(kgce/t)") {
|
||||
monthGoal3[0] = goal.goal_val;
|
||||
monthGoal3[1] = goal.goal_val_1;
|
||||
monthGoal3[2] = goal.goal_val_2;
|
||||
|
@ -519,21 +520,21 @@ export default {
|
|||
monthGoal3[12] = goal.goal_val_12;
|
||||
that.monthGoal3 = monthGoal3;
|
||||
}
|
||||
if (
|
||||
else if (
|
||||
goal.goal_cate_name == "单位产品综合能耗(kgce/t)"
|
||||
) {
|
||||
monthGoal4[0] = goal.goal_val;
|
||||
monthGoal4[1] = goal.goal_val_2;
|
||||
monthGoal4[2] = goal.goal_val_3;
|
||||
monthGoal4[3] = goal.goal_val_4;
|
||||
monthGoal4[4] = goal.goal_val_5;
|
||||
monthGoal4[5] = goal.goal_val_6;
|
||||
monthGoal4[6] = goal.goal_val_7;
|
||||
monthGoal4[7] = goal.goal_val_8;
|
||||
monthGoal4[8] = goal.goal_val_9;
|
||||
monthGoal4[9] = goal.goal_val_10;
|
||||
monthGoal4[10] = goal.goal_val_11;
|
||||
monthGoal4[11] = goal.goal_val_12;
|
||||
monthGoal4[1] = goal.goal_val_1;
|
||||
monthGoal4[2] = goal.goal_val_2;
|
||||
monthGoal4[3] = goal.goal_val_3;
|
||||
monthGoal4[4] = goal.goal_val_4;
|
||||
monthGoal4[5] = goal.goal_val_5;
|
||||
monthGoal4[6] = goal.goal_val_6;
|
||||
monthGoal4[7] = goal.goal_val_7;
|
||||
monthGoal4[8] = goal.goal_val_8;
|
||||
monthGoal4[9] = goal.goal_val_9;
|
||||
monthGoal4[10] = goal.goal_val_10;
|
||||
monthGoal4[11] = goal.goal_val_11;
|
||||
monthGoal4[12] = goal.goal_val_12;
|
||||
that.monthGoal4 = monthGoal4;
|
||||
}
|
||||
|
@ -665,6 +666,7 @@ export default {
|
|||
arrs[9] = item.id;
|
||||
wrapArrs.push(arrs);
|
||||
arrs2[1] = item.celec_consume_unit;
|
||||
|
||||
arrs2[2] =
|
||||
that.monthGoal2[ind] !== undefined
|
||||
? that.monthGoal2[ind]
|
||||
|
|
|
@ -33,9 +33,10 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th @click="goToTarget('3626253601661739008')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;">月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th @click="goToTarget('3626253601661739008')">年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -335,12 +336,12 @@ let yAxis = [
|
|||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 80,
|
||||
offset: 50,
|
||||
max:100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[2],
|
||||
color: colors[1],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
|
@ -356,7 +357,7 @@ let yAxis = [
|
|||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
color: colors[2],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
|
@ -370,6 +371,23 @@ let yAxis = [
|
|||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 70,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "水泥磨台时产量",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
|
@ -400,11 +418,10 @@ let yAxis_month = [
|
|||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "水泥磨运转率(%)",
|
||||
name: "水泥磨台时产量",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 80,
|
||||
max:100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
|
@ -415,13 +432,14 @@ let yAxis_month = [
|
|||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},{
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "水泥磨台时产量",
|
||||
name: "水泥磨运转率(%)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 80,
|
||||
offset: 40,
|
||||
max:100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
|
@ -433,30 +451,13 @@ let yAxis_month = [
|
|||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "水泥磨运转率(%)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset: 80,
|
||||
max:100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "分布电耗(kW·h/t)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 30,
|
||||
offset:80,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
|
@ -528,7 +529,7 @@ let yAxis_hour = [
|
|||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
color: colors[1],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
|
@ -545,7 +546,7 @@ let yAxis_hour = [
|
|||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[4],
|
||||
color: colors[2],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
|
@ -658,12 +659,6 @@ export default {
|
|||
yAxisIndex: 0,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "水泥磨台时产量",
|
||||
type: "bar",
|
||||
yAxisIndex: 0,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "水泥磨运转率",
|
||||
type: "line",
|
||||
|
@ -682,6 +677,12 @@ export default {
|
|||
yAxisIndex: 3,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "水泥磨台时产量",
|
||||
type: "bar",
|
||||
yAxisIndex: 4,
|
||||
data: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
option3: {
|
||||
|
@ -1035,6 +1036,14 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
if (val !== null) {
|
||||
|
@ -1079,10 +1088,16 @@ export default {
|
|||
let data = response;
|
||||
data.forEach((item) => {
|
||||
let ind = item.hour;
|
||||
let cost_=0
|
||||
if(item.total_production==0){
|
||||
cost_=0
|
||||
}else{
|
||||
cost_ = item.production_cost_unit
|
||||
}
|
||||
seriesData0[ind] = item.total_production;
|
||||
// seriesData1[ind] = item.production_hour;
|
||||
// seriesData2[ind] = item.run_rate;
|
||||
seriesData3[ind] = item.production_cost_unit;
|
||||
seriesData3[ind] = cost_;
|
||||
seriesData4[ind] = item.elec_consume_unit;
|
||||
});
|
||||
let options = { ...that.option1 };
|
||||
|
@ -1118,10 +1133,16 @@ export default {
|
|||
let data = response;
|
||||
data.forEach((item) => {
|
||||
let ind = item.day_s - 1;
|
||||
let cost_=0
|
||||
if(item.total_production==0){
|
||||
cost_=0
|
||||
}else{
|
||||
cost_ = item.production_cost_unit
|
||||
}
|
||||
seriesData0[ind] = item.total_production;
|
||||
seriesData1[ind] = item.production_hour;
|
||||
seriesData2[ind] = item.run_rate;
|
||||
seriesData3[ind] = item.production_cost_unit;
|
||||
seriesData3[ind] = cost_;
|
||||
seriesData4[ind] = item.elec_consume_unit;
|
||||
});
|
||||
let options = { ...that.option2 };
|
||||
|
@ -1178,10 +1199,16 @@ export default {
|
|||
data.forEach((item) => {
|
||||
let goal_index = 'goal_val_' + item.month_s;
|
||||
let ind = item.month_s - 1;
|
||||
let cost_=0
|
||||
if(item.total_production==0){
|
||||
cost_=0
|
||||
}else{
|
||||
cost_ = item.production_cost_unit
|
||||
}
|
||||
seriesData0[ind] = item.total_production;
|
||||
seriesData1[ind] = item.production_hour;
|
||||
seriesData2[ind] = item.run_rate;
|
||||
seriesData3[ind] = item.production_cost_unit;
|
||||
seriesData3[ind] = cost_;
|
||||
seriesData4[ind] = item.elec_consume_unit;
|
||||
seriesData5[ind] = that.goal_list[0][goal_index];
|
||||
});
|
||||
|
|
|
@ -455,6 +455,11 @@ export default {
|
|||
mounted() {
|
||||
this.getMgroup();
|
||||
this.getGoals(); //目标种类
|
||||
console.log(this.$route.query.mgroup);
|
||||
if (this.$route.query.mgroup){
|
||||
this.query.mgroup = this.$route.query.mgroup;
|
||||
this.handleQuery();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//目标种类
|
||||
|
|
|
@ -167,6 +167,7 @@ export default {
|
|||
let paramsGoal = {};
|
||||
paramsGoal.page = 0;
|
||||
paramsGoal.mgroup = that.query.mgroup;
|
||||
paramsGoal.year = that.query.year_s;
|
||||
that.$API.mtm.goal.list.req(paramsGoal).then((ress) => {
|
||||
if (ress.length > 0) {
|
||||
let monthGoal = [];
|
||||
|
|
|
@ -24,6 +24,20 @@
|
|||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="query.cate"
|
||||
placeholder="类别"
|
||||
clearable
|
||||
style="margin-left: 2px; width: 120px"
|
||||
class="headerSearch"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in cate"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
v-model="value1"
|
||||
type="datetimerange"
|
||||
|
@ -196,6 +210,7 @@ export default {
|
|||
start_time__year: '',
|
||||
shift: '',
|
||||
team: null,
|
||||
cate: '',
|
||||
},
|
||||
params:{
|
||||
mgroup: "",
|
||||
|
@ -213,6 +228,12 @@ export default {
|
|||
{ id: 1, name: '日统计' },
|
||||
{ id: 2, name: '月统计' },
|
||||
],
|
||||
cate: [
|
||||
{ id: 0, name: '工艺' },
|
||||
{ id: 1, name: '机械' },
|
||||
{ id: 2, name: '电气' },
|
||||
{ id: 2, name: '其他' },
|
||||
],
|
||||
tableNmae: '',
|
||||
tableData1: [],
|
||||
stlogVisiable: false,
|
||||
|
|
|
@ -191,7 +191,11 @@
|
|||
if(index>-1){
|
||||
index = index+2;
|
||||
that.tableDatas[0][index] = item.total_production;
|
||||
//水泥包装台产为0
|
||||
that.tableDatas[1][index] = item.production_hour;
|
||||
if(item.mgroup_name=='水泥包装'){
|
||||
that.tableDatas[1][index] = 0;
|
||||
}
|
||||
let str = '';
|
||||
item.qua_data.forEach((item) => {
|
||||
if(item.rate_pass!==null){
|
||||
|
@ -203,7 +207,7 @@
|
|||
that.tableDatas[4][index] = item.elec_consume;//电耗
|
||||
that.tableDatas[5][index] = item.imaterial_data_dict?item.imaterial_data_dict.柴油?(item.imaterial_data_dict.柴油.cost).toFixed(2):'':'';//柴油
|
||||
that.tableDatas[12][index] = item.out_steam;//蒸汽
|
||||
// 如果是煤磨或水泥包装那么成本为0
|
||||
// 如果是煤磨或水泥包装那么成本为0,
|
||||
if(item.mgroup_name=='煤磨' || item.mgroup_name=='水泥包装'){
|
||||
that.tableDatas[13][index] = 0;
|
||||
}else{
|
||||
|
|
|
@ -0,0 +1,347 @@
|
|||
<!-- 交接班日志报表 -->
|
||||
<template>
|
||||
<el-container class="app-container">
|
||||
<el-header>
|
||||
<div>
|
||||
<el-select v-model="query.mgroup" placeholder="工段" clearable class="headerSearch" @change="updateColumns">
|
||||
<el-option v-for="item in mgroupOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="query.type" placeholder="查询类型" clearable class="headerSearch" @change="typeCange">
|
||||
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="query.sflogs__team"
|
||||
placeholder="班组"
|
||||
clearable
|
||||
style="margin-left: 2px; width: 120px"
|
||||
class="headerSearch"
|
||||
@change="teamChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in teams"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="query.shift"
|
||||
placeholder="班次"
|
||||
clearable
|
||||
style="margin-left: 2px; width: 200px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsShift"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
v-model="value1"
|
||||
type="datetimerange"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
placeholder="日"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
v-if="query.type == 1"
|
||||
style="width: 300px;"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-model="query.month"
|
||||
type="month"
|
||||
value-format="YYYY-MM"
|
||||
format="YYYY-MM"
|
||||
placeholder="月"
|
||||
v-if="query.type == 2"
|
||||
/>
|
||||
<el-button type="primary" icon="el-icon-search"
|
||||
@click="getTableData">
|
||||
</el-button>
|
||||
<el-button type="primary"
|
||||
@click="exportExcel()"
|
||||
:loading="exportLoading"
|
||||
v-auth="'export_excel'">导出xlsx
|
||||
</el-button>
|
||||
<el-button type="primary" @click="handlePrint">打印
|
||||
</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-container>
|
||||
<el-main class="nopadding" id="myReport">
|
||||
<scTable
|
||||
ref="stlogTable"
|
||||
id="myTable"
|
||||
:apiObj="apiObjSflog"
|
||||
:query="query"
|
||||
:params="params"
|
||||
@dataChange = "handleDataChange"
|
||||
row-key="id"
|
||||
stripe
|
||||
hideSetting
|
||||
highlightCurrentRow
|
||||
hideDo
|
||||
> <el-table-column type="index" width="50" />
|
||||
<el-table-column
|
||||
label="工段"
|
||||
prop="mgroup_name"
|
||||
></el-table-column>
|
||||
<el-table-column label="开始时间" prop="start_time">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.start_time.slice(0, 16) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="结束时间" prop="end_time">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.end_time.slice(0, 16) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="班组名称"
|
||||
prop="team_name"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="当前班次"
|
||||
prop="shift_name"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
label="产量(t)"
|
||||
prop="enstat_info.total_production"
|
||||
:formatter="formatToTwoDecimal"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="单耗(kW·h)"
|
||||
prop="enstat_info.elec_consume_unit"
|
||||
:formatter="formatToTwoDecimal">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-if="columnsToShow.includes('run_hour')"
|
||||
label="台时(t/h)"
|
||||
prop="enstat_info.production_hour"
|
||||
:formatter="formatToTwoDecimal"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
v-if="columnsToShow.includes('run_rate')"
|
||||
label="运转率(%)"
|
||||
prop="enstat_info.run_rate"
|
||||
:formatter="formatToTwoDecimal"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
v-if="columnsToShow.includes('production_cost_unit')"
|
||||
label="成本(元/t)"
|
||||
prop="enstat_info.production_cost_unit"
|
||||
:formatter="formatToTwoDecimal"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="(col, index) in quaColumns"
|
||||
:key="index"
|
||||
:label="col.label"
|
||||
:prop="col.prop"
|
||||
:formatter="col.formatter"
|
||||
></el-table-column>
|
||||
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import stlogDialog from "../enm_rm/stlog_form.vue";
|
||||
export default {
|
||||
components: {
|
||||
stlogDialog
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
query: {
|
||||
month: '',
|
||||
year: '',
|
||||
mgroup: '',
|
||||
start_time__gte: '',
|
||||
end_time__lt: '',
|
||||
start_time__month: '',
|
||||
sflogs__team: '',
|
||||
start_time__year: '',
|
||||
end_time__month: '',
|
||||
end_time__year: '',
|
||||
shift: '',
|
||||
team: null,
|
||||
},
|
||||
params:{
|
||||
mgroup: "",
|
||||
start_time__gte: '',
|
||||
end_time__lt: '',
|
||||
},
|
||||
value1:[],
|
||||
materialList: [],
|
||||
sflogexpList: [],
|
||||
optionsShift: [],
|
||||
teams: [],
|
||||
mgroupOptions: [],
|
||||
tableName: '班组成本计算',
|
||||
options: [
|
||||
// { id: 0, name: '班统计' },
|
||||
{ id: 1, name: '日统计' },
|
||||
{ id: 2, name: '月统计' },
|
||||
],
|
||||
tableNmae: '',
|
||||
stlogVisiable: false,
|
||||
apiObjSflog: null,
|
||||
sourceData: {},
|
||||
apiObj: null,
|
||||
apiObj2: null,
|
||||
deptId: "",
|
||||
columnsToShow: [], // 用来存储当前需要显示的列
|
||||
quaColumns: [], // 存储动态列的配置
|
||||
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
var myDate = new Date();
|
||||
let month = myDate.getMonth() + 1;
|
||||
if (month < 10) {
|
||||
month = '0' + month;
|
||||
}
|
||||
this.$API.mtm.mgroup.list
|
||||
.req({ page: 0, search: "电石渣" })
|
||||
.then((res) => {
|
||||
console.log("电石渣", res);
|
||||
this.query.mgroup = res[0].id;
|
||||
this.apiObj = this.$API.wpm.sflog.list;
|
||||
this.deptId = res[0].belong_dept;
|
||||
});
|
||||
this.getShift();
|
||||
this.getMgroup();
|
||||
this.getTeams();
|
||||
this.getShift();
|
||||
|
||||
},
|
||||
methods: {
|
||||
handleDataChange(res, tableData){
|
||||
if (Array.isArray(tableData) &&
|
||||
tableData[2] &&
|
||||
tableData[2].enstat_info &&
|
||||
Array.isArray(tableData[2].enstat_info.qua_data) &&
|
||||
tableData[2].enstat_info.qua_data.length > 0) {
|
||||
const quaData = tableData[2].enstat_info.qua_data; // 第 3 条数据的 qua_data
|
||||
this.quaColumns = quaData.map((item, index) => ({
|
||||
label: item.testitem_name+'(%)',
|
||||
prop: `enstat_info.qua_data[${index}].rate_pass`,
|
||||
formatter:(row)=>{
|
||||
const ratePass = row && row.enstat_info && row.enstat_info.qua_data && row.enstat_info.qua_data[index]? row.enstat_info.qua_data[index].rate_pass : 0;
|
||||
return (ratePass * 100).toFixed(2);
|
||||
}
|
||||
})
|
||||
);
|
||||
} else {
|
||||
this.quaColumns = []; // 数据不足时清空列配置
|
||||
}
|
||||
},
|
||||
|
||||
updateColumns() {
|
||||
this.columnsToShow = [];
|
||||
if (this.query.mgroup==='3626222897737302016'){ // 电石渣
|
||||
|
||||
}else if(this.query.mgroup==='3626223084383801344'){ //原料磨
|
||||
this.columnsToShow = ['run_hour', 'run_rate']
|
||||
}else if(this.query.mgroup==='3744925985427398656'){//生料工序(二次配料)
|
||||
this.columnsToShow = ['run_hour', 'run_rate', 'production_cost_unit']
|
||||
}else if(this.query.mgroup==='3626253231757619200'){//煤磨
|
||||
this.columnsToShow = ['run_hour', 'run_rate', 'production_cost_unit']
|
||||
}else if(this.query.mgroup==='3626253029718056960'){//回转窑
|
||||
this.columnsToShow = ['run_hour', 'run_rate', 'production_cost_unit']
|
||||
}else if(this.query.mgroup==='3626253601661739008'){//水泥磨
|
||||
this.columnsToShow = ['run_hour', 'run_rate', 'production_cost_unit']
|
||||
}else {
|
||||
this.columnsToShow = []
|
||||
}
|
||||
},
|
||||
//获取工段列表
|
||||
formatToTwoDecimal(row, column, cellValue) {
|
||||
// 如果值为 null 或 undefined,则返回空字符串
|
||||
if (cellValue == null) return "";
|
||||
// 保留两位小数
|
||||
return Number(cellValue).toFixed(2);
|
||||
},
|
||||
getMgroup() {
|
||||
this.$API.mtm.mgroup.list.req({ page: 0, cate: 'section' }).then(res => {
|
||||
res.forEach(item => {
|
||||
this.mgroupOptions.push(item);
|
||||
})
|
||||
this.mgroupOptions = this.mgroupOptions.reverse();
|
||||
this.apiObjSflog = this.$API.wpm.sflog.list;
|
||||
this.tableName = this.mgroupOptions[0].name;
|
||||
})
|
||||
},
|
||||
|
||||
//获取班组列表
|
||||
getTeams() {
|
||||
let form = {};
|
||||
form.page = 0;
|
||||
this.teams = [];
|
||||
this.$API.mtm.team.list.req(form).then((res) => {
|
||||
this.teams = res;
|
||||
});
|
||||
},
|
||||
//班组列表
|
||||
getShift() {
|
||||
this.$API.mtm.shift.list.req({ page: 0 }).then(res => {
|
||||
this.optionsShift = res;
|
||||
})
|
||||
},
|
||||
getTableData() {
|
||||
let that = this;
|
||||
let arr = [];
|
||||
if (that.query.type == 1) {
|
||||
this.query.start_time__gte = this.value1[0];
|
||||
this.query.end_time__lt = this.value1[1];}
|
||||
else if (that.query.type == 2) {
|
||||
this.query.start_time__gte = '',
|
||||
this.query.end_time__lt = '',
|
||||
arr = that.query.month.split('-');
|
||||
this.query.end_time__year = Number(arr[0]);
|
||||
this.query.end_time__month = Number(arr[1]);
|
||||
}
|
||||
this.$refs.stlogTable.queryData(this.query)
|
||||
},
|
||||
|
||||
handlePrint() {
|
||||
this.$PRINT('#myReport');
|
||||
},
|
||||
exportExcel() {
|
||||
this.exportLoading = true;
|
||||
this.$XLSX('#myTable', this.tableName)
|
||||
this.exportLoading = false;
|
||||
},
|
||||
//点击stlog,展示sflogexp
|
||||
// stlogRowClick(row) {
|
||||
// console.log(row);
|
||||
// this.sflogexpList = [];
|
||||
// this.clickItem = row;
|
||||
// this.getSflogexp(row.id);
|
||||
// },
|
||||
getSflogexp(id) {
|
||||
let obj = {};
|
||||
obj.page = 0;
|
||||
obj.stlog = id;
|
||||
this.$API.wpm.sflogexp.list.req(obj).then((res) => {
|
||||
this.sflogexpList = res;
|
||||
console.log(this.sflogexpList);
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.printContainer {
|
||||
width: 100%;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
</style>
|
|
@ -33,9 +33,14 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th
|
||||
@click="goToTarget('3626223084383801344')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;"
|
||||
>月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th
|
||||
@click="goToTarget('3626223084383801344')"
|
||||
>年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -383,6 +388,40 @@ let yAxis = [
|
|||
nameRotate: 50
|
||||
}
|
||||
];
|
||||
let yAxis_hour = [
|
||||
{
|
||||
type: "value",
|
||||
name: "产量 (t)",
|
||||
position: "left",
|
||||
alignTicks: true,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[0],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
nameRotate: 50
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "分布电耗(kW·h)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
nameRotate: 50
|
||||
}
|
||||
];
|
||||
let yAxis_month = [
|
||||
{
|
||||
type: "value",
|
||||
|
@ -455,6 +494,7 @@ let yAxis_month = [
|
|||
name: "分布电耗目标值",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
offset: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
|
@ -528,40 +568,7 @@ export default {
|
|||
},
|
||||
data: [],
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "产量 (t)",
|
||||
position: "left",
|
||||
alignTicks: true,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[0],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
nameRotate: 50
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "分布电耗(kW·h)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
nameRotate: 50
|
||||
},
|
||||
],
|
||||
yAxis: yAxis_hour,
|
||||
series: [
|
||||
{
|
||||
name: "立磨总产量",
|
||||
|
@ -572,7 +579,7 @@ export default {
|
|||
{
|
||||
name: "分布电耗",
|
||||
type: "bar",
|
||||
yAxisIndex: 0,
|
||||
yAxisIndex: 1,
|
||||
data: [],
|
||||
},
|
||||
],
|
||||
|
@ -1121,6 +1128,14 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
console.log(val);
|
||||
|
|
|
@ -33,9 +33,10 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th @click="goToTarget('3744925985427398656')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;">月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th @click="goToTarget('3744925985427398656')">年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -1185,6 +1186,14 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
console.log(val);
|
||||
|
|
|
@ -33,9 +33,10 @@
|
|||
<th>昨日</th>
|
||||
<th>本月</th>
|
||||
<th>本年</th>
|
||||
<th>月目标值</th>
|
||||
<th>月完成度</th>
|
||||
<th>年目标值</th>
|
||||
<th @click="goToTarget('3626222897737302016')"
|
||||
style="font-weight: bold; color: #1CD6DD; font-size: 18px;">月目标值</th>
|
||||
<th >月完成度</th>
|
||||
<th @click="goToTarget('3626222897737302016')">年目标值</th>
|
||||
<th>年完成度</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -82,13 +83,23 @@
|
|||
<el-radio-group
|
||||
v-model="typeRadio"
|
||||
@change="typeRadioChange"
|
||||
>
|
||||
>
|
||||
<el-radio-button label="days">按时</el-radio-button>
|
||||
<el-radio-button label="month"
|
||||
>按日</el-radio-button
|
||||
>
|
||||
<el-radio-button label="year">按月</el-radio-button>
|
||||
</el-radio-group>
|
||||
<div style="position: absolute; right: 20px">
|
||||
<el-date-picker
|
||||
v-model="searchDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
formatter="YYYY-MM-DD"
|
||||
placeholder="选择日期"
|
||||
v-if="typeRadio == 'days'"
|
||||
@change="dateChange"
|
||||
></el-date-picker>
|
||||
<el-date-picker
|
||||
v-model="searchDate"
|
||||
type="month"
|
||||
|
@ -109,7 +120,14 @@
|
|||
></el-date-picker>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chartWrap" v-show="typeRadio == 'days'">
|
||||
<div class="chartTitle">本日生产参数统计图</div>
|
||||
<scEcharts
|
||||
height="400px"
|
||||
width="1035px"
|
||||
:option="optionHour"
|
||||
></scEcharts>
|
||||
</div>
|
||||
<div class="chartWrap" v-show="typeRadio == 'month'">
|
||||
<div class="chartTitle">本月生产参数统计图</div>
|
||||
<scEcharts
|
||||
|
@ -384,7 +402,7 @@ let yAxis = [
|
|||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 50,
|
||||
offset: 100,
|
||||
offset: 150,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
|
@ -413,6 +431,111 @@ let yAxis = [
|
|||
},
|
||||
},
|
||||
|
||||
];
|
||||
|
||||
let yAxis_hour = [
|
||||
{
|
||||
type: "value",
|
||||
name: "电石渣干粉总产量 (t)",
|
||||
position: "left",
|
||||
alignTicks: true,
|
||||
nameRotate: 50,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[0],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
nameRotate: 50,
|
||||
name: "电石渣干粉分布电耗(kW·h/t)",
|
||||
position: "left",
|
||||
alignTicks: true,
|
||||
offset: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[1],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
nameRotate: 50,
|
||||
name: "电石渣工段总电量(kW·h)",
|
||||
position: "left",
|
||||
alignTicks: true,
|
||||
offset: 50,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[2],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
type: "value",
|
||||
nameRotate: 50,
|
||||
name: "成本(元/t)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[3],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "湿电石渣消耗(t)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 50,
|
||||
offset: 50,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[4],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "湿电石渣进厂(t)",
|
||||
position: "right",
|
||||
alignTicks: true,
|
||||
nameRotate: 50,
|
||||
offset: 90,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: colors[5],
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
},
|
||||
}
|
||||
|
||||
];
|
||||
export default {
|
||||
components: {
|
||||
|
@ -455,6 +578,7 @@ export default {
|
|||
echartType: "line",
|
||||
asynDialog: false,
|
||||
goal_list :[],
|
||||
optionHour: {},
|
||||
option1: {
|
||||
color: colors,
|
||||
tooltip: tooltip,
|
||||
|
@ -469,7 +593,7 @@ export default {
|
|||
},
|
||||
data: [],
|
||||
},
|
||||
yAxis: yAxis,
|
||||
yAxis: yAxis_hour,
|
||||
series: [
|
||||
{
|
||||
name: "电石渣干粉总产量",
|
||||
|
@ -569,6 +693,60 @@ export default {
|
|||
},
|
||||
],
|
||||
},
|
||||
option3: {
|
||||
color: colors,
|
||||
tooltip: tooltip,
|
||||
grid: grid,
|
||||
toolbox: toolbox,
|
||||
legend: legend,
|
||||
xAxis: {
|
||||
axisTick: {
|
||||
show: true,
|
||||
length: 5,
|
||||
inside: true,
|
||||
},
|
||||
data: [],
|
||||
},
|
||||
yAxis: yAxis_hour,
|
||||
series: [
|
||||
{
|
||||
name: "电石渣干粉总产量",
|
||||
type: "bar",
|
||||
yAxisIndex: 0,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "电石渣干粉分布电耗",
|
||||
type: "bar",
|
||||
yAxisIndex: 1,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "电石渣工段总电量",
|
||||
type: "bar",
|
||||
yAxisIndex: 2,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "成本",
|
||||
type: "bar",
|
||||
yAxisIndex: 3,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "湿电石渣消耗",
|
||||
type: "bar",
|
||||
yAxisIndex: 4,
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: "湿电石渣进厂",
|
||||
type: "bar",
|
||||
yAxisIndex: 5,
|
||||
data: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@ -785,18 +963,18 @@ export default {
|
|||
that.tableDatas[0][6]
|
||||
);
|
||||
that.tableDatas[1][4] = data2.elec_consume_unit;
|
||||
that.tableDatas[1][7] = precen(
|
||||
that.tableDatas[1][7] = consume_precen(
|
||||
that.tableDatas[1][4],
|
||||
that.tableDatas[1][6]
|
||||
);
|
||||
that.tableDatas[2][4] = data2.elec_consume;
|
||||
that.tableDatas[3][4] =
|
||||
data2.production_cost_unit;
|
||||
that.tableDatas[3][7] = precen(
|
||||
that.tableDatas[3][7] = consume_precen(
|
||||
that.tableDatas[3][3],
|
||||
that.tableDatas[3][6]
|
||||
);
|
||||
that.tableDatas[2][7] = precen(
|
||||
that.tableDatas[2][7] = consume_precen(
|
||||
that.tableDatas[2][4],
|
||||
that.tableDatas[2][6]
|
||||
);
|
||||
|
@ -820,6 +998,7 @@ export default {
|
|||
}
|
||||
});
|
||||
});
|
||||
that.getHourData(year, month, days);
|
||||
that.getDayData(year, month);
|
||||
that.getMonthData(year);
|
||||
});
|
||||
|
@ -828,10 +1007,25 @@ export default {
|
|||
typeRadioChange() {
|
||||
this.searchDate = "";
|
||||
},
|
||||
goToTarget(mgroup_id) {
|
||||
this.$router.push({
|
||||
path: "/enm_monthSet/goalSetting",
|
||||
query: {
|
||||
mgroup: mgroup_id,
|
||||
},
|
||||
})
|
||||
},
|
||||
dateChange(val) {
|
||||
let that = this;
|
||||
|
||||
if (val !== null) {
|
||||
if (this.typeRadio == "month") {
|
||||
if (this.typeRadio == "days") {
|
||||
let year = val.split("-")[0];
|
||||
let month = val.split("-")[1];
|
||||
let days = val.split("-")[2];
|
||||
this.getHourData(year, month, days);
|
||||
}
|
||||
else if (this.typeRadio == "month") {
|
||||
let year = val.split("-")[0];
|
||||
let month = val.split("-")[1];
|
||||
month = Number(month);
|
||||
|
@ -840,13 +1034,66 @@ export default {
|
|||
this.getMonthData(val);
|
||||
}
|
||||
} else {
|
||||
if (this.typeRadio == "month") {
|
||||
if (this.typeRadio == "days") {
|
||||
this.getHourData(that.year, that.month, that.days);
|
||||
}
|
||||
else if (this.typeRadio == "month") {
|
||||
this.getDayData(that.year, that.month);
|
||||
} else {
|
||||
this.getMonthData(that.year);
|
||||
}
|
||||
}
|
||||
},
|
||||
//获取小时数据
|
||||
getHourData(year, month, days) {
|
||||
let that = this;
|
||||
let query = {};
|
||||
query.page = 0;
|
||||
query.year = year;
|
||||
query.month = month;
|
||||
query.day = days;
|
||||
query.type = "hour_s";
|
||||
query.mgroup = that.query.mgroup;
|
||||
this.$API.enm.enstat.req(query).then((response) => {
|
||||
let seriesData0 = [],
|
||||
seriesData1 = [],
|
||||
seriesData2 = [],
|
||||
seriesData3 = [],
|
||||
seriesData4 = [],
|
||||
seriesData5 = [];
|
||||
let data = response;
|
||||
data.forEach((item) => {
|
||||
let ind = item.hour ;
|
||||
seriesData0[ind] = item.total_production;
|
||||
seriesData1[ind] = item.production_cost_unit;
|
||||
seriesData2[ind] = item.elec_consume_unit;
|
||||
seriesData5[ind] = item.elec_consume;
|
||||
if (item.imaterial_data.length > 0) {
|
||||
item.imaterial_data.forEach((items_n) => {
|
||||
if (items_n.material_name == "湿电石渣消耗") {
|
||||
seriesData3[ind] = items_n.amount_consume;
|
||||
}else if(items_n.material_name == "湿电石渣进厂"){
|
||||
seriesData4[ind] = items_n.amount_consume;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
let options = { ...that.option3 };
|
||||
options.series[0].data = seriesData0;
|
||||
options.series[1].data = seriesData2;
|
||||
options.series[2].data = seriesData5;
|
||||
options.series[3].data = seriesData1;
|
||||
options.series[4].data = seriesData3;
|
||||
options.series[5].data = seriesData4;
|
||||
let hourXAxis = [];
|
||||
for (let i = 0; i < 24; i++) {
|
||||
let item = i + "时";
|
||||
hourXAxis.push(item);
|
||||
}
|
||||
options.xAxis.data = hourXAxis;
|
||||
that.optionHour = options;
|
||||
});
|
||||
},
|
||||
//获取天数据
|
||||
getDayData(year, month) {
|
||||
let that = this;
|
||||
|
|
Loading…
Reference in New Issue