Fix: 修正部分加载Bug & 调整页面样式
This commit is contained in:
@ -1,16 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item class="text-sm opacity-50" :to="{ path: $localePath('/') }">
|
||||
{{ $t('navigation.home') }}
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item class="text-sm opacity-50">
|
||||
{{ $t('contact-info') }}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<div class="page-container">
|
||||
<div v-if="content">
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item class="text-sm opacity-50" :to="{ path: $localePath('/') }">
|
||||
{{ $t('navigation.home') }}
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item class="text-sm opacity-50">
|
||||
{{ $t('navigation.contact-info') }}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
|
||||
<div class="content">
|
||||
<markdown-renderer :content="content || ''" />
|
||||
<div class="content">
|
||||
<markdown-renderer :content="content || ''" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="loading">
|
||||
<el-skeleton :rows="5" animated />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -41,6 +46,10 @@ onMounted(async () => {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.page-container {
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
padding: 1rem 1rem;
|
||||
}
|
||||
|
||||
@ -1,27 +1,34 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item class="text-sm opacity-50" :to="{ path: $localePath('/') }">
|
||||
{{ $t('navigation.home') }}
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item class="text-sm opacity-50">
|
||||
{{ $t('about-us') }}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<div class="page-container">
|
||||
<div v-if="content">
|
||||
<el-breadcrumb class="breadcrumb" separator="/">
|
||||
<el-breadcrumb-item class="text-sm opacity-50" :to="{ path: $localePath('/') }">
|
||||
{{ $t('navigation.home') }}
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item class="text-sm opacity-50">
|
||||
{{ $t('navigation.about-us') }}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
|
||||
<div class="content">
|
||||
<markdown-renderer :content="content || ''" />
|
||||
<div class="content">
|
||||
<markdown-renderer :content="content || ''" />
|
||||
</div>
|
||||
|
||||
<el-divider content-position="left">更多信息</el-divider>
|
||||
<div class="button-group">
|
||||
<NuxtLink :to="$localePath('/about/contact-us')">
|
||||
<el-card class="card-button">
|
||||
<el-icon class="icon" size="80">
|
||||
<ElIconService />
|
||||
</el-icon>
|
||||
<br>
|
||||
联系信息
|
||||
</el-card>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-divider content-position="left">更多信息</el-divider>
|
||||
<div class="button-group">
|
||||
<NuxtLink :to="$localePath('/about/contact-us')">
|
||||
<el-card class="card-button">
|
||||
<el-icon class="icon" size="80"><ElIconService /></el-icon>
|
||||
<br>
|
||||
联系信息
|
||||
</el-card>
|
||||
</NuxtLink>
|
||||
<div v-else class="loading">
|
||||
<el-skeleton :rows="5" animated />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -32,12 +39,11 @@ const { getStrapiLocale } = useLocalizations()
|
||||
|
||||
const strapiLocale = getStrapiLocale()
|
||||
|
||||
const content = ref<string>('')
|
||||
const content = ref<string | null>(null)
|
||||
|
||||
onMounted(async () => {
|
||||
try {
|
||||
const response = await findOne<StrapiCompanyProfile>('company-profile', undefined, {
|
||||
populate: '*',
|
||||
locale: strapiLocale,
|
||||
})
|
||||
if (response.data) {
|
||||
@ -52,6 +58,10 @@ onMounted(async () => {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.page-container {
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
padding: 1rem 1rem;
|
||||
}
|
||||
@ -99,4 +109,11 @@ onMounted(async () => {
|
||||
.icon {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.loading {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user