From fa1a22b286e5bd6dcb167e83c5bfe7325f521d88 Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 11:17:32 +0800
Subject: [PATCH 1/7] =?UTF-8?q?feat:=20=E6=9C=8D=E5=8A=A1=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E9=A1=B5=E6=87=92=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 骨架屏调整：服务支持页骨架屏布局调整
- 懒加载：服务支持页添加懒加载机制
---
 app/pages/support/contact-us.vue | 10 ++---
 app/pages/support/documents.vue  | 27 ++++++++++---
 app/pages/support/faq.vue        | 65 +++++++++++++++++++-------------
 3 files changed, 65 insertions(+), 37 deletions(-)

diff --git a/app/pages/support/contact-us.vue b/app/pages/support/contact-us.vue
index 7812c9c..442a6c3 100644
--- a/app/pages/support/contact-us.vue
+++ b/app/pages/support/contact-us.vue
@@ -6,7 +6,10 @@
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
 
-    <div v-if="!pending" class="page-content">
+    <div v-if="pending" class="page-content">
+      <el-skeleton :rows="5" animated />
+    </div>
+    <div v-else class="page-content">
       <!-- eslint-disable-next-line vue/no-v-html -->
       <div class="html-typography" v-html="contactInfo?.content || ''" />
       <!-- <div v-if="!hydrated" v-html="contactInfo?.content || ''" /> -->
@@ -17,9 +20,6 @@
       <!--   /> -->
       <!-- </div> -->
     </div>
-    <div v-else class="loading">
-      <el-skeleton :rows="5" animated />
-    </div>
   </div>
 </template>
 
@@ -31,7 +31,7 @@
     { label: $t('navigation.support'), to: localePath('/support') },
     { label: $t('navigation.contact-info') },
   ];
-  const { data: contactInfo, pending, error } = await useContactInfo();
+  const { data: contactInfo, pending, error } = useContactInfo();
 
   watch(error, (value) => {
     if (value) {
diff --git a/app/pages/support/documents.vue b/app/pages/support/documents.vue
index 5bf8fd3..3c42a6d 100644
--- a/app/pages/support/documents.vue
+++ b/app/pages/support/documents.vue
@@ -1,15 +1,30 @@
 <template>
   <div class="page-container">
-    <div v-if="pending">
-      <el-skeleton :rows="5" animated />
-    </div>
-    <div v-else>
+    <div>
       <support-tabs model-value="documents" />
       <div class="page-header">
         <h1 class="page-title">{{ $t('navigation.documents') }}</h1>
         <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
       </div>
-      <div class="page-content">
+      <div v-if="pending" class="page-content">
+        <el-skeleton :rows="10" animated class="py-4" throttle="100">
+          <template #template>
+            <div class="flex flex-col gap-xl">
+              <el-skeleton-item
+                variant="rect"
+                style="width: 100%; height: 100px"
+              />
+              <el-skeleton-item
+                v-for="i in 10"
+                :key="i"
+                variant="h1"
+                style="height: 60px"
+              />
+            </div>
+          </template>
+        </el-skeleton>
+      </div>
+      <div v-else class="page-content">
         <document-filter
           v-model="filters"
           :product-type-options="productTypeOptions"
@@ -56,7 +71,7 @@
   const page = ref(1);
   const documentsPerPage = 10;
 
-  const { data: documents, pending, error } = await useDocumentList();
+  const { data: documents, pending, error } = useDocumentList();
 
   const documentTypeOptions = computed(() => {
     const types: DocumentTypeView[] = [];
diff --git a/app/pages/support/faq.vue b/app/pages/support/faq.vue
index e403f68..e1eb1f5 100644
--- a/app/pages/support/faq.vue
+++ b/app/pages/support/faq.vue
@@ -1,34 +1,47 @@
 <template>
   <div class="page-container">
-    <div v-if="pending" class="flex justify-center items-center h-64">
-      <el-skeleton :rows="6" animated />
+    <support-tabs model-value="faq" />
+    <div class="page-header">
+      <h1 class="page-title">{{ $t('navigation.faq') }}</h1>
+      <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
-    <div v-else>
-      <support-tabs model-value="faq" />
-      <div class="page-header">
-        <h1 class="page-title">{{ $t('navigation.faq') }}</h1>
-        <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
-      </div>
 
-      <div class="page-content">
-        <question-filter
-          v-model="filters"
-          :product-type-options="productTypeOptions"
-          :product-options="productOptions"
-          :question-type-options="questionTypeOptions"
-        />
+    <div v-if="pending" class="page-content">
+      <el-skeleton :rows="10" animated class="py-4" throttle="100">
+        <template #template>
+          <div class="flex flex-col gap-xl">
+            <el-skeleton-item
+              variant="rect"
+              style="width: 100%; height: 100px"
+            />
+            <el-skeleton-item
+              v-for="i in 10"
+              :key="i"
+              variant="h1"
+              style="height: 60px"
+            />
+          </div>
+        </template>
+      </el-skeleton>
+    </div>
+    <div v-else class="page-content">
+      <question-filter
+        v-model="filters"
+        :product-type-options="productTypeOptions"
+        :product-options="productOptions"
+        :question-type-options="questionTypeOptions"
+      />
 
-        <question-list :questions="paginatedQuestions" />
+      <question-list :questions="paginatedQuestions" />
 
-        <el-pagination
-          v-model:current-page="page"
-          class="justify-center pagination-container"
-          layout="prev, pager, next"
-          hide-on-single-page
-          :page-size="questionsPerPage"
-          :total="filteredQuestions.length"
-        />
-      </div>
+      <el-pagination
+        v-model:current-page="page"
+        class="justify-center pagination-container"
+        layout="prev, pager, next"
+        hide-on-single-page
+        :page-size="questionsPerPage"
+        :total="filteredQuestions.length"
+      />
     </div>
   </div>
 </template>
@@ -57,7 +70,7 @@
     { label: $t('navigation.faq') },
   ];
 
-  const { data: questions, pending, error } = await useQuestionList();
+  const { data: questions, pending, error } = useQuestionList();
 
   const questionTypeOptions = computed(() => {
     const types: QuestionTypeView[] = [];

From bcc08a53eaf336d9699cd711239dd62a9743a96c Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 11:38:33 +0800
Subject: [PATCH 2/7] =?UTF-8?q?fix:=20=E8=B0=83=E6=95=B4=E6=9C=8D=E5=8A=A1?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E9=A1=B5=E9=9D=A2=E6=B8=B2=E6=9F=93=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将条件渲染由div判断改为el-skeleton template
---
 app/pages/support/contact-us.vue | 31 ++++++++-------
 app/pages/support/documents.vue  | 65 ++++++++++++++++++--------------
 app/pages/support/faq.vue        | 60 +++++++++++++++--------------
 3 files changed, 85 insertions(+), 71 deletions(-)

diff --git a/app/pages/support/contact-us.vue b/app/pages/support/contact-us.vue
index 442a6c3..1f6ca71 100644
--- a/app/pages/support/contact-us.vue
+++ b/app/pages/support/contact-us.vue
@@ -6,19 +6,20 @@
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
 
-    <div v-if="pending" class="page-content">
-      <el-skeleton :rows="5" animated />
-    </div>
-    <div v-else class="page-content">
-      <!-- eslint-disable-next-line vue/no-v-html -->
-      <div class="html-typography" v-html="contactInfo?.content || ''" />
-      <!-- <div v-if="!hydrated" v-html="contactInfo?.content || ''" /> -->
-      <!-- <div v-else> -->
-      <!--   <html-renderer -->
-      <!--     class="html-typography" -->
-      <!--     :html="contactInfo?.content || ''" -->
-      <!--   /> -->
-      <!-- </div> -->
+    <div class="page-content">
+      <el-skeleton :rows="10" :loading="pending" animated>
+        <template #default>
+          <!-- eslint-disable-next-line vue/no-v-html -->
+          <div class="html-typography" v-html="contactInfo?.content || ''" />
+          <!-- <div v-if="!hydrated" v-html="contactInfo?.content || ''" /> -->
+          <!-- <div v-else> -->
+          <!--   <html-renderer -->
+          <!--     class="html-typography" -->
+          <!--     :html="contactInfo?.content || ''" -->
+          <!--   /> -->
+          <!-- </div> -->
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -31,7 +32,9 @@
     { label: $t('navigation.support'), to: localePath('/support') },
     { label: $t('navigation.contact-info') },
   ];
-  const { data: contactInfo, pending, error } = useContactInfo();
+  const { data, pending, error } = useContactInfo();
+
+  const contactInfo = computed(() => data.value ?? null);
 
   watch(error, (value) => {
     if (value) {
diff --git a/app/pages/support/documents.vue b/app/pages/support/documents.vue
index 3c42a6d..78322c0 100644
--- a/app/pages/support/documents.vue
+++ b/app/pages/support/documents.vue
@@ -6,8 +6,22 @@
         <h1 class="page-title">{{ $t('navigation.documents') }}</h1>
         <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
       </div>
-      <div v-if="pending" class="page-content">
-        <el-skeleton :rows="10" animated class="py-4" throttle="100">
+      <div class="page-content">
+        <document-filter
+          v-model="filters"
+          :product-type-options="productTypeOptions"
+          :product-options="productOptions"
+          :document-type-options="documentTypeOptions"
+        />
+
+        <el-skeleton
+          :loading="pending"
+          animated
+          :throttle="{
+            leading: 500,
+            trailing: 500,
+          }"
+        >
           <template #template>
             <div class="flex flex-col gap-xl">
               <el-skeleton-item
@@ -22,33 +36,26 @@
               />
             </div>
           </template>
+          <template #default>
+            <document-list
+              :documents="paginatedDocuments"
+              :show-category="
+                filters.selectedDocumentType === null ||
+                filters.selectedDocumentType === undefined
+              "
+            />
+
+            <el-pagination
+              v-model:current-page="page"
+              class="justify-center pagination-container"
+              layout="prev, pager, next"
+              hide-on-single-page
+              :page-size="documentsPerPage"
+              :total="filteredDocuments.length"
+            />
+          </template>
         </el-skeleton>
       </div>
-      <div v-else class="page-content">
-        <document-filter
-          v-model="filters"
-          :product-type-options="productTypeOptions"
-          :product-options="productOptions"
-          :document-type-options="documentTypeOptions"
-        />
-
-        <document-list
-          :documents="paginatedDocuments"
-          :show-category="
-            filters.selectedDocumentType === null ||
-            filters.selectedDocumentType === undefined
-          "
-        />
-
-        <el-pagination
-          v-model:current-page="page"
-          class="justify-center pagination-container"
-          layout="prev, pager, next"
-          hide-on-single-page
-          :page-size="documentsPerPage"
-          :total="filteredDocuments.length"
-        />
-      </div>
     </div>
   </div>
 </template>
@@ -71,7 +78,9 @@
   const page = ref(1);
   const documentsPerPage = 10;
 
-  const { data: documents, pending, error } = useDocumentList();
+  const { data, pending, error } = useDocumentList();
+
+  const documents = computed(() => data.value ?? []);
 
   const documentTypeOptions = computed(() => {
     const types: DocumentTypeView[] = [];
diff --git a/app/pages/support/faq.vue b/app/pages/support/faq.vue
index e1eb1f5..372a4b7 100644
--- a/app/pages/support/faq.vue
+++ b/app/pages/support/faq.vue
@@ -6,25 +6,7 @@
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
 
-    <div v-if="pending" class="page-content">
-      <el-skeleton :rows="10" animated class="py-4" throttle="100">
-        <template #template>
-          <div class="flex flex-col gap-xl">
-            <el-skeleton-item
-              variant="rect"
-              style="width: 100%; height: 100px"
-            />
-            <el-skeleton-item
-              v-for="i in 10"
-              :key="i"
-              variant="h1"
-              style="height: 60px"
-            />
-          </div>
-        </template>
-      </el-skeleton>
-    </div>
-    <div v-else class="page-content">
+    <div class="page-content">
       <question-filter
         v-model="filters"
         :product-type-options="productTypeOptions"
@@ -32,16 +14,34 @@
         :question-type-options="questionTypeOptions"
       />
 
-      <question-list :questions="paginatedQuestions" />
+      <el-skeleton
+        :loading="pending"
+        animated
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #template>
+          <div class="flex flex-col gap-xl">
+            <el-skeleton-item
+              v-for="i in 10"
+              :key="i"
+              variant="h1"
+              style="height: 80px"
+            />
+          </div>
+        </template>
+        <template #default>
+          <question-list :questions="paginatedQuestions" />
 
-      <el-pagination
-        v-model:current-page="page"
-        class="justify-center pagination-container"
-        layout="prev, pager, next"
-        hide-on-single-page
-        :page-size="questionsPerPage"
-        :total="filteredQuestions.length"
-      />
+          <el-pagination
+            v-model:current-page="page"
+            class="justify-center pagination-container"
+            layout="prev, pager, next"
+            hide-on-single-page
+            :page-size="questionsPerPage"
+            :total="filteredQuestions.length"
+          />
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -70,7 +70,9 @@
     { label: $t('navigation.faq') },
   ];
 
-  const { data: questions, pending, error } = useQuestionList();
+  const { data, pending, error } = useQuestionList();
+
+  const questions = computed(() => data.value ?? []);
 
   const questionTypeOptions = computed(() => {
     const types: QuestionTypeView[] = [];

From 537a6b0bd6f4587a47ca45fdee40348a01ef0def Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 12:00:42 +0800
Subject: [PATCH 3/7] =?UTF-8?q?fix:=20=E8=B0=83=E6=95=B4=E4=BA=A7=E5=93=81?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E9=A1=B5=E6=B8=B2=E6=9F=93=E6=9C=BA=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 渲染机制：产品列表页懒加载采用el-skeleton自身模板机制
- 布局调整：调整产品页/骨架屏在竖屏下的布局
---
 app/pages/products/index.vue     | 104 ++++++++++++++++++++++++-------
 app/pages/support/contact-us.vue |   7 ++-
 2 files changed, 87 insertions(+), 24 deletions(-)

diff --git a/app/pages/products/index.vue b/app/pages/products/index.vue
index de3028f..eaa7d30 100644
--- a/app/pages/products/index.vue
+++ b/app/pages/products/index.vue
@@ -10,31 +10,49 @@
 
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
-    <div v-if="!pending" class="page-content">
-      <div class="products-container">
-        <el-collapse v-model="activeNames" class="product-collapse">
-          <el-collapse-item
-            v-for="[key, value] in Object.entries(groupedProducts)"
-            :key="key"
-            :title="key || '未分类'"
-            :name="key || 'no-category'"
-          >
-            <div class="group-list">
-              <product-card
-                v-for="product in value.data"
-                :key="product.id"
-                :slug="product.id.toString()"
-                :image-url="getImageUrl(product.cover.toString())"
-                :name="product.name"
-                :description="product.summary || ''"
+    <div>
+      <el-skeleton
+        animated
+        :loading="pending"
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #template>
+          <div v-for="i in 3" :key="i" class="products-container">
+            <el-skeleton-item variant="h1" class="skeleton-collapse" />
+            <div class="skeleton-group-list">
+              <el-skeleton-item
+                v-for="j in 3"
+                :key="j"
+                variant="rect"
+                class="skeleton-card"
               />
             </div>
-          </el-collapse-item>
-        </el-collapse>
-      </div>
-    </div>
-    <div v-else>
-      <el-skeleton :rows="6" animated />
+          </div>
+        </template>
+        <template #default>
+          <div class="products-container">
+            <el-collapse v-model="activeNames" class="product-collapse">
+              <el-collapse-item
+                v-for="[key, value] in Object.entries(groupedProducts)"
+                :key="key"
+                :title="key || '未分类'"
+                :name="key || 'no-category'"
+              >
+                <div class="group-list">
+                  <product-card
+                    v-for="product in value.data"
+                    :key="product.id"
+                    :slug="product.id.toString()"
+                    :image-url="getImageUrl(product.cover.toString())"
+                    :name="product.name"
+                    :description="product.summary || ''"
+                  />
+                </div>
+              </el-collapse-item>
+            </el-collapse>
+          </div>
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -151,6 +169,46 @@
     justify-content: flex-start;
   }
 
+  .skeleton-collapse {
+    height: 50px;
+    width: 100%;
+  }
+
+  .skeleton-group-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 40px;
+    justify-content: flex-start;
+    margin-bottom: 2rem;
+  }
+
+  .skeleton-card {
+    width: 30%;
+    height: 250px;
+    margin-right: 1rem;
+  }
+
+  @media (max-width: 1200px) {
+    .skeleton-card {
+      width: 45%;
+    }
+  }
+
+  @media (max-width: 768px) {
+    .group-list {
+      justify-content: center;
+      align-items: center;
+    }
+    .skeleton-group-list {
+      justify-content: center;
+      align-items: center;
+    }
+
+    .skeleton-card {
+      width: 90%;
+    }
+  }
+
   :deep(.el-collapse-item__header) {
     padding: 30px auto;
     font-size: 1.5rem;
diff --git a/app/pages/support/contact-us.vue b/app/pages/support/contact-us.vue
index 1f6ca71..9927efe 100644
--- a/app/pages/support/contact-us.vue
+++ b/app/pages/support/contact-us.vue
@@ -7,7 +7,12 @@
     </div>
 
     <div class="page-content">
-      <el-skeleton :rows="10" :loading="pending" animated>
+      <el-skeleton
+        :rows="10"
+        :loading="pending"
+        animated
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
         <template #default>
           <!-- eslint-disable-next-line vue/no-v-html -->
           <div class="html-typography" v-html="contactInfo?.content || ''" />

From f1116491b654b3927ae4d6407b2095a7a85812c7 Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 12:48:36 +0800
Subject: [PATCH 4/7] =?UTF-8?q?fix:=20=E8=B0=83=E6=95=B4=E8=A7=A3=E5=86=B3?=
 =?UTF-8?q?=E6=96=B9=E6=A1=88=E5=88=97=E8=A1=A8=E6=B8=B2=E6=9F=93=E6=9C=BA?=
 =?UTF-8?q?=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 骨架屏：解决方案列表页骨架屏渲染由el-skeleton模板控制
---
 app/pages/solutions/index.vue | 118 ++++++++++++++++++++++++----------
 1 file changed, 84 insertions(+), 34 deletions(-)

diff --git a/app/pages/solutions/index.vue b/app/pages/solutions/index.vue
index 3bff38e..25507e0 100644
--- a/app/pages/solutions/index.vue
+++ b/app/pages/solutions/index.vue
@@ -8,41 +8,59 @@
 
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
-    <div v-if="!pending" class="solutions-container">
-      <el-tabs v-model="activeName" class="solutions-tabs">
-        <el-tab-pane :label="$t('all')" name="all">
-          <div class="solution-list">
-            <solution-card
-              v-for="solution in solutions"
-              :key="solution.id"
-              :title="solution.title"
-              :summary="solution.summary || ''"
-              :cover-url="getImageUrl(solution.cover || '')"
-              :document-id="solution.id.toString()"
+    <div class="solutions-container">
+      <el-skeleton
+        :loading="pending"
+        animated
+        :throttle="{
+          leading: 500,
+          trailing: 500,
+        }"
+      >
+        <template #template>
+          <div class="skeleton-group-list">
+            <el-skeleton-item
+              v-for="i in 12"
+              :key="i"
+              variant="rect"
+              class="skeleton-card"
             />
           </div>
-        </el-tab-pane>
-        <el-tab-pane
-          v-for="[key, value] in Object.entries(groupedSolutions)"
-          :key="key"
-          :label="key || '未分类'"
-          :name="key || 'no-category'"
-        >
-          <div class="solution-list">
-            <solution-card
-              v-for="solution in value.data"
-              :key="solution.id"
-              :document-id="solution.id.toString()"
-              :cover-url="getImageUrl(solution.cover || '')"
-              :title="solution.title"
-              :summary="solution.summary || ''"
-            />
-          </div>
-        </el-tab-pane>
-      </el-tabs>
-    </div>
-    <div v-else>
-      <el-skeleton :rows="6" animated />
+        </template>
+        <template #default>
+          <el-tabs v-model="activeName" class="solutions-tabs">
+            <el-tab-pane :label="$t('all')" name="all">
+              <div class="solution-list">
+                <solution-card
+                  v-for="solution in solutions"
+                  :key="solution.id"
+                  :title="solution.title"
+                  :summary="solution.summary || ''"
+                  :cover-url="getImageUrl(solution.cover || '')"
+                  :document-id="solution.id.toString()"
+                />
+              </div>
+            </el-tab-pane>
+            <el-tab-pane
+              v-for="[key, value] in Object.entries(groupedSolutions)"
+              :key="key"
+              :label="key || '未分类'"
+              :name="key || 'no-category'"
+            >
+              <div class="solution-list">
+                <solution-card
+                  v-for="solution in value.data"
+                  :key="solution.id"
+                  :document-id="solution.id.toString()"
+                  :cover-url="getImageUrl(solution.cover || '')"
+                  :title="solution.title"
+                  :summary="solution.summary || ''"
+                />
+              </div>
+            </el-tab-pane>
+          </el-tabs>
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -56,7 +74,9 @@
     { label: $t('navigation.solutions') },
   ];
 
-  const { data: solutions, pending, error } = await useSolutionList();
+  const { data, pending, error } = useSolutionList();
+
+  const solutions = computed(() => data.value ?? []);
 
   const activeName = ref<string>('all');
 
@@ -123,4 +143,34 @@
     margin-bottom: 2rem;
     gap: 40px;
   }
+
+  .skeleton-group-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 20px;
+    justify-content: flex-start;
+    margin-bottom: 2rem;
+  }
+
+  .skeleton-card {
+    width: 30%;
+    height: 200px;
+  }
+
+  @media (max-width: 1200px) {
+    .skeleton-card {
+      width: 45%;
+    }
+  }
+
+  @media (max-width: 768px) {
+    .skeleton-group-list {
+      justify-content: center;
+      align-items: center;
+    }
+
+    .skeleton-card {
+      width: 90%;
+    }
+  }
 </style>

From f2533767d29e3ef225c84e00fcede47ccfd7dd69 Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 12:53:01 +0800
Subject: [PATCH 5/7] =?UTF-8?q?fix:=20=E8=B0=83=E6=95=B4=E5=85=B3=E4=BA=8E?=
 =?UTF-8?q?=E6=88=91=E4=BB=AC=E9=A1=B5=E9=9D=A2=E6=B8=B2=E6=9F=93=E6=9C=BA?=
 =?UTF-8?q?=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 骨架屏：骨架屏由el-skeleton模板控制
---
 app/pages/about/index.vue | 63 ++++++++++++++++++++-------------------
 1 file changed, 33 insertions(+), 30 deletions(-)

diff --git a/app/pages/about/index.vue b/app/pages/about/index.vue
index 7f995a2..1bcd3b3 100644
--- a/app/pages/about/index.vue
+++ b/app/pages/about/index.vue
@@ -1,36 +1,37 @@
 <template>
   <div class="page-container">
-    <div v-if="!pending">
-      <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
+    <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
 
-      <div class="content">
-        <!-- eslint-disable-next-line vue/no-v-html -->
-        <div class="html-typography" v-html="companyProfile.content || ''" />
-        <!-- <div v-if="!hydrated" v-html="companyProfile.content || ''" /> -->
-        <!-- <div v-else> -->
-        <!--   <html-renderer -->
-        <!--     class="html-typography" -->
-        <!--     :html="companyProfile.content || ''" -->
-        <!--   /> -->
-        <!-- </div> -->
-      </div>
+    <div class="content">
+      <el-skeleton :loading="pending" :rows="10" animated>
+        <template #default>
+          <!-- eslint-disable-next-line vue/no-v-html -->
+          <div class="html-typography" v-html="companyProfile?.content || ''" />
+          <!-- <div v-if="!hydrated" v-html="companyProfile.content || ''" /> -->
+          <!-- <div v-else> -->
+          <!--   <html-renderer -->
+          <!--     class="html-typography" -->
+          <!--     :html="companyProfile.content || ''" -->
+          <!--   /> -->
+          <!-- </div> -->
 
-      <el-divider content-position="left">{{ $t('learn-more') }}</el-divider>
-      <div class="button-group">
-        <learn-more-card
-          :title="$t('navigation.contact-info')"
-          :icon="ElIconService"
-          :to="$localePath('/support/contact-us')"
-        />
-        <learn-more-card
-          :title="$t('navigation.address')"
-          :icon="ElIconMapLocation"
-          @click="openMap"
-        />
-      </div>
-    </div>
-    <div v-else class="loading">
-      <el-skeleton :rows="5" animated />
+          <el-divider content-position="left">{{
+            $t('learn-more')
+          }}</el-divider>
+          <div class="button-group">
+            <learn-more-card
+              :title="$t('navigation.contact-info')"
+              :icon="ElIconService"
+              :to="$localePath('/support/contact-us')"
+            />
+            <learn-more-card
+              :title="$t('navigation.address')"
+              :icon="ElIconMapLocation"
+              @click="openMap"
+            />
+          </div>
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -42,7 +43,9 @@
     { label: $t('navigation.home'), to: localePath('/') },
     { label: $t('navigation.about-us') },
   ];
-  const { data: companyProfile, pending, error } = await useCompanyProfile();
+  const { data, pending, error } = useCompanyProfile();
+
+  const companyProfile = computed(() => data.value ?? null);
 
   const openMap = () => {
     window.open(localePath('/locate'));

From aa267317313b21896d7458ada8af93100330f217 Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 13:26:26 +0800
Subject: [PATCH 6/7] =?UTF-8?q?fix:=20=E8=A1=A5=E5=85=A8=E9=AA=A8=E6=9E=B6?=
 =?UTF-8?q?=E5=B1=8F=E6=B8=B2=E6=9F=93=E6=9C=BA=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 补全各个页面的骨架屏渲染机制修改
---
 app/components/pages/search/SearchTabs.vue |  6 +++
 app/pages/download/[id].vue                | 16 +++++---
 app/pages/products/[slug].vue              | 42 ++++++++------------
 app/pages/search.vue                       | 45 +++++++++++++++-------
 app/pages/solutions/[slug].vue             | 29 ++++++--------
 5 files changed, 77 insertions(+), 61 deletions(-)

diff --git a/app/components/pages/search/SearchTabs.vue b/app/components/pages/search/SearchTabs.vue
index 1d9e4b5..1cfedd6 100644
--- a/app/components/pages/search/SearchTabs.vue
+++ b/app/components/pages/search/SearchTabs.vue
@@ -47,3 +47,9 @@
     currentPage.value = 1; // 重置页码
   });
 </script>
+
+<style scoped>
+  .el-tabs {
+    width: 100%;
+  }
+</style>
diff --git a/app/pages/download/[id].vue b/app/pages/download/[id].vue
index 2eab179..5cac282 100644
--- a/app/pages/download/[id].vue
+++ b/app/pages/download/[id].vue
@@ -4,11 +4,17 @@
       <h1 class="page-title">{{ $t('navigation.downloads') }}</h1>
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
-    <div v-if="!pending" class="page-content">
-      <file-card :file-id="id" :file="file" />
-    </div>
-    <div v-else>
-      <el-skeleton :rows="6" animated />
+    <div class="page-content">
+      <el-skeleton
+        :loading="pending"
+        :rows="6"
+        animated
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #default>
+          <file-card :file-id="id" :file="file" />
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
diff --git a/app/pages/products/[slug].vue b/app/pages/products/[slug].vue
index a32daa8..a079be1 100644
--- a/app/pages/products/[slug].vue
+++ b/app/pages/products/[slug].vue
@@ -1,31 +1,21 @@
 <template>
   <div class="page-container">
-    <div v-if="!pending">
-      <div v-if="product">
-        <!-- 面包屑导航 -->
-        <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
-        <!-- 产品详情内容 -->
-        <product-header :product="product" />
-        <!-- 产品详细描述 -->
-        <product-detail :product="product" />
-      </div>
-      <!-- 未找到产品 -->
-      <div v-else class="not-found">
-        <not-found-result
-          :title="$t('product-not-found')"
-          :sub-title="$t('product-not-found-desc')"
-          :back-text="$t('back-to-products')"
-          :on-back="() => $router.push($localePath('/products'))"
-        />
-      </div>
+    <div v-if="product">
+      <!-- 面包屑导航 -->
+      <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
+      <!-- 产品详情内容 -->
+      <product-header :product="product" />
+      <!-- 产品详细描述 -->
+      <product-detail :product="product" />
     </div>
-    <div v-else class="loading">
-      <el-skeleton style="--el-skeleton-circle-size: 400px">
-        <template #template>
-          <el-skeleton-item variant="circle" />
-        </template>
-      </el-skeleton>
-      <el-skeleton :rows="5" animated />
+    <!-- 未找到产品 -->
+    <div v-else class="not-found">
+      <not-found-result
+        :title="$t('product-not-found')"
+        :sub-title="$t('product-not-found-desc')"
+        :back-text="$t('back-to-products')"
+        :on-back="() => $router.push($localePath('/products'))"
+      />
     </div>
   </div>
 </template>
@@ -37,7 +27,7 @@
   // 获取路由参数
   const id = route.params.slug as string;
 
-  const { data: product, pending, error } = await useProduct(id);
+  const { data: product, error } = await useProduct(id);
 
   const breadcrumbItems = computed(() => [
     { label: $t('navigation.home'), to: localePath('/') },
diff --git a/app/pages/search.vue b/app/pages/search.vue
index d555bb5..06501f6 100644
--- a/app/pages/search.vue
+++ b/app/pages/search.vue
@@ -1,18 +1,33 @@
 <template>
   <div class="search-page">
     <search-header v-model="keyword" />
-    <div v-if="loading" class="search-state">
-      <el-skeleton :rows="4" animated />
-    </div>
-    <search-tabs v-else-if="hasResults" :search-items="searchItems" />
-    <div v-else class="search-state">
-      <el-empty
-        :description="
-          route.query.query
-            ? $t('search.no-results', { query: route.query?.query })
-            : $t('search.no-query')
-        "
-      />
+    <div class="search-state">
+      <el-skeleton
+        :loading="loading"
+        animated
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #template>
+          <el-skeleton-item
+            v-for="i in 10"
+            :key="i"
+            variant="rect"
+            class="skeleton-item"
+          />
+        </template>
+        <template #default>
+          <search-tabs v-if="hasResults" :search-items="searchItems" />
+          <div v-else>
+            <el-empty
+              :description="
+                route.query.query
+                  ? $t('search.no-results', { query: route.query?.query })
+                  : $t('search.no-query')
+              "
+            />
+          </div>
+        </template>
+      </el-skeleton>
     </div>
   </div>
 </template>
@@ -96,7 +111,11 @@
   .search-state {
     display: flex;
     justify-content: center;
-    padding: 3rem 0;
+  }
+
+  .skeleton-item {
+    height: 80px;
+    margin-bottom: 1rem;
   }
 
   @media (max-width: 640px) {
diff --git a/app/pages/solutions/[slug].vue b/app/pages/solutions/[slug].vue
index d35332a..6ef5650 100644
--- a/app/pages/solutions/[slug].vue
+++ b/app/pages/solutions/[slug].vue
@@ -1,23 +1,18 @@
 <template>
   <div class="page-container">
-    <div v-if="!pending">
-      <div v-if="solution">
-        <div class="page-header">
-          <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
-        </div>
-        <solution-detail :solution="solution" />
-      </div>
-      <div v-else class="not-found">
-        <not-found-result
-          :title="$t('solution-not-found')"
-          :sub-title="$t('solution-not-found-desc')"
-          :back-text="$t('back-to-solutions')"
-          :on-back="() => $router.push($localePath('/solutions'))"
-        />
+    <div v-if="solution">
+      <div class="page-header">
+        <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
       </div>
+      <solution-detail :solution="solution" />
     </div>
-    <div v-else class="loading">
-      <el-skeleton :rows="5" animated />
+    <div v-else class="not-found">
+      <not-found-result
+        :title="$t('solution-not-found')"
+        :sub-title="$t('solution-not-found-desc')"
+        :back-text="$t('back-to-solutions')"
+        :on-back="() => $router.push($localePath('/solutions'))"
+      />
     </div>
   </div>
 </template>
@@ -29,7 +24,7 @@
   // 获取路由参数
   const id = route.params.slug as string;
 
-  const { data: solution, pending, error } = await useSolution(id);
+  const { data: solution, error } = await useSolution(id);
 
   const breadcrumbItems = computed(() => [
     { label: $t('navigation.home'), to: localePath('/') },

From 76fb3ddcb7bdc0be840df1e462dedca417c048be Mon Sep 17 00:00:00 2001
From: R2m1liA <15258427350@163.com>
Date: Fri, 19 Dec 2025 13:26:48 +0800
Subject: [PATCH 7/7] =?UTF-8?q?fix:=20=E9=87=8D=E5=AE=9A=E5=90=91=E9=A1=B5?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/pages/locate.vue | 18 +++++++++++++++++-
 i18n/locales/en.json |  3 ++-
 i18n/locales/es.json |  3 ++-
 i18n/locales/ru.json |  3 ++-
 i18n/locales/zh.json |  3 ++-
 5 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/app/pages/locate.vue b/app/pages/locate.vue
index 79ad95e..8f7fd74 100644
--- a/app/pages/locate.vue
+++ b/app/pages/locate.vue
@@ -1,5 +1,7 @@
 <template>
-  <div>redirecting...</div>
+  <div class="page-container">
+    <h1>{{ $t('redirecting') }}</h1>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -10,3 +12,17 @@
     window.location.href = platform;
   });
 </script>
+
+<style scoped>
+  .page-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: 80vh;
+  }
+
+  h1 {
+    font-size: 1.5rem;
+    font-weight: bold;
+  }
+</style>
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index f800678..8f9c7be 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -127,5 +127,6 @@
     "specs": "Specifications",
     "faq": "FAQ",
     "documents": "Documents"
-  }
+  },
+  "redirecting": "Redirecting..."
 }
diff --git a/i18n/locales/es.json b/i18n/locales/es.json
index e0a0095..5418311 100644
--- a/i18n/locales/es.json
+++ b/i18n/locales/es.json
@@ -126,5 +126,6 @@
     "specs": "Especificaciones",
     "faq": "FAQ",
     "documents": "Documentos"
-  }
+  },
+  "redirecting": "Redirigiendo..."
 }
diff --git a/i18n/locales/ru.json b/i18n/locales/ru.json
index a8609ad..4b1bcab 100644
--- a/i18n/locales/ru.json
+++ b/i18n/locales/ru.json
@@ -126,5 +126,6 @@
     "specs": "Технические спецификации",
     "faq": "Часто задаваемые вопросы",
     "documents": "Связанные документы"
-  }
+  },
+  "redirecting": "Перенаправление..."
 }
diff --git a/i18n/locales/zh.json b/i18n/locales/zh.json
index e0ced48..78c9ed9 100644
--- a/i18n/locales/zh.json
+++ b/i18n/locales/zh.json
@@ -126,5 +126,6 @@
     "specs": "技术规格",
     "faq": "常见问题",
     "documents": "相关文档"
-  }
+  },
+  "redirecting": "正在跳转..."
 }