feat: 云睿资产管理系统标准化定制完成 (Xinmi Workflow Step 0-11)
This commit is contained in:
yi
+1
-1
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>IDC设备管理系统</title>
|
||||
<title>云睿资产管理系统</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
||||
+36
-3
@@ -36,6 +36,7 @@ import {
|
||||
CodepenOutlined,
|
||||
CloudUploadOutlined,
|
||||
LayoutOutlined,
|
||||
LinkOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import {
|
||||
BrowserRouter as Router,
|
||||
@@ -372,6 +373,11 @@ const AppLayout = ({ children }) => {
|
||||
icon: <AuditOutlined style={{ fontSize: '16px' }} />,
|
||||
label: <Link to="/operation-logs">操作日志</Link>,
|
||||
},
|
||||
{
|
||||
key: 'about',
|
||||
icon: <InfoCircleOutlined style={{ fontSize: '16px' }} />,
|
||||
label: <Link to="/about">关于系统</Link>,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
@@ -440,7 +446,7 @@ const AppLayout = ({ children }) => {
|
||||
lineHeight: 1.2,
|
||||
}}
|
||||
>
|
||||
{config.site_name || 'IDC管理'}
|
||||
{config.site_name || '云睿资产'}
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
@@ -449,7 +455,7 @@ const AppLayout = ({ children }) => {
|
||||
marginTop: '2px',
|
||||
}}
|
||||
>
|
||||
数据中心管理平台
|
||||
云端睿智资产管理
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -477,10 +483,36 @@ const AppLayout = ({ children }) => {
|
||||
|
||||
<div
|
||||
style={{
|
||||
padding: '12px',
|
||||
padding: '8px 12px',
|
||||
borderTop: `1px solid ${designTokens.colors.sidebar.border}`,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '4px'
|
||||
}}
|
||||
>
|
||||
{!collapsed && (
|
||||
<div style={{ padding: '0 8px 8px 8px' }}>
|
||||
<a
|
||||
href="http://code.xinmi.cloud/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
fontSize: '12px',
|
||||
color: designTokens.colors.primary.main,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '4px',
|
||||
opacity: 0.8,
|
||||
transition: 'opacity 0.2s'
|
||||
}}
|
||||
onMouseEnter={e => e.target.style.opacity = 1}
|
||||
onMouseLeave={e => e.target.style.opacity = 0.8}
|
||||
>
|
||||
<LinkOutlined style={{ fontSize: '12px' }} />
|
||||
<span>新觅源码库</span>
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
<Button
|
||||
type="text"
|
||||
icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
|
||||
@@ -624,6 +656,7 @@ const routeConfig = [
|
||||
{ path: '/error-boundary-test', component: ErrorBoundaryTest },
|
||||
{ path: '/idle-devices', component: IdleDeviceManagement },
|
||||
{ path: '/floor-plan', component: RoomFloorPlan },
|
||||
{ path: '/about', component: About },
|
||||
];
|
||||
|
||||
const ThemeConfig = () => {
|
||||
|
||||
@@ -0,0 +1,144 @@
|
||||
import React from 'react';
|
||||
import { Layout, Typography, Card, Row, Col, Space, Tag, Button } from 'antd';
|
||||
import {
|
||||
InfoCircleOutlined,
|
||||
RocketOutlined,
|
||||
CodeOutlined,
|
||||
GithubOutlined,
|
||||
ThunderboltOutlined,
|
||||
CloudServerOutlined,
|
||||
LinkOutlined
|
||||
} from '@ant-design/icons';
|
||||
import { designTokens } from '../config/theme';
|
||||
|
||||
const { Title, Paragraph, Text } = Typography;
|
||||
|
||||
const About = () => {
|
||||
const techStack = [
|
||||
{ name: 'React', version: '18.2.0', icon: <RocketOutlined /> },
|
||||
{ name: 'Vite', version: '5.2.10', icon: <ThunderboltOutlined /> },
|
||||
{ name: 'Ant Design', version: '5.17.0', icon: <BuildOutlined /> },
|
||||
{ name: 'Node.js', version: '20+', icon: <CloudServerOutlined /> },
|
||||
{ name: 'Express', version: '4.19.2', icon: <ApiOutlined /> },
|
||||
{ name: 'Sequelize', version: '6.37.3', icon: <DatabaseOutlined /> },
|
||||
{ name: 'Three.js', version: '0.164.1', icon: <CodepenOutlined /> },
|
||||
];
|
||||
|
||||
const features = [
|
||||
{ title: '资产管理', desc: '全方位的 IDC 资产登记与追踪' },
|
||||
{ title: '3D 可视化', desc: '基于 Three.js 的机房机柜 3D 仿真展示' },
|
||||
{ title: '工单系统', desc: '标准化的故障处理与日常运维流程' },
|
||||
{ title: '耗材库存', desc: '精细化的备品备件出入库管理' },
|
||||
{ title: '数据监控', desc: '实时的健康状态检查与性能分析' },
|
||||
{ title: '自动化备份', desc: '安全的数据备份与一键恢复机制' },
|
||||
];
|
||||
|
||||
return (
|
||||
<div style={{ padding: '24px', maxWidth: '1200px', margin: '0 auto' }}>
|
||||
{/* Hero Section */}
|
||||
<Card
|
||||
style={{
|
||||
marginBottom: '32px',
|
||||
borderRadius: '16px',
|
||||
background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
|
||||
color: '#fff',
|
||||
border: 'none',
|
||||
overflow: 'hidden',
|
||||
position: 'relative'
|
||||
}}
|
||||
>
|
||||
<div style={{ position: 'relative', zIndex: 1, padding: '40px' }}>
|
||||
<Title level={1} style={{ color: '#fff', marginBottom: '16px' }}>云睿资产管理系统</Title>
|
||||
<Paragraph style={{ color: 'rgba(255,255,255,0.9)', fontSize: '18px', maxWidth: '600px' }}>
|
||||
智能数据中心基础设施管理平台，助力企业实现资产全生命周期管理与 3D 可视化运维。
|
||||
</Paragraph>
|
||||
<div style={{ marginTop: '24px' }}>
|
||||
<Tag color="rgba(255,255,255,0.2)" style={{ fontSize: '14px', padding: '4px 12px', border: '1px solid rgba(255,255,255,0.3)', color: '#fff' }}>v1.0.0 Stable</Tag>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
right: '-50px',
|
||||
top: '-50px',
|
||||
opacity: 0.1,
|
||||
fontSize: '300px'
|
||||
}}>
|
||||
<CloudServerOutlined />
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Row gutter={[32, 32]}>
|
||||
<Col xs={24} md={16}>
|
||||
{/* Main Content */}
|
||||
<Card title={<Space><InfoCircleOutlined /> 关于平台</Space>} style={{ borderRadius: '12px', height: '100%' }}>
|
||||
<Paragraph>
|
||||
云睿资产管理系统（YunRui Asset Management System）是一款专为中大型数据中心设计的资产管理解决方案。平台集成了资产台账、3D 仿真、工单运维、耗材管理等核心模块，通过数字化手段解决 IDC 运维中“资产找不着、状态看不见、流程不规范”的痛点。
|
||||
</Paragraph>
|
||||
<Paragraph>
|
||||
系统采用现代化的前后端分离架构，前端基于 React 和 Vite 提供极致的交互体验，后端依托 Node.js 实现高并发的数据处理，结合 3D 渲染技术，为用户提供身临其境的管理体验。
|
||||
</Paragraph>
|
||||
|
||||
<Title level={4} style={{ marginTop: '24px' }}>核心特性</Title>
|
||||
<Row gutter={[16, 16]}>
|
||||
{features.map((item, index) => (
|
||||
<Col span={12} key={index}>
|
||||
<div style={{ padding: '12px', background: '#f8fafc', borderRadius: '8px' }}>
|
||||
<Text strong>{item.title}</Text>
|
||||
<div style={{ fontSize: '12px', color: '#64748b' }}>{item.desc}</div>
|
||||
</div>
|
||||
</Col>
|
||||
))}
|
||||
</Row>
|
||||
</Card>
|
||||
</Col>
|
||||
|
||||
<Col xs={24} md={8}>
|
||||
{/* Sidebar Info */}
|
||||
<Card title={<Space><CodeOutlined /> 技术栈</Space>} style={{ borderRadius: '12px', marginBottom: '32px' }}>
|
||||
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
|
||||
{techStack.map((tech, index) => (
|
||||
<Tag key={index} icon={tech.icon} color="blue" style={{ padding: '4px 8px' }}>
|
||||
{tech.name} {tech.version}
|
||||
</Tag>
|
||||
))}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
title={<Space><RocketOutlined /> 获取源码</Space>}
|
||||
style={{
|
||||
borderRadius: '12px',
|
||||
background: '#f0f9ff',
|
||||
border: '1px solid #bae6fd'
|
||||
}}
|
||||
>
|
||||
<Paragraph>
|
||||
本项目已由新觅源码库进行标准化定制，提供商业级的高质量源码。
|
||||
</Paragraph>
|
||||
<Button
|
||||
type="primary"
|
||||
block
|
||||
icon={<LinkOutlined />}
|
||||
href="http://code.xinmi.cloud/"
|
||||
target="_blank"
|
||||
>
|
||||
访问新觅源码库
|
||||
</Button>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<div style={{ textAlign: 'center', marginTop: '48px', color: '#94a3b8' }}>
|
||||
<Paragraph>© 2026 云睿资产管理系统 · 基于新觅自动化工作流构建</Paragraph>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// 辅助组件导入定义（模拟 Antd 图标）
|
||||
const BuildOutlined = RocketOutlined;
|
||||
const ApiOutlined = CodeOutlined;
|
||||
const DatabaseOutlined = CodeOutlined;
|
||||
const CodepenOutlined = RocketOutlined;
|
||||
|
||||
export default About;
|
||||
@@ -429,7 +429,7 @@ function Dashboard() {
|
||||
<div style={headerStyle} className="dashboard-header">
|
||||
<h1 style={titleStyle} className="dashboard-title">
|
||||
<DashboardOutlined />
|
||||
IDC设备管理系统
|
||||
云睿资产管理系统
|
||||
</h1>
|
||||
<p style={subtitleStyle} className="dashboard-subtitle">
|
||||
实时监控 · 智能管理 · 高效运维
|
||||
|
||||
@@ -156,8 +156,8 @@ const Login = () => {
|
||||
</div>
|
||||
<div className="brand-title-section">
|
||||
<h1 className="brand-title">
|
||||
<span className="brand-title__main">IDC</span>
|
||||
<span className="brand-title__sub">机柜管理系统</span>
|
||||
<span className="brand-title__main">云睿</span>
|
||||
<span className="brand-title__sub">资产管理系统</span>
|
||||
</h1>
|
||||
<p className="brand-desc">智能数据中心基础设施管理平台</p>
|
||||
</div>
|
||||
@@ -363,6 +363,12 @@ const Login = () => {
|
||||
{isFirstUser ? '创建管理员' : (registerMode ? '立即注册' : '登 录')}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
|
||||
{!isFirstUser && !registerMode && (
|
||||
<div style={{ textAlign: 'center', marginBottom: '16px', color: '#8c8c8c', fontSize: '13px' }}>
|
||||
提示：默认管理员账号通常为 <Text code>admin</Text>
|
||||
</div>
|
||||
)}
|
||||
</Form>
|
||||
|
||||
{!isFirstUser && !registerMode && (
|
||||
@@ -374,7 +380,7 @@ const Login = () => {
|
||||
)}
|
||||
|
||||
<div className="form-footer">
|
||||
<span>IDC Management System</span>
|
||||
<span>YunRui Asset Management</span>
|
||||
<span className="footer-dot" />
|
||||
<span>v{appVersion}</span>
|
||||
</div>
|
||||
|
||||
@@ -7,7 +7,7 @@ import { create } from 'zustand';
|
||||
import axios from 'axios';
|
||||
|
||||
const defaultConfig = {
|
||||
site_name: '机柜管理系统',
|
||||
site_name: '云睿资产',
|
||||
site_logo: '',
|
||||
primary_color: '#667eea',
|
||||
secondary_color: '#764ba2',
|
||||
|
||||
Reference in New Issue
Block a user