tld_wms/packages/app/src/pages/goods/table/modal/hooks.ts

import {editDictionary, getDictionaryInfo} from '@apis';
import {yupResolver} from '@hookform/resolvers/yup';
import {useQueryDataInfo} from '@hooks';
import {useMutation} from '@tanstack/react-query';
import {message} from 'antd';
import {useEffect} from 'react';
import {useForm, useFormContext} from 'react-hook-form';
import {number, object, string} from 'yup';

type FormState = {
  goodsType: string,
  goodsSize: number,
  goodsMixin: string,
  goodsRecommend: string,
};

const validate = object({
  goodsType: string().required('请选择物料类型'),
  goodsSize: number().typeError('请输入数字')
    .min(1, '不能小于1个').required('请输入物料存储容量'),
  goodsMixin: string().required('请选择是否混合存储'),
  goodsRecommend: string().required('请选择是否推荐库位'),
});

export function useFormState(
  {visible, id, onClose, onFetch}:
  {onClose: () => void, onFetch: () => void, visible: boolean, id: string},
) {
  const formInstance = useForm<FormState>({
    defaultValues: {goodsType: '', goodsSize: 1, goodsMixin: '', goodsRecommend: ''},
    resolver: yupResolver(validate),
  });

  const {clearErrors, handleSubmit} = formInstance;

  useEffect(function() {
    visible && clearErrors();
  }, [visible, clearErrors]);

  const {isLoading, mutate} = useMutation({
    mutationFn: editDictionary,
    onSuccess({msg}) {
      if (msg === '200') {
        onClose();
        onFetch();
        message.success('修改成功');
      }
    },
  });

  const onSubmit = handleSubmit(function({goodsMixin, goodsSize, goodsType, goodsRecommend}) {
    mutate({
      isNotDisable: goodsMixin,
      size: String(goodsSize),
      id,
      materialType: goodsType,
      isRecommend: goodsRecommend,
    });
  });

  return [{formInstance, isLoading}, {onSubmit}] as const;
}

export function useControl() {
  const {control} = useFormContext<FormState>();

  return control;
}

export function useWatchId(id: string) {
  const {setValue} = useFormContext<FormState>();
  const data = useQueryDataInfo({
    queryFn: getDictionaryInfo,
    params: ['物料字典', id],
    enabled: Boolean(id),
  });

  useEffect(function() {
    setValue('goodsType', data?.wllbClass ?? '');
    setValue('goodsSize', Number(data?.size ?? '1'));
    setValue('goodsMixin', data?.isNotDisable ?? '');
    setValue('goodsRecommend', data?.isRecommend ?? '');
  }, [data, setValue]);
}