From 868d62b4d54b7829c760ee7769974a7d915b33de Mon Sep 17 00:00:00 2001 From: wangyunfei <1224056307@qq,com> Date: Thu, 25 Sep 2025 19:22:46 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../online_monitoring/delete.png | Bin 0 -> 371 bytes .../online_monitoring/export.png | Bin 0 -> 485 bytes src/components/StandardTable/index.js | 2 +- .../module/OnlineMonitoring.js | 129 ++++++++++++++++-- .../module/OnlineMonitoring.less | 7 +- 5 files changed, 124 insertions(+), 14 deletions(-) create mode 100644 src/assets/safe_majorHazard/online_monitoring/delete.png create mode 100644 src/assets/safe_majorHazard/online_monitoring/export.png diff --git a/src/assets/safe_majorHazard/online_monitoring/delete.png b/src/assets/safe_majorHazard/online_monitoring/delete.png new file mode 100644 index 0000000000000000000000000000000000000000..24aa367103db5e3b51325cbf1b1992c83e5828f2 GIT binary patch literal 371 zcmeAS@N?(olHy`uVBq!ia0vp^LLkh+1|-AI^@Rf|&H|6fVg?3oVGw3ym^DWND9BhG z7FW0l?2Wf3*~rv+ zy<9){kg(U~|7m7f?^WMUOZa0p?QhvuF_%(t)y889)6}I+rYy*a`6|aZEo}A8l|fv4 z4R;+5*!AYRjNM>SIU6lqE{FgPR`6eEA>S0+T6m$HJ{*>qPMg4`+S$%y`)53!bVkdM0 P!-&Dt)z4*}Q$iB}NyL;| literal 0 HcmV?d00001 diff --git a/src/assets/safe_majorHazard/online_monitoring/export.png b/src/assets/safe_majorHazard/online_monitoring/export.png new file mode 100644 index 0000000000000000000000000000000000000000..b2beef14b0bfd2204a887cfc571a7c6dadefcefb GIT binary patch literal 485 zcmV}D2Y1PBcH z9oFlW{LSpV86zC2)L6Sj`Ux^5r3`<6yzu-S&GPcPEEep-9JDUNZAE&kdcmwRK0Xv? zvB|C)hz8ZsfKe8O00(H%kh2drQ^!96A(>1Ng74EPm*lpWH6`u2Aeb|(mcj@glt1<& zl5qz#M0=Q<3$%lAv1uFEc>5$sw{wG17(XJ=NlkNs%Jo%}#b5lqnmF&dK&8ggW!FaK z=6dKayo1By`UlsWQv)mzq02A`CQdICWE|m^$n5eRtiJgQW~K2}5L@g?A&M6PKz#&u zOT(vuWM;H?B|JYjH4cn(wQ8F=%>^<_M~SaEDhSav`{ZiK zO~qDJn(H@(+P?>e+r&|=Fg$?Bia%6r_c_FXl0VCBS!ntov{bxEvOAK~3aW6Yl#-FD bSNi@BCI6VNLmABe00000NkvXXu0mjf6!OdQ literal 0 HcmV?d00001 diff --git a/src/components/StandardTable/index.js b/src/components/StandardTable/index.js index 9b4e4d6..94a3dc6 100644 --- a/src/components/StandardTable/index.js +++ b/src/components/StandardTable/index.js @@ -27,7 +27,7 @@ class StandardTable extends PureComponent { static getDerivedStateFromProps(nextProps) { // clean state - if (nextProps.selectedRows.length === 0) { + if (nextProps.selectedRows && nextProps.selectedRows.length === 0) { const needTotalList = initTotalList(nextProps.columns); return { selectedRowKeys: [], diff --git a/src/pages/safe_majorHazard/module/OnlineMonitoring.js b/src/pages/safe_majorHazard/module/OnlineMonitoring.js index 0920658..f69c766 100644 --- a/src/pages/safe_majorHazard/module/OnlineMonitoring.js +++ b/src/pages/safe_majorHazard/module/OnlineMonitoring.js @@ -1,7 +1,6 @@ import React, { useEffect, useRef, useState } from 'react'; import { Card, Result, Select, Button } from 'antd'; -import { DownloadOutlined, DeleteOutlined } from '@ant-design/icons'; import * as echarts from 'echarts'; import StandardTable from '@/components/StandardTable'; import styles from './OnlineMonitoring.less'; @@ -10,7 +9,8 @@ import alarm0 from '@/assets/safe_majorHazard/online_monitoring/alarm0.png'; import alarm1 from '@/assets/safe_majorHazard/online_monitoring/alarm1.png'; import alarm2 from '@/assets/safe_majorHazard/online_monitoring/alarm2.png'; import alarm3 from '@/assets/safe_majorHazard/online_monitoring/alarm3.png'; - +import exportIcon from '@/assets/safe_majorHazard/online_monitoring/export.png'; +import deleteIcon from '@/assets/safe_majorHazard/online_monitoring/delete.png'; const OnlineMonitoring = () => { const chartRef = useRef(null); @@ -162,6 +162,12 @@ const OnlineMonitoring = () => { dataIndex: 'id', key: 'id', width: 80, + render: (text, record, index) => { + const page = pagination.current || 1; + const pageSize = pagination.pageSize || 5; + const number = (page - 1) * pageSize + index + 1; + return `0${number}`.slice(-2); + } }, { title: '报警时间', @@ -314,20 +320,120 @@ const OnlineMonitoring = () => { processTime: '2024-01-15 12:30:00', processor: '王五', }, + { + key: '6', + id: '006', + alarmTime: '2024-01-15 13:25:15', + sensorName: 'LNG管道', + alarmType: '流量异常', + alarmContent: '管道流量异常波动', + priority: '中', + status: '未处理', + processTime: '-', + processor: '-', + }, + { + key: '7', + id: '007', + alarmTime: '2024-01-15 14:10:30', + sensorName: 'LNG储罐', + alarmType: '温度异常', + alarmContent: '储罐温度异常升高', + priority: '高', + status: '处理中', + processTime: '2024-01-15 14:15:00', + processor: '赵六', + }, + { + key: '8', + id: '008', + alarmTime: '2024-01-15 15:45:20', + sensorName: 'LNG管道', + alarmType: '压力超限', + alarmContent: '管道压力超过安全阈值', + priority: '高', + status: '已处理', + processTime: '2024-01-15 16:00:00', + processor: '孙七', + }, + { + key: '9', + id: '009', + alarmTime: '2024-01-15 16:30:45', + sensorName: 'LNG储罐', + alarmType: '液位超限', + alarmContent: '储罐液位超过警戒线', + priority: '中', + status: '未处理', + processTime: '-', + processor: '-', + }, + { + key: '10', + id: '010', + alarmTime: '2024-01-15 17:15:10', + sensorName: 'LNG管道', + alarmType: '泄漏检测', + alarmContent: '检测到轻微气体泄漏', + priority: '低', + status: '已处理', + processTime: '2024-01-15 17:30:00', + processor: '周八', + }, + { + key: '11', + id: '011', + alarmTime: '2024-01-15 18:20:35', + sensorName: 'LNG储罐', + alarmType: '设备故障', + alarmContent: '储罐阀门异常关闭', + priority: '高', + status: '处理中', + processTime: '2024-01-15 18:25:00', + processor: '吴九', + }, + { + key: '12', + id: '012', + alarmTime: '2024-01-15 19:05:50', + sensorName: 'LNG管道', + alarmType: '温度异常', + alarmContent: '管道温度异常下降', + priority: '中', + status: '未处理', + processTime: '-', + processor: '-', + }, ]; // 初始化数据 useEffect(() => { - setDataSource(mockData); setPagination(prev => ({ ...prev, total: mockData.length })); }, []); + // 根据分页获取当前页数据 + const getCurrentPageData = () => { + const { current, pageSize } = pagination; + const startIndex = (current - 1) * pageSize; + const endIndex = startIndex + pageSize; + return mockData.slice(startIndex, endIndex); + }; + // 表格选择变化 const onSelectChange = (newSelectedRowKeys, newSelectedRows) => { setSelectedRowKeys(newSelectedRowKeys); setSelectedRows(newSelectedRows); }; + // 分页变化处理 + const handleTableChange = (pagination) => { + setPagination(prev => ({ + ...prev, + current: pagination.current, + pageSize: pagination.pageSize, + })); + }; + // 导出功能 const handleExport = () => { console.log('导出数据'); @@ -530,18 +636,18 @@ const OnlineMonitoring = () => {
@@ -551,11 +657,14 @@ const OnlineMonitoring = () => {
tr > th) { - background-color: #fafafa; + background-color: #f5f5fa; font-weight: 500; - color: #333; + font-size: 14px; + color: #333333; border-bottom: 1px solid #f0f0f0; padding: 8px 12px; text-align: center;