jiangxucong
/
dq-sms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页面

Browse Source
main
wangyunfei 1 month ago
parent bb60fcc834
commit 4d91bf0039
2 changed files with 131 additions and 5 deletions
Show Stats Download Patch File Download Diff File

39
src/pages/safe_majorHazard/module/OnlineMonitoring.js
Unescape Escape View File

@ -142,14 +142,41 @@ const OnlineMonitoring = () => {
chart.setOption(option); chart.setOption(option);
// 响应式调整 // 响应式调整 - 使用ResizeObserver监听容器尺寸变化
let resizeTimer = null;
const handleResize = () => { const handleResize = () => {
// 防抖处理，避免频繁调用resize
if (resizeTimer) {
clearTimeout(resizeTimer);
}
resizeTimer = setTimeout(() => {
chart.resize(); chart.resize();
}, 100);
}; };
// 监听窗口大小变化
window.addEventListener('resize', handleResize); window.addEventListener('resize', handleResize);
// 监听容器尺寸变化（解决菜单栏伸缩时的自适应问题）
let resizeObserver = null;
if (window.ResizeObserver) {
resizeObserver = new ResizeObserver(() => {
// 使用setTimeout确保DOM更新完成后再调整图表
setTimeout(() => {
handleResize();
}, 0);
});
resizeObserver.observe(chartRef.current);
}
return () => { return () => {
window.removeEventListener('resize', handleResize); window.removeEventListener('resize', handleResize);
if (resizeObserver) {
resizeObserver.disconnect();
}
if (resizeTimer) {
clearTimeout(resizeTimer);
}
chart.dispose(); chart.dispose();
}; };
} }
@ -442,6 +469,11 @@ const OnlineMonitoring = () => {
// 批量删除功能 // 批量删除功能
const handleBatchDelete = () => { const handleBatchDelete = () => {
if (selectedRowKeys.length === 0) {
console.log('没有选中任何行');
// 可以在这里添加提示用户选择行的逻辑
return;
}
console.log('批量删除', selectedRowKeys); console.log('批量删除', selectedRowKeys);
// 这里可以添加批量删除逻辑 // 这里可以添加批量删除逻辑
}; };
@ -644,9 +676,8 @@ const OnlineMonitoring = () => {
</Button> </Button>
<Button <Button
danger type="primary"
onClick={handleBatchDelete} onClick={handleBatchDelete}
disabled={selectedRowKeys.length === 0}
> >
<img src={deleteIcon} alt="删除" style={{ width: 16, height: 16, margin: '-2px 6px 0 0px' }} /> <img src={deleteIcon} alt="删除" style={{ width: 16, height: 16, margin: '-2px 6px 0 0px' }} />
批量删除 批量删除
@ -671,7 +702,7 @@ const OnlineMonitoring = () => {
showSizeChanger: false, showSizeChanger: false,
showQuickJumper: true, showQuickJumper: true,
showTotal: (total, range) => showTotal: (total, range) =>
`第 ${range[0]}-${range[1]} 条/共 ${total} 条`, `共 ${total} 条`,
}} }}
scroll={{ x: 1200 }} scroll={{ x: 1200 }}
/> />

95
src/pages/safe_majorHazard/module/OnlineMonitoring.less
Unescape Escape View File

@ -783,6 +783,101 @@
.tableActions { .tableActions {
display: flex; display: flex;
gap: 8px; gap: 8px;
// 自定义按钮样式
:global(.ant-btn) {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
&:hover {
background-color: #f5f5f5 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:focus {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:active {
background-color: #e6e6e6 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
// 主要按钮样式
&.ant-btn-primary {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
&:hover {
background-color: #f5f5f5 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:focus {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:active {
background-color: #e6e6e6 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
}
// 危险按钮样式
&.ant-btn-dangerous {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
&:hover {
background-color: #f5f5f5 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:focus {
background-color: #ffffff !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
&:active {
background-color: #e6e6e6 !important;
border-color: #DFE4F6 !important;
color: #333333 !important;
box-shadow: none !important;
}
}
// 禁用状态
&:disabled {
background-color: #f5f5f5 !important;
border-color: #d9d9d9 !important;
color: #bfbfbf !important;
box-shadow: none !important;
}
}
} }
} }

Write Preview
Loading…
Cancel
Save