From 321e990dff31420b943fc83535b297fa3845383d Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Mon, 25 Aug 2025 16:21:19 +0800
Subject: [PATCH] =?UTF-8?q?Fix:=E4=BF=AE=E6=AD=A3=E5=89=8D=E5=90=8E?=
 =?UTF-8?q?=E7=AB=AFBug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/JinshenHeader.vue    |  7 ++--
 app/components/MarkdownRenderer.vue | 36 +++++++++++++++-
 app/composables/useLocalizations.ts |  2 +-
 app/pages/index.vue                 | 45 ++++++++++++++++++--
 app/pages/productions/[...slug].vue |  7 +++-
 app/pages/productions/index.vue     |  8 +++-
 app/pages/support/index.vue         | 65 +++++++++++++++++++++++++++++
 app/types/strapi/production.ts      |  3 +-
 8 files changed, 160 insertions(+), 13 deletions(-)
 create mode 100644 app/pages/support/index.vue

diff --git a/app/components/JinshenHeader.vue b/app/components/JinshenHeader.vue
index ba2131c..b02614b 100644
--- a/app/components/JinshenHeader.vue
+++ b/app/components/JinshenHeader.vue
@@ -129,12 +129,13 @@ onMounted(() => {
     background-color: transparent !important;
 }
 
-.header-menu .el-menu-item:active {
-    border-bottom: 2px solid var(--el-color-primary);
+.header-menu .el-menu-item.is-active {
+    border-bottom: 2.5px solid var(--el-color-primary-dark-2);
+    color: var(--el-color-primary);
 }
 
 .header-menu .el-menu-item:hover {
-    border-bottom: 2px solid var(--el-color-primary);
+    border-bottom: 2.5px solid var(--el-color-primary);
 }
 
 .header-actions {
diff --git a/app/components/MarkdownRenderer.vue b/app/components/MarkdownRenderer.vue
index ecfdfbc..51a4891 100644
--- a/app/components/MarkdownRenderer.vue
+++ b/app/components/MarkdownRenderer.vue
@@ -17,6 +17,8 @@ const contentWithAbsoluteUrls = convertMedia(props.content)
 const safeHtml = computed(() => renderMarkdown(contentWithAbsoluteUrls))
 // const safeHtml = computed(() => renderMarkdown(props.content))
 
+console.log('Rendered HTML:', safeHtml.value)
+
 </script>
 
 <style>
@@ -25,15 +27,47 @@ const safeHtml = computed(() => renderMarkdown(contentWithAbsoluteUrls))
   line-height: 1.6;
 }
 
-.markdown-body h1,
+.markdown-body h1 {
+  color: var(--el-color-primary);
+  font-size: 1.5em;
+  margin-bottom: 0.5em;
+  text-align: center;
+}
+
 .markdown-body h2 {
   color: var(--el-color-primary);
   font-size: 1.5em;
   margin-bottom: 0.5em;
 }
 
+.markdown-body h3 {
+  color: var(--el-color-primary);
+  font-size: 1.2em;
+  margin-bottom: 0.5em;
+}
+
+.markdown-body p {
+  text-indent: 2em;
+  text-align: justify;
+  margin: 0.5em 0;
+  margin-bottom: 1em;
+}
+
 .markdown-body ol {
   list-style-type: decimal;
   padding-left: 2em;
+  margin-bottom: 1em;
+}
+
+.markdown-body ul {
+  list-style-type: disc;
+  padding-left: 2em;
+  margin-bottom: 1em;
+}
+
+.markdown-body hr {
+  border: none;
+  border-top: 1px solid var(--el-border-color);
+  margin: 20px 0;
 }
 </style>
\ No newline at end of file
diff --git a/app/composables/useLocalizations.ts b/app/composables/useLocalizations.ts
index ce613f8..cde4647 100644
--- a/app/composables/useLocalizations.ts
+++ b/app/composables/useLocalizations.ts
@@ -5,7 +5,7 @@ import en from 'element-plus/es/locale/lang/en';
 
 // Strapi本地化映射
 export const strapiLocales: Record<string, StrapiLocale> = {
-    'zh': 'zh-Hans',
+    'zh': 'zh-CN',
     'en': 'en'
 }
 
diff --git a/app/pages/index.vue b/app/pages/index.vue
index a54d75b..abaea6c 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -1,12 +1,51 @@
 <template>
   <div class="homepage">
-    <p>主页还没做^^</p>
+    <div class="carousel">
+      <el-carousel height="auto" :interval="5000" arrow="never" autoplay>
+        <el-carousel-item v-for="(item, index) in 3" :key="index">
+          <div class="carousel-item">
+            <!-- <el-image class="carousel-image" :src="useStrapiMedia('/uploads/201605211508029798_e37af77a48.png')" fit="fill" /> -->
+            <p class="image-label">{{ item }}</p>
+          </div>
+        </el-carousel-item>
+      </el-carousel>
+    </div>
   </div>
 </template>
 
 <style scoped>
-.homepage {
-  padding: 2rem;
+.carousel-item {
+  width: 100%;
+  height: 100%;
+  background-color: #f5f7fa;
+}
+
+.carousel-image {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+.el-carousel__item {
+  width: 100%;
+  height: 33vw;
+  /* 16:9 Aspect Ratio */
+}
+
+.el-carousel__item h3 {
+  display: flex;
+  color: #475669;
+  opacity: 0.8;
+  line-height: 300px;
+  margin: 0;
+}
+
+.el-carousel__item:nth-child(2n) {
+  /* background-color: #99a9bf; */
+}
+
+.el-carousel__item:nth-child(2n + 1) {
+  /* background-color: #d3dce6; */
 }
 
 .section p {
diff --git a/app/pages/productions/[...slug].vue b/app/pages/productions/[...slug].vue
index dc6923d..ebfc57d 100644
--- a/app/pages/productions/[...slug].vue
+++ b/app/pages/productions/[...slug].vue
@@ -16,7 +16,7 @@
       <div class="production-header">
         <div class="production-image">
           <el-image
-:src="useStrapiMedia(production?.production_image?.url || '')" :alt="production.title"
+:src="useStrapiMedia(production?.cover?.url || '')" :alt="production.title"
             fit="contain" />
         </div>
         <div class="production-info">
@@ -84,7 +84,10 @@ onMounted(async () => {
         production_specs: {
           populate: '*',
         },
-        production_image: {
+        production_images: {
+          populate: '*',
+        },
+        cover: {
           populate: '*',
         },
       },
diff --git a/app/pages/productions/index.vue b/app/pages/productions/index.vue
index 6d49e44..47109a9 100644
--- a/app/pages/productions/index.vue
+++ b/app/pages/productions/index.vue
@@ -20,7 +20,7 @@ v-for="(group, type) in groupedProductions" :key="type" :title="type || '未分
                         <production-card
 v-for="production in group" :key="production.documentId || production.id"
                             :slug="production.documentId"
-                            :image-url="useStrapiMedia(production?.production_image?.url || '')"
+                            :image-url="useStrapiMedia(production?.cover?.url || '')"
                             :name="production.title" :description="production.summary || ''" />
                     </div>
                 </el-collapse-item>
@@ -62,7 +62,10 @@ onMounted(async () => {
     try {
         const response = await find<Production>('productions', {
             populate: {
-                production_image: {
+                cover: {
+                    populate: '*',
+                },
+                production_images: {
                     populate: '*',
                 },
                 production_type: {
@@ -76,6 +79,7 @@ onMounted(async () => {
             },
             locale: strapiLocale,
         })
+        console.log('Fetched productions:', response.data)
         productions.value = response.data.map((item: Production) => ({
             ...item,
             // 保持 production_type 原始类型，兼容对象或字符串
diff --git a/app/pages/support/index.vue b/app/pages/support/index.vue
new file mode 100644
index 0000000..58b3ccb
--- /dev/null
+++ b/app/pages/support/index.vue
@@ -0,0 +1,65 @@
+<template>
+    <div class="page-container">
+        <div class="page-header">
+            <el-breadcrumb class="breadcrumb" separator="/">
+                <el-breadcrumb-item class="text-md opacity-50">
+                    <NuxtLink :to="$localePath('/')">{{ $t('navigation.home') }}</NuxtLink>
+                </el-breadcrumb-item>
+                <el-breadcrumb-item class="text-md opacity-50">
+                    <NuxtLink :to="$localePath('/support')">{{ $t('navigation.support') }}</NuxtLink>
+                </el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <div class="page-content">
+            <el-divider content-position="left">选择我们的服务</el-divider>
+            <div class="button-group">
+                <NuxtLink :to="$localePath('/about/contact-us')">
+                    <el-card class="card-button">
+                        <el-icon class="icon" size="80">
+                            <ElIconService />
+                        </el-icon>
+                        <br>
+                        联系我们
+                    </el-card>
+                </NuxtLink>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.page-container {
+    padding: 2rem 1rem;
+}
+
+.breadcrumb {
+    padding: 1rem 1rem;
+}
+
+:deep(.el-divider__text) {
+    font-size: 1.2rem;
+    font-weight: bold;
+}
+
+.button-group {
+    display: flex;
+    justify-content: left;
+    margin-top: 2rem;
+    margin-left: 2rem;
+}
+
+.card-button {
+    width: 20%;
+    min-width: 200px;
+    padding: 20px;
+    margin: 0 auto;
+    cursor: pointer;
+    text-align: center;
+    font-size: 1.5em;
+}
+
+.card-button:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
+}
+</style>
\ No newline at end of file
diff --git a/app/types/strapi/production.ts b/app/types/strapi/production.ts
index 84bf80e..0e55740 100644
--- a/app/types/strapi/production.ts
+++ b/app/types/strapi/production.ts
@@ -18,7 +18,8 @@ export interface Production extends StrapiEntity {
     title: string;
     summary: string;
     production_type: ProductionType;
-    production_image: StrapiImage;
+    cover: StrapiImage;
+    production_images: StrapiImage[];
     production_details: string;
     production_specs: ProductionSpecGroup[];
     documents: StrapiMedia[];