增加单参数历史数据查询功能

src/pages/single/ParamHisData.vue

@@ -0,0 +1,89 @@
+<template>
+	<div class="page-container">
+		<CrudTable
+		ref="crudTable"
+		page-info-opts="total, prev, pager, next,sizes"
+		url="/paramdata/queryHisData"
+		:pageSize="20"
+		:initWhere="{wellId:$attrs['ctxObj']['wellId'],paramCode:$attrs['ctxObj']['paramCode']}"
+		>
+		  <template #toolMid>
+			  <el-form :inline="true" :model="queryForm" class="query-form-inline">
+			     <el-form-item label="">
+			       <el-date-picker
+			               v-model="queryForm.dataTime"
+			               type="daterange"
+			               start-placeholder="开始时间"
+			               end-placeholder="截止时间"
+			               :unlink-panels="true"
+			       		   value-format="YYYY-MM-DD"
+						   style="width:220px"
+			             />
+			     </el-form-item>
+			     
+			     <el-form-item>
+			       <el-button type="primary" :loading="isQuerying" @click="queryHandle">检索</el-button>
+				  </el-form-item>
+				 
+			  </el-form>
+			  
+		  </template>
+		  <template #tabColumns={indexGenerate}>
+		  		<el-table-column fixed type="index" :index="indexGenerate" label="序号" width="60" align="center"/>
+		  		<el-table-column prop="gatherTime" label="采集时间" width="180" />
+		  		<el-table-column prop="dispDataVal" :label="paramClmLab" width="100" />
+				<el-table-column prop="alarmDesc" label="报警" width="300" />		
+		  </template>
+		</CrudTable>
+	</div>
+</template>
+
+<script setup>
+	import {reactive,ref,toRaw,onMounted,useAttrs} from 'vue'
+	import {ElMessageBox,ElMessage} from 'element-plus'
+	import CrudTable from '../../components/crudtable/CrudTable.vue'
+	import wellParamAPI from '../../api/wellParam.js'
+	
+	
+	const attrs = useAttrs();
+	
+	const paramClmLab=ref('数值')
+	
+	const isQuerying=ref(false)
+	
+	const crudTable=ref(null)
+	
+	const queryForm = reactive({
+	  paramName: '',
+	  dataTime:null
+	})
+	
+	const queryHandle=()=>{
+		isQuerying.value=true
+		let formdata=toRaw(queryForm)
+		formdata['startDate']=formdata.dataTime?formdata.dataTime[0]:null
+		formdata['endDate']=formdata.dataTime?(formdata.dataTime[1]+' 23:59:59'):null
+		crudTable.value.query(formdata).then(resp=>{
+			isQuerying.value=false
+		})
+	}
+	
+	const dialogH=(document.body.clientHeight-350)+'px'
+	
+	onMounted(()=>{
+		wellParamAPI.getByWellAndParam(attrs['ctxObj']['wellId'],attrs['ctxObj']['paramCode']).then(resp=>{
+			if(resp.code==0&&resp.data){
+				paramClmLab.value=`${resp.data.paramName}(${resp.data.displayUnit||''})`
+			}
+		}).catch(err=>{
+			
+		})
+	})
+</script>
+
+<style scoped>
+	.page-container{
+		height:v-bind(dialogH);
+		min-height:300px;
+	}
+</style>