From 2fe87975518a01a4e18babc0cdd9e1f3ed64cec5 Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Thu, 21 Aug 2025 14:26:58 +0800
Subject: [PATCH] =?UTF-8?q?Feature:=20=E4=BA=A7=E5=93=81=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=A1=B5=E5=A4=B4=20&=20Markdown=E6=B8=B2?=
 =?UTF-8?q?=E6=9F=93=E5=99=A8=E5=A2=9E=E5=8A=A0=E5=9B=BE=E5=83=8FUrl?=
 =?UTF-8?q?=E8=BD=AC=E6=8D=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/JinshenFooter.vue    |  8 ++---
 app/components/JinshenHeader.vue    |  8 ++---
 app/components/MarkdownRenderer.vue | 18 ++++++----
 app/pages/productions/index.vue     | 52 ++++++++++++++++++++++-------
 app/utils/markdown.ts               | 13 ++++++++
 i18n/locales/en.json                | 13 ++++----
 i18n/locales/zh.json                | 13 ++++----
 7 files changed, 86 insertions(+), 39 deletions(-)

diff --git a/app/components/JinshenFooter.vue b/app/components/JinshenFooter.vue
index f2c6ea8..d065f20 100644
--- a/app/components/JinshenFooter.vue
+++ b/app/components/JinshenFooter.vue
@@ -20,16 +20,16 @@
             <NuxtLinkLocale to="/">{{ $t('navigation.home') }}</NuxtLinkLocale>
           </li>
           <li>
-            <NuxtLink :to="$localePath('/productions')">{{ $t('productions') }}</NuxtLink>
+            <NuxtLink :to="$localePath('/productions')">{{ $t('navigation.productions') }}</NuxtLink>
           </li>
           <li>
-            <NuxtLink :to="$localePath('/solutions')">{{ $t('solutions') }}</NuxtLink>
+            <NuxtLink :to="$localePath('/solutions')">{{ $t('navigation.solutions') }}</NuxtLink>
           </li>
           <li>
-            <NuxtLink :to="$localePath('/support')">{{ $t('support') }}</NuxtLink>
+            <NuxtLink :to="$localePath('/support')">{{ $t('navigation.support') }}</NuxtLink>
           </li>
           <li>
-            <NuxtLink :to="$localePath('/about')">{{ $t('about-us') }}</NuxtLink>
+            <NuxtLink :to="$localePath('/about')">{{ $t('navigation.about-us') }}</NuxtLink>
           </li>
         </ul>
       </div>
diff --git a/app/components/JinshenHeader.vue b/app/components/JinshenHeader.vue
index d31f081..1083f90 100644
--- a/app/components/JinshenHeader.vue
+++ b/app/components/JinshenHeader.vue
@@ -10,16 +10,16 @@
         <!-- 导航菜单 -->
         <el-menu default-active="productions" class="header-menu" mode="horizontal" :ellipsis="false" router>
             <el-menu-item :index="$localePath('/productions')">
-                <span class="title">{{ $t('productions') }}</span>
+                <span class="title">{{ $t('navigation.productions') }}</span>
             </el-menu-item>
             <el-menu-item :index="$localePath('/solutions')">
-                <span class="title">{{ $t('solutions') }}</span>
+                <span class="title">{{ $t('navigation.solutions') }}</span>
             </el-menu-item>
             <el-menu-item :index="$localePath('/support')">
-                <span class="title">{{ $t('support') }}</span>
+                <span class="title">{{ $t('navigation.support') }}</span>
             </el-menu-item>
             <el-menu-item :index="$localePath('/about')">
-                <span class="title">{{ $t('about-us') }}</span>
+                <span class="title">{{ $t('navigation.about-us') }}</span>
             </el-menu-item>
         </el-menu>
 
diff --git a/app/components/MarkdownRenderer.vue b/app/components/MarkdownRenderer.vue
index 8c09014..eb09b74 100644
--- a/app/components/MarkdownRenderer.vue
+++ b/app/components/MarkdownRenderer.vue
@@ -1,7 +1,7 @@
 <!-- eslint-disable vue/no-v-html -->
 <template>
   <!-- 用 v-html 渲染解析后的 HTML -->
-  <div class="markdown-body" v-html="safeHtml"/>
+  <div class="markdown-body" v-html="safeHtml" />
 </template>
 
 <script setup lang="ts">
@@ -11,8 +11,12 @@ interface Props {
 
 const props = defineProps<Props>()
 
+
+const contentWithAbsoluteUrls = convertMedia(props.content)
+
 // 将 Markdown 转换成 HTML
-const safeHtml = computed(() => renderMarkdown(props.content))
+const safeHtml = computed(() => renderMarkdown(contentWithAbsoluteUrls))
+
 </script>
 
 <style>
@@ -23,13 +27,13 @@ const safeHtml = computed(() => renderMarkdown(props.content))
 
 .markdown-body h1,
 .markdown-body h2 {
-    color: var(--el-color-primary);
-    font-size: 1.5em;
-    margin-bottom: 0.5em;
+  color: var(--el-color-primary);
+  font-size: 1.5em;
+  margin-bottom: 0.5em;
 }
 
 .markdown-body ol {
-    list-style-type: decimal;
-    padding-left: 2em;
+  list-style-type: decimal;
+  padding-left: 2em;
 }
 </style>
\ No newline at end of file
diff --git a/app/pages/productions/index.vue b/app/pages/productions/index.vue
index 455cbcc..0377ac5 100644
--- a/app/pages/productions/index.vue
+++ b/app/pages/productions/index.vue
@@ -1,18 +1,31 @@
 <template>
-    <div class="productions-container">
-        <el-collapse v-model="activeNames" class="production-collapse">
-            <el-collapse-item
+    <div class="page-container">
+        <div class="page-header">
+            <h1 class="page-title">{{ $t('our-productions') }}</h1>
+            <el-breadcrumb class="breadcrumb">
+                <el-breadcrumb-item class="text-sm opacity-50">
+                    <NuxtLink :to="$localePath('/')">{{ $t('navigation.home') }}</NuxtLink>
+                </el-breadcrumb-item>
+                <el-breadcrumb-item class="text-sm opacity-50">
+                    <NuxtLink :to="$localePath('/productions')">{{ $t('navigation.productions') }}</NuxtLink>
+                </el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <div class="productions-container">
+            <el-collapse v-model="activeNames" class="production-collapse">
+                <el-collapse-item
 v-for="(group, type) in groupedProductions" :key="type" :title="type || '未分类'"
-                :name="type || 'no-category'">
-                <div class="group-list">
-                    <production-card
+                    :name="type || 'no-category'">
+                    <div class="group-list">
+                        <production-card
 v-for="production in group" :key="production.documentId || production.id"
-                        :slug="production.documentId"
-                        :image-url="useStrapiMedia(production?.production_image?.url || '')" :name="production.title"
-                        :description="production.summary || ''" />
-                </div>
-            </el-collapse-item>
-        </el-collapse>
+                            :slug="production.documentId"
+                            :image-url="useStrapiMedia(production?.production_image?.url || '')"
+                            :name="production.title" :description="production.summary || ''" />
+                    </div>
+                </el-collapse-item>
+            </el-collapse>
+        </div>
     </div>
 </template>
 
@@ -78,6 +91,21 @@ onMounted(async () => {
 </script>
 
 <style scoped>
+.page-header {
+    display: flex;
+    padding: 20px;
+}
+
+.page-title {
+    font-size: 2rem;
+    font-weight: bold;
+    color: var(--el-color-primary);
+}
+
+.breadcrumb {
+    margin-left: auto;
+}
+
 .productions-container {
     display: flex;
     flex-direction: column;
diff --git a/app/utils/markdown.ts b/app/utils/markdown.ts
index 43431e8..1de390c 100644
--- a/app/utils/markdown.ts
+++ b/app/utils/markdown.ts
@@ -19,3 +19,16 @@ export function renderMarkdown(content: string): string {
     return dirtyHtml
 }
 
+export function convertMedia(content: string): string {
+    // 通过正则表达式替换Markdown中的图片链接
+    // ![alt text](image-url) -> ![alt text](strapiMedia(image-url))
+
+    if(!content) return '';
+
+    const contentWithAbsoluteUrls = content.replace(
+        /!\[([^\]]*)\]\((\/uploads\/[^)]+)\)/g,
+        (_, alt, url) => `![${alt}](${useStrapiMedia(url)})`
+    )
+
+    return contentWithAbsoluteUrls;
+}
\ No newline at end of file
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 5339534..26f0bc9 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -1,10 +1,6 @@
 {
   "back": "Back",
   "not-found": "Page Not Found",
-  "productions": "Productions",
-  "solutions": "Solutions",
-  "support": "Support",
-  "about-us": "About Us",
   "search-placeholder": "Search...",
   "company-name": "Jinshen Machinary Manufacturing Co., Ltd.",
   "company-description": "We specialize in manufacturing a range of paper tube and can equipment, integrating design, manufacturing, sales, and service.",
@@ -14,7 +10,11 @@
   "support-desc": "24/7 professional technical support to ensure stable operation of your business.",
   "quick-links": "Quick Links",
   "navigation": {
-    "home": "Home"
+    "home": "Home",
+    "productions": "Productions",
+    "solutions": "Solutions",
+    "support": "Support",
+    "about-us": "About Us"
   },
   "contact-info": "Contact Us",
   "telephone": "Telephone",
@@ -31,5 +31,6 @@
   "product-not-found-desc": "Sorry, the product you are looking for does not exist or has been removed.",
   "back-to-productions": "Back to Products",
   "no-content-available": "No detailed information available",
-  "loading": "Loading..."
+  "loading": "Loading...",
+  "our-productions": "Our Productions"
 }
diff --git a/i18n/locales/zh.json b/i18n/locales/zh.json
index 501db3d..6bc4dcb 100644
--- a/i18n/locales/zh.json
+++ b/i18n/locales/zh.json
@@ -1,10 +1,6 @@
 {
   "back": "返回",
   "not-found": "页面不存在",
-  "productions": "产品中心",
-  "solutions": "解决方案",
-  "support": "服务支持",
-  "about-us": "关于我们",
   "search-placeholder": "搜索...",
   "company-name": "金申机械制造有限公司",
   "company-description": "专业生产一系列纸管、纸罐设备，集设计、制造、销售、服务于一体。",
@@ -14,7 +10,11 @@
   "support-desc": "7x24小时专业技术支持，确保您的业务稳定运行。",
   "quick-links": "快速链接",
   "navigation": {
-    "home": "首页"
+    "home": "主页",
+    "productions": "产品中心",
+    "solutions": "解决方案",
+    "support": "服务支持",
+    "about-us": "关于我们"
   },
   "contact-info": "联系我们",
   "telephone": "电话",
@@ -31,5 +31,6 @@
   "product-not-found-desc": "抱歉，您访问的产品不存在或已被删除。",
   "back-to-productions": "返回产品列表",
   "no-content-available": "暂无详细信息",
-  "loading": "加载中..."
+  "loading": "加载中...",
+  "our-productions": "我们的产品"
 }