xpyy-scm/src/pages/register/hooks.ts

import {toTypedSchema} from '@vee-validate/zod';
import {useForm} from 'vee-validate';
import {Ref} from 'vue';
import {object, string} from 'zod';

type FormState = {
  enterprise: string;
  phone: string;
  idCardImage: string;
  licenseImage: string;
};

const validate = object({
  enterprise: string({errorMap: () => ({message: '请输入企业名称'})})
    .min(1, '请输入企业名称'),
  phone: string({errorMap: () => ({message: '请输入企业名称'})})
    .min(1, '请输入企业名称'),
  idCardImage: string({errorMap: () => ({message: '请上传法人身份证'})})
    .min(1, '请上传法人身份证'),
  licenseImage: string({errorMap: () => ({message: '请上传营业执照'})})
    .min(1, '请上传营业执照'),
});

export function useFormState(isSuccess: Ref<boolean>) {
  const {handleSubmit, handleReset} = useForm<FormState>({
    initialValues: {
      enterprise: '',
      phone: '',
      idCardImage: '',
      licenseImage: '',
    },
    validationSchema: toTypedSchema(validate),
  });

  const onSubmit = handleSubmit(function(value) {
    isSuccess.value = true;
  });

  return {onSubmit, handleReset};
}