♻️ Refactoring code. 增加字典管理和参数管理表单校验

src/views/admin/client/index.vue

@@ -30,7 +30,7 @@
         <el-table-column :label="t('client.clientId')" prop="clientId" show-overflow-tooltip/>
         <el-table-column :label="t('client.clientSecret')" prop="clientSecret" show-overflow-tooltip/>
         <el-table-column :label="t('client.scope')" prop="scope" show-overflow-tooltip/>
-        <el-table-column :label="t('client.authorizedGrantTypes')" prop="authorizedGrantTypes" show-overflow-tooltip>
+        <el-table-column :label="t('client.authorizedGrantTypes')" prop="authorizedGrantTypes" show-overflow-tooltip width="600px">
           <template #default="scope">
             <dict-tag :options="grant_types" :value="scope.row.authorizedGrantTypes"></dict-tag>
           </template>

src/views/admin/dict/dictItem/form.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="system-dic-dialog-container">
     <el-dialog v-model="visible" :title="dataForm.id ? $t('common.editBtn') : $t('common.addBtn')" width="60%">
-      <el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default">
+      <el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default" :rules="dataRules">
         <el-row :gutter="35">
           <el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20" v-if="dataForm.id">
             <el-form-item label="类型" prop="dictType">
@@ -28,7 +28,7 @@
               <el-input-number v-model="dataForm.sortOrder" placeholder="请输入排序" clearable></el-input-number>
             </el-form-item>
           </el-col>
-          <el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
+          <el-col :span="24" class="mb20">
             <el-form-item label="备注信息" prop="remarks">
               <el-input v-model="dataForm.remarks" type="textarea" placeholder="请输入字典描述" maxlength="150"></el-input>
             </el-form-item>
@@ -69,7 +69,12 @@ const dataForm = reactive({
 })
 
 
-const dataRules = reactive({})
+const dataRules = reactive({
+  value: [{ required: true, message: '数据值不能为空', trigger: 'blur' }],
+  label: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
+  description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
+  sortOrder: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
+})
 
 
 // 打开弹窗
@@ -99,6 +104,10 @@ const onCancel = () => {
 };
 // 提交
 const onSubmit = () => {
+  dicDialogFormRef.value.validate((valid: boolean) => {
+    if (!valid) {
+      return false
+    }
     if (dataForm.id) {
       putItemObj(dataForm).then(() => {
         closeDialog(); // 关闭弹窗
@@ -114,6 +123,11 @@ const onSubmit = () => {
         useMessage().error(err.msg)
       })
     }
+  })
+
+
+
+
 };
 // 暴露变量
 defineExpose({

src/views/admin/dict/form.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="system-dic-dialog-container">
 		<el-dialog v-model="visible" :title="dataForm.id ? $t('common.editBtn') : $t('common.addBtn')"  width="60%">
-      <el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default">
+      <el-form ref="dicDialogFormRef" :model="dataForm" label-width="90px" size="default" :rules="dataRules">
         <el-row :gutter="35">
           <el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24" class="mb20">
             <el-form-item label="类型" prop="dictType">
@@ -56,12 +56,16 @@ const dataForm = reactive({
   id: '',
   dictType: '',
   description: '',
-  systemFlag: '',
+  systemFlag: '0',
   remarks: '',
 })
 
 
-const dataRules = reactive({})
+const dataRules = reactive({
+  dictType: [{ required: true, message: '类型不能为空', trigger: 'blur' }],
+  systemFlag: [{ required: true, message: '字典类型不能为空', trigger: 'blur' }],
+  description: [{ required: true, message: '描述不能为空', trigger: 'blur' }],
+})
 
 
 // 打开弹窗
@@ -90,6 +94,10 @@ const onCancel = () => {
 };
 // 提交
 const onSubmit = () => {
+  dicDialogFormRef.value.validate((valid: boolean) => {
+    if (!valid) {
+      return false
+    }
     if (dataForm.id) {
       putObj(dataForm).then(() => {
         closeDialog(); // 关闭弹窗
@@ -105,6 +113,8 @@ const onSubmit = () => {
         useMessage().error(err.msg)
       })
     }
+  })
+
 };
 // 暴露变量
 defineExpose({

src/views/admin/param/form.vue

@@ -88,14 +88,21 @@ const form = reactive({
   publicName: '',
   publicKey: '',
   publicValue: '',
-  status: '',
+  status: '0',
   validateCode: '',
   publicType: '',
-  systemFlag: '',
+  systemFlag: '0',
 });
 
 // 定义校验规则
-const dataRules = ref({})
+const dataRules = reactive({
+  publicName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  publicKey: [{ required: true, message: '参数键不能为空', trigger: 'blur' }],
+  publicValue: [{ required: true, message: '参数值不能为空', trigger: 'blur' }],
+  status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
+  validateCode: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
+  publicType: [{ required: true, message: '类型不能为空', trigger: 'blur' }],
+})
 
 // 打开弹窗
 const openDialog = (id: string) => {

src/views/admin/tenant/tenantMenu/form.vue

@@ -64,7 +64,9 @@ const form = reactive({
 });
 
 const dataRules = reactive({
-
+  name: [{ required: true, message: '套餐名称不能为空', trigger: 'blur' }],
+  status: [{ required: true, message: '套餐状态不能为空', trigger: 'blur' }],
+  menuIds: [{ required: true, message: '套餐菜单不能为空', trigger: 'blur' }]
 })
 
 const menuData = ref<any[]>([])
@@ -101,6 +103,7 @@ const onSubmit = () => {
   loading.value = true
   dataFormRef.value.validate((valid: boolean) => {
     if (!valid) {
+      loading.value = false
       return false
     }
     form.menuIds = [...menuTreeRef.value.getCheckedKeys(),...menuTreeRef.value.getHalfCheckedKeys()].join(",")