fix:电石渣mgroup根据名称通过接口获取id

This commit is contained in:
shijing 2024-04-29 11:12:25 +08:00
parent 6e7e535cfc
commit 93f058997a
6 changed files with 1941 additions and 1567 deletions

View File

@ -319,7 +319,7 @@ const routes = [
"name": "enm_rmbase",
"path": "/enm_rmbase",
"meta": {
"title": "原料磨1",
"title": "原料磨",
"icon": "el-icon-list",
"type": "menu",
"perms": ["enm_rmbase"]
@ -445,7 +445,7 @@ const routes = [
"name": "enm_kilnbase",
"path": "/enm_kilnbase",
"meta": {
"title": "回转窑1",
"title": "回转窑",
"icon": "el-icon-menu",
"type": "menu",
"perms": ["enm_kilnbase"]
@ -624,7 +624,7 @@ const routes = [
"name": "enm_coalbase",
"path": "/enm_coalbase",
"meta": {
"title": "煤磨1",
"title": "煤磨",
"icon": "el-icon-brush-filled",
"type": "menu",
"perms": ["enm_coalbase"]

View File

@ -3,21 +3,65 @@
<el-header>
<div class="left-panel">
<div style="margin-right: 20px">交接班日志</div>
<el-date-picker v-model="query.start_time__gte" type="date" value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD"
placeholder="开始时间" style=" width: 120px" />
<el-date-picker v-model="query.end_time__lt" type="date" value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD"
placeholder="结束时间" style="margin-left: 2px; width: 120px" />
<el-select v-model="query.shift" placeholder="班次" clearable style="margin-left: 2px; width: 120px">
<el-option v-for="item in optionsShift" :key="item.id" :label="item.name" :value="item.id"></el-option>
<el-date-picker
v-model="query.start_time__gte"
type="date"
value-format="YYYY-MM-DD HH:mm:ss"
format="YYYY-MM-DD"
placeholder="开始时间"
style="width: 120px"
/>
<el-date-picker
v-model="query.end_time__lt"
type="date"
value-format="YYYY-MM-DD HH:mm:ss"
format="YYYY-MM-DD"
placeholder="结束时间"
style="margin-left: 2px; width: 120px"
/>
<el-select
v-model="query.shift"
placeholder="班次"
clearable
style="margin-left: 2px; width: 120px"
>
<el-option
v-for="item in optionsShift"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
<el-select v-model="query.team" placeholder="班组" clearable style="margin-left: 2px; width: 120px">
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id"></el-option>
<el-select
v-model="query.team"
placeholder="班组"
clearable
style="margin-left: 2px; width: 120px"
>
<el-option
v-for="item in options"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div>
</el-header>
<el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="query" highlightCurrentRow @row-click="rowClick">
<scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="query"
highlightCurrentRow
@row-click="rowClick"
>
<el-table-column type="index" width="50" />
<el-table-column label="开始时间" prop="start_time">
<template #default="scope">
@ -29,19 +73,47 @@
<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="班长" prop="leader_name"></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="班长"
prop="leader_name"
></el-table-column>
<el-table-column label="检验时间">
<template #default="scope">
<span v-if="scope.row.last_test_time">{{ scope.row.last_test_time.slice(0, 16) }}</span>
<span v-if="scope.row.last_test_time">{{
scope.row.last_test_time.slice(0, 16)
}}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="150">
<el-table-column
label="操作"
fixed="right"
align="center"
width="150"
>
<template #default="scope">
<el-button link size="small" @click="sflog_edit(scope.row)" type="primary">编辑</el-button>
<el-button
link
size="small"
@click="sflog_edit(scope.row)"
type="primary"
>编辑</el-button
>
<el-divider direction="vertical"></el-divider>
<el-button link size="small" @click="sflog_export(scope.row)" type="success">报表</el-button>
<el-button
link
size="small"
@click="sflog_export(scope.row)"
type="success"
>报表</el-button
>
</template>
</el-table-column>
</scTable>
@ -57,38 +129,81 @@
</el-button>
</template>
<div class="left-panel">
<el-button type="primary" @click="exportExcel()" :loading="exportLoading">导出xlsx
</el-button>
<el-button type="primary" @click="handlePrint">打印
<el-button
type="primary"
@click="exportExcel()"
:loading="exportLoading"
>导出xlsx
</el-button>
<el-button type="primary" @click="handlePrint">打印 </el-button>
</div>
<el-main class="nopadding">
<div ref="print" id="myReport" class="printContainer">
<div style="margin-right: 20px;text-align: center;font-size: 16px;font-weight: bold;margin-bottom: 20px;">
<span v-if="sflogItem.end_time">{{ sflogItem.end_time.slice(0, 10) }}{{ sflogItem.shift_name }}</span>
<span v-if="sflogItem.team_name">{{ sflogItem.team_name }}</span>
<div
style="
margin-right: 20px;
text-align: center;
font-size: 16px;
font-weight: bold;
margin-bottom: 20px;
"
>
<span v-if="sflogItem.end_time"
>{{ sflogItem.end_time.slice(0, 10)
}}{{ sflogItem.shift_name }}</span
>
<span v-if="sflogItem.team_name">{{
sflogItem.team_name
}}</span>
交接班记录
</div>
<table border="1" width="1000" cellspacing="0" :key="timeStamp" id="myTable">
<table
border="1"
width="1000"
cellspacing="0"
:key="timeStamp"
id="myTable"
>
<tbody>
<tr>
<td class="numCell">日期</td>
<td class="numCell" v-if="sflogItem.end_time">{{ sflogItem.end_time.slice(0, 10) }}</td>
<td class="numCell" v-if="sflogItem.end_time">
{{ sflogItem.end_time.slice(0, 10) }}
</td>
<td class="numCell">班次</td>
<td class="numCell">{{ sflogItem.shift_name }}</td>
<td class="numCell">
{{ sflogItem.shift_name }}
</td>
<td class="numCell">班组</td>
<td class="numCell"><span v-if="sflogItem.team_name">{{ sflogItem.team_name }}</span></td>
<td class="numCell">
<span v-if="sflogItem.team_name">{{
sflogItem.team_name
}}</span>
</td>
</tr>
<tr>
<td class="numCell">产量t</td>
<td class="numCell">{{ reportItem.total_production }}</td>
<td class="numCell">单位产品分布电耗KW·h/t</td>
<td class="numCell">{{ reportItem.elec_consume_unit }}</td>
<td class="numCell">
{{ reportItem.total_production }}
</td>
<td class="numCell">
单位产品分布电耗KW·h/t
</td>
<td class="numCell">
{{ reportItem.elec_consume_unit }}
</td>
<td class="numCell">单位成本/</td>
<td class="numCell">{{ reportItem.production_cost_unit }}</td>
<td class="numCell">
{{ reportItem.production_cost_unit }}
</td>
</tr>
<tr v-if="sflogexpList.length > 0">
<td class="numCell" :rowspan="sflogexpList.length + 1">生产情况记录</td>
<td
class="numCell"
:rowspan="sflogexpList.length + 1"
>
生产情况记录
</td>
<td class="numCell">时间</td>
<td class="numCell">类别</td>
<td class="numCell">原因</td>
@ -114,12 +229,12 @@ export default {
name: "sflog",
data() {
return {
apiObj: this.$API.wpm.sflog.list,
apiObj: null,
apiObj2: null,
query: {
mgroup: '3346491835287007232',
mgroup: "",
},
deptId: '3345780809943797760',
deptId: "",
sflogItem: {},
options: [],
optionsShift: [],
@ -129,22 +244,30 @@ export default {
};
},
mounted() {
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.getTeam();
this.getShfit();
});
},
methods: {
getTeam() {
let form = {};
form.page = 0;
form.belong_dept = this.deptId;
this.$API.mtm.team.list.req(form).then(res => {
this.$API.mtm.team.list.req(form).then((res) => {
this.options = res;
})
});
},
getShfit() {
this.$API.mtm.shift.list.req({ page: 0 }).then(res => {
this.$API.mtm.shift.list.req({ page: 0 }).then((res) => {
this.optionsShift = res;
})
});
},
handleQuery() {
this.$refs.table.queryData(this.query);
@ -160,38 +283,42 @@ export default {
},
getSflogexp(id) {
let that = this;
that.$API.wpm.sflogexp.list.req({ page: 0, sflog: id }).then(res => {
that.$API.wpm.sflogexp.list
.req({ page: 0, sflog: id })
.then((res) => {
that.sflogexpList = res;
})
});
},
getSflogItem(id) {
let that = this;
that.$API.enm.enstat.req({ type: 'sflog', sflog: id, page: 0 }).then(res => {
that.$API.enm.enstat
.req({ type: "sflog", sflog: id, page: 0 })
.then((res) => {
if (res.length > 0) {
that.reportItem = res[0];
}
console.log(res[0])
})
console.log(res[0]);
});
},
//
sflog_edit(row) {
let jsonStr = JSON.stringify(row);
this.$TOOL.data.remove("sflogItem")
this.$TOOL.data.set('sflogItem', jsonStr)
this.$TOOL.data.remove("sflogItem");
this.$TOOL.data.set("sflogItem", jsonStr);
this.$router.push({
name: "logDetail",
query: {
mgroupId: row.mgroup,
deptId: this.deptId
deptId: this.deptId,
},
});
},
handlePrint() {
this.$PRINT('#myReport');
this.$PRINT("#myReport");
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#myTable', this.tableName)
this.$XLSX("#myTable", this.tableName);
this.exportLoading = false;
},
},
@ -217,7 +344,7 @@ export default {
}
.searchHead {
display: flex
display: flex;
}
.middleText {
@ -231,4 +358,3 @@ export default {
margin-left: 5px;
}
</style>

View File

@ -5,23 +5,28 @@
<el-button
type="primary"
@click="exportExcel()"
:loading = "exportLoading"
:loading="exportLoading"
>导出xlsx
</el-button>
<el-button
type="primary"
@click="handlePrint"
>打印
</el-button>
<el-button type="primary" @click="handlePrint">打印 </el-button>
</div>
</el-header>
<el-card style="margin-top:5px">
<el-card style="margin-top: 5px">
<div class="printWrap">
<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">
<tr>
<th colspan="5">电石渣工段主要设备100KW以上单位产品电耗数据表</th>
<th colspan="5">
电石渣工段主要设备100KW以上单位产品电耗数据表
</th>
</tr>
<tr>
<th>设备名称</th>
@ -33,21 +38,49 @@
</thead>
<tbody>
<tr v-for="item in tableDatas" :key="item">
<template v-for="(item1,ind) in item" :key="item1">
<td v-if="ind==0||ind==1||ind==2" class="numCell">{{item1}}</td>
<td v-if="ind==3" class="numCell" @click="itemClick('day_s',item)">{{item1}}</td>
<td v-if="ind==4" class="numCell" @click="itemClick('month_s',item)">{{item1}}</td>
<template
v-for="(item1, ind) in item"
:key="item1"
>
<td
v-if="ind == 0 || ind == 1 || ind == 2"
class="numCell"
>
{{ item1 }}
</td>
<td
v-if="ind == 3"
class="numCell"
@click="itemClick('day_s', item)"
>
{{ item1 }}
</td>
<td
v-if="ind == 4"
class="numCell"
@click="itemClick('month_s', item)"
>
{{ item1 }}
</td>
</template>
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts>
<scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts>
<scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div>
</div>
</div>
@ -56,114 +89,95 @@
:type="type"
:title="title"
:cate="cate"
:apiObj = "apiObj"
:apiObj="apiObj"
:mgroup="query.mgroup"
:modelValue="modelValue"
:showClose="showClose"
:echartType='echartType'
:echartType="echartType"
@closed="asynDialog = false"
></charts>
</el-card>
</div>
</template>
<script>
const colors =['#647bfe'];
let tooltip= {
const colors = ["#647bfe"];
let tooltip = {
show: true,
trigger: 'axis',
trigger: "axis",
axisPointer: {
type: 'cross'
type: "cross",
},
confine:false,
confine: false,
showContent: true,
triggerOn:"mousemove",
};
let grid={
right: '3%',
left:'7%',
top:'15%'
};
let toolbox={
right:'5%',
timeStamp: null,
triggerOn: "mousemove",
};
let grid = {
right: "3%",
left: "7%",
top: "15%",
};
let toolbox = {
right: "5%",
feature: {
dataView: { show: true, readOnly: false },
saveAsImage: { show: true }
}
};
let legend= {
top:'2%',
data:['烘干破主电机']
};
let yAxis= {
type: 'value',
name: '分布电耗(KW.h/t)',
saveAsImage: { show: true },
},
};
let legend = {
top: "2%",
data: ["烘干破主电机"],
};
let yAxis = {
type: "value",
name: "分布电耗(KW.h/t)",
alignTicks: true,
axisLine: {
show: true,
lineStyle: {
color: '#647bfe'
}
color: "#647bfe",
},
},
axisLabel: {
formatter: '{value}'
}
};
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue'
export default {
formatter: "{value}",
},
};
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from "vue";
export default {
components: {
scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")),
charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
},
data() {
return {
exportLoading: false,
chartShow: false,
myOption: null,
optionDay:{},
optionMonth:{},
year:2023,
month:1,
optionDay: {},
optionMonth: {},
year: 2023,
month: 1,
query: {
mgroup:'3346491835287007232',
mgroup: "",
},
tableName:'主要设备100KW以上单位产品电耗数据表',
tableDatas:[
['烘干破主电机','','kw.h/t','','',''],
],
modelValue:true,
type:'hour_s',
title:'电石渣工段',
cate:'',
apiObj:this.$API.enm.mpoint.stat,
showClose:true,
echartType:'line',
asynDialog:false,
allValDays:0,
allValMonth:0,
option1:{
tableName: "主要设备100KW以上单位产品电耗数据表",
tableDatas: [["烘干破主电机", "", "kw.h/t", "", "", ""]],
modelValue: true,
type: "hour_s",
title: "电石渣工段",
cate: "",
apiObj: this.$API.enm.mpoint.stat,
showClose: true,
echartType: "line",
asynDialog: false,
allValDays: 0,
allValMonth: 0,
option1: {
color: colors,
tooltip:tooltip,
grid: grid,
toolbox: toolbox,
legend:legend,
xAxis: {
axisTick: {
show: true,
length: 5,
inside: true,
},
data: []
},
yAxis:yAxis,
series:{
name: '烘干破主电机',
type: 'bar',
data:[]
}
},
option2:{
color: colors,
tooltip:tooltip,
tooltip: tooltip,
grid: grid,
toolbox: toolbox,
legend: legend,
@ -173,14 +187,48 @@
length: 5,
inside: true,
},
data: []
data: [],
},
yAxis: yAxis,
series:{
name: '烘干破主电机',
type: 'bar',
data:[]
}
series: {
name: "烘干破主电机",
type: "bar",
data: [],
},
},
option2: {
color: colors,
tooltip: tooltip,
grid: grid,
toolbox: toolbox,
legend: legend,
xAxis: {
axisTick: {
show: true,
length: 5,
inside: true,
},
data: [
"一月",
"二月",
"三月",
"四月",
"五月",
"六月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
},
yAxis: yAxis,
series: {
name: "烘干破主电机",
type: "bar",
data: [],
},
},
};
},
@ -188,159 +236,190 @@
let that = this;
var myDate = new Date();
let year = myDate.getFullYear();
let month = myDate.getMonth()+1;
let month = myDate.getMonth() + 1;
let days = myDate.getDate();
let hours = myDate.getHours();
let timeDate = myDate.getTime();
this.timeStamp = timeDate;
this.year = year;
this.month = month;
this.days = days;
let dayTime = 24 * 60 * 60 * 1000;
//
let year_d = year,month_d = month,days_d = days;
if(hours<21){//21点前查找昨日数据为前一天数据
let newDate = timeDate- dayTime;
let year_d = year,
month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime;
let lastDate = new Date(newDate);
year_d = lastDate.getFullYear();
month_d = lastDate.getMonth()+1;
month_d = lastDate.getMonth() + 1;
days_d = lastDate.getDate();
}
this.$API.mtm.mgroup.list
.req({ page: 0, search: "电石渣" })
.then((res) => {
console.log("电石渣", res);
that.query.mgroup = res[0].id;
//
let params2 = {};
params2.page = 0;
params2.year_s = year;
params2.month_s = month;
params2.type = 'month_s';
params2.type = "month_s";
params2.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => {
if(res2.length>0){
let allValMonth=that.allValMonth = res2[0].total_production;//
this.$API.enm.enstat
.req(params2)
.then((res2) => {
if (res2.length > 0) {
let allValMonth = (that.allValMonth =
res2[0].total_production); //
params2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params2).then((res) => {
this.$API.enm.mpoint.stat
.req(params2)
.then((res) => {
let data2 = res;
for (let i = 0; i < data2.length; i++) {
that.tableDatas[i]=[];
that.tableDatas[i][0]=data2[i].ep_monitored_name;
that.tableDatas[i][1]=data2[i].ep_monitored_number;
that.tableDatas[i][2]='KW·h/t';
let val = allValMonth==0?'/':(data2[i].val/allValMonth).toFixed(2);
that.tableDatas[i][4]=val;
that.tableDatas[i] = [];
that.tableDatas[i][0] =
data2[i].ep_monitored_name;
that.tableDatas[i][1] =
data2[i].ep_monitored_number;
that.tableDatas[i][2] = "KW·h/t";
let val =
allValMonth == 0
? "/"
: (
data2[i].val /
allValMonth
).toFixed(2);
that.tableDatas[i][4] = val;
}
});
}
})
}
}).then(res2=>{
.then((res2) => {
//
let params3 = {};
params3.page = 0;
params3.year_s = year_d;
params3.month_s = month_d;
params3.day_s = days_d;
params3.type = 'day_s';
params3.type = "day_s";
params3.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => {
if(res3.length>0){
let allValDays=that.allValDays = res3[0].total_production;
if (res3.length > 0) {
let allValDays = (that.allValDays =
res3[0].total_production);
params3.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.mpoint.stat.req(params3).then((res) => {
this.$API.enm.mpoint.stat
.req(params3)
.then((res) => {
let data3 = res3;
for (let j = 0; j < data3.length; j++) {
let val = allValDays==0?'/':(data3[j].val/allValDays).toFixed(2);
that.tableDatas[j][3]=val;
let val =
allValDays == 0
? "/"
: (
data3[j].val /
allValDays
).toFixed(2);
that.tableDatas[j][3] = val;
}
})
});
}
})
})
});
});
that.getDayData();
that.getMonthData();
});
},
methods: {
//
getDayData(){
getDayData() {
let that = this;
let query1 = {};
query1.page = 0;
query1.year_s = that.year;
query1.month_s = that.month;
query1.type = 'day_s';
query1.type = "day_s";
query1.mgroup = this.query.mgroup;
query1.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [];
let data = response;
data.forEach(item => {
data.forEach((item) => {
let ind = item.day_s;
let val=0;
if(that.allValDays==0){
val = ''
}else{
val = (item.val/that.allValDays).toFixed(2);
let val = 0;
if (that.allValDays == 0) {
val = "";
} else {
val = (item.val / that.allValDays).toFixed(2);
}
if(item.equip_name=='烘干破主电机'){
if (item.equip_name == "烘干破主电机") {
seriesData0[ind] = val;
}
});
let options = {...that.option1};
options.series.data=seriesData0;
let options = { ...that.option1 };
options.series.data = seriesData0;
let dayXAxis = [];
for (let i = 1; i <= that.days; i++) {
let item = i+'日'
dayXAxis.push(item)
let item = i + "日";
dayXAxis.push(item);
}
options.xAxis.data = dayXAxis;
that.optionDay = options;
})
});
},
//
getMonthData(){
getMonthData() {
let that = this;
let query2 = {};
query2.page = 0;
query2.year_s = that.year;
query2.type = 'month_s';
query2.type = "month_s";
query2.mgroup = that.query.mgroup;
query2.mpoint__ep_monitored__power_kw__gte = 100;
this.$API.enm.enstat.req(query2).then((response) => {
let seriesData0 = [];
let data = response;
data.forEach(item => {
data.forEach((item) => {
let ind = item.month_s;
let val=0;
if(that.allValMonth==0){
val = ''
}else{
val = (item.val/that.allValMonth).toFixed(2);
let val = 0;
if (that.allValMonth == 0) {
val = "";
} else {
val = (item.val / that.allValMonth).toFixed(2);
}
if(item.equip_name=='烘干破主电机'){
if (item.equip_name == "烘干破主电机") {
seriesData0[ind] = val;
}
});
let options = {...that.option2};
options.series.data=seriesData0;
let monthXAxis = [];
for (let i = 1; i <= that.month; i++) {
let item = i+'月'
monthXAxis.push(item)
}
options.xAxis.data = monthXAxis;
let options = { ...that.option2 };
options.series.data = seriesData0;
that.optionMonth = options;
})
});
},
itemClick(type,item){
this.type=type;
itemClick(type, item) {
this.type = type;
this.cate = item[0];
this.asynDialog = true;
},
handlePrint() {
this.$PRINT('#myReport');
this.$PRINT("#myReport");
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#myTable', this.tableName)
this.$XLSX("#myTable", this.tableName);
this.exportLoading = false;
},
}
};
},
};
</script>
<style scoped>
.printContainer{
.printContainer {
padding-left: 20px;
}
</style>

View File

@ -5,20 +5,23 @@
<el-button
type="primary"
@click="exportExcel()"
:loading = "exportLoading"
:loading="exportLoading"
>导出xlsx
</el-button>
<el-button
type="primary"
@click="handlePrint"
>打印
</el-button>
<el-button type="primary" @click="handlePrint">打印 </el-button>
</div>
</el-header>
<el-card style="margin-top:5px">
<el-card style="margin-top: 5px">
<div class="printWrap">
<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">
<tr>
<th colspan="9">电石渣工段生产报告</th>
@ -35,31 +38,54 @@
</tr>
</thead>
<tbody>
<tr v-for="(item) in tableDatas" :key="item">
<td class="numCell">{{item[0]}}</td>
<td class="numCell">{{item[1]}}</td>
<td class="numCell hoursItem" @click="itemClick('day_s',item)" >{{item[2]}}</td>
<td class="numCell daysItem" @click="itemClick('month_s',item)">{{item[3]}}</td>
<td class="numCell monthItem" @click="itemClick('year_s',item)">{{item[4]}}</td>
<td class="numCell">{{item[6]}}</td>
<td class="numCell">{{item[6]}}</td>
<td class="numCell">{{item[7]}}</td>
<td class="numCell">{{item[8]}}</td>
<tr v-for="item in tableDatas" :key="item">
<td class="numCell">{{ item[0] }}</td>
<td class="numCell">{{ item[1] }}</td>
<td
class="numCell hoursItem"
@click="itemClick('day_s', item)"
>
{{ item[2] }}
</td>
<td
class="numCell daysItem"
@click="itemClick('month_s', item)"
>
{{ item[3] }}
</td>
<td
class="numCell monthItem"
@click="itemClick('year_s', item)"
>
{{ item[4] }}
</td>
<td class="numCell">{{ item[6] }}</td>
<td class="numCell">{{ item[6] }}</td>
<td class="numCell">{{ item[7] }}</td>
<td class="numCell">{{ item[8] }}</td>
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionDay"></scEcharts>
<scEcharts
height="400px"
width="1033px"
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts height="400px" width="1033px" :option="optionMonth"></scEcharts>
<scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div>
</div>
</div>
<sc-dialog v-model="chartShow" draggable title="电石渣工段">
<div class="searchHead" v-if="type=='hours'">
<div class="searchHead" v-if="type == 'hours'">
<el-date-picker
v-model="query.start_time"
type="date"
@ -77,9 +103,14 @@
start-placeholder="结束日期"
:picker-options="pickerOptions"
/>
<el-button type="primary" class="searchBtn" @click="dataSearch">查询</el-button>
<el-button
type="primary"
class="searchBtn"
@click="dataSearch"
>查询</el-button
>
</div>
<div class="searchHead" v-if="type=='days'">
<div class="searchHead" v-if="type == 'days'">
<el-date-picker
v-model="query.start_time"
type="date"
@ -96,9 +127,14 @@
start-placeholder="结束日期"
:picker-options="pickerOptions"
/>
<el-button type="primary" class="searchBtn" @click="dataSearch">查询</el-button>
<el-button
type="primary"
class="searchBtn"
@click="dataSearch"
>查询</el-button
>
</div>
<div class="searchHead" v-if="type=='month'">
<div class="searchHead" v-if="type == 'month'">
<el-date-picker
v-model="query.start_time"
type="month"
@ -115,9 +151,14 @@
start-placeholder="结束月份"
:picker-options="pickerOptions"
/>
<el-button type="primary" class="searchBtn" @click="dataSearch">查询</el-button>
<el-button
type="primary"
class="searchBtn"
@click="dataSearch"
>查询</el-button
>
</div>
<div class="searchHead" v-if="type=='year'">
<div class="searchHead" v-if="type == 'year'">
<el-date-picker
v-model="query.start_time"
type="year"
@ -134,172 +175,150 @@
start-placeholder="结束日期"
:picker-options="pickerOptions"
/>
<el-button type="primary" class="searchBtn" @click="dataSearch">查询</el-button>
<el-button
type="primary"
class="searchBtn"
@click="dataSearch"
>查询</el-button
>
</div>
<scEcharts height="360px" :option="myOption" v-if="chartShow"></scEcharts>
<scEcharts
height="360px"
:option="myOption"
v-if="chartShow"
></scEcharts>
</sc-dialog>
<charts
v-if="asynDialog"
:type="type"
:title="title"
:cate="cate"
:apiObj = "apiObj"
:apiObj="apiObj"
:mgroup="query.mgroup"
:modelValue="modelValue"
:showClose="showClose"
:echartType='echartType'
:echartType="echartType"
@closed="asynDialog = false"
></charts>
</el-card>
</div>
</template>
</template>
<script>
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue'
const colors =['#647bfe','#cbd3fe','#91CC75','#EE6666'];
let tooltip= {
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from "vue";
const colors = ["#647bfe", "#cbd3fe", "#91CC75", "#EE6666"];
let tooltip = {
show: true,
trigger: 'axis',
trigger: "axis",
axisPointer: {
type: 'cross'
type: "cross",
},
confine:false,
confine: false,
showContent: true,
triggerOn:"mousemove",
};
let grid={
right: '7%',
left:'4%',
top:'15%'
};
let toolbox={
right:'5%',
triggerOn: "mousemove",
};
let grid = {
right: "7%",
left: "4%",
top: "15%",
};
let toolbox = {
right: "5%",
feature: {
dataView: { show: true, readOnly: false },
saveAsImage: { show: true }
}
};
let legend= {
top:'2%',
data:['总产量', '分布电耗', '成本']
};
let yAxis= [{
type: 'value',
name: '产量 (t)',
position: 'left',
saveAsImage: { show: true },
},
};
let legend = {
top: "2%",
data: ["总产量", "分布电耗", "成本"],
};
let yAxis = [
{
type: "value",
name: "产量 (t)",
position: "left",
alignTicks: true,
axisLine: {
show: true,
lineStyle: {
color: colors[0]
}
color: colors[0],
},
},
axisLabel: {
formatter: '{value}'
}
formatter: "{value}",
},
},
{
type: 'value',
name: '分布电耗(KW.h)',
position: 'right',
type: "value",
name: "分布电耗(KW.h)",
position: "right",
alignTicks: true,
offset: 80,
axisLine: {
show: true,
lineStyle: {
color: colors[1]
}
color: colors[1],
},
},
axisLabel: {
formatter: '{value}'
}
formatter: "{value}",
},
},
{
type: 'value',
name: '成本(元)',
position: 'right',
type: "value",
name: "成本(元)",
position: "right",
alignTicks: true,
axisLine: {
show: true,
lineStyle: {
color: colors[2]
}
color: colors[2],
},
},
axisLabel: {
formatter: '{value}'
}
}
];
export default {
formatter: "{value}",
},
},
];
export default {
components: {
scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")),
charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
},
data() {
return {
timeStamp: null,
exportLoading: false,
chartShow: false,
myOption: null,
optionDay:{},
optionMonth:{},
year:2023,
month:1,
days:1,
optionDay: {},
optionMonth: {},
year: 2023,
month: 1,
days: 1,
query: {
mgroup:'3346491835287007232',
mgroup: "3346491835287007232",
},
tableDatas:[
['产量','总产量t',0,0,0,0,0,0,0,0],
['能耗','单位产品分布电耗KW·h/t',0,0,0,0,0,0,0,0],
['成本','电石渣成本(元/吨)',0,0,0,0,0,0,0,0],
tableDatas: [
["产量", "总产量t", 0, 0, 0, 0, 0, 0, 0, 0],
["能耗", "单位产品分布电耗KW·h/t", 0, 0, 0, 0, 0, 0, 0, 0],
["成本", "电石渣成本(元/吨)", 0, 0, 0, 0, 0, 0, 0, 0],
],
cate:'',
apiObj:this.$API.enm.enstat,
tableName:'生产报告',
modelValue:true,
type:'hour_s',
title:'电石渣工段',
showClose:true,
echartType:'line',
asynDialog:false,
option1:{
cate: "",
apiObj: this.$API.enm.enstat,
tableName: "生产报告",
modelValue: true,
type: "hour_s",
title: "电石渣工段",
showClose: true,
echartType: "line",
asynDialog: false,
option1: {
color: colors,
tooltip:tooltip,
grid: grid,
toolbox: toolbox,
legend:legend,
xAxis: {
axisTick: {
show: true,
length: 5,
inside: true,
},
data: []
},
yAxis:yAxis,
series:[
{
name: '总产量',
type: 'bar',
yAxisIndex:0,
data:[]
},
{
name: '分布电耗',
type: 'bar',
yAxisIndex: 1,
data: []
},
{
name: '成本',
type: 'bar',
yAxisIndex: 2,
data: []
},
]
},
option2:{
color: colors,
tooltip:tooltip,
tooltip: tooltip,
grid: grid,
toolbox: toolbox,
legend: legend,
@ -309,229 +328,304 @@
length: 5,
inside: true,
},
data: []
data: [],
},
yAxis: yAxis,
series:[
series: [
{
name: '总产量',
type: 'bar',
yAxisIndex:0,
data:[]
name: "总产量",
type: "bar",
yAxisIndex: 0,
data: [],
},
{
name: '分布电耗',
type: 'bar',
name: "分布电耗",
type: "bar",
yAxisIndex: 1,
data: []
data: [],
},
{
name: '成本',
type: 'bar',
name: "成本",
type: "bar",
yAxisIndex: 2,
data: []
data: [],
},
],
},
option2: {
color: colors,
tooltip: tooltip,
grid: grid,
toolbox: toolbox,
legend: legend,
xAxis: {
axisTick: {
show: true,
length: 5,
inside: true,
},
data: [],
},
yAxis: yAxis,
series: [
{
name: "总产量",
type: "bar",
yAxisIndex: 0,
data: [],
},
{
name: "分布电耗",
type: "bar",
yAxisIndex: 1,
data: [],
},
{
name: "成本",
type: "bar",
yAxisIndex: 2,
data: [],
},
],
},
]
}
};
},
mounted() {
function precen(a,b){
if(b!==0&&b!==null&&a!==null){
let precen = (a/b).toFixed(2)
return precen*100+'%'
}else{
return '/'
function precen(a, b) {
if (b !== 0 && b !== null && a !== null) {
let precen = (a / b).toFixed(2);
return precen * 100 + "%";
} else {
return "/";
}
}
let that = this;
var myDate = new Date();
let year =that.year = myDate.getFullYear();
let month = that.month = myDate.getMonth()+1;
let days = that.days = myDate.getDate();
let year = (that.year = myDate.getFullYear());
let month = (that.month = myDate.getMonth() + 1);
let days = (that.days = myDate.getDate());
let hours = myDate.getHours();
let timeDate = myDate.getTime();
this.timeStamp = timeDate;
let dayTime = 24 * 60 * 60 * 1000;
//
let year_d = year,month_d = month,days_d = days;
if(hours<21){//21点前查找昨日数据为前一天数据
let newDate = timeDate- dayTime;
let year_d = year,
month_d = month,
days_d = days;
if (hours < 21) {
//21
let newDate = timeDate - dayTime;
let lastDate = new Date(newDate);
year_d = lastDate.getFullYear();
month_d = lastDate.getMonth()+1;
month_d = lastDate.getMonth() + 1;
days_d = lastDate.getDate();
}
this.$API.mtm.mgroup.list
.req({ page: 0, search: "电石渣" })
.then((res) => {
console.log("电石渣", res);
that.query.mgroup = res[0].id;
//
let params3 = {};
params3.page = 0;
params3.year_s = year_d;
params3.month_s = month_d;
params3.day_s = days_d;
params3.type = 'day_s';
params3.type = "day_s";
params3.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(params3).then((res3) => {
if(res3.length>0){
if (res3.length > 0) {
let data3 = res3[0];
that.tableDatas[0][2]=data3.total_production;
that.tableDatas[1][2]=data3.elec_consume_unit;
that.tableDatas[2][2]=data3.production_cost_unit;
that.tableDatas[0][2] = data3.total_production;
that.tableDatas[1][2] = data3.elec_consume_unit;
that.tableDatas[2][2] = data3.production_cost_unit;
}
})
});
//
let params5 = {};
params5.page=0;
params5.mgroup='3346520558031773696';
this.$API.mtm.goal.list.req(params5).then((res5) => {
if(res5.length>0){
params5.page = 0;
params5.mgroup = "3346520558031773696";
this.$API.mtm.goal.list
.req(params5)
.then((res5) => {
if (res5.length > 0) {
let data5 = res5;
data5.forEach(item5=>{
let str = 'goal_val_'+that.month;
if(item5.goal_cate_name=='总产量t'){
that.tableDatas[0][5]=item5[str];
that.tableDatas[0][7]=item5.goal_val;
}else if(item5.goal_cate_name=='单位产品分布电耗KW·h/t'){
that.tableDatas[1][5]=item5[str];
that.tableDatas[1][7]=item5.goal_val;
}else if(item5.goal_cate_name=='单位产品成本(元/吨)'){
that.tableDatas[2][5]=item5[str];
that.tableDatas[2][7]=item5.goal_val;
data5.forEach((item5) => {
let str = "goal_val_" + that.month;
if (item5.goal_cate_name == "总产量t") {
that.tableDatas[0][5] = item5[str];
that.tableDatas[0][7] = item5.goal_val;
} else if (
item5.goal_cate_name ==
"单位产品分布电耗KW·h/t"
) {
that.tableDatas[1][5] = item5[str];
that.tableDatas[1][7] = item5.goal_val;
} else if (
item5.goal_cate_name ==
"单位产品成本(元/吨)"
) {
that.tableDatas[2][5] = item5[str];
that.tableDatas[2][7] = item5.goal_val;
}
});
}
})
}
}).then(res=>{
.then((res) => {
//
let params1 = {};
params1.page = 0;
params1.year_s = year;
params1.type = 'year_s';
params1.type = "year_s";
params1.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(params1).then((res1) => {
if(res1.length>0){
if (res1.length > 0) {
let data1 = res1[0];
that.tableDatas[0][4]=data1.total_production;
that.tableDatas[0][8]=precen(that.tableDatas[0][4],that.tableDatas[0][7])
that.tableDatas[1][4]=data1.elec_consume_unit;
that.tableDatas[1][8]=precen(that.tableDatas[1][4],that.tableDatas[1][7])
that.tableDatas[2][4]=data1.production_cost_unit;
that.tableDatas[2][8]=precen(that.tableDatas[2][4],that.tableDatas[2][7])
}else{
that.tableDatas[0][4] = data1.total_production;
that.tableDatas[0][8] = precen(
that.tableDatas[0][4],
that.tableDatas[0][7]
);
that.tableDatas[1][4] = data1.elec_consume_unit;
that.tableDatas[1][8] = precen(
that.tableDatas[1][4],
that.tableDatas[1][7]
);
that.tableDatas[2][4] =
data1.production_cost_unit;
that.tableDatas[2][8] = precen(
that.tableDatas[2][4],
that.tableDatas[2][7]
);
} else {
}
})
});
//
let params2 = {};
params2.page = 0;
params2.year_s = year;
params2.month_s = month;
params2.type = 'month_s';
params2.type = "month_s";
params2.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(params2).then((res2) => {
if(res2.length>0){
if (res2.length > 0) {
let data2 = res2[0];
that.tableDatas[0][3]=data2.total_production;
that.tableDatas[0][6]=precen(that.tableDatas[0][3],that.tableDatas[0][5])
that.tableDatas[1][3]=data2.elec_consume_unit;
that.tableDatas[1][6]=precen(that.tableDatas[1][3],that.tableDatas[1][5])
that.tableDatas[2][3]=data2.production_cost_unit;
that.tableDatas[2][6]=precen(that.tableDatas[2][3],that.tableDatas[2][5])
that.tableDatas[0][3] = data2.total_production;
that.tableDatas[0][6] = precen(
that.tableDatas[0][3],
that.tableDatas[0][5]
);
that.tableDatas[1][3] = data2.elec_consume_unit;
that.tableDatas[1][6] = precen(
that.tableDatas[1][3],
that.tableDatas[1][5]
);
that.tableDatas[2][3] =
data2.production_cost_unit;
that.tableDatas[2][6] = precen(
that.tableDatas[2][3],
that.tableDatas[2][5]
);
}
})
})
});
});
that.getDayData();
that.getMonthData();
});
},
methods: {
//
getDayData(){
getDayData() {
let that = this;
let query1 = {};
query1.page = 0;
query1.year_s = that.year;
query1.month_s = that.month;
query1.type = 'day_s';
query1.type = "day_s";
query1.mgroup = this.query.mgroup;
this.$API.enm.enstat.req(query1).then((response) => {
let seriesData0 = [],seriesData1 = [], seriesData2 = [];
let seriesData0 = [],
seriesData1 = [],
seriesData2 = [];
let data = response;
data.forEach(item => {
data.forEach((item) => {
let ind = item.day_s;
seriesData0[ind] = item.total_production;
seriesData1[ind] = item.production_cost_unit;
seriesData2[ind] = item.elec_consume_unit;
});
let options = {...that.option1};
options.series[0].data=seriesData0;
options.series[1].data=seriesData1;
options.series[2].data=seriesData2;
let options = { ...that.option1 };
options.series[0].data = seriesData0;
options.series[1].data = seriesData1;
options.series[2].data = seriesData2;
let dayXAxis = [];
for (let i = 1; i <= that.days; i++) {
let item = i+'日'
dayXAxis.push(item)
let item = i + "日";
dayXAxis.push(item);
}
options.xAxis.data = dayXAxis;
that.optionDay = options;
})
});
},
//
getMonthData(){
getMonthData() {
let that = this;
let query2 = {};
query2.page = 0;
query2.year_s = that.year;
query2.type = 'month_s';
query2.type = "month_s";
query2.mgroup = that.query.mgroup;
this.$API.enm.enstat.req(query2).then((response) => {
let seriesData0 = [],seriesData1 = [], seriesData2 = [];
let seriesData0 = [],
seriesData1 = [],
seriesData2 = [];
let data = response;
data.forEach(item => {
data.forEach((item) => {
let ind = item.month_s;
seriesData0[ind] = item.total_production;
seriesData1[ind] = item.production_cost_unit;
seriesData2[ind] = item.elec_consume_unit;
});
let options = {...that.option2};
options.series[0].data=seriesData0;
options.series[1].data=seriesData1;
options.series[2].data=seriesData2;
let options = { ...that.option2 };
options.series[0].data = seriesData0;
options.series[1].data = seriesData1;
options.series[2].data = seriesData2;
let monthXAxis = [];
for (let i = 1; i <= that.month; i++) {
let item = i+'月'
monthXAxis.push(item)
let item = i + "月";
monthXAxis.push(item);
}
options.xAxis.data = monthXAxis;
that.optionMonth = options;
})
});
},
itemClick(type,item){
this.type=type;
this.cate=item[1];
itemClick(type, item) {
this.type = type;
this.cate = item[1];
this.asynDialog = true;
},
itemClick1(type,item){
itemClick1(type, item) {
this.chartShow = false;
this.$API.bi.dataset.exec
.req('3322567213885833216')
.then((res) => {
this.$API.bi.dataset.exec.req("3322567213885833216").then((res) => {
this.myOption = JSON.parse(res.echart_options);
debugger;
console.log(this.myOption)
console.log(this.myOption);
this.chartShow = true;
});
},
handlePrint() {
this.$PRINT('#myReport');
this.$PRINT("#myReport");
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#myTable', this.tableName)
this.$XLSX("#myTable", this.tableName);
this.exportLoading = false;
},
}
};
},
};
</script>
<style scoped>
.printContainer{
.printContainer {
padding-left: 20px;
}
</style>

View File

@ -18,20 +18,23 @@
<el-button
type="primary"
@click="exportExcel()"
:loading = "exportLoading"
:loading="exportLoading"
>导出xlsx
</el-button>
<el-button
type="primary"
@click="handlePrint"
>打印
</el-button>
<el-button type="primary" @click="handlePrint">打印 </el-button>
</div>
</el-header>
<el-card style="margin-top:5px">
<el-card style="margin-top: 5px">
<div class="printWrap">
<div ref="print" id="myReport" class="printContainer">
<table border="1" width="1075" cellspacing="0" :key="timeStamp" id="myTable" class="myTable">
<table
border="1"
width="1075"
cellspacing="0"
:key="timeStamp"
id="myTable"
class="myTable"
>
<thead class="myTableHead">
<tr>
<th colspan="12">电石渣工段班组月度对比分析</th>
@ -54,168 +57,194 @@
<th>同比增长率%</th>
</tr>
</thead>
<tr v-for="(item,index) in tableDatas" :key="index">
<td v-for="(item0,index0) in item" :key="index0" class="numCell">{{item0}}</td>
<tr v-for="(item, index) in tableDatas" :key="index">
<td
v-for="(item0, index0) in item"
:key="index0"
class="numCell"
>
{{ item0 }}
</td>
</tr>
</table>
</div>
</div>
</el-card>
</div>
</template>
</template>
<script>
export default {
export default {
data() {
return {
query:{
year_s:'',
page : 0,
type : 'month_st',
mgroup:'3346491835287007232',
query: {
year_s: "",
page: 0,
type: "month_st",
mgroup: "",
},
tableDatas:[],
timeStamp: null,
exportLoading: false,
tableDatas: [],
};
},
mounted() {
let that = this;
var myDate = new Date();
let year = myDate.getFullYear();
this.timeStamp = myDate.getTime();
that.query.year_s = year;
this.$API.mtm.mgroup.list
.req({ page: 0, search: "电石渣" })
.then((res) => {
console.log("电石渣", res);
that.query.mgroup = res[0].id;
let params = {};
params.page=0;
params.year=year;
params.mgroup=that.query.mgroup;
params.page = 0;
params.year = year;
params.mgroup = that.query.mgroup;
this.$API.mtm.goal.list.req(params).then((res) => {
let data = [];
if(res.length>0){
if (res.length > 0) {
data = res[0];
}
that.getData(data);
})
});
});
},
methods: {
getData(goalData){
getData(goalData) {
let that = this;
let query0={};
let query0 = {};
query0.page = 0;
query0.type='month_st';
query0.year_s = that.query.year_s-1;
query0.mgroup='3346491835287007232';
let wrapArr = [],wrapArr0 = [] ,wrapArrs = [];
query0.type = "month_st";
query0.year_s = that.query.year_s - 1;
query0.mgroup = that.query.mgroup;
let wrapArr = [],
wrapArr0 = [],
wrapArrs = [];
this.$API.enm.enstat.req(query0).then((res0) => {
let data0 = res0;
if(data0.length>0){
data0.forEach(item0 => {
if (data0.length > 0) {
data0.forEach((item0) => {
//
let n0 = item0.month_s;
let ind0 = 0;
if(team_name0.indexOf('甲')>-1){
ind0 = (n0-1)*3;
}else if(team_name0.indexOf('乙')>-1){
ind0 = (n0-1)*3+1;
}else if(team_name0.indexOf('丙')>-1){
ind0 = (n0-1)*3+2;
if (item0.team_name.indexOf("甲") > -1) {
ind0 = (n0 - 1) * 3;
} else if (item0.team_name.indexOf("乙") > -1) {
ind0 = (n0 - 1) * 3 + 1;
} else if (item0.team_name.indexOf("丙") > -1) {
ind0 = (n0 - 1) * 3 + 2;
}
wrapArr0[ind0] = item0;
});
console.log(wrapArr0)
}else{
console.log(wrapArr0);
} else {
}
this.$API.enm.enstat.req(that.query).then((res) => {
let data = res;
if(data.length>0){
data.forEach(item => {
if (data.length > 0) {
data.forEach((item) => {
//
let n = item.month_s;
let team_name = item.team_name;
let ind = 0;
if(team_name.indexOf('甲')>-1){
ind = (n-1)*3;
}else if(team_name.indexOf('乙')>-1){
ind = (n-1)*3+1;
}else if(team_name.indexOf('丙')>-1){
ind = (n-1)*3+2;
if (team_name.indexOf("甲") > -1) {
ind = (n - 1) * 3;
} else if (team_name.indexOf("乙") > -1) {
ind = (n - 1) * 3 + 1;
} else if (team_name.indexOf("丙") > -1) {
ind = (n - 1) * 3 + 2;
}
wrapArrs[ind] = item;
let arr = [];
let time = ''+item.year_s+'.'+item.month_s;
let time = "" + item.year_s + "." + item.month_s;
arr.push(time);
arr.push(item.team_name);
arr.push(item.total_production);
arr.push(item.production_hour);
arr[4]=item.elec_consume_unit//KW·h/t
let keyVale ='goal_val_'+n;
arr[5]=goalData[keyVale];//KW·h/t//
arr[6]=arr[4]-item.celec_consume_unit;//KW·h/t
let ind_pre = 0,huanqi = 0,huanqicha=0,tongqi=0,tongqicha=0;
if(n==1){
arr[4] = item.elec_consume_unit; //KW·h/t
let keyVale = "goal_val_" + n;
arr[5] = goalData[keyVale]; //KW·h/t//
arr[6] = arr[4] - item.celec_consume_unit; //KW·h/t
let ind_pre = 0,
huanqi = 0,
huanqicha = 0,
tongqi = 0,
tongqicha = 0;
if (n == 1) {
ind_pre = 12;
huanqi = wrapArr0[ind_pre]?wrapArr0[ind_pre].elec_consume_unit:'/';
}else{
ind_pre=n-1;
huanqi = wrapArr[ind_pre]?wrapArr[ind_pre].elec_consume_unit?wrapArr[ind_pre].elec_consume_unit:'/':'/'
huanqi = wrapArr0[ind_pre]
? wrapArr0[ind_pre].elec_consume_unit
: "/";
} else {
ind_pre = n - 1;
huanqi = wrapArr[ind_pre]
? wrapArr[ind_pre].elec_consume_unit
? wrapArr[ind_pre].elec_consume_unit
: "/"
: "/";
}
arr[7]=huanqi;//KW·h/t
if(huanqi!=='/'){
huanqicha = item.celec_consume_unit-huanqi;
}else{
huanqicha = item.celec_consume_unit
arr[7] = huanqi; //KW·h/t
if (huanqi !== "/") {
huanqicha = item.celec_consume_unit - huanqi;
} else {
huanqicha = item.celec_consume_unit;
}
arr[8]=huanqicha;//KW·h/t
arr[9]=huanqi!='/'? huanqicha/huanqi*100:0;//%
if(wrapArr0[n]){
tongqicha = item.celec_consume_unit-wrapArr0[n].celec_consume_unit;
tongqi = tongqicha/tongqi;
}else{
arr[8] = huanqicha; //KW·h/t
arr[9] =
huanqi != "/" ? (huanqicha / huanqi) * 100 : 0; //%
if (wrapArr0[n]) {
tongqicha =
item.celec_consume_unit -
wrapArr0[n].celec_consume_unit;
tongqi = tongqicha / tongqi;
} else {
tongqicha = item.celec_consume_unit;
tongqi = 0;
}
arr[10]=tongqi;//%
arr[11]=0;//
arr[10] = tongqi; //%
arr[11] = 0; //
wrapArr[ind] = arr;
});
console.log(wrapArr)
that.tableDatas = wrapArr;
}else{
} else {
}
})
})
});
});
},
handleQuery(){
handleQuery() {
this.tableDatas = [];
this.getData();
},
itemClick(type,item){
this.type=type;
itemClick(type, item) {
this.type = type;
this.asynDialog = true;
},
itemClick1(type,item){
itemClick1(type, item) {
this.chartShow = false;
this.$API.bi.dataset.exec
.req('3322567213885833216')
.then((res) => {
this.$API.bi.dataset.exec.req("3322567213885833216").then((res) => {
this.myOption = JSON.parse(res.echart_options);
debugger;
console.log(this.myOption)
console.log(this.myOption);
this.chartShow = true;
});
},
handlePrint() {
this.$PRINT('#myReport');
this.$PRINT("#myReport");
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#myTable', this.tableName)
this.$XLSX("#myTable", this.tableName);
this.exportLoading = false;
},
}
};
},
};
</script>
<style scoped>
.printWrap{
.printWrap {
width: 100%;
overflow-x: scroll;
}
}
</style>

View File

@ -18,20 +18,23 @@
<el-button
type="primary"
@click="exportExcel()"
:loading = "exportLoading"
:loading="exportLoading"
>导出xlsx
</el-button>
<el-button
type="primary"
@click="handlePrint"
>打印
</el-button>
<el-button type="primary" @click="handlePrint">打印 </el-button>
</div>
</el-header>
<el-card style="margin-top:5px">
<el-card style="margin-top: 5px">
<div class="printWrap">
<div ref="print" id="myReport" class="printContainer">
<table border="1" width="1075" cellspacing="0" :key="timeStamp" id="myTable" class="myTable">
<table
border="1"
width="1075"
cellspacing="0"
:key="timeStamp"
id="myTable"
class="myTable"
>
<thead class="myTableHead">
<tr>
<th colspan="8">车间单位产品电耗月度分析表</th>
@ -49,13 +52,25 @@
</thead>
<tbody>
<tr v-for="item in tableDatas" :key="item">
<td v-for="(item1,ind) in item" :key="ind" class="numCell">
<div :class="bindClass(item1,ind)">
<span v-if="item1>0&&ind==3"></span>
<span v-if="item1<0&&ind==3"></span>
<span v-if="item1<0&&ind==5"></span>
<span v-if="item1<0&&ind==5"></span>
{{item1}}
<td
v-for="(item1, ind) in item"
:key="ind"
class="numCell"
>
<div :class="bindClass(item1, ind)">
<span v-if="item1 > 0 && ind == 3"
></span
>
<span v-if="item1 < 0 && ind == 3"
></span
>
<span v-if="item1 < 0 && ind == 5"
></span
>
<span v-if="item1 < 0 && ind == 5"
></span
>
{{ item1 }}
</div>
</td>
</tr>
@ -65,31 +80,35 @@
</div>
</el-card>
</div>
</template>
</template>
<script>
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from 'vue'
export default {
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from "vue";
export default {
components: {
scEcharts,
charts: defineAsyncComponent(() => import("@/components/scEnm/lineChartsdialog.vue")),
charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
},
data() {
return {
exportLoading: false,
chartShow: false,
myOption: null,
query:{
mgroup:'3346491835287007232',
timeStamp: null,
query: {
mgroup: "3346491835287007232",
},
monthGoal:[],
tableDatas:[],
modelValue:true,
type:'hours',
title:'title',
apiObj:'',
showClose:true,
echartType:'line',
asynDialog:false,
monthGoal: [],
tableDatas: [],
modelValue: true,
type: "hours",
title: "title",
apiObj: "",
showClose: true,
echartType: "line",
asynDialog: false,
};
},
mounted() {
@ -97,178 +116,205 @@
var myDate = new Date();
let year = myDate.getFullYear();
that.query.year_s = year;
that.timeStamp = myDate.getTime();
this.$API.mtm.mgroup.list
.req({ page: 0, search: "电石渣" })
.then((res) => {
console.log("电石渣", res);
that.query.mgroup = res[0].id;
//
let paramsGoal = {};
paramsGoal.page=0;
paramsGoal.mgroup=that.query.mgroup;
that.$API.mtm.goal.list.req(paramsGoal).then((ress) => {
if(ress.length>0){
let monthGoal = [];
ress.forEach(goal=>{
if(goal.goal_cate_name=='单位产品分布电耗KW·h/t'){
monthGoal[0]=goal.goal_val;
monthGoal[1]=goal.goal_val_2;
monthGoal[2]=goal.goal_val_3;
monthGoal[3]=goal.goal_val_4;
monthGoal[4]=goal.goal_val_5;
monthGoal[5]=goal.goal_val_6;
monthGoal[6]=goal.goal_val_7;
monthGoal[7]=goal.goal_val_8;
monthGoal[8]=goal.goal_val_9;
monthGoal[9]=goal.goal_val_10;
monthGoal[10]=goal.goal_val_11;
monthGoal[11]=goal.goal_val_12;
monthGoal[12]=goal.goal_val_12;
that.monthGoal = monthGoal;
}
})
this.getData();
}else{
this.getData();
}
})
this.getMonthGoal();
});
},
methods: {
//
getMonthGoal() {
let that = this;
let paramsGoal = {};
paramsGoal.page = 0;
paramsGoal.mgroup = that.query.mgroup;
that.$API.mtm.goal.list.req(paramsGoal).then((ress) => {
if (ress.length > 0) {
let monthGoal = [];
ress.forEach((goal) => {
if (
goal.goal_cate_name == "单位产品分布电耗KW·h/t"
) {
monthGoal[0] = goal.goal_val;
monthGoal[1] = goal.goal_val_2;
monthGoal[2] = goal.goal_val_3;
monthGoal[3] = goal.goal_val_4;
monthGoal[4] = goal.goal_val_5;
monthGoal[5] = goal.goal_val_6;
monthGoal[6] = goal.goal_val_7;
monthGoal[7] = goal.goal_val_8;
monthGoal[8] = goal.goal_val_9;
monthGoal[9] = goal.goal_val_10;
monthGoal[10] = goal.goal_val_11;
monthGoal[11] = goal.goal_val_12;
monthGoal[12] = goal.goal_val_12;
that.monthGoal = monthGoal;
}
});
this.getData();
} else {
this.getData();
}
});
},
// Class
bindClass(item,index){
let classInfo = { redColor: false, greenColor: false }
if(index==3||index==5){
if( typeof(item)=='number'){
if(item>0){
bindClass(item, index) {
let classInfo = { redColor: false, greenColor: false };
if (index == 3 || index == 5) {
if (typeof item == "number") {
if (item > 0) {
classInfo.greenColor = true;
classInfo.redColor = false;
}else if(item<0){
} else if (item < 0) {
classInfo.redColor = true;
classInfo.greenColor = false
classInfo.greenColor = false;
}
}
}
return classInfo
return classInfo;
},
getData(){
getData() {
let that = this;
let query0={};
let query0 = {};
query0.page = 0;
query0.type='month_s';
query0.year_s = that.query.year_s-1;
query0.mgroup=that.query.mgroup;
let wrapArr = [],wrapArr0 = [] ,wrapArrs = [];
query0.type = "month_s";
query0.year_s = that.query.year_s - 1;
query0.mgroup = that.query.mgroup;
let wrapArr = [],
wrapArr0 = [],
wrapArrs = [];
this.$API.enm.enstat.req(query0).then((res0) => {
let data0 = res0;
if(data0.length>0){
data0.forEach(item0 => {
if (data0.length > 0) {
data0.forEach((item0) => {
//
let ind0 = item0.month_s;
wrapArr0[ind0] = item0;
});
}
let query={};
let query = {};
query.page = 0;
query.type='month_s';
query.type = "month_s";
query.year_s = that.query.year_s;
query.mgroup=that.query.mgroup;
query.mgroup = that.query.mgroup;
that.$API.enm.enstat.req(query).then((res) => {
let data = res;
if(data.length>0){
data.forEach(item => {
if (data.length > 0) {
data.forEach((item) => {
//
let ind = item.month_s;
let arr = [];
let time = ''+item.year_s+'.'+item.month_s;
let time = "" + item.year_s + "." + item.month_s;
arr.push(time);
arr.push(item.elec_consume_unit);//KW·h/t
arr[2] = that.monthGoal[ind]!==undefined?that.monthGoal[ind]:'/';
arr.push(item.elec_consume_unit); //KW·h/t
arr[2] =
that.monthGoal[ind] !== undefined
? that.monthGoal[ind]
: "/";
wrapArr[ind] = arr;
});
wrapArr.forEach((item,index)=>{
wrapArr.forEach((item, index) => {
let arrs = [];
arrs[0]=item[0];
arrs[1]=item[1];
arrs[2]=item[2];
arrs[0] = item[0];
arrs[1] = item[1];
arrs[2] = item[2];
//KW·h/t//
//KW·h/t
let diff = 0;
if(item[2]!=='/'){
diff = item[1]-item[2];
}else{
diff = '/';
if (item[2] !== "/") {
diff = item[1] - item[2];
} else {
diff = "/";
}
arrs[3]=diff;
arrs[3] = diff;
//KW·h/t
let lastNum = 0;
if(index>1){
let num = index-1;
if(wrapArr[num]&&wrapArr[num].elec_consume_unit){
if (index > 1) {
let num = index - 1;
if (
wrapArr[num] &&
wrapArr[num].elec_consume_unit
) {
lastNum = wrapArr[num].elec_consume_unit;
}else{
lastNum='/'
} else {
lastNum = "/";
}
}else{
lastNum = wrapArr0[12]?wrapArr0[12].elec_consume_unit:'/';
} else {
lastNum = wrapArr0[12]
? wrapArr0[12].elec_consume_unit
: "/";
}
arrs[4]=lastNum;
arrs[4] = lastNum;
//KW·h/t
let lastDiff = 0;
if(arrs[1]!=='/'&&arrs[4]!=='/'){
lastDiff =arrs[1]- arrs[4];
}else{
lastDiff = '/';
if (arrs[1] !== "/" && arrs[4] !== "/") {
lastDiff = arrs[1] - arrs[4];
} else {
lastDiff = "/";
}
arrs[5]=lastDiff;
arrs[5] = lastDiff;
//%
let lastRate = 0;
if(lastDiff=='/'&&lastNum!=='/'&&lastNum!==0){
lastRate = (lastDiff/lastNum)*100;
}else{
lastRate = '/'
if (
lastDiff == "/" &&
lastNum !== "/" &&
lastNum !== 0
) {
lastRate = (lastDiff / lastNum) * 100;
} else {
lastRate = "/";
}
arrs[6]=lastRate;
arrs[6] = lastRate;
//%-wrapArr0[ind].elec_consume_unit
let sameRate =0;
if(wrapArr0[index]&&wrapArr0[index].elec_consume_unit){
sameRate =((arrs[1]- wrapArr0[index].elec_consume_unit)/wrapArr0[index].elec_consume_unit)*100
}else{
sameRate='/';
let sameRate = 0;
if (
wrapArr0[index] &&
wrapArr0[index].elec_consume_unit
) {
sameRate =
((arrs[1] -
wrapArr0[index].elec_consume_unit) /
wrapArr0[index].elec_consume_unit) *
100;
} else {
sameRate = "/";
}
arrs[7]=sameRate;
arrs[7] = sameRate;
wrapArrs.push(arrs);
})
});
that.tableDatas = wrapArrs;
}else{
} else {
}
})
})
},
itemClick(type,item){
this.type=type;
this.asynDialog = true;
},
itemClick1(type,item){
this.chartShow = false;
this.$API.bi.dataset.exec
.req('3322567213885833216')
.then((res) => {
this.myOption = JSON.parse(res.echart_options);
debugger;
console.log(this.myOption)
this.chartShow = true;
});
});
},
itemClick(type, item) {
this.type = type;
this.asynDialog = true;
},
handleQuery() {
this.getMonthGoal();
},
handlePrint() {
this.$PRINT('#myReport');
this.$PRINT("#myReport");
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#myTable', this.tableName)
this.$XLSX("#myTable", this.tableName);
this.exportLoading = false;
},
}
};
},
};
</script>
<style scoped>
.printWrap{
.printWrap {
width: 100%;
overflow-x: scroll;
}
}
</style>