perf: 优化表单校验和查询参数

yudao-ui-admin-vue3/src/views/system/dept/dept.data.ts

@@ -1,5 +1,19 @@
 import { required } from '@/utils/formRules'
 import { reactive } from 'vue'
+// 表单校验
+export const rules = reactive({
+  name: [required],
+  sort: [required],
+  email: [required],
+  phone: [
+    {
+      pattern:
+        /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/,
+      trigger: 'blur',
+      message: '请输入正确的手机号码'
+    }
+  ]
+})
 
 export const modelSchema = reactive<FormSchema[]>([
   {

yudao-ui-admin-vue3/src/views/system/dept/index.vue

@@ -5,7 +5,7 @@ import { handleTree } from '@/utils/tree'
 import { onMounted, ref, unref, watch } from 'vue'
 import * as DeptApi from '@/api/system/dept'
 import { Form, FormExpose } from '@/components/Form'
-import { modelSchema } from './dept.data'
+import { modelSchema, rules } from './dept.data'
 import { DeptVO } from '@/api/system/dept/types'
 import { useMessage } from '@/hooks/web/useMessage'
 import { getListSimpleUsersApi } from '@/api/system/user'
@@ -159,7 +159,7 @@ onMounted(async () => {
       </div>
       <div v-if="showForm">
         <!-- 操作工具栏 -->
-        <Form :schema="modelSchema" ref="formRef">
+        <Form ref="formRef" :schema="modelSchema" :rules="rules">
           <template #parentId>
             <el-tree-select
               node-key="id"

yudao-ui-admin-vue3/src/views/system/dict/dict.data.ts

@@ -7,9 +7,9 @@ import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
 const { t } = useI18n()
 // 表单校验
 export const dictDataRules = reactive({
-  dictType: [required],
   label: [required],
-  value: [required]
+  value: [required],
+  sort: [required]
 })
 // crudSchemas
 export const crudSchemas = reactive<CrudSchema[]>([

yudao-ui-admin-vue3/src/views/system/menu/index.vue

@@ -25,11 +25,12 @@ import { MenuVO } from '@/api/system/menu/types'
 import { SystemMenuTypeEnum, CommonStatusEnum } from '@/utils/constants'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { useMessage } from '@/hooks/web/useMessage'
+import { required } from '@/utils/formRules.js'
 const message = useMessage()
 const { t } = useI18n() // 国际化
 // ========== 创建菜单树结构 ==========
 const loading = ref(true)
-const menuData = ref([]) // 树形结构
+const menuData = ref<any[]>([]) // 树形结构
 const getList = async () => {
   const res = await MenuApi.getMenuListApi(queryParams)
   menuData.value = handleTree(res)
@@ -44,7 +45,7 @@ const menuProps = {
 const menuOptions = ref() // 树形结构
 const getTree = async () => {
   const res = await MenuApi.listSimpleMenusApi()
-  const menu = { id: 0, name: '主类目', children: [] }
+  const menu = { id: 0, name: '主类目', children: [] as any[] }
   menu.children = handleTree(res)
   console.info(menu)
   menuOptions.value = menu
@@ -85,12 +86,12 @@ const menuForm = ref<MenuVO>({
   createTime: ''
 })
 // 表单校验
-const rules = {
-  name: [{ required: true, message: '菜单名称不能为空', trigger: 'blur' }],
-  sort: [{ required: true, message: '菜单顺序不能为空', trigger: 'blur' }],
-  path: [{ required: true, message: '路由地址不能为空', trigger: 'blur' }],
-  status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
-}
+const rules = reactive({
+  name: [required],
+  sort: [required],
+  path: [required],
+  status: [required]
+})
 // 设置标题
 const setDialogTile = (type: string) => {
   dialogTitle.value = t('action.' + type)

yudao-ui-admin-vue3/src/views/system/notice/notice.data.ts

@@ -8,8 +8,7 @@ const { t } = useI18n() // 国际化
 // 表单校验
 export const rules = reactive({
   title: [required],
-  type: [required],
-  status: [required]
+  type: [required]
 })
 
 // CrudSchema

yudao-ui-admin-vue3/src/views/system/post/post.data.ts

@@ -9,8 +9,7 @@ const { t } = useI18n() // 国际化
 export const rules = reactive({
   name: [required],
   code: [required],
-  sort: [required],
-  status: [required]
+  sort: [required]
 })
 
 // CrudSchema

yudao-ui-admin-vue3/src/views/system/sms/smsTemplate/sms.template.data.ts

@@ -8,13 +8,12 @@ const { t } = useI18n() // 国际化
 // 表单校验
 export const rules = reactive({
   type: [required],
+  status: [required],
+  code: [required],
   name: [required],
   content: [required],
   apiTemplateId: [required],
-  channelId: [required],
-  code: [required],
-  sort: [required],
-  status: [required]
+  channelId: [required]
 })
 
 // CrudSchema

yudao-ui-admin-vue3/src/views/system/user/index.vue

@@ -63,7 +63,7 @@ const { getList, setSearchParams, delList, exportList } = methods
 
 // ========== 创建部门树结构 ==========
 const filterText = ref('')
-const deptOptions = ref([]) // 树形结构
+const deptOptions = ref<any[]>([]) // 树形结构
 const searchForm = ref<FormExpose>()
 const treeRef = ref<InstanceType<typeof ElTree>>()
 const getTree = async () => {

yudao-ui-admin-vue3/src/views/system/user/user.data.ts

@@ -7,8 +7,18 @@ import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
 const { t } = useI18n()
 // 表单校验
 export const rules = reactive({
+  username: [required],
   nickname: [required],
-  status: [required]
+  email: [required],
+  status: [required],
+  mobile: [
+    {
+      pattern:
+        /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/,
+      trigger: 'blur',
+      message: '请输入正确的手机号码'
+    }
+  ]
 })
 // crudSchemas
 const crudSchemas = reactive<CrudSchema[]>([