factory_web/src/views/enm_energy/energyFactory.vue

194 lines
7.1 KiB
Vue

<template>
<el-container>
<el-header>
<div class="left-panel">
<el-select
v-model="query.type"
placeholder="查询类型"
clearable
class="headerSearch"
@change="typeCange"
>
<el-option
v-for="item in options"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
<el-date-picker
v-model="query.searchDay"
type="date"
value-format="YYYY-MM-DD"
format="YYYY-MM-DD"
placeholder="查询日期"
v-if="query.type==0"
class="headerSearch"
/>
<el-date-picker
v-model="query.searchMonth"
type="month"
value-format="YYYY-MM"
format="YYYY-MM"
placeholder="查询月份"
v-if="query.type==1"
class="headerSearch"
/>
<el-date-picker
v-model="query.searchYear"
type="year"
value-format="YYYY"
format="YYYY"
placeholder="查询年份"
v-if="query.type==2"
class="headerSearch"
/>
<el-button
type="primary"
icon="el-icon-search"
@click="getTableData"
></el-button>
<el-button
type="primary"
@click="exportExcel()"
:loading = "exportLoading"
v-auth="'export_excel'"
>导出xlsx
</el-button>
<el-button
type="primary"
@click="handlePrint"
>打印
</el-button>
</div>
</el-header>
<el-main>
<el-card shadow="never" style="width: 100%;height: 100%;">
<div ref="print" id="myReport" class="printContainer">
<el-table
id="hourBaseTable"
:data="tableDatas"
border
>
<el-table-column label="能源监察报表" align="center">
<el-table-column label="序号" prop="index" width="60">
</el-table-column>
<el-table-column label="指标名称" prop="name" min-width="100">
</el-table-column>
<el-table-column label="能耗" prop="value" min-width="80">
</el-table-column>
<el-table-column label="备注" prop="note" min-width="60">
</el-table-column>
</el-table-column>
</el-table>
</div>
</el-card>
</el-main>
</el-container>
</template>
<script>
export default {
data() {
return {
query:{
type:0,
year:'',
month:'',
yearStart:'',
},
currentDay:'',
tableName:'能源监察日报表',
options:[
{id:0,name:'日统计'},
{id:1,name:'月统计'},
{id:2,name:'年统计'},
],
tableDatas:[
{index:1,name:'水泥单位产品综合能耗(kgce/t)',value:0,note:''},
{index:2,name:'熟料单位产品综合能耗(kgce/t)',value:0,note:''},
{index:3,name:'熟料单位产品综合电耗(kw.h/t)',value:0,note:''},
{index:4,name:'熟料单位产品综合煤耗(kgce/t)',value:0,note:''},
{index:5,name:'水泥单位产品综合能耗(kgce/t)',value:0,note:''},
],
};
},
mounted() {
var myDate = new Date();
this.query.searchDay =this.currentDay = this.$TOOL.dateFormat2(myDate);
this.getData();
},
methods: {
typeCange(value){
if(value==1){
this.tableName = '能源监察日报表'
}else if(value==1){
this.tableName = '能源监察月报表'
}else{
this.tableName = '能源监察年报表'
}
},
getData(){
let that = this;
let arr = [],type='',year_s = 2024,month_s = 1,day_s = 1;
if(that.query.type==0){//日
type='day_s';
arr = that.query.searchDay.split('-');
year_s = Number(arr[0]);
month_s = Number(arr[1]);
day_s = Number(arr[2]);
}else if(that.query.type==1){//月
type='month_s';
arr = that.query.searchMonth.split('-');
year_s = Number(arr[0]);
month_s = Number(arr[1]);
}else if (that.query.type==2){
type='year_s';
year_s = Number(that.query.searchYear);
}
let params1 = {
page:0,
type:type,
year_s:year_s,
month_s:month_s,
day_s:day_s,
mgroup__name:'水泥磨'
}
that.$API.enm.enstat.req(params1).then((res) => {
console.log(res[0]);
that.tableDatas[0].value = res[0].cen_consume_unit;
that.tableDatas[4].value = res[0].cen_consume_unit;
});
let params2 = {
page:0,
type:type,
year_s:year_s,
month_s:month_s,
day_s:day_s,
mgroup__name:'回转窑'
}
that.$API.enm.enstat.req(params2).then((res2) => {
that.tableDatas[1].value = res2[0].cen_consume_unit;
that.tableDatas[2].value = res2[0].celec_consume_unit;
that.tableDatas[3].value = res2[0].coal_consume_unit;
console.log(res2[0]);
});
},
getTableData(){
this.getData();
},
handlePrint() {
this.$PRINT('#myReport');
},
exportExcel() {
this.exportLoading = true;
this.$XLSX('#hourBaseTable', this.tableName)
this.exportLoading = false;
},
}
};
</script>
<style>
</style>