fix: 移除logo白色背景 + 优化登录页面UI和中文化

Logo修复:
  - 移除 logo.svg 中的白色背景矩形 (fill="#ffffff")
  - Logo 现在为透明背景,在深色主题上正确显示

登录页面优化:
  - 添加 "iAgent" 品牌标题 (28px, bold, 带字间距)
  - 副标题改为中文 "服务器集群运维智能体"
  - 表单中文化: 邮箱/密码/登录
  - 错误提示改为带背景色的卡片样式 (红色图标+文字)
  - 添加邮箱输入框 placeholder (user@example.com)
  - 密码框支持回车提交
  - 底部提示: "账号由管理员在后台创建或通过邀请链接注册"
  - 限制表单最大宽度 360px,外层改用 SingleChildScrollView 防溢出

用户账号说明:
  App 端不提供自助注册功能,用户账号通过以下方式创建:
  1. 管理员在 Web 后台 (用户管理页) 直接创建
  2. 管理员发送邀请链接,用户通过链接注册
  3. 通过 Web 端自助注册 (可选填公司名创建新租户)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
hailin 2026-02-22 16:42:42 -08:00
parent 5d12ada262
commit 68d0c9d6f7
2 changed files with 120 additions and 70 deletions

View File

@ -1,7 +1,4 @@
<svg width="400" height="400" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="400" height="400" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- Background -->
<rect width="400" height="400" fill="#ffffff"/>
<!-- Antenna stick --> <!-- Antenna stick -->
<line x1="200" y1="88" x2="200" y2="58" stroke="#3CC98C" stroke-width="7" stroke-linecap="round"/> <line x1="200" y1="88" x2="200" y2="58" stroke="#3CC98C" stroke-width="7" stroke-linecap="round"/>
<!-- Antenna ball --> <!-- Antenna ball -->

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -24,37 +24,53 @@ class _LoginPageState extends ConsumerState<LoginPage> {
return Scaffold( return Scaffold(
backgroundColor: AppColors.background, backgroundColor: AppColors.background,
body: Center( body: Center(
child: Padding( child: SingleChildScrollView(
padding: const EdgeInsets.all(32), padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 48),
child: Form( child: Form(
key: _formKey, key: _formKey,
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 360),
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
SvgPicture.asset( SvgPicture.asset(
'assets/icons/logo.svg', 'assets/icons/logo.svg',
width: 100, width: 96,
height: 100, height: 96,
), ),
const SizedBox(height: 8), const SizedBox(height: 12),
const Text( const Text(
'Operations Intelligent Agent', 'iAgent',
style: TextStyle(color: AppColors.textSecondary), style: TextStyle(
color: AppColors.textPrimary,
fontSize: 28,
fontWeight: FontWeight.bold,
letterSpacing: 2,
),
),
const SizedBox(height: 4),
const Text(
'服务器集群运维智能体',
style: TextStyle(
color: AppColors.textSecondary,
fontSize: 14,
),
), ),
const SizedBox(height: 48), const SizedBox(height: 48),
TextFormField( TextFormField(
controller: _emailController, controller: _emailController,
keyboardType: TextInputType.emailAddress, keyboardType: TextInputType.emailAddress,
decoration: const InputDecoration( decoration: const InputDecoration(
labelText: 'Email', labelText: '邮箱',
prefixIcon: Icon(Icons.email), hintText: 'user@example.com',
prefixIcon: Icon(Icons.email_outlined),
), ),
validator: (value) { validator: (value) {
if (value == null || value.isEmpty) { if (value == null || value.isEmpty) {
return 'Please enter your email'; return '请输入邮箱地址';
} }
if (!value.contains('@')) { if (!value.contains('@')) {
return 'Please enter a valid email'; return '请输入有效的邮箱地址';
} }
return null; return null;
}, },
@ -64,26 +80,50 @@ class _LoginPageState extends ConsumerState<LoginPage> {
controller: _passwordController, controller: _passwordController,
obscureText: true, obscureText: true,
decoration: const InputDecoration( decoration: const InputDecoration(
labelText: 'Password', labelText: '密码',
prefixIcon: Icon(Icons.lock), prefixIcon: Icon(Icons.lock_outline),
), ),
validator: (value) { validator: (value) {
if (value == null || value.isEmpty) { if (value == null || value.isEmpty) {
return 'Please enter your password'; return '请输入密码';
} }
return null; return null;
}, },
onFieldSubmitted: (_) => _handleLogin(),
), ),
if (authState.error != null) ...[ if (authState.error != null) ...[
const SizedBox(height: 16), const SizedBox(height: 16),
Text( Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
decoration: BoxDecoration(
color: AppColors.error.withAlpha(25),
borderRadius: BorderRadius.circular(8),
),
child: Row(
children: [
const Icon(Icons.error_outline,
color: AppColors.error, size: 18),
const SizedBox(width: 8),
Expanded(
child: Text(
authState.error!, authState.error!,
style: const TextStyle(color: Colors.red), style: const TextStyle(
color: AppColors.error,
fontSize: 13,
),
),
),
],
),
), ),
], ],
const SizedBox(height: 24), const SizedBox(height: 24),
SizedBox( SizedBox(
width: double.infinity, width: double.infinity,
height: 48,
child: FilledButton( child: FilledButton(
onPressed: authState.isLoading ? null : _handleLogin, onPressed: authState.isLoading ? null : _handleLogin,
child: authState.isLoading child: authState.isLoading
@ -95,14 +135,27 @@ class _LoginPageState extends ConsumerState<LoginPage> {
color: Colors.white, color: Colors.white,
), ),
) )
: const Text('Login'), : const Text(
'登录',
style: TextStyle(fontSize: 16),
), ),
), ),
),
const SizedBox(height: 32),
Text(
'账号由管理员在后台创建或通过邀请链接注册',
style: TextStyle(
color: AppColors.textMuted,
fontSize: 12,
),
textAlign: TextAlign.center,
),
], ],
), ),
), ),
), ),
), ),
),
); );
} }