102 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			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> |