feat(platform): harden telemetry pipeline and unify Semi UI workspaces

vehicle-data-platform/apps/web/src/v2/auth/AuthGate.tsx

@@ -1,8 +1,11 @@
 import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { 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 { clearAccessToken, getAccessToken, PLATFORM_UNAUTHORIZED_EVENT, PlatformSession, setAccessToken } from './session';
 
+const { Title, Text } = Typography;
+
 type AuthContextValue = {
   session: PlatformSession;
   logout: () => void;
@@ -76,32 +79,34 @@ export function AuthGate({ children }: { children: ReactNode }) {
   };
 
   if (session.isPending) {
-    return <div className="v2-auth-screen"><div className="v2-auth-card v2-auth-loading"><img className="v2-auth-logo" src="/brand-logo.svg" alt="羚牛智能" /><i className="v2-auth-spinner" /><strong>正在验证登录状态…</strong></div></div>;
+    return <div className="v2-auth-screen"><Card className="v2-auth-card v2-auth-loading"><img className="v2-auth-logo" src="/brand-logo.svg" alt="羚牛智能" /><Spin size="large" /><Text strong>正在验证登录状态…</Text></Card></div>;
   }
   if (!session.data) {
     const error = loginError || (attempted && session.error ? session.error.message : '');
     return <div className="v2-auth-screen">
       <section className="v2-auth-intro" aria-hidden="true">
         <img src="/brand-logo.svg" alt="" />
-        <h2>让每一辆车的数据<br />清晰、可控、可信</h2>
-        <p>统一查看实时状态、车辆轨迹与里程数据。账号权限由管理员按车辆和功能精确分配。</p>
-        <div><span>车辆级数据隔离</span><span>登录审计</span><span>可扩展身份接入</span></div>
+        <Title heading={1}>让每一辆车的数据<br />清晰、可控、可信</Title>
+        <Text>统一查看实时状态、车辆轨迹与里程数据。账号权限由管理员按车辆和功能精确分配。</Text>
+        <div><Tag color="blue">车辆级数据隔离</Tag><Tag color="cyan">登录审计</Tag><Tag color="green">可扩展身份接入</Tag></div>
       </section>
-      <form className="v2-auth-card" onSubmit={login}>
-        <img className="v2-auth-logo" src="/brand-logo.svg" alt="羚牛智能" />
-        <h1>登录车辆数据中台</h1>
-        <p>{legacyMode ? '仅供平台运维使用，输入服务器访问令牌。' : '使用管理员为你开通的账号登录。'}</p>
-        {legacyMode ? <label><span>运维访问令牌</span><input autoFocus required type="password" autoComplete="off" value={draftToken} onChange={(event) => setDraftToken(event.target.value)} placeholder="Bearer token" /></label> : <>
-          <label><span>用户名</span><input autoFocus required autoComplete="username" value={username} onChange={(event) => setUsername(event.target.value)} placeholder="请输入用户名" /></label>
-          <label><span>密码</span><input required type="password" autoComplete="current-password" value={password} onChange={(event) => setPassword(event.target.value)} placeholder="请输入密码" /></label>
-        </>}
-        {error ? <em role="alert">{error}</em> : null}
-        <button type="submit" disabled={loginPending || (legacyMode ? !draftToken.trim() : !username.trim() || !password)}>{loginPending ? '正在登录…' : '登录'}</button>
-        <button className="v2-auth-mode-switch" type="button" onClick={() => { setLegacyMode((value) => !value); setLoginError(''); }}>
-          {legacyMode ? '返回账号密码登录' : '使用运维令牌登录'}
-        </button>
-        <small>登录即表示你同意遵守平台数据安全规范</small>
-      </form>
+      <Card className="v2-auth-card" bodyStyle={{ padding: 0 }}>
+        <form className="v2-auth-form" onSubmit={login}>
+          <img className="v2-auth-logo" src="/brand-logo.svg" alt="羚牛智能" />
+          <Title heading={3}>登录车辆数据中台</Title>
+          <Text type="secondary">{legacyMode ? '仅供平台运维使用，输入服务器访问令牌。' : '使用管理员为你开通的账号登录。'}</Text>
+          {legacyMode ? <label><span>运维访问令牌</span><Input autoFocus required type="password" autoComplete="off" value={draftToken} onChange={setDraftToken} placeholder="Bearer token" size="large" /></label> : <>
+            <label><span>用户名</span><Input autoFocus required autoComplete="username" value={username} onChange={setUsername} placeholder="请输入用户名" size="large" /></label>
+            <label><span>密码</span><Input required type="password" autoComplete="current-password" value={password} onChange={setPassword} placeholder="请输入密码" size="large" /></label>
+          </>}
+          {error ? <Text type="danger" role="alert">{error}</Text> : null}
+          <Button block htmlType="submit" loading={loginPending} disabled={loginPending || (legacyMode ? !draftToken.trim() : !username.trim() || !password)} theme="solid" type="primary" size="large">{loginPending ? '正在登录…' : '登录'}</Button>
+          <Button block className="v2-auth-mode-switch" type="tertiary" theme="borderless" onClick={() => { setLegacyMode((value) => !value); setLoginError(''); }}>
+            {legacyMode ? '返回账号密码登录' : '使用运维令牌登录'}
+          </Button>
+          <Text type="tertiary" size="small">登录即表示你同意遵守平台数据安全规范</Text>
+        </form>
+      </Card>
     </div>;
   }
   return <AuthContext.Provider value={{ session: session.data, logout }}>{children}</AuthContext.Provider>;