refine Semi UI responsive application shell

vehicle-data-platform/apps/web/src/v2/layout/AppShell.test.tsx

@@ -172,6 +172,8 @@ test('uses the compact mobile navigation and opens secondary modules in a Semi S
     <Routes><Route element={<AppShell />}><Route path="*" element={<span>页面内容</span>} /></Route></Routes>
   </MemoryRouter>);
 
+  expect(screen.getByRole('heading', { name: '全局监控' })).toHaveClass('v2-topbar-page-title');
+  expect(screen.getByRole('navigation', { name: '主导航' })).toHaveStyle({ '--v2-mobile-nav-count': '5' });
   expect(screen.getByRole('link', { name: '全局监控' })).toBeInTheDocument();
   expect(screen.getByRole('link', { name: '车辆查询' })).toBeInTheDocument();
   expect(screen.getByRole('link', { name: '轨迹回放' })).toBeInTheDocument();
@@ -193,6 +195,29 @@ test('uses the compact mobile navigation and opens secondary modules in a Semi S
   expect(document.body.style.overflow).not.toBe('hidden');
 });
 
+test('lets customer mobile navigation use the full width when no more menu is needed', () => {
+  auth.session = { name: '客户甲', role: 'customer', userType: 'customer', menuKeys: ['monitor', 'vehicles', 'tracks', 'statistics'] };
+  vi.spyOn(window, 'matchMedia').mockReturnValue({
+    matches: true,
+    media: '(max-width: 680px)',
+    onchange: null,
+    addListener: vi.fn(),
+    removeListener: vi.fn(),
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn()
+  });
+
+  render(<MemoryRouter future={ROUTER_FUTURE} initialEntries={['/statistics']}>
+    <Routes><Route element={<AppShell />}><Route path="*" element={<span>页面内容</span>} /></Route></Routes>
+  </MemoryRouter>);
+
+  expect(screen.getByRole('heading', { name: '里程查询' })).toHaveClass('v2-topbar-page-title');
+  expect(screen.getByRole('navigation', { name: '主导航' })).toHaveStyle({ '--v2-mobile-nav-count': '4' });
+  expect(screen.queryByRole('button', { name: '更多功能' })).not.toBeInTheDocument();
+  expect(screen.getByRole('link', { name: '里程查询' })).toHaveAttribute('aria-current', 'page');
+});
+
 test('automatically collapses the Semi sidebar at tablet width', () => {
   vi.spyOn(window, 'matchMedia').mockImplementation((query) => ({
     matches: query === '(max-width: 900px)',