<template>
  <BasicForm @register="registerForm" />
</template>
<script lang="ts" name="dkgl-gkxfpg-MaterialUpload" setup>
  //引入依赖
  import { useForm, BasicForm, FormSchema } from '/@/components/Form';
  import { watch, nextTick, defineEmits } from 'vue';
  import { useRouter } from 'vue-router';
  import { useMessage } from '/@/hooks/web/useMessage';

  const { createMessage } = useMessage();

  const emit = defineEmits(['changePsfs']);
  const router = useRouter();
  const props = defineProps({
    data: {
      type: Object,
    },
    wrdkjbxx: {
      type: Object,
    },
    disabled: {
      type: Boolean,
      default: false, // 默认可以编辑
    },
    dksdzt: {
      type: String,
      default: '',
    },
  });

  //自定义表单字段
  const formSchemas: FormSchema[] = [
    {
      label: '评审方式',
      field: 'dcjdPsfs',
      component: 'Select',
      required: true,
      ifShow: router.currentRoute.value.query.isnyd2yzlg === '1',
      componentProps: () => {
        return {
          disabled: props.disabled,
          options: [
            { label: '专家评审', value: 1 },
            { label: '其他评审方式', value: 2 },
          ],
          onChange: (e) => {
            emit('changePsfs', e);
          },
        };
      },
    },
    {
      label: '第几次评审',
      field: 'pscs',
      component: 'Input',
      required: true,
      componentProps: {
        disabled: true,
      },
    },
    {
      label: '会议时间',
      field: 'hysj',
      component: 'DatePicker',
      required: true,
      componentProps: {
        disabled: props.disabled,
        showTime: false,
        valueFormat: 'YYYY-MM-DD',
        placeholder: '',
      },
    },
    {
      label: '会议地点',
      field: 'hydd',
      component: 'Input',
      required: true,
      componentProps: {
        disabled: props.disabled,
      },
    },
    {
      label: '会议组织方',
      field: 'hyzzf',
      component: 'Input',
      required: true,
      componentProps: {
        disabled: props.disabled,
      },
    },
    // 抽查的报告
    {
      label: '评审结论',
      field: 'tgjgg',
      component: 'Select',
      required: true,
      ifShow: () => {
        return props.dksdzt == '1' || props?.data?.dksdzt == 1;
      },
      componentProps: {
        disabled: props.disabled,
        options: [
          { label: '通过', value: 1 },
          { label: '不通过', value: 0 },
        ],
      },
    },
    {
      label: '报告是否通过',
      field: 'tgjg',
      component: 'Select',
      required: true,
      ifShow: () => {
        return props.dksdzt != '1' && props?.data?.dksdzt != 1;
      },
      componentProps: ({ formActionType, formModel }) => {
        return {
          disabled: props.disabled,
          options: [
            { label: '通过，无需修改', value: 1 },
            { label: '通过但需修改', value: 2 },
            { label: '未通过', value: 0 },
          ],
          onChange: async (e) => {
            const { updateSchema, validate } = formActionType;
            let options = await changeTgjg(e);
            updateSchema([
              {
                field: 'shjg',
                componentProps: {
                  options,
                },
              },
            ]);
            formModel.shjg = null;
            await validate(['tgjg', 'shjg']);
          },
        };
      },
    },
    {
      label: '报告结论',
      field: 'shjg',
      component: 'Select',
      ifShow: () => {
        console.log(props?.data?.dksdzt, 'props?.data?.dksdzt');
        return props.dksdzt != '1' && props?.data?.dksdzt != 1;
      },
      required: true,
      colProps: { span: 12 },
      componentProps: {
        disabled: props.disabled,
        options: [],
      },
    },
    {
      label: '评审文件',
      field: 'shfj',
      component: 'JUpload',
      required: true,
      colProps: { span: 24 },
      componentProps: () => {
        return {
          disabled: props.disabled,
          maxCount: 1,
          tipArr: ['(提示：提交的文件包括但不限于：广东省建设用地土壤污染状况调查报告审查评价表、建设用地土壤污染状况初步调查监督检查意见单、专家签名表等，压缩为一个.zip文件上传）'],
          replaceLastOne: true,
          showUploadList: false,
          fileName: props?.wrdkjbxx?.wrdkmc+"—风险管控及修复效果评估评审文件",
          accept: '.rar,.zip',
          beforeUpload: (file) => {
            let isshow = false;
            const isFile = file.name.split('.')[file.name.split('.').length - 1];
            if (isFile == 'rar' || isFile == 'zip') {
              isshow = true;
            } else {
              createMessage.error('只能上传.pdf/.zip格式的文件');
              isshow = false;
            }

            return isshow;
          },
        };
      },
    },
    {
      label: '专家意见',
      field: 'zjyj',
      component: 'InputTextArea',
      required: true,
      colProps: { span: 24 },
      componentProps: {
        disabled: props.disabled,
        placeholder: '请输入专家意见(最少10个字)',
      },
    },
    {
      label: '意见和结论',
      field: 'xgpgJielun',
      component: 'InputTextArea',
      required: true,
      colProps: { span: 24 },
      componentProps: {
        disabled: props.disabled,
      },
    },
  ];
  /**
   * BasicForm绑定注册;
   */
  const [registerForm, { setFieldsValue, resetFields, validate, clearValidate, updateSchema, getFieldsValue }] = useForm({
    //注册表单列
    schemas: formSchemas,
    //不显示查询和重置按钮
    showActionButtonGroup: false,
    //默认row行配置,当 layout 为 horizontal 生效
    rowProps: { gutter: 24, justify: 'start', align: 'middle' },
    //全局col列占比(每列显示多少位)，和schemas中的colProps属性一致
    baseColProps: { span: 12 },
    //使用labelCol的样式参数来控制标题宽度
    labelCol: { style: { width: '150px' } },
  });
  watch(
    () => props?.data,
    async (val: any) => {
      if (val) {
        await nextTick();
        await setFieldsValue({
          ...props.data,
        });
        let options = await changeTgjg(props?.data?.tgjg);
        updateSchema([
          {
            field: 'shjg',
            componentProps: {
              options,
            },
          },
        ]);
        await clearValidate();
      } else {
        await nextTick();
        await resetFields();
      }
    },
    { deep: true, immediate: true }
  );
  async function changeTgjg(val) {
    let options: any = [];
    if (val === 0) {
      options = [
        { label: '未达到土壤污染风险评估报告确定的风险管控、修复目标，不可以安全利用', value: -1 },
        { label: '不确定，需要进一步补充调查，并再次进行效果评估', value: 0 },
      ];
    } else if (val >= 1) {
      options = [{ label: '达到土壤污染风险评估报告确定的风险管控、修复目标且可以安全利用', value: 1 }];
    } else {
      options = [];
    }
    return options;
  }
  async function getFormValues() {
    const fieldsValue = getFieldsValue();
    return fieldsValue;
  }
  defineExpose({
    validate,
    getFormValues,
  });
</script>
