<script setup lang="tsx">
import { Form, FormSchema } from '@/components/Form';
import { useForm } from '@/hooks/web/useForm';
import { PropType, reactive, watch } from 'vue';
import { useValidator } from '@/hooks/web/useValidator';
import { getCsckCheckType } from '@/api/csck/CsckCheckRule';
import { transfDictList } from '@/utils';
import useSystemGroupVersion from '@/hooks/web/useSystemGroupVersion';
const { required } = useValidator();

const props = defineProps({
  currentRow: {
    type: Object as PropType<any>,
    default: () => null,
  },
  actionType: {
    type: String,
    default: 'add',
  },
});

const { formRegister, formMethods } = useForm();
const { setValues, getFormData, getElFormExpose } = formMethods;

const { formItem } = useSystemGroupVersion(formMethods, { disabled: props.actionType === 'edit' }, props);

const formSchema = reactive<FormSchema[]>([
  ...formItem,
  {
    field: 'pkid',
    label: '主键',
    component: 'Input',
    hidden: true,
  },
  {
    field: 'checkRuleName',
    label: '校验规则名称',
    component: 'Input',
    componentProps: {},
  },
  {
    field: 'ruleMakingOrgan',
    label: '规则编制机构',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'RuleConfigOrg_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'riskLevel',
    label: '风险等级',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'RiskType_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'attentionDegree',
    label: '官方关注度',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'AttentType_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'businessType',
    label: '业务类型',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'BusinessType_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'frequency',
    label: '执行频度',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'DataStoreFrequency_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'comparator',
    label: '比较符',
    component: 'Select',
    optionApi: async () => {
      const res = await getCsckCheckType({ paramName: 'CheckCompareType_param', systemCode: 'system' });
      return transfDictList(res.body.result);
    },
  },
  {
    field: 'faultTolerance',
    label: '容差范围',
    component: 'Input',
    componentProps: {},
  },
  {
    field: 'ruleCode',
    label: '规则编码',
    component: 'Input'
  },
  {
    field: 'startDate',
    label: '开始日期',
    componentProps: {
      type: 'date',
      valueFormat: 'YYYYMMDD',
    },
    component: 'DatePicker',
    formItemProps: {
      rules: [required()],
    },
  },
  {
    field: 'endDate',
    label: '结束日期',
    componentProps: {
      type: 'date',
      valueFormat: 'YYYYMMDD',
    },
    component: 'DatePicker',
    formItemProps: {
      rules: [required()],
    },
  },
  {
    field: 'ruleDesc',
    label: '规则描述',
    component: 'Input',
    colProps: { span: 24 },
    componentProps: {
      type: 'textarea',
    },
  },
  {
    field: 'isEnable',
    label: '是否启用',
    component: 'Switch',
    componentProps: {
      inlinePrompt: true,
      activeText: '是',
      activeValue: '0',
      inactiveText: '否',
      inactiveValue: '1',
    },
  },
  {
    field: 'isEnforcement',
    label: '是否法定校验',
    component: 'Switch',
    componentProps: {
      inlinePrompt: true,
      activeText: '是',
      activeValue: 'Y',
      inactiveText: '否',
      inactiveValue: 'N',
    },
  },
]);

const rules = reactive({
  system_version: [required()],
  checkRuleName: [required()],
  ruleMakingOrgan: [required()],
  comparator: [required()],
  riskLevel: [required()],
  attentionDegree: [required()],
  businessType: [required()],
  frequency: [required()],
  ruleCode: [required()],

});

const submit = async () => {
  const elForm = await getElFormExpose();
  const valid = await elForm?.validate().catch(err => {
    console.log(err);
  });
  if (valid) {
    const formData = await getFormData();
    return formData;
  }
};

watch(
  () => props.currentRow,
  currentRow => {
    if (!currentRow) return;
    setValues(currentRow);
  },
  {
    deep: true,
    immediate: true,
  },
);

defineExpose({
  submit,
});
</script>

<template>
  <Form :rules="rules" @register="formRegister" :schema="formSchema" />
</template>
