apply DialogForm & debug

src/views/quality/base/qualityInspectionType/index.vue

@@ -33,9 +33,27 @@
 		<base-dialog
 			:dialogTitle="title"
 			:dialogVisible="open"
+			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<el-form ref="form" :model="form" :rules="rules" label-width="128px">
+			<DialogForm
+				v-if="open"
+				ref="form"
+				:dataForm="form"
+				:rows="[
+					[
+						{
+							input: true,
+							label: '检测类型名称',
+							prop: 'name',
+							rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						},
+					],
+					[{ input: true, label: '检测类型编码', prop: 'code' }],
+					[{ input: true, label: '备注', prop: 'remark' }],
+				]" />
+
+			<!-- <el-form ref="form" :model="form" :rules="rules" label-width="128px">
 				<el-form-item label="检测类型名称" prop="name">
 					<el-input v-model="form.name" placeholder="请输入检测类型名称" />
 				</el-form-item>
@@ -45,14 +63,14 @@
 				<el-form-item label="备注" prop="remark">
 					<el-input v-model="form.remark" placeholder="请输入备注" />
 				</el-form-item>
-			</el-form>
+			</el-form> -->
 		</base-dialog>
-		
 	</div>
 </template>
 
 <script>
 import moment from 'moment';
+import DialogForm from '../../components/dialogForm.vue';
 
 import {
 	createQualityInspectionType,
@@ -65,19 +83,23 @@ import {
 
 export default {
 	name: 'QualityInspectionType',
-	components: {},
+	components: { DialogForm },
 	data() {
 		return {
 			tableBtn: [
-				this.$auth.hasPermi('base:quality-inspection-type:update') ? {
-					type: 'edit',
-					btnName: '修改',
-				} : undefined,
-				this.$auth.hasPermi('base:quality-inspection-type:delete') ? {
-					type: 'delete',
-					btnName: '删除',
-				} : undefined,
-			].filter(v=>v),
+				this.$auth.hasPermi('base:quality-inspection-type:update')
+					? {
+							type: 'edit',
+							btnName: '修改',
+					  }
+					: undefined,
+				this.$auth.hasPermi('base:quality-inspection-type:delete')
+					? {
+							type: 'delete',
+							btnName: '删除',
+					  }
+					: undefined,
+			].filter((v) => v),
 			tableData: [],
 			tableProps: [
 				{
@@ -173,7 +195,7 @@ export default {
 				// 	name: 'reset',
 				// },
 				{
-					type: 'separate'
+					type: 'separate',
 				},
 				{
 					type: this.$auth.hasPermi('base:quality-inspection-type:create')
@@ -195,6 +217,14 @@ export default {
 			],
 		};
 	},
+	// watch: {
+	// 	form: {
+	// 		handler: (val) => {
+	// 			console.log('form changed', val);
+	// 		},
+	// 		deep: true
+	// 	},
+	// },
 	created() {
 		this.getList();
 	},
@@ -289,10 +319,13 @@ export default {
 		},
 		/** 提交按钮 */
 		submitForm() {
+			// console.log('this.$refs.form', this.$refs.form);
+			// return;
 			this.$refs['form'].validate((valid) => {
 				if (!valid) {
 					return;
 				}
+				console.log('final form', JSON.stringify(this.form));
 				// 修改的提交
 				if (this.form.id != null) {
 					updateQualityInspectionType(this.form).then((response) => {