增加计量单位管理模块

src/api/unitMgr.js

@@ -0,0 +1,29 @@
+import request from '../utils/request';
+
+const api={}
+
+//查询接口由表格组件自带
+
+api.save = (data) => {
+		let url='/base/unit/add'
+		if(data.unitId){
+			url='/base/unit/update'
+		}
+	    return request({
+	        url: url,
+	        method: 'post',
+			data:  data
+	    });
+}
+
+api.del = (data) => {
+	    return request({
+	        url: '/base/unit/delete',
+	        method: 'post',
+			params:  data
+	    });
+}
+
+
+
+export  default api

src/components/Sidetree.vue

@@ -37,7 +37,7 @@
 					    </template>
 				</el-tree>
 				
-				<el-tree :data="customWells" :props="defNodeProps" :highlight-current="true" class="tree" v-show="!systreeShow">
+				<!-- <el-tree :data="customWells" :props="defNodeProps" :highlight-current="true" class="tree" v-show="!systreeShow">
 					    <template #default="{ node, data }">
 					        <span class="custom-tree-node">
 							  <template v-if="node.isLeaf">
@@ -48,7 +48,7 @@
 					          
 					        </span>
 					    </template>
-				</el-tree>
+				</el-tree> -->
 			</el-scrollbar>
 		</div>
 

src/pages/base/UnitMgr.vue

@@ -0,0 +1,161 @@
+<template>
+	<div class="qpage">
+		<el-form :inline="true" :model="queryForm" class="query-form-inline"  label-width="auto">
+		  <el-form-item label=" ">
+		    <el-input v-model="queryForm.unitKey" placeholder="请输入单位名/符号" clearable class="edit-form-item"/>
+		  </el-form-item>
+		  
+		  <el-form-item>
+		    <el-button type="primary" :loading="isQuerying" @click="queryHandle">检索</el-button>
+		  </el-form-item>
+		</el-form>
+		
+		<div class="qpage-body">
+			<CrudTable 
+			ref="crudTable"
+			page-info-opts="total, prev, pager, next,sizes"
+			url="/base/unit/query"
+			:pageSize="20"
+			>
+			  <template #toolGroup>
+				  <el-button type="primary" icon="plus" @click="openEditHandle()">新增</el-button>
+				 
+			  </template>
+			  <template #tabColumns={indexGenerate}>
+				  <el-table-column type="index" :index="indexGenerate" label="序号" width="60" align="center"/>
+				  <el-table-column prop="unitSymbol" label="单位" width="120" />
+				  <el-table-column prop="unitName" label="名称" width="160" />
+				  <el-table-column prop="baseUnit" label="基准单位" width="160" />
+				  <el-table-column prop="baseScale" label="比例" width="160" />
+				  <el-table-column prop="unitGroup" label="分组" width="160" />
+				  <el-table-column prop="oper" label="操作" width="160" fixed="right">
+				  					<template #default="scope">
+				  						<div class="tool-column">
+				  							<el-button type="primary" icon="edit" size="small" @click="openEditHandle(scope.row)">编辑</el-button>
+				  							
+				  							<el-button type="warning" icon="delete" size="small" @click="delHandle(scope.row)">删除</el-button>
+				  						</div>
+				  					    
+				  					</template>
+				  </el-table-column>
+			  </template>
+				
+			</CrudTable>
+		</div>
+		
+		
+		<el-dialog v-model="editDialogShow" title="数据编辑" :close-on-click-modal="false"
+		:destroy-on-close="true"
+		>
+			<UnitMgrEdit ref="editWin" :record="crtEditRecord"/>
+			<template #footer>
+			    <span class="dialog-footer">
+			        <el-button @click="beforeCloseHandle('cancel')">取消</el-button>
+			        <el-button type="primary" @click="beforeCloseHandle('sure')">
+			         确定
+			        </el-button>
+			    </span>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script setup>
+	import {reactive,ref} from 'vue'
+	import CrudTable from "../../components/crudtable/CrudTable.vue"
+	import UnitMgrEdit from "./UnitMgrEdit.vue"
+	import unitMgrAPI from "../../api/unitMgr.js"
+	import {ElMessageBox,ElMessage} from 'element-plus'
+	
+	const crudTable=ref(null)
+	
+	const isQuerying=ref(false)
+	
+	const editDialogShow=ref(false)
+	
+	const crtEditRecord=ref(null)
+	
+	const queryForm = reactive({
+	  unitKey: ''
+	})
+	
+	const queryHandle=()=>{
+		isQuerying.value=true
+		crudTable.value.query(queryForm).then(resp=>{
+			isQuerying.value=false
+		})
+		
+	}
+	
+	
+	
+	const delHandle=(record)=>{
+		ElMessageBox.confirm(
+			'确定要删除该记录吗?',
+			'操作确认',
+			{
+				confirmButtonText:'确定',
+				cancelButtonText:'取消',
+				type: 'warning'
+			}
+		).then(()=>{
+			unitMgrAPI.del({unitId:record.unitId}).then(resp=>{
+				if(resp.code!=0){
+					ElMessage.error(resp.msg)
+					return
+				}
+				ElMessage.success('操作成功')
+				queryHandle()
+				
+			}).catch(err=>{
+				ElMessage.error(err||'操作失败')
+			})
+		}).catch(()=>{
+			console.log('cancel del')
+		})
+	}
+	
+	const editWin=ref(null)
+	
+	const openEditHandle=(record)=>{
+		editDialogShow.value=true
+		crtEditRecord.value=record
+	}
+	
+	const beforeCloseHandle=async (tag)=>{
+		if(tag==='cancel'){
+			editDialogShow.value=false
+		}
+		else{
+			/* editWin.value.submitForm().then(()=>{
+				editDialogShow.value=false
+				queryHandle()
+			}) */
+			try{
+				await editWin.value.submitForm()
+				editDialogShow.value=false
+				queryHandle()
+			}
+			catch(err){
+				console.log(err)
+			}
+			
+		}
+	}
+	
+	
+	
+	
+	
+	
+	
+	
+</script>
+
+<style scoped>
+	@import url('../../assets/css/qpage.css');
+	
+	.edit-form-item{
+		width:260px;
+	}
+</style>

src/pages/base/UnitMgrEdit.vue

@@ -0,0 +1,132 @@
+<template>
+	<div class="edit-page">
+		<el-form :model="formModel" ref="formcomp"  label-position="top" label-width="auto" :inline="false" :rules="rules" :inline-message="false">
+		    <el-row :gutter="50">
+				<el-col :sm="24" :md="12">
+					<el-form-item label="单位名">
+					  <el-input v-model="formModel.unitName" autocomplete="off" placeholder="请输入单位名"  clearable/>
+					</el-form-item>
+				</el-col>
+				
+				<el-col :sm="24" :md="12">
+					<el-form-item label="单位符号" prop="unitSymbol">
+					  <el-input v-model="formModel.unitSymbol" autocomplete="off" placeholder="请输入单位符号"  clearable/>
+					</el-form-item>
+				</el-col>
+				
+				<el-col :sm="24" :md="12">
+					<el-form-item label="基准单位" prop="baseUnit">
+					  <el-input v-model="formModel.baseUnit" autocomplete="off" placeholder="请输入基准单位"  clearable/>
+					</el-form-item>
+				</el-col>
+				
+				<el-col :sm="24" :md="12">
+					<el-form-item label="比例" prop="baseScale">
+					  <el-input-number v-model="formModel.baseScale" autocomplete="off" placeholder="请输入比例" :precision="3" :controls="false" clearable style="width:100%"/>
+					</el-form-item>
+				</el-col>
+				
+				<el-col :sm="24" :md="12">
+					<el-form-item label="分组">
+					  <el-input v-model="formModel.unitGroup" autocomplete="off" placeholder="请输入分组" clearable/>
+					</el-form-item>
+				</el-col>
+				
+				
+				
+				
+			</el-row>  
+			
+		</el-form>
+	</div>
+</template>
+
+<script setup>
+	import {reactive,ref,toRaw,onMounted} from 'vue'
+	import unitMgrAPI from "../../api/unitMgr.js"
+	import {ElMessageBox,ElMessage} from 'element-plus'
+	
+	const formModel = reactive({
+	  unitId:null,
+	  unitName: null,
+	  unitSymbol:null,
+	  baseUnit:null,
+	  baseScale:null,
+	  unitGroup:null
+	  
+	  
+	})
+	
+	const props=defineProps({
+		record:Object
+	})
+	
+	const formcomp = ref(null);
+	
+	const rules =reactive({
+		unitSymbol:[
+			{required:true,message:'单位符号还未填写',trigger:'blur'},
+			{ min: 1, max: 30, message: '单位符号长度应该为1-30', trigger: 'blur' }
+			],
+		baseUnit:[
+			{required:true,message:'基准单位还未填写',trigger:'blur'},
+			{ min: 1, max: 30, message: '基准单位长度应该为1-30', trigger: 'blur' }
+			],
+		baseScale:[
+			{required:true,message:'比例还未填写',trigger:'blur'}
+			]
+	})
+	
+	onMounted(()=>{
+		//console.log(props.record)
+		if(props.record){
+			let {unitId,unitName,unitSymbol,baseUnit,baseScale,unitGroup}=props.record
+			Object.assign(formModel,{unitId,unitName,unitSymbol,baseUnit,baseScale,unitGroup})
+		}
+	})
+	
+	
+	
+	const submitForm=async ()=>{
+		let validateRst=false
+		try{
+			validateRst = await formcomp.value.validate()
+		}
+		catch(err){
+			ElMessage.error("请按要求填写数据");
+			return Promise.reject('invalidate')
+		}
+		
+		if(validateRst){  //验证通过，准备提交数据
+		  try{
+			   let resp =await unitMgrAPI.save(toRaw(formModel))
+			   if(resp.code!=0){
+			   	ElMessage.error(resp.msg)
+			   	return Promise.reject(resp.msg)
+			   }
+			   ElMessage.success('操作成功')
+			   return Promise.resolve('ok')
+			}
+			catch (e) {
+				ElMessage.error(e||'操作失败')
+				return Promise.reject('操作失败')
+			}
+		}
+		
+		
+		
+	}
+	
+	defineExpose({
+		submitForm
+	})
+</script>
+
+<style scoped>
+	
+	
+	.el-col{
+		height:85px;
+	}
+	
+</style>