<!-- 查看基本信息 -->
<template>
  <!-- <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="资料填报"  width="80%" @ok="handleSubmit" destroyOnClose> -->
  <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>
          <a-space>
            <a-button type="primary" v-if="userInfo.userIdentity <= 3" @click="backHistory('xdyj')">下达意见</a-button>
            <a-button type="primary" v-if="userInfo.userType != 'S'" @click="backHistory('bjzdyj')">边界指导意见</a-button>
            <a-button type="primary" @click="backHistory('tg')">退改历史</a-button>
          </a-space>
        </div>
      </template>
    </a-page-header>
    <a-tabs v-model:activeKey="active" type="card">
      <a-tab-pane key="1" tab="详情">
        <div class="w-100% h-[calc(100vh-245px)] overflow-y-auto" style="position:relative">
          <div class="title pl-4 pb-4" style="position: sticky;top: 0px;background-color: #fff;z-index: 999;font-size: 16px;font-weight: 500;">{{ data?.wrdkjbxxb?.wrdkmc }} — {{ data?.wrdkjbxxb?.wrdkbm }}</div>
          <a-collapse v-model:activeKey="activeKey" :bordered="false">
            <a-collapse-panel key="1" header="地块信息" v-if="data.wrdkjbxxb">
              <DkTable :data="data.wrdkjbxxb" />
            </a-collapse-panel>
            <a-collapse-panel key="2" header="风险评估报告基本信息">
              <suBainTable :data="data.fxpg" :scjd="'风险评估'" />
            </a-collapse-panel>
            <a-collapse-panel :key="'3-' + index" header="风险评估报告编制单位基本信息" v-for="(item, index) in data.bzdw">
              <unitMessageTable :data="item" title="编制单位报告" />
            </a-collapse-panel>
            <a-collapse-panel key="4" header="土壤和地下水环境风险信息">
              <!-- <soilMessageTable :data="data.trhjfxxx" /> -->
              <EditTrwrDetail  :data="data.trhjfxxx" />
            </a-collapse-panel>
            <a-collapse-panel key="5" header="风险评估文件上传">
              <CdUpload
                :data="{ ...data.fxpg, scjdbm: 'S3' }"
                :dksdzt="param.dksdzt"
                :dkxx="data.wrdkjbxxb"
                labelFirst="风险评估"
                :visibleFlag="false"
                :objec="[
                  {
                    name: '公示截图',
                  },
                  { name: '风险评估报告' },
                ]"
                @upsuccess="handleUpSuccess"
              />
            </a-collapse-panel>
            <a-collapse-panel key="6" header="填报进度">
              <fillProgress :List="data.lzjd" />
            </a-collapse-panel>
          </a-collapse>
        </div>
      </a-tab-pane>
      <a-tab-pane key="2" tab="评审信息">
        <div class="w-100% h-[calc(100vh-245px)] overflow-y-auto" style="position:relative">
          <div class="title pl-4 pb-4" style="position: sticky;top: 0px;background-color: #fff;z-index: 999;font-size: 16px;font-weight: 500;">{{ data?.wrdkjbxxb?.wrdkmc }} — {{ data?.wrdkjbxxb?.wrdkbm }}</div>
          <div class="w-[98%] mx-auto" v-if="data?.ps">
            <a-divider orientation="left">最近一次评审信息</a-divider>
            <Border title="评审材料" v-model="isreview">
              <!-- 默认是可以编辑，disabled:true，代表该表单不能编辑 -->
              <MaterialUpload class="w-[98%] mx-auto" :data="data?.ps" :wrdkjbxx="data?.wrdkjbxxb" :disabled="true" v-show="isreview" />
            </Border>
            <!-- 专家组意见 -->
            <Border title="专家组意见" v-model="isexpert">
              <ViewZjz class="w-[98%] mx-auto" :data="data?.ps?.zjz || []" :dcjdPsfs="data?.ps?.dcjdPsfs" v-show="isexpert" />
            </Border>
            <!-- 参会人员信息 -->
            <Border title="参会人员信息" v-model="isparticipant">
              <ViewChry class="w-[98%] mx-auto" :data="data?.ps?.chry || []" :dcjdPsfs="data?.ps?.dcjdPsfs" v-show="isparticipant" />
            </Border>
            <!-- 归档材料信息 -->
            <Border title="归档材料信息" v-model="ismaterial">
              <ViewGdcl class="w-[98%] mx-auto" :data="data?.ps?.gdcl || []" v-show="ismaterial" />
            </Border>
            <!-- 复核评审 -->
            <Border title="复核评审信息" v-model="ispsfh">
              <ViewFhps class="w-[98%] mx-auto" :data="data?.fh || []" v-show="ispsfh" />
            </Border>
            <HistoryInfo :wrdkid="param.wrdkid" :pgtype="param.pgtype" scjdbm="S3" />
          </div>
          <div v-else class="text-center py-5">暂无评审信息</div>
        </div>
      </a-tab-pane>
    </a-tabs>
    <History @register="registerModal" />
    <AdviceModal @register="registerAdviceModal"></AdviceModal>
  </div>
  <!-- </BasicDrawer> -->
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import DkTable from '/@/components/customComponent/DkTable.vue';
  import suBainTable from '/@/components/customComponent/fxpg/fxpgInfro.vue';
  import unitMessageTable from '/@/components/customComponent/unitMessageTable.vue'; // 单位检测信息请传不同的obj
  // import soilMessageTable from '/@/components/customComponent/fxpg/trfxView.vue';
  import EditTrwrDetail from '/@/components/customComponent/fxpg/trfxDetail.vue';
  // import dkbjfileUpload from '/@/components/customComponent/CdUpload.vue';
  import CdUpload from '/@/components/customComponent/CdUpload.vue';
  import fillProgress from '/@/components/customComponent/fillProgress.vue';
  import MaterialUpload from './components/MaterialUpload.vue';
  import Border from '/@/components/customComponent/Border.vue'; // 公共组件
  import ViewZjz from '/@/views/dkgl/investigate/components/ViewZjz.vue'; // 公共组件
  import ViewChry from '/@/views/dkgl/investigate/components/ViewChry.vue'; // 公共组件
  import ViewGdcl from '/@/components/customComponent/ViewGdcl.vue'; // 公共组件
  import ViewFhps from '/@/components/customComponent/ViewFhps.vue';
  import HistoryInfo from '/@/components/customComponent/HistoryInfo.vue'; // 公共组件
  import History from '@/components/customComponent/History.vue';
  import { useUserStore } from '/@/store/modules/user';
  import AdviceModal from '@/components/customComponent/AdviceModal.vue';
  import { useModal } from '/@/components/Modal';

  import { useRouter } from 'vue-router';
  import { plotDetails } from '/@/api/common/api';

  const [registerModal, { openModal }] = useModal();
  const [registerAdviceModal, { openModal: openAdviceModal }] = useModal();
  const { userInfo }: any = useUserStore();
  let router = useRouter(); // 注册路由
  const data = ref<any>({});
  const param = ref<any>(router.currentRoute.value.query);

  // 评审信息
  const isreview = ref(true);
  const isexpert = ref(true);
  const isparticipant = ref(true);
  const ismaterial = ref(true);
  const ispsfh = ref(true);

  //手风琴
  const activeKey = ref(['1', '2', '4', '5', '6']);
  const active = ref('1');
  getInfor();
  
  const handleUpSuccess = ()=>{
    // getInfor();
  }
  // 获取地块基本信息
  async function getInfor() {
    data.value = await plotDetails({
      wrdkid: param.value.wrdkid,
      scjdbm: 'S3',
    });
    //  默认展开所有面板
    const prefixes = ['3-'];
    const arrays = [data.value.bzdw];
    for (let i = 0; i < arrays.length; i++) {
      arrays[i].forEach((el, index) => {
        console.log(el);
        activeKey.value.push(prefixes[i] + index);
      });
    }
  }
  // 点击退改历史退回意见
  function backHistory(v) {
    let obj: any = {
      wrdkid: param.value.wrdkid,
      scjdbm: 'S3',
      jdnzt: data.value.jdnzt,
    };
    if (v == 'tg') {
      openModal(true, {
        record: obj,
        showFooter: true,
      });
    } else if (v == 'xdyj') {
      obj.title = '下达意见';
      openAdviceModal(true, {
        record: obj,
        showFooter: true,
      });
    } else if (v == 'bjzdyj') {
      obj.title = '边界指导意见';
      openAdviceModal(true, {
        record: obj,
        showFooter: true,
      });
    }
  }
</script>
<style lang="less" scoped>
  :deep(.ant-collapse-borderless) {
    width: 100%;
  }
</style>
