|
|
@@ -1,5 +1,14 @@
|
|
|
import { useState } from "react";
|
|
|
-import { BellRing, Check, EyeOff, Globe, Lock, UserSearch, Users, Zap } from "lucide-react";
|
|
|
+import {
|
|
|
+ BellRing,
|
|
|
+ Check,
|
|
|
+ EyeOff,
|
|
|
+ Globe,
|
|
|
+ Lock,
|
|
|
+ UserSearch,
|
|
|
+ Users,
|
|
|
+ Zap,
|
|
|
+} from "lucide-react";
|
|
|
import { AnimatePresence, motion } from "motion/react";
|
|
|
import { useNavigate } from "react-router-dom";
|
|
|
import imageM3T11 from "../../assets/images/zjy/m3_t11.png";
|
|
|
@@ -32,10 +41,19 @@ export default function HomePage() {
|
|
|
title: "全量自动化,动态不缺席",
|
|
|
desc: "全平台覆盖,监控无死角",
|
|
|
features: [
|
|
|
- { title: "全平台扫描", desc: "覆盖B端、C端及O端全渠道,7x24小时不间断监测。" },
|
|
|
- { title: "高频采集", desc: "支持海量账号接入,最高实现T+1频率的数据采集。" },
|
|
|
+ {
|
|
|
+ title: "全平台扫描",
|
|
|
+ desc: "覆盖B端、C端及O端全渠道,7x24小时不间断监测。",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "高频监测",
|
|
|
+ desc: "支持海量账号接入,最高实现T+1频率的数据监测。",
|
|
|
+ },
|
|
|
{ title: "智能清洗", desc: "自动识别并清洗低价链接,确保数据纯净度。" },
|
|
|
- { title: "多维看板", desc: "提供多维度的数据可视化看板,实时掌握市场动态。" },
|
|
|
+ {
|
|
|
+ title: "多维看板",
|
|
|
+ desc: "提供多维度的数据可视化看板,实时掌握市场动态。",
|
|
|
+ },
|
|
|
],
|
|
|
image: imageM3T11,
|
|
|
},
|
|
|
@@ -43,9 +61,18 @@ export default function HomePage() {
|
|
|
title: "全程可追溯,溯源有妙招",
|
|
|
desc: "颗粒度精细,源头可追溯",
|
|
|
features: [
|
|
|
- { title: "精细颗粒度", desc: "数据颗粒度最小可至单品级,精准定位违规源头。" },
|
|
|
- { title: "主体识别", desc: "准确识别违规店铺的经营主体信息,锁定责任人。" },
|
|
|
- { title: "技术穿透", desc: "支持技术穿透手段,结合人工溯源,核实店铺主体真实性。" },
|
|
|
+ {
|
|
|
+ title: "精细颗粒度",
|
|
|
+ desc: "数据颗粒度最小可至单品级,精准定位违规源头。",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "主体识别",
|
|
|
+ desc: "准确识别违规店铺的经营主体信息,锁定责任人。",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "技术穿透",
|
|
|
+ desc: "支持技术穿透手段,结合人工溯源,核实店铺主体真实性。",
|
|
|
+ },
|
|
|
{ title: "证据固化", desc: "记录违规证据,为后续处理提供坚实依据。" },
|
|
|
],
|
|
|
image: imageM3T22,
|
|
|
@@ -68,9 +95,18 @@ export default function HomePage() {
|
|
|
desc: "多端响应,违规速下架",
|
|
|
features: [
|
|
|
{ title: "实时推送", desc: "多端实时消息推送,1V1触达相关责任人。" },
|
|
|
- { title: "快速响应", desc: "最高支持T+1推送信息,确保第一时间介入处理。" },
|
|
|
- { title: "联动下架", desc: "联动品牌方推动B端违规链接下架,形成合力遏制。" },
|
|
|
- { title: "技术下架", desc: "技术手段实现C端违规链接的快速下架,筑牢合规防线。" },
|
|
|
+ {
|
|
|
+ title: "快速响应",
|
|
|
+ desc: "最高支持T+1推送信息,确保第一时间介入处理。",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "联动下架",
|
|
|
+ desc: "联动品牌方推动B端违规链接下架,形成合力遏制。",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "技术下架",
|
|
|
+ desc: "技术手段实现C端违规链接的快速下架,筑牢合规防线。",
|
|
|
+ },
|
|
|
],
|
|
|
image: imageM3T44,
|
|
|
},
|
|
|
@@ -108,11 +144,14 @@ export default function HomePage() {
|
|
|
transition={{ delay: 0.15, duration: 0.7, ease: "easeOut" }}
|
|
|
className="relative z-10 max-w-5xl mx-auto space-y-8 text-center"
|
|
|
>
|
|
|
- <div style={{ fontSize: '2em', padding: '20px' }} className="inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/5 border border-white/10 text-blue-200 text-xs font-bold uppercase tracking-widest">
|
|
|
+ <div
|
|
|
+ style={{ fontSize: "2em", padding: "20px" }}
|
|
|
+ className="inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/5 border border-white/10 text-blue-200 text-xs font-bold uppercase tracking-widest"
|
|
|
+ >
|
|
|
开邻智价云
|
|
|
</div>
|
|
|
- <h1 className="text-5xl md:text-7xl font-extrabold font-headline leading-[1.08] tracking-tight text-white">
|
|
|
- 让每一盒药品的价格都尽在掌握 <br />
|
|
|
+ <h1 className="text-4xl md:text-7xl font-extrabold font-headline leading-[1.08] tracking-tight text-white">
|
|
|
+ 药品价格 尽在掌握 <br />
|
|
|
</h1>
|
|
|
<p className="text-xl text-slate-300 font-medium max-w-3xl leading-relaxed mx-auto">
|
|
|
线上平台价格数据治理,医药品牌工业全链路解决方案。
|
|
|
@@ -132,7 +171,9 @@ export default function HomePage() {
|
|
|
<motion.section className="py-24 bg-slate-900 px-6" {...sectionReveal}>
|
|
|
<div className="max-w-7xl mx-auto">
|
|
|
<div className="mb-16 text-center">
|
|
|
- <h2 className="text-3xl font-extrabold font-headline text-white mb-4">行业渠道治理的痛点</h2>
|
|
|
+ <h2 className="text-3xl font-extrabold font-headline text-white mb-4">
|
|
|
+ 行业渠道治理的痛点
|
|
|
+ </h2>
|
|
|
<div className="h-1.5 w-20 bg-blue-600 mx-auto rounded-full"></div>
|
|
|
</div>
|
|
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
|
@@ -145,7 +186,7 @@ export default function HomePage() {
|
|
|
{
|
|
|
icon: Zap,
|
|
|
title: "人工效率低",
|
|
|
- desc: "传统人工采集数据延迟大、覆盖窄,无法满足品牌方对实时价格变动的监控需求。",
|
|
|
+ desc: "传统人工监测数据延迟大、覆盖窄,无法满足品牌方对实时价格变动的监控需求。",
|
|
|
},
|
|
|
{
|
|
|
icon: BellRing,
|
|
|
@@ -167,8 +208,12 @@ export default function HomePage() {
|
|
|
<div className="w-12 h-12 rounded-lg bg-blue-500/15 flex items-center justify-center text-blue-400 mb-6">
|
|
|
<item.icon className="w-6 h-6" />
|
|
|
</div>
|
|
|
- <h3 className="text-xl font-bold mb-3 font-headline text-white">{item.title}</h3>
|
|
|
- <p className="text-slate-300 text-sm leading-relaxed">{item.desc}</p>
|
|
|
+ <h3 className="text-xl font-bold mb-3 font-headline text-white">
|
|
|
+ {item.title}
|
|
|
+ </h3>
|
|
|
+ <p className="text-slate-300 text-sm leading-relaxed">
|
|
|
+ {item.desc}
|
|
|
+ </p>
|
|
|
</motion.div>
|
|
|
))}
|
|
|
</div>
|
|
|
@@ -189,7 +234,9 @@ export default function HomePage() {
|
|
|
key={i}
|
|
|
onClick={() => setActiveTab(i)}
|
|
|
className={`px-6 py-2 font-bold whitespace-nowrap transition-all ${
|
|
|
- activeTab === i ? "text-blue-600 border-b-2 border-blue-600" : "text-slate-400 hover:text-white"
|
|
|
+ activeTab === i
|
|
|
+ ? "text-blue-600 border-b-2 border-blue-600"
|
|
|
+ : "text-slate-400 hover:text-white"
|
|
|
}`}
|
|
|
>
|
|
|
{tab}
|
|
|
@@ -210,8 +257,12 @@ export default function HomePage() {
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-16 items-center">
|
|
|
<div className="space-y-8">
|
|
|
<div>
|
|
|
- <h3 className="text-3xl font-extrabold text-white mb-4 font-headline">{tabData[activeTab].title}</h3>
|
|
|
- <p className="text-slate-300 leading-relaxed text-lg">{tabData[activeTab].desc}</p>
|
|
|
+ <h3 className="text-3xl font-extrabold text-white mb-4 font-headline">
|
|
|
+ {tabData[activeTab].title}
|
|
|
+ </h3>
|
|
|
+ <p className="text-slate-300 leading-relaxed text-lg">
|
|
|
+ {tabData[activeTab].desc}
|
|
|
+ </p>
|
|
|
</div>
|
|
|
<div className="space-y-4">
|
|
|
{tabData[activeTab].features.map((feature, i) => (
|
|
|
@@ -220,8 +271,12 @@ export default function HomePage() {
|
|
|
<Check className="w-4 h-4" />
|
|
|
</div>
|
|
|
<div>
|
|
|
- <p className="font-bold text-slate-100">{feature.title}</p>
|
|
|
- <p className="text-sm text-slate-400">{feature.desc}</p>
|
|
|
+ <p className="font-bold text-slate-100">
|
|
|
+ {feature.title}
|
|
|
+ </p>
|
|
|
+ <p className="text-sm text-slate-400">
|
|
|
+ {feature.desc}
|
|
|
+ </p>
|
|
|
</div>
|
|
|
</div>
|
|
|
))}
|
|
|
@@ -241,24 +296,53 @@ export default function HomePage() {
|
|
|
</div>
|
|
|
</motion.section>
|
|
|
|
|
|
- <motion.section className="py-24 bg-slate-900 text-white px-6 border-y border-slate-800" {...sectionReveal}>
|
|
|
+ <motion.section
|
|
|
+ className="py-24 bg-slate-900 text-white px-6 border-y border-slate-800"
|
|
|
+ {...sectionReveal}
|
|
|
+ >
|
|
|
<div className="max-w-7xl mx-auto">
|
|
|
<div className="text-center mb-20">
|
|
|
- <h2 className="text-4xl font-extrabold font-headline mb-4">为什么选择开邻智价云?</h2>
|
|
|
- <p className="text-slate-300 text-lg">更智能的数据治理,更高效的渠道管理</p>
|
|
|
+ <h2 className="text-4xl font-extrabold font-headline mb-4">
|
|
|
+ 为什么选择开邻智价云?
|
|
|
+ </h2>
|
|
|
+ <p className="text-slate-300 text-lg">
|
|
|
+ 更智能的数据治理,更高效的渠道管理
|
|
|
+ </p>
|
|
|
</div>
|
|
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-12">
|
|
|
{[
|
|
|
- { icon: Globe, title: "全域智控", desc: "支持全平台全时段配置的价格舆情监控系统" },
|
|
|
- { icon: BellRing, title: "预警触达", desc: "多端最高T+1预警通知与1V1消息提醒" },
|
|
|
- { icon: Users, title: "专业服务", desc: "专属服务团队,及时响应,提供数据服务" },
|
|
|
- { icon: Lock, title: "数据无忧", desc: "专属技术团队支持个性化开发" },
|
|
|
+ {
|
|
|
+ icon: Globe,
|
|
|
+ title: "全域智控",
|
|
|
+ desc: "支持全平台全时段配置的价格舆情监控系统",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: BellRing,
|
|
|
+ title: "预警触达",
|
|
|
+ desc: "多端最高T+1预警通知与1V1消息提醒",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: Users,
|
|
|
+ title: "专业服务",
|
|
|
+ desc: "专属服务团队,及时响应,提供数据服务",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ icon: Lock,
|
|
|
+ title: "数据无忧",
|
|
|
+ desc: "专属技术团队支持个性化开发",
|
|
|
+ },
|
|
|
].map((item, i) => (
|
|
|
- <motion.div key={i} className="text-center space-y-4" {...itemReveal}>
|
|
|
+ <motion.div
|
|
|
+ key={i}
|
|
|
+ className="text-center space-y-4"
|
|
|
+ {...itemReveal}
|
|
|
+ >
|
|
|
<div className="inline-flex items-center justify-center w-20 h-20 rounded-2xl bg-blue-500/15 text-blue-400 mb-2">
|
|
|
<item.icon className="w-10 h-10" />
|
|
|
</div>
|
|
|
- <h4 className="text-xl font-bold font-headline">{item.title}</h4>
|
|
|
+ <h4 className="text-xl font-bold font-headline">
|
|
|
+ {item.title}
|
|
|
+ </h4>
|
|
|
<p className="text-slate-300 text-sm">{item.desc}</p>
|
|
|
</motion.div>
|
|
|
))}
|
|
|
@@ -266,10 +350,17 @@ export default function HomePage() {
|
|
|
</div>
|
|
|
</motion.section>
|
|
|
|
|
|
- <motion.section className="py-24 px-6 text-center bg-slate-950" {...sectionReveal}>
|
|
|
+ <motion.section
|
|
|
+ className="py-24 px-6 text-center bg-slate-950"
|
|
|
+ {...sectionReveal}
|
|
|
+ >
|
|
|
<div className="max-w-3xl mx-auto space-y-8">
|
|
|
- <h2 className="text-4xl font-extrabold font-headline text-white">技术沉淀,只为提供更可靠的解决方案!</h2>
|
|
|
- <p className="text-xl text-slate-300 font-medium">做更具价值和效率的服务商</p>
|
|
|
+ <h2 className="text-4xl font-extrabold font-headline text-white">
|
|
|
+ 技术沉淀,只为提供更可靠的解决方案!
|
|
|
+ </h2>
|
|
|
+ <p className="text-xl text-slate-300 font-medium">
|
|
|
+ 做更具价值和效率的服务商
|
|
|
+ </p>
|
|
|
<div className="flex flex-col md:flex-row items-center justify-center gap-4">
|
|
|
<button
|
|
|
onClick={() => navigate("/contact")}
|