form.ts 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. import type { VbenFormProps as CoreFormProps } from '@vben/common-ui';
  2. import type { ComponentType } from './component';
  3. import type { VbenFormSchema } from './form-schema';
  4. import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
  5. import { $t } from '@vben/locales';
  6. async function initSetupVbenForm() {
  7. setupVbenForm<ComponentType>({
  8. config: {
  9. // ant design vue组件库默认都是 v-model:value
  10. baseModelPropName: 'value',
  11. // 一些组件是 v-model:checked 或者 v-model:fileList
  12. modelPropNameMap: {
  13. Checkbox: 'checked',
  14. Radio: 'checked',
  15. Switch: 'checked',
  16. Upload: 'fileList',
  17. },
  18. },
  19. defineRules: {
  20. // 输入项目必填国际化适配
  21. required: (value, _params, ctx) => {
  22. if (value === undefined || value === null || value.length === 0) {
  23. return $t('ui.formRules.required', [ctx.label]);
  24. }
  25. return true;
  26. },
  27. // 选择项目必填国际化适配
  28. selectRequired: (value, _params, ctx) => {
  29. if (value === undefined || value === null) {
  30. return $t('ui.formRules.selectRequired', [ctx.label]);
  31. }
  32. return true;
  33. },
  34. },
  35. });
  36. }
  37. type VbenFormProps = Omit<CoreFormProps<ComponentType>, 'schema'> & {
  38. schema?: VbenFormSchema[];
  39. };
  40. function useVbenForm(options: VbenFormProps) {
  41. return useForm<ComponentType>(options as CoreFormProps<ComponentType>);
  42. }
  43. export { initSetupVbenForm, useVbenForm, z };
  44. export type { VbenFormProps, VbenFormSchema };