fix: 调整服务支持页面渲染模式

- 将条件渲染由div判断改为el-skeleton template

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[] = [];