- {/* 背景装饰 */}
-
-
+ const features = [
+ { icon:
, title: '实时监控', desc: '3D可视化机房全景', color: '#14b8a6' },
+ { icon:
, title: '安全可靠', desc: '多重权限防护', color: '#3b82f6' },
+ { icon:
, title: '极速响应', desc: '毫秒级数据采集', color: '#8b5cf6' },
+ ];
-
-
-
-
+ const stats = [
+ { value: '99.9%', label: '可用性', icon: '↑' },
+ { value: '24/7', label: '监控', icon: '●' },
+ { value: '<100ms', label: '响应', icon: '⚡' },
+ ];
-
- IDC设备
- <br />
- 管理系统
-
-
-
- 专业的数据中心设备管理平台，提供机房、机柜、设备的全生命周期管理，
- 助力企业实现高效的IT资产管理。
-
-
-
-
-
-
99.9%
-
系统稳定性
+ const RackVisual = () => (
+
+
+ 机房概览
+ 3 在线
+
+
+ {[1, 2, 3].map((rack) => (
+
+
+ {rack.toString().padStart(2, '0')}
+
-
-
-
-
24/7
-
全天候监控
+
+ {[1, 2, 3, 4, 5].map((slot) => (
+
+ ))}
-
-
-
+ ))}
);
- // 获取标题和副标题
- const getHeaderContent = () => {
- if (isFirstUser) {
- return {
- title: '创建管理员账户',
- subtitle: '首次使用，请创建系统管理员账户',
- };
- }
- if (unlockMode) {
- return {
- title: '账户解锁',
- subtitle: '输入账户信息以解锁账户',
- };
- }
- if (registerMode) {
- return {
- title: '注册新账户',
- subtitle: '填写信息完成账户注册',
- };
- }
- return {
- title: '欢迎回来',
- subtitle: '请登录您的账户以继续',
- };
- };
-
- const headerContent = getHeaderContent();
-
return (
-
- {/* 左侧区域 - 桌面端显示 */}
-
-
-
+
+
- {/* 右侧登录区域 */}
-
- {/* 移动端背景 */}
-
+
+
+
+
+
+
+
+ IDC
+ 机柜管理系统
+
+
智能数据中心基础设施管理平台
+
+
-
- {/* 返回按钮 */}
- {(registerMode || unlockMode) && !isFirstUser && (
- }
- onClick={() => {
- setRegisterMode(false);
- setUnlockMode(false);
- }}
- style={{
- position: 'absolute',
- top: '24px',
- left: '24px',
- color: '#667eea',
- padding: '4px 8px',
- }}
- >
- 返回
-
- )}
+
- {/* 头部 */}
-
-
-
+
+ {stats.map((stat, index) => (
+
+ {stat.value}
+ {stat.label}
+
+ ))}
+
+
+
+ {features.map((feature, index) => (
+
+
+ {feature.icon}
+
+
+ {feature.title}
+ {feature.desc}
+
+
→
+
+ ))}
+
+
+
+
+ 🛡️
+ 企业级安全认证
+
+ v{appVersion}
-
- {headerContent.title}
-
-
{headerContent.subtitle}
- {/* 首次使用提示 */}
- {isFirstUser && (
-
- )}
+
- {/* 解锁模式提示 */}
- {unlockMode && (
-
- )}
+
+
+
+ {isFirstUser ? '初始化系统' : '欢迎回来'}
+
+
+ {isFirstUser
+ ? '创建管理员账号以开始使用系统'
+ : '请登录您的账号继续访问'}
+
+
- {/* 表单 */}
-
+ )}
- {/* 底部切换 */}
- {!isFirstUser && (
-
- {!unlockMode && !registerMode && (
-
} size="large">
-
-
-
+
}
+ />
+
+
+ }
+ />
+
+
+ }
+ />
+
+
)}
- {(registerMode || unlockMode) && (
-
- 已有账户？{' '}
-
-
+
+ }
+ placeholder={isFirstUser ? '请设置管理员账号' : '请输入用户名'}
+ className="login-input"
+ />
+
+
+
+ }
+ placeholder={isFirstUser ? '请设置管理员密码' : '请输入密码'}
+ className="login-input"
+ />
+
+
+ {registerMode && (
+
({
+ validator(_, value) {
+ if (!value || getFieldValue('password') === value) {
+ return Promise.resolve();
+ }
+ return Promise.reject(new Error('两次输入的密码不一致'));
+ },
+ }),
+ ]}
+ >
+ }
+ placeholder="请确认密码"
+ className="login-input"
+ />
+
)}
+
+
+
+
+
+
+ {!isFirstUser && !registerMode && (
+
+
+
+ )}
+
+
+ IDC Management System
+
+ v{appVersion}
- )}
-
-
- {/* 移动端底部版权 */}
-
- © 2024 IDC设备管理系统. All rights reserved.
+
-
-
- {/* 响应式样式 */}
-
-
+
+