🎨 按要求修改和优化图片显示

src/components/small/GridList.vue

@@ -7,7 +7,7 @@
       :style="{ 
         height: height,
         backgroundImage: itemStyleType !== 'ugly-box' ?
-          `url(${playAudio ? (item.playing ? Pause : Play) : (item.image || AppCofig.defaultImage)})` :
+          `url(${playAudio ? (item.playing ? Pause : Play) : (item.thumbnail || item.image || AppCofig.defaultImage)})` :
           undefined,
       }"
       :tabindex="1"
@@ -15,7 +15,7 @@
     >
       <img 
         v-if="itemStyleType === 'ugly-box'"
-        :src="item.image"
+        :src="item.thumbnail || item.image || AppCofig.defaultImage"
         alt=""
       />
       <div class="title">{{ item.title }}</div>
@@ -33,6 +33,7 @@ import Swal from 'sweetalert2';
 
 interface Item {
   image: string;
+  thumbnail?: string;
   title: string;
   audio?: string;
   playing?: boolean;

src/views/Content/TabInherit.vue

@@ -3,13 +3,13 @@
     <Tab 
       v-model="tab" 
       :tabs="[
-        { label: '文物' },
         { label: '非遗' },
+        { label: '文物' },
       ]" 
       autoSize
       itemWidth="100px" 
     />
-    <div v-if="tab === 0" class="content flex-fill gap-s">
+    <div v-if="tab === 1" class="content flex-fill gap-s">
       <div class="main-round-box introduction">
         <h1>闽南建筑文化简介</h1>
         <Vue3Marquee class="introduction-content" :duration="60" vertical>
@@ -52,7 +52,7 @@
         />
       </div>
     </div>
-    <div v-else-if="tab === 1" class="content flex-fill">
+    <div v-else-if="tab === 0" class="content flex-fill">
       <div></div>
       <div class="d-flex flex-col">
         <h1>非遗传承</h1>
@@ -306,6 +306,7 @@ function handleItemClick(item: any) {
 
 
 .intangible-list {
+  position: relative;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
@@ -317,11 +318,13 @@ function handleItemClick(item: any) {
     width: 45%;
     aspect-ratio: 3 / 1;
     border-radius: 15px;
+    max-height: 20vh;
     display: flex;
     align-items: center;
     justify-content: center;
     padding-left: 20%;
     color: var(--color-text-primary);
+    box-sizing: border-box;
   }
 }
 

src/views/ContentView.vue

@@ -93,13 +93,22 @@ watch(() => activeTab.value, (newVal) => {
         <TabCommonList 
           v-else-if="activeTabId === 3" 
           :modelId="16" 
-          :mainBodyColumnId="[ 189, [191, 291], 190,187,{ modelId: 5, mainBodyColumnId: [] } ]" 
-          :mainBodyColumnAsTabs="[ '闽南童谣', '闽南语经典歌曲', '南音', '讲古', '方言' ]"
+          :mainBodyColumnId="[ 189, 190,187 ]" 
+          :mainBodyColumnAsTabs="[ '闽南童谣', '南音', '讲古' ]"
           :detailPageNames="['VideoDetail', 'VideoDetail', 'VideoDetail', 'VideoDetail', 'Play']"
         />
         <TabCustomList v-else-if="activeTabId === 4" />
         <TabInherit v-else-if="activeTabId === 5" />
-        <TabCommonList v-else-if="activeTabId === 6" :modelId="16" />
+        <TabCommonList 
+          v-else-if="activeTabId === 6" 
+          :mainBodyColumnId="[ 
+            { modelId: 16, mainBodyColumnId: [191, 291] }, 
+            { modelId: 16, mainBodyColumnId: [ 315 ] }, 
+            { modelId: 5, mainBodyColumnId: [ 257,235,237,210 ] },
+            { modelId: 5, mainBodyColumnId: [ 313 ] },
+          ]" 
+          :mainBodyColumnAsTabs="[ '闽南语经典歌曲', '闽南语原创歌曲', '常用闽南语', '闽南语原声' ]"
+        />
         <TabCommonList 
           v-else-if="activeTabId === 7" 
           :modelId="17"