<template>
  <BasicModal v-bind="$attrs" @register="registerModal" @ok="handleSubmit" :title="title" width="50%">
    <BasicForm @register="registerForm"> </BasicForm>
  </BasicModal>
</template>
<!-- 预受理 -->
<script lang="ts" setup>
  import { ref, unref } from 'vue';
  import { FormSchema } from '/@/components/Table';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { tcsq } from '/@/api/common/api';

  // Emits声明

  const emit = defineEmits(['register', 'success']);

  const isUpdate = ref(true);
  const AdviceFormSchema: FormSchema[] = [
    { label: '污染地块ID', field: 'wrdkid', component: 'Input', show: false },
    { label: 'pgtype', field: 'pgtype', component: 'Input', show: false },
    {
      label: '是否后期监测',
      field: 'sfhqjc',
      component: 'Select',
      required: true,
      componentProps: ({ formModel, formActionType }) => {
        return {
          options: [
            {
              label: '是',
              value: '1',
            },
            {
              label: '否',
              value: '0',
            },
          ],
          onChange: (val) => {
            handleCheck(val, formModel, formActionType);
          },
        };
      },
    },
    {
      label: '后期管理类型',
      field: 'hqgllx',
      component: 'Select',
      componentProps: {
        options: [
          {
            label: '仅管控地下水',
            value: '仅管控地下水',
          },
          {
            label: '土壤未达到一类用地筛选值',
            value: '土壤未达到一类用地筛选值',
          },
          {
            label: '阻隔填埋',
            value: '3',
          },
          {
            label: '其他风险管控措施',
            value: '其他风险管控措施',
          },
          {
            label: '无需后期监管',
            value: '无需后期监管',
          },
        ],
      },
    },
    {
      label: '后期监管具体要求',
      field: 'hqjgjtyq',
      component: 'Input',
    },
    {
      label: '后期管理责任主体',
      field: 'hqglzrzt',
      component: 'Input',
    },
    {
      label: '风险管控和修复指标',
      field: 'fxgkhxfjb',
      component: 'Input',
    },
    {
      label: '监测时限要求',
      field: 'jcsxyq',
      component: 'Input',
    },
    {
      label: '备注',
      field: 'bz',
      component: 'InputTextArea',
      colProps: { span: 24 },
      componentProps: {
        rows: 5,
      },
    },
  ];
  //表单配置
  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
    labelWidth: 220,
    schemas: AdviceFormSchema,
    showActionButtonGroup: false,
    baseColProps: { span: 12 },
  });
  //表单赋值
  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
    //重置表单
    await resetFields();
    setModalProps({ confirmLoading: false, showCancelBtn: data?.showFooter, showOkBtn: data?.showFooter });
    isUpdate.value = !!data?.isUpdate;
    if (unref(isUpdate)) {
      //表单赋值
      await setFieldsValue({
        ...data.record,
      });
    }
  });
  //设置标题
  const title = ref('申请退出');

  // 选择的时候必填项出路i
  function handleCheck(val, formModel, formActionType) {
    const { updateSchema } = formActionType;
    if (val == '1') {
      updateSchema({
        field: 'jcsxyq',
        required: true,
      });
      updateSchema({
        field: 'fxgkhxfjb',
        required: true,
      });
      updateSchema({
        field: 'hqglzrzt',
        required: true,
      });
      updateSchema({
        field: 'hqjgjtyq',
        required: true,
      });
      updateSchema({
        field: 'hqgllx',
        required: true,
      });
    } else {
      formModel.jcsxyq = '';
      formModel.fxgkhxfjb = '';
      formModel.hqglzrzt = '';
      formModel.hqjgjtyq = '';
      formModel.hqgllx = null;
      formModel.bz = '';
      updateSchema({
        field: 'jcsxyq',
        required: false,
      });
      updateSchema({
        field: 'fxgkhxfjb',
        required: false,
      });
      updateSchema({
        field: 'hqglzrzt',
        required: false,
      });
      updateSchema({
        field: 'hqjgjtyq',
        required: false,
      });
      updateSchema({
        field: 'hqgllx',
        required: false,
      });
    }
  }
  //表单提交事件
  async function handleSubmit() {
    try {
      let values = await validate();
      setModalProps({ confirmLoading: true });
      //提交表单
      await tcsq(values);
      //关闭弹窗
      closeModal();
      emit('success');
    } finally {
      setModalProps({ confirmLoading: false });
    }
  }
</script>

<style lang="less" scoped></style>
