feat(platform): copy customer service scope

2026-07-05 19:33:06 +08:00
parent 0c3c6e7b3d
commit 2e0b13dfb5
3 changed files with 120 additions and 1 deletions
--- a/vehicle-data-platform/apps/web/src/App.tsx
+++ b/vehicle-data-platform/apps/web/src/App.tsx
@@ -502,6 +502,47 @@ export default function App() {
    navigatePage(page);
  };

+  const customerScopeURL = (page: PageKey, filters: Record<string, string> = {}) => {
+    return `${window.location.origin}${window.location.pathname}${buildAppHash({
+      page,
+      keyword: filters.keyword,
+      protocol: filters.protocol,
+      filters
+    })}`;
+  };
+
+  const copyCustomerScope = async () => {
+    const keyword = (activeVin || analysisVin).trim();
+    if (!keyword) {
+      Toast.warning('请先查询一辆车');
+      return;
+    }
+    const protocol = activeProtocol.trim();
+    const timeWindow = currentCustomerTaskTimeWindow();
+    const scopedFilters = { keyword, protocol, ...timeWindow };
+    const rangeText = timeWindow.dateFrom || timeWindow.dateTo
+      ? `${timeWindow.dateFrom || '未指定'} 至 ${timeWindow.dateTo || '未指定'}`
+      : '实时范围';
+    const lines = [
+      '【客户车辆服务范围】',
+      `车辆：${currentVehicleLabel || keyword}`,
+      `协议：${protocol || '全部'}`,
+      `时间窗：${rangeText}`,
+      `实时地图：${customerScopeURL('map', { keyword, protocol })}`,
+      `实时监控：${customerScopeURL('realtime', { keyword, protocol })}`,
+      `轨迹回放：${customerScopeURL('history', scopedFilters)}`,
+      `统计查询：${customerScopeURL('mileage', scopedFilters)}`,
+      `数据导出：${customerScopeURL('history-query', { ...scopedFilters, tab: 'raw' })}`,
+      `告警通知：${customerScopeURL('alert-events', scopedFilters)}`
+    ];
+    try {
+      await navigator.clipboard.writeText(lines.join('\n'));
+      Toast.success('已复制客户服务范围');
+    } catch {
+      Toast.error('复制客户服务范围失败');
+    }
+  };
+
  const updateVehicleDetailQuery = (keyword: string, protocol?: string) => {
    const nextKeyword = keyword.trim();
    const nextProtocol = protocol?.trim() ?? '';
@@ -535,7 +576,7 @@ export default function App() {
  };

  return (
-    <AppShell activePage={activePage} linkIssueCount={linkIssueCount} activeAlertRuleCount={activeAlertRuleCount} p0AlertRuleCount={p0AlertRuleCount} platformRelease={platformRelease} currentVehicleStatus={currentVehicleStatus} currentVehicleLabel={currentVehicleLabel} currentVehicleConsistency={currentVehicleConsistency} customerTimeWindow={customerTimeWindow} onCustomerTimeWindowChange={setCustomerTimeWindow} onChange={navigatePage} onCustomerTask={openCustomerTask} onVehicleSearch={openVehicle}>
+    <AppShell activePage={activePage} linkIssueCount={linkIssueCount} activeAlertRuleCount={activeAlertRuleCount} p0AlertRuleCount={p0AlertRuleCount} platformRelease={platformRelease} currentVehicleStatus={currentVehicleStatus} currentVehicleLabel={currentVehicleLabel} currentVehicleConsistency={currentVehicleConsistency} customerTimeWindow={customerTimeWindow} onCustomerTimeWindowChange={setCustomerTimeWindow} onCopyCustomerScope={copyCustomerScope} onChange={navigatePage} onCustomerTask={openCustomerTask} onVehicleSearch={openVehicle}>
      {pages[activePage]}
    </AppShell>
  );
--- a/vehicle-data-platform/apps/web/src/layout/AppShell.tsx
+++ b/vehicle-data-platform/apps/web/src/layout/AppShell.tsx
@@ -142,6 +142,7 @@ export function AppShell({
  currentVehicleConsistency,
  customerTimeWindow,
  onCustomerTimeWindowChange,
+  onCopyCustomerScope,
  onChange,
  onCustomerTask,
  onVehicleSearch,
@@ -157,6 +158,7 @@ export function AppShell({
  currentVehicleConsistency?: VehicleSourceConsistency;
  customerTimeWindow?: Record<string, string>;
  onCustomerTimeWindowChange?: (filters: Record<string, string>) => void;
+  onCopyCustomerScope?: () => void;
  onChange: (page: PageKey) => void;
  onCustomerTask?: (page: PageKey) => void;
  onVehicleSearch: (keyword: string) => void | Promise<void>;
@@ -326,6 +328,13 @@ export function AppShell({
                  </Button>
                ))}
              </div>
+              <Button
+                size="small"
+                aria-label="顶部复制客户服务范围"
+                onClick={onCopyCustomerScope}
+              >
+                复制范围
+              </Button>
              <Button
                size="small"
                aria-label={`顶部${alertLabel}`}
--- a/vehicle-data-platform/apps/web/src/test/App.test.tsx
+++ b/vehicle-data-platform/apps/web/src/test/App.test.tsx
@@ -6673,6 +6673,75 @@ test('topbar customer time window presets support common monitoring ranges', asy
  expect(window.location.hash).toBe('#/mileage?keyword=VIN-TOPBAR-PRESET&protocol=GB32960');
 });

+test('topbar copies customer vehicle service scope links', async () => {
+  vi.setSystemTime(new Date('2026-07-05T10:00:00+08:00'));
+  window.history.replaceState(null, '', '/#/dashboard');
+  const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue(undefined);
+  vi.spyOn(globalThis, 'fetch').mockImplementation(async (input) => {
+    const path = String(input);
+    if (path.includes('/api/vehicle-service/overview')) {
+      return {
+        ok: true,
+        json: async () => ({
+          data: {
+            vin: 'VIN-SHARE-SCOPE',
+            plate: '粤A共享窗',
+            primaryProtocol: 'JT808',
+            protocols: ['JT808'],
+            coverageStatus: 'online',
+            sourceCount: 1,
+            onlineSourceCount: 1,
+            realtimeCount: 1,
+            historyCount: 8,
+            rawCount: 20,
+            mileageCount: 3,
+            qualityIssueCount: 0
+          },
+          traceId: 'trace-test',
+          timestamp: 1783094400000
+        })
+      } as Response;
+    }
+    if (path.includes('/api/ops/health')) {
+      return {
+        ok: true,
+        json: async () => ({
+          data: { linkHealth: [], kafkaLag: 0, redisOnlineKeys: 0, tdengineWritable: true, mysqlWritable: true, runtime: { requestTimeoutMs: 5000 } },
+          traceId: 'trace-test',
+          timestamp: 1783094400000
+        })
+      } as Response;
+    }
+    return {
+      ok: true,
+      json: async () => ({
+        data: { items: [], total: 0, limit: 10, offset: 0 },
+        traceId: 'trace-test',
+        timestamp: 1783094400000
+      })
+    } as Response;
+  });
+
+  render(<App />);
+
+  fireEvent.click(screen.getByRole('button', { name: '顶部时间窗 近7天' }));
+  fireEvent.change(screen.getByPlaceholderText('搜索 VIN / 车牌 / 手机号'), { target: { value: '粤A共享窗' } });
+  fireEvent.click(screen.getByRole('button', { name: '查询车辆' }));
+  expect(await screen.findByText('粤A共享窗 / VIN-SHARE-SCOPE')).toBeInTheDocument();
+
+  fireEvent.click(screen.getByRole('button', { name: '顶部复制客户服务范围' }));
+
+  const copied = String(writeText.mock.lastCall?.[0] ?? '');
+  expect(copied).toContain('【客户车辆服务范围】');
+  expect(copied).toContain('车辆：粤A共享窗 / VIN-SHARE-SCOPE');
+  expect(copied).toContain('时间窗：2026-06-29 至 2026-07-05');
+  expect(copied).toContain('实时地图：http://localhost:3000/#/map?keyword=VIN-SHARE-SCOPE&protocol=JT808');
+  expect(copied).toContain('轨迹回放：http://localhost:3000/#/history?keyword=VIN-SHARE-SCOPE&protocol=JT808&dateFrom=2026-06-29&dateTo=2026-07-05');
+  expect(copied).toContain('统计查询：http://localhost:3000/#/mileage?keyword=VIN-SHARE-SCOPE&protocol=JT808&dateFrom=2026-06-29&dateTo=2026-07-05');
+  expect(copied).toContain('数据导出：http://localhost:3000/#/history-query?keyword=VIN-SHARE-SCOPE&protocol=JT808&tab=raw&dateFrom=2026-06-29&dateTo=2026-07-05');
+  expect(copied).toContain('告警通知：http://localhost:3000/#/alert-events?keyword=VIN-SHARE-SCOPE&protocol=JT808&dateFrom=2026-06-29&dateTo=2026-07-05');
+});
+
 test('shows and clears current history filters while keeping vehicle scope', async () => {
  window.history.replaceState(null, '', '/#/history-query?keyword=VIN-HISTORY-001&protocol=JT808&dateFrom=2026-07-01+00%3A00%3A00&dateTo=2026-07-01+23%3A59%3A59&includeFields=true&fields=jt808.location.longitude%2Cjt808.location.latitude&tab=raw');
  const fetchMock = vi.spyOn(globalThis, 'fetch').mockImplementation(async (input, init) => {