- 移除大量无实际效果的冗余配置项 - 新增维护模式拦截逻辑,支持管理员豁免 - 重构登录失败次数限制,从配置动态读取阈值 - 新增站点Logo支持与配置管理 - 优化用户管理页面数据拉取逻辑 - 新增端口批量创建范围模式功能 - 更新依赖包版本与缓存策略
85 lines
2.5 KiB
JavaScript
85 lines
2.5 KiB
JavaScript
/**
|
|
* 系统配置状态管理 Store
|
|
* 支持精准订阅配置项,避免无关重渲染
|
|
*/
|
|
|
|
import { create } from 'zustand';
|
|
import axios from 'axios';
|
|
|
|
const defaultConfig = {
|
|
site_name: '机柜管理系统',
|
|
site_logo: '',
|
|
primary_color: '#667eea',
|
|
secondary_color: '#764ba2',
|
|
idle_timeout: 30,
|
|
max_login_attempts: 5,
|
|
maintenance_mode: false,
|
|
};
|
|
|
|
const applyThemeColors = (primaryColor, secondaryColor) => {
|
|
const root = document.documentElement;
|
|
if (primaryColor) {
|
|
root.style.setProperty('--primary-color', primaryColor);
|
|
root.style.setProperty('--primary-light', `${primaryColor}20`);
|
|
root.style.setProperty(
|
|
'--primary-gradient',
|
|
`linear-gradient(135deg, ${primaryColor} 0%, ${secondaryColor || '#764ba2'} 100%)`
|
|
);
|
|
}
|
|
if (secondaryColor) {
|
|
root.style.setProperty('--secondary-color', secondaryColor);
|
|
root.style.setProperty('--secondary-light', `${secondaryColor}20`);
|
|
}
|
|
};
|
|
|
|
export const useConfigStore = create((set, get) => ({
|
|
config: defaultConfig,
|
|
loading: true,
|
|
|
|
loadConfig: async () => {
|
|
try {
|
|
const response = await axios.get('/api/system-settings');
|
|
const settings = response.data;
|
|
const configValues = {};
|
|
|
|
Object.entries(settings).forEach(([key, value]) => {
|
|
configValues[key] = value.value;
|
|
});
|
|
|
|
set((state) => ({
|
|
config: { ...state.config, ...configValues },
|
|
}));
|
|
|
|
if (configValues.primary_color || configValues.secondary_color) {
|
|
applyThemeColors(configValues.primary_color, configValues.secondary_color);
|
|
}
|
|
} catch {
|
|
// 加载失败使用默认配置
|
|
} finally {
|
|
set({ loading: false });
|
|
}
|
|
},
|
|
|
|
updateConfig: (newConfig) => {
|
|
set((state) => ({
|
|
config: { ...state.config, ...newConfig },
|
|
}));
|
|
|
|
if (newConfig.primary_color || newConfig.secondary_color) {
|
|
const { config } = get();
|
|
applyThemeColors(config.primary_color, config.secondary_color);
|
|
}
|
|
},
|
|
|
|
reloadConfig: async () => {
|
|
await get().loadConfig();
|
|
},
|
|
}));
|
|
|
|
export const useConfig = () => useConfigStore((state) => state.config);
|
|
export const useConfigLoading = () => useConfigStore((state) => state.loading);
|
|
export const useSiteName = () => useConfigStore((state) => state.config.site_name);
|
|
export const useSiteLogo = () => useConfigStore((state) => state.config.site_logo);
|
|
export const usePrimaryColor = () => useConfigStore((state) => state.config.primary_color);
|
|
export const useSecondaryColor = () => useConfigStore((state) => state.config.secondary_color);
|