增加单井功图诊断模块

src/api/diagramDiagnose.js

@@ -0,0 +1,30 @@
+import request from '../utils/request';
+
+const api={}
+
+api.startDiagnose=(wellId,diagramTime)=>{
+	return request({
+	    url: '/diagnose/standard/startDiagnose',
+	    method: 'post',
+		data:  {wellId,diagramTime}
+	});
+}
+
+api.getDiagnose=(diagramId)=>{
+	return request({
+	    url: '/diagnose/standard/getDiagnoseLog',
+	    method: 'post',
+		data:  {diagramId}
+	});
+}
+
+
+api.saveDiagnose=(diagnose)=>{
+	return request({
+	    url: '/diagnose/standard/saveDiagnoseLog',
+	    method: 'post',
+		data:  diagnose
+	});
+}
+
+export  default api

src/pages/analysis/DiagramDiagnose.vue

@@ -0,0 +1,420 @@
+<template>
+	<div class="qpage">
+		<el-form :inline="true" :model="queryForm" class="query-form-inline"  label-width="auto">
+			<el-form-item label="井名">
+				<div style="width:140px;">{{queryForm.wellName}}</div>
+			</el-form-item>
+			<el-form-item label="时间">
+				<el-date-picker
+				        v-model="queryForm.dataTime"
+				        type="datetimerange"
+						range-separator="至"
+				        start-placeholder="开始时间"
+				        end-placeholder="截止时间"
+				        :unlink-panels="true"
+						value-format="YYYY-MM-DD HH:mm:ss"
+						@change="queryHandle"/>
+			</el-form-item>
+			
+			
+			  
+			<el-form-item>
+				<el-button type="primary"  @click="queryHandle(true)">检索</el-button>
+			</el-form-item>
+		</el-form>
+		<div class="qpage-body">
+			<CrudTable
+			ref="crudTable"
+			page-info-opts="total, prev, pager, next,sizes"
+			url="/diagram/queryByWell"
+			:pageSize="10"
+			:autoLoad="false"
+			@row-dblclick="selectDiagram"
+			style="flex:1;"
+			highlight-current-row
+			>
+			<template #toolMid>
+				<div style="font-size: 14px;">双击数据行选择</div>
+			</template>
+			<template #tabColumns={indexGenerate}>
+				<el-table-column type="index" :index="indexGenerate" label="序号" width="60" align="center" fixed/>
+				<el-table-column prop="gatherTime" label="时间" width="160"  fixed/>
+				<el-table-column prop="diagram"  label="图形" width="500">
+				   <template #default="scope">
+					   <Diagram :id="scope.row.wellParam+scope.row.gatherTime"  :key="scope.row.wellParam+''+scope.row.gatherTime" :width="480" :height="210"  :ctx="{wellId:queryForm.wellId,refTime:scope.row.gatherTime,action:'exact'}"
+					   :data="loadDiagramData"
+					   :intervalSec="0"
+					   />
+				   </template>
+					
+				</el-table-column>  
+			</template>
+			</CrudTable>
+			
+			<el-form :model="formModel" ref="formcomp" label-width="100px"   :show-message="false" @validate="formValidHandler" style="width:600px;box-sizing: border-box;">
+			<div class="diagnose-box">
+				<div class="diagnose-header">
+					<div style="flex:1;font-size: 14px;">功图时间：{{queryForm.diagramTime}}</div>
+					<el-button type="warning" plain @click="startDiagnose"><el-icon><Aim /></el-icon>诊断</el-button>
+					
+					<el-button type="success" plain  @click="saveDiagnose"><el-icon><Select /></el-icon>保存</el-button>
+				</div>
+				
+				<div class="diagnose-body">
+					<!-- 
+						<div class="param-block" style="grid-column:span 2 ">
+							<el-form-item label="功图时间">
+								<el-input-number v-model="formModel.val" :controls="false"/>
+							</el-form-item>
+						</div> -->
+						
+						<div class="param-block" style="grid-column:span 2 ">
+							<el-form-item label="诊断结论" prop="conclusion" :rules="commRule('诊断结论')">
+								<el-input v-model="formModel.conclusion" :controls="false"/>
+							</el-form-item>
+						</div>
+						
+						<div class="param-block">
+							<el-form-item label="弹性系数" prop="elasticCoe" :rules="commRule('弹性系数')">
+								<el-input-number v-model="formModel.elasticCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="充满度" prop="fillCoe" :rules="commRule('充满度')">
+								<el-input-number v-model="formModel.fillCoe" :controls="false"/>
+							</el-form-item>
+							<div class="param-unit">%</div>
+						</div>
+						<div class="param-block">
+							<el-form-item label="漏失系数" prop="leakCoe" :rules="commRule('漏失系数')">
+								<el-input-number v-model="formModel.leakCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="气体影响">
+								<el-input v-model="formModel.gasEffect" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="排出系数" prop="dischargeCoe" :rules="commRule('排出系数')">
+								<el-input-number v-model="formModel.dischargeCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="排出漏失系数">
+								<el-input-number v-model="formModel.dischargeLeakCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="吸入漏失系数">
+								<el-input-number v-model="formModel.inhaleLeakCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="油管漏失系数">
+								<el-input-number v-model="formModel.pipeLeakCoe" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="出砂程度">
+								<el-input-number v-model="formModel.sandDegree" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="结蜡程度">
+								<el-input-number v-model="formModel.waxDegree" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="活塞脱出程度">
+								<el-input-number v-model="formModel.pistonSlipDegree" :controls="false"/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="下行碰泵程度">
+								<el-input-number v-model="formModel.pumpDownBump" :controls="false"/>
+							</el-form-item>
+						</div>
+						
+						
+						
+						<div class="param-block">
+							<el-form-item label="综合泵效">
+								<el-input-number v-model="formModel.comPumpEff" :controls="false" disabled/>
+							</el-form-item>
+						</div>
+						<div class="param-block">
+							<el-form-item label="功图液量">
+								<el-input-number v-model="formModel.liquidYield" :controls="false" disabled/>
+							</el-form-item>
+							<div class="param-unit">m^3/d</div>
+						</div>
+						<div class="param-block">
+							<el-form-item label="功图油量">
+								<el-input-number v-model="formModel.oilYield" :controls="false" disabled/>
+							</el-form-item>
+							<div class="param-unit">m^3/d</div>
+						</div>
+						<div class="param-block">
+							<el-form-item label="功图水量">
+								<el-input-number v-model="formModel.waterYield" :controls="false" disabled/>
+							</el-form-item>
+							<div class="param-unit">m^3/d</div>
+						</div>
+						
+						<div class="param-block" style="grid-column:span 2 ">
+							<el-form-item label="备注" >
+								<el-input v-model="formModel.note"/>
+							</el-form-item>
+						</div>
+				</div>
+			</div>
+			</el-form>
+		</div>
+		
+	</div>
+</template>
+
+<script setup>
+	import {reactive,ref,watch,watchEffect,toRaw,onMounted, nextTick,useAttrs} from 'vue'
+	import {storeToRefs} from 'pinia'
+	import {useHomeStore} from '../../store/home.js'
+	import wellPatrolAPI from '../../api/wellPatrol.js'
+	import diagnoseStandardAPI from '../../api/diagnoseStandard.js'
+	import {ElMessageBox,ElMessage} from 'element-plus'
+	import CrudTable from '../../components/crudtable/CrudTable.vue'
+	import Diagram from '../../components/diagram/Diagram.vue'
+	
+	import diagnoseAPI from "../../api/diagramDiagnose.js"
+	
+	const attrs = useAttrs()
+	
+	const isQuerying = ref(false)
+	
+	const crudTable=ref(null)
+	
+	const queryForm = reactive({
+		wellId: null,
+		wellName: null,
+		dataTime: null,
+		paramCode:'diagram_load',
+		diagramTime:null,
+		diagramId:null
+	})
+	
+	const formModel=reactive({
+		diagramId:null,
+		wellId:null,
+		conclusion :null,
+		elasticCoe :null,  
+		fillCoe :null,  
+		leakCoe :null,  
+		gasEffect :null, 
+		dischargeCoe :null, 
+		dischargeLeakCoe  :null,
+		inhaleLeakCoe :null, 
+		pipeLeakCoe  :null,
+		sandDegree  :null,
+		waxDegree  :null,
+		pistonSlipDegree :null,  
+		pumpDownBump :null, 
+		comPumpEff  :null,
+		liquidYield  :null,
+		oilYield  :null,
+		waterYield  :null,
+		note :null
+	})
+	
+	const queryHandle=(valiTip)=>{
+		
+		
+		let {wellId,paramCode}=queryForm
+		let [startTime,endTime]=queryForm.dataTime||[]
+		
+		if(valiTip && (wellId==null || wellId=='')){
+			
+		}
+		isQuerying.value=true
+		crudTable.value.query({wellId,paramCode,startTime,endTime}).then(resp=>{
+			isQuerying.value=false
+		})
+		
+	}
+	
+	const formcomp=ref(null)
+	
+	const commRule=(tit)=>{
+		return {
+			required:true,
+			message:`${tit}还未填写`,
+			trigger:'blur'
+		}
+	}
+	
+	let formValiding=false  //整体验证
+	
+	const formValidHandler=(prop,isValid,message)=>{
+		if(!isValid && !formValiding){
+			ElMessage.error(message)
+		}
+	}
+	
+	const loadDiagramData=(reqData)=>{
+		reqData.paramCode=queryForm.paramCode
+		reqData.action='exact'
+		return wellPatrolAPI.loadDiagram(reqData)
+	}
+	
+	const selectDiagram=(row, column, event)=>{
+		queryForm.diagramTime=row.gatherTime
+		queryForm.diagramId=row.dataIdStr
+		loadDiagnose(row.dataIdStr)
+	}
+	
+	const loadDiagnose=(diagramId)=>{
+		diagnoseAPI.getDiagnose(diagramId).then(resp=>{
+			if(resp.code==0 && resp.data){
+				Object.assign(formModel,resp.data)
+			}
+		}).catch(err=>{
+			console.log(err)
+		})
+	}
+	
+	const startDiagnose=()=>{
+		if(queryForm.diagramTime==null){
+			ElMessage.error('还未选择功图')
+			return 
+		}
+		diagnoseAPI.startDiagnose(queryForm.wellId,queryForm.diagramTime).then(resp=>{
+			if(resp.code!=0){
+				ElMessage.error(resp.msg || '功图诊断失败')
+				return
+			}
+			
+			Object.assign(formModel,resp.data)
+			
+		}).catch(err=>{
+			ElMessage.error('功图诊断出错')
+			console.log(err)
+		})
+	}
+	
+	const saveDiagnose=()=>{
+		if(queryForm.diagramTime==null){
+			ElMessage.error('还未选择功图')
+			return 
+		}
+		formValiding=true
+		formcomp.value.validate((isValid,invalidObj) => {  //validate会再次逐个form-item验证一次
+			formValiding=false
+			if(!isValid){
+				ElMessage.error('还有数据不符合要求,请先修改再继续')
+				return
+			}
+			let saveData=toRaw(formModel)
+			saveData['wellId']=queryForm.wellId
+			saveData['diagramTime']=queryForm.diagramTime
+			saveData['diagramId']=queryForm.diagramId
+			diagnoseAPI.saveDiagnose(saveData).then(resp=>{
+				if(resp.code!=0){
+					ElMessage.error(resp.msg || '保存数据失败')
+					return
+				}
+				ElMessage.success('保存数据成功')
+				loadDiagnose(queryForm.diagramId)
+			}).catch(err=>{
+				ElMessage.error('保存数据出错')
+				console.log(err)
+			})
+		})
+	}
+	
+	const store = useHomeStore()
+	const {currentTreeNode} = storeToRefs(store)
+	watch(currentTreeNode, (newNode, oldNode) => {
+		if (newNode != null && newNode.nodeType == 'well') {
+			queryForm.wellId = newNode.id
+			queryForm.wellName = newNode.name
+			setTimeout(()=>{queryHandle()},100)
+		}
+	
+	}, {
+		immediate: true
+	})
+</script>
+
+<style scoped>
+	@import url('../../assets/css/qpage.css');
+	
+	.qpage-body{
+		height: calc(100% - 50px);
+		display: flex;
+		flex-flow: row nowrap;
+	}
+	.qpage-body:deep(.el-input-number.is-without-controls .el-input__wrapper){
+		padding:1px 8px;
+	}
+	
+	.diagnose-box{
+		margin-left:2px;
+		width:auto;
+		height:100%;
+		border:1px solid #e3f1f8;
+		display: flex;
+		flex-flow: column nowrap; 
+	}
+	.diagnose-box .diagnose-header{
+		height:50px;
+		background-color: #f0f9ff;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		padding:0px 10px;
+	}
+	
+	.diagnose-box .diagnose-body{
+		flex:1;
+		padding:10px;
+		box-sizing: border-box;
+		display: grid;
+		grid-template-columns: repeat(auto-fill,220px);
+		grid-template-rows: repeat(auto-fill,30px);
+		grid-gap:15px 50px;
+		/* justify-items: center; */
+		justify-content: center;
+	}
+	
+	.param-block{
+		font-size:14px;
+		vertical-align:baseline;
+		display: flex;
+		flex-flow:row nowrap;
+		align-items: center;
+		color:#555;
+		height: 32px;
+		box-sizing: border-box;
+	}
+	.param-block  .param-unit{
+		background-color: #f2f2f2;
+		padding:8px 0px;
+		border:1px solid #e4e4e4;
+		border-left:0px;
+		font-size: 12px;
+		height: 100%;
+		width:46px;
+		box-sizing: border-box;
+		text-align: center;
+		border-top-right-radius: 3px;
+		border-bottom-right-radius: 3px;
+	}
+	
+	.param-block:deep(.el-form-item){
+		margin-bottom: 0px;
+		flex:1;
+	}
+	.param-block:deep(.el-input-number){
+		flex:1;
+		width:auto;
+	}
+</style>

src/pages/analysis/DiagramMeasure.vue

@@ -35,7 +35,7 @@
 				  <el-table-column prop="liquidYield" label="产液量(m^3/d)" width="120" />
 				  <el-table-column prop="oilYield" label="产油量(m^3/d)" width="120" />
 				  <el-table-column prop="waterYield" label="产水量(m^3/d)" width="120" />
-				 
+				  <el-table-column prop="note" label="备注" width="240" />
 				 
 			  </template>