import React, { useCallback, useEffect, useState } from 'react'; import { Check, Copy, Maximize2, Minimize2, Moon, RefreshCw, RotateCcw, Settings, Sun, X, Monitor, Trash2, } from 'lucide-react'; export interface RuoYiSettings { themeMode: 'light' | 'dark' | 'system'; darkSidebar: boolean; darkNavbar: boolean; primaryColor: string; borderRadius: number; fontSize: number; activeTab: 'appearance' | 'layout' | 'shortcuts' | 'general'; } export const RUOYI_SETTINGS_STORAGE_KEY = 'ruoyi-oneos-settings-v2'; export const DEFAULT_RUOYI_SETTINGS: RuoYiSettings = { themeMode: 'light', darkSidebar: false, darkNavbar: false, primaryColor: '#533AFD', borderRadius: 0.5, fontSize: 14, activeTab: 'appearance', }; export const PRESET_COLORS = [ { name: '默认', value: '#533AFD' }, { name: '紫罗兰', value: '#722ED1' }, { name: '樱花粉', value: '#EB2F96' }, { name: '柠檬黄', value: '#FADB14' }, { name: '天蓝色', value: '#409EFF' }, { name: '浅绿色', value: '#13C2C2' }, { name: '特色灰', value: '#595959' }, { name: '深绿色', value: '#009688' }, { name: '深蓝色', value: '#111936' }, { name: '橙黄色', value: '#FA8C16' }, { name: '玫瑰红', value: '#F5222D' }, { name: '中性色', value: '#262626' }, { name: '石板灰', value: '#1E293B' }, { name: '中灰色', value: '#4B5563' }, ]; export function readStoredRuoYiSettings(): RuoYiSettings { if (typeof window === 'undefined') return DEFAULT_RUOYI_SETTINGS; try { const raw = window.localStorage.getItem(RUOYI_SETTINGS_STORAGE_KEY); if (raw) { const parsed = JSON.parse(raw); return { ...DEFAULT_RUOYI_SETTINGS, ...parsed }; } } catch { /* ignore parse error */ } return DEFAULT_RUOYI_SETTINGS; } export function persistRuoYiSettings(settings: RuoYiSettings): void { if (typeof window === 'undefined') return; try { window.localStorage.setItem(RUOYI_SETTINGS_STORAGE_KEY, JSON.stringify(settings)); } catch { /* ignore */ } } export type RuoYiSettingsDrawerProps = { open: boolean; onClose: () => void; settings: RuoYiSettings; onChange: (next: RuoYiSettings) => void; onReset: () => void; }; export function RuoYiSettingsDrawer({ open, onClose, settings, onChange, onReset, }: RuoYiSettingsDrawerProps) { const [copied, setCopied] = useState(false); const [isFullscreen, setIsFullscreen] = useState(false); useEffect(() => { const handleKeyDown = (e: KeyboardEvent) => { if (e.key === 'Escape' && open) { onClose(); } }; window.addEventListener('keydown', handleKeyDown); return () => window.removeEventListener('keydown', handleKeyDown); }, [open, onClose]); if (!open) return null; const updateSetting = (key: K, value: RuoYiSettings[K]) => { const next = { ...settings, [key]: value }; onChange(next); }; const handleCopySettings = () => { const jsonStr = JSON.stringify(settings, null, 2); navigator.clipboard.writeText(jsonStr).then(() => { setCopied(true); setTimeout(() => setCopied(false), 2000); }); }; return (
); }