diff --git a/src/pages/business_emergencyDrill/EmergencyDrill.js b/src/pages/business_emergencyDrill/EmergencyDrill.js
index 0db4578..caaf8c2 100644
--- a/src/pages/business_emergencyDrill/EmergencyDrill.js
+++ b/src/pages/business_emergencyDrill/EmergencyDrill.js
@@ -4,6 +4,7 @@ import { ClockCircleOutlined, EnvironmentOutlined, UserOutlined } from '@ant-des
import * as echarts from 'echarts';
import styles from './EmergencyDrill.less';
import { Import } from '../business_hiddentrouble/component/hiddenDangerInspection/hiddenDangerInspection';
+import StandardTable from '@/components/StandardTable';
import iconDrill1 from '../../assets/business_Emergency/iconDrill1.svg';
import iconDrill2 from '../../assets/business_Emergency/iconDrill2.jpg';
import iconDrill3 from '../../assets/business_Emergency/iconDrill3.svg';
@@ -13,6 +14,20 @@ const EmergencyDrill = () => {
const [timeType, setTimeType] = useState('month');
const chartRef = useRef(null);
const chartInstanceRef = useRef(null);
+
+ // 第三块状态
+ const [startDate, setStartDate] = useState('2024-08-23 00:00');
+ const [endDate, setEndDate] = useState('2024-08-23 00:00');
+ const [companyName, setCompanyName] = useState('');
+ const [unitName, setUnitName] = useState('');
+ const [pagination, setPagination] = useState({
+ current: 1,
+ pageSize: 10,
+ total: 48,
+ showSizeChanger: true,
+ showQuickJumper: true,
+ showTotal: (total) => `共 ${total} 条`,
+ });
const chartRef2 = useRef(null);
const chartInstanceRef2 = useRef(null);
@@ -500,6 +515,184 @@ const EmergencyDrill = () => {
{/* 第三块内容区域 */}
+
+
+
+
+
+
{
+ let className = styles.statusInProgress;
+ if (status === '已安排') className = styles.statusScheduled;
+ if (status === '已完成') className = styles.statusCompleted;
+ return {status};
+ },
+ },
+ {
+ title: '存在问题或改进措施',
+ dataIndex: 'improvements',
+ key: 'improvements',
+ ellipsis: true,
+ },
+ {
+ title: '操作',
+ key: 'action',
+ width: 150,
+ align: 'center',
+ render: () => (
+
+ 查看
+ 下载
+ 删除
+
+ ),
+ },
+ ]}
+ onChange={(newPagination) => setPagination(newPagination)}
+ />
+
);
diff --git a/src/pages/business_emergencyDrill/EmergencyDrill.less b/src/pages/business_emergencyDrill/EmergencyDrill.less
index 1aea53d..9194ab7 100644
--- a/src/pages/business_emergencyDrill/EmergencyDrill.less
+++ b/src/pages/business_emergencyDrill/EmergencyDrill.less
@@ -829,6 +829,192 @@
.block3 {
width: 100%;
flex: 1;
- background-color: pink;
+ background-color: #FFFFFF;
+ padding: 20px;
+
+ .block3Header {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ margin-bottom: 16px;
+
+ .headerLine {
+ width: 2px;
+ height: 16px;
+ background-color: #2E4CD4;
+ }
+
+ .headerTitle {
+ font-size: 14px;
+ font-weight: 500;
+ color: #333333;
+ }
+ }
+
+ .searchBar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 16px;
+ gap: 12px;
+
+ .searchLeft {
+ display: flex;
+ gap: 12px;
+ flex-wrap: wrap;
+ flex: 1;
+
+ .searchItem {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+
+ .searchLabel {
+ font-size: 14px;
+ color: #333333;
+ white-space: nowrap;
+ }
+
+ .dateInput {
+ width: 150px;
+ height: 32px;
+ padding: 0 12px;
+ border: 1px solid #D9D9D9;
+ border-radius: 4px;
+ font-size: 14px;
+ outline: none;
+ transition: all 0.3s;
+
+ &:focus {
+ border-color: #2E4CD4;
+ }
+
+ &::placeholder {
+ color: #BFBFBF;
+ }
+ }
+
+ .dateSeparator {
+ color: #999999;
+ margin: 0 4px;
+ }
+
+ .companyInput {
+ width: 200px;
+ height: 32px;
+ padding: 0 12px;
+ border: 1px solid #D9D9D9;
+ border-radius: 4px;
+ font-size: 14px;
+ outline: none;
+ transition: all 0.3s;
+
+ &:focus {
+ border-color: #2E4CD4;
+ }
+
+ &::placeholder {
+ color: #BFBFBF;
+ }
+ }
+
+ .unitSelect {
+ width: 200px;
+ height: 32px;
+ padding: 0 12px;
+ border: 1px solid #D9D9D9;
+ border-radius: 4px;
+ font-size: 14px;
+ outline: none;
+ background-color: #FFFFFF;
+ cursor: pointer;
+ transition: all 0.3s;
+
+ &:focus {
+ border-color: #2E4CD4;
+ }
+
+ option {
+ padding: 8px;
+ }
+ }
+ }
+ }
+
+ .searchButton {
+ height: 32px;
+ padding: 0 20px;
+ border-radius: 4px;
+ font-size: 14px;
+ background-color: #2E4CD4;
+ border-color: #2E4CD4;
+
+ &:hover {
+ background-color: #4A63E6;
+ border-color: #4A63E6;
+ }
+ }
+
+ .uploadButton {
+ height: 32px;
+ padding: 0 20px;
+ border-radius: 4px;
+ font-size: 14px;
+ background-color: #2E4CD4;
+ border-color: #2E4CD4;
+
+ &:hover {
+ background-color: #4A63E6;
+ border-color: #4A63E6;
+ }
+ }
+ }
+
+ .tableContainer {
+ .statusInProgress {
+ display: inline-block;
+ background-color: #E6F0FF;
+ color: #2E4CD4;
+ padding: 2px 8px;
+ border-radius: 4px;
+ font-size: 12px;
+ }
+
+ .statusScheduled {
+ display: inline-block;
+ background-color: #FFF7E6;
+ color: #FF8C00;
+ padding: 2px 8px;
+ border-radius: 4px;
+ font-size: 12px;
+ }
+
+ .statusCompleted {
+ display: inline-block;
+ background-color: #E6F7ED;
+ color: #52C41A;
+ padding: 2px 8px;
+ border-radius: 4px;
+ font-size: 12px;
+ }
+
+ .actionButtons {
+ display: flex;
+ gap: 12px;
+ justify-content: center;
+ align-items: center;
+
+ .actionLink {
+ color: #2E4CD4;
+ cursor: pointer;
+ font-size: 14px;
+ transition: opacity 0.2s;
+
+ &:hover {
+ opacity: 0.7;
+ }
+ }
+ }
+ }
}
}
\ No newline at end of file