zhang1106
85d6b2c633
- 移除大量无实际效果的冗余配置项 - 新增维护模式拦截逻辑，支持管理员豁免 - 重构登录失败次数限制，从配置动态读取阈值 - 新增站点Logo支持与配置管理 - 优化用户管理页面数据拉取逻辑 - 新增端口批量创建范围模式功能 - 更新依赖包版本与缓存策略
76 lines
2.2 KiB
React
76 lines
2.2 KiB
React
import React, { useState, useEffect } from 'react';
|
||
import { Alert, Space, Button } from 'antd';
|
||
import { CloseOutlined } from '@ant-design/icons';
|
||
import { setMaintenanceCallback } from '../api';
|
||
|
||
const MAINTENANCE_STORAGE_KEY = 'maintenance_hidden_until';
|
||
|
||
/**
|
||
* 维护模式提示横幅组件
|
||
* 当系统处于维护模式时，在页面顶部显示提示信息
|
||
*/
|
||
function MaintenanceBanner() {
|
||
const [visible, setVisible] = useState(false);
|
||
const [reason, setReason] = useState('系统维护中');
|
||
const [startTime, setStartTime] = useState(null);
|
||
|
||
useEffect(() => {
|
||
setMaintenanceCallback(handleMaintenance);
|
||
}, []);
|
||
|
||
const handleMaintenance = maintenanceData => {
|
||
const hiddenUntil = localStorage.getItem(MAINTENANCE_STORAGE_KEY);
|
||
if (hiddenUntil && Date.now() < parseInt(hiddenUntil, 10)) {
|
||
return;
|
||
}
|
||
|
||
// 支持布尔值（从503拦截器）或对象（从其他来源）
|
||
if (typeof maintenanceData === 'boolean' && maintenanceData) {
|
||
setReason('系统维护中，仅管理员可访问');
|
||
setStartTime(new Date().toISOString());
|
||
} else if (typeof maintenanceData === 'object') {
|
||
setReason(maintenanceData.reason || '系统维护中');
|
||
setStartTime(maintenanceData.startTime);
|
||
}
|
||
setVisible(true);
|
||
};
|
||
|
||
const handleClose = () => {
|
||
const hideDuration = 5 * 60 * 1000;
|
||
localStorage.setItem(MAINTENANCE_STORAGE_KEY, String(Date.now() + hideDuration));
|
||
setVisible(false);
|
||
};
|
||
|
||
if (!visible) return null;
|
||
|
||
const formattedTime = startTime ? new Date(startTime).toLocaleString('zh-CN') : null;
|
||
|
||
return (
|
||
<Alert
|
||
message='系统维护中'
|
||
description={
|
||
<Space direction='vertical' size={4} style={{ width: '100%' }}>
|
||
<div>{reason}</div>
|
||
{formattedTime && <div style={{ fontSize: 12, color: '#888' }}>开始时间：{formattedTime}</div>}
|
||
</Space>
|
||
}
|
||
type='warning'
|
||
showIcon
|
||
closable
|
||
closeIcon={<CloseOutlined />}
|
||
onClose={handleClose}
|
||
style={{
|
||
position: 'fixed',
|
||
top: 0,
|
||
left: 0,
|
||
right: 0,
|
||
zIndex: 9999,
|
||
borderRadius: 0,
|
||
borderBottom: '1px solid #faad14',
|
||
}}
|
||
/>
|
||
);
|
||
}
|
||
|
||
export default MaintenanceBanner;
|