minnan/src/pages/introduction/travel.vue

<template>
  <FlexCol :padding="30" backgroundColor="background.page">
    
    <!-- 闽南节庆日历 -->
    <HomeTitle title="闽南节庆日历" showMore @clickMore="navTo('/pages/travel/calendar/index')" />
    <CalendarBlock />

    <!-- 闽南文化景区、景点 -->
    <HomeTitle title="闽南文化景区、景点" showMore @clickMore="navTo('/pages/travel/scenic-spot/list')" />
    <SimplePageContentLoader :loader="spotData">
      <scroll-view scroll-x>
        <FlexCol>
          <Box2LineImageRightShadow
            v-for="(item, i) in spotData.content.value"
            titleColor="title-text"
            fixSize
            :key="i"
            :title="item.title"
            :desc="item.desc"
            :image="item.image"
            :tags="item.bottomTags"
            @click="navTo('/pages/inhert/intangible/details', { id: item.id })"
          />
        </FlexCol>
      </scroll-view>
    </SimplePageContentLoader>

    <!-- 文化旅游路线 -->
    <HomeTitle title="文化旅游路线" showMore @clickMore="goRouteList" />
    <SimplePageContentLoader :loader="routeData">
      <scroll-view scroll-x>
        <view class="pb-3 pt-3 d-flex flex-row overflow-visible align-stretch">
          <Box2LineLargeImageUserShadow
            v-for="(item, i) in routeData.content.value"
            classNames="width-2-3 mr-2"
            titleColor="title-text"
            fixSize
            :key="i"
            :title="item.title"
            :desc="item.desc"
            :image="item.thumbnail || item.image"
            @click="goRouteDetail(item.id)"
          />
        </view>
      </scroll-view>
    </SimplePageContentLoader>

    <!-- 文化产品 -->
    <HomeTitle title="文化产品" showMore @clickMore="goCreativeList" />
    <SimplePageContentLoader :loader="creativeData">
      <scroll-view scroll-x>
        <view class="pb-3 pt-3 d-flex flex-row overflow-visible align-stretch">
          <Box2LineLargeImageUserShadow
            v-for="(item, i) in creativeData.content.value"
            classNames="width-2-3 mr-2"
            titleColor="title-text"
            fixSize
            :key="i"
            :title="item.title"
            :image="item.thumbnail || item.image"
            @click="goCreativeDetail(item.id)"
          />
        </view>
      </scroll-view>
    </SimplePageContentLoader>
  </FlexCol>
</template>

<script setup lang="ts">
import { navTo } from '@/components/utils/PageAction';
import { useSimpleDataLoader } from '@/common/composeabe/SimpleDataLoader';
import { useHomePageMiniCommonListGoMoreAndGoDetail } from '../article/common/CommonContent';
import { GetContentListParams } from '@/api/CommonContent';
import SimplePageContentLoader from '@/common/components/SimplePageContentLoader.vue';
import FlexCol from '@/components/layout/FlexCol.vue';
import HomeTitle from '../parts/HomeTitle.vue';
import Box2LineLargeImageUserShadow from '../parts/Box2LineLargeImageUserShadow.vue';
import Box2LineImageRightShadow from '../parts/Box2LineImageRightShadow.vue';
import InheritorContent from '@/api/inheritor/InheritorContent';
import ProjectsContent from '@/api/inheritor/ProjectsContent';
import CalendarBlock from '../travel/calendar/block.vue';
import SeminarContent from '@/api/inheritor/SeminarContent';
import ScenicSpotContent from '@/api/fusion/ScenicSpotContent';

const intangibleData = useSimpleDataLoader(async () => 
  (await ProjectsContent.getContentList(new GetContentListParams(), 1, 4)).list.map(p => ({
    id: p.id,
    title: p.title, 
    desc: p.desc, 
    image: p.thumbnail || p.image,
    bottomTags: [
      p.levelText, 
      p.ichTypeText, 
      p.batchText,
      p.regionText,
    ] as string[],
  }))
);
const inheritorData = useSimpleDataLoader(async () => 
  (await InheritorContent.getContentList(new GetContentListParams(), 1, 4)).list.map(p => ({
    id: p.id,
    title: p.title, 
    desc: p.desc, 
    image: p.thumbnail || p.image,
    titleBox: Boolean(p.deathBirth),
    bottomTags: [
      p.levelText, 
      p.nation,
      p.ichName
    ] as string[],
  }))
);
const spotData = useSimpleDataLoader(async () => 
  (await ScenicSpotContent.getContentList(new GetContentListParams(), 1, 4)).list.map(p => ({
    id: p.id,
    title: p.title, 
    desc: p.desc, 
    image: p.thumbnail || p.image,
    bottomTags: [
      p.levelText, 
      p.ichTypeText, 
      p.batchText,
      p.regionText,
    ] as string[],
  }))
);
const seminarData = useSimpleDataLoader(async () => 
  (await SeminarContent.getContentList(new GetContentListParams(), 1, 4)).list.map(p => ({
    id: p.id,
    title: p.title, 
    desc: p.desc, 
    image: p.thumbnail || p.image,
    bottomTags: [
      p.levelText, 
      p.ichTypeText, 
      p.batchText,
      p.regionText,
    ] as string[],
  }))
);


const {
  loader: routeData,
  goList: goRouteList,
  goDetail: goRouteDetail,
} = useHomePageMiniCommonListGoMoreAndGoDetail({
  title: '旅游路线',
  mainBodyColumnId: [274,275,276,277],
  modelId: 17,
  itemType: 'article-common',
  detailsPage: '/pages/article/details',
});

const {
  loader: recommendData,
  goList: goRecommendList,
  goDetail: goRecommendDetail,
} = useHomePageMiniCommonListGoMoreAndGoDetail({
  title: '文化景区',
  mainBodyColumnId: 273,
  modelId: 17,
  itemType: 'article-common',
  detailsPage: '/pages/article/details',
});

const {
  loader: creativeData,
  goList: goCreativeList,
  goDetail: goCreativeDetail,
} = useHomePageMiniCommonListGoMoreAndGoDetail({
  title: '文化产品',
  mainBodyColumnId: 48,
  modelId: 9,
  itemType: 'article-common',
  detailsPage: '/pages/article/details',
});
</script>