refactor(前端): 集中管理设计令牌和工具函数

2026-03-10 15:49:02 +08:00
parent 196dc4ae41
commit 7f007f5010
17 changed files with 158 additions and 663 deletions
@@ -28,78 +28,10 @@ import {
  LockOutlined,
 } from '@ant-design/icons';
 import axios from 'axios';
+import { designTokens } from '../config/theme';

 const { Option = Select.Option } = Select;

-const designTokens = {
-  colors: {
-    primary: {
-      main: '#667eea',
-      gradient: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
-      light: '#8b9ff0',
-      dark: '#4f5db8',
-    },
-    success: {
-      main: '#10b981',
-      gradient: 'linear-gradient(135deg, #10b981 0%, #059669 100%)',
-    },
-    warning: {
-      main: '#f59e0b',
-      gradient: 'linear-gradient(135deg, #f59e0b 0%, #d97706 100%)',
-    },
-    error: {
-      main: '#ef4444',
-      gradient: 'linear-gradient(135deg, #ef4444 0%, #dc2626 100%)',
-    },
-    text: {
-      primary: '#1e293b',
-      secondary: '#64748b',
-      tertiary: '#94a3b8',
-      inverse: '#ffffff',
-    },
-    background: {
-      primary: '#ffffff',
-      secondary: '#f8fafc',
-      tertiary: '#f1f5f9',
-    },
-    border: {
-      light: '#e2e8f0',
-      medium: '#cbd5e1',
-      dark: '#94a3b8',
-    },
-    fieldType: {
-      string: '#3b82f6',
-      number: '#10b981',
-      boolean: '#f59e0b',
-      select: '#8b5cf6',
-      date: '#06b6d4',
-      textarea: '#64748b',
-    },
-  },
-  shadows: {
-    small: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
-    medium: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)',
-    large: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)',
-    glow: '0 0 20px rgba(102, 126, 234, 0.15)',
-  },
-  borderRadius: {
-    small: '6px',
-    medium: '10px',
-    large: '16px',
-  },
-  transitions: {
-    fast: '150ms cubic-bezier(0.4, 0, 0.2, 1)',
-    normal: '300ms cubic-bezier(0.4, 0, 0.2, 1)',
-  },
-  spacing: {
-    xs: '4px',
-    sm: '8px',
-    md: '16px',
-    lg: '24px',
-    xl: '32px',
-  },
-};
-
 const pageContainerStyle = {
  minHeight: '100vh',
  background: designTokens.colors.background.secondary,