diff --git a/apps/web-antd/src/adapter/form.ts b/apps/web-antd/src/adapter/form.ts index 0e6c688d4..cf75673e5 100644 --- a/apps/web-antd/src/adapter/form.ts +++ b/apps/web-antd/src/adapter/form.ts @@ -8,6 +8,9 @@ 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({ config: { // ant design vue组件库默认都是 v-model:value @@ -37,6 +40,25 @@ setupVbenForm({ } 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.phone', [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; + }, }, }); diff --git a/apps/web-antd/src/views/system/dept/data.ts b/apps/web-antd/src/views/system/dept/data.ts index 54692317b..6b98d1b26 100644 --- a/apps/web-antd/src/views/system/dept/data.ts +++ b/apps/web-antd/src/views/system/dept/data.ts @@ -92,11 +92,7 @@ export function useFormSchema(): VbenFormSchema[] { maxLength: 11, placeholder: '请输入联系电话', }, - rules: z - .string() - // TODO @芋艿:未来怎么拓展一个手机的 - .regex(/^1[3-9|]\d{9}$/, '请输入正确的手机号码') - .optional(), + rules: 'mobileRequired', }, { fieldName: 'email', diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue index 61852aaeb..acf676bed 100644 --- a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue +++ b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue @@ -110,7 +110,9 @@ const shouldRequired = computed(() => { } if (isString(currentRules.value)) { - return ['required', 'selectRequired'].includes(currentRules.value); + return ['mobileRequired', 'required', 'selectRequired'].includes( + currentRules.value, + ); } let isOptional = currentRules?.value?.isOptional?.(); diff --git a/packages/@core/ui-kit/form-ui/src/types.ts b/packages/@core/ui-kit/form-ui/src/types.ts index 34312ae78..529ba0efc 100644 --- a/packages/@core/ui-kit/form-ui/src/types.ts +++ b/packages/@core/ui-kit/form-ui/src/types.ts @@ -68,6 +68,8 @@ export type FormActions = FormContext; export type CustomRenderType = (() => Component | string) | string; export type FormSchemaRuleType = + | 'mobile' + | 'mobileRequired' | 'required' | 'selectRequired' | null @@ -428,6 +430,16 @@ export interface VbenFormAdapterOptions< modelPropNameMap?: Partial>; }; defineRules?: { + mobile?: ( + value: any, + params: any, + ctx: Record, + ) => boolean | string; + mobileRequired?: ( + value: any, + params: any, + ctx: Record, + ) => boolean | string; required?: ( value: any, params: any, diff --git a/packages/locales/src/langs/en-US/ui.json b/packages/locales/src/langs/en-US/ui.json index 514c121f9..e22fa45f5 100644 --- a/packages/locales/src/langs/en-US/ui.json +++ b/packages/locales/src/langs/en-US/ui.json @@ -7,7 +7,8 @@ "length": "{0} must be {1} characters long", "alreadyExists": "{0} `{1}` already exists", "startWith": "{0} must start with `{1}`", - "invalidURL": "Please input a valid URL" + "invalidURL": "Please input a valid URL", + "mobile": "Please input a valid {0}" }, "actionTitle": { "edit": "Modify {0}", diff --git a/packages/locales/src/langs/zh-CN/ui.json b/packages/locales/src/langs/zh-CN/ui.json index 239522456..953a07bb3 100644 --- a/packages/locales/src/langs/zh-CN/ui.json +++ b/packages/locales/src/langs/zh-CN/ui.json @@ -7,7 +7,8 @@ "length": "{0}长度必须为{1}个字符", "alreadyExists": "{0} `{1}` 已存在", "startWith": "{0}必须以 {1} 开头", - "invalidURL": "请输入有效的链接" + "invalidURL": "请输入有效的链接", + "mobile": "请输入正确的{0}" }, "actionTitle": { "edit": "修改{0}",