Files
gxwebsoft 2b69686795 feat(app): 添加多模板关于我们页面及相关路由和404页面
- 新增404页面,优化未找到页面体验,避免被搜索引擎索引
- 增加文件代理接口,隐藏真实文件服务器地址,支持文件请求代理
- 实现/article、/case、/product及/page动态路由兼容列表与详情展示
- 添加动态CMS页面兼容入口处理旧式路径,统一路由与SEO设置
- 新增模板1、模板7、模板2、模板3关于我们页面,实现多模板支持
- 模板增强支持CMS单页内容加载及SEO信息动态设置
- 配置环境变量及Git忽略文件规则辅助开发和构建环境管理
2026-09-08 12:13:44 +08:00

53 lines
2.3 KiB
Vue

<template>
<section v-if="enabled" class="py-16 lg:py-20 bg-[#0f0f0f]">
<div class="container mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-white mb-4" data-reveal>
{{ title }}
</h2>
<div class="w-16 h-1 bg-[#d4af37] mx-auto mb-4" data-reveal data-reveal-delay="100" />
<p v-if="subtitle" class="text-[#a0a0a0] max-w-2xl mx-auto" data-reveal data-reveal-delay="200">
{{ subtitle }}
</p>
</div>
<div class="grid sm:grid-cols-2 lg:grid-cols-4 gap-6">
<div
v-for="(item, index) in items"
:key="item.title || index"
class="bg-[#1a1a1a] border border-[#333] rounded-xl p-6 hover:border-[#d4af37]/50 transition-all duration-300 anim-card group"
data-reveal
:data-reveal-delay="index * 100"
>
<div
class="w-12 h-12 rounded-lg bg-[#d4af37]/10 flex items-center justify-center mb-4 transition-transform duration-300 group-hover:scale-110"
>
<FeatureIcon :name="item.icon" class="w-6 h-6 text-[#d4af37]" />
</div>
<h3 class="text-lg font-semibold text-white mb-2">{{ item.title }}</h3>
<p class="text-sm text-[#a0a0a0] leading-relaxed">{{ item.desc }}</p>
</div>
</div>
</div>
</section>
</template>
<script setup lang="ts">
/**
* 模板 4 - 核心业务模块(黑金高端风,后台可配置)
* 数据来自 useFeatures(),未配置时回退到人力资源行业默认数据。
*/
import FeatureIcon from '~/components/FeatureIcon.vue'
import { useFeatures } from '~/composables/useFeatures'
import type { FeatureItem } from '~/types'
const defaultFeatures: FeatureItem[] = [
{ title: '人才招聘', desc: '覆盖蓝领、白领、高端人才全渠道招聘,精准匹配企业用工需求。', icon: 'users' },
{ title: '劳务派遣', desc: '合规灵活的派遣方案,降低用工风险,提升组织弹性。', icon: 'user' },
{ title: '人事外包', desc: '入离职、档案、考勤、薪酬全流程外包,让企业聚焦核心业务。', icon: 'document' },
{ title: '薪酬社保', desc: '专业薪税筹划与社保代缴,确保合规准时,省心省力。', icon: 'money' }
]
const { enabled, title, subtitle, items } = useFeatures(defaultFeatures)
</script>