update 工段设备绑定 dialogForm

src/views/base/equipmentBindSection/dialogForm.vue

@@ -6,7 +6,11 @@
 -->
 
 <template>
-	<el-form ref="form" :model="form" label-width="100px" v-loading="formLoading">
+	<el-form
+		ref="form"
+		:model="dataForm"
+		label-width="100px"
+		v-loading="formLoading">
 		<el-row :gutter="20">
 			<el-col :span="12">
 				<el-form-item
@@ -14,7 +18,7 @@
 					prop="productionLineId"
 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 					<el-select
-						v-model="form.productionLineId"
+						v-model="dataForm.productionLineId"
 						placeholder="请选择产线"
 						@change="handleProductlineChange">
 						<el-option
@@ -32,9 +36,9 @@
 					prop="workshopSectionId"
 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 					<el-select
-						v-model="form.workshopSectionId"
+						v-model="dataForm.workshopSectionId"
 						placeholder="请选择工段"
-						@change="$emit('update', form)">
+						@change="$emit('update', dataForm)">
 						<el-option
 							v-for="opt in worksectionList"
 							:key="opt.value"
@@ -51,9 +55,9 @@
 					prop="equipmentId"
 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
 					<el-select
-						v-model="form.equipmentId"
+						v-model="dataForm.equipmentId"
 						placeholder="请选择设备"
-						@change="$emit('update', form)">
+						@change="$emit('update', dataForm)">
 						<el-option
 							v-for="opt in equipmentList"
 							:key="opt.value"
@@ -66,8 +70,8 @@
 			<el-col :span="12">
 				<el-form-item label="工段排序" prop="sort">
 					<el-input
-						v-model="form.sort"
-						@change="$emit('update', form)"
+						v-model="dataForm.sort"
+						@change="$emit('update', dataForm)"
 						placeholder="请输入工段排序" />
 				</el-form-item>
 			</el-col>
@@ -76,9 +80,9 @@
 			<el-col :span="12">
 				<el-form-item label="产线数据类型" prop="lineDataType">
 					<el-select
-						v-model="form.lineDataType"
+						v-model="dataForm.lineDataType"
 						placeholder="请选择产线数据类型"
-						@change="$emit('update', form)">
+						@change="$emit('update', dataForm)">
 						<el-option
 							v-for="opt in [
 								{ label: '无类型', value: 0 },
@@ -94,9 +98,9 @@
 			<el-col :span="12">
 				<el-form-item label="工段数据类型" prop="sectionDataType">
 					<el-select
-						v-model="form.sectionDataType"
+						v-model="dataForm.sectionDataType"
 						placeholder="请选择工段数据类型"
-						@change="$emit('update', form)">
+						@change="$emit('update', dataForm)">
 						<el-option
 							v-for="opt in [
 								{ label: '无类型', value: 0 },
@@ -134,25 +138,9 @@ export default {
 			productionLineList: [],
 			equipmentList: [],
 			worksectionList: [],
+			dataFormCache: null,
 		};
 	},
-	computed: {
-		form: {
-			get() {
-				return {
-                    productionLineId: this.dataForm.productionLineId,
-                    workshopSectionId: this.dataForm.workshopSectionId,
-                    equipmentId: this.dataForm.equipmentId,
-                    sort: this.dataForm.sort,
-                    lineDataType: this.dataForm.lineDataType,
-                    sectionDataType: this.dataForm.sectionDataType,
-                };
-			},
-			set(val) {
-				console.log('set form', val);
-			},
-		},
-	},
 	mounted() {
 		Promise.all([this.getProductLineList(), this.getEquipmentList()]).then(
 			() => {
@@ -160,6 +148,14 @@ export default {
 			}
 		);
 	},
+	watch: {
+		'dataForm.productionLineId': {
+			handler: async function (plId) {
+				if (plId) await this.getWorksectionList(plId);
+			},
+			immediate: true,
+		},
+	},
 	methods: {
 		/** 模拟透传 ref  */
 		validate(cb) {
@@ -169,9 +165,9 @@ export default {
 			return this.$refs.form.resetFields(args);
 		},
 		async handleProductlineChange(id) {
-			console.log('产线变化了!!!', id, this.form);
 			await this.getWorksectionList(id);
-			this.$emit('update', { ...this.form, workshopSectionId: null });
+			this.dataForm.workshopSectionId = null;
+			this.$emit('update', this.dataForm);
 		},
 		// getCode
 		async getCode(url) {

src/views/base/equipmentBindSection/index.vue

@@ -37,7 +37,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 	</div>
 </template>