minnan/src/pages/inhert/village/list.vue

<template>
  <CommonListPage 
    ref="list"
    title="传统村落"
    itemType="image-large-2"
    detailsPage="custom"
    showTotal
    :dropDownNames="dropdownNames"
    :load="loadData" 
    :tabs="tabs"
    :startTabIndex="0"
    :loadMounted="false"
    @goCustomDetails="goDetails"
  />
</template>

<script setup lang="ts">
import CommonListPage, { type DropDownNames } from '@/pages/article/common/CommonListPage.vue';
import { onMounted, ref } from 'vue';
import VillageApi from '@/api/inhert/VillageApi';
import { navTo } from '@imengyu/imengyu-utils/dist/uniapp/PageAction';
import CommonContent from '@/api/CommonContent';
import { waitTimeOut } from '@imengyu/imengyu-utils';

const dropdownNames = ref<DropDownNames[]>([]);
const list = ref();

async function loadData(
  page: number, 
  pageSize: number,
  searchText: string,
  dropDownValues: number[],
  tabSelect: number,
) {

  const list = page == 1 ? await VillageApi.getVallageList(tabSelect) : [];
  list.filter((p) => !searchText || p.title.includes(searchText)).forEach((p) => {
    p.desc = p.desc;
    p.badge = p.district;
    p.bottomTags = [
      p.levelText, 
      p.batchText,
      p.historyLevelText,
    ];
  })
  return { list: list, total: list.length }
}

function goDetails(item: any) {
  uni.setStorageSync('VillageTemp', JSON.stringify(item));
  navTo('details', { id: item.id })
}

const tabs = ref<{id: number, name: string}[]>();

onMounted(async () => {
  const res = await CommonContent.getCategoryList(151);
  const it1 = res.find(p => p.title == '国家级');
  const it2 = res.find(p => p.title == '省级');
  if (it1) it1.title = '特色村舍';
  if (it2) it2.title = '传统村落';
  tabs.value = res.slice(1).map((p) => ({ id: p.id, name: p.title }));
  await waitTimeOut(400);
  list.value.load();
})
</script>