📦 增加闽南文化百科栏目

src/api/introduction/BookContent.ts

@@ -0,0 +1,10 @@
+import { CommonContentApi } from '../CommonContent';
+
+export class BookContentApi extends CommonContentApi {
+
+  constructor() {
+    super(18, "闽南文化-闽南文化百科", 320);
+  }
+}
+
+export default new BookContentApi();

src/components/content/CommonListBlock.vue

@@ -83,7 +83,7 @@
           :style="{ width: rowWidth }"
           @click="handleShowDetail(item)"
         >
-          <img 
+          <img
             :src="item.image || defaultImage" alt="新闻图片" 
           />
           <TitleDescBlock
@@ -250,7 +250,7 @@ const props = defineProps({
   },
   defaultImage: {
     type: String,
-    default: ''
+    default: 'https://mncdn.wenlvti.net/app_static/minnan/EmptyImage.png'
   },
 })
 

src/components/content/CommonListPage.vue

@@ -112,7 +112,7 @@ const props = defineProps({
   },
   defaultImage: {
     type: String,
-    default: ''
+    default: 'https://mncdn.wenlvti.net/app_static/minnan/EmptyImage.png'
   },
 })
 </script>

src/router/index.ts

@@ -79,6 +79,11 @@ const router = createRouter({
       component: () => import('../views/introduction/sea.vue'),
     },
     {
+      path: '/introduction/book',
+      name: 'IntroductionBook',
+      component: () => import('../views/introduction/book.vue'),
+    },
+    {
       path: '/introduction/policy',
       name: 'IntroductionPolicy',
       component: () => import('../views/introduction/policy.vue'),

src/views/IntrodView.vue

@@ -74,6 +74,7 @@ import CategoryImage3 from '@/assets/images/introduction/CategoryImage3.png';
 import CategoryImage4 from '@/assets/images/introduction/CategoryImage4.png';
 import CategoryImage5 from '@/assets/images/introduction/CategoryImage5.png';
 import CategoryImage6 from '@/assets/images/introduction/CategoryImage6.png';
+import CategoryImage7 from '@/assets/images/introduction/CategoryImage7.jpg';
 import LeftRightBox from '@/components/parts/LeftRightBox.vue';
 import ThreeImageList from '@/components/parts/ThreeImageList.vue';
 import { useSimpleDataLoader } from '@/composeable/SimpleDataLoader';
@@ -126,6 +127,12 @@ const list = [
     desc: '让文化因传承而永存',
     image: CategoryImage6,
     onClick: () => navTo('/introduction/sea'),
+  },
+  {
+    title: '闽南文化百科',
+    desc: '让文化因传承而永存',
+    image: CategoryImage7,
+    onClick: () => navTo('/introduction/book'),
   }
 ]
 

src/views/introduction/book.vue

@@ -0,0 +1,49 @@
+<template>
+  <!-- 文化常识 - 闽南文化百科 -->
+   <CommonListPage
+    :title="'闽南文化百科'"
+    :prevPage="{ title: '文化常识' }"
+    :dropDownNames="[]"
+    :pageSize="8"
+    :load="loadData"
+    :loadDetail="loadDetail"
+  />
+</template>
+
+<script setup lang="ts">
+import { GetContentListParams } from '@/api/CommonContent';
+import BookContent from '@/api/introduction/BookContent';
+
+async function loadDetail(id: number, item: any) {
+  return await BookContent.getContentDetail(id);
+}
+async function loadData(
+  page: number, 
+  pageSize: number,
+  selectedTag: number,
+  searchText: string,
+  dropDownValues: number[]
+) {
+
+  const res = await BookContent.getContentList(new GetContentListParams()
+    .setKeywords(searchText)
+  , page, pageSize);
+
+  return { 
+    page: page,
+    total: res.total,
+    data: res.list.map((item, index) => {
+      return {
+        id: item.id,
+        title: item.title,
+        desc: item.desc,
+        image: item.image,
+      };
+    }),
+  }
+}
+</script>
+
+<style>
+</style>
+