优化关闭按钮逻辑,简化代码结构

This commit is contained in:
2026-04-30 13:46:22 +08:00
parent 24d81e04e0
commit 8f3c288823
2 changed files with 24 additions and 26 deletions
@@ -432,6 +432,7 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
end_time, end_time,
onClose, onClose,
}) => { }) => {
const handleClose = onClose ?? (() => {});
// 从 featureInfos 中提取设备 ID 列表 // 从 featureInfos 中提取设备 ID 列表
const deviceIds = useMemo( const deviceIds = useMemo(
() => featureInfos.map(([id]) => id), () => featureInfos.map(([id]) => id),
@@ -931,19 +932,17 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
}} }}
/> />
</Stack> </Stack>
{onClose && ( <Tooltip title="关闭">
<Tooltip title="关闭"> <IconButton
<IconButton className="panel-close-button"
className="panel-close-button" size="small"
size="small" onClick={handleClose}
onClick={onClose} aria-label="关闭历史数据面板"
aria-label="关闭历史数据面板" sx={panelHeaderActionSx}
sx={panelHeaderActionSx} >
> <Close fontSize="small" />
<Close fontSize="small" /> </IconButton>
</IconButton> </Tooltip>
</Tooltip>
)}
</Stack> </Stack>
</Box> </Box>
@@ -36,6 +36,7 @@ const PropertyPanel: React.FC<PropertyPanelProps> = ({
onClose, onClose,
}) => { }) => {
const draggableRef = useRef<HTMLDivElement>(null); const draggableRef = useRef<HTMLDivElement>(null);
const handleClose = onClose ?? (() => {});
const headerActionSx = { const headerActionSx = {
color: "common.white", color: "common.white",
backgroundColor: "rgba(255,255,255,0.08)", backgroundColor: "rgba(255,255,255,0.08)",
@@ -93,19 +94,17 @@ const PropertyPanel: React.FC<PropertyPanelProps> = ({
</svg> </svg>
<h3 className="text-lg font-semibold"></h3> <h3 className="text-lg font-semibold"></h3>
</div> </div>
{onClose && ( <Tooltip title="关闭">
<Tooltip title="关闭"> <IconButton
<IconButton className="panel-close-button"
className="panel-close-button" size="small"
size="small" onClick={handleClose}
onClick={onClose} aria-label="关闭属性面板"
aria-label="关闭属性面板" sx={headerActionSx}
sx={headerActionSx} >
> <Close fontSize="small" />
<Close fontSize="small" /> </IconButton>
</IconButton> </Tooltip>
</Tooltip>
)}
</div> </div>
{/* 内容区域 */} {/* 内容区域 */}