<!-- 填报资料 -->
<template>
  <div class="bg-[#fff]">
    <a-page-header style="border: 1px solid rgb(235, 237, 240)" @back="router.go(-1)">
      <template #backIcon>
        <div><a-button type="primary">返回</a-button></div>
      </template>
      <template #title>
        <div></div>
      </template>
    </a-page-header>
    <!-- <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="资料填报" width="80%" @ok="handleSubmit" destroyOnClose> -->
    <a-collapse v-model:activeKey="activeKey" :bordered="false" class="!bg-[#fff]">
      <a-collapse-panel key="1" header="地块信息" :forceRender="true">
        <DkTable :data="dsInfor.wrdkjbxxb" ref="childrenOne" />
      </a-collapse-panel>

      <a-collapse-panel key="2" header="风险评估报告基本信息" :forceRender="true">
        <suBainForm ref="chilrenReport" :data="dsInfor.fxpg" />
        <template #extra><a-button type="primary" @click.prevent="saveReport($event)">保存</a-button></template>
      </a-collapse-panel>

      <a-collapse-panel header="风险评估报告编制单位基本信息" :forceRender="true" v-for="(item, index) in unitMessageFormList" :key="index + 4">
        <unitMessageForm :ref="(el) => childRef(el, index)" :data="item" />
        <template #extra>
          <a-button type="primary" @click.prevent="addUnitMessageFormList($event)">添加</a-button>
          <a-button type="primary" class="ml-5" v-if="index != 0" @click.prevent="delMessageFormList($event, index)">删除</a-button>
          <a-button type="primary" @click.prevent="suBainFormAddEdit($event, index)" style="margin-left: 10px">保存</a-button>
        </template>
      </a-collapse-panel>

      <a-collapse-panel header="土壤和地下水环境风险信息" :forceRender="true" key="120000">
        <EditTrwr ref="chilrenMgst" :data="dsInfor?.trhjfxxx" />
        <template #extra><a-button type="primary" @click.prevent="saveTrhj($event)">保存</a-button></template>
      </a-collapse-panel>
      <a-collapse-panel header="风险评估文件上传" :forceRender="true" key="140000">
        <CdUpload
          :data="{ ...dsInfor.fxpg, scjdbm: 'S3' }"
          labelFirst="风险评估"
          :dkxx="dsInfor.wrdkjbxxb"
          :objec="[
            {
              name: '公示截图',
            },
            { name: '风险评估报告' },
          ]"
          @upsuccess="handleUpSuccess"
        />
      </a-collapse-panel>
      <a-collapse-panel header="填报进度" :forceRender="true" key="150000">
        <fillProgress :List="dsInfor?.lzjd"></fillProgress>
      </a-collapse-panel>
    </a-collapse>
  </div>
  <!-- </BasicDrawer> -->
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import DkTable from '/@/components/customComponent/DkTable.vue';
  import suBainForm from '/@/components/customComponent/fxpg/pgReport.vue';
  import unitMessageForm from '/@/components/customComponent/unitMessageForm.vue';
  import EditTrwr from '/@/components/customComponent/fxpg/trfx.vue';
  import CdUpload from '/@/components/customComponent/CdUpload.vue';
  import { useMessage } from '/@/hooks/web/useMessage';
  import fillProgress from '/@/components/customComponent/fillProgress.vue';
  import { plotDetails, updateBzdw, delBzdw, saveGTrhjfxxx, saveGFxpg } from '/@/api/common/api';
  import { useRouter } from 'vue-router';
  import { nextTick } from 'vue';

  let router = useRouter();

  const { createMessage } = useMessage();
  const wrdkid = ref(router.currentRoute.value.query.wrdkid);
  let unitMessageFormList = ref([{ id: null }]);
  // 获取地块信息
  const dsInfor = ref<any>({
    jcdw: [],
    bzdw: [],
    cbdc: {},
    xxdc: {},
    wrdkjbxxb: {},
  });
  async function getdkInfor() {
    dsInfor.value = await plotDetails({
      wrdkid: wrdkid.value,
      scjdbm: 'S3',
    });
    saveFlg.value = true;
    unitMessageFormList.value = dsInfor.value.bzdw;

    if (unitMessageFormList.value.length == 0) unitMessageFormList.value.push({ id: null });
  }
  getdkInfor();

  const handleUpSuccess = ()=>{
    // getdkInfor();
  }
  const childrenOne = ref<any>(null);

  const activeKey = ref(['1', '2', '3', '4', '5', '6', '120000', '140000', '150000']);

  //风险评估报告基本信息
  const chilrenReport = ref<any>(null);
  async function saveReport(event) {
    event.stopPropagation();
    const res = await chilrenReport?.value.getFormValueFxpg();
    res.wrdkid = wrdkid.value;
    const reg = /^(http|https):\/\/(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}|localhost|[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z]{2,})(:\d{2,5})?(\/\S*)?$/;
    if (res.gsfs == 1) {
      if (!res.gswz) {
        createMessage.warn('请填写网址');
        return;
      }
      if (!reg.test(res.gswz)) {
        createMessage.warn('请输入正确的网址');
        return false;
      }
    }
    await saveGFxpg(res);
  }
  // 土壤环境信息
  const saveFlg = ref(true);
  const chilrenMgst = ref<any>(null);

  async function saveTrhj(event) {
    event.stopPropagation();
    try {
      if (saveFlg.value) {
        saveFlg.value = false;
        const res = await chilrenMgst?.value.getFormValueTrhj();
        if (!res) {
          saveFlg.value = true;
          return
        }
        if (res.wrmj > dsInfor.value.wrdkjbxxb.zdmj) {
          createMessage.warn('风险管控修复土壤污染面积不能超过地块占地面积');
          saveFlg.value = true;
          return false;
        }
        res.wrdkid = wrdkid.value;
        if (dsInfor?.value?.trhjfxxx?.id) res.id = dsInfor.value.trhjfxxx.id;
        const id = await saveGTrhjfxxx(res);
        if (!dsInfor.value.trhjfxxx) {
          dsInfor.value.trhjfxxx = {};
          dsInfor.value.trhjfxxx.id = id;
        }
        saveFlg.value = true;
      } else {
        createMessage.warn('数据更新中请稍后点击');
      }
    } catch {
      saveFlg.value = true;
    }
  }
  // 编制单位开始
  const childrenBzd = ref<any>([]);
  const childRef = (el, index) => {
    if (el) childrenBzd.value[index] = el;
  };
  const callChildMethod = (index) => {
    childrenBzd.value[index].getFormValueBz();
  };
  function addUnitMessageFormList(event) {
    event.stopPropagation();
    unitMessageFormList.value.push({ id: null });
    nextTick(() => {
      callChildMethod(unitMessageFormList.value.length - 1);
    });
  }
  async function delMessageFormList(event, index) {
    event.stopPropagation();
    if (unitMessageFormList.value[index].id) {
      await delBzdw({ id: unitMessageFormList.value[index].id });
    }
    unitMessageFormList.value.splice(index, 1);
    childrenBzd.value.splice(index, 1);
    // getdkInfor();
  }
  async function suBainFormAddEdit(event, index) {
    event.stopPropagation();
    try {
      const res = await childrenBzd.value[index].getFormValueBz();
      res.wthtje = String(res.wthtje);
      res.scjdbm = 'S3';
      res.jgtype = 'bzdw';
      // 新增的时候没有这个值
      res.wrdkid = wrdkid.value;
      if (saveFlg.value) {
        saveFlg.value = false;
        const id = await updateBzdw(res);
        if (id != '成功') {
          unitMessageFormList.value[index] = res;
          unitMessageFormList.value[index].id = id;
        }
        saveFlg.value = true;
        // getdkInfor();
      } else {
        createMessage.warn('数据更新中请稍后点击');
      }
    } catch {
      saveFlg.value = true;
    }
  }
</script>

<style lang="less" scoped>
  :deep(.ant-collapse-borderless) {
    width: 100%;
  }
</style>
