factory_web/src/views/fac_cal/mpointstat_group.vue

102 lines
3.5 KiB
Vue

<template>
<el-container>
<el-main class="nopadding" style="padding: 10px">
<el-row>
<xtSelect
:apiObj="apiObjM"
:params="paramsM"
style="width: 600px"
v-model = "query.mpoint"
placeholder="选择测点"
>
<el-table-column label="测点名" prop="name"></el-table-column>
<el-table-column label="别名" prop="nickname"></el-table-column>
<el-table-column label="计量物料" prop="material_name"></el-table-column>
</xtSelect>
</el-row>
<div style="height: 6px;"></div>
<el-row style="width: 600px;">
<el-date-picker v-model="timeRange" type="datetimerange"
value-format="YYYY-MM-DD HH:mm:ss" range-separator="至"
start-placeholder="开始时间" end-placeholder="结束时间"
format="YYYY-MM-DD HH"
popper-class="tpc"/>
</el-row>
<div style="height: 6px;"></div>
<el-row>
<el-button type="primary" @click="start" v-loading="bLoading">开始计算</el-button>
</el-row>
<div style="height: 6px;"></div>
<el-row style="width: 600px;">
<el-table
id="hourBaseTable"
:data="tableData"
border
>
<el-table-column label="指标聚合" align="center">
<el-table-column label="指标名称" prop="mpoint__name" min-width="80">
</el-table-column>
<el-table-column label="指标别名" prop="mpoint__nickname" min-width="100">
</el-table-column>
<el-table-column label="计算值" prop="total_val" min-width="100">
</el-table-column>
</el-table-column>
</el-table>
</el-row>
</el-main>
</el-container>
</template>
<script>
export default {
name: 'enstat',
data() {
return {
apiObjM: this.$API.enm.mpoint.list,
paramsM: {page: 0},
timeRange: [],
tableData: [],
bLoading: false,
query:{
mpoint: null,
start_time: null,
end_time: null
}
}
},
methods: {
start() {
let that = this;
this.query.type = "hour";
this.tableData = [];
if (this.query.mpoint == null) {
this.$message.error('请选择测点');
return;
}
if (this.timeRange.length == 0) {
this.$message.error('请选择时间范围');
return;
}
this.query.start_time = this.timeRange[0]
this.query.end_time = this.timeRange[1]
this.bLoading = true;
this.$API.enm.mpointstat.groupValues.req(this.query).then((res)=>{
this.bLoading = false;
this.tableData = res;
}).catch(e=>{
this.bLoading = false;
})
}
}
}
</script>
<style>
.tpc .el-time-spinner__wrapper {
width:100% !important;
}
.tpc .el-scrollbar:nth-of-type(2) {
display: none !important;
}
</style>