remilia/jinshen-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 页面懒加载 #98

Manually merged
remilia merged 7 commits from feat/lazy-load into master 2025-12-19 13:28:25 +08:00
Conversation 1 Commits 7 Files Changed 16 +65 -37
3 changed files with 65 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fa1a22b286 - Show all commits

10
app/pages/support/contact-us.vue
View File

@ -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) {

27
app/pages/support/documents.vue
View File

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

27
app/pages/support/faq.vue
View File

@ -1,16 +1,30 @@
<template>
<div class="page-container">
<div v-if="pending" class="flex justify-center items-center h-64">
<el-skeleton :rows="6" animated />
</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">
<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"
@ -30,7 +44,6 @@
/>
</div>
</div>
</div>
</template>
<script setup lang="ts">
@ -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[] = [];