fix: 修复多个页面的显示优化，必填字段，重置校验，数据复显等问题

src/views/system/api/component/edit.vue

@@ -2,7 +2,7 @@
 	<el-dialog class="api-edit" v-model="showDialog" :title="`${formData.id ? '编辑接口' : '新增接口'}`" width="600px" :close-on-click-modal="false" :close-on-press-escape="false">
 		<el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="80px" @keyup.enter="onSubmit">
 			<el-form-item label="选择类型" prop="types">
-				<el-radio-group v-model="formData.types">
+				<el-radio-group v-model="formData.types" @change="tabChange">
 					<el-radio-button :label="2">接口</el-radio-button>
 					<el-radio-button :label="1">分类</el-radio-button>
 				</el-radio-group>
@@ -23,12 +23,18 @@
 					</el-select>
 				</el-form-item>
 				<el-form-item label="分类名称" prop="name">
-					<el-input v-model="formData.name" placeholder="输入接口名称" />
+					<el-input v-model="formData.name" placeholder="输入分类名称" />
 				</el-form-item>
 			</template>
 			<template v-else>
 				<el-form-item label="上级分类" prop="parentId">
-					<el-cascader :options="typeData" :props="{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.parentId"></el-cascader>
+					<el-cascader :options="[
+						{
+							id: -1,
+							name: '根节点',
+							children: typeData,
+						},
+					]" :props="{ checkStrictly: true, multiple: false, emitPath: false, value: 'id', label: 'name' }" placeholder="请选择关联页面" clearable class="w100" v-model="formData.parentId"></el-cascader>
 				</el-form-item>
 				<el-form-item label="关联页面" prop="menuIds">
 					<el-cascader :options="menuData" :props="{ checkStrictly: true, multiple: true, emitPath: false, value: 'id', label: 'title' }" placeholder="请选择关联页面" filterable clearable class="w100" v-model="formData.menuIds"></el-cascader>
@@ -49,17 +55,17 @@
 						<el-option v-for="item in methodOptions" :key="item.value" :label="item.key" :value="item.value"></el-option>
 					</el-select>
 				</el-form-item>
-				<el-form-item label="状态" prop="status">
-					<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
-				</el-form-item>
 			</template>
+			<el-form-item label="状态" prop="status">
+				<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
+			</el-form-item>
 			<el-form-item label="备注" prop="remark">
 				<el-input v-model="formData.remark" type="textarea" :rows="3" />
 			</el-form-item>
 		</el-form>
 		<template #footer>
 			<div class="dialog-footer">
-				<el-button @click="showDialog = false">取消</el-button>
+				<el-button @click="cancel">取消</el-button>
 				<el-button type="primary" @click="onSubmit">确定</el-button>
 			</div>
 		</template>
@@ -97,24 +103,19 @@ const baseForm: ApiRow = {
 	status: 1,
 };
 
-const formData = reactive<ApiRow>({
-	...baseForm,
-});
+const formData = reactive<ApiRow>(JSON.parse(JSON.stringify(baseForm)));
 
 // 切换分类时清空上级分类的选择。因为接口里不能选择跟分类节点
-watch(
-	() => formData.types,
-	() => {
-		formData.parentId = undefined;
-	}
-);
+function tabChange() {
+	formData.parentId = undefined;
+}
 
 const ruleForm = {
 	parentId: [ruleRequired('上级分类不能为空', 'change')],
 	// menuIds: [ruleRequired('关联页面不能为空', 'change')],
 	method: [ruleRequired('请求方式不能为空', 'change')],
 	apiTypes: [ruleRequired('接口类型不能为空', 'change')],
-	name: [ruleRequired('接口名称不能为空')],
+	name: [ruleRequired('名称不能为空', 'change')],
 	address: [ruleRequired('接口地址不能为空')],
 };
 
@@ -141,8 +142,13 @@ const onSubmit = async () => {
 };
 
 const resetForm = async () => {
-	Object.assign(formData, { ...baseForm });
-	formRef.value && formRef.value.resetFields();
+	const types = formData.types
+	Object.assign(formData, { ...JSON.parse(JSON.stringify(baseForm)) });
+	formRef.value && formRef.value.resetFields(formData);
+};
+const cancel = async () => {
+	resetForm()
+	showDialog.value = false
 };
 
 const open = async (row: any) => {
@@ -152,7 +158,7 @@ const open = async (row: any) => {
 		typeData.value = res.Info;
 	});
 	nextTick(() => {
-		Object.assign(formData, { method: methodOptions.value.length ? methodOptions.value[0].value : '', ...row });
+		Object.assign(formData, { method: methodOptions.value.length ? methodOptions.value[0].value : '', ...JSON.parse(JSON.stringify(row)) });
 	});
 };
 

src/views/system/config/component/editConfig.vue

@@ -45,7 +45,7 @@ interface RuleFormState {
   configName: string;
   configKey: string;
   configValue: string;
-  configType: string;
+  configType: number;
   remark: string;
   moduleClassify:string; // 字典分类
 }
@@ -55,6 +55,16 @@ interface DicState {
   rules: {};
 }
 
+const baseForm: RuleFormState = {
+  configId: 0,
+  configName: '',
+  configKey: '',
+  configValue: '',
+  configType: 0,
+  remark: '',
+  moduleClassify: '',
+}
+
 export default defineComponent({
   name: 'systemEditDicData',
   props: {
@@ -70,18 +80,13 @@ export default defineComponent({
     const state = reactive<DicState>({
       isShowDialog: false,
       ruleForm: {
-        configId: 0,
-        configName: '',
-        configKey: '',
-        configValue: '',
-        configType: '0',
-        remark: '',
-        moduleClassify: '',
+        ...baseForm
       },
       rules: {
-        configName: [{ required: true, message: '参数名称不能为空', trigger: 'blur' }],
-        configKey: [{ required: true, message: '参数键名不能为空', trigger: 'blur' }],
-        configValue: [{ required: true, message: '参数键值不能为空', trigger: 'blur' }],
+        configName: [{ required: true, message: '参数名称不能为空', trigger: 'change' }],
+        configKey: [{ required: true, message: '参数键名不能为空', trigger: 'change' }],
+        moduleClassify: [{ required: true, message: '字典分类不能为空', trigger: 'change' }],
+        configValue: [{ required: true, message: '参数键值不能为空', trigger: 'change' }],
       },
     });
     // 打开弹窗
@@ -90,7 +95,6 @@ export default defineComponent({
       if (row) {
         api.config.detail(row.configId).then((res: any) => {
           const data: RuleFormState = res.data.data;
-          data.configType = String(data.configType);
           state.ruleForm = data;
         });
         state.ruleForm = row;
@@ -99,13 +103,7 @@ export default defineComponent({
     };
     const resetForm = () => {
       state.ruleForm = {
-        configId: 0,
-        configName: '',
-        configKey: '',
-        configValue: '',
-        configType: '0',
-        moduleClassify: '',
-        remark: '',
+        ...baseForm
       };
     };
     // 关闭弹窗

src/views/system/menu/component/editMenu.vue

@@ -122,7 +122,7 @@
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default" :loading="loading">{{ acType === 'add' ? '新 增' : '修 改' }}</el-button>
+					<el-button type="primary" @click="onSubmit" size="default" :loading="loading">提 交</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -189,7 +189,7 @@ export default defineComponent({
 				component: [{ required: true, message: '组件地址不能为空', trigger: 'blur' }],
 				path: [{ required: true, message: '路由地址不能为空', trigger: 'blur' }],
 				title: [{ required: true, message: '菜单名称不能为空', trigger: 'blur' }],
-				name: [{ required: true, message: '菜单名称不能为空', trigger: 'blur' }],
+				name: [{ required: true, message: '规则名称不能为空', trigger: 'blur' }],
 				menuType: [{ required: true, message: '菜单类型不能为空', trigger: 'blur' }],
 			},
 		});

src/views/system/task/component/editConfig.vue

@@ -3,7 +3,7 @@
 		<el-dialog :title="(ruleForm.jobId ? '修改' : '添加' ) + '任务'" v-model="isShowDialog" width="650px">
 			<el-form :model="ruleForm" ref="formRef" :rules="rules" size="default" label-width="100px">
 				<el-form-item label="任务名称" prop="jobName">
-					<el-input v-model="ruleForm.jobName" placeholder="请输入任务名称" />
+					<el-input v-model.trim="ruleForm.jobName" placeholder="请输入任务名称" />
 				</el-form-item>
 				<el-form-item label="任务描述" prop="remark">
 					<el-input v-model="ruleForm.remark" placeholder="请输入任务描述" type="textarea" />
@@ -93,8 +93,8 @@
 					<el-radio v-model="ruleForm.misfirePolicy" :label="0">执行一次</el-radio>
 				</el-form-item>
 				<el-form-item label="状态" prop="status">
-					<el-radio v-model="ruleForm.status" :label="0">正常</el-radio>
-					<el-radio v-model="ruleForm.status" :label="1">暂停</el-radio>
+					<el-radio v-model="ruleForm.status" :label="0">启用</el-radio>
+					<el-radio v-model="ruleForm.status" :label="1">禁用</el-radio>
 				</el-form-item>
 			</el-form>
 			<template #footer>
@@ -167,7 +167,7 @@ export default defineComponent({
 			},
 			rules: {
 				jobName: [{ required: true, message: '任务名称不能为空', trigger: 'blur' }],
-				invokeTarget: [{ required: true, message: '执行方法不能为空', trigger: 'blur' }],
+				invokeTarget: [{ required: true, message: '调用方法不能为空', trigger: 'blur' }],
 				cronExpression: [{ required: true, message: 'cron表达式不能为空', trigger: 'blur' }],
 			},
 		});

src/views/system/task/index.vue

@@ -13,8 +13,8 @@
           </el-form-item>
           <el-form-item label="任务状态" prop="status" style="width: 200px">
             <el-select v-model="tableData.param.status" size="mini" placeholder="请选择">
-              <el-option label="正常" :value="0" />
-              <el-option label="暂停" :value="1" />
+              <el-option label="启用" :value="0" />
+              <el-option label="禁用" :value="1" />
             </el-select>
           </el-form-item>