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

refactor: 将各个页面的面包屑导航提取为单独组件AppBreadcrumb

Browse Source
This commit is contained in:
R2m1liA
2025-10-28 16:16:57 +08:00
parent dc90e1045b
commit c6e0ea2a47
11 changed files with 116 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,23 +3,7 @@
<support-tabs model-value="contact-us" />
<div class="page-header">
<h1 class="page-title">{{ $t('navigation.contact-info') }}</h1>
<el-breadcrumb class="breadcrumb" separator="/">
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/')">
{{ $t('navigation.home') }}
</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support')">
{{ $t('navigation.support') }}
</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support/contact-us')">
{{ $t('navigation.contact-info') }}
</NuxtLink>
</el-breadcrumb-item>
</el-breadcrumb>
<app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
</div>
<div v-if="!pending" class="page-content">
@ -32,6 +16,12 @@
</template>
<script setup lang="ts">
const localePath = useLocalePath();
const breadcrumbItems = [
{ label: $t('navigation.home'), to: localePath('/') },
{ label: $t('navigation.support'), to: localePath('/support') },
{ label: $t('navigation.contact-info') },
];
const { data, pending, error } = await useContactInfo();
const content = computed(() => toContactInfoView(data.value));

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

@ -7,23 +7,7 @@
<support-tabs model-value="documents" />
<div class="page-header">
<h1 class="page-title">{{ $t('navigation.documents') }}</h1>
<el-breadcrumb class="breadcrumb" separator="/">
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/')">{{
$t('navigation.home')
}}</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support')">{{
$t('navigation.support')
}}</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support/documents')">{{
$t('navigation.documents')
}}</NuxtLink>
</el-breadcrumb-item>
</el-breadcrumb>
<app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
</div>
<div class="document-category">
<el-row :gutter="12">
@ -78,6 +62,13 @@
<script setup lang="ts">
import { Search } from '@element-plus/icons-vue';
const localePath = useLocalePath();
const breadcrumbItems = [
{ label: $t('navigation.home'), to: localePath('/') },
{ label: $t('navigation.support'), to: localePath('/support') },
{ label: $t('navigation.documents') },
];
const { data, pending, error } = await useDocumentList();
const documents = computed(

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

@ -7,23 +7,7 @@
<support-tabs model-value="faq" />
<div class="page-header">
<h1 class="page-title">{{ $t('navigation.faq') }}</h1>
<el-breadcrumb class="breadcrumb" separator="/">
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/')">{{
$t('navigation.home')
}}</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support')">{{
$t('navigation.support')
}}</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support/faq')">{{
$t('navigation.faq')
}}</NuxtLink>
</el-breadcrumb-item>
</el-breadcrumb>
<app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
</div>
<div class="question-category">
@ -79,6 +63,14 @@
<script setup lang="ts">
import { Search } from '@element-plus/icons-vue';
const localePath = useLocalePath();
const breadcrumbItems = [
{ label: $t('navigation.home'), to: localePath('/') },
{ label: $t('navigation.support'), to: localePath('/support') },
{ label: $t('navigation.faq') },
];
const { data, pending, error } = await useQuestionList();
const questions = computed(

28
app/pages/support/index.vue
View File

@ -1,22 +1,11 @@
<template>
<div class="page-container">
<support-tabs />
<div class="page-header">
<h1 class="page-title">{{ $t('navigation.support') }}</h1>
<app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
</div>
<div class="page-content">
<div class="page-header">
<h1 class="page-title">{{ $t('navigation.support') }}</h1>
<el-breadcrumb class="breadcrumb" separator="/">
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/')">{{
$t('navigation.home')
}}</NuxtLink>
</el-breadcrumb-item>
<el-breadcrumb-item class="text-md opacity-50">
<NuxtLink :to="$localePath('/support')">{{
$t('navigation.support')
}}</NuxtLink>
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<section style="margin-bottom: 2rem">
<p>
金申机械制造有限公司致力于为客户提供优质的产品与服务。针对纸管机、分纸机、纸吸管等产品，我们提供全方位的售后服务，确保客户能够安心地使用我们的产品。
@ -109,7 +98,13 @@
</div>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
const localePath = useLocalePath();
const breadcrumbItems = [
{ label: $t('navigation.home'), to: localePath('/') },
{ label: $t('navigation.support') },
];
</script>
<style scoped>
.page-container {
@ -119,6 +114,7 @@
.page-header {
display: flex;
padding: 2rem 2rem 0rem;
}
.page-title {