import { reactive, ref, watchEffect } from "vue";
import { ElForm, FormRules } from "element-plus";

type Param = {
  callback: (...args: any[]) => any;
  failStatus: string;
  requiredRemark?: boolean;
};

export function useReviewProcess({ callback, failStatus, requiredRemark }: Param) {
  const formData = reactive({ status: "", remark: "" });
  const formRef = ref<InstanceType<typeof ElForm>>(null);

  const formRules = reactive<FormRules>({
    status: [{ required: true, trigger: "change", message: "请选择审核状态" }],
    remark: [{ required: true, trigger: "change", message: "请输入备注" }]
  });

  const handleChangeStatus = () => {
    formRef.value.validate(isValid => isValid && callback());
  };

  //不通过时备注为必填
  if (!requiredRemark) {
    watchEffect(() => (formRules.remark[0].required = formData.status === failStatus));
  }

  return {
    formRef,
    formRules,
    formData,
    handleChangeStatus
  };
}
