feat: simplify login and unify monitor summary

2026-07-19 10:48:08 +08:00
parent dcc6b223d9
commit e02d8dba54
6 changed files with 329 additions and 181 deletions
--- a/vehicle-data-platform/apps/web/src/v2/auth/AuthGate.test.tsx
+++ b/vehicle-data-platform/apps/web/src/v2/auth/AuthGate.test.tsx
@@ -88,35 +88,20 @@ test('treats login and logout as complete query and mutation cache boundaries',
  expect(window.sessionStorage.length).toBe(0);
 });

-test('makes account and operations-token entry explicit while preserving the account draft', async () => {
+test('exposes only account and password login on the public sign-in screen', async () => {
  const client = new QueryClient({ defaultOptions: { queries: { retry: false } } });
-  mocks.session.mockImplementation(async () => {
-    if (getAccessToken() !== 'ops-session-token') throw new Error('未登录');
-    return { name: 'platform-operator', role: 'admin', authMode: 'enforce' };
-  });
+  mocks.session.mockRejectedValue(new Error('未登录'));

  render(<QueryClientProvider client={client}><AuthGate><ProtectedWorkspace onAbort={() => undefined} /></AuthGate></QueryClientProvider>);

  expect(await screen.findByRole('form', { name: '平台账号登录' })).toBeInTheDocument();
-  expect(screen.getByRole('tab', { name: '账号登录' })).toHaveAttribute('aria-selected', 'true');
-  expect(screen.getByRole('tab', { name: '运维令牌' })).toHaveAttribute('aria-selected', 'false');
-  fireEvent.change(screen.getByPlaceholderText('请输入用户名'), { target: { value: 'remember-me' } });
-
-  fireEvent.click(screen.getByRole('tab', { name: '运维令牌' }));
-  expect(screen.getByRole('form', { name: '运维令牌登录' })).toBeInTheDocument();
-  expect(screen.getByText('仅限平台运维')).toBeInTheDocument();
-  expect(screen.getByText('令牌只保存在当前浏览器会话，关闭或退出后失效。')).toBeInTheDocument();
-  expect(screen.queryByRole('button', { name: 'Close' })).not.toBeInTheDocument();
-  fireEvent.change(screen.getByPlaceholderText('请输入服务器访问令牌'), { target: { value: 'ops-session-token' } });
-
-  fireEvent.click(screen.getByRole('tab', { name: '账号登录' }));
-  expect(screen.getByPlaceholderText('请输入用户名')).toHaveValue('remember-me');
-  fireEvent.click(screen.getByRole('tab', { name: '运维令牌' }));
-  fireEvent.click(screen.getByRole('button', { name: '验证令牌并进入' }));
-
-  expect(await screen.findByText('platform-operator')).toBeInTheDocument();
-  expect(mocks.login).not.toHaveBeenCalled();
-  expect(getAccessToken()).toBe('ops-session-token');
+  expect(screen.getByPlaceholderText('请输入用户名')).toHaveAttribute('autocomplete', 'username');
+  expect(screen.getByPlaceholderText('请输入密码')).toHaveAttribute('autocomplete', 'current-password');
+  expect(screen.queryByRole('tab')).not.toBeInTheDocument();
+  expect(screen.queryByText('运维令牌')).not.toBeInTheDocument();
+  expect(screen.queryByPlaceholderText('请输入服务器访问令牌')).not.toBeInTheDocument();
+  expect(screen.queryByRole('button', { name: '验证令牌并进入' })).not.toBeInTheDocument();
+  expect(screen.getByRole('button', { name: '登录工作台' })).toBeDisabled();
 });

 test('an expired protected request returns to login and removes the active user cache', async () => {
--- a/vehicle-data-platform/apps/web/src/v2/auth/AuthGate.tsx
+++ b/vehicle-data-platform/apps/web/src/v2/auth/AuthGate.tsx
@@ -1,6 +1,6 @@
-import { IconAlertTriangle, IconKey, IconLock, IconSafe, IconShield, IconUser } from '@douyinfe/semi-icons';
+import { IconAlertTriangle, IconLock, IconSafe, IconShield, IconUser } from '@douyinfe/semi-icons';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
-import { Banner, Button, Card, Input, Spin, Tabs, Tag, Typography } from '@douyinfe/semi-ui';
+import { Banner, Button, Card, Input, Spin, Tag, Typography } from '@douyinfe/semi-ui';
 import { FormEvent, ReactNode, useCallback, useContext, useEffect, useState, createContext } from 'react';
 import { api } from '../../api/client';
 import { PasswordInput } from '../shared/PasswordInput';
@@ -79,8 +79,6 @@ export function AuthGate({ children }: { children: ReactNode }) {
  const [tokenVersion, setTokenVersion] = useState(0);
  const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
-  const [draftToken, setDraftToken] = useState('');
-  const [legacyMode, setLegacyMode] = useState(false);
  const [attempted, setAttempted] = useState(() => Boolean(getAccessToken()));
  const [loginPending, setLoginPending] = useState(false);
  const [loginError, setLoginError] = useState('');
@@ -98,7 +96,6 @@ export function AuthGate({ children }: { children: ReactNode }) {
    clearAccessToken();
    clearClientSession();
    setPassword('');
-    setDraftToken('');
    setAttempted(false);
    setLoginError('');
    setTokenVersion((value) => value + 1);
@@ -117,12 +114,8 @@ export function AuthGate({ children }: { children: ReactNode }) {
    setLoginError('');
    setLoginPending(true);
    try {
-      if (legacyMode) {
-        setAccessToken(draftToken);
-      } else {
-        const result = await api.login({ username: username.trim(), password });
-        setAccessToken(result.accessToken);
-      }
+      const result = await api.login({ username: username.trim(), password });
+      setAccessToken(result.accessToken);
      clearClientSession();
      setTokenVersion((value) => value + 1);
    } catch (error) {
@@ -132,11 +125,6 @@ export function AuthGate({ children }: { children: ReactNode }) {
      setLoginPending(false);
    }
  };
-  const switchLoginMode = (mode: string) => {
-    setLegacyMode(mode === 'token');
-    setLoginError('');
-  };
-
  if (session.isPending) {
    return <AuthLoadingState />;
  }
@@ -159,45 +147,20 @@ export function AuthGate({ children }: { children: ReactNode }) {
        <footer><IconLock /><Text>账号、车辆与菜单权限全程隔离</Text></footer>
      </section>
      <Card className="v2-auth-card" bodyStyle={{ padding: 0 }}>
-        <form className="v2-auth-form" onSubmit={login} aria-label={legacyMode ? '运维令牌登录' : '平台账号登录'}>
+        <form className="v2-auth-form" onSubmit={login} aria-label="平台账号登录">
          <header className="v2-auth-form-heading">
            <img className="v2-auth-logo" src="/brand-logo.svg" alt="羚牛智能" />
-            <Tag color={legacyMode ? 'amber' : 'blue'} prefixIcon={legacyMode ? <IconKey /> : <IconUser />}>
-              {legacyMode ? '受控运维入口' : '账号权限登录'}
-            </Tag>
+            <Tag color="blue" prefixIcon={<IconUser />}>账号权限登录</Tag>
            <Title heading={3}>登录车辆数据中台</Title>
-            <Text type="secondary">{legacyMode ? '仅供平台运维使用，输入服务器访问令牌。' : '使用管理员为你开通的账号登录。'}</Text>
+            <Text type="secondary">使用管理员为你开通的账号登录。</Text>
          </header>
-          <Tabs
-            className="v2-auth-mode-tabs"
-            activeKey={legacyMode ? 'token' : 'account'}
-            onChange={switchLoginMode}
-            tabPaneMotion={false}
-            type="button"
-          >
-            <Tabs.TabPane itemKey="account" tab="账号登录" icon={<IconUser aria-hidden="true" />}>
-              <div className="v2-auth-fields">
-                <label><span>用户名</span><Input autoFocus required={!legacyMode} autoComplete="username" prefix={<IconUser aria-hidden="true" />} value={username} onChange={setUsername} placeholder="请输入用户名" size="large" /></label>
-                <label><span>密码</span><PasswordInput aria-label="登录密码" required={!legacyMode} autoComplete="current-password" prefix={<IconLock aria-hidden="true" />} visibilityLabel="登录密码" value={password} onChange={setPassword} placeholder="请输入密码" size="large" /></label>
-              </div>
-            </Tabs.TabPane>
-            <Tabs.TabPane itemKey="token" tab="运维令牌" icon={<IconKey aria-hidden="true" />}>
-              <div className="v2-auth-fields">
-                <Banner
-                  className="v2-auth-token-note"
-                  type="warning"
-                  bordered
-                  closeIcon={null}
-                  title="仅限平台运维"
-                  description="令牌只保存在当前浏览器会话，关闭或退出后失效。"
-                />
-                <label><span>运维访问令牌</span><PasswordInput aria-label="运维访问令牌" autoFocus required={legacyMode} autoComplete="off" prefix={<IconKey aria-hidden="true" />} visibilityLabel="运维访问令牌" value={draftToken} onChange={setDraftToken} placeholder="请输入服务器访问令牌" size="large" /></label>
-              </div>
-            </Tabs.TabPane>
-          </Tabs>
+          <div className="v2-auth-fields">
+            <label><span>用户名</span><Input autoFocus required autoComplete="username" prefix={<IconUser aria-hidden="true" />} value={username} onChange={setUsername} placeholder="请输入用户名" size="large" /></label>
+            <label><span>密码</span><PasswordInput aria-label="登录密码" required autoComplete="current-password" prefix={<IconLock aria-hidden="true" />} visibilityLabel="登录密码" value={password} onChange={setPassword} placeholder="请输入密码" size="large" /></label>
+          </div>
          {error ? <AuthErrorMessage message={error} /> : null}
-          <Button block htmlType="submit" loading={loginPending} disabled={loginPending || (legacyMode ? !draftToken.trim() : !username.trim() || !password)} theme="solid" type="primary" size="large">
-            {loginPending ? '正在登录…' : legacyMode ? '验证令牌并进入' : '登录工作台'}
+          <Button block htmlType="submit" loading={loginPending} disabled={loginPending || !username.trim() || !password} theme="solid" type="primary" size="large">
+            {loginPending ? '正在登录…' : '登录工作台'}
          </Button>
          <div className="v2-auth-trust-note"><IconLock /><Text type="tertiary" size="small">登录后按账号隔离菜单、车辆和本地缓存</Text></div>
        </form>