Skip to content

Commit b095d3e

Browse files
committed
问题修复
1 parent 12e84c1 commit b095d3e

6 files changed

Lines changed: 336 additions & 0 deletions

File tree

src/components/PageHero.tsx

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
import { Button } from "@/components/ui/button";
2+
import { ArrowRight } from "lucide-react";
3+
4+
type PageHeroProps = {
5+
eyebrow: string;
6+
title: string;
7+
subtitle: string;
8+
image: string;
9+
primaryLabel?: string;
10+
primaryHref?: string;
11+
secondaryLabel?: string;
12+
secondaryHref?: string;
13+
};
14+
15+
const PageHero = ({
16+
eyebrow,
17+
title,
18+
subtitle,
19+
image,
20+
primaryLabel,
21+
primaryHref,
22+
secondaryLabel,
23+
secondaryHref,
24+
}: PageHeroProps) => {
25+
const openHref = (href: string) => {
26+
if (href.startsWith("http")) {
27+
window.open(href, "_blank");
28+
return;
29+
}
30+
if (href.startsWith("#")) {
31+
document.querySelector(href)?.scrollIntoView({ behavior: "smooth" });
32+
return;
33+
}
34+
window.location.assign(href);
35+
};
36+
37+
return (
38+
<section className="relative min-h-[58vh] overflow-hidden border-b border-border/50 pt-32 pb-16">
39+
<div className="absolute inset-0">
40+
<img src={image} alt="" className="h-full w-full object-cover" />
41+
<div className="absolute inset-0 bg-[linear-gradient(90deg,hsl(var(--background)/0.95)_0%,hsl(var(--background)/0.78)_46%,hsl(var(--background)/0.48)_100%)]" />
42+
<div className="absolute inset-0 bg-[linear-gradient(180deg,hsl(var(--background)/0.4)_0%,hsl(var(--background))_100%)]" />
43+
</div>
44+
45+
<div className="container relative z-10 mx-auto px-4 sm:px-6">
46+
<div className="max-w-3xl min-w-0">
47+
<p className="mb-4 w-fit border border-primary/30 bg-background/55 px-4 py-2 text-sm font-semibold uppercase tracking-normal text-primary backdrop-blur">
48+
{eyebrow}
49+
</p>
50+
<h1 className="max-w-[calc(100vw-2rem)] text-3xl font-bold leading-tight [overflow-wrap:anywhere] sm:max-w-full sm:text-5xl md:text-7xl">
51+
{title}
52+
</h1>
53+
<p className="mt-6 max-w-[29ch] text-base leading-8 text-muted-foreground [overflow-wrap:anywhere] sm:max-w-2xl md:text-xl">
54+
{subtitle}
55+
</p>
56+
57+
{(primaryLabel || secondaryLabel) && (
58+
<div className="mt-9 flex flex-col gap-3 sm:flex-row">
59+
{primaryLabel && primaryHref && (
60+
<Button
61+
variant="hero"
62+
size="lg"
63+
className="w-full max-w-sm sm:w-auto"
64+
onClick={() => openHref(primaryHref)}
65+
>
66+
{primaryLabel}
67+
<ArrowRight className="h-5 w-5" />
68+
</Button>
69+
)}
70+
{secondaryLabel && secondaryHref && (
71+
<Button
72+
variant="glass"
73+
size="lg"
74+
className="w-full max-w-sm sm:w-auto"
75+
onClick={() => openHref(secondaryHref)}
76+
>
77+
{secondaryLabel}
78+
</Button>
79+
)}
80+
</div>
81+
)}
82+
</div>
83+
</div>
84+
</section>
85+
);
86+
};
87+
88+
export default PageHero;

src/pages/Architecture.tsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import Footer from "@/components/Footer";
2+
import Header from "@/components/Header";
3+
import PageHero from "@/components/PageHero";
4+
import Performance from "@/components/Performance";
5+
import PlatformArchitecture from "@/components/PlatformArchitecture";
6+
import { getHomepageLocale, homepageContent } from "@/lib/homepageContent";
7+
import { useTranslation } from "react-i18next";
8+
9+
const Architecture = () => {
10+
const { i18n } = useTranslation();
11+
const locale = getHomepageLocale(i18n.language);
12+
const content = homepageContent[locale];
13+
14+
return (
15+
<div className="min-h-screen">
16+
<Header />
17+
<PageHero
18+
eyebrow={content.architecture.eyebrow}
19+
title={
20+
locale === "zh"
21+
? "架构全景"
22+
: "Architecture map"
23+
}
24+
subtitle={content.architecture.subtitle}
25+
image="/site-assets/architecture-network.webp"
26+
primaryLabel={locale === "zh" ? "查看性能" : "View performance"}
27+
primaryHref="#performance"
28+
secondaryLabel={content.nav.products}
29+
secondaryHref="/products"
30+
/>
31+
<PlatformArchitecture />
32+
<Performance />
33+
<Footer />
34+
</div>
35+
);
36+
};
37+
38+
export default Architecture;

src/pages/Contact.tsx

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
import { Button } from "@/components/ui/button";
2+
import { Card, CardContent } from "@/components/ui/card";
3+
import Footer from "@/components/Footer";
4+
import Header from "@/components/Header";
5+
import PageHero from "@/components/PageHero";
6+
import { getHomepageLocale, homepageContent } from "@/lib/homepageContent";
7+
import { Mail, MapPin, Phone } from "lucide-react";
8+
import { useTranslation } from "react-i18next";
9+
10+
const Contact = () => {
11+
const { i18n } = useTranslation();
12+
const locale = getHomepageLocale(i18n.language);
13+
const content = homepageContent[locale];
14+
const cards = [
15+
{
16+
icon: Phone,
17+
title: locale === "zh" ? "电话沟通" : "Phone",
18+
value: "13218040662",
19+
href: "tel:13218040662",
20+
},
21+
{
22+
icon: Mail,
23+
title: locale === "zh" ? "邮件联系" : "Email",
24+
value: "xurong.lu@fluxmq.com",
25+
href: "mailto:xurong.lu@fluxmq.com",
26+
},
27+
{
28+
icon: MapPin,
29+
title: locale === "zh" ? "适合讨论" : "Best for",
30+
value: locale === "zh" ? "协议接入、MQTT 集群、FCP 运维管控" : "Protocols, MQTT clusters, and FCP operations",
31+
href: "/products",
32+
},
33+
];
34+
35+
return (
36+
<div className="min-h-screen">
37+
<Header />
38+
<PageHero
39+
eyebrow={content.nav.contact}
40+
title={content.footer.contactTitle}
41+
subtitle={content.footer.contactText}
42+
image="/site-assets/suite-hero.webp"
43+
primaryLabel={content.footer.contactButton}
44+
primaryHref="mailto:xurong.lu@fluxmq.com"
45+
secondaryLabel={content.nav.products}
46+
secondaryHref="/products"
47+
/>
48+
<section className="bg-background py-24">
49+
<div className="container mx-auto px-6">
50+
<div className="grid grid-cols-1 gap-5 md:grid-cols-3">
51+
{cards.map((card) => {
52+
const Icon = card.icon;
53+
54+
return (
55+
<Card key={card.title} className="border-border/70 bg-card/80 shadow-card">
56+
<CardContent className="p-7">
57+
<Icon className="h-8 w-8 text-primary" />
58+
<h2 className="mt-6 text-xl font-semibold">{card.title}</h2>
59+
<a
60+
href={card.href}
61+
className="mt-4 block break-words text-sm leading-7 text-muted-foreground transition-colors hover:text-primary"
62+
>
63+
{card.value}
64+
</a>
65+
</CardContent>
66+
</Card>
67+
);
68+
})}
69+
</div>
70+
71+
<div className="mt-8 border border-border/70 bg-secondary/35 p-8">
72+
<div className="flex flex-col gap-5 md:flex-row md:items-center md:justify-between">
73+
<div>
74+
<h2 className="text-2xl font-bold">
75+
{locale === "zh" ? "带着场景来聊,会更快落地" : "Bring your scenario, leave with a rollout path"}
76+
</h2>
77+
<p className="mt-3 max-w-3xl text-sm leading-7 text-muted-foreground">
78+
{locale === "zh"
79+
? "我们可以围绕协议类型、连接规模、部署环境、告警与审计要求,给出 Halia、FluxMQ、FCP 的组合建议。"
80+
: "We can map protocol mix, connection scale, deployment model, alerting, and audit requirements to the right Halia, FluxMQ, and FCP rollout."}
81+
</p>
82+
</div>
83+
<Button variant="hero" onClick={() => window.location.assign("mailto:xurong.lu@fluxmq.com")}>
84+
{content.footer.contactButton}
85+
</Button>
86+
</div>
87+
</div>
88+
</div>
89+
</section>
90+
<Footer />
91+
</div>
92+
);
93+
};
94+
95+
export default Contact;

src/pages/Demos.tsx

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import DemoVideos from "@/components/DemoVideos";
2+
import DocumentationPortal from "@/components/DocumentationPortal";
3+
import Footer from "@/components/Footer";
4+
import Header from "@/components/Header";
5+
import PageHero from "@/components/PageHero";
6+
import { getHomepageLocale } from "@/lib/homepageContent";
7+
import { useTranslation } from "react-i18next";
8+
9+
const Demos = () => {
10+
const { i18n } = useTranslation();
11+
const locale = getHomepageLocale(i18n.language);
12+
13+
return (
14+
<div className="min-h-screen">
15+
<Header />
16+
<PageHero
17+
eyebrow={locale === "zh" ? "演示与文档" : "Demos and docs"}
18+
title={locale === "zh" ? "从演示视频进入真实使用场景" : "See the platform in real workflows"}
19+
subtitle={
20+
locale === "zh"
21+
? "演示视频、文档入口与部署路径从首页拆出,方便用户直接进入学习、试用和集成。"
22+
: "Demo videos, documentation links, and adoption paths now live on a focused page for evaluation and onboarding."
23+
}
24+
image="/site-assets/products-suite.webp"
25+
primaryLabel={locale === "zh" ? "观看演示" : "Watch demos"}
26+
primaryHref="#demos"
27+
secondaryLabel={locale === "zh" ? "打开文档" : "Open docs"}
28+
secondaryHref="#documentation"
29+
/>
30+
<DemoVideos />
31+
<DocumentationPortal />
32+
<Footer />
33+
</div>
34+
);
35+
};
36+
37+
export default Demos;

src/pages/Products.tsx

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import Footer from "@/components/Footer";
2+
import Header from "@/components/Header";
3+
import PageHero from "@/components/PageHero";
4+
import ProductShowcase from "@/components/ProductShowcase";
5+
import QuickStart from "@/components/QuickStart";
6+
import SuiteCapabilities from "@/components/SuiteCapabilities";
7+
import { getHomepageLocale, homepageContent } from "@/lib/homepageContent";
8+
import { useTranslation } from "react-i18next";
9+
10+
const Products = () => {
11+
const { i18n } = useTranslation();
12+
const locale = getHomepageLocale(i18n.language);
13+
const content = homepageContent[locale];
14+
15+
return (
16+
<div className="min-h-screen">
17+
<Header />
18+
<PageHero
19+
eyebrow={content.products.eyebrow}
20+
title={
21+
locale === "zh"
22+
? "产品全景"
23+
: "Product portfolio"
24+
}
25+
subtitle={content.products.subtitle}
26+
image="/site-assets/products-suite.webp"
27+
primaryLabel={content.nav.contact}
28+
primaryHref="/contact"
29+
secondaryLabel={locale === "zh" ? "查看部署方式" : "View deployment"}
30+
secondaryHref="#quickstart"
31+
/>
32+
<ProductShowcase />
33+
<SuiteCapabilities />
34+
<QuickStart />
35+
<Footer />
36+
</div>
37+
);
38+
};
39+
40+
export default Products;

src/pages/Solutions.tsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import Footer from "@/components/Footer";
2+
import Header from "@/components/Header";
3+
import IndustrySolutions from "@/components/IndustrySolutions";
4+
import PageHero from "@/components/PageHero";
5+
import SuiteCapabilities from "@/components/SuiteCapabilities";
6+
import { getHomepageLocale, homepageContent } from "@/lib/homepageContent";
7+
import { useTranslation } from "react-i18next";
8+
9+
const Solutions = () => {
10+
const { i18n } = useTranslation();
11+
const locale = getHomepageLocale(i18n.language);
12+
const content = homepageContent[locale];
13+
14+
return (
15+
<div className="min-h-screen">
16+
<Header />
17+
<PageHero
18+
eyebrow={content.solutions.eyebrow}
19+
title={
20+
locale === "zh"
21+
? "典型落地场景"
22+
: "Deployment scenarios"
23+
}
24+
subtitle={content.solutions.subtitle}
25+
image="/site-assets/solutions-command-center.webp"
26+
primaryLabel={content.nav.contact}
27+
primaryHref="/contact"
28+
secondaryLabel={content.nav.products}
29+
secondaryHref="/products"
30+
/>
31+
<IndustrySolutions />
32+
<SuiteCapabilities />
33+
<Footer />
34+
</div>
35+
);
36+
};
37+
38+
export default Solutions;

0 commit comments

Comments
 (0)