feat(banner): 升级首页四大鲜明高保真轮播图系统,消除白雾遮罩并重构立体业务视窗

这个提交包含在:
wikiboss
2026-10-09 10:03:36 +08:00
父节点 cbadce183b
当前提交 4de6036b81
共有 9 个文件被更改,包括 2265 次插入 和 11 次删除

查看文件

@@ -1,4 +1,4 @@
<link rel="stylesheet" href="__ADDON__/css/modern_nhc.css">
<link rel="stylesheet" href="__ADDON__/css/modern_nhc.css?v=20261009_vivid">
<link rel="stylesheet" href="__ADDON__/m/css/materialize.css">
<link rel="stylesheet" href="__ADDON__/m/css/loader.css">
<link rel="stylesheet" href="__ADDON__/m/css/lightbox.css">

查看文件

@@ -1,5 +1,5 @@
<link href="__ADDON__/images/favicon.ico" type="image/x-icon" rel="icon">
<link href="__ADDON__/css/modern_nhc.css" rel="stylesheet" type="text/css">
<link href="__ADDON__/css/modern_nhc.css?v=20261009_vivid" rel="stylesheet" type="text/css">
<link href="__ADDON__/css/style.css" rel="stylesheet" type="text/css">
<link href="__ADDON__/css/animate.css" rel="stylesheet" type="text/css">
<link href="__ADDON__/css/page_style.css" rel="stylesheet" type="text/css">

查看文件

@@ -386,29 +386,29 @@ img {
z-index: 2;
}
/* 轮播图幻灯片不同主题背景与中式意境光影 (浅色高雅、通透水墨微晕) */
/* 轮播图幻灯片不同主题背景与中式意境光影 (浅色高雅、通透羽化、右侧鲜明视窗完全释放) */
.nhc-slide-theme-1 {
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 50%, rgba(255, 255, 255, 0.15) 100%),
url('../images/banners/banner_lead.jpg') right center / cover no-repeat;
linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.98) 36%, rgba(255, 255, 255, 0.82) 44%, rgba(255, 255, 255, 0) 54%, rgba(255, 255, 255, 0) 100%),
url('../images/banners/banner_lead.svg') right center / cover no-repeat;
}
.nhc-slide-theme-2 {
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 50%, rgba(255, 255, 255, 0.15) 100%),
url('../images/banners/banner_craft.jpg') right center / cover no-repeat;
linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.98) 36%, rgba(255, 255, 255, 0.82) 44%, rgba(255, 255, 255, 0) 54%, rgba(255, 255, 255, 0) 100%),
url('../images/banners/banner_craft.svg') right center / cover no-repeat;
}
.nhc-slide-theme-3 {
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 50%, rgba(255, 255, 255, 0.15) 100%),
url('../images/banners/banner_agent.jpg') right center / cover no-repeat;
linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.98) 36%, rgba(255, 255, 255, 0.82) 44%, rgba(255, 255, 255, 0) 54%, rgba(255, 255, 255, 0) 100%),
url('../images/banners/banner_agent.svg') right center / cover no-repeat;
}
.nhc-slide-theme-4 {
background:
linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 50%, rgba(255, 255, 255, 0.15) 100%),
url('../images/banners/banner_matrix.jpg') right center / cover no-repeat;
linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0.98) 36%, rgba(255, 255, 255, 0.82) 44%, rgba(255, 255, 255, 0) 54%, rgba(255, 255, 255, 0) 100%),
url('../images/banners/banner_matrix.svg') right center / cover no-repeat;
}
/* 轮播图切换过渡微动画 */
@@ -1660,6 +1660,26 @@ img {
.nhc-carousel-dot.active .nhc-carousel-dot-bar {
width: 36px;
}
.nhc-slide-theme-1 {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.90) 65%, rgba(255, 255, 255, 0.70) 100%),
url('../images/banners/banner_lead.svg') 80% center / cover no-repeat;
}
.nhc-slide-theme-2 {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.90) 65%, rgba(255, 255, 255, 0.70) 100%),
url('../images/banners/banner_craft.svg') 80% center / cover no-repeat;
}
.nhc-slide-theme-3 {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.90) 65%, rgba(255, 255, 255, 0.70) 100%),
url('../images/banners/banner_agent.svg') 80% center / cover no-repeat;
}
.nhc-slide-theme-4 {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.90) 65%, rgba(255, 255, 255, 0.70) 100%),
url('../images/banners/banner_matrix.svg') 80% center / cover no-repeat;
}
.nhc-hero-title {
font-size: 32px;
}

查看文件

@@ -0,0 +1,218 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080" width="100%" height="100%">
<defs>
<linearGradient id="bgGrad3" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="60%" stop-color="#F8FAFC"/>
<stop offset="100%" stop-color="#FAF5FF"/>
</linearGradient>
<linearGradient id="agentScreenGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#110E24"/>
<stop offset="100%" stop-color="#0F172A"/>
</linearGradient>
<linearGradient id="purpleGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#7C3AED"/>
<stop offset="100%" stop-color="#4F46E5"/>
</linearGradient>
<linearGradient id="streamGrad" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#7C3AED"/>
<stop offset="50%" stop-color="#2563EB"/>
<stop offset="100%" stop-color="#06B6D4"/>
</linearGradient>
<filter id="purpleShadow" x="-10%" y="-10%" width="125%" height="125%">
<feDropShadow dx="0" dy="20" stdDeviation="28" flood-color="#7C3AED" flood-opacity="0.22"/>
</filter>
<filter id="floatCardShadow" x="-15%" y="-15%" width="135%" height="135%">
<feDropShadow dx="0" dy="20" stdDeviation="26" flood-color="#0F172A" flood-opacity="0.18"/>
</filter>
</defs>
<rect width="1920" height="1080" fill="url(#bgGrad3)"/>
<!-- 现代中式紫金神经网络微光背景 -->
<g opacity="0.3" stroke="#CBD5E1" stroke-width="1" fill="none">
<polygon points="1200,120 1560,180 1820,380 1720,720 1360,880 1020,720 980,380" stroke="#C084FC" stroke-width="1.2" stroke-dasharray="5 5"/>
<circle cx="1360" cy="520" r="320" stroke="#7C3AED" stroke-width="1" opacity="0.4"/>
</g>
<!-- 主视窗:企业私域 AI 智能体工作台 (深邃智雅紫黑大屏,极致鲜明科技感) -->
<g transform="translate(860, 160)" filter="url(#purpleShadow)">
<rect width="980" height="660" rx="10" fill="url(#agentScreenGrad)" stroke="#6D28D9" stroke-width="2"/>
<!-- 顶栏 Window Header -->
<rect width="980" height="48" rx="10" fill="#1E1438"/>
<rect y="40" width="980" height="8" fill="#1E1438"/>
<line x1="0" y1="48" x2="980" y2="48" stroke="#3B1F6E" stroke-width="1"/>
<circle cx="24" cy="24" r="6" fill="#EF4444"/>
<circle cx="44" cy="24" r="6" fill="#F59E0B"/>
<circle cx="64" cy="24" r="6" fill="#10B981"/>
<text x="96" y="29" fill="#E9D5FF" font-family="'Inter', 'PingFang SC', sans-serif" font-size="13" font-weight="700">
纳海川企业私域智能体中枢 (Enterprise Agent Engine v3.5) · 内网隔离模式
</text>
<rect x="760" y="13" width="200" height="24" rx="4" fill="#3B1F6E"/>
<text x="860" y="29" fill="#A7F3D0" font-family="'Inter', sans-serif" font-size="11" font-weight="700" text-anchor="middle">
● 物理隔离 0公网外发 · GPU 8卡就绪
</text>
<!-- 左侧:AI 合规初审与交互对话区 (高对比度深底卡片) -->
<g transform="translate(24, 70)">
<rect width="455" height="565" rx="6" fill="#181335" stroke="#3B1F6E" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">业务规章合规初审与智能推理</text>
<!-- 对话 1: 业务员输入 -->
<g transform="translate(18, 55)">
<rect width="360" height="55" rx="8" fill="#2E2452"/>
<text x="14" y="24" fill="#E2E8F0" font-family="'PingFang SC', sans-serif" font-size="12">提审请阅:某省大型项目标书合同第 38 条违约金条款...</text>
<text x="14" y="44" fill="#A5B4FC" font-family="'PingFang SC', sans-serif" font-size="11">上传附件: 《采购战略合作框架合同.pdf》 (48页)</text>
</g>
<!-- 对话 2: 智能体毫秒级解析输出 -->
<g transform="translate(18, 130)">
<rect width="418" height="240" rx="8" fill="#241B45" stroke="#7C3AED" stroke-width="1.5"/>
<circle cx="28" cy="24" r="12" fill="#7C3AED"/>
<text x="28" y="28" fill="#FFFFFF" font-family="'Inter', sans-serif" font-size="10" font-weight="700" text-anchor="middle">AI</text>
<text x="50" y="28" fill="#F3E8FF" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">智能审校专员 · 审查结论报告 (120ms)</text>
<text x="18" y="60" fill="#38BDF8" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="600">[合规要点核对完成 · 风险等级: 低]</text>
<text x="18" y="85" fill="#E2E8F0" font-family="'PingFang SC', sans-serif" font-size="12">1. 违约金约定比例为 30%,超过民法典通常上限保护范围;</text>
<text x="18" y="110" fill="#E2E8F0" font-family="'PingFang SC', sans-serif" font-size="12">2. 依据集团制度《合规风险防控指南(2026)》第 14 条建议修正;</text>
<text x="18" y="135" fill="#10B981" font-family="'PingFang SC', sans-serif" font-size="12">3. 知识库溯源置信度: 98.7% (已匹配出处原文段落);</text>
<!-- 修正推荐框 -->
<rect x="18" y="155" width="382" height="65" rx="4" fill="#181335" stroke="#4F46E5" stroke-width="1"/>
<text x="30" y="178" fill="#FDE047" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700">智能体建议修正条款:</text>
<text x="30" y="200" fill="#CBD5E1" font-family="'PingFang SC', sans-serif" font-size="11">“违约金按逾期未付货款每日万分之三计算,最高不超过标的额 15%”</text>
</g>
<!-- 底部推理耗时与Token速率 -->
<g transform="translate(18, 395)">
<rect width="418" height="150" rx="6" fill="#120D2A" stroke="#2E2452" stroke-width="1"/>
<text x="16" y="26" fill="#C084FC" font-family="'Inter', sans-serif" font-size="12" font-weight="700">私有算力与推理引擎性能指标</text>
<text x="16" y="55" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="11">首 Token 响应时延 (TTFT)</text>
<text x="340" y="55" fill="#38BDF8" font-family="'Inter', sans-serif" font-size="12" font-weight="700">42 ms</text>
<rect x="16" y="65" width="386" height="5" rx="2.5" fill="#2E2452"/>
<rect x="16" y="65" width="340" height="5" rx="2.5" fill="#06B6D4"/>
<text x="16" y="95" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="11">向量召回准确率 (Top-3)</text>
<text x="340" y="95" fill="#10B981" font-family="'Inter', sans-serif" font-size="12" font-weight="700">99.4%</text>
<rect x="16" y="105" width="386" height="5" rx="2.5" fill="#2E2452"/>
<rect x="16" y="105" width="380" height="5" rx="2.5" fill="#10B981"/>
<text x="16" y="132" fill="#E9D5FF" font-family="'Inter', sans-serif" font-size="11">数据物理留存: 贵阳本地专有算力中心 · 绝无公网泄露风险</text>
</g>
</g>
<!-- 右侧:私域 RAG 向量知识库拓扑与多路召回 (高精视觉) -->
<g transform="translate(501, 70)">
<rect width="455" height="565" rx="6" fill="#181335" stroke="#3B1F6E" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">私域 RAG 向量数据库多路召回与重排</text>
<!-- 知识库向量切片卡片 -->
<g transform="translate(18, 55)">
<rect width="418" height="70" rx="6" fill="#241B45" stroke="#6D28D9" stroke-width="1"/>
<text x="14" y="26" fill="#C084FC" font-family="'Inter', sans-serif" font-size="12" font-weight="700">Chunk #1402 · 集团合同法务白皮书(2026版)</text>
<text x="14" y="48" fill="#E2E8F0" font-family="'PingFang SC', sans-serif" font-size="11">余弦相似度: 0.984 · Dense Vector + BM25 混合索引</text>
<rect x="350" y="14" width="54" height="20" rx="3" fill="#10B981"/>
<text x="377" y="28" fill="#FFFFFF" font-family="'Inter', sans-serif" font-size="10" font-weight="700" text-anchor="middle">已采纳</text>
</g>
<g transform="translate(18, 140)">
<rect width="418" height="70" rx="6" fill="#241B45" stroke="#3B1F6E" stroke-width="1"/>
<text x="14" y="26" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="12" font-weight="600">Chunk #0819 · 招标投标风险规避实施细则</text>
<text x="14" y="48" fill="#CBD5E1" font-family="'PingFang SC', sans-serif" font-size="11">余弦相似度: 0.941 · 引用判定为辅助参考依据</text>
<rect x="350" y="14" width="54" height="20" rx="3" fill="#3B82F6"/>
<text x="377" y="28" fill="#FFFFFF" font-family="'Inter', sans-serif" font-size="10" font-weight="700" text-anchor="middle">关联</text>
</g>
<!-- 向量聚类投影展示图 (视觉亮点) -->
<g transform="translate(18, 230)">
<rect width="418" height="305" rx="6" fill="#110E24" stroke="#2E2452" stroke-width="1"/>
<text x="16" y="26" fill="#E9D5FF" font-family="'Inter', sans-serif" font-size="12" font-weight="700">高维语义向量空间聚类投影图 (1536-Dim t-SNE)</text>
<!-- 散点网络与流向 -->
<g stroke="#7C3AED" stroke-width="1" opacity="0.4">
<line x1="80" y1="120" x2="160" y2="80"/>
<line x1="160" y1="80" x2="240" y2="130"/>
<line x1="240" y1="130" x2="320" y2="90"/>
<line x1="160" y1="80" x2="200" y2="200"/>
<line x1="240" y1="130" x2="280" y2="220"/>
</g>
<!-- 聚类高亮中心 -->
<circle cx="200" cy="140" r="45" fill="#7C3AED" opacity="0.25"/>
<circle cx="200" cy="140" r="8" fill="#F43F5E"/>
<text x="200" y="165" fill="#FDA4AF" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">提审合同查询点</text>
<!-- 周围聚类节点 -->
<circle cx="80" cy="120" r="5" fill="#38BDF8"/>
<circle cx="160" cy="80" r="6" fill="#C084FC"/>
<circle cx="240" cy="130" r="7" fill="#C084FC"/>
<circle cx="320" cy="90" r="5" fill="#38BDF8"/>
<circle cx="200" cy="200" r="6" fill="#10B981"/>
<circle cx="280" cy="220" r="5" fill="#10B981"/>
<!-- 底部说明 -->
<text x="20" y="280" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="11">
私域知识库已自动完成语义切片、重排 (Rerank) 与高精度引证标注
</text>
</g>
</g>
</g>
<!-- 前景悬浮:多 Agent 自主协同工作流卡片 (白底高反差,立体醒目) -->
<g transform="translate(1300, 580)" filter="url(#floatCardShadow)">
<rect width="500" height="360" rx="10" fill="#FFFFFF" stroke="#7C3AED" stroke-width="2"/>
<rect width="500" height="46" rx="10" fill="#FAF5FF"/>
<rect y="36" width="500" height="10" fill="#FAF5FF"/>
<line x1="0" y1="46" x2="500" y2="46" stroke="#E9D5FF" stroke-width="1"/>
<text x="20" y="28" fill="#581C87" font-family="'PingFang SC', sans-serif" font-size="15" font-weight="700">Multi-Agent 多智能体自主编排流</text>
<!-- 状态指示 -->
<rect x="370" y="10" width="110" height="26" rx="13" fill="#F3E8FF"/>
<text x="425" y="27" fill="#7C3AED" font-family="'Inter', sans-serif" font-size="11" font-weight="700" text-anchor="middle">● 4 Agents 活跃</text>
<!-- 4 个协同 Agent 步骤 -->
<g transform="translate(24, 70)">
<circle cx="16" cy="16" r="16" fill="#F3E8FF"/>
<text x="16" y="21" fill="#7C3AED" font-family="'Inter', sans-serif" font-size="12" font-weight="800" text-anchor="middle">1</text>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">调度中枢 Agent (Planner)</text>
<text x="44" y="32" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">任务目标拆解、上下文记忆管理与意图识别</text>
</g>
<g transform="translate(24, 130)">
<circle cx="16" cy="16" r="16" fill="#EFF6FF"/>
<text x="16" y="21" fill="#2563EB" font-family="'Inter', sans-serif" font-size="12" font-weight="800" text-anchor="middle">2</text>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">规章检索 Agent (Retriever)</text>
<text x="44" y="32" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">并发多路检索私域知识库、自动过滤无关切片</text>
</g>
<g transform="translate(24, 190)">
<circle cx="16" cy="16" r="16" fill="#FDF4FF"/>
<text x="16" y="21" fill="#C026D3" font-family="'Inter', sans-serif" font-size="12" font-weight="800" text-anchor="middle">3</text>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">合规推理 Agent (Reasoner)</text>
<text x="44" y="32" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">深度逻辑比对,标注法规依据与风险处置建议</text>
</g>
<g transform="translate(24, 250)">
<circle cx="16" cy="16" r="16" fill="#ECFDF5"/>
<text x="16" y="21" fill="#059669" font-family="'Inter', sans-serif" font-size="12" font-weight="800" text-anchor="middle">4</text>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">终审汇报 Agent (Reporter)</text>
<text x="44" y="32" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">生成结构化报告、生成修改批注与审批单草稿</text>
</g>
<g transform="translate(24, 305)">
<rect width="452" height="38" rx="6" fill="#7C3AED"/>
<text x="226" y="24" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700" text-anchor="middle">预约企业专属智能体 PoC 验证 →</text>
</g>
</g>
</svg>

之后

宽度:  |  高度:  |  大小: 14 KiB

查看文件

@@ -0,0 +1,265 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080" width="100%" height="100%">
<defs>
<linearGradient id="bgGrad2" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="60%" stop-color="#F8FAFC"/>
<stop offset="100%" stop-color="#EFF6FF"/>
</linearGradient>
<linearGradient id="primaryGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#2563EB"/>
<stop offset="100%" stop-color="#1E40AF"/>
</linearGradient>
<linearGradient id="cyanLine" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#06B6D4"/>
<stop offset="50%" stop-color="#2563EB"/>
<stop offset="100%" stop-color="#7C3AED"/>
</linearGradient>
<filter id="boxShadow" x="-10%" y="-10%" width="125%" height="125%">
<feDropShadow dx="0" dy="18" stdDeviation="26" flood-color="#0F172A" flood-opacity="0.14"/>
</filter>
<filter id="phoneShadow" x="-15%" y="-15%" width="135%" height="135%">
<feDropShadow dx="0" dy="24" stdDeviation="30" flood-color="#2563EB" flood-opacity="0.28"/>
</filter>
</defs>
<rect width="1920" height="1080" fill="url(#bgGrad2)"/>
<!-- 现代中式细线几何与水墨流向背景 -->
<g opacity="0.3" stroke="#CBD5E1" stroke-width="1" fill="none">
<circle cx="1400" cy="520" r="420" stroke="#93C5FD" stroke-width="1.5" stroke-dasharray="6 8"/>
<circle cx="1400" cy="520" r="280" stroke="#06B6D4" stroke-width="1" stroke-dasharray="4 6"/>
<line x1="860" y1="140" x2="1860" y2="140"/>
<line x1="860" y1="940" x2="1860" y2="940"/>
</g>
<!-- 1. 后层:企业级 Web 管理中台 (立体大屏,显示丰富真实运营图表) -->
<g transform="translate(860, 160)" filter="url(#boxShadow)">
<rect width="780" height="520" rx="10" fill="#FFFFFF" stroke="#CBD5E1" stroke-width="1.5"/>
<!-- 窗口标题栏 -->
<rect width="780" height="42" rx="10" fill="#F8FAFC"/>
<rect y="32" width="780" height="10" fill="#F8FAFC"/>
<line x1="0" y1="42" x2="780" y2="42" stroke="#E2E8F0" stroke-width="1"/>
<circle cx="20" cy="21" r="5" fill="#EF4444"/>
<circle cx="36" cy="21" r="5" fill="#F59E0B"/>
<circle cx="52" cy="21" r="5" fill="#10B981"/>
<text x="75" y="26" fill="#334155" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">
纳海川全渠道业务协同调度中台 (Web Admin Console)
</text>
<!-- 侧边栏 Navigation -->
<g transform="translate(0, 42)">
<rect width="160" height="478" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<rect x="10" y="20" width="140" height="34" rx="4" fill="#2563EB"/>
<text x="40" y="42" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">经营看板</text>
<text x="40" y="90" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">全端订单中枢</text>
<text x="40" y="130" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">商品与库存中心</text>
<text x="40" y="170" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">多级分销结算</text>
<text x="40" y="210" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">接口 API 监控</text>
<text x="40" y="250" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">系统安全设置</text>
</g>
<!-- 主展示区 -->
<g transform="translate(180, 60)">
<!-- 概览卡片 -->
<g>
<rect width="180" height="75" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="26" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">今日全端实收流水</text>
<text x="16" y="58" fill="#0F172A" font-family="'Inter', sans-serif" font-size="20" font-weight="800">¥ 1,842,650</text>
</g>
<g transform="translate(195, 0)">
<rect width="180" height="75" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="26" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">全渠道订单笔数</text>
<text x="16" y="58" fill="#2563EB" font-family="'Inter', sans-serif" font-size="20" font-weight="800">38,912 笔</text>
</g>
<g transform="translate(390, 0)">
<rect width="180" height="75" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="26" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">移动端在线活跃</text>
<text x="16" y="58" fill="#10B981" font-family="'Inter', sans-serif" font-size="20" font-weight="800">98.6%</text>
</g>
<!-- 柱状图对比 (Web vs App vs 小程序) -->
<g transform="translate(0, 95)">
<rect width="570" height="210" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="20" y="28" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">三端订单流量分布趋势 (小时级聚合)</text>
<!-- 图例 -->
<circle cx="360" cy="24" r="4" fill="#2563EB"/>
<text x="372" y="28" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="11">App 原生端</text>
<circle cx="440" cy="24" r="4" fill="#06B6D4"/>
<text x="452" y="28" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="11">微信小程序</text>
<circle cx="520" cy="24" r="4" fill="#94A3B8"/>
<text x="532" y="28" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="11">Web 门户</text>
<!-- 柱状图条目 -->
<g transform="translate(30, 160)">
<!-- 10:00 -->
<rect x="20" y="-80" width="14" height="80" rx="2" fill="#2563EB"/>
<rect x="36" y="-60" width="14" height="60" rx="2" fill="#06B6D4"/>
<rect x="52" y="-30" width="14" height="30" rx="2" fill="#CBD5E1"/>
<text x="43" y="18" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="10" text-anchor="middle">10:00</text>
<!-- 12:00 (高峰) -->
<rect x="110" y="-120" width="14" height="120" rx="2" fill="#2563EB"/>
<rect x="126" y="-95" width="14" height="95" rx="2" fill="#06B6D4"/>
<rect x="142" y="-45" width="14" height="45" rx="2" fill="#CBD5E1"/>
<text x="133" y="18" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="10" text-anchor="middle">12:00</text>
<!-- 16:00 -->
<rect x="200" y="-90" width="14" height="90" rx="2" fill="#2563EB"/>
<rect x="216" y="-75" width="14" height="75" rx="2" fill="#06B6D4"/>
<rect x="232" y="-35" width="14" height="35" rx="2" fill="#CBD5E1"/>
<text x="223" y="18" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="10" text-anchor="middle">16:00</text>
<!-- 20:00 (夜间高峰) -->
<rect x="290" y="-135" width="14" height="135" rx="2" fill="#2563EB"/>
<rect x="306" y="-110" width="14" height="110" rx="2" fill="#06B6D4"/>
<rect x="322" y="-50" width="14" height="50" rx="2" fill="#CBD5E1"/>
<text x="313" y="18" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="10" text-anchor="middle">20:00</text>
<!-- 22:00 -->
<rect x="380" y="-70" width="14" height="70" rx="2" fill="#2563EB"/>
<rect x="396" y="-55" width="14" height="55" rx="2" fill="#06B6D4"/>
<rect x="412" y="-25" width="14" height="25" rx="2" fill="#CBD5E1"/>
<text x="403" y="18" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="10" text-anchor="middle">22:00</text>
</g>
</g>
<!-- 底部状态条 -->
<g transform="translate(0, 320)">
<rect width="570" height="32" rx="4" fill="#F1F5F9"/>
<text x="14" y="21" fill="#475569" font-family="'Inter', sans-serif" font-size="11">
● WebSocket 实时长连接在线 · 全端数据同步时延 &lt; 20ms · 双向加密传输
</text>
</g>
</g>
</g>
<!-- 2. 前置右侧:高保真旗舰手机原生 App (立体突出,色彩饱满鲜明) -->
<g transform="translate(1440, 260)" filter="url(#phoneShadow)">
<!-- 手机外框 (黑色高光金属边框) -->
<rect width="360" height="720" rx="42" fill="#0F172A" stroke="#334155" stroke-width="4"/>
<rect x="8" y="8" width="344" height="704" rx="36" fill="#FFFFFF"/>
<!-- 灵动岛 Dynamic Island -->
<rect x="130" y="18" width="100" height="26" rx="13" fill="#0F172A"/>
<circle cx="210" cy="31" r="5.5" fill="#1E293B"/>
<!-- App 顶部导航 -->
<g transform="translate(18, 55)">
<rect width="324" height="42" rx="6" fill="#F1F5F9"/>
<text x="16" y="26" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="13">搜索企业商品、物料或订单编号...</text>
<circle cx="295" cy="21" r="12" fill="#2563EB"/>
<path d="M 291 21 L 299 21 M 295 17 L 295 25" stroke="#FFFFFF" stroke-width="1.8"/>
</g>
<!-- App 促销/通知大横幅 Banner -->
<g transform="translate(18, 110)">
<rect width="324" height="135" rx="8" fill="url(#primaryGrad)"/>
<text x="20" y="38" fill="#BAE6FD" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">企业级专属订货</text>
<text x="20" y="68" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="18" font-weight="800">数字化订货与分销系统</text>
<text x="20" y="95" fill="#E2E8F0" font-family="'PingFang SC', sans-serif" font-size="11">原生极速体验 · 支持批量导入与极速结算</text>
<rect x="20" y="105" width="84" height="20" rx="3" fill="#FFFFFF"/>
<text x="62" y="119" fill="#1D4ED8" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">立即体验 →</text>
</g>
<!-- App 九宫格业务入口 -->
<g transform="translate(18, 260)">
<circle cx="36" cy="24" r="20" fill="#EFF6FF"/>
<text x="36" y="58" fill="#1E293B" font-family="'PingFang SC', sans-serif" font-size="11" text-anchor="middle">采购订货</text>
<circle cx="118" cy="24" r="20" fill="#ECFDF5"/>
<text x="118" y="58" fill="#1E293B" font-family="'PingFang SC', sans-serif" font-size="11" text-anchor="middle">扫码盘点</text>
<circle cx="200" cy="24" r="20" fill="#FEF3C7"/>
<text x="200" y="58" fill="#1E293B" font-family="'PingFang SC', sans-serif" font-size="11" text-anchor="middle">财务对账</text>
<circle cx="282" cy="24" r="20" fill="#F3E8FF"/>
<text x="282" y="58" fill="#1E293B" font-family="'PingFang SC', sans-serif" font-size="11" text-anchor="middle">报表中心</text>
</g>
<!-- App 真实列表项 -->
<g transform="translate(18, 340)">
<rect width="324" height="75" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<rect x="12" y="12" width="50" height="50" rx="4" fill="#E2E8F0"/>
<text x="72" y="32" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">工业传感器主控板 (V3)</text>
<text x="72" y="52" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">库存: 2,400 件 · 批次: 2609A</text>
<text x="245" y="42" fill="#DC2626" font-family="'Inter', sans-serif" font-size="15" font-weight="800">¥ 380.00</text>
</g>
<g transform="translate(18, 425)">
<rect width="324" height="75" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<rect x="12" y="12" width="50" height="50" rx="4" fill="#E2E8F0"/>
<text x="72" y="32" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">智能网关采集终端 (Pro)</text>
<text x="72" y="52" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">库存: 850 件 · 现货顺丰包邮</text>
<text x="235" y="42" fill="#DC2626" font-family="'Inter', sans-serif" font-size="15" font-weight="800">¥ 1,290.00</text>
</g>
<!-- 底部 TabBar -->
<g transform="translate(18, 635)">
<rect width="324" height="55" rx="10" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/>
<text x="42" y="33" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700" text-anchor="middle">● 首页</text>
<text x="122" y="33" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12" text-anchor="middle">分类</text>
<text x="202" y="33" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12" text-anchor="middle">购物车</text>
<text x="282" y="33" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12" text-anchor="middle">我的</text>
</g>
</g>
<!-- 3. 前置左侧:微信小程序全景拟真视窗 -->
<g transform="translate(820, 520)" filter="url(#phoneShadow)">
<rect width="380" height="460" rx="14" fill="#FFFFFF" stroke="#2563EB" stroke-width="2"/>
<!-- 小程序专用顶栏 (微信胶囊按钮) -->
<rect width="380" height="50" rx="14" fill="#F8FAFC"/>
<rect y="40" width="380" height="10" fill="#F8FAFC"/>
<line x1="0" y1="50" x2="380" y2="50" stroke="#E2E8F0" stroke-width="1"/>
<text x="24" y="32" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">纳海川订货小程序</text>
<!-- 微信胶囊按钮 -->
<rect x="290" y="13" width="75" height="26" rx="13" fill="#FFFFFF" stroke="#CBD5E1" stroke-width="1"/>
<circle cx="312" cy="26" r="3.5" fill="#334155"/>
<circle cx="343" cy="26" r="5" fill="none" stroke="#334155" stroke-width="1.8"/>
<!-- 内容:分销与拼团秒杀 -->
<g transform="translate(20, 70)">
<rect width="340" height="90" rx="8" fill="#EFF6FF" stroke="#BFDBFE" stroke-width="1"/>
<text x="18" y="30" fill="#1E40AF" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">企业分销裂变与快捷核销</text>
<text x="18" y="52" fill="#3B82F6" font-family="'PingFang SC', sans-serif" font-size="12">累计分销返佣已结算: ¥ 284,520</text>
<text x="18" y="74" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">免下载安装 · 扫码即开即用 · 微信支付秒结</text>
</g>
<g transform="translate(20, 180)">
<rect width="340" height="160" rx="8" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="28" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">小程序专享活动 (限时抢购)</text>
<!-- 进度条 -->
<text x="16" y="60" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="12">企业订购活动已抢 82%</text>
<rect x="16" y="70" width="308" height="8" rx="4" fill="#E2E8F0"/>
<rect x="16" y="70" width="252" height="8" rx="4" fill="#2563EB"/>
<!-- 按钮 -->
<rect x="16" y="100" width="308" height="42" rx="6" fill="#07C160"/>
<text x="170" y="126" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700" text-anchor="middle">微信快捷授权登录与下单</text>
</g>
<!-- 底部提示 -->
<g transform="translate(20, 360)">
<rect width="340" height="80" rx="8" fill="#FEF3C7" stroke="#FDE68A" stroke-width="1"/>
<text x="16" y="28" fill="#B45309" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">全端工程代码审查认证:</text>
<text x="16" y="50" fill="#92400E" font-family="'PingFang SC', sans-serif" font-size="11">一套中台统一对接 Web、iOS、Android 与微信小程序</text>
<text x="16" y="68" fill="#92400E" font-family="'PingFang SC', sans-serif" font-size="11">代码无缝复用 · 研发成本降低 45%</text>
</g>
</g>
<!-- 贯穿三端的数据流动光带 (彩色科技光轨) -->
<path d="M 880 720 Q 1200 660 1440 600" fill="none" stroke="url(#cyanLine)" stroke-width="4" stroke-linecap="round" opacity="0.8"/>
<circle cx="1160" cy="670" r="6" fill="#FFFFFF" stroke="#2563EB" stroke-width="2"/>
</svg>

之后

宽度:  |  高度:  |  大小: 16 KiB

查看文件

@@ -0,0 +1,279 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080" width="100%" height="100%">
<defs>
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="60%" stop-color="#F8FAFC"/>
<stop offset="100%" stop-color="#EFF6FF"/>
</linearGradient>
<linearGradient id="techBlueGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#2563EB"/>
<stop offset="100%" stop-color="#1D4ED8"/>
</linearGradient>
<linearGradient id="cyanGlow" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#06B6D4"/>
<stop offset="100%" stop-color="#3B82F6"/>
</linearGradient>
<linearGradient id="screenGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#0B1329"/>
<stop offset="100%" stop-color="#0F172A"/>
</linearGradient>
<linearGradient id="cardGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#1E293B"/>
<stop offset="100%" stop-color="#0F172A"/>
</linearGradient>
<linearGradient id="areaChartGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#2563EB" stop-opacity="0.6"/>
<stop offset="100%" stop-color="#2563EB" stop-opacity="0.02"/>
</linearGradient>
<filter id="cardShadow" x="-10%" y="-10%" width="125%" height="125%">
<feDropShadow dx="0" dy="16" stdDeviation="24" flood-color="#0F172A" flood-opacity="0.18"/>
</filter>
<filter id="floatShadow" x="-15%" y="-15%" width="135%" height="135%">
<feDropShadow dx="0" dy="20" stdDeviation="30" flood-color="#2563EB" flood-opacity="0.25"/>
</filter>
<filter id="softGlow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="60" result="blur"/>
</filter>
</defs>
<!-- 背景底色 -->
<rect width="1920" height="1080" fill="url(#bgGrad)"/>
<!-- 右侧背景科技水墨微晕 (天青与科技蓝融合,层次分明) -->
<circle cx="1460" cy="480" r="380" fill="#3B82F6" opacity="0.08" filter="url(#softGlow)"/>
<circle cx="1200" cy="720" r="280" fill="#06B6D4" opacity="0.07" filter="url(#softGlow)"/>
<!-- 现代中式细线几何与窗棂格栅装饰 -->
<g opacity="0.35" stroke="#94A3B8" stroke-width="1" fill="none">
<path d="M 880 120 L 1840 120"/>
<path d="M 880 960 L 1840 960"/>
<path d="M 880 120 L 880 960"/>
<path d="M 1840 120 L 1840 960"/>
<!-- 窗棂细线折角 -->
<rect x="860" y="100" width="40" height="40" stroke="#2563EB" stroke-width="1.5" opacity="0.6"/>
<rect x="1820" y="100" width="40" height="40" stroke="#2563EB" stroke-width="1.5" opacity="0.6"/>
<rect x="860" y="940" width="40" height="40" stroke="#2563EB" stroke-width="1.5" opacity="0.6"/>
<rect x="1820" y="940" width="40" height="40" stroke="#2563EB" stroke-width="1.5" opacity="0.6"/>
<!-- 纵向导轨线 -->
<line x1="1360" y1="60" x2="1360" y2="1020" stroke-dasharray="4 6" opacity="0.4"/>
</g>
<!-- 右侧主体:企业级数字中台大屏控制台 (鲜明深蓝大屏,极高对比度) -->
<g transform="translate(860, 160)" filter="url(#cardShadow)">
<!-- 屏幕主框架 -->
<rect width="980" height="660" rx="10" fill="url(#screenGrad)" stroke="#1E3A8A" stroke-width="2"/>
<!-- 顶栏 Window Header -->
<rect width="980" height="48" rx="10" fill="#131F38"/>
<rect y="40" width="980" height="8" fill="#131F38"/>
<line x1="0" y1="48" x2="980" y2="48" stroke="#1E293B" stroke-width="1"/>
<!-- 控制红黄绿圆点 -->
<circle cx="24" cy="24" r="6" fill="#EF4444"/>
<circle cx="44" cy="24" r="6" fill="#F59E0B"/>
<circle cx="64" cy="24" r="6" fill="#10B981"/>
<text x="96" y="29" fill="#94A3B8" font-family="'Inter', 'PingFang SC', sans-serif" font-size="13" font-weight="600" letter-spacing="0.5">
纳海川企业数字化技术中台 · 生产集群实时监控 (Production v4.2)
</text>
<!-- 状态指示灯 -->
<circle cx="840" cy="24" r="4" fill="#10B981"/>
<text x="852" y="28" fill="#10B981" font-family="'Inter', 'PingFang SC', sans-serif" font-size="12" font-weight="700">● 集群健康率 100%</text>
<!-- 模块 1:左上核心网关动态流量峰值大盘 -->
<g transform="translate(24, 70)">
<rect width="455" height="265" rx="6" fill="url(#cardGrad)" stroke="#1E293B" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">API 网关吞吐与 QPS 负载</text>
<text x="350" y="28" fill="#06B6D4" font-family="'Inter', sans-serif" font-size="12" font-weight="600">延迟 14ms</text>
<!-- 动态指标 -->
<text x="18" y="65" fill="#38BDF8" font-family="'Inter', sans-serif" font-size="28" font-weight="800">128,450</text>
<text x="135" y="65" fill="#64748B" font-family="'Inter', sans-serif" font-size="13">峰值 QPS</text>
<text x="240" y="65" fill="#10B981" font-family="'Inter', sans-serif" font-size="20" font-weight="700">+18.5%</text>
<text x="315" y="65" fill="#64748B" font-family="'Inter', sans-serif" font-size="13">环比昨日</text>
<!-- 折线与面积图 -->
<path d="M 20 220 L 20 180 Q 70 120 120 160 T 220 110 T 320 140 T 435 90 L 435 220 Z" fill="url(#areaChartGrad)"/>
<path d="M 20 180 Q 70 120 120 160 T 220 110 T 320 140 T 435 90" fill="none" stroke="#38BDF8" stroke-width="3"/>
<!-- 数据关键采样节点 -->
<circle cx="220" cy="110" r="5" fill="#FFFFFF" stroke="#0284C7" stroke-width="2.5"/>
<circle cx="435" cy="90" r="5" fill="#FFFFFF" stroke="#0284C7" stroke-width="2.5"/>
<line x1="20" y1="220" x2="435" y2="220" stroke="#334155" stroke-width="1"/>
<text x="20" y="245" fill="#64748B" font-family="'Inter', sans-serif" font-size="11">00:00</text>
<text x="145" y="245" fill="#64748B" font-family="'Inter', sans-serif" font-size="11">08:00</text>
<text x="280" y="245" fill="#64748B" font-family="'Inter', sans-serif" font-size="11">14:00</text>
<text x="405" y="245" fill="#64748B" font-family="'Inter', sans-serif" font-size="11">22:00</text>
</g>
<!-- 模块 2:右上微服务节点分布式拓扑星图 -->
<g transform="translate(501, 70)">
<rect width="455" height="265" rx="6" fill="url(#cardGrad)" stroke="#1E293B" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">微服务集群调用拓扑星图</text>
<text x="360" y="28" fill="#10B981" font-family="'Inter', sans-serif" font-size="12" font-weight="600">正常 (5/5)</text>
<!-- 拓扑节点连线 -->
<g stroke="#2563EB" stroke-width="1.5" stroke-dasharray="3 3">
<line x1="120" y1="140" x2="230" y2="85"/>
<line x1="120" y1="140" x2="230" y2="140"/>
<line x1="120" y1="140" x2="230" y2="195"/>
<line x1="230" y1="140" x2="350" y2="100"/>
<line x1="230" y1="140" x2="350" y2="180"/>
</g>
<!-- 节点 1:API Gateway -->
<rect x="70" y="115" width="100" height="50" rx="6" fill="#1D4ED8" stroke="#60A5FA" stroke-width="1.5"/>
<text x="120" y="137" fill="#FFFFFF" font-family="'Inter', sans-serif" font-size="11" font-weight="700" text-anchor="middle">API-Gateway</text>
<text x="120" y="153" fill="#BFDBFE" font-family="'Inter', sans-serif" font-size="9" text-anchor="middle">流量分发枢纽</text>
<!-- 节点 2:Auth 认证中心 -->
<rect x="200" y="65" width="80" height="40" rx="4" fill="#1E293B" stroke="#06B6D4" stroke-width="1"/>
<text x="240" y="86" fill="#E2E8F0" font-family="'Inter', sans-serif" font-size="10" font-weight="600" text-anchor="middle">Auth-Svc</text>
<text x="240" y="98" fill="#10B981" font-family="'Inter', sans-serif" font-size="8" text-anchor="middle">99.99%</text>
<!-- 节点 3:Order 订单服务 -->
<rect x="200" y="120" width="80" height="40" rx="4" fill="#1E293B" stroke="#2563EB" stroke-width="1.5"/>
<text x="240" y="141" fill="#FFFFFF" font-family="'Inter', sans-serif" font-size="10" font-weight="700" text-anchor="middle">Order-Svc</text>
<text x="240" y="153" fill="#60A5FA" font-family="'Inter', sans-serif" font-size="8" text-anchor="middle">24 实例</text>
<!-- 节点 4:Pay 结算中台 -->
<rect x="200" y="175" width="80" height="40" rx="4" fill="#1E293B" stroke="#06B6D4" stroke-width="1"/>
<text x="240" y="196" fill="#E2E8F0" font-family="'Inter', sans-serif" font-size="10" font-weight="600" text-anchor="middle">Payment</text>
<text x="240" y="208" fill="#10B981" font-family="'Inter', sans-serif" font-size="8" text-anchor="middle">双向幂等</text>
<!-- 节点 5:DB 分库分表集群 -->
<rect x="320" y="80" width="90" height="40" rx="4" fill="#0F172A" stroke="#38BDF8" stroke-width="1"/>
<text x="365" y="101" fill="#BAE6FD" font-family="'Inter', sans-serif" font-size="10" font-weight="600" text-anchor="middle">MySQL Cluster</text>
<text x="365" y="113" fill="#64748B" font-family="'Inter', sans-serif" font-size="8" text-anchor="middle">读写分离 1M-4S</text>
<!-- 节点 6:Redis 缓存集群 -->
<rect x="320" y="160" width="90" height="40" rx="4" fill="#0F172A" stroke="#EF4444" stroke-width="1"/>
<text x="365" y="181" fill="#FECACA" font-family="'Inter', sans-serif" font-size="10" font-weight="600" text-anchor="middle">Redis Cache</text>
<text x="365" y="193" fill="#64748B" font-family="'Inter', sans-serif" font-size="8" text-anchor="middle">命中率 99.2%</text>
</g>
<!-- 模块 3:左下数据库与存储集群 -->
<g transform="translate(24, 355)">
<rect width="455" height="275" rx="6" fill="url(#cardGrad)" stroke="#1E293B" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">分布式事务与数据库读写监控</text>
<!-- 进度条指标 -->
<g transform="translate(18, 55)">
<text x="0" y="12" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="12">Master 主库写入负载</text>
<text x="380" y="12" fill="#38BDF8" font-family="'Inter', sans-serif" font-size="12" font-weight="700">28.4%</text>
<rect y="22" width="415" height="6" rx="3" fill="#334155"/>
<rect y="22" width="118" height="6" rx="3" fill="#0284C7"/>
</g>
<g transform="translate(18, 105)">
<text x="0" y="12" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="12">Replica 从库读查询分流</text>
<text x="380" y="12" fill="#10B981" font-family="'Inter', sans-serif" font-size="12" font-weight="700">71.6%</text>
<rect y="22" width="415" height="6" rx="3" fill="#334155"/>
<rect y="22" width="298" height="6" rx="3" fill="#10B981"/>
</g>
<g transform="translate(18, 155)">
<text x="0" y="12" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="12">主从同步实时延迟</text>
<text x="375" y="12" fill="#F59E0B" font-family="'Inter', sans-serif" font-size="12" font-weight="700">&lt; 0.8ms</text>
<rect y="22" width="415" height="6" rx="3" fill="#334155"/>
<rect y="22" width="40" height="6" rx="3" fill="#F59E0B"/>
</g>
<g transform="translate(18, 205)">
<text x="0" y="12" fill="#94A3B8" font-family="'PingFang SC', sans-serif" font-size="12">分布式 2PC 事务一次提交成功率</text>
<text x="375" y="12" fill="#38BDF8" font-family="'Inter', sans-serif" font-size="12" font-weight="700">100.0%</text>
<rect y="22" width="415" height="6" rx="3" fill="#334155"/>
<rect y="22" width="415" height="6" rx="3" fill="#2563EB"/>
</g>
</g>
<!-- 模块 4:右下全链路监控与安全把控 -->
<g transform="translate(501, 355)">
<rect width="455" height="275" rx="6" fill="url(#cardGrad)" stroke="#1E293B" stroke-width="1"/>
<text x="18" y="28" fill="#F8FAFC" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">全链路追踪与容器弹性健康</text>
<!-- 容器Pod状态块 -->
<g transform="translate(18, 50)">
<rect width="98" height="70" rx="4" fill="#0B1329" stroke="#1E3A8A" stroke-width="1"/>
<text x="49" y="28" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="11" text-anchor="middle">Pod-Node A</text>
<text x="49" y="52" fill="#10B981" font-family="'Inter', sans-serif" font-size="14" font-weight="700" text-anchor="middle">CPU 24%</text>
<rect x="106" width="98" height="70" rx="4" fill="#0B1329" stroke="#1E3A8A" stroke-width="1"/>
<text x="155" y="28" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="11" text-anchor="middle">Pod-Node B</text>
<text x="155" y="52" fill="#10B981" font-family="'Inter', sans-serif" font-size="14" font-weight="700" text-anchor="middle">CPU 31%</text>
<rect x="212" width="98" height="70" rx="4" fill="#0B1329" stroke="#1E3A8A" stroke-width="1"/>
<text x="261" y="28" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="11" text-anchor="middle">Pod-Node C</text>
<text x="261" y="52" fill="#10B981" font-family="'Inter', sans-serif" font-size="14" font-weight="700" text-anchor="middle">CPU 19%</text>
<rect x="318" width="98" height="70" rx="4" fill="#0B1329" stroke="#1E3A8A" stroke-width="1"/>
<text x="367" y="28" fill="#94A3B8" font-family="'Inter', sans-serif" font-size="11" text-anchor="middle">K8s Cluster</text>
<text x="367" y="52" fill="#38BDF8" font-family="'Inter', sans-serif" font-size="14" font-weight="700" text-anchor="middle">Healthy</text>
</g>
<!-- 告警与日志信息 -->
<g transform="translate(18, 140)">
<rect width="415" height="110" rx="4" fill="#090E1A" stroke="#1E293B" stroke-width="1"/>
<text x="14" y="24" fill="#38BDF8" font-family="'Inter', monospace" font-size="11">[INFO] 2026-10-09 09:30:12 Gateway route updated: 14 services online</text>
<text x="14" y="48" fill="#10B981" font-family="'Inter', monospace" font-size="11">[SUCCESS] Full regression test passed: 32/32 assertions OK</text>
<text x="14" y="72" fill="#94A3B8" font-family="'Inter', monospace" font-size="11">[AUDIT] SonarQube static scan: 0 critical vulnerabilities, 0 bugs</text>
<text x="14" y="96" fill="#F59E0B" font-family="'Inter', monospace" font-size="11">[SYNC] Database dict &amp; architecture ER diagrams synced</text>
</g>
</g>
</g>
<!-- 前景悬浮卡片:自主可控交付承诺 (白底立体质感,极其醒目) -->
<g transform="translate(1320, 600)" filter="url(#floatShadow)">
<rect width="480" height="340" rx="10" fill="#FFFFFF" stroke="#2563EB" stroke-width="2"/>
<!-- 顶部标题栏 -->
<rect width="480" height="45" rx="10" fill="#F8FAFC"/>
<rect y="35" width="480" height="10" fill="#F8FAFC"/>
<line x1="0" y1="45" x2="480" y2="45" stroke="#E2E8F0" stroke-width="1"/>
<text x="24" y="28" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="15" font-weight="700">工程规范与自主可控交付承诺</text>
<!-- 印章点缀 -->
<g transform="translate(390, 8)">
<rect width="68" height="28" rx="4" fill="#FEE2E2" stroke="#DC2626" stroke-width="1.2"/>
<text x="34" y="19" fill="#DC2626" font-family="'STSong', 'SimSun', serif" font-size="12" font-weight="700" text-anchor="middle">完整源码</text>
</g>
<!-- 条目 1 -->
<g transform="translate(24, 70)">
<circle cx="16" cy="16" r="16" fill="#EFF6FF"/>
<path d="M 11 16 L 15 20 L 22 13" fill="none" stroke="#2563EB" stroke-width="2.2" stroke-linecap="round"/>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">交付无混淆源码与工程全构建脚本</text>
<text x="44" y="32" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="12">包含前后端所有源码、Git提交历史与 CI/CD 自动化构建配置</text>
</g>
<!-- 条目 2 -->
<g transform="translate(24, 135)">
<circle cx="16" cy="16" r="16" fill="#EFF6FF"/>
<path d="M 11 16 L 15 20 L 22 13" fill="none" stroke="#2563EB" stroke-width="2.2" stroke-linecap="round"/>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">配套全套数据库字典与架构白皮书</text>
<text x="44" y="32" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="12">全字段中文注释、ER关系拓扑图、接口规范与系统运维手册</text>
</g>
<!-- 条目 3 -->
<g transform="translate(24, 200)">
<circle cx="16" cy="16" r="16" fill="#ECFDF5"/>
<path d="M 11 16 L 15 20 L 22 13" fill="none" stroke="#059669" stroke-width="2.2" stroke-linecap="round"/>
<text x="44" y="15" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">支持内网机房物理隔离与专有云私有化</text>
<text x="44" y="32" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="12">华为云、阿里云或本地服务器集群合规部署,数据资产企业独享</text>
</g>
<!-- 底部按钮 -->
<g transform="translate(24, 275)">
<rect width="432" height="42" rx="6" fill="#2563EB"/>
<text x="216" y="26" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="600" text-anchor="middle">查验工程交付标准规范白皮书 →</text>
</g>
</g>
</svg>

之后

宽度:  |  高度:  |  大小: 18 KiB

查看文件

@@ -0,0 +1,290 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080" width="100%" height="100%">
<defs>
<linearGradient id="bgGrad4" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FFFFFF"/>
<stop offset="60%" stop-color="#F8FAFC"/>
<stop offset="100%" stop-color="#EFF6FF"/>
</linearGradient>
<linearGradient id="posMetalGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#1E293B"/>
<stop offset="100%" stop-color="#0F172A"/>
</linearGradient>
<filter id="posShadow" x="-15%" y="-15%" width="135%" height="135%">
<feDropShadow dx="0" dy="24" stdDeviation="32" flood-color="#0F172A" flood-opacity="0.2"/>
</filter>
<filter id="cardShadow4" x="-10%" y="-10%" width="125%" height="125%">
<feDropShadow dx="0" dy="16" stdDeviation="22" flood-color="#2563EB" flood-opacity="0.18"/>
</filter>
</defs>
<rect width="1920" height="1080" fill="url(#bgGrad4)"/>
<!-- 现代中式细线几何与商业闭环轨道 -->
<g opacity="0.3" stroke="#CBD5E1" stroke-width="1" fill="none">
<line x1="860" y1="120" x2="1860" y2="120"/>
<line x1="860" y1="960" x2="1860" y2="960"/>
<ellipse cx="1380" cy="540" rx="460" ry="240" stroke="#3B82F6" stroke-width="1" stroke-dasharray="6 8"/>
</g>
<!-- 1. 后层左侧:B2B2C 聚合商城数字化运营大盘 (明亮高饱和商业看板) -->
<g transform="translate(860, 160)" filter="url(#cardShadow4)">
<rect width="480" height="360" rx="8" fill="#FFFFFF" stroke="#2563EB" stroke-width="1.5"/>
<rect width="480" height="42" rx="8" fill="#EFF6FF"/>
<rect y="32" width="480" height="10" fill="#EFF6FF"/>
<line x1="0" y1="42" x2="480" y2="42" stroke="#DBEAFE" stroke-width="1"/>
<text x="20" y="27" fill="#1E40AF" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">
纳海川 B2B2C 聚合多商户商城控制台
</text>
<!-- GMV 数据 -->
<g transform="translate(20, 60)">
<text x="0" y="18" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="12">今日实时 GMV 成交额</text>
<text x="0" y="52" fill="#2563EB" font-family="'Inter', sans-serif" font-size="28" font-weight="800">¥ 2,845,920</text>
<rect x="240" y="6" width="200" height="52" rx="4" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="254" y="26" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">有效分销商户数</text>
<text x="254" y="46" fill="#0F172A" font-family="'Inter', sans-serif" font-size="16" font-weight="700">1,480 家</text>
</g>
<!-- 营销工具与活动列表 -->
<g transform="translate(20, 140)">
<rect width="440" height="195" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="26" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">聚合营销活动实时态势</text>
<!-- 进度项 1 -->
<g transform="translate(16, 45)">
<text x="0" y="12" fill="#334155" font-family="'PingFang SC', sans-serif" font-size="11">多人拼团裂变专区 (转化率 34.2%)</text>
<rect y="20" width="408" height="6" rx="3" fill="#E2E8F0"/>
<rect y="20" width="310" height="6" rx="3" fill="#2563EB"/>
</g>
<!-- 进度项 2 -->
<g transform="translate(16, 95)">
<text x="0" y="12" fill="#334155" font-family="'PingFang SC', sans-serif" font-size="11">阶梯批发批发返利池 (自动清算结算)</text>
<rect y="20" width="408" height="6" rx="3" fill="#E2E8F0"/>
<rect y="20" width="260" height="6" rx="3" fill="#06B6D4"/>
</g>
<!-- 进度项 3 -->
<g transform="translate(16, 145)">
<text x="0" y="12" fill="#334155" font-family="'PingFang SC', sans-serif" font-size="11">限时整点秒杀 (高并发双向幂等保护)</text>
<rect y="20" width="408" height="6" rx="3" fill="#E2E8F0"/>
<rect y="20" width="380" height="6" rx="3" fill="#10B981"/>
</g>
</g>
</g>
<!-- 2. 后层右侧:多仓进销存 ERP 业财一体调度看板 -->
<g transform="translate(1380, 160)" filter="url(#cardShadow4)">
<rect width="480" height="360" rx="8" fill="#FFFFFF" stroke="#059669" stroke-width="1.5"/>
<rect width="480" height="42" rx="8" fill="#ECFDF5"/>
<rect y="32" width="480" height="10" fill="#ECFDF5"/>
<line x1="0" y1="42" x2="480" y2="42" stroke="#A7F3D0" stroke-width="1"/>
<text x="20" y="27" fill="#065F46" font-family="'PingFang SC', sans-serif" font-size="14" font-weight="700">
业财一体多仓进销存 ERP 智能调度
</text>
<!-- 库存指标 -->
<g transform="translate(20, 60)">
<rect width="135" height="60" rx="4" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="12" y="22" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">全国中心总仓</text>
<text x="12" y="46" fill="#0F172A" font-family="'Inter', sans-serif" font-size="15" font-weight="700">18 个</text>
<rect x="150" width="135" height="60" rx="4" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="12" y="22" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">在库商品批次</text>
<text x="12" y="46" fill="#2563EB" font-family="'Inter', sans-serif" font-size="15" font-weight="700">42,900 批</text>
<rect x="300" width="140" height="60" rx="4" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="12" y="22" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11">自动生成凭证</text>
<text x="12" y="46" fill="#059669" font-family="'Inter', sans-serif" font-size="15" font-weight="700">100% 同步</text>
</g>
<!-- 智能补货预警与调拨流 -->
<g transform="translate(20, 140)">
<rect width="440" height="195" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="16" y="26" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">智能补货预警与批次调拨流向</text>
<g transform="translate(16, 45)">
<rect width="408" height="42" rx="4" fill="#FEF2F2" stroke="#FCA5A5" stroke-width="1"/>
<text x="12" y="26" fill="#DC2626" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700">
[缺货预警] 贵阳中心仓 02 号库:快消物料安全库存不足,已自动触发采购单
</text>
</g>
<g transform="translate(16, 100)">
<rect width="408" height="42" rx="4" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/>
<text x="12" y="26" fill="#334155" font-family="'PingFang SC', sans-serif" font-size="11">
[调拨完成] 华东总仓 -&gt; 贵阳中心仓:400箱已入库质检,自动对账入库
</text>
</g>
<g transform="translate(16, 150)">
<text x="0" y="22" fill="#059669" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700">
● 进销存数据直通财务总账系统,无缝对接用友、金蝶标准科目字典
</text>
</g>
</g>
</g>
<!-- 3. 前景正中央:软硬一体双屏智能 POS 收银终端 (超拟真硬件质感,绝对视觉焦点) -->
<g transform="translate(1120, 360)" filter="url(#posShadow)">
<!-- POS 主屏基座 -->
<rect x="140" y="320" width="200" height="30" rx="6" fill="#334155"/>
<path d="M 210 260 L 270 260 L 280 320 L 200 320 Z" fill="#1E293B"/>
<!-- POS 前屏 (操作大屏,面向收银员) -->
<rect width="480" height="320" rx="12" fill="url(#posMetalGrad)" stroke="#475569" stroke-width="3"/>
<!-- 屏幕显示区 -->
<rect x="12" y="12" width="456" height="296" rx="6" fill="#FFFFFF"/>
<!-- POS 软件界面 -->
<rect x="12" y="12" width="456" height="32" rx="6" fill="#2563EB"/>
<text x="24" y="33" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">
纳海川智能商业收银系统 (POS Pro v5.0) · 离线记账模式正常
</text>
<text x="420" y="33" fill="#A7F3D0" font-family="'Inter', sans-serif" font-size="10" font-weight="700">● 断网可用</text>
<!-- 收银商品九宫格 (左侧) -->
<g transform="translate(24, 54)">
<rect width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="40" y="26" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">现萃特调茶</text>
<text x="40" y="42" fill="#2563EB" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">¥ 18.00</text>
<rect x="88" width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="128" y="26" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">招牌手作烘焙</text>
<text x="128" y="42" fill="#2563EB" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">¥ 28.00</text>
<rect x="176" width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="216" y="26" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">企业定制套餐</text>
<text x="216" y="42" fill="#2563EB" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">¥ 128.00</text>
<!-- 第二行 -->
<rect y="58" width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="40" y="84" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">冷萃咖啡</text>
<text x="40" y="100" fill="#2563EB" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">¥ 22.00</text>
<rect x="88" y="58" width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="128" y="84" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">会员储值充赠</text>
<text x="128" y="100" fill="#059669" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">充500送50</text>
<rect x="176" y="58" width="80" height="50" rx="4" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="1"/>
<text x="216" y="84" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="10" font-weight="700" text-anchor="middle">加项外带袋</text>
<text x="216" y="100" fill="#2563EB" font-family="'Inter', sans-serif" font-size="11" font-weight="800" text-anchor="middle">¥ 2.00</text>
<!-- 快捷操作区 -->
<rect y="120" width="256" height="40" rx="4" fill="#EFF6FF" stroke="#BFDBFE" stroke-width="1"/>
<text x="128" y="145" fill="#1D4ED8" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700" text-anchor="middle">挂单 (2) · 整单折扣 9折 · 优惠券</text>
</g>
<!-- 右侧结账小票清单 -->
<g transform="translate(290, 54)">
<rect width="166" height="236" rx="4" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="12" y="24" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700">当前待结单 #0082</text>
<line x1="12" y1="34" x2="154" y2="34" stroke="#CBD5E1" stroke-width="1" stroke-dasharray="2 2"/>
<text x="12" y="52" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="10">现萃特调茶 x 2</text>
<text x="120" y="52" fill="#0F172A" font-family="'Inter', sans-serif" font-size="10" font-weight="600">¥ 36.00</text>
<text x="12" y="72" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="10">企业定制套餐 x 1</text>
<text x="120" y="72" fill="#0F172A" font-family="'Inter', sans-serif" font-size="10" font-weight="600">¥ 128.00</text>
<text x="12" y="92" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="10">特权会员优惠</text>
<text x="120" y="92" fill="#059669" font-family="'Inter', sans-serif" font-size="10" font-weight="600">- ¥ 16.00</text>
<line x1="12" y1="108" x2="154" y2="108" stroke="#CBD5E1" stroke-width="1"/>
<text x="12" y="128" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="10">应收总计:</text>
<text x="12" y="152" fill="#DC2626" font-family="'Inter', sans-serif" font-size="18" font-weight="800">¥ 148.00</text>
<!-- 收款按钮 -->
<rect x="12" y="170" width="142" height="50" rx="4" fill="#059669"/>
<text x="83" y="200" fill="#FFFFFF" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700" text-anchor="middle">扫码智能收款</text>
</g>
</g>
<!-- 4. 侧面客显副屏 (面向顾客,展示动态聚合支付二维码) -->
<g transform="translate(1560, 440)" filter="url(#posShadow)">
<rect width="220" height="260" rx="8" fill="#1E293B" stroke="#475569" stroke-width="2"/>
<rect x="8" y="8" width="204" height="244" rx="4" fill="#FFFFFF"/>
<text x="110" y="32" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700" text-anchor="middle">纳海川智能聚合支付</text>
<!-- 聚合二维码拟真 -->
<rect x="36" y="48" width="132" height="132" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<!-- 二维码定位角标 -->
<rect x="46" y="58" width="30" height="30" fill="#0F172A"/>
<rect x="52" y="64" width="18" height="18" fill="#FFFFFF"/>
<rect x="56" y="68" width="10" height="10" fill="#0F172A"/>
<rect x="128" y="58" width="30" height="30" fill="#0F172A"/>
<rect x="134" y="64" width="18" height="18" fill="#FFFFFF"/>
<rect x="138" y="68" width="10" height="10" fill="#0F172A"/>
<rect x="46" y="140" width="30" height="30" fill="#0F172A"/>
<rect x="52" y="146" width="18" height="18" fill="#FFFFFF"/>
<rect x="56" y="150" width="10" height="10" fill="#0F172A"/>
<!-- 散乱数据点 -->
<rect x="86" y="70" width="8" height="8" fill="#0F172A"/>
<rect x="102" y="85" width="12" height="8" fill="#0F172A"/>
<rect x="86" y="105" width="28" height="8" fill="#0F172A"/>
<rect x="128" y="115" width="14" height="14" fill="#0F172A"/>
<rect x="96" y="135" width="20" height="12" fill="#0F172A"/>
<!-- 金额提示 -->
<text x="110" y="205" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="11" text-anchor="middle">请使用 微信/支付宝/云闪付 扫码</text>
<text x="110" y="232" fill="#DC2626" font-family="'Inter', sans-serif" font-size="17" font-weight="800" text-anchor="middle">¥ 148.00</text>
</g>
<!-- 5. 底部云原生多租户 SaaS 集群监控态势 -->
<g transform="translate(860, 680)" filter="url(#cardShadow4)">
<rect width="660" height="240" rx="8" fill="#FFFFFF" stroke="#2563EB" stroke-width="1.5"/>
<rect width="660" height="38" rx="8" fill="#F8FAFC"/>
<rect y="28" width="660" height="10" fill="#F8FAFC"/>
<line x1="0" y1="38" x2="660" y2="38" stroke="#E2E8F0" stroke-width="1"/>
<text x="20" y="25" fill="#0F172A" font-family="'PingFang SC', sans-serif" font-size="13" font-weight="700">
云原生多租户 SaaS 架构运行态势 (Cloud-Native Multi-Tenant Architecture)
</text>
<!-- 4 个租户隔离示意 -->
<g transform="translate(20, 55)">
<rect width="145" height="100" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="14" y="26" fill="#0F172A" font-family="'Inter', sans-serif" font-size="12" font-weight="700">Tenant-01 (大型集团)</text>
<text x="14" y="48" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="11">独立库物理隔离</text>
<text x="14" y="68" fill="#10B981" font-family="'Inter', sans-serif" font-size="11" font-weight="700">● 响应 12ms</text>
<text x="14" y="88" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="10">配额使用: 48%</text>
<rect x="155" width="145" height="100" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="169" y="26" fill="#0F172A" font-family="'Inter', sans-serif" font-size="12" font-weight="700">Tenant-02 (连锁餐饮)</text>
<text x="169" y="48" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="11">独立库物理隔离</text>
<text x="169" y="68" fill="#10B981" font-family="'Inter', sans-serif" font-size="11" font-weight="700">● 响应 16ms</text>
<text x="169" y="88" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="10">配额使用: 65%</text>
<rect x="310" width="145" height="100" rx="6" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="1"/>
<text x="324" y="26" fill="#0F172A" font-family="'Inter', sans-serif" font-size="12" font-weight="700">Tenant-03 (快消商贸)</text>
<text x="324" y="48" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="11">独立库物理隔离</text>
<text x="324" y="68" fill="#10B981" font-family="'Inter', sans-serif" font-size="11" font-weight="700">● 响应 14ms</text>
<text x="324" y="88" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="10">配额使用: 52%</text>
<rect x="465" width="155" height="100" rx="6" fill="#EFF6FF" stroke="#93C5FD" stroke-width="1"/>
<text x="479" y="26" fill="#1E40AF" font-family="'PingFang SC', sans-serif" font-size="12" font-weight="700">+ 新增租户接入</text>
<text x="479" y="48" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="11">1 分钟全自动开通</text>
<text x="479" y="68" fill="#64748B" font-family="'PingFang SC', sans-serif" font-size="10">按需订阅 / 源码买断</text>
<text x="479" y="88" fill="#2563EB" font-family="'PingFang SC', sans-serif" font-size="11" font-weight="700">即刻咨询 →</text>
</g>
<!-- 底部状态 -->
<g transform="translate(20, 175)">
<rect width="620" height="42" rx="4" fill="#F1F5F9"/>
<text x="16" y="26" fill="#475569" font-family="'PingFang SC', sans-serif" font-size="11">
纳海川产品体系:成熟业务闭环 · 既可开箱即用公有云/私有化,亦可基于完整源码深度二次开发定制
</text>
</g>
</g>
</svg>

之后

宽度:  |  高度:  |  大小: 18 KiB

文件差异内容过多而无法显示 加载差异

82
tests/test_vivid_banners.py 普通文件
查看文件

@@ -0,0 +1,82 @@
# -*- coding: utf-8 -*-
"""
测试鲜明轮播图系统 (Test Vivid Banner Carousel System)
验证首屏 4 张轮播图的鲜明度、专业业务实体感、无AI味、CSS通透遮罩以及全端结构完整性。
"""
import os
import re
import unittest
ROOT_DIR = os.path.abspath(os.path.join(os.path.dirname(__file__), ".."))
BANNER_DIR = os.path.join(ROOT_DIR, "public", "assets", "addons", "official", "images", "banners")
CSS_PATH = os.path.join(ROOT_DIR, "public", "assets", "addons", "official", "css", "modern_nhc.css")
PC_HOME_PATH = os.path.join(ROOT_DIR, "addons", "official", "view", "web", "official_home", "index.html")
M_HOME_PATH = os.path.join(ROOT_DIR, "addons", "official", "view", "web", "official_home", "index_e.html")
class VividBannerCarouselTest(unittest.TestCase):
"""验证鲜明高质感轮播图组件"""
def test_01_banner_files_exist_and_non_empty(self):
"""1. 验证 4 张核心轮播图资源物理存在且大小合理"""
banners = ["banner_lead", "banner_craft", "banner_agent", "banner_matrix"]
for b in banners:
svg_file = os.path.join(BANNER_DIR, f"{b}.svg")
jpg_file = os.path.join(BANNER_DIR, f"{b}.jpg")
# 必须至少有一种高质感格式存在,且文件大小大于 2KB
exists = False
if os.path.exists(svg_file) and os.path.getsize(svg_file) > 2048:
exists = True
elif os.path.exists(jpg_file) and os.path.getsize(jpg_file) > 2048:
exists = True
self.assertTrue(exists, f"轮播图文件不存在或过小: {b}")
def test_02_css_gradient_mask_not_obscuring_right_visual(self):
"""2. 验证 CSS 渐变遮罩优化:右侧区域必须保持通透,严禁在 50% 处覆盖 >90% 重度白雾"""
with open(CSS_PATH, "r", encoding="utf-8") as f:
css_content = f.read()
# 检查 4 个 slide 主题
for i in range(1, 5):
theme_class = f".nhc-slide-theme-{i}"
self.assertIn(theme_class, css_content, f"CSS 中缺少主题定义: {theme_class}")
# 检查是否去除了原本在 50% 覆盖 0.92 白色的遮罩问题
# 原写法: rgba(255, 255, 255, 0.92) 50%
# 优化后右侧主体应通透,不再出现 50% 处 0.92 白
self.assertNotIn("rgba(255, 255, 255, 0.92) 50%", css_content,
"CSS 仍保留 50% 处 92% 重度白色遮罩,导致右侧鲜明视窗被严重冲淡泛白")
def test_03_banner_rich_content_and_vivid_colors(self):
"""3. 验证轮播图包含真实工业级软件要素与鲜明品牌色彩 (科技蓝 #2563EB, 辅助青 #06B6D4, 紫 #7C3AED)"""
svg_banners = {
"banner_lead": ["2563EB", "06B6D4", "QPS", "微服务"],
"banner_craft": ["2563EB", "06B6D4", "小程序", "API"],
"banner_agent": ["7C3AED", "2563EB", "RAG", "Agent"],
"banner_matrix": ["2563EB", "POS", "ERP", "SaaS"]
}
for b, expected_keywords in svg_banners.items():
svg_file = os.path.join(BANNER_DIR, f"{b}.svg")
if os.path.exists(svg_file):
with open(svg_file, "r", encoding="utf-8") as f:
content = f.read()
for kw in expected_keywords:
self.assertTrue(
kw.lower() in content.lower(),
f"轮播图 {b}.svg 缺少业务要素或鲜明特征词: {kw}"
)
def test_04_pc_and_mobile_template_integrity(self):
"""4. 验证 PC 与移动端模板幻灯片数量均为 4,包含对应的主题类名"""
for page_path in [PC_HOME_PATH, M_HOME_PATH]:
with open(page_path, "r", encoding="utf-8") as f:
html = f.read()
for i in range(1, 5):
self.assertIn(f"nhc-slide-theme-{i}", html, f"页面缺少主题类 nhc-slide-theme-{i}: {page_path}")
# 必须包含 4 个幻灯片标识
self.assertEqual(len(re.findall(r'nhc-slide-theme-\d', html)), 4, f"幻灯片数量不等于 4: {page_path}")
if __name__ == "__main__":
unittest.main()