fix:煤磨mgroup接口获取

This commit is contained in:
shijing 2024-04-26 10:41:11 +08:00
parent ffc08a38de
commit dbd019d0ef
4 changed files with 2626 additions and 2148 deletions

View File

@ -8,20 +8,25 @@
:loading="exportLoading" :loading="exportLoading"
>导出xlsx >导出xlsx
</el-button> </el-button>
<el-button <el-button type="primary" @click="handlePrint">打印 </el-button>
type="primary"
@click="handlePrint"
>打印
</el-button>
</div> </div>
</el-header> </el-header>
<el-card style="margin-top: 5px"> <el-card style="margin-top: 5px">
<div class="printWrap"> <div class="printWrap">
<div ref="print" id="myReport" class="printContainer"> <div ref="print" id="myReport" class="printContainer">
<table border="1" width="1035" cellspacing="0" :key="timeStamp" class="myTable" id="myTable"> <table
border="1"
width="1035"
cellspacing="0"
:key="timeStamp"
class="myTable"
id="myTable"
>
<thead class="myTableHead"> <thead class="myTableHead">
<tr> <tr>
<th colspan="6">煤磨工段主要设备100KW以上单位产品电耗数据表</th> <th colspan="6">
煤磨工段主要设备100KW以上单位产品电耗数据表
</th>
</tr> </tr>
<tr> <tr>
<th>设备名称</th> <th>设备名称</th>
@ -34,26 +39,64 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="item in tableDatas" :key="item"> <tr v-for="item in tableDatas" :key="item">
<template v-for="(item1,ind) in item" :key="item1"> <template
<td v-if="ind==0||ind==1||ind==2" class="numCell">{{item1}}</td> v-for="(item1, ind) in item"
<td v-if="ind==3" class="numCell hoursItem" @click="itemClick('hour_s',item1)">{{item1}}</td> :key="item1"
<td v-if="ind==4" class="numCell monthItem" @click="itemClick('day_s',item1)">{{item1}}</td> >
<td v-if="ind==5" class="numCell yearItem" @click="itemClick('month_s',item1)">{{item1}}</td> <td
v-if="ind == 0 || ind == 1 || ind == 2"
class="numCell"
>
{{ item1 }}
</td>
<td
v-if="ind == 3"
class="numCell hoursItem"
@click="itemClick('hour_s', item1)"
>
{{ item1 }}
</td>
<td
v-if="ind == 4"
class="numCell monthItem"
@click="itemClick('day_s', item1)"
>
{{ item1 }}
</td>
<td
v-if="ind == 5"
class="numCell yearItem"
@click="itemClick('month_s', item1)"
>
{{ item1 }}
</td>
</template> </template>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">小时生产参数统计图</div> <div class="chartTitle">小时生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionHour"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionHour"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div> <div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div> <div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div> </div>
</div> </div>
</div> </div>
@ -66,19 +109,26 @@
:mgroup="query.mgroup" :mgroup="query.mgroup"
:modelValue="modelValue" :modelValue="modelValue"
:showClose="showClose" :showClose="showClose"
:echartType='echartType' :echartType="echartType"
@closed="asynDialog = false" @closed="asynDialog = false"
></charts> ></charts>
</el-card> </el-card>
</div> </div>
</template> </template>
<script> <script>
const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666']; const colors = [
"#647bfe",
"#8698fe",
"#a9b6fe",
"#cbd3fe",
"#91CC75",
"#EE6666",
];
let tooltip = { let tooltip = {
show: true, show: true,
trigger: 'axis', trigger: "axis",
axisPointer: { axisPointer: {
type: 'cross' type: "cross",
}, },
confine: false, confine: false,
showContent: true, showContent: true,
@ -86,42 +136,44 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
// alwaysShowContent:true, // alwaysShowContent:true,
}; };
let grid = { let grid = {
right: '3%', right: "3%",
left:'7%', left: "7%",
top:'15%' top: "15%",
}; };
let toolbox = { let toolbox = {
right:'5%', right: "5%",
feature: { feature: {
dataView: { show: true, readOnly: false }, dataView: { show: true, readOnly: false },
// restore: { show: true }, // restore: { show: true },
saveAsImage: { show: true } saveAsImage: { show: true },
} },
}; };
let legend = { let legend = {
top:'2%', top: "2%",
data:['煤磨排风机主电机', '煤磨主电机'] data: ["煤磨排风机主电机", "煤磨主电机"],
}; };
let yAxis = { let yAxis = {
type: 'value', type: "value",
name: '分布电耗(KW.h/t)', name: "分布电耗(KW.h/t)",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[3] color: colors[3],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}; };
import scEcharts from "@/components/scEcharts"; import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue' import { defineAsyncComponent } from "vue";
export default { export default {
components: { components: {
scEcharts, scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")), charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
}, },
data() { data() {
return { return {
@ -135,20 +187,20 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
days: 1, days: 1,
hours: 1, hours: 1,
query: { query: {
mgroup:'3347217512021835776', mgroup: "",
}, },
tableName:'主要设备100KW以上单位产品电耗数据表', tableName: "主要设备100KW以上单位产品电耗数据表",
tableDatas: [ tableDatas: [
['煤磨排风机主电机','','KW·h/t','','',''], ["煤磨排风机主电机", "", "KW·h/t", "", "", ""],
['煤磨主电机','','KW·h/t','','',''], ["煤磨主电机", "", "KW·h/t", "", "", ""],
], ],
modelValue: true, modelValue: true,
type:'hour_s', type: "hour_s",
title:'煤磨工段', title: "煤磨工段",
cate:'', cate: "",
apiObj: this.$API.enm.mpoint.stat, apiObj: this.$API.enm.mpoint.stat,
showClose: true, showClose: true,
echartType:'line', echartType: "line",
asynDialog: false, asynDialog: false,
allValHour: 0, allValHour: 0,
allValDays: 0, allValDays: 0,
@ -165,21 +217,21 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
}, },
] ],
}, },
option2: { option2: {
color: colors, color: colors,
@ -193,21 +245,21 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
}, },
] ],
}, },
option3: { option3: {
color: colors, color: colors,
@ -221,22 +273,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
},
],
}, },
]
}
}; };
}, },
mounted() { mounted() {
@ -249,8 +314,11 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let timeDate = myDate.getTime(); let timeDate = myDate.getTime();
let dayTime = 24 * 60 * 60 * 1000; let dayTime = 24 * 60 * 60 * 1000;
// //
let year_d = year,month_d = month,days_d = days; let year_d = year,
if(hours<21){//21点前查找昨日数据为前一天数据 month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime; let newDate = timeDate - dayTime;
let lastDate = new Date(newDate); let lastDate = new Date(newDate);
year_d = lastDate.getFullYear(); year_d = lastDate.getFullYear();
@ -264,51 +332,79 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let month_h = hourDate.getMonth() + 1; let month_h = hourDate.getMonth() + 1;
let days_h = hourDate.getDate(); let days_h = hourDate.getDate();
let hours_h = hourDate.getHours(); let hours_h = hourDate.getHours();
this.$API.mtm.mgroup.list
.req({ page: 0, search: "煤磨" })
.then((res) => {
console.log("煤磨", res);
that.query.mgroup = res[0].id;
// //
let params2 = {}; let params2 = {};
params2.page = 0; params2.page = 0;
params2.year_s = year; params2.year_s = year;
params2.month_s = month; params2.month_s = month;
params2.type = 'month_s'; params2.type = "month_s";
params2.mgroup = this.query.mgroup; params2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => { that.$API.enm.enstat
.req(params2)
.then((res2) => {
if (res2.length > 0) { if (res2.length > 0) {
let hourProduct=that.allValMonth = res2[0].total_production;// let hourProduct = (that.allValMonth =
res2[0].total_production); //
params2.mpoint__ep_monitored__power_kw__gte = 100; params2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params2).then((res) => { that.$API.enm.mpoint.stat
.req(params2)
.then((res) => {
let data2 = res; let data2 = res;
for (let i = 0; i < data2.length; i++) { for (let i = 0; i < data2.length; i++) {
that.tableDatas[i] = []; that.tableDatas[i] = [];
that.tableDatas[i][0]=data2[i].ep_monitored_name; that.tableDatas[i][0] =
that.tableDatas[i][1]=data2[i].ep_monitored_number; data2[i].ep_monitored_name;
that.tableDatas[i][2]='KW·h/t'; that.tableDatas[i][1] =
let val = hourProduct==0?'/':(data2[i].val/hourProduct).toFixed(2); data2[i].ep_monitored_number;
that.tableDatas[i][2] = "KW·h/t";
let val =
hourProduct == 0
? "/"
: (
data2[i].val /
hourProduct
).toFixed(2);
that.tableDatas[i][5] = val; that.tableDatas[i][5] = val;
} }
}) });
} }
}).then(res2=>{ })
.then((res2) => {
// //
let params3 = {}; let params3 = {};
params3.page = 0; params3.page = 0;
params3.year_s = year_d; params3.year_s = year_d;
params3.month_s = month_d; params3.month_s = month_d;
params3.day_s = days_d; params3.day_s = days_d;
params3.type = 'day_s'; params3.type = "day_s";
params3.mgroup = this.query.mgroup; params3.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => { that.$API.enm.enstat.req(params3).then((res3) => {
if (res3.length > 0) { if (res3.length > 0) {
let hourProduct=that.allValDays = res3[0].total_production; let hourProduct = (that.allValDays =
res3[0].total_production);
params3.mpoint__ep_monitored__power_kw__gte = 100; params3.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params3).then((res) => { that.$API.enm.mpoint.stat
.req(params3)
.then((res) => {
let data3 = res3; let data3 = res3;
for (let j = 0; j < data3.length; j++) { for (let j = 0; j < data3.length; j++) {
let val = hourProduct==0?'/':(data3[j].val/hourProduct).toFixed(2); let val =
hourProduct == 0
? "/"
: (
data3[j].val /
hourProduct
).toFixed(2);
that.tableDatas[j][4] = val; that.tableDatas[j][4] = val;
} }
}) });
} }
}) });
// //
let params4 = {}; let params4 = {};
params4.page = 0; params4.page = 0;
@ -316,25 +412,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
params4.month = month_h; params4.month = month_h;
params4.day = days_h; params4.day = days_h;
params4.hour = hours_h; params4.hour = hours_h;
params4.type = 'hour_s'; params4.type = "hour_s";
params4.mgroup = this.query.mgroup; params4.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params4).then((res4) => { that.$API.enm.enstat.req(params4).then((res4) => {
if (res4.length > 0) { if (res4.length > 0) {
let hourProduct=that.allValHour = res4[0].total_production; let hourProduct = (that.allValHour =
res4[0].total_production);
params4.mpoint__ep_monitored__power_kw__gte = 100; params4.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params4).then((res) => { that.$API.enm.mpoint.stat
.req(params4)
.then((res) => {
let data4 = res4; let data4 = res4;
for (let k = 0; k < data4.length; k++) { for (let k = 0; k < data4.length; k++) {
let val = hourProduct==0?'/':(data4[k].val/hourProduct).toFixed(2); let val =
hourProduct == 0
? "/"
: (
data4[k].val /
hourProduct
).toFixed(2);
that.tableDatas[k][3] = val; that.tableDatas[k][3] = val;
} }
}) });
} }
}) });
}) });
that.getHourData(); that.getHourData();
that.getDayData(); that.getDayData();
that.getMonthData(); that.getMonthData();
});
}, },
methods: { methods: {
// //
@ -345,23 +451,24 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
query.year_s = that.year; query.year_s = that.year;
query.month_s = that.month; query.month_s = that.month;
query.day_s = that.days; query.day_s = that.days;
query.type = 'hour_s'; query.type = "hour_s";
query.mgroup = that.query.mgroup; query.mgroup = that.query.mgroup;
query.mpoint__ep_monitored__power_kw__gte = 100; query.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(query).then((response) => { this.$API.enm.mpoint.stat.req(query).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.hour; let ind = item.hour;
let val = 0; let val = 0;
if (that.allValHour == 0) { if (that.allValHour == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValHour).toFixed(2); val = (item.val / that.allValHour).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -370,12 +477,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let hourXAxis = []; let hourXAxis = [];
for (let i = 1; i <= that.hours; i++) { for (let i = 1; i <= that.hours; i++) {
let item = i+'时' let item = i + "时";
hourXAxis.push(item) hourXAxis.push(item);
} }
options.xAxis.data = hourXAxis; options.xAxis.data = hourXAxis;
that.optionHour = options; that.optionHour = options;
}) });
}, },
// //
getDayData() { getDayData() {
@ -384,24 +491,25 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
query1.page = 0; query1.page = 0;
query1.year_s = that.year; query1.year_s = that.year;
query1.month_s = that.month; query1.month_s = that.month;
query1.type = 'day_s'; query1.type = "day_s";
query1.mgroup = this.query.mgroup; query1.mgroup = this.query.mgroup;
query1.mpoint__ep_monitored__power_kw__gte = 100; query1.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query1).then((response) => { this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
// debugger; // debugger;
let ind = item.day_s; let ind = item.day_s;
let val = 0; let val = 0;
if (that.allValDays == 0) { if (that.allValDays == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValDays).toFixed(2); val = (item.val / that.allValDays).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -410,12 +518,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let dayXAxis = []; let dayXAxis = [];
for (let i = 1; i <= that.days; i++) { for (let i = 1; i <= that.days; i++) {
let item = i+'日' let item = i + "日";
dayXAxis.push(item) dayXAxis.push(item);
} }
options.xAxis.data = dayXAxis; options.xAxis.data = dayXAxis;
that.optionDay = options; that.optionDay = options;
}) });
}, },
// //
getMonthData() { getMonthData() {
@ -423,23 +531,24 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let query2 = {}; let query2 = {};
query2.page = 0; query2.page = 0;
query2.year_s = that.year; query2.year_s = that.year;
query2.type = 'month_s'; query2.type = "month_s";
query2.mgroup = that.query.mgroup; query2.mgroup = that.query.mgroup;
query2.mpoint__ep_monitored__power_kw__gte = 100; query2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query2).then((response) => { this.$API.enm.enstat.req(query2).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.month_s; let ind = item.month_s;
let val = 0; let val = 0;
if (that.allValMonth == 0) { if (that.allValMonth == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValMonth).toFixed(2); val = (item.val / that.allValMonth).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -448,12 +557,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let monthXAxis = []; let monthXAxis = [];
for (let i = 1; i <= that.month; i++) { for (let i = 1; i <= that.month; i++) {
let item = i+'月' let item = i + "月";
monthXAxis.push(item) monthXAxis.push(item);
} }
options.xAxis.data = monthXAxis; options.xAxis.data = monthXAxis;
that.optionMonth = options; that.optionMonth = options;
}) });
}, },
itemClick(type, item) { itemClick(type, item) {
this.type = type; this.type = type;
@ -461,14 +570,14 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
this.asynDialog = true; this.asynDialog = true;
}, },
handlePrint() { handlePrint() {
this.$PRINT('#myReport'); this.$PRINT("#myReport");
}, },
exportExcel() { exportExcel() {
this.exportLoading = true; this.exportLoading = true;
this.$XLSX('#myTable', this.tableName) this.$XLSX("#myTable", this.tableName);
this.exportLoading = false; this.exportLoading = false;
}, },
} },
}; };
</script> </script>
<style scoped> <style scoped>

View File

@ -8,17 +8,20 @@
:loading="exportLoading" :loading="exportLoading"
>导出xlsx >导出xlsx
</el-button> </el-button>
<el-button <el-button type="primary" @click="handlePrint">打印 </el-button>
type="primary"
@click="handlePrint"
>打印
</el-button>
</div> </div>
</el-header> </el-header>
<el-card style="margin-top: 5px"> <el-card style="margin-top: 5px">
<div class="printWrap"> <div class="printWrap">
<div ref="print" id="myReport" class="printContainer"> <div ref="print" id="myReport" class="printContainer">
<table border="1" width="1035" cellspacing="0" :key="timeStamp" id="myTable" class="myTable"> <table
border="1"
width="1035"
cellspacing="0"
:key="timeStamp"
id="myTable"
class="myTable"
>
<thead class="myTableHead"> <thead class="myTableHead">
<tr> <tr>
<th colspan="10">煤磨工段生产报告</th> <th colspan="10">煤磨工段生产报告</th>
@ -37,13 +40,41 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="(item, index) in tableDatas" :key="item"> <tr v-for="(item, index) in tableDatas" :key="item">
<td class="numCell" v-if="index==0||index==2" rowspan="2">{{item[0]}}</td> <td
<td class="numCell" v-else-if="index==4">{{item[0]}}</td> class="numCell"
v-if="index == 0 || index == 2"
rowspan="2"
>
{{ item[0] }}
</td>
<td class="numCell" v-else-if="index == 4">
{{ item[0] }}
</td>
<td class="numCell">{{ item[1] }}</td> <td class="numCell">{{ item[1] }}</td>
<td class="numCell hoursItem" @click="itemClick('hour_s',item)">{{item[2]}}</td> <td
<td class="numCell daysItem" @click="itemClick('day_s',item)">{{item[3]}}</td> class="numCell hoursItem"
<td class="numCell monthItem" @click="itemClick('month_s',item)">{{item[4]}}</td> @click="itemClick('hour_s', item)"
<td class="numCell yearItem" @click="itemClick('year_s',item)">{{item[5]}}</td> >
{{ item[2] }}
</td>
<td
class="numCell daysItem"
@click="itemClick('day_s', item)"
>
{{ item[3] }}
</td>
<td
class="numCell monthItem"
@click="itemClick('month_s', item)"
>
{{ item[4] }}
</td>
<td
class="numCell yearItem"
@click="itemClick('year_s', item)"
>
{{ item[5] }}
</td>
<td class="numCell">{{ item[6] }}</td> <td class="numCell">{{ item[6] }}</td>
<td class="numCell">{{ item[7] }}</td> <td class="numCell">{{ item[7] }}</td>
<td class="numCell">{{ item[8] }}</td> <td class="numCell">{{ item[8] }}</td>
@ -53,15 +84,27 @@
</table> </table>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">小时生产参数统计图</div> <div class="chartTitle">小时生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionHour"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionHour"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div> <div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div> <div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div> </div>
</div> </div>
</div> </div>
@ -74,94 +117,97 @@
:mgroup="query.mgroup" :mgroup="query.mgroup"
:modelValue="modelValue" :modelValue="modelValue"
:showClose="showClose" :showClose="showClose"
:echartType='echartType' :echartType="echartType"
@closed="asynDialog = false" @closed="asynDialog = false"
></charts> ></charts>
</el-card> </el-card>
</div> </div>
</template> </template>
<script> <script>
const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666']; const colors = ["#647bfe", "#8698fe", "#a9b6fe", "#91CC75", "#EE6666"];
let tooltip = { let tooltip = {
show: true, show: true,
trigger: 'axis', trigger: "axis",
axisPointer: { axisPointer: {
type: 'cross' type: "cross",
}, },
confine: false, confine: false,
showContent: true, showContent: true,
triggerOn: "mousemove", triggerOn: "mousemove",
}; };
let grid = { let grid = {
right: '8%', right: "8%",
left:'4%', left: "4%",
top:'15%' top: "15%",
}; };
let toolbox = { let toolbox = {
right:'2%', right: "2%",
feature: { feature: {
dataView: { show: true, readOnly: false }, dataView: { show: true, readOnly: false },
// restore: { show: true }, // restore: { show: true },
saveAsImage: { show: true } saveAsImage: { show: true },
} },
}; };
let legend = { let legend = {
top:'2%', top: "2%",
data:['总产量', '台时产量', '运转率', '分布电耗'] data: ["总产量", "台时产量", "运转率", "分布电耗"],
}; };
let yAxis= [{ let yAxis = [
type: 'value', {
name: '产量 (t)', type: "value",
position: 'left', name: "产量 (t)",
position: "left",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[0] color: colors[0],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}, },
{ {
type: 'value', type: "value",
name: '运转率 (%)', name: "运转率 (%)",
position: 'right', position: "right",
alignTicks: true, alignTicks: true,
offset: 80, offset: 80,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[2] color: colors[2],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}, },
{ {
type: 'value', type: "value",
name: '分布电耗(KW.h)', name: "分布电耗(KW.h)",
position: 'right', position: "right",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[3] color: colors[3],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
} },
]; ];
import scEcharts from "@/components/scEcharts"; import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue' import { defineAsyncComponent } from "vue";
export default { export default {
components: { components: {
scEcharts, scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")), charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
}, },
data() { data() {
return { return {
@ -175,23 +221,23 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
days: 1, days: 1,
hours: 1, hours: 1,
query: { query: {
mgroup:'3347217512021835776', mgroup: "",
}, },
tableDatas: [ tableDatas: [
['产量','总产量t',0,0,0,0,0,0,0,0], ["产量", "总产量t", 0, 0, 0, 0, 0, 0, 0, 0],
['产量','台时产量t/h','/',0,0,0,0,0,0,0], ["产量", "台时产量t/h", "/", 0, 0, 0, 0, 0, 0, 0],
['运转时间','运转时间h','/',0,0,0,0,0,0,0], ["运转时间", "运转时间h", "/", 0, 0, 0, 0, 0, 0, 0],
['运转时间','运转率(%','/',0,0,0,0,0,0,0], ["运转时间", "运转率(%", "/", 0, 0, 0, 0, 0, 0, 0],
['能耗','煤磨分布电耗KW·h/t',0,0,0,0,0,0,0,0], ["能耗", "煤磨分布电耗KW·h/t", 0, 0, 0, 0, 0, 0, 0, 0],
], ],
tableName:'生产报告', tableName: "生产报告",
modelValue: true, modelValue: true,
type:'hour_s', type: "hour_s",
title:'煤磨工段', title: "煤磨工段",
cate:'', cate: "",
apiObj: this.$API.enm.enstat, apiObj: this.$API.enm.enstat,
showClose: true, showClose: true,
echartType:'line', echartType: "line",
asynDialog: false, asynDialog: false,
option1: { option1: {
color: colors, color: colors,
@ -206,35 +252,48 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
inside: true, inside: true,
// alignWithLabel: true // alignWithLabel: true
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data:[] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
}, },
] ],
}, },
option2: { option2: {
color: colors, color: colors,
@ -249,35 +308,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
inside: true, inside: true,
// alignWithLabel: true // alignWithLabel: true
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data:[] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
}, },
] ],
}, },
option3: { option3: {
color: colors, color: colors,
@ -291,58 +350,74 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
},
],
}, },
]
}
}; };
}, },
mounted() { mounted() {
function precen(a, b) { function precen(a, b) {
if (b !== 0 && b !== null && a !== null) { if (b !== 0 && b !== null && a !== null) {
let precen = (a/b).toFixed(2) let precen = (a / b).toFixed(2);
return precen*100+'%' return precen * 100 + "%";
} else { } else {
return '/' return "/";
} }
} }
let that = this; let that = this;
var myDate = new Date(); var myDate = new Date();
let year =that.year = myDate.getFullYear(); let year = (that.year = myDate.getFullYear());
let month = that.month = myDate.getMonth()+1; let month = (that.month = myDate.getMonth() + 1);
let days = that.days = myDate.getDate(); let days = (that.days = myDate.getDate());
let hours = that.hours = myDate.getHours(); let hours = (that.hours = myDate.getHours());
let timeDate = myDate.getTime(); let timeDate = myDate.getTime();
let dayTime = 24 * 60 * 60 * 1000; let dayTime = 24 * 60 * 60 * 1000;
// //
let year_d = year,month_d = month,days_d = days; let year_d = year,
if(hours<21){//21点前查找昨日数据为前一天数据 month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime; let newDate = timeDate - dayTime;
let lastDate = new Date(newDate); let lastDate = new Date(newDate);
year_d = lastDate.getFullYear(); year_d = lastDate.getFullYear();
@ -356,16 +431,20 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
let month_h = hourDate.getMonth() + 1; let month_h = hourDate.getMonth() + 1;
let days_h = hourDate.getDate(); let days_h = hourDate.getDate();
let hours_h = hourDate.getHours(); let hours_h = hourDate.getHours();
this.$API.mtm.mgroup.list
.req({ page: 0, search: "煤磨" })
.then((res) => {
console.log("煤磨", res);
that.query.mgroup = res[0].id;
// //
let params3 = {}; let params3 = {};
params3.page = 0; params3.page = 0;
params3.year_s = year_d; params3.year_s = year_d;
params3.month_s = month_d; params3.month_s = month_d;
params3.day_s = days_d; params3.day_s = days_d;
params3.type = 'day_s'; params3.type = "day_s";
params3.mgroup = this.query.mgroup; params3.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => { that.$API.enm.enstat.req(params3).then((res3) => {
if (res3.length > 0) { if (res3.length > 0) {
let data3 = res3[0]; let data3 = res3[0];
that.tableDatas[0][3] = data3.total_production; that.tableDatas[0][3] = data3.total_production;
@ -374,7 +453,7 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
that.tableDatas[3][3] = data3.run_rate; that.tableDatas[3][3] = data3.run_rate;
that.tableDatas[4][3] = data3.elec_consume_unit; that.tableDatas[4][3] = data3.elec_consume_unit;
} }
}) });
// //
let params4 = {}; let params4 = {};
params4.page = 0; params4.page = 0;
@ -382,90 +461,134 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
params4.month = month_h; params4.month = month_h;
params4.day = days_h; params4.day = days_h;
params4.hour = hours_h; params4.hour = hours_h;
params4.type = 'hour_st'; params4.type = "hour_st";
params4.mgroup = this.query.mgroup; params4.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params4).then((res4) => { that.$API.enm.enstat.req(params4).then((res4) => {
if (res4.length > 0) { if (res4.length > 0) {
let data4 = res4[0]; let data4 = res4[0];
that.tableDatas[0][2] = data4.total_production; that.tableDatas[0][2] = data4.total_production;
that.tableDatas[4][2] = data4.elec_consume_unit; that.tableDatas[4][2] = data4.elec_consume_unit;
} }
}) });
// //
let params5 = {}; let params5 = {};
params5.page = 0; params5.page = 0;
params5.mgroup='3346520558031773696'; params5.mgroup = that.query.mgroup;
this.$API.mtm.goal.list.req(params5).then((res5) => { this.$API.mtm.goal.list
.req(params5)
.then((res5) => {
if (res5.length > 0) { if (res5.length > 0) {
let data5 = res5; let data5 = res5;
data5.forEach(item5=>{ data5.forEach((item5) => {
let str = 'goal_val_'+that.month; let str = "goal_val_" + that.month;
if(item5.goal_cate_name=='总产量t'){ if (item5.goal_cate_name == "总产量t") {
that.tableDatas[0][6] = item5[str]; that.tableDatas[0][6] = item5[str];
that.tableDatas[0][8] = item5.goal_val; that.tableDatas[0][8] = item5.goal_val;
}else if(item5.goal_cate_name=='台时产量t/h'){ } else if (
item5.goal_cate_name == "台时产量t/h"
) {
that.tableDatas[1][6] = item5[str]; that.tableDatas[1][6] = item5[str];
that.tableDatas[1][8] = item5.goal_val; that.tableDatas[1][8] = item5.goal_val;
}else if(item5.goal_cate_name=='运转时间h'){ } else if (
item5.goal_cate_name == "运转时间h"
) {
that.tableDatas[2][6] = item5[str]; that.tableDatas[2][6] = item5[str];
that.tableDatas[2][8] = item5.goal_val; that.tableDatas[2][8] = item5.goal_val;
}else if(item5.goal_cate_name=='运转率(%'){ } else if (
item5.goal_cate_name == "运转率(%"
) {
that.tableDatas[3][6] = item5[str]; that.tableDatas[3][6] = item5[str];
that.tableDatas[3][8] = item5.goal_val; that.tableDatas[3][8] = item5.goal_val;
}else if(item5.goal_cate_name=='单位产品分布电耗KW·h/t'){ } else if (
item5.goal_cate_name ==
"单位产品分布电耗KW·h/t"
) {
that.tableDatas[4][6] = item5[str]; that.tableDatas[4][6] = item5[str];
that.tableDatas[4][8] = item5.goal_val; that.tableDatas[4][8] = item5.goal_val;
} }
}) });
} }
}).then(res=>{ })
.then((res) => {
// //
let params1 = {}; let params1 = {};
params1.page = 0; params1.page = 0;
params1.year_s = year; params1.year_s = year;
params1.type = 'year_s'; params1.type = "year_s";
params1.mgroup = this.query.mgroup; params1.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params1).then((res1) => { that.$API.enm.enstat.req(params1).then((res1) => {
if (res1.length > 0) { if (res1.length > 0) {
let data1 = res1[0]; let data1 = res1[0];
that.tableDatas[0][5] = data1.total_production; that.tableDatas[0][5] = data1.total_production;
that.tableDatas[0][9]=precen(that.tableDatas[0][5],that.tableDatas[0][8]) that.tableDatas[0][9] = precen(
that.tableDatas[0][5],
that.tableDatas[0][8]
);
that.tableDatas[1][5] = data1.production_hour; that.tableDatas[1][5] = data1.production_hour;
that.tableDatas[1][9]=precen(that.tableDatas[1][5],that.tableDatas[1][8]) that.tableDatas[1][9] = precen(
that.tableDatas[1][5],
that.tableDatas[1][8]
);
that.tableDatas[2][5] = data1.run_hour; that.tableDatas[2][5] = data1.run_hour;
that.tableDatas[2][9]=precen(that.tableDatas[2][5],that.tableDatas[2][8]) that.tableDatas[2][9] = precen(
that.tableDatas[2][5],
that.tableDatas[2][8]
);
that.tableDatas[3][5] = data1.run_rate; that.tableDatas[3][5] = data1.run_rate;
that.tableDatas[3][9]=precen(that.tableDatas[3][5],that.tableDatas[3][8]) that.tableDatas[3][9] = precen(
that.tableDatas[3][5],
that.tableDatas[3][8]
);
that.tableDatas[4][5] = data1.elec_consume_unit; that.tableDatas[4][5] = data1.elec_consume_unit;
that.tableDatas[4][9]=precen(that.tableDatas[4][5],that.tableDatas[4][8]) that.tableDatas[4][9] = precen(
}else{} that.tableDatas[4][5],
}) that.tableDatas[4][8]
);
} else {
}
});
// //
let params2 = {}; let params2 = {};
params2.page = 0; params2.page = 0;
params2.year_s = year; params2.year_s = year;
params2.month_s = month; params2.month_s = month;
params2.type = 'month_s'; params2.type = "month_s";
params2.mgroup = this.query.mgroup; params2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => { that.$API.enm.enstat.req(params2).then((res2) => {
if (res2.length > 0) { if (res2.length > 0) {
let data2 = res2[0]; let data2 = res2[0];
that.tableDatas[0][4] = data2.total_production; that.tableDatas[0][4] = data2.total_production;
that.tableDatas[0][7]=precen(that.tableDatas[0][4],that.tableDatas[0][6]) that.tableDatas[0][7] = precen(
that.tableDatas[0][4],
that.tableDatas[0][6]
);
that.tableDatas[1][4] = data2.production_hour; that.tableDatas[1][4] = data2.production_hour;
that.tableDatas[1][7]=precen(that.tableDatas[1][4],that.tableDatas[1][6]) that.tableDatas[1][7] = precen(
that.tableDatas[1][4],
that.tableDatas[1][6]
);
that.tableDatas[2][4] = data2.run_hour; that.tableDatas[2][4] = data2.run_hour;
that.tableDatas[2][7]=precen(that.tableDatas[2][4],that.tableDatas[2][6]) that.tableDatas[2][7] = precen(
that.tableDatas[2][4],
that.tableDatas[2][6]
);
that.tableDatas[3][4] = data2.run_rate; that.tableDatas[3][4] = data2.run_rate;
that.tableDatas[3][7]=precen(that.tableDatas[3][4],that.tableDatas[3][6]) that.tableDatas[3][7] = precen(
that.tableDatas[3][4],
that.tableDatas[3][6]
);
that.tableDatas[4][4] = data2.elec_consume_unit; that.tableDatas[4][4] = data2.elec_consume_unit;
that.tableDatas[4][7]=precen(that.tableDatas[4][4],that.tableDatas[4][6]) that.tableDatas[4][7] = precen(
that.tableDatas[4][4],
that.tableDatas[4][6]
);
} }
}) });
}) });
that.getHourData(); that.getHourData();
that.getDayData(); that.getDayData();
that.getMonthData(); that.getMonthData();
});
}, },
methods: { methods: {
// //
@ -476,13 +599,16 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
query.year_s = that.year; query.year_s = that.year;
query.month_s = that.month; query.month_s = that.month;
query.day_s = that.days; query.day_s = that.days;
query.type = 'hour_s'; query.type = "hour_s";
query.mgroup = that.query.mgroup; query.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(query).then((response) => { this.$API.enm.enstat.req(query).then((response) => {
// debugger; // debugger;
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.hour; let ind = item.hour;
seriesData0[ind] = item.total_production; // seriesData0[ind] = item.total_production; //
seriesData1[ind] = item.production_hour; // seriesData1[ind] = item.production_hour; //
@ -496,12 +622,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let hourXAxis = []; let hourXAxis = [];
for (let i = 1; i <= that.hours; i++) { for (let i = 1; i <= that.hours; i++) {
let item = i+'时' let item = i + "时";
hourXAxis.push(item) hourXAxis.push(item);
} }
options.xAxis.data = hourXAxis; options.xAxis.data = hourXAxis;
that.optionHour = options; that.optionHour = options;
}) });
}, },
// //
getDayData() { getDayData() {
@ -510,14 +636,17 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
query1.page = 0; query1.page = 0;
query1.year_s = that.year; query1.year_s = that.year;
query1.month_s = that.month; query1.month_s = that.month;
query1.type = 'day_s'; query1.type = "day_s";
query1.mgroup = this.query.mgroup; query1.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(query1).then((response) => { this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
// debugger; // debugger;
console.log(response) console.log(response);
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
// debugger; // debugger;
let ind = item.day_s; let ind = item.day_s;
seriesData0[ind] = item.total_production; seriesData0[ind] = item.total_production;
@ -532,12 +661,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let dayXAxis = []; let dayXAxis = [];
for (let i = 1; i <= that.days; i++) { for (let i = 1; i <= that.days; i++) {
let item = i+'日' let item = i + "日";
dayXAxis.push(item) dayXAxis.push(item);
} }
options.xAxis.data = dayXAxis; options.xAxis.data = dayXAxis;
that.optionDay = options; that.optionDay = options;
}) });
}, },
// //
getMonthData() { getMonthData() {
@ -545,14 +674,17 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
let query2 = {}; let query2 = {};
query2.page = 0; query2.page = 0;
query2.year_s = that.year; query2.year_s = that.year;
query2.type = 'month_s'; query2.type = "month_s";
query2.mgroup = that.query.mgroup; query2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(query2).then((response) => { this.$API.enm.enstat.req(query2).then((response) => {
// debugger; // debugger;
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
console.log(response) seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
console.log(response);
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.month_s; let ind = item.month_s;
seriesData0[ind] = item.total_production; seriesData0[ind] = item.total_production;
seriesData1[ind] = item.production_hour; seriesData1[ind] = item.production_hour;
@ -566,12 +698,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let monthXAxis = []; let monthXAxis = [];
for (let i = 1; i <= that.month; i++) { for (let i = 1; i <= that.month; i++) {
let item = i+'月' let item = i + "月";
monthXAxis.push(item) monthXAxis.push(item);
} }
options.xAxis.data = monthXAxis; options.xAxis.data = monthXAxis;
that.optionMonth = options; that.optionMonth = options;
}) });
}, },
itemClick(type, item) { itemClick(type, item) {
this.type = type; this.type = type;
@ -580,24 +712,22 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
}, },
itemClick1(type, item) { itemClick1(type, item) {
this.chartShow = false; this.chartShow = false;
this.$API.bi.dataset.exec this.$API.bi.dataset.exec.req("3322567213885833216").then((res) => {
.req('3322567213885833216')
.then((res) => {
this.myOption = JSON.parse(res.echart_options); this.myOption = JSON.parse(res.echart_options);
debugger; debugger;
console.log(this.myOption) console.log(this.myOption);
this.chartShow = true; this.chartShow = true;
}); });
}, },
handlePrint() { handlePrint() {
this.$PRINT('#myReport'); this.$PRINT("#myReport");
}, },
exportExcel() { exportExcel() {
this.exportLoading = true; this.exportLoading = true;
this.$XLSX('#myTable', this.tableName) this.$XLSX("#myTable", this.tableName);
this.exportLoading = false; this.exportLoading = false;
}, },
} },
}; };
</script> </script>
<style scoped> <style scoped>

View File

@ -8,20 +8,25 @@
:loading="exportLoading" :loading="exportLoading"
>导出xlsx >导出xlsx
</el-button> </el-button>
<el-button <el-button type="primary" @click="handlePrint">打印 </el-button>
type="primary"
@click="handlePrint"
>打印
</el-button>
</div> </div>
</el-header> </el-header>
<el-card style="margin-top: 5px"> <el-card style="margin-top: 5px">
<div class="printWrap"> <div class="printWrap">
<div ref="print" id="myReport" class="printContainer"> <div ref="print" id="myReport" class="printContainer">
<table border="1" width="1035" cellspacing="0" :key="timeStamp" class="myTable" id="myTable"> <table
border="1"
width="1035"
cellspacing="0"
:key="timeStamp"
class="myTable"
id="myTable"
>
<thead class="myTableHead"> <thead class="myTableHead">
<tr> <tr>
<th colspan="6">煤磨工段主要设备100KW以上单位产品电耗数据表</th> <th colspan="6">
煤磨工段主要设备100KW以上单位产品电耗数据表
</th>
</tr> </tr>
<tr> <tr>
<th>设备名称</th> <th>设备名称</th>
@ -34,26 +39,64 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="item in tableDatas" :key="item"> <tr v-for="item in tableDatas" :key="item">
<template v-for="(item1,ind) in item" :key="item1"> <template
<td v-if="ind==0||ind==1||ind==2" class="numCell">{{item1}}</td> v-for="(item1, ind) in item"
<td v-if="ind==3" class="numCell hoursItem" @click="itemClick('hour_s',item1)">{{item1}}</td> :key="item1"
<td v-if="ind==4" class="numCell monthItem" @click="itemClick('day_s',item1)">{{item1}}</td> >
<td v-if="ind==5" class="numCell yearItem" @click="itemClick('month_s',item1)">{{item1}}</td> <td
v-if="ind == 0 || ind == 1 || ind == 2"
class="numCell"
>
{{ item1 }}
</td>
<td
v-if="ind == 3"
class="numCell hoursItem"
@click="itemClick('hour_s', item1)"
>
{{ item1 }}
</td>
<td
v-if="ind == 4"
class="numCell monthItem"
@click="itemClick('day_s', item1)"
>
{{ item1 }}
</td>
<td
v-if="ind == 5"
class="numCell yearItem"
@click="itemClick('month_s', item1)"
>
{{ item1 }}
</td>
</template> </template>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">小时生产参数统计图</div> <div class="chartTitle">小时生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionHour"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionHour"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div> <div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div> <div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div> </div>
</div> </div>
</div> </div>
@ -66,19 +109,26 @@
:mgroup="query.mgroup" :mgroup="query.mgroup"
:modelValue="modelValue" :modelValue="modelValue"
:showClose="showClose" :showClose="showClose"
:echartType='echartType' :echartType="echartType"
@closed="asynDialog = false" @closed="asynDialog = false"
></charts> ></charts>
</el-card> </el-card>
</div> </div>
</template> </template>
<script> <script>
const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666']; const colors = [
"#647bfe",
"#8698fe",
"#a9b6fe",
"#cbd3fe",
"#91CC75",
"#EE6666",
];
let tooltip = { let tooltip = {
show: true, show: true,
trigger: 'axis', trigger: "axis",
axisPointer: { axisPointer: {
type: 'cross' type: "cross",
}, },
confine: false, confine: false,
showContent: true, showContent: true,
@ -86,42 +136,44 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
// alwaysShowContent:true, // alwaysShowContent:true,
}; };
let grid = { let grid = {
right: '3%', right: "3%",
left:'7%', left: "7%",
top:'15%' top: "15%",
}; };
let toolbox = { let toolbox = {
right:'5%', right: "5%",
feature: { feature: {
dataView: { show: true, readOnly: false }, dataView: { show: true, readOnly: false },
// restore: { show: true }, // restore: { show: true },
saveAsImage: { show: true } saveAsImage: { show: true },
} },
}; };
let legend = { let legend = {
top:'2%', top: "2%",
data:['煤磨排风机主电机', '煤磨主电机'] data: ["煤磨排风机主电机", "煤磨主电机"],
}; };
let yAxis = { let yAxis = {
type: 'value', type: "value",
name: '分布电耗(KW.h/t)', name: "分布电耗(KW.h/t)",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[3] color: colors[3],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}; };
import scEcharts from "@/components/scEcharts"; import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue' import { defineAsyncComponent } from "vue";
export default { export default {
components: { components: {
scEcharts, scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")), charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
}, },
data() { data() {
return { return {
@ -135,20 +187,20 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
days: 1, days: 1,
hours: 1, hours: 1,
query: { query: {
mgroup:'3347217512021835776', mgroup: "",
}, },
tableName:'主要设备100KW以上单位产品电耗数据表', tableName: "主要设备100KW以上单位产品电耗数据表",
tableDatas: [ tableDatas: [
['煤磨排风机主电机','','KW·h/t','','',''], ["煤磨排风机主电机", "", "KW·h/t", "", "", ""],
['煤磨主电机','','KW·h/t','','',''], ["煤磨主电机", "", "KW·h/t", "", "", ""],
], ],
modelValue: true, modelValue: true,
type:'hour_s', type: "hour_s",
title:'煤磨工段', title: "煤磨工段",
cate:'', cate: "",
apiObj: this.$API.enm.mpoint.stat, apiObj: this.$API.enm.mpoint.stat,
showClose: true, showClose: true,
echartType:'line', echartType: "line",
asynDialog: false, asynDialog: false,
allValHour: 0, allValHour: 0,
allValDays: 0, allValDays: 0,
@ -165,21 +217,21 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
}, },
] ],
}, },
option2: { option2: {
color: colors, color: colors,
@ -193,21 +245,21 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
}, },
] ],
}, },
option3: { option3: {
color: colors, color: colors,
@ -221,22 +273,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '煤磨排风机主电机', name: "煤磨排风机主电机",
type: 'bar', type: "bar",
data:[] data: [],
}, },
{ {
name: '煤磨主电机', name: "煤磨主电机",
type: 'bar', type: "bar",
data: [] data: [],
},
],
}, },
]
}
}; };
}, },
mounted() { mounted() {
@ -249,8 +314,11 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let timeDate = myDate.getTime(); let timeDate = myDate.getTime();
let dayTime = 24 * 60 * 60 * 1000; let dayTime = 24 * 60 * 60 * 1000;
// //
let year_d = year,month_d = month,days_d = days; let year_d = year,
if(hours<21){//21点前查找昨日数据为前一天数据 month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime; let newDate = timeDate - dayTime;
let lastDate = new Date(newDate); let lastDate = new Date(newDate);
year_d = lastDate.getFullYear(); year_d = lastDate.getFullYear();
@ -264,51 +332,79 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let month_h = hourDate.getMonth() + 1; let month_h = hourDate.getMonth() + 1;
let days_h = hourDate.getDate(); let days_h = hourDate.getDate();
let hours_h = hourDate.getHours(); let hours_h = hourDate.getHours();
this.$API.mtm.mgroup.list
.req({ page: 0, search: "煤磨" })
.then((res) => {
console.log("煤磨", res);
that.query.mgroup = res[0].id;
// //
let params2 = {}; let params2 = {};
params2.page = 0; params2.page = 0;
params2.year_s = year; params2.year_s = year;
params2.month_s = month; params2.month_s = month;
params2.type = 'month_s'; params2.type = "month_s";
params2.mgroup = this.query.mgroup; params2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => { that.$API.enm.enstat
.req(params2)
.then((res2) => {
if (res2.length > 0) { if (res2.length > 0) {
let hourProduct=that.allValMonth = res2[0].total_production;// let hourProduct = (that.allValMonth =
res2[0].total_production); //
params2.mpoint__ep_monitored__power_kw__gte = 100; params2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params2).then((res) => { that.$API.enm.mpoint.stat
.req(params2)
.then((res) => {
let data2 = res; let data2 = res;
for (let i = 0; i < data2.length; i++) { for (let i = 0; i < data2.length; i++) {
that.tableDatas[i] = []; that.tableDatas[i] = [];
that.tableDatas[i][0]=data2[i].ep_monitored_name; that.tableDatas[i][0] =
that.tableDatas[i][1]=data2[i].ep_monitored_number; data2[i].ep_monitored_name;
that.tableDatas[i][2]='KW·h/t'; that.tableDatas[i][1] =
let val = hourProduct==0?'/':(data2[i].val/hourProduct).toFixed(2); data2[i].ep_monitored_number;
that.tableDatas[i][2] = "KW·h/t";
let val =
hourProduct == 0
? "/"
: (
data2[i].val /
hourProduct
).toFixed(2);
that.tableDatas[i][5] = val; that.tableDatas[i][5] = val;
} }
}) });
} }
}).then(res2=>{ })
.then((res2) => {
// //
let params3 = {}; let params3 = {};
params3.page = 0; params3.page = 0;
params3.year_s = year_d; params3.year_s = year_d;
params3.month_s = month_d; params3.month_s = month_d;
params3.day_s = days_d; params3.day_s = days_d;
params3.type = 'day_s'; params3.type = "day_s";
params3.mgroup = this.query.mgroup; params3.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => { that.$API.enm.enstat.req(params3).then((res3) => {
if (res3.length > 0) { if (res3.length > 0) {
let hourProduct=that.allValDays = res3[0].total_production; let hourProduct = (that.allValDays =
res3[0].total_production);
params3.mpoint__ep_monitored__power_kw__gte = 100; params3.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params3).then((res) => { that.$API.enm.mpoint.stat
.req(params3)
.then((res) => {
let data3 = res3; let data3 = res3;
for (let j = 0; j < data3.length; j++) { for (let j = 0; j < data3.length; j++) {
let val = hourProduct==0?'/':(data3[j].val/hourProduct).toFixed(2); let val =
hourProduct == 0
? "/"
: (
data3[j].val /
hourProduct
).toFixed(2);
that.tableDatas[j][4] = val; that.tableDatas[j][4] = val;
} }
}) });
} }
}) });
// //
let params4 = {}; let params4 = {};
params4.page = 0; params4.page = 0;
@ -316,25 +412,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
params4.month = month_h; params4.month = month_h;
params4.day = days_h; params4.day = days_h;
params4.hour = hours_h; params4.hour = hours_h;
params4.type = 'hour_s'; params4.type = "hour_s";
params4.mgroup = this.query.mgroup; params4.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params4).then((res4) => { that.$API.enm.enstat.req(params4).then((res4) => {
if (res4.length > 0) { if (res4.length > 0) {
let hourProduct=that.allValHour = res4[0].total_production; let hourProduct = (that.allValHour =
res4[0].total_production);
params4.mpoint__ep_monitored__power_kw__gte = 100; params4.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params4).then((res) => { that.$API.enm.mpoint.stat
.req(params4)
.then((res) => {
let data4 = res4; let data4 = res4;
for (let k = 0; k < data4.length; k++) { for (let k = 0; k < data4.length; k++) {
let val = hourProduct==0?'/':(data4[k].val/hourProduct).toFixed(2); let val =
hourProduct == 0
? "/"
: (
data4[k].val /
hourProduct
).toFixed(2);
that.tableDatas[k][3] = val; that.tableDatas[k][3] = val;
} }
}) });
} }
}) });
}) });
that.getHourData(); that.getHourData();
that.getDayData(); that.getDayData();
that.getMonthData(); that.getMonthData();
});
}, },
methods: { methods: {
// //
@ -345,23 +451,24 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
query.year_s = that.year; query.year_s = that.year;
query.month_s = that.month; query.month_s = that.month;
query.day_s = that.days; query.day_s = that.days;
query.type = 'hour_s'; query.type = "hour_s";
query.mgroup = that.query.mgroup; query.mgroup = that.query.mgroup;
query.mpoint__ep_monitored__power_kw__gte = 100; query.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(query).then((response) => { this.$API.enm.mpoint.stat.req(query).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.hour; let ind = item.hour;
let val = 0; let val = 0;
if (that.allValHour == 0) { if (that.allValHour == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValHour).toFixed(2); val = (item.val / that.allValHour).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -370,12 +477,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let hourXAxis = []; let hourXAxis = [];
for (let i = 1; i <= that.hours; i++) { for (let i = 1; i <= that.hours; i++) {
let item = i+'时' let item = i + "时";
hourXAxis.push(item) hourXAxis.push(item);
} }
options.xAxis.data = hourXAxis; options.xAxis.data = hourXAxis;
that.optionHour = options; that.optionHour = options;
}) });
}, },
// //
getDayData() { getDayData() {
@ -384,24 +491,25 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
query1.page = 0; query1.page = 0;
query1.year_s = that.year; query1.year_s = that.year;
query1.month_s = that.month; query1.month_s = that.month;
query1.type = 'day_s'; query1.type = "day_s";
query1.mgroup = this.query.mgroup; query1.mgroup = this.query.mgroup;
query1.mpoint__ep_monitored__power_kw__gte = 100; query1.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query1).then((response) => { this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
// debugger; // debugger;
let ind = item.day_s; let ind = item.day_s;
let val = 0; let val = 0;
if (that.allValDays == 0) { if (that.allValDays == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValDays).toFixed(2); val = (item.val / that.allValDays).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -410,12 +518,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let dayXAxis = []; let dayXAxis = [];
for (let i = 1; i <= that.days; i++) { for (let i = 1; i <= that.days; i++) {
let item = i+'日' let item = i + "日";
dayXAxis.push(item) dayXAxis.push(item);
} }
options.xAxis.data = dayXAxis; options.xAxis.data = dayXAxis;
that.optionDay = options; that.optionDay = options;
}) });
}, },
// //
getMonthData() { getMonthData() {
@ -423,23 +531,24 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
let query2 = {}; let query2 = {};
query2.page = 0; query2.page = 0;
query2.year_s = that.year; query2.year_s = that.year;
query2.type = 'month_s'; query2.type = "month_s";
query2.mgroup = that.query.mgroup; query2.mgroup = that.query.mgroup;
query2.mpoint__ep_monitored__power_kw__gte = 100; query2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query2).then((response) => { this.$API.enm.enstat.req(query2).then((response) => {
let seriesData0 = [],seriesData1 = []; let seriesData0 = [],
seriesData1 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.month_s; let ind = item.month_s;
let val = 0; let val = 0;
if (that.allValMonth == 0) { if (that.allValMonth == 0) {
val = '' val = "";
} else { } else {
val = (item.val / that.allValMonth).toFixed(2); val = (item.val / that.allValMonth).toFixed(2);
} }
if(item.equip_name=='煤磨排风机主电机'){ if (item.equip_name == "煤磨排风机主电机") {
seriesData0[ind] = val; seriesData0[ind] = val;
}else if(item.equip_name=='煤磨主电机'){ } else if (item.equip_name == "煤磨主电机") {
seriesData1[ind] = val; seriesData1[ind] = val;
} }
}); });
@ -448,12 +557,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
options.series[1].data = seriesData1; options.series[1].data = seriesData1;
let monthXAxis = []; let monthXAxis = [];
for (let i = 1; i <= that.month; i++) { for (let i = 1; i <= that.month; i++) {
let item = i+'月' let item = i + "月";
monthXAxis.push(item) monthXAxis.push(item);
} }
options.xAxis.data = monthXAxis; options.xAxis.data = monthXAxis;
that.optionMonth = options; that.optionMonth = options;
}) });
}, },
itemClick(type, item) { itemClick(type, item) {
this.type = type; this.type = type;
@ -461,14 +570,14 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#cbd3fe','#91CC75','#EE6666'];
this.asynDialog = true; this.asynDialog = true;
}, },
handlePrint() { handlePrint() {
this.$PRINT('#myReport'); this.$PRINT("#myReport");
}, },
exportExcel() { exportExcel() {
this.exportLoading = true; this.exportLoading = true;
this.$XLSX('#myTable', this.tableName) this.$XLSX("#myTable", this.tableName);
this.exportLoading = false; this.exportLoading = false;
}, },
} },
}; };
</script> </script>
<style scoped> <style scoped>

View File

@ -8,17 +8,20 @@
:loading="exportLoading" :loading="exportLoading"
>导出xlsx >导出xlsx
</el-button> </el-button>
<el-button <el-button type="primary" @click="handlePrint">打印 </el-button>
type="primary"
@click="handlePrint"
>打印
</el-button>
</div> </div>
</el-header> </el-header>
<el-card style="margin-top: 5px"> <el-card style="margin-top: 5px">
<div class="printWrap"> <div class="printWrap">
<div ref="print" id="myReport" class="printContainer"> <div ref="print" id="myReport" class="printContainer">
<table border="1" width="1035" cellspacing="0" :key="timeStamp" id="myTable" class="myTable"> <table
border="1"
width="1035"
cellspacing="0"
:key="timeStamp"
id="myTable"
class="myTable"
>
<thead class="myTableHead"> <thead class="myTableHead">
<tr> <tr>
<th colspan="10">煤磨工段生产报告</th> <th colspan="10">煤磨工段生产报告</th>
@ -37,13 +40,41 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="(item, index) in tableDatas" :key="item"> <tr v-for="(item, index) in tableDatas" :key="item">
<td class="numCell" v-if="index==0||index==2" rowspan="2">{{item[0]}}</td> <td
<td class="numCell" v-else-if="index==4">{{item[0]}}</td> class="numCell"
v-if="index == 0 || index == 2"
rowspan="2"
>
{{ item[0] }}
</td>
<td class="numCell" v-else-if="index == 4">
{{ item[0] }}
</td>
<td class="numCell">{{ item[1] }}</td> <td class="numCell">{{ item[1] }}</td>
<td class="numCell hoursItem" @click="itemClick('hour_s',item)">{{item[2]}}</td> <td
<td class="numCell daysItem" @click="itemClick('day_s',item)">{{item[3]}}</td> class="numCell hoursItem"
<td class="numCell monthItem" @click="itemClick('month_s',item)">{{item[4]}}</td> @click="itemClick('hour_s', item)"
<td class="numCell yearItem" @click="itemClick('year_s',item)">{{item[5]}}</td> >
{{ item[2] }}
</td>
<td
class="numCell daysItem"
@click="itemClick('day_s', item)"
>
{{ item[3] }}
</td>
<td
class="numCell monthItem"
@click="itemClick('month_s', item)"
>
{{ item[4] }}
</td>
<td
class="numCell yearItem"
@click="itemClick('year_s', item)"
>
{{ item[5] }}
</td>
<td class="numCell">{{ item[6] }}</td> <td class="numCell">{{ item[6] }}</td>
<td class="numCell">{{ item[7] }}</td> <td class="numCell">{{ item[7] }}</td>
<td class="numCell">{{ item[8] }}</td> <td class="numCell">{{ item[8] }}</td>
@ -53,15 +84,27 @@
</table> </table>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">小时生产参数统计图</div> <div class="chartTitle">小时生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionHour"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionHour"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div> <div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div> </div>
<div class="chartWrap"> <div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div> <div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts> <scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div> </div>
</div> </div>
</div> </div>
@ -74,94 +117,97 @@
:mgroup="query.mgroup" :mgroup="query.mgroup"
:modelValue="modelValue" :modelValue="modelValue"
:showClose="showClose" :showClose="showClose"
:echartType='echartType' :echartType="echartType"
@closed="asynDialog = false" @closed="asynDialog = false"
></charts> ></charts>
</el-card> </el-card>
</div> </div>
</template> </template>
<script> <script>
const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666']; const colors = ["#647bfe", "#8698fe", "#a9b6fe", "#91CC75", "#EE6666"];
let tooltip = { let tooltip = {
show: true, show: true,
trigger: 'axis', trigger: "axis",
axisPointer: { axisPointer: {
type: 'cross' type: "cross",
}, },
confine: false, confine: false,
showContent: true, showContent: true,
triggerOn: "mousemove", triggerOn: "mousemove",
}; };
let grid = { let grid = {
right: '8%', right: "8%",
left:'4%', left: "4%",
top:'15%' top: "15%",
}; };
let toolbox = { let toolbox = {
right:'2%', right: "2%",
feature: { feature: {
dataView: { show: true, readOnly: false }, dataView: { show: true, readOnly: false },
// restore: { show: true }, // restore: { show: true },
saveAsImage: { show: true } saveAsImage: { show: true },
} },
}; };
let legend = { let legend = {
top:'2%', top: "2%",
data:['总产量', '台时产量', '运转率', '分布电耗'] data: ["总产量", "台时产量", "运转率", "分布电耗"],
}; };
let yAxis= [{ let yAxis = [
type: 'value', {
name: '产量 (t)', type: "value",
position: 'left', name: "产量 (t)",
position: "left",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[0] color: colors[0],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}, },
{ {
type: 'value', type: "value",
name: '运转率 (%)', name: "运转率 (%)",
position: 'right', position: "right",
alignTicks: true, alignTicks: true,
offset: 80, offset: 80,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[2] color: colors[2],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
}, },
{ {
type: 'value', type: "value",
name: '分布电耗(KW.h)', name: "分布电耗(KW.h)",
position: 'right', position: "right",
alignTicks: true, alignTicks: true,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: colors[3] color: colors[3],
} },
}, },
axisLabel: { axisLabel: {
formatter: '{value}' formatter: "{value}",
} },
} },
]; ];
import scEcharts from "@/components/scEcharts"; import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue' import { defineAsyncComponent } from "vue";
export default { export default {
components: { components: {
scEcharts, scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")), charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
}, },
data() { data() {
return { return {
@ -175,23 +221,23 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
days: 1, days: 1,
hours: 1, hours: 1,
query: { query: {
mgroup:'3347217512021835776', mgroup: "",
}, },
tableDatas: [ tableDatas: [
['产量','总产量t',0,0,0,0,0,0,0,0], ["产量", "总产量t", 0, 0, 0, 0, 0, 0, 0, 0],
['产量','台时产量t/h','/',0,0,0,0,0,0,0], ["产量", "台时产量t/h", "/", 0, 0, 0, 0, 0, 0, 0],
['运转时间','运转时间h','/',0,0,0,0,0,0,0], ["运转时间", "运转时间h", "/", 0, 0, 0, 0, 0, 0, 0],
['运转时间','运转率(%','/',0,0,0,0,0,0,0], ["运转时间", "运转率(%", "/", 0, 0, 0, 0, 0, 0, 0],
['能耗','煤磨分布电耗KW·h/t',0,0,0,0,0,0,0,0], ["能耗", "煤磨分布电耗KW·h/t", 0, 0, 0, 0, 0, 0, 0, 0],
], ],
tableName:'生产报告', tableName: "生产报告",
modelValue: true, modelValue: true,
type:'hour_s', type: "hour_s",
title:'煤磨工段', title: "煤磨工段",
cate:'', cate: "",
apiObj: this.$API.enm.enstat, apiObj: this.$API.enm.enstat,
showClose: true, showClose: true,
echartType:'line', echartType: "line",
asynDialog: false, asynDialog: false,
option1: { option1: {
color: colors, color: colors,
@ -206,35 +252,48 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
inside: true, inside: true,
// alignWithLabel: true // alignWithLabel: true
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data:[] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
}, },
] ],
}, },
option2: { option2: {
color: colors, color: colors,
@ -249,35 +308,35 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
inside: true, inside: true,
// alignWithLabel: true // alignWithLabel: true
}, },
data: [] data: [],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data:[] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
}, },
] ],
}, },
option3: { option3: {
color: colors, color: colors,
@ -291,58 +350,74 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
length: 5, length: 5,
inside: true, inside: true,
}, },
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
}, },
yAxis: yAxis, yAxis: yAxis,
series: [ series: [
{ {
name: '总产量', name: "总产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '台时产量', name: "台时产量",
type: 'bar', type: "bar",
yAxisIndex: 0, yAxisIndex: 0,
data: [] data: [],
}, },
{ {
name: '运转率', name: "运转率",
type: 'line', type: "line",
yAxisIndex: 1, yAxisIndex: 1,
data: [] data: [],
}, },
{ {
name: '分布电耗', name: "分布电耗",
type: 'bar', type: "bar",
yAxisIndex: 2, yAxisIndex: 2,
data: [] data: [],
},
],
}, },
]
}
}; };
}, },
mounted() { mounted() {
function precen(a, b) { function precen(a, b) {
if (b !== 0 && b !== null && a !== null) { if (b !== 0 && b !== null && a !== null) {
let precen = (a/b).toFixed(2) let precen = (a / b).toFixed(2);
return precen*100+'%' return precen * 100 + "%";
} else { } else {
return '/' return "/";
} }
} }
let that = this; let that = this;
var myDate = new Date(); var myDate = new Date();
let year =that.year = myDate.getFullYear(); let year = (that.year = myDate.getFullYear());
let month = that.month = myDate.getMonth()+1; let month = (that.month = myDate.getMonth() + 1);
let days = that.days = myDate.getDate(); let days = (that.days = myDate.getDate());
let hours = that.hours = myDate.getHours(); let hours = (that.hours = myDate.getHours());
let timeDate = myDate.getTime(); let timeDate = myDate.getTime();
let dayTime = 24 * 60 * 60 * 1000; let dayTime = 24 * 60 * 60 * 1000;
// //
let year_d = year,month_d = month,days_d = days; let year_d = year,
if(hours<21){//21点前查找昨日数据为前一天数据 month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime; let newDate = timeDate - dayTime;
let lastDate = new Date(newDate); let lastDate = new Date(newDate);
year_d = lastDate.getFullYear(); year_d = lastDate.getFullYear();
@ -356,16 +431,20 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
let month_h = hourDate.getMonth() + 1; let month_h = hourDate.getMonth() + 1;
let days_h = hourDate.getDate(); let days_h = hourDate.getDate();
let hours_h = hourDate.getHours(); let hours_h = hourDate.getHours();
this.$API.mtm.mgroup.list
.req({ page: 0, search: "煤磨" })
.then((res) => {
console.log("煤磨", res);
that.query.mgroup = res[0].id;
// //
let params3 = {}; let params3 = {};
params3.page = 0; params3.page = 0;
params3.year_s = year_d; params3.year_s = year_d;
params3.month_s = month_d; params3.month_s = month_d;
params3.day_s = days_d; params3.day_s = days_d;
params3.type = 'day_s'; params3.type = "day_s";
params3.mgroup = this.query.mgroup; params3.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => { that.$API.enm.enstat.req(params3).then((res3) => {
if (res3.length > 0) { if (res3.length > 0) {
let data3 = res3[0]; let data3 = res3[0];
that.tableDatas[0][3] = data3.total_production; that.tableDatas[0][3] = data3.total_production;
@ -374,7 +453,7 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
that.tableDatas[3][3] = data3.run_rate; that.tableDatas[3][3] = data3.run_rate;
that.tableDatas[4][3] = data3.elec_consume_unit; that.tableDatas[4][3] = data3.elec_consume_unit;
} }
}) });
// //
let params4 = {}; let params4 = {};
params4.page = 0; params4.page = 0;
@ -382,90 +461,134 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
params4.month = month_h; params4.month = month_h;
params4.day = days_h; params4.day = days_h;
params4.hour = hours_h; params4.hour = hours_h;
params4.type = 'hour_st'; params4.type = "hour_st";
params4.mgroup = this.query.mgroup; params4.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params4).then((res4) => { that.$API.enm.enstat.req(params4).then((res4) => {
if (res4.length > 0) { if (res4.length > 0) {
let data4 = res4[0]; let data4 = res4[0];
that.tableDatas[0][2] = data4.total_production; that.tableDatas[0][2] = data4.total_production;
that.tableDatas[4][2] = data4.elec_consume_unit; that.tableDatas[4][2] = data4.elec_consume_unit;
} }
}) });
// //
let params5 = {}; let params5 = {};
params5.page = 0; params5.page = 0;
params5.mgroup='3346520558031773696'; params5.mgroup = that.query.mgroup;
this.$API.mtm.goal.list.req(params5).then((res5) => { that.$API.mtm.goal.list
.req(params5)
.then((res5) => {
if (res5.length > 0) { if (res5.length > 0) {
let data5 = res5; let data5 = res5;
data5.forEach(item5=>{ data5.forEach((item5) => {
let str = 'goal_val_'+that.month; let str = "goal_val_" + that.month;
if(item5.goal_cate_name=='总产量t'){ if (item5.goal_cate_name == "总产量t") {
that.tableDatas[0][6] = item5[str]; that.tableDatas[0][6] = item5[str];
that.tableDatas[0][8] = item5.goal_val; that.tableDatas[0][8] = item5.goal_val;
}else if(item5.goal_cate_name=='台时产量t/h'){ } else if (
item5.goal_cate_name == "台时产量t/h"
) {
that.tableDatas[1][6] = item5[str]; that.tableDatas[1][6] = item5[str];
that.tableDatas[1][8] = item5.goal_val; that.tableDatas[1][8] = item5.goal_val;
}else if(item5.goal_cate_name=='运转时间h'){ } else if (
item5.goal_cate_name == "运转时间h"
) {
that.tableDatas[2][6] = item5[str]; that.tableDatas[2][6] = item5[str];
that.tableDatas[2][8] = item5.goal_val; that.tableDatas[2][8] = item5.goal_val;
}else if(item5.goal_cate_name=='运转率(%'){ } else if (
item5.goal_cate_name == "运转率(%"
) {
that.tableDatas[3][6] = item5[str]; that.tableDatas[3][6] = item5[str];
that.tableDatas[3][8] = item5.goal_val; that.tableDatas[3][8] = item5.goal_val;
}else if(item5.goal_cate_name=='单位产品分布电耗KW·h/t'){ } else if (
item5.goal_cate_name ==
"单位产品分布电耗KW·h/t"
) {
that.tableDatas[4][6] = item5[str]; that.tableDatas[4][6] = item5[str];
that.tableDatas[4][8] = item5.goal_val; that.tableDatas[4][8] = item5.goal_val;
} }
}) });
} }
}).then(res=>{ })
.then((res) => {
// //
let params1 = {}; let params1 = {};
params1.page = 0; params1.page = 0;
params1.year_s = year; params1.year_s = year;
params1.type = 'year_s'; params1.type = "year_s";
params1.mgroup = this.query.mgroup; params1.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params1).then((res1) => { that.$API.enm.enstat.req(params1).then((res1) => {
if (res1.length > 0) { if (res1.length > 0) {
let data1 = res1[0]; let data1 = res1[0];
that.tableDatas[0][5] = data1.total_production; that.tableDatas[0][5] = data1.total_production;
that.tableDatas[0][9]=precen(that.tableDatas[0][5],that.tableDatas[0][8]) that.tableDatas[0][9] = precen(
that.tableDatas[0][5],
that.tableDatas[0][8]
);
that.tableDatas[1][5] = data1.production_hour; that.tableDatas[1][5] = data1.production_hour;
that.tableDatas[1][9]=precen(that.tableDatas[1][5],that.tableDatas[1][8]) that.tableDatas[1][9] = precen(
that.tableDatas[1][5],
that.tableDatas[1][8]
);
that.tableDatas[2][5] = data1.run_hour; that.tableDatas[2][5] = data1.run_hour;
that.tableDatas[2][9]=precen(that.tableDatas[2][5],that.tableDatas[2][8]) that.tableDatas[2][9] = precen(
that.tableDatas[2][5],
that.tableDatas[2][8]
);
that.tableDatas[3][5] = data1.run_rate; that.tableDatas[3][5] = data1.run_rate;
that.tableDatas[3][9]=precen(that.tableDatas[3][5],that.tableDatas[3][8]) that.tableDatas[3][9] = precen(
that.tableDatas[3][5],
that.tableDatas[3][8]
);
that.tableDatas[4][5] = data1.elec_consume_unit; that.tableDatas[4][5] = data1.elec_consume_unit;
that.tableDatas[4][9]=precen(that.tableDatas[4][5],that.tableDatas[4][8]) that.tableDatas[4][9] = precen(
}else{} that.tableDatas[4][5],
}) that.tableDatas[4][8]
);
} else {
}
});
// //
let params2 = {}; let params2 = {};
params2.page = 0; params2.page = 0;
params2.year_s = year; params2.year_s = year;
params2.month_s = month; params2.month_s = month;
params2.type = 'month_s'; params2.type = "month_s";
params2.mgroup = this.query.mgroup; params2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => { that.$API.enm.enstat.req(params2).then((res2) => {
if (res2.length > 0) { if (res2.length > 0) {
let data2 = res2[0]; let data2 = res2[0];
that.tableDatas[0][4] = data2.total_production; that.tableDatas[0][4] = data2.total_production;
that.tableDatas[0][7]=precen(that.tableDatas[0][4],that.tableDatas[0][6]) that.tableDatas[0][7] = precen(
that.tableDatas[0][4],
that.tableDatas[0][6]
);
that.tableDatas[1][4] = data2.production_hour; that.tableDatas[1][4] = data2.production_hour;
that.tableDatas[1][7]=precen(that.tableDatas[1][4],that.tableDatas[1][6]) that.tableDatas[1][7] = precen(
that.tableDatas[1][4],
that.tableDatas[1][6]
);
that.tableDatas[2][4] = data2.run_hour; that.tableDatas[2][4] = data2.run_hour;
that.tableDatas[2][7]=precen(that.tableDatas[2][4],that.tableDatas[2][6]) that.tableDatas[2][7] = precen(
that.tableDatas[2][4],
that.tableDatas[2][6]
);
that.tableDatas[3][4] = data2.run_rate; that.tableDatas[3][4] = data2.run_rate;
that.tableDatas[3][7]=precen(that.tableDatas[3][4],that.tableDatas[3][6]) that.tableDatas[3][7] = precen(
that.tableDatas[3][4],
that.tableDatas[3][6]
);
that.tableDatas[4][4] = data2.elec_consume_unit; that.tableDatas[4][4] = data2.elec_consume_unit;
that.tableDatas[4][7]=precen(that.tableDatas[4][4],that.tableDatas[4][6]) that.tableDatas[4][7] = precen(
that.tableDatas[4][4],
that.tableDatas[4][6]
);
} }
}) });
}) });
that.getHourData(); that.getHourData();
that.getDayData(); that.getDayData();
that.getMonthData(); that.getMonthData();
});
}, },
methods: { methods: {
// //
@ -476,13 +599,16 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
query.year_s = that.year; query.year_s = that.year;
query.month_s = that.month; query.month_s = that.month;
query.day_s = that.days; query.day_s = that.days;
query.type = 'hour_s'; query.type = "hour_s";
query.mgroup = that.query.mgroup; query.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(query).then((response) => { this.$API.enm.enstat.req(query).then((response) => {
// debugger; // debugger;
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.hour; let ind = item.hour;
seriesData0[ind] = item.total_production; // seriesData0[ind] = item.total_production; //
seriesData1[ind] = item.production_hour; // seriesData1[ind] = item.production_hour; //
@ -496,12 +622,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let hourXAxis = []; let hourXAxis = [];
for (let i = 1; i <= that.hours; i++) { for (let i = 1; i <= that.hours; i++) {
let item = i+'时' let item = i + "时";
hourXAxis.push(item) hourXAxis.push(item);
} }
options.xAxis.data = hourXAxis; options.xAxis.data = hourXAxis;
that.optionHour = options; that.optionHour = options;
}) });
}, },
// //
getDayData() { getDayData() {
@ -510,14 +636,17 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
query1.page = 0; query1.page = 0;
query1.year_s = that.year; query1.year_s = that.year;
query1.month_s = that.month; query1.month_s = that.month;
query1.type = 'day_s'; query1.type = "day_s";
query1.mgroup = this.query.mgroup; query1.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(query1).then((response) => { this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
// debugger; // debugger;
console.log(response) console.log(response);
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
// debugger; // debugger;
let ind = item.day_s; let ind = item.day_s;
seriesData0[ind] = item.total_production; seriesData0[ind] = item.total_production;
@ -532,12 +661,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let dayXAxis = []; let dayXAxis = [];
for (let i = 1; i <= that.days; i++) { for (let i = 1; i <= that.days; i++) {
let item = i+'日' let item = i + "日";
dayXAxis.push(item) dayXAxis.push(item);
} }
options.xAxis.data = dayXAxis; options.xAxis.data = dayXAxis;
that.optionDay = options; that.optionDay = options;
}) });
}, },
// //
getMonthData() { getMonthData() {
@ -545,14 +674,17 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
let query2 = {}; let query2 = {};
query2.page = 0; query2.page = 0;
query2.year_s = that.year; query2.year_s = that.year;
query2.type = 'month_s'; query2.type = "month_s";
query2.mgroup = that.query.mgroup; query2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(query2).then((response) => { this.$API.enm.enstat.req(query2).then((response) => {
// debugger; // debugger;
let seriesData0 = [],seriesData1 = [], seriesData2 = [],seriesData3 = []; let seriesData0 = [],
console.log(response) seriesData1 = [],
seriesData2 = [],
seriesData3 = [];
console.log(response);
let data = response; let data = response;
data.forEach(item => { data.forEach((item) => {
let ind = item.month_s; let ind = item.month_s;
seriesData0[ind] = item.total_production; seriesData0[ind] = item.total_production;
seriesData1[ind] = item.production_hour; seriesData1[ind] = item.production_hour;
@ -566,12 +698,12 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
options.series[3].data = seriesData3; options.series[3].data = seriesData3;
let monthXAxis = []; let monthXAxis = [];
for (let i = 1; i <= that.month; i++) { for (let i = 1; i <= that.month; i++) {
let item = i+'月' let item = i + "月";
monthXAxis.push(item) monthXAxis.push(item);
} }
options.xAxis.data = monthXAxis; options.xAxis.data = monthXAxis;
that.optionMonth = options; that.optionMonth = options;
}) });
}, },
itemClick(type, item) { itemClick(type, item) {
this.type = type; this.type = type;
@ -580,24 +712,22 @@ const colors =['#647bfe','#8698fe','#a9b6fe','#91CC75','#EE6666'];
}, },
itemClick1(type, item) { itemClick1(type, item) {
this.chartShow = false; this.chartShow = false;
this.$API.bi.dataset.exec this.$API.bi.dataset.exec.req("3322567213885833216").then((res) => {
.req('3322567213885833216')
.then((res) => {
this.myOption = JSON.parse(res.echart_options); this.myOption = JSON.parse(res.echart_options);
debugger; debugger;
console.log(this.myOption) console.log(this.myOption);
this.chartShow = true; this.chartShow = true;
}); });
}, },
handlePrint() { handlePrint() {
this.$PRINT('#myReport'); this.$PRINT("#myReport");
}, },
exportExcel() { exportExcel() {
this.exportLoading = true; this.exportLoading = true;
this.$XLSX('#myTable', this.tableName) this.$XLSX("#myTable", this.tableName);
this.exportLoading = false; this.exportLoading = false;
}, },
} },
}; };
</script> </script>
<style scoped> <style scoped>