gxwebsoft
2b69686795
- 新增404页面，优化未找到页面体验，避免被搜索引擎索引 - 增加文件代理接口，隐藏真实文件服务器地址，支持文件请求代理 - 实现/article、/case、/product及/page动态路由兼容列表与详情展示 - 添加动态CMS页面兼容入口处理旧式路径，统一路由与SEO设置 - 新增模板1、模板7、模板2、模板3关于我们页面，实现多模板支持 - 模板增强支持CMS单页内容加载及SEO信息动态设置 - 配置环境变量及Git忽略文件规则辅助开发和构建环境管理
101 lines
3.7 KiB
Vue
101 lines
3.7 KiB
Vue
<template>
|
||
<footer class="bg-[var(--t9-footer-bg)] text-[var(--t9-footer-text)]">
|
||
<div class="t9-container py-10">
|
||
<!-- 上排：四列信息 -->
|
||
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 md:gap-8">
|
||
<div>
|
||
<div class="text-sm text-white/85 mb-2">版权合作</div>
|
||
<p class="text-sm leading-relaxed break-all">{{ copyrightContact }}</p>
|
||
</div>
|
||
<div>
|
||
<div class="text-sm text-white/85 mb-2">联系电话</div>
|
||
<p class="text-sm leading-relaxed">{{ phone || '—' }}</p>
|
||
</div>
|
||
<div>
|
||
<div class="text-sm text-white/85 mb-2">电子邮箱</div>
|
||
<p class="text-sm leading-relaxed break-all">{{ email || '—' }}</p>
|
||
</div>
|
||
<div>
|
||
<div class="text-sm text-white/85 mb-2">客服微信</div>
|
||
<div v-if="wxQrcode" class="mt-1">
|
||
<img :src="wxQrcode" alt="微信二维码" class="w-24 h-24 object-contain bg-white p-1">
|
||
<p class="text-xs mt-1">{{ siteConfig?.wxQrcodeText || '扫码关注' }}</p>
|
||
</div>
|
||
<p v-else class="text-sm leading-relaxed">{{ address || '—' }}</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 页脚导航链接（后台 top!==1 的底部菜单） -->
|
||
<nav v-if="quickLinks.length" class="mt-8 pt-6 border-t border-white/10 flex flex-wrap gap-x-6 gap-y-2">
|
||
<NuxtLink
|
||
v-for="link in quickLinks"
|
||
:key="link.navigationId || link.path"
|
||
:to="getNavLink(link)"
|
||
:target="link.target === '_blank' ? '_blank' : undefined"
|
||
class="text-sm hover:text-white transition-colors"
|
||
>
|
||
{{ link.title }}
|
||
</NuxtLink>
|
||
</nav>
|
||
|
||
<!-- 下排：版权 + 备案 -->
|
||
<div
|
||
class="mt-8 pt-6 border-t border-white/10 flex flex-wrap items-center justify-center gap-x-5 gap-y-2 text-xs text-center"
|
||
>
|
||
<span>{{ copyright || `Copyright © ${new Date().getFullYear()} ${siteName || ''} 版权所有` }}</span>
|
||
<a
|
||
v-if="icpNo"
|
||
href="https://beian.miit.gov.cn"
|
||
target="_blank"
|
||
rel="nofollow"
|
||
class="hover:text-white transition-colors"
|
||
>{{ icpNo }}</a>
|
||
<a
|
||
v-if="siteInfo?.policeNo"
|
||
:href="policeUrl"
|
||
target="_blank"
|
||
rel="nofollow"
|
||
class="hover:text-white transition-colors"
|
||
>{{ siteInfo.policeNo }}</a>
|
||
<a
|
||
rel="nofollow"
|
||
href="https://site.websoft.top"
|
||
target="_blank"
|
||
class="hover:text-white transition-colors"
|
||
>Powered by 云·企业官网</a>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
/**
|
||
* 模板 9 - Footer 组件（墨绿文化出版风，对齐漓江出版社官网）
|
||
* 深色底 + 四列信息（版权合作 / 联系电话 / 电子邮箱 / 客服微信）+ 备案信息居中
|
||
*/
|
||
import type { CmsNavigation } from '~/types'
|
||
|
||
const {
|
||
siteInfo, siteName, siteConfig, bottomNavigations,
|
||
phone, email, address, copyright, wxQrcode, icpNo
|
||
} = useSite()
|
||
|
||
/** 版权合作联系方式：优先邮箱，其次电话 */
|
||
const copyrightContact = computed(() => email.value || phone.value || '—')
|
||
|
||
/** 公安备案查询地址（从备案号中提取数字部分） */
|
||
const policeUrl = computed(() => {
|
||
const no = String(siteInfo.value?.policeNo || '')
|
||
const code = no.replace(/\D/g, '')
|
||
return code
|
||
? `https://beian.mps.gov.cn/#/query/webSearch?code=${code}`
|
||
: 'https://beian.mps.gov.cn/'
|
||
})
|
||
|
||
/** 页脚链接：取底部导航（top!==1） */
|
||
const quickLinks = computed<CmsNavigation[]>(() => {
|
||
const navs = bottomNavigations.value || []
|
||
return navs.filter((nav) => nav.model !== 'index').slice(0, 8)
|
||
})
|
||
</script>
|