diff --git a/vehicle-data-platform/apps/web/src/layout/AppShell.tsx b/vehicle-data-platform/apps/web/src/layout/AppShell.tsx
index e3d7d3cf..cd9e3144 100644
--- a/vehicle-data-platform/apps/web/src/layout/AppShell.tsx
+++ b/vehicle-data-platform/apps/web/src/layout/AppShell.tsx
@@ -75,6 +75,8 @@ const navGroups = [
]
}
];
+const customerNavGroups = navGroups.filter((group) => group.audience !== '内部');
+const internalNavGroups = navGroups.filter((group) => group.audience === '内部');
const customerPrimaryPath = [
{ label: '车辆地图', page: 'map' as const },
@@ -181,6 +183,7 @@ export function AppShell({
}) {
const [keyword, setKeyword] = useState('');
const [searching, setSearching] = useState(false);
+ const [internalEvidenceExpanded, setInternalEvidenceExpanded] = useState(false);
const amapConfigured = isAMapConfigured();
const alertLabel = alertButtonLabel(linkIssueCount, activeAlertRuleCount, p0AlertRuleCount);
const alertClassName = alertButtonClassName(linkIssueCount, activeAlertRuleCount, p0AlertRuleCount);
@@ -269,7 +272,7 @@ export function AppShell({
- {navGroups.map((group) => (
+ {customerNavGroups.map((group) => (
@@ -286,6 +289,48 @@ export function AppShell({
/>
))}
+
+
+
+ 内部证据区
+ 运维证据只在客户问题需要解释时展开,不作为客户默认入口。
+
+
+
+
+ {internalNavGroups.map((group) => (
+
+
+
+ {group.title}
+ {group.audience}
+
+ {group.description}
+
+
+ {group.items.map((item) => (
+
+ ))}
+
+
+ ))}
+
+
diff --git a/vehicle-data-platform/apps/web/src/styles/global.css b/vehicle-data-platform/apps/web/src/styles/global.css
index d7b281ad..7e1fc503 100644
--- a/vehicle-data-platform/apps/web/src/styles/global.css
+++ b/vehicle-data-platform/apps/web/src/styles/global.css
@@ -234,6 +234,114 @@ body {
line-height: 14px;
}
+.vp-internal-evidence-zone {
+ padding: 10px;
+ border: 1px solid rgba(103, 119, 136, 0.18);
+ border-radius: 8px;
+ background: #f8fafc;
+ display: grid;
+ gap: 8px;
+}
+
+.vp-internal-evidence-zone-head {
+ display: flex;
+ gap: 8px;
+ align-items: flex-start;
+ justify-content: space-between;
+}
+
+.vp-internal-evidence-zone-head > div {
+ min-width: 0;
+ display: grid;
+ gap: 2px;
+}
+
+.vp-internal-evidence-zone-head strong {
+ color: var(--vp-text);
+ font-size: 12px;
+ line-height: 18px;
+}
+
+.vp-internal-evidence-zone-head span {
+ color: var(--vp-text-muted);
+ font-size: 10px;
+ line-height: 15px;
+}
+
+.vp-internal-evidence-zone-head button {
+ flex: none;
+ padding: 4px 8px;
+ border: 1px solid var(--vp-border);
+ border-radius: 6px;
+ background: #ffffff;
+ color: var(--vp-text-muted);
+ cursor: pointer;
+ font: inherit;
+ font-size: 11px;
+ line-height: 16px;
+}
+
+.vp-internal-evidence-zone-head button:hover,
+.vp-internal-evidence-zone-head button:focus-visible {
+ color: var(--vp-primary);
+ border-color: rgba(22, 100, 255, 0.34);
+ outline: none;
+}
+
+.vp-internal-evidence-zone-body {
+ display: grid;
+ gap: 8px;
+}
+
+.vp-internal-evidence-zone-body:not(.vp-internal-evidence-zone-body-open) .vp-nav-section-title {
+ display: none;
+}
+
+.vp-nav-group-internal .vp-nav-section-title {
+ padding: 2px 2px 4px;
+}
+
+.vp-internal-evidence-actions {
+ display: grid;
+ gap: 6px;
+}
+
+.vp-internal-evidence-action {
+ width: 100%;
+ min-height: 34px;
+ padding: 7px 8px;
+ border: 1px solid rgba(103, 119, 136, 0.18);
+ border-radius: 7px;
+ background: #ffffff;
+ color: var(--vp-text-muted);
+ cursor: pointer;
+ font: inherit;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ text-align: left;
+}
+
+.vp-internal-evidence-action span {
+ display: inline-flex;
+ color: var(--vp-text-subtle);
+}
+
+.vp-internal-evidence-action strong {
+ color: inherit;
+ font-size: 12px;
+ line-height: 18px;
+}
+
+.vp-internal-evidence-action:hover,
+.vp-internal-evidence-action:focus-visible,
+.vp-internal-evidence-action-active {
+ color: var(--vp-primary);
+ border-color: rgba(22, 100, 255, 0.34);
+ background: #ffffff;
+ outline: none;
+}
+
.vp-main {
min-width: 0;
}
diff --git a/vehicle-data-platform/apps/web/src/test/App.test.tsx b/vehicle-data-platform/apps/web/src/test/App.test.tsx
index ded8fa4b..aa254b92 100644
--- a/vehicle-data-platform/apps/web/src/test/App.test.tsx
+++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx
@@ -49,6 +49,10 @@ test('renders vehicle platform shell', () => {
expect(screen.getAllByText('客户').length).toBeGreaterThanOrEqual(3);
expect(screen.getByText('内部')).toBeInTheDocument();
expect(screen.getByText('客户主流程外查看链路质量')).toBeInTheDocument();
+ expect(screen.getByText('内部证据区')).toBeInTheDocument();
+ expect(screen.getByText('运维证据只在客户问题需要解释时展开,不作为客户默认入口。')).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '展开内部证据区' })).toBeInTheDocument();
+ expect(screen.getByRole('button', { name: '内部证据区 运维质量' })).toBeInTheDocument();
expect(screen.getAllByText('运营总览').length).toBeGreaterThanOrEqual(1);
expect(getComputedStyle(document.body).minWidth).not.toBe('1280px');
});