gxwebsoft
2b69686795
- 新增404页面，优化未找到页面体验，避免被搜索引擎索引 - 增加文件代理接口，隐藏真实文件服务器地址，支持文件请求代理 - 实现/article、/case、/product及/page动态路由兼容列表与详情展示 - 添加动态CMS页面兼容入口处理旧式路径，统一路由与SEO设置 - 新增模板1、模板7、模板2、模板3关于我们页面，实现多模板支持 - 模板增强支持CMS单页内容加载及SEO信息动态设置 - 配置环境变量及Git忽略文件规则辅助开发和构建环境管理
70 lines
1.8 KiB
Vue
70 lines
1.8 KiB
Vue
<template>
|
||
<NuxtLink to="/" class="flex items-center gap-2" :class="linkClass">
|
||
<!-- 优先使用完整 Logo 图片 -->
|
||
<img
|
||
v-if="logo"
|
||
:src="logo"
|
||
:alt="name || defaultName"
|
||
:class="logoClass"
|
||
>
|
||
<!-- 无 Logo 时：优先使用站点图标 + 网站名称 -->
|
||
<template v-else>
|
||
<img
|
||
v-if="icon"
|
||
:src="icon"
|
||
:alt="name || defaultName"
|
||
:class="iconClass || 'h-8 w-auto object-contain'"
|
||
>
|
||
<!-- 没有站点图标时，模板可传入自定义默认图标 -->
|
||
<slot v-else name="fallback-icon" />
|
||
<span
|
||
v-if="showName !== false"
|
||
:class="nameClass"
|
||
>
|
||
{{ name || defaultName }}
|
||
</span>
|
||
</template>
|
||
</NuxtLink>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
/**
|
||
* 站点品牌展示组件
|
||
*
|
||
* 统一 Header / Footer 等位置的 Logo 回退逻辑：
|
||
* 1. 有站点 Logo（亮色 logo 图片）→ 直接显示图片
|
||
* 2. 无 Logo 但有站点图标（appIcon / websiteIcon）→ 显示「图标 + 网站名称」
|
||
* 3. 都没有 → 渲染模板自定义的 fallback-icon slot，并显示网站名称
|
||
*/
|
||
withDefaults(defineProps<{
|
||
/** 站点 Logo 图片地址（siteLogo） */
|
||
logo?: string
|
||
/** 站点图标地址（siteIcon） */
|
||
icon?: string
|
||
/** 站点名称（siteName） */
|
||
name?: string
|
||
/** 名称兜底文案 */
|
||
defaultName?: string
|
||
/** 是否显示名称 */
|
||
showName?: boolean
|
||
/** 外层 NuxtLink 额外 class */
|
||
linkClass?: string
|
||
/** Logo 图片 class */
|
||
logoClass?: string
|
||
/** 图标 class */
|
||
iconClass?: string
|
||
/** 名称 class */
|
||
nameClass?: string
|
||
}>(), {
|
||
logo: '',
|
||
icon: '',
|
||
name: '',
|
||
defaultName: '企业官网',
|
||
showName: true,
|
||
linkClass: '',
|
||
logoClass: '',
|
||
iconClass: '',
|
||
nameClass: ''
|
||
})
|
||
</script>
|