<template>
  <div style="height: 100%;">
    <card01 :title="object.ojbNm + ''" icon="label" :description="renderData(object, objectConfig.description2)" />
    <van-collapse class="pblm-list-wrapper" v-model="activeNames">
      <van-collapse-item v-for="item in list" :key="item.id" :name="item.id">
        <template #title>
          <div>{{ item.name }}&nbsp;&nbsp;<van-tag v-if="item.pblmList && item.pblmList.length > 0" round type="primary">{{item.pblmList.length}}</van-tag></div>
        </template>
        <card01 v-for="pblm in item.pblmList" :key="pblm.pblmId" :title="pblm.pblmNm" icon="question"
        @click="jumpPage(`/problem/${item.pblmId}`)" />
      </van-collapse-item>
    </van-collapse>
  </div>
</template>
<script setup>
import { onMounted, ref } from "vue";
import { useRoute } from "vue-router";
import card01 from '@/components/card01.vue';
import { getTacQuestionList } from "@/api/inspect";
import { getBaseByInspectType } from "@/assets/js/base";
import { renderData } from "@/utils/template";
import { jumpPage } from "@/utils/page";

const route = useRoute();
const activeNames = ref(['1']);
const list = ref([
  { id: '1', name: '前期与设计专业', pblmList:[] },
  { id: '2', name: '建设管理专业', pblmList:[] },
  { id: '3', name: '计划下达与执行专业', pblmList:[] },
  { id: '4', name: '资金使用与管理专业', pblmList:[] },
  { id: '5', name: '工程质量专业', pblmList:[] },
  { id: '6', name: '工程安全专业', pblmList:[] }
]);
const loading = ref(false);
const inspectType = route.query.inspectType;
const object = ref(JSON.parse(route.query.object));
const objectConfig = ref(getBaseByInspectType(inspectType));

function getData() {
  getTacQuestionList(route.params.objId).then(res => {
    list.value.forEach(item => {
      item.pblmList = res.data.list.filter(pblm => pblm.listType === item.id);
    })
    loading.value = false;
  })
}

onMounted(() => {
  getData();
})
</script>
<style lang="scss" scoped>
.inspect-object-wrapper {
  width: 100%;
  height: 100%;
  overflow: auto;
}
</style>
<style lang="scss">
.pblm-list-wrapper{
  padding: 0 10px;
  .van-collapse-item__content{
  padding: 0;
  background-color: transparent;
}
}

</style>