From f60473bc01862ba1e289e7764f9478b9675e9c68 Mon Sep 17 00:00:00 2001
From: shj <1790240199@qq.com>
Date: 星期五, 05 八月 2022 09:23:56 +0800
Subject: [PATCH] 对接

---
 src/views/goalManagement/performanceAppraisal/component/DailogAq.vue |  190 ++++++++++++++++++++++++++++-------------------
 1 files changed, 113 insertions(+), 77 deletions(-)

diff --git a/src/views/goalManagement/performanceAppraisal/component/DailogAq.vue b/src/views/goalManagement/performanceAppraisal/component/DailogAq.vue
index fdc54be..d7f272c 100644
--- a/src/views/goalManagement/performanceAppraisal/component/DailogAq.vue
+++ b/src/views/goalManagement/performanceAppraisal/component/DailogAq.vue
@@ -1,40 +1,48 @@
 <template>
-	<el-dialog v-model="dialogVisible" :fullscreen="full" :title="titles" width="50%" draggable>
+	<el-dialog v-model="dialogVisible" :fullscreen="full" @close="handleClose(ruleFormRef)" :title="titles" width="50%" draggable>
 		<el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
-		<el-form :model="form" label-width="120px">
+		<el-form :model="form" label-width="120px" ref="ruleFormRef" :rules="rules">
 			<el-row>
 				<el-col :span="11">
-					<el-form-item label="考核标题" size="default">
-						<el-input v-model="form.title"></el-input>
+					<el-form-item label="考核标题" size="default" prop="title">
+						<el-input v-model="form.title" placeholder="请填写考核标题"></el-input>
 					</el-form-item>
 				</el-col>
 				<el-col :span="11" :offset="2">
-					<el-form-item label="考核日期" size="default">
+					<el-form-item label="考核日期" size="default" prop="examineDate">
 						<el-date-picker v-model="form.examineDate" format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="请选择" style="width: 100%" />
 					</el-form-item>
 				</el-col>
 			</el-row>
 			<el-row>
 				<el-col :span="11">
-					<el-form-item  label="合格分数" size="default">
-						<el-input v-model="form.name" disabled />
+					<el-form-item label="合格分数" size="default" prop="acceptanceNumber">
+						<el-input v-model="form.acceptanceNumber" disabled />
 					</el-form-item>
 				</el-col>
 				<el-col :span="11" :offset="2">
-					<el-form-item label="总分" size="default">
-						<el-input v-model="form.examineTotalNumber" />
+					<el-form-item label="总分" size="default" prop="examineTotalNumber">
+						<el-input v-model="form.examineTotalNumber" disabled />
 					</el-form-item>
 				</el-col>
 			</el-row>
 			<el-row>
 				<el-col :span="11">
-					<el-form-item label="考核部门" size="default">
-						<el-tree-select v-model="form.examineDepartmentId" :data="data" class="w100" :props="propse" placeholder="请选择" />
+					<el-form-item label="考核部门" size="default" prop="examineDepartmentId">
+						<el-tree-select
+							v-model="form.examineDepartmentId"
+							:data="data"
+							class="w100"
+							@node-click="nameData1"
+							:props="propse"
+							check-strictly
+							placeholder="请选择"
+						/>
 					</el-form-item>
 				</el-col>
 				<el-col :span="11" :offset="2">
-					<el-form-item label="考核人" size="default">
-						<el-input v-model="form.examinePersonId">
+					<el-form-item label="考核人" size="default" prop="examinePersonName">
+						<el-input v-model="form.examinePersonName">
 							<template #append> <el-button :icon="Search" @click="daiInpt(1)" /></template>
 						</el-input>
 					</el-form-item>
@@ -42,13 +50,21 @@
 			</el-row>
 			<el-row>
 				<el-col :span="11">
-					<el-form-item label="被考核部门" size="default">
-							<el-tree-select v-model="form.beExaminedDepartmentId" :data="data" class="w100" :props="propse" placeholder="请选择" />
+					<el-form-item label="被考核部门" size="default" prop="beExaminedDepartmentId">
+						<el-tree-select
+							v-model="form.beExaminedDepartmentId"
+							:data="data"
+							@node-click="nameData2"
+							class="w100"
+							:props="propse"
+							check-strictly
+							placeholder="请选择"
+						/>
 					</el-form-item>
 				</el-col>
 				<el-col :span="11" :offset="2">
-					<el-form-item label="被考核人" size="default">
-						<el-input v-model="form.beExaminedPersonId">
+					<el-form-item label="被考核人" size="default" prop="beExaminedPersonName">
+						<el-input v-model="form.beExaminedPersonName">
 							<template #append> <el-button :icon="Search" @click="daiInpt(2)" /></template>
 						</el-input>
 					</el-form-item>
@@ -78,14 +94,14 @@
 			</el-row>
 			<el-row>
 				<el-col :span="11">
-					<el-form-item label="考核模板"  size="default">
-						<el-input disabled v-model="form.examineTemplateId">
+					<el-form-item label="考核模板" size="default" prop="examineTemplateName">
+						<el-input disabled v-model="form.examineTemplateName">
 							<template #append> <el-button :icon="Search" @click="daiAdd" /></template>
 						</el-input>
 					</el-form-item>
 				</el-col>
 				<el-col :span="11" :offset="2">
-					<el-form-item label="备注信息">
+					<el-form-item label="备注信息" prop="memo">
 						<el-input v-model="form.memo" type="textarea"> </el-input>
 					</el-form-item>
 				</el-col>
@@ -110,8 +126,8 @@
 		</el-table>
 		<template #footer>
 			<span class="dialog-footer">
-				<el-button @click="resetForm" size="default">关闭</el-button>
-				<el-button type="primary" @click="submitForm" size="default">确定</el-button>
+				<el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button>
+				<el-button type="primary" @click="submitForm(ruleFormRef)" size="default">确定</el-button>
 			</span>
 		</template>
 	</el-dialog>
@@ -126,17 +142,24 @@
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { goalManagementApi } from '/@/api/goalManagement';
 import type { UploadProps, UploadUserFile } from 'element-plus';
+import type { FormInstance, FormRules } from 'element-plus';
 export default defineComponent({
 	components: { DailogSearchUser, DailogSearch },
 	setup(props, { emit }) {
 		const dialogVisible = ref<boolean>(false);
+		const ruleFormRef = ref<FormInstance>();
 		const form = ref({
 			beExaminedDepartmentId: '', ////被考核部门ID/外键
+			beExaminedDepartmentName: '',
 			beExaminedPersonId: '', ////被考核人ID/外键(可能有多个,用逗号隔开)
+			beExaminedPersonName: '',
 			examineDate: '', ////考核日期
 			examineDepartmentId: '', ////考核部门ID/外键
+			examineDepartmentName: '',
 			examinePersonId: '', ////考核人ID/外键
+			examinePersonName: '',
 			examineTemplateId: 1, ////绩效考核模板ID/外键
+			examineTemplateName: '',
 			examineTotalNumber: '', ////总分
 			extraFile: '9', //责任书附件
 			itemDetail: '', ////考核项目
@@ -148,7 +171,7 @@
 		const disabled = ref(false);
 		// 打开弹窗
 		const openDailog = (title: string, value: any, id: number) => {
-			department()
+			department();
 			dialogVisible.value = true;
 			titles.value = `${title}安全考核管理`;
 			disabled.value = title == '查看' ? true : false;
@@ -163,55 +186,54 @@
 						}
 					});
 		};
+		// 验证
+		const rules = reactive<FormRules>({
+			title: [{ required: true, message: '考核标题不能为空', trigger: 'blur' }],
+			examineDate: [{ required: true, message: '考核日期不能为空', trigger: 'blur' }],
+			examineDepartmentId: [{ required: true, message: '考核部门不能为空', trigger: 'blur' }],
+			examinePersonName: [],
+			examinePersonId: [],
+			beExaminedDepartmentId: [{ required: true, message: '被考核部门不能为空', trigger: 'blur' }],
+			beExaminedPersonName: [],
+			beExaminedPersonId: [],
+			examineTemplateId: [],
+			examineTemplateName: [{ required: true, message: '考核模板不能为空', trigger: 'blur' }],
+			memo: [],
+		});
 		// 提交
-		const submitForm = () => {
-			dialogVisible.value = false;
-			goalManagementApi()
-				.getexamineMngAddOrUpdate(form.value)
-				.then((res) => {
-					if (res.data.code == 200) {
-						ElMessage({
-							message: res.data.msg,
-							type: 'success',
+		const submitForm = async (formEl: FormInstance | undefined) => {
+			if (!formEl) return;
+			await formEl.validate((valid, fields) => {
+				if (valid) {
+					dialogVisible.value = false;
+					goalManagementApi()
+						.getexamineMngAddOrUpdate(form.value)
+						.then((res) => {
+							if (res.data.code == 200) {
+								ElMessage({
+									message: res.data.msg,
+									type: 'success',
+								});
+								emit('navAddorUpdata');
+							} else {
+								ElMessage.error(res.data.msg);
+							}
 						});
-						emit('navAddorUpdata');
-					} else {
-						ElMessage.error(res.data.msg);
-					}
-				});
-			form.value = {
-				beExaminedDepartmentId: '', ////被考核部门ID/外键
-				beExaminedPersonId: '', ////被考核人ID/外键(可能有多个,用逗号隔开)
-				examineDate: '', ////考核日期
-				examineDepartmentId: '', ////考核部门ID/外键
-				examinePersonId: '', ////考核人ID/外键
-				examineTemplateId: '', ////绩效考核模板ID/外键
-				examineTotalNumber: '', ////总分
-				extraFile: '9', //责任书附件
-				itemDetail: '', ////考核项目
-				memo: '', ////备注信息
-				numberDetailJson: '[{"id":"123","number":"123"}]', ////各个考核项目的具体得分,json格式。形式为:[{“id”:"123","number":"123"}]
-				title: '', ////考核标题
-			};
+				} else {
+					console.log('error submit!', fields);
+				}
+			});
 		};
 		//   取消
-		const resetForm = () => {
+		const resetForm = (formEl: FormInstance | undefined) => {
+			if (!formEl) return;
 			dialogVisible.value = false;
-			form.value = {
-				beExaminedDepartmentId: '', ////被考核部门ID/外键
-				beExaminedPersonId: '', ////被考核人ID/外键(可能有多个,用逗号隔开)
-				examineDate: '', ////考核日期
-				examineDepartmentId: '', ////考核部门ID/外键
-				examinePersonId: '', ////考核人ID/外键
-				examineTemplateId: '', ////绩效考核模板ID/外键
-				examineTotalNumber: '', ////总分
-				extraFile: '9', //责任书附件
-				itemDetail: '', ////考核项目
-				memo: '', ////备注信息
-				numberDetailJson: '[{"id":"123","number":"123"}]', ////各个考核项目的具体得分,json格式。形式为:[{“id”:"123","number":"123"}]
-				title: '', ////考核标题
-			};
+			formEl.resetFields();
 		};
+		const handleClose=(formEl: FormInstance | undefined)=>{
+			if (!formEl) return;
+			formEl.resetFields();
+		}
 		const activeName = ref('1');
 		// 新增弹窗
 		const Show = ref();
@@ -220,7 +242,7 @@
 		};
 		// 安全目标指标弹窗
 		const Shows = ref();
-		const daiInpt = (type:any) => {
+		const daiInpt = (type: any) => {
 			Shows.value.openDailog(type);
 		};
 		// 点击上传
@@ -253,13 +275,15 @@
 				() => false
 			);
 		};
-		const userId=(val:any,type:any)=>{
-      if(type==1){
-		form.value.examinePersonId=val.uid
-	  }else if(type==2){
-		form.value.beExaminedPersonId=val.uid
-	  }
-		}
+		const userId = (val: any, type: any) => {
+			if (type == 1) {
+				form.value.examinePersonId = val.uid;
+				form.value.examinePersonName = val.realName;
+			} else if (type == 2) {
+				form.value.beExaminedPersonId = val.uid;
+				form.value.beExaminedPersonName = val.realName;
+			}
+		};
 		//全屏
 		const full = ref(false);
 		const toggleFullscreen = () => {
@@ -269,7 +293,7 @@
 				full.value = false;
 			}
 		};
-			//部门
+		//部门
 		const department = () => {
 			goalManagementApi()
 				.getTreedepartment()
@@ -284,10 +308,22 @@
 		const propse = {
 			label: 'depName',
 			children: 'children',
-			value:"depId"
+			value: 'depId',
 		};
-		const data=ref()
+		const data = ref();
+		const nameData1 = (val: any) => {
+			form.value.examineDepartmentName = val.depName;
+		};
+		const nameData2 = (val: any) => {
+			form.value.beExaminedDepartmentName = val.depName;
+			console.log(form.value);
+		};
 		return {
+			rules,
+			handleClose,
+			nameData1,
+			nameData2,
+			ruleFormRef,
 			department,
 			propse,
 			data,

--
Gitblit v1.9.2