feat(cms): 品牌叙事与结构性文案全站 CMS 化并补齐信任证据阶段 0
- 品牌叙事内核(价值主张/定位/承诺/三支柱/语气)下沉 site-config,经 SiteConfigProvider 注入全站 - 新增 page-copy 内容模型承载结构性文案(章节标题/眉标/描述/CTA/空状态),覆盖首页+服务/方案/产品/案例/新闻列表页,「CMS 优先 + 硬编码兜底」不白屏 - 首页「首批客户共创计划」板块(earlyAccessTitle/CtaLabel/Status 驱动)替代单行标签,如实呈现共创/内测/授权公开三档状态 - 关于页资质区数据空时如实展示「建设中」空态 - 零编造:不虚构客户/数据/资质
This commit is contained in:
@@ -8,6 +8,8 @@ import type { Product } from '@/lib/constants/products';
|
||||
|
||||
const EASE_OUT = [0.22, 1, 0.36, 1] as const;
|
||||
|
||||
type PageCopy = Record<string, unknown>;
|
||||
|
||||
const INDUSTRY_ICONS: Record<string, LucideIcon> = {
|
||||
制造业: Factory,
|
||||
贸易零售: ShoppingCart,
|
||||
@@ -17,7 +19,14 @@ const INDUSTRY_ICONS: Record<string, LucideIcon> = {
|
||||
物流运输: Truck,
|
||||
};
|
||||
|
||||
function HeroSection() {
|
||||
function HeroSection({ pageCopy }: { pageCopy?: PageCopy | null }) {
|
||||
const heroTitle1 = (pageCopy?.solutionsHeroTitle1 as string) || '专注行业场景的';
|
||||
const heroTitle2 = (pageCopy?.solutionsHeroTitle2 as string) || '解决方案';
|
||||
const heroDescriptionLines = ((pageCopy?.solutionsHeroDescription as string) ||
|
||||
'端到端交付可量化的业务成果。\n基于自研产品矩阵,为制造、零售、教育、医疗、金融、物流六大行业沉淀最佳实践。').split('\n');
|
||||
const ctaPrimary = (pageCopy?.solutionsCtaPrimary as string) || '立即咨询';
|
||||
const ctaSecondary = (pageCopy?.solutionsCtaSecondary as string) || '浏览产品';
|
||||
|
||||
return (
|
||||
<section className="relative min-h-[85vh] flex items-center overflow-hidden bg-white">
|
||||
<div className="max-w-container mx-auto px-4 sm:px-6 lg:px-10 relative z-10 w-full py-28 sm:py-36 md:py-44 lg:py-56">
|
||||
@@ -28,11 +37,11 @@ function HeroSection() {
|
||||
transition={{ duration: 1, delay: 0.2, ease: EASE_OUT }}
|
||||
className="text-4xl sm:text-5xl md:text-6xl lg:text-7xl xl:text-8xl font-black text-ink leading-[0.92] tracking-tightest mb-10 sm:mb-12 md:mb-16"
|
||||
>
|
||||
<div className="block">专注行业场景的</div>
|
||||
<div className="block">{heroTitle1}</div>
|
||||
<div className="block mt-4 sm:mt-6">
|
||||
<span className="relative inline-block">
|
||||
<span className="relative text-brand font-black">
|
||||
解决方案
|
||||
{heroTitle2}
|
||||
<motion.span
|
||||
className="absolute -bottom-2 left-0 w-full h-[3px] bg-brand"
|
||||
style={{ transformOrigin: 'left' }}
|
||||
@@ -51,9 +60,12 @@ function HeroSection() {
|
||||
transition={{ duration: 0.8, delay: 0.5, ease: EASE_OUT }}
|
||||
className="text-lg md:text-xl text-text-secondary max-w-2xl leading-relaxed mb-12 sm:mb-16"
|
||||
>
|
||||
端到端交付可量化的业务成果。
|
||||
<br className="hidden sm:block" />
|
||||
基于自研产品矩阵,为制造、零售、教育、医疗、金融、物流六大行业沉淀最佳实践。
|
||||
{heroDescriptionLines.map((line, i) => (
|
||||
<span key={i}>
|
||||
{i > 0 && <br className="hidden sm:block" />}
|
||||
{line}
|
||||
</span>
|
||||
))}
|
||||
</motion.p>
|
||||
|
||||
<motion.div
|
||||
@@ -66,14 +78,14 @@ function HeroSection() {
|
||||
href="/contact"
|
||||
className="group inline-flex items-center justify-center gap-3 px-10 py-5 font-semibold text-base bg-brand text-white transition-all duration-300 hover:bg-brand/90 min-h-[52px] touch-manipulation"
|
||||
>
|
||||
立即咨询
|
||||
{ctaPrimary}
|
||||
<ArrowUpRight className="w-4 h-4 transition-transform duration-300 group-hover:translate-x-0.5 group-hover:-translate-y-0.5" />
|
||||
</a>
|
||||
<a
|
||||
href="/products"
|
||||
className="inline-flex items-center justify-center gap-3 px-10 py-5 font-semibold text-base text-ink border border-border-primary hover:border-ink/30 transition-all duration-300 min-h-[52px] touch-manipulation"
|
||||
>
|
||||
浏览产品
|
||||
{ctaSecondary}
|
||||
</a>
|
||||
</motion.div>
|
||||
|
||||
@@ -174,7 +186,9 @@ function SolutionCard({ solution, index, products, featured = false }: { solutio
|
||||
);
|
||||
}
|
||||
|
||||
function SolutionsGridSection({ solutions, products }: { solutions: Solution[]; products?: Product[] }) {
|
||||
function SolutionsGridSection({ solutions, products, pageCopy }: { solutions: Solution[]; products?: Product[]; pageCopy?: PageCopy | null }) {
|
||||
const gridTitle = (pageCopy?.solutionsGridTitle as string) || '行业解决方案';
|
||||
const gridDescription = (pageCopy?.solutionsGridDescription as string) || '每个方案都明确推荐产品组合和服务包,确保落地效果';
|
||||
return (
|
||||
<section className="relative py-20 sm:py-28 md:py-36 lg:py-44 overflow-hidden bg-bg-secondary">
|
||||
<div className="absolute top-0 left-0 right-0 h-px bg-border-primary" />
|
||||
@@ -189,10 +203,10 @@ function SolutionsGridSection({ solutions, products }: { solutions: Solution[];
|
||||
className="max-w-3xl mb-16 sm:mb-20 md:mb-24"
|
||||
>
|
||||
<h2 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-extrabold text-ink tracking-tight leading-[0.95]">
|
||||
行业解决方案
|
||||
{gridTitle}
|
||||
</h2>
|
||||
<p className="mt-6 text-lg text-text-secondary leading-relaxed">
|
||||
每个方案都明确推荐产品组合和服务包,确保落地效果
|
||||
{gridDescription}
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
@@ -206,7 +220,9 @@ function SolutionsGridSection({ solutions, products }: { solutions: Solution[];
|
||||
);
|
||||
}
|
||||
|
||||
function CTASection() {
|
||||
function CTASection({ pageCopy }: { pageCopy?: PageCopy | null }) {
|
||||
const ctaTitle = (pageCopy?.solutionsCtaTitle as string) || '告诉我们您的行业场景';
|
||||
const ctaDescription = (pageCopy?.solutionsCtaDescription as string) || '无论您处于哪个行业、哪个数字化阶段,我们都能为您推荐最合适的产品组合和服务包。';
|
||||
return (
|
||||
<section className="relative py-20 sm:py-28 md:py-36 lg:py-44 overflow-hidden bg-white">
|
||||
<div className="max-w-container mx-auto px-4 sm:px-6 lg:px-10 relative z-10">
|
||||
@@ -218,10 +234,10 @@ function CTASection() {
|
||||
className="max-w-3xl"
|
||||
>
|
||||
<h2 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-extrabold text-ink tracking-tight leading-[0.95] mb-8">
|
||||
告诉我们您的<br className="sm:hidden" />行业场景
|
||||
{ctaTitle}
|
||||
</h2>
|
||||
<p className="text-lg text-text-secondary leading-relaxed mb-10">
|
||||
无论您处于哪个行业、哪个数字化阶段,我们都能为您推荐最合适的产品组合和服务包。
|
||||
{ctaDescription}
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4 sm:gap-6">
|
||||
<a
|
||||
@@ -244,14 +260,14 @@ function CTASection() {
|
||||
);
|
||||
}
|
||||
|
||||
export default function SolutionsContentV3({ solutions: solutionsProp, products }: { solutions?: Solution[]; products?: Product[] }) {
|
||||
export default function SolutionsContentV3({ solutions: solutionsProp, products, pageCopy }: { solutions?: Solution[]; products?: Product[]; pageCopy?: PageCopy | null }) {
|
||||
const solutions = solutionsProp ?? [];
|
||||
|
||||
return (
|
||||
<main className="bg-white text-ink">
|
||||
<HeroSection />
|
||||
<SolutionsGridSection solutions={solutions} products={products} />
|
||||
<CTASection />
|
||||
<HeroSection pageCopy={pageCopy} />
|
||||
<SolutionsGridSection solutions={solutions} products={products} pageCopy={pageCopy} />
|
||||
<CTASection pageCopy={pageCopy} />
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user