gxwebsoft
2b69686795
- 新增404页面，优化未找到页面体验，避免被搜索引擎索引 - 增加文件代理接口，隐藏真实文件服务器地址，支持文件请求代理 - 实现/article、/case、/product及/page动态路由兼容列表与详情展示 - 添加动态CMS页面兼容入口处理旧式路径，统一路由与SEO设置 - 新增模板1、模板7、模板2、模板3关于我们页面，实现多模板支持 - 模板增强支持CMS单页内容加载及SEO信息动态设置 - 配置环境变量及Git忽略文件规则辅助开发和构建环境管理
125 lines
4.8 KiB
Vue
125 lines
4.8 KiB
Vue
<template>
|
||
<div>
|
||
<!-- 首屏：受 hero/banner 开关控制 -->
|
||
<HeroSection :show-banner="homeBlocks.banner" :show-hero-features="homeBlocks.hero" />
|
||
|
||
<!-- 我们的优势：FeatureSection 内部已根据 advantages.enabled 自显隐 -->
|
||
<FeatureSection />
|
||
|
||
<!-- 关于我们 -->
|
||
<AboutSection
|
||
title-color="text-gray-900"
|
||
accent-color="#3b82f6"
|
||
summary-color="text-gray-600"
|
||
link-color="text-blue-600"
|
||
container-class="container mx-auto px-4 sm:px-6 lg:px-8 grid lg:grid-cols-2 gap-12 items-center"
|
||
image-bg-color="bg-gray-100"
|
||
image-object-fit="object-cover"
|
||
/>
|
||
|
||
<!-- 推荐/置顶产品（全站跨栏目精选置顶产品 top>0；受后台「产品展示」区块开关控制） -->
|
||
<RecommendProductsSection
|
||
v-if="showProducts"
|
||
title="产品展示"
|
||
subtitle="了解我们的核心产品与解决方案"
|
||
accent-color="#3b82f6"
|
||
title-color="#111827"
|
||
subtitle-color="#4b5563"
|
||
:limit="3"
|
||
:more-link="productNav?.path || '/products'"
|
||
more-text="查看更多"
|
||
/>
|
||
|
||
<!-- 案例展示（上游无推荐字段，默认最新案例；受后台「案例展示」区块开关控制） -->
|
||
<RecommendCasesSection
|
||
v-if="showCases"
|
||
title="案例展示"
|
||
subtitle="真实案例呈现，见证客户成功"
|
||
accent-color="#3b82f6"
|
||
title-color="#111827"
|
||
subtitle-color="#4b5563"
|
||
:limit="3"
|
||
:more-link="caseNav?.path || '/case'"
|
||
more-text="查看更多案例"
|
||
/>
|
||
|
||
<!-- 推荐资讯（全站跨栏目精选推荐文章 recommend=1；受后台「最新动态」区块开关控制） -->
|
||
<RecommendArticlesSection
|
||
v-if="showNews"
|
||
title="最新动态"
|
||
subtitle="了解企业最新资讯与行业动态"
|
||
accent-color="#3b82f6"
|
||
title-color="#111827"
|
||
subtitle-color="#4b5563"
|
||
:limit="3"
|
||
:more-link="newsNav?.path || '/news'"
|
||
more-text="查看更多"
|
||
/>
|
||
|
||
<!-- 联系我们 -->
|
||
<section v-if="showCta" class="py-16 lg:py-20 bg-blue-50">
|
||
<div class="container mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
||
<h2 class="text-2xl sm:text-3xl font-bold text-gray-900 mb-4" data-reveal>
|
||
准备好开始了吗？
|
||
</h2>
|
||
<p class="text-gray-600 max-w-2xl mx-auto mb-8" data-reveal data-reveal-delay="100">
|
||
立即联系我们，获取专属企业官网解决方案
|
||
</p>
|
||
<button
|
||
type="button"
|
||
class="inline-flex items-center justify-center px-8 py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition-colors anim-shimmer"
|
||
@click="openConsult()"
|
||
>
|
||
立即咨询
|
||
</button>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
/**
|
||
* 模板 1 - 首页
|
||
* 产品 / 案例 / 资讯三个区块改为读取「推荐 / 置顶」精选内容（全站跨栏目），
|
||
* 由共享组件 RecommendProductsSection / RecommendCasesSection / RecommendArticlesSection 承载，
|
||
* 逻辑见 app/composables/useRecommend.ts。
|
||
* 各区块显示仍受后台「首页区块总览」开关（siteInfo.setting.features）控制。
|
||
*/
|
||
import HeroSection from '../components/HeroSection.vue'
|
||
import FeatureSection from '../components/FeatureSection.vue'
|
||
import { useFeatures } from '~/composables/useFeatures'
|
||
import type { CmsNavigation } from '~/types'
|
||
|
||
const { siteInfo, navigations, fetchSiteInfo } = useSite()
|
||
const { openConsult } = useConsult()
|
||
const { homeBlocks } = useFeatures([
|
||
{ title: '企业优势', desc: '快速建立品牌信任感，展示企业实力与核心竞争力。', icon: 'building' },
|
||
{ title: '核心产品', desc: '清晰的产品展示与分类，帮助客户快速了解产品价值。', icon: 'box' },
|
||
{ title: '客户案例', desc: '真实案例呈现，增强说服力，促进客户决策。', icon: 'case' },
|
||
{ title: '在线留言', desc: '便捷的留言咨询通道，不错过任何潜在客户。', icon: 'message' }
|
||
])
|
||
|
||
// 获取站点信息（含导航）
|
||
await fetchSiteInfo()
|
||
|
||
/** 各区块显隐开关（后台首页区块总览） */
|
||
const showProducts = computed(() => homeBlocks.value.products)
|
||
const showCases = computed(() => homeBlocks.value.cases)
|
||
const showNews = computed(() => homeBlocks.value.news)
|
||
const showCta = computed(() => homeBlocks.value.cta)
|
||
|
||
/** 从导航中定位各模块，用于「查看更多」跳转 */
|
||
const newsNav = computed<CmsNavigation | undefined>(() => {
|
||
const navs = navigations.value || []
|
||
return navs.find((n) => n.model === 'article')
|
||
})
|
||
const productNav = computed<CmsNavigation | undefined>(() => {
|
||
const navs = navigations.value || []
|
||
return navs.find((n) => n.model === 'product')
|
||
})
|
||
const caseNav = computed<CmsNavigation | undefined>(() => {
|
||
const navs = navigations.value || []
|
||
return navs.find((n) => n.model === 'case')
|
||
})
|
||
</script>
|