Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin into dev

apps/web-naive/src/adapter/form.ts

@@ -8,58 +8,59 @@ import type { ComponentType } from './component';
 import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-/** 手机号正则表达式（中国） */
 const MOBILE_REGEX = /(?:0|86|\+86)?1[3-9]\d{9}/;
 
-setupVbenForm<ComponentType>({
-  config: {
-    // naive-ui组件的空值为null,不能是undefined，否则重置表单时不生效
-    emptyStateValue: null,
-    baseModelPropName: 'value',
-    modelPropNameMap: {
-      Checkbox: 'checked',
-      Radio: 'checked',
-      Upload: 'fileList',
+async function initSetupVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // naive-ui组件的空值为null,不能是undefined，否则重置表单时不生效
+      emptyStateValue: null,
+      baseModelPropName: 'value',
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Upload: 'fileList',
+      },
     },
-  },
-  defineRules: {
-    required: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
-        return $t('ui.formRules.required', [ctx.label]);
-      }
-      return true;
-    },
-    selectRequired: (value, _params, ctx) => {
-      if (value === undefined || value === null) {
-        return $t('ui.formRules.selectRequired', [ctx.label]);
-      }
-      return true;
-    },
-    // 手机号非必填
-    mobile: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
+    defineRules: {
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
         return true;
-      } else if (!MOBILE_REGEX.test(value)) {
-        return $t('ui.formRules.phone', [ctx.label]);
-      }
-      return true;
+      },
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
+      // 手机号非必填
+      mobile: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return true;
+        } else if (!MOBILE_REGEX.test(value)) {
+          return $t('ui.formRules.mobile', [ctx.label]);
+        }
+        return true;
+      },
+      // 手机号必填
+      mobileRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        if (!MOBILE_REGEX.test(value)) {
+          return $t('ui.formRules.mobile', [ctx.label]);
+        }
+        return true;
+      },
     },
-    // 手机号必填
-    mobileRequired: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
-        return $t('ui.formRules.required', [ctx.label]);
-      }
-      if (!MOBILE_REGEX.test(value)) {
-        return $t('ui.formRules.phone', [ctx.label]);
-      }
-      return true;
-    },
-  },
-});
+  });
+}
 
 const useVbenForm = useForm<ComponentType>;
 
-export { useVbenForm, z };
+export { initSetupVbenForm, useVbenForm, z };
 
 export type VbenFormSchema = FormSchema<ComponentType>;
 export type { VbenFormProps };

apps/web-naive/src/bootstrap.ts

@@ -12,12 +12,16 @@ import { useTitle } from '@vueuse/core';
 import { $t, setupI18n } from '#/locales';
 
 import { initComponentAdapter } from './adapter/component';
+import { initSetupVbenForm } from './adapter/form';
 import App from './app.vue';
 import { router } from './router';
 
 async function bootstrap(namespace: string) {
   // 初始化组件适配器
-  initComponentAdapter();
+  await initComponentAdapter();
+
+  // 初始化表单组件
+  await initSetupVbenForm();
 
   // // 设置弹窗的默认配置
   // setDefaultModalProps({