Fix: 小修小补 & 优化代码结构

app/pages/productions/[...slug].vue

@@ -13,7 +13,7 @@
       <!-- 产品详情内容 -->
       <div class="production-header">
         <div class="production-image">
-          <el-image :src="production.production_image.url" :alt="production.title" fit="contain" />
+          <el-image :src="useStrapiMedia(production?.production_image?.url || '')" :alt="production.title" fit="contain" />
         </div>
         <div class="production-info">
           <h1>{{ production.title }}</h1>
@@ -59,32 +59,19 @@
 </template>
 
 <script setup lang="ts">
-interface ProductionDetails {
-  id: number
-  title: string
-  summary: string
-  production_type?: string
-  production_image: {
-    url: string
-  }
-  production_details?: string
-  production_specs?: string | object
-  documentId?: string
-}
-
 const route = useRoute()
 const { findOne } = useStrapi()
 const { getStrapiLocale } = useLocalizations()
 
 const strapiLocale = getStrapiLocale()
 
-const production = ref<ProductionDetails | null>(null)
+const production = ref<Production | null>(null)
 const pending = ref(true)
 
 const activeName = ref('details') // 默认选中概览标签
 
 // 获取路由参数（slug 或 id）
-const productionParam = computed(() => route.params.slug as string)
+const documentId = computed(() => route.params.slug as string)
 
 const parsedSpecs = computed(() => {
   if (!production.value?.production_specs) return JSON.parse('{}')
@@ -106,7 +93,7 @@ const parsedSpecs = computed(() => {
 onMounted(async () => {
   try {
 
-    const response = await findOne<ProductionDetails>('productions', productionParam.value, {
+    const response = await findOne<Production>('productions', documentId.value, {
       populate: '*',
       locale: strapiLocale,
     })
@@ -114,21 +101,16 @@ onMounted(async () => {
     if (response.data) {
       const item = response.data
       production.value = {
-        id: item.id,
         title: item.title,
         summary: item.summary,
-        production_details: item.production_details || '',
-        production_specs: item.production_specs || '',
-        production_image: {
-          url: item.production_image?.url
-            ? `http://192.168.86.5:1337${item.production_image.url}`
-            : ''
-        },
-        documentId: item.documentId || '',
+        production_type: item.production_type,
+        production_details: item.production_details,
+        production_specs: item.production_specs,
+        production_image: item.production_image,
+        documentId: item.documentId,
       }
 
       console.log('Fetched production:', production.value)
-      console.log('Raw specs:', production.value.production_specs)
     }
   } catch (error) {
     console.error('Failed to fetch production:', error)