mingnan/src/pages/inhert/intangible/details.vue

<template>
  <DetailTabPage
    :load="load"
    :extraTabs="[
      {
        id: 5,
        name: '传习所',
        visible: true,
      },
      {
        id: 6,
        name: '传承人',
        visible: true,
      },
      {
        id: 7,
        name: '非遗作品',
        visible: true,
      }
    ]"
  >
    <template #extraTabs="{ content, tabCurrentId }">
      <template v-if="tabCurrentId==5">
        <!-- 非遗传习中心 -->
        <CommonListPage 
          :showSearch="false"
          :hasBg="false"
          :load="(page: number, pageSize: number) => loadSubList(page, pageSize, content, 'ichSitesList')"
          :detailsParams="{
            mainBodyColumnId: SeminarContent.mainBodyColumnId,
            modelId: SeminarContent.modelId,
          }"
        />
      </template>
      <template v-else-if="tabCurrentId==6">
        <!-- 非遗传承人 -->
        <CommonListPage 
          :showSearch="false"
          :hasBg="false"
          :load="(page: number, pageSize: number) => loadSubList(page, pageSize, content, 'inheritorsList')"
          detailsPage="/pages/inhert/inheritor/details"
          :detailsParams="{
            mainBodyColumnId: InheritorContent.mainBodyColumnId,
            modelId: InheritorContent.modelId,
          }"
        />
      </template>
      <template v-else-if="tabCurrentId==7">
        <!-- 非遗产品(作品) -->
        <CommonListPage 
          :showSearch="false"
          :hasBg="false"
          :load="(page: number, pageSize: number) => loadSubList(page, pageSize, content, 'associationMeList')"
          detailsPage="/pages/inhert/intangible/details"
          :detailsParams="{
            mainBodyColumnId: ProductsContent.mainBodyColumnId,
            modelId: ProductsContent.modelId,
          }"
        />
      </template>
    </template>
    <template #titleEnd="{ content }">
      <u-tag 
        v-if="content.levelText"
        :text="content.levelText"
        size="mini" plain color="#d9492e"
        class="flex-shrink-0"
      />
    </template>
    <template #titleExtra="{ content }">
      <view class="d-flex flex-col">
        <IntroBlock 
          small
          :descItems="[
            {
              label: '项目级别',
              value: content.levelText ,
            },
            {
              label: '项目类别',
              value: content.ichTypeText,
            },
            {
              label: '批次时间',
              value: content.batchText,
            },
            {
              label: '所属区域',
              value: content.regionText ,
            },
            {
              label: '保护单位',
              value: content.unit 
            },
          ]"
        />
      </view>
    </template>
  </DetailTabPage>
</template>
<script setup lang="ts">
import DetailTabPage from "@/pages/article/common/DetailTabPage.vue";
import ProjectsContent from "@/api/inheritor/ProjectsContent";
import CommonListPage from "@/pages/article/common/CommonListPage.vue";
import type { TabControlItem } from "@/common/composeabe/TabControl";
import type { Ref } from "vue";
import InheritorContent from "@/api/inheritor/InheritorContent";
import ProductsContent from "@/api/inheritor/ProductsContent";
import SeminarContent from "@/api/inheritor/SeminarContent";
import IntroBlock from "@/pages/article/common/IntroBlock.vue";
import { useLoadQuerys } from "@/common/composeabe/LoadQuerys";

async function load(id: number, tabsArray: Ref<TabControlItem[]>) {
  const d = await ProjectsContent.getContentDetail(
    id, 
    undefined, 
    querys.value.modelId > 0 ? querys.value.modelId : undefined
  );
  tabsArray.value[4].visible = Boolean(d.ichSitesList && (d.ichSitesList as any[]).length > 0);
  tabsArray.value[5].visible = Boolean(d.inheritorsList && (d.inheritorsList as any[]).length > 0);
  tabsArray.value[6].visible = Boolean(d.associationMeList && (d.associationMeList as any[]).length > 0);
  return d;
}
async function loadSubList(page: number, pageSize: number, content: any, subList: string) {
  const list = (content[subList] as any[] || [])
    .slice((page - 1) * pageSize, page * pageSize);

  if (subList == 'associationMeList') {
    list.forEach((p) => {
      p.bottomTags = [
        p.levelText,
        p.ichTypeText,
        p.batchText,
      ];
    })
  } else if (subList == 'ichSitesList') {
    list.forEach((p) => {
      p.bottomTags = [
        content.levelText,
        content.ichTypeText,
      ];
    })
  } else if (subList == 'inheritorsList') {
    list.forEach((p) => {
      p.bottomTags = [
        p.levelText,
        p.nation,
        content.ichTypeText,
      ];
    }) 
  }
  return {
    list,
    total: list.length,
  }
}

const { querys } = useLoadQuerys({ modelId: 0 })
</script>

<style lang="scss">

</style>