From 319d90b99daacb15736d3a2d56953d7ad6e9b436 Mon Sep 17 00:00:00 2001
From: kun <1422840143@qq.com>
Date: Wed, 29 May 2024 14:45:46 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20BUG=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ProjectSupervision/duty copy.vue          | 113 +++++++++
 .../components/ProjectSupervision/duty.scss   |   7 +
 .../components/ProjectSupervision/duty.ts     | 137 +++++++----
 .../components/ProjectSupervision/duty.vue    |  78 +++---
 .../ProjectSupervision/dutyForm copy.vue      | 189 +++++++++++++++
 .../ProjectSupervision/dutyForm.scss          |   7 +-
 .../ProjectSupervision/dutyForm.vue           | 225 +++++++++---------
 7 files changed, 571 insertions(+), 185 deletions(-)
 create mode 100644 src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty copy.vue
 create mode 100644 src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm copy.vue

diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty copy.vue b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty copy.vue
new file mode 100644
index 0000000..4d749b8
--- /dev/null
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty copy.vue	
@@ -0,0 +1,113 @@
+<template>
+	<div class="duty">
+		<el-steps class="steps" :active="active" align-center>
+			<el-step
+				style="cursor: pointer"
+				v-for="(item, i) in stepOptions"
+				:key="item.dictCode"
+				:title="item.dictValue?.slice(0, 2)"
+				@click="active = i"
+			/>
+		</el-steps>
+
+		<duty-form :form-config="formConfig" />
+
+		<footer class="footer">
+			<el-button class="btnStyle" :type="isAllowNext ? 'primary' : 'default'" @click="handleToPrevOrNext">{{
+				isAllowNext ? "下一步" : "上一步"
+			}}</el-button>
+		</footer>
+	</div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive, watch, computed, onMounted, onUnmounted } from "vue";
+import dutyForm from "./dutyForm.vue";
+import { formData, datas, rules, reset } from "./duty";
+import { getDicList } from "@/api/modules/jxjview";
+import type { ResDictData } from "@/api/types";
+import type { EngineeringMainList } from "./duty";
+import type { Type } from "./overview";
+import { GlobalStore } from "@/stores";
+import { ElMessage } from "element-plus";
+const store = GlobalStore();
+
+const emit = defineEmits<{
+	(e: "next", data: { engineeringMains: EngineeringMainList }): void;
+	(e: "prev", data: void): void;
+}>();
+
+const active = ref(0),
+	stepOptions = ref<ResDictData["result"]>([]);
+
+const formConfig = reactive({
+	formData: formData.value[active.value],
+	datas,
+	rules
+});
+
+const isAllowNext = computed(() => active.value >= stepOptions.value.length - 1);
+
+const handleToPrevOrNext = () => {
+	if (isAllowNext.value) {
+		console.log(formData.value, 777888);
+		const isInValid = formData.value.find((item: any) => {
+			// return !item.enterpriseSn || !item.creditCode || ("contractType" in item && !item.contractType);
+			return ![4, 5].includes(item.type) && (!item.enterpriseSn || !item.creditCode);
+		});
+
+		if (isInValid) return ElMessage.warning("请输入必填项");
+		emit("next", { engineeringMains: formData.value });
+	} else {
+		emit("prev");
+	}
+};
+
+watch(
+	() => active.value,
+	() => {
+		console.log("datas", formData.value);
+		formConfig.formData = formData.value[active.value];
+		formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
+	}
+);
+
+onMounted(async () => {
+	const data = await getDicList({ dictType: "enterprise_main", status: 1, isDefault: "Y" });
+	stepOptions.value = data.result;
+	formData.value = formData.value.map((item, index) => ({
+		...item,
+		type: data.result[index].dictLabel as Type
+	}));
+	formConfig.formData = formData.value[active.value];
+	formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
+
+	if (store.Message && store.Message.engineeringMains.length) {
+		formData.value = formData.value.map(item => {
+			// console.log("main", store.Message.engineeringMains);
+			let curr = store.Message.engineeringMains.find(main => item.type == main.type);
+			if ("contractType" in item) {
+				return (curr = {
+					...curr,
+					enterpriseSn: curr.enterpriseSn,
+					creditCode: curr.creditCode,
+					legalPerson: curr.legalPerson,
+					legalPersonTel: curr.legalPersonTel,
+					contractType: curr.contractType
+				});
+			} else {
+				delete curr["contractType"];
+				return curr;
+			}
+		});
+
+		formConfig.formData = formData.value[active.value];
+	}
+});
+
+onUnmounted(() => reset());
+</script>
+
+<style lang="scss" scoped>
+@import "./duty.scss";
+</style>
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.scss b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.scss
index d400401..6ad21ff 100644
--- a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.scss
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.scss
@@ -5,6 +5,13 @@
 	.steps {
 		padding: 2% 6%;
 	}
+	.add-btn {
+		margin-bottom: 20px;
+		margin-right: 6%;
+		display: flex;
+		align-items: center;
+		justify-content: flex-end;
+	}
 	v-deep {
 		.is-process {
 			color: #018bfe;
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.ts b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.ts
index 7523121..07f82e1 100644
--- a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.ts
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.ts
@@ -12,50 +12,101 @@ export interface FormData {
 }
 
 export type EngineeringMainList = Array<FormData & EngineeringMain>;
-
-export const formData = ref<EngineeringMainList>([
-	{
-		enterpriseSn: "",
-		creditCode: "",
-		legalPerson: "",
-		legalPersonTel: "",
-		type: undefined,
-		engineeringMainPersonList: []
-	},
-	{
-		enterpriseSn: "",
-		creditCode: "",
-		legalPerson: "",
-		legalPersonTel: "",
-		type: undefined,
-		engineeringMainPersonList: []
-	},
-	{
-		enterpriseSn: "",
-		creditCode: "",
-		legalPerson: "",
-		legalPersonTel: "",
-		contractType: "",
-		type: undefined,
-		engineeringMainPersonList: []
-	},
-	{
-		enterpriseSn: "",
-		creditCode: "",
-		legalPerson: "",
-		legalPersonTel: "",
-		type: undefined,
-		engineeringMainPersonList: []
-	},
-	{
-		enterpriseSn: "",
-		creditCode: "",
-		legalPerson: "",
-		legalPersonTel: "",
-		type: undefined,
-		engineeringMainPersonList: []
-	}
+export const formData = ref([
+	[
+		{
+			enterpriseSn: "",
+			creditCode: "",
+			legalPerson: "",
+			legalPersonTel: "",
+			type: undefined,
+			engineeringMainPersonList: []
+		}
+	],
+	[
+		{
+			enterpriseSn: "",
+			creditCode: "",
+			legalPerson: "",
+			legalPersonTel: "",
+			type: undefined,
+			engineeringMainPersonList: []
+		}
+	],
+	[
+		{
+			enterpriseSn: "",
+			creditCode: "",
+			legalPerson: "",
+			legalPersonTel: "",
+			type: undefined,
+			engineeringMainPersonList: []
+		}
+	],
+	[
+		{
+			enterpriseSn: "",
+			creditCode: "",
+			legalPerson: "",
+			legalPersonTel: "",
+			type: undefined,
+			engineeringMainPersonList: []
+		}
+	],
+	[
+		{
+			enterpriseSn: "",
+			creditCode: "",
+			legalPerson: "",
+			legalPersonTel: "",
+			type: undefined,
+			engineeringMainPersonList: []
+		}
+	]
 ]);
+// export const formData = ref<EngineeringMainList>([
+// 	{
+// 		enterpriseSn: "",
+// 		creditCode: "",
+// 		legalPerson: "",
+// 		legalPersonTel: "",
+// 		type: undefined,
+// 		engineeringMainPersonList: []
+// 	},
+// 	{
+// 		enterpriseSn: "",
+// 		creditCode: "",
+// 		legalPerson: "",
+// 		legalPersonTel: "",
+// 		type: undefined,
+// 		engineeringMainPersonList: []
+// 	},
+// 	{
+// 		enterpriseSn: "",
+// 		creditCode: "",
+// 		legalPerson: "",
+// 		legalPersonTel: "",
+// 		contractType: "",
+// 		type: undefined,
+// 		engineeringMainPersonList: []
+// 	},
+// 	{
+// 		enterpriseSn: "",
+// 		creditCode: "",
+// 		legalPerson: "",
+// 		legalPersonTel: "",
+// 		type: undefined,
+// 		engineeringMainPersonList: []
+// 	},
+// 	{
+// 		enterpriseSn: "",
+// 		creditCode: "",
+// 		legalPerson: "",
+// 		legalPersonTel: "",
+// 		type: undefined,
+// 		engineeringMainPersonList: []
+// 	}
+// ]);
 
 export const datas = ref<EngineeringMainList[number]>({
 	enterpriseSn: "建设单位名称",
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.vue b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.vue
index 4d749b8..c1978bb 100644
--- a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.vue
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/duty.vue
@@ -9,7 +9,9 @@
 				@click="active = i"
 			/>
 		</el-steps>
-
+		<div class="add-btn">
+			<el-button class="btnStyle" type="primary" @click="addEnterpriseData">添加</el-button>
+		</div>
 		<duty-form :form-config="formConfig" />
 
 		<footer class="footer">
@@ -47,13 +49,28 @@ const formConfig = reactive({
 });
 
 const isAllowNext = computed(() => active.value >= stepOptions.value.length - 1);
-
+const addEnterpriseData = () => {
+	formData.value[active.value].push({
+		enterpriseSn: "",
+		creditCode: "",
+		legalPerson: "",
+		legalPersonTel: "",
+		type: stepOptions.value[active.value].dictLabel as any,
+		engineeringMainPersonList: []
+	});
+};
 const handleToPrevOrNext = () => {
 	if (isAllowNext.value) {
 		console.log(formData.value, 777888);
-		const isInValid = formData.value.find((item: any) => {
+		let isInValid = false;
+		formData.value.map((item: any) => {
+			item.map((item2: any) => {
+				if (![4, 5].includes(item2.type) && (!item2.enterpriseSn || !item2.creditCode)) {
+					isInValid = true;
+				}
+			});
 			// return !item.enterpriseSn || !item.creditCode || ("contractType" in item && !item.contractType);
-			return ![4, 5].includes(item.type) && (!item.enterpriseSn || !item.creditCode);
+			return;
 		});
 
 		if (isInValid) return ElMessage.warning("请输入必填项");
@@ -75,34 +92,39 @@ watch(
 onMounted(async () => {
 	const data = await getDicList({ dictType: "enterprise_main", status: 1, isDefault: "Y" });
 	stepOptions.value = data.result;
-	formData.value = formData.value.map((item, index) => ({
-		...item,
-		type: data.result[index].dictLabel as Type
-	}));
+	console.log(formData.value, 778899);
+	formData.value.map((item, index) => {
+		console.log(item);
+		item.map((item2, index2) => {
+			console.log(item2);
+			item2.type = data.result[index].dictLabel as Type;
+		});
+	});
+	// console.log(formData.value, 112233);
 	formConfig.formData = formData.value[active.value];
 	formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
 
-	if (store.Message && store.Message.engineeringMains.length) {
-		formData.value = formData.value.map(item => {
-			// console.log("main", store.Message.engineeringMains);
-			let curr = store.Message.engineeringMains.find(main => item.type == main.type);
-			if ("contractType" in item) {
-				return (curr = {
-					...curr,
-					enterpriseSn: curr.enterpriseSn,
-					creditCode: curr.creditCode,
-					legalPerson: curr.legalPerson,
-					legalPersonTel: curr.legalPersonTel,
-					contractType: curr.contractType
-				});
-			} else {
-				delete curr["contractType"];
-				return curr;
-			}
-		});
+	// if (store.Message && store.Message.engineeringMains.length) {
+	// 	formData.value = formData.value.map(item => {
+	// 		console.log("main", store.Message.engineeringMains);
+	// 		let curr = store.Message.engineeringMains.find(main => item.type == main.type);
+	// 		if ("contractType" in item) {
+	// 			return (curr = {
+	// 				...curr,
+	// 				enterpriseSn: curr.enterpriseSn,
+	// 				creditCode: curr.creditCode,
+	// 				legalPerson: curr.legalPerson,
+	// 				legalPersonTel: curr.legalPersonTel,
+	// 				contractType: curr.contractType
+	// 			});
+	// 		} else {
+	// 			delete curr["contractType"];
+	// 			return curr;
+	// 		}
+	// 	});
 
-		formConfig.formData = formData.value[active.value];
-	}
+	// 	formConfig.formData = formData.value[active.value];
+	// }
 });
 
 onUnmounted(() => reset());
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm copy.vue b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm copy.vue
new file mode 100644
index 0000000..bf66ab0
--- /dev/null
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm copy.vue	
@@ -0,0 +1,189 @@
+<template>
+	<div class="duty-form">
+		<div class="add-btn">
+			<el-button class="btnStyle" type="primary">添加</el-button>
+		</div>
+		<el-form class="form" ref="formRef" :model="formData" :rules="formConfig.rules" label-width="150px">
+			<div class="row">
+				<template v-for="(val, key) in formData" :key="datas[key]">
+					<el-form-item
+						v-if="Object.keys(datas).includes(key)"
+						class="form-item"
+						:prop="formData.type != 4 && formData.type != 5 ? key : ''"
+						:label="datas[key]"
+					>
+						<el-select
+							class="select"
+							v-if="key === 'enterpriseSn'"
+							style="width: 100%"
+							@change="onChange"
+							v-model="formData[key]"
+						>
+							<el-option value="" @click="openAddDialog" v-show="formData.type != 1">
+								<div class="selectAdd">
+									<el-icon><circle-plus /></el-icon>
+									<span>新建</span>
+								</div>
+							</el-option>
+							<el-option
+								v-for="item in nameOptions"
+								:key="item.enterpriseSn"
+								:label="item.enterpriseName"
+								:value="item.enterpriseSn"
+							/>
+						</el-select>
+						<!-- <div v-if="key === 'enterpriseSn'" class="search">
+							<el-icon class="icon"><Search /></el-icon>
+						</div> -->
+						<el-input v-else v-model="formData[key]" />
+					</el-form-item>
+				</template>
+			</div>
+		</el-form>
+
+		<el-table
+			:data="formData.engineeringMainPersonList"
+			height="400"
+			max-height="500"
+			class="el-table"
+			:header-cell-style="{ textAlign: 'center' }"
+			:cell-style="{ textAlign: 'center' }"
+		>
+			<el-table-column prop="name" label="姓名">
+				<template #default="{ row }">
+					<el-input style="text-align: center" class="test" v-model="row.name" />
+				</template>
+			</el-table-column>
+			<el-table-column prop="jobId" label="职务">
+				<template #default="{ row }">
+					<el-select class="select" v-model="row.jobId">
+						<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
+					</el-select>
+				</template>
+			</el-table-column>
+			<el-table-column prop="station" label="职称/岗位">
+				<template #default="{ row }">
+					<el-input class="test" v-model="row.station" />
+				</template>
+			</el-table-column>
+			<el-table-column prop="stationCode" label="职称证号/岗位证号">
+				<template #default="{ row }">
+					<el-input class="test" v-model="row.stationCode" />
+				</template>
+			</el-table-column>
+			<el-table-column prop="idCard" label="身份证号">
+				<template #default="{ row }">
+					<el-input class="test" v-model="row.idCard" />
+				</template>
+			</el-table-column>
+			<el-table-column prop="phone" label="联系电话">
+				<template #default="{ row }">
+					<el-input class="test" v-model="row.phone" />
+				</template>
+			</el-table-column>
+			<el-table-column fixed="right" width="100">
+				<template #header>
+					<el-button type="primary" round @click="addEngineeringMainPerson">新增</el-button>
+				</template>
+
+				<template #default="{ row }">
+					<el-button type="danger" link @click="removeEngineeringMainPerson(row)">删除</el-button>
+				</template>
+			</el-table-column>
+			<!-- 表格无数据情况 -->
+			<template #empty>
+				<div class="table-empty">
+					<slot name="empty">
+						<img src="@/assets/images/notData.png" alt="notData" />
+						<div>暂无数据</div>
+					</slot>
+				</div>
+			</template>
+		</el-table>
+		<addCompany v-model:detailsDialog="openAddCompany" :relativeInfo="companyType" @confirm="allConfirm"></addCompany>
+	</div>
+</template>
+
+<script lang="ts" setup>
+import { ref, computed, watch, onMounted, reactive } from "vue";
+import { Search } from "@element-plus/icons-vue";
+import { queryMainType } from "@/api/modules/project";
+import { getDicList } from "@/api/modules/jxjview";
+import type { FormRules } from "element-plus";
+import type { EngineeringMainPerson } from "@/api/types";
+import type { EngineeringMainList } from "./duty";
+import addCompany from "../../../assessmentManagement/unitList/components/addCompany.vue";
+
+export interface formConfig {
+	formData: EngineeringMainList[number];
+	rules: FormRules;
+	datas: EngineeringMainList[number];
+}
+const openAddCompany = ref(false);
+const companyType = ref({});
+const props = defineProps<{
+	formConfig: formConfig;
+}>();
+
+const formData = computed(() => props.formConfig.formData),
+	datas = computed(() => props.formConfig.datas);
+
+const nameOptions = ref([{ enterpriseSn: "", enterpriseName: "", creditCode: "", legalPerson: "", legalPersonTel: "" }]),
+	jobOptions = ref([{ dictCode: "", dictValue: "", dictLabel: undefined }]);
+
+watch(
+	() => formData.value.type,
+	(n, o) => {
+		getMainData();
+	}
+);
+const allConfirm = () => {
+	getMainData();
+};
+const openAddDialog = () => {
+	companyType.value = reactive({
+		dictLabel: formData.value.type
+	});
+	openAddCompany.value = true;
+};
+const onChange = (option: any) => {
+	// const value = nameOptions.value.find(item => item.enterpriseSn == option[option.length - 1]);
+	const value = nameOptions.value.find(item => item.enterpriseSn == option);
+	if (!value) return;
+	formData.value.creditCode = value.creditCode;
+	formData.value.legalPerson = value.legalPerson;
+	formData.value.legalPersonTel = value.legalPersonTel;
+};
+
+const addEngineeringMainPerson = () => {
+	formData.value.engineeringMainPersonList?.push({
+		name: "",
+		jobId: "",
+		station: "",
+		stationCode: "",
+		idCard: "",
+		phone: ""
+	});
+};
+
+const removeEngineeringMainPerson = (row: EngineeringMainPerson) => {
+	const index = formData.value.engineeringMainPersonList?.indexOf(row);
+	// index && index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
+	!index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
+};
+const getMainData = async () => {
+	const data = await queryMainType({ mainType: formData.value.type });
+	nameOptions.value = data.result;
+};
+onMounted(async () => {
+	const res = await getDicList({ dictType: "engineering_post" });
+	jobOptions.value = res.result;
+});
+</script>
+
+<style lang="scss" scoped>
+@import "./dutyForm.scss";
+.test :deep(.el-input__inner) {
+	text-align: center;
+}
+</style>
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.scss b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.scss
index 3df72f1..7798740 100644
--- a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.scss
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.scss
@@ -1,11 +1,8 @@
 .duty-form {
 	flex: 1;
 	padding: 0 6%;
-	.add-btn {
-		margin-bottom: 20px;
-		display: flex;
-		align-items: center;
-		justify-content: flex-end;
+	.form > div:not(:last-child) {
+		margin-bottom: 30px;
 	}
 	.row {
 		display: flex;
diff --git a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.vue b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.vue
index b04955e..0358c57 100644
--- a/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.vue
+++ b/src/views/goverment/huizhou/projectList/components/ProjectSupervision/dutyForm.vue
@@ -1,105 +1,109 @@
 <template>
 	<div class="duty-form">
-		<!-- <div class="add-btn">
-			<el-button class="btnStyle" type="primary">添加</el-button>
-		</div> -->
 		<el-form class="form" ref="formRef" :model="formData" :rules="formConfig.rules" label-width="150px">
-			<div class="row">
-				<template v-for="(val, key) in formData" :key="datas[key]">
-					<el-form-item
-						v-if="Object.keys(datas).includes(key)"
-						class="form-item"
-						:prop="formData.type != 4 && formData.type != 5 ? key : ''"
-						:label="datas[key]"
-					>
-						<el-select
-							class="select"
-							v-if="key === 'enterpriseSn'"
-							style="width: 100%"
-							@change="onChange"
-							v-model="formData[key]"
+			<div v-for="(item, index) in formData" :key="index">
+				<div class="row">
+					<template v-for="(val, key) in item" :key="datas[key]">
+						<!-- :prop="item.type != 4 && item.type != 5 ? item[key] : ''" -->
+						<el-form-item
+							v-if="Object.keys(datas).includes(key)"
+							class="form-item"
+							:rules="
+								item.type != 4 && item.type != 5 && key === 'enterpriseSn'
+									? [{ required: true, message: '请选择', trigger: 'blur' }]
+									: []
+							"
+							:label="datas[key]"
 						>
-							<el-option value="" @click="openAddDialog" v-show="formData.type != 1">
-								<div class="selectAdd">
-									<el-icon><circle-plus /></el-icon>
-									<span>新建</span>
-								</div>
-							</el-option>
-							<el-option
-								v-for="item in nameOptions"
-								:key="item.enterpriseSn"
-								:label="item.enterpriseName"
-								:value="item.enterpriseSn"
-							/>
-						</el-select>
-						<!-- <div v-if="key === 'enterpriseSn'" class="search">
-							<el-icon class="icon"><Search /></el-icon>
-						</div> -->
-						<el-input v-else v-model="formData[key]" />
-					</el-form-item>
-				</template>
+							<el-select
+								class="select"
+								v-if="key === 'enterpriseSn'"
+								style="width: 100%"
+								@change="option => onChange(option, index)"
+								v-model="item[key]"
+							>
+								<el-option value="" @click="openAddDialog" v-show="item.type != 1">
+									<div class="selectAdd">
+										<el-icon><circle-plus /></el-icon>
+										<span>新建</span>
+									</div>
+								</el-option>
+								<el-option
+									v-for="item2 in nameOptions"
+									:key="item2.enterpriseSn"
+									:label="item2.enterpriseName"
+									:value="item2.enterpriseSn"
+								/>
+							</el-select>
+							<!-- <div v-if="key === 'enterpriseSn'" class="search">
+								<el-icon class="icon"><Search /></el-icon>
+							</div> -->
+							<el-input v-else v-model="item[key]" />
+						</el-form-item>
+					</template>
+				</div>
+
+				<el-table
+					:data="item.engineeringMainPersonList"
+					height="400"
+					max-height="500"
+					class="el-table"
+					:header-cell-style="{ textAlign: 'center' }"
+					:cell-style="{ textAlign: 'center' }"
+				>
+					<el-table-column prop="name" label="姓名">
+						<template #default="{ row }">
+							<el-input style="text-align: center" class="test" v-model="row.name" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="jobId" label="职务">
+						<template #default="{ row }">
+							<el-select class="select" v-model="row.jobId">
+								<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
+							</el-select>
+						</template>
+					</el-table-column>
+					<el-table-column prop="station" label="职称/岗位">
+						<template #default="{ row }">
+							<el-input class="test" v-model="row.station" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="stationCode" label="职称证号/岗位证号">
+						<template #default="{ row }">
+							<el-input class="test" v-model="row.stationCode" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="idCard" label="身份证号">
+						<template #default="{ row }">
+							<el-input class="test" v-model="row.idCard" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="phone" label="联系电话">
+						<template #default="{ row }">
+							<el-input class="test" v-model="row.phone" />
+						</template>
+					</el-table-column>
+					<el-table-column fixed="right" width="100">
+						<template #header>
+							<el-button type="primary" round @click="addEngineeringMainPerson(index)">新增</el-button>
+						</template>
+
+						<template #default="{ row }">
+							<el-button type="danger" link @click="removeEngineeringMainPerson(row, index)">删除</el-button>
+						</template>
+					</el-table-column>
+					<!-- 表格无数据情况 -->
+					<template #empty>
+						<div class="table-empty">
+							<slot name="empty">
+								<img src="@/assets/images/notData.png" alt="notData" />
+								<div>暂无数据</div>
+							</slot>
+						</div>
+					</template>
+				</el-table>
 			</div>
 		</el-form>
-
-		<el-table
-			:data="formData.engineeringMainPersonList"
-			height="400"
-			max-height="500"
-			class="el-table"
-			:header-cell-style="{ textAlign: 'center' }"
-			:cell-style="{ textAlign: 'center' }"
-		>
-			<el-table-column prop="name" label="姓名">
-				<template #default="{ row }">
-					<el-input style="text-align: center" class="test" v-model="row.name" />
-				</template>
-			</el-table-column>
-			<el-table-column prop="jobId" label="职务">
-				<template #default="{ row }">
-					<el-select class="select" v-model="row.jobId">
-						<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
-					</el-select>
-				</template>
-			</el-table-column>
-			<el-table-column prop="station" label="职称/岗位">
-				<template #default="{ row }">
-					<el-input class="test" v-model="row.station" />
-				</template>
-			</el-table-column>
-			<el-table-column prop="stationCode" label="职称证号/岗位证号">
-				<template #default="{ row }">
-					<el-input class="test" v-model="row.stationCode" />
-				</template>
-			</el-table-column>
-			<el-table-column prop="idCard" label="身份证号">
-				<template #default="{ row }">
-					<el-input class="test" v-model="row.idCard" />
-				</template>
-			</el-table-column>
-			<el-table-column prop="phone" label="联系电话">
-				<template #default="{ row }">
-					<el-input class="test" v-model="row.phone" />
-				</template>
-			</el-table-column>
-			<el-table-column fixed="right" width="100">
-				<template #header>
-					<el-button type="primary" round @click="addEngineeringMainPerson">新增</el-button>
-				</template>
-
-				<template #default="{ row }">
-					<el-button type="danger" link @click="removeEngineeringMainPerson(row)">删除</el-button>
-				</template>
-			</el-table-column>
-			<!-- 表格无数据情况 -->
-			<template #empty>
-				<div class="table-empty">
-					<slot name="empty">
-						<img src="@/assets/images/notData.png" alt="notData" />
-						<div>暂无数据</div>
-					</slot>
-				</div>
-			</template>
-		</el-table>
 		<addCompany v-model:detailsDialog="openAddCompany" :relativeInfo="companyType" @confirm="allConfirm"></addCompany>
 	</div>
 </template>
@@ -130,11 +134,13 @@ const formData = computed(() => props.formConfig.formData),
 
 const nameOptions = ref([{ enterpriseSn: "", enterpriseName: "", creditCode: "", legalPerson: "", legalPersonTel: "" }]),
 	jobOptions = ref([{ dictCode: "", dictValue: "", dictLabel: undefined }]);
-
 watch(
-	() => formData.value.type,
+	() => props.formConfig,
 	(n, o) => {
 		getMainData();
+	},
+	{
+		deep: true
 	}
 );
 const allConfirm = () => {
@@ -142,21 +148,21 @@ const allConfirm = () => {
 };
 const openAddDialog = () => {
 	companyType.value = reactive({
-		dictLabel: formData.value.type
+		dictLabel: formData.value[0].type
 	});
 	openAddCompany.value = true;
 };
-const onChange = (option: any) => {
+const onChange = (option: any, index: number) => {
 	// const value = nameOptions.value.find(item => item.enterpriseSn == option[option.length - 1]);
 	const value = nameOptions.value.find(item => item.enterpriseSn == option);
 	if (!value) return;
-	formData.value.creditCode = value.creditCode;
-	formData.value.legalPerson = value.legalPerson;
-	formData.value.legalPersonTel = value.legalPersonTel;
+	formData.value[index].creditCode = value.creditCode;
+	formData.value[index].legalPerson = value.legalPerson;
+	formData.value[index].legalPersonTel = value.legalPersonTel;
 };
 
-const addEngineeringMainPerson = () => {
-	formData.value.engineeringMainPersonList?.push({
+const addEngineeringMainPerson = (index: any) => {
+	formData.value[index].engineeringMainPersonList?.push({
 		name: "",
 		jobId: "",
 		station: "",
@@ -166,18 +172,19 @@ const addEngineeringMainPerson = () => {
 	});
 };
 
-const removeEngineeringMainPerson = (row: EngineeringMainPerson) => {
-	const index = formData.value.engineeringMainPersonList?.indexOf(row);
+const removeEngineeringMainPerson = (row: EngineeringMainPerson, ind: number) => {
+	const index = formData.value[ind].engineeringMainPersonList?.indexOf(row);
 	// index && index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
-	!index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
+	!index >= 0 && formData.value[ind].engineeringMainPersonList?.splice(index, 1);
 };
 const getMainData = async () => {
-	const data = await queryMainType({ mainType: formData.value.type });
+	const data = await queryMainType({ mainType: formData.value[0].type });
 	nameOptions.value = data.result;
 };
 onMounted(async () => {
 	const res = await getDicList({ dictType: "engineering_post" });
 	jobOptions.value = res.result;
+	getMainData();
 });
 </script>