src/assets/img/menuicon5.svg

@@ -1,9 +1,9 @@
 <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_3082_12642)">
+<g clip-path="url(#clip0_2435_15395)">
-<path d="M9.82578 10.675C9.15078 10.675 8.67578 10.6 8.52578 10.6C8.22578 10.6 7.92578 10.3 8.00078 10C8.00078 9.7 8.30078 9.475 8.67578 9.475C10.2008 9.625 12.5508 9.475 12.9508 8.725C13.1008 8.425 13.4758 8.35 13.8008 8.425C14.1008 8.575 14.2508 8.875 14.1008 9.175C13.4008 10.45 11.2758 10.675 9.82578 10.675ZM15.0008 9.9C14.7008 9.9 14.4008 9.675 14.4008 9.3V7.325L13.5508 7C13.3258 6.925 13.1758 6.7 13.1758 6.475C13.1758 3.575 10.7258 1.225 7.70078 1.225C4.67578 1.225 2.22578 3.575 2.22578 6.475C2.22578 6.625 2.15078 6.85 2.00078 6.925L1.62578 7.15V9.275C1.62578 9.575 1.32578 9.875 1.02578 9.875C0.725781 9.875 0.425781 9.65 0.425781 9.275V6.825C0.425781 6.675 0.500781 6.45 0.650781 6.375L1.00078 6.175C1.15078 2.75 4.12578 0 7.70078 0C11.2758 0 14.1758 2.675 14.4008 6.025L15.2508 6.325C15.4758 6.4 15.6258 6.625 15.6258 6.85V9.3C15.6258 9.675 15.3258 9.9 15.0008 9.9ZM10.0508 12.725V12.575C10.5758 12.2 10.9758 11.825 11.2008 11.2C10.6758 11.275 10.0508 11.275 9.60078 11.275H8.22578C7.55078 11.2 7.07578 10.6 7.15078 9.9C7.22578 9.3 7.82578 8.75 8.45078 8.825C9.75078 8.975 11.2008 8.825 11.8008 8.6V7.075C11.8008 4.55 10.2758 3.125 7.85078 3.025H7.47578C5.02578 3.125 3.50078 4.575 3.50078 7.075C3.50078 8.6 3.50078 11.2 5.32578 12.55V12.7C2.97578 13.075 1.12578 14.075 1.12578 15.375C1.15078 15.7 1.45078 16 1.75078 16H13.3258C13.6258 16 14.0758 15.7 14.0758 15.4C14.1008 14.1 12.4258 13.1 10.0508 12.725Z" fill="white"/>
+<path d="M14.7619 16.0001H1.22927C0.903154 15.9994 0.590626 15.8694 0.360195 15.6386C0.129765 15.4079 0.00023436 15.0952 0 14.769L0 4.92337H15.992V14.769C15.992 15.4476 15.4404 16.0001 14.7619 16.0001ZM7.99645 6.15441C7.7136 6.1543 7.43351 6.20993 7.17219 6.31815C6.91087 6.42636 6.67344 6.58502 6.47348 6.78506C6.27352 6.9851 6.11495 7.2226 6.00685 7.48397C5.89874 7.74534 5.84322 8.02545 5.84346 8.30829C5.84346 8.87918 6.07024 9.42669 6.47392 9.83037C6.8776 10.2341 7.42511 10.4608 7.996 10.4608C8.56689 10.4608 9.1144 10.2341 9.51808 9.83037C9.92177 9.42669 10.1486 8.87918 10.1486 8.30829C10.1488 8.02553 10.0933 7.74548 9.98524 7.48417C9.87719 7.22286 9.71871 6.98541 9.51884 6.78538C9.31898 6.58535 9.08165 6.42667 8.82043 6.3184C8.55921 6.21014 8.27921 6.15441 7.99645 6.15441ZM12.0733 13.435L11.7926 12.6498C11.6375 12.2054 11.3485 11.82 10.9653 11.5465C10.5821 11.2731 10.1236 11.1252 9.65294 11.123H6.33729C5.86658 11.1252 5.40811 11.2731 5.02494 11.5465C4.64178 11.82 4.35275 12.2054 4.19762 12.6498L3.91695 13.435C3.68425 14.0851 4.15766 14.769 4.83357 14.769H11.1584C11.8344 14.769 12.306 14.0851 12.0733 13.435ZM0 2.46217C0 1.78359 0.551571 1.23113 1.22927 1.23113H3.07494C3.07611 0.905234 3.20609 0.593019 3.43654 0.362573C3.66698 0.132128 3.9792 0.00214676 4.3051 0.000976563C4.63115 0.00191274 4.94359 0.13179 5.17423 0.362261C5.40486 0.592732 5.53497 0.90508 5.53614 1.23113H10.4568C10.4568 0.554324 11.0101 0.000976547 11.6869 0.000976563C12.3637 0.000976578 12.9171 0.554324 12.9171 1.23113H14.7619C15.4404 1.23113 15.992 1.78359 15.992 2.46217V3.69322H0V2.46217Z" fill="white"/>
 </g>
 <defs>
-<clipPath id="clip0_3082_12642">
+<clipPath id="clip0_2435_15395">
 <rect width="16" height="16" fill="white"/>
 </clipPath>
 </defs>

src/pages/business_emergencyAccident/EmergencyAccident.js

@@ -1,41 +1,70 @@
 import React, { useState } from 'react';
-import { Button } from 'antd';
+import { Card, Row, Col, Statistic, Progress, Button, Space } from 'antd';
 import styles from './EmergencyResource.less';
-import EventWarningManagement from './components/EventWarningManagement';
+import ComplianceManagement from './components/ComplianceManagement'; //合规性管理
-import EventNotification from './components/EventNotification';
+import OnlineMonitoring from './components/OnlineMonitoring'; //在线监测预警
+import EnvironmentalPersonnelManagement from './components/EnvironmentalPersonnelManagement'; //环保人员管理
+import EvaluationReport from './components/EvaluationReport'; //评估报告
+import EquipmentManagement from './components/EquipmentManagement'; //环保设备设施管理
+import PollutionSourceManagement from './components/PollutionSourceManagement'; //污染源管理
 
-const EmergencyAccident = () => {
+
-    const [activeModule, setActiveModule] = useState('warning');
+
+const SafeMajorHazardList = () => {
+    const [activeModule, setActiveModule] = useState('organization');
 
     const handleModuleClick = (module) => {
-        setActiveModule(module);
+        setActiveModule(module)
-    };
+    }
+
 
     const renderModule = () => {
         switch (activeModule) {
-            case 'warning':
+            case 'organization':
-                return <EventWarningManagement />;
+                return <ComplianceManagement />;
-            case 'notification':
+            case 'equipment':
-                return <EventNotification />;
+                return <OnlineMonitoring />;
+            case 'firefighting':
+                return <EnvironmentalPersonnelManagement />;
+            case 'other':
+                return <EvaluationReport />;
+            case 'equipmentManagement':
+                return <EquipmentManagement />;
+            case 'pollutionSource':
+                return <PollutionSourceManagement />;
             default:
-                return <EventWarningManagement />;
+                return <ComplianceManagement />;
         }
     };
 
+
     return (
         <div className={styles.container}>
             <div className={styles.TopButton}>
                 <Button
-                    className={`${styles.TopButtonItem} ${activeModule === "warning" ? styles.active : ""}`}
+                    className={`${styles.TopButtonItem} ${activeModule === "organization" ? styles.active : ""}`}
-                    onClick={() => handleModuleClick("warning")}
+                    onClick={() => handleModuleClick("organization")}
-                >
+                >合规性管理
-                    事件预警管理
+                </Button>
+                <Button 
+                    className={`${styles.TopButtonItem} ${activeModule === "firefighting" ? styles.active : ""}`}
+                    onClick={() => handleModuleClick("firefighting")}
+                >环保人员管理
+                </Button>
+                <Button 
+                    className={`${styles.TopButtonItem} ${activeModule === "other" ? styles.active : ""}`}
+                    onClick={() => handleModuleClick("other")}
+                >排污许可管理
+                </Button>
+                <Button 
+                    className={`${styles.TopButtonItem} ${activeModule === "equipmentManagement" ? styles.active : ""}`}
+                    onClick={() => handleModuleClick("equipmentManagement")}
+                >环保设备设施管理
                 </Button>
                 <Button 
-                    className={`${styles.TopButtonItem} ${activeModule === "notification" ? styles.active : ""}`}
+                    className={`${styles.TopButtonItem} ${activeModule === "pollutionSource" ? styles.active : ""}`}
-                    onClick={() => handleModuleClick("notification")}
+                    onClick={() => handleModuleClick("pollutionSource")}
-                >
+                >污染源管理
-                    事件通知
                 </Button>
             </div>
             <div className={styles.content}>
@@ -45,4 +74,4 @@ const EmergencyAccident = () => {
     );
 };
 
-export default EmergencyAccident;
+export default SafeMajorHazardList;

src/pages/business_emergencyAccident/EmergencyResource.less

@@ -3,20 +3,20 @@
     width: 100%;
     height: 89vh;
     overflow: hidden;
-    display: flex;
+    display: flex; 
-    flex-direction: column;
+    flex-direction: column; 
 
     .TopButton {
-        background-color: #fff;
+        background-color: white;
         width: 100%;
-        padding: 8px 30px 10px 30px;
+        padding: 8px 30px 5px 30px;
         display: flex;
         gap: 24px;
         margin-left: 6px;
 
         .TopButtonItem {
             background-color: #FFFFFF !important;
-            color: #333333 !important;
+            color: #999999 !important;
             font-family: 'PingFang SC', sans-serif !important;
             font-weight: 500 !important;
             font-size: 14px !important;
@@ -27,34 +27,33 @@
             border: none !important;
             box-shadow: none !important;
             position: relative !important;
-            display: inline-flex !important;
+            display: flex !important;
             flex-direction: column !important;
             align-items: center !important;
             gap: 5px !important;
             transition: all 0.3s ease !important;
-            width: fit-content !important;
 
             &:hover {
-                color: #333333 !important;
+                color: #999999 !important;
                 border: none !important;
             }
 
             &:focus {
-                color: #333333 !important;
+                color: #999999 !important;
                 border: none !important;
             }
 
             &.active {
-                color: #2E4CD4 !important;
+                background: linear-gradient(98.03deg, #00E49C 0.68%, #00D841 98.3%) !important;
-
+                box-shadow: 0px 2px 2px 0px #AEEDDE !important;
+                color: #FFFFFF !important;
+                
                 &::after {
                     content: '';
-                    position: absolute;
+                    width: 28px;
-                    bottom: -10px;
+                    height: 5px;
-                    left: 14px;
+                    background-color: #FFFFFF;
-                    right: 14px;
+                    border-radius: 6px;
-                    height: 4px;
-                    background-color: #2E4CD4;
                     opacity: 1;
                 }
             }

src/pages/business_emergencyAccident/components/EventNotification.js

@@ -1,16 +0,0 @@
-import React from 'react';
-import styles from './EventNotification.less';
-
-const EventNotification = () => {
-    return (
-        <div className={styles.container}>
-            <div className={styles.content}>
-                <h2>事件通知</h2>
-                {/* 这里可以添加具体的内容 */}
-            </div>
-        </div>
-    );
-};
-
-export default EventNotification;
-

src/pages/business_emergencyAccident/components/EventNotification.less

@@ -1,12 +0,0 @@
-.container {
-    width: 100%;
-    height: 100%;
-    padding: 20px;
-    
-    .content {
-        background-color: #fff;
-        padding: 20px;
-        border-radius: 8px;
-    }
-}
-

src/pages/business_emergencyAccident/components/EventWarningManagement.js

@@ -1,16 +0,0 @@
-import React from 'react';
-import styles from './EventWarningManagement.less';
-
-const EventWarningManagement = () => {
-    return (
-        <div className={styles.container}>
-            <div className={styles.content}>
-                <h2>事件预警管理</h2>
-                {/* 这里可以添加具体的内容 */}
-            </div>
-        </div>
-    );
-};
-
-export default EventWarningManagement;
-

src/pages/business_emergencyAccident/components/EventWarningManagement.less

@@ -1,12 +0,0 @@
-.container {
-    width: 100%;
-    height: 100%;
-    padding: 20px;
-    
-    .content {
-        background-color: #fff;
-        padding: 20px;
-        border-radius: 8px;
-    }
-}
-

src/pages/business_emergencyDuty/components/DutyLog.less

@@ -16,7 +16,7 @@
         background: url('@/assets/business_Emergency/bgDrill2.svg') no-repeat center center;
         background-size: 100% 100%;
         border-radius: 2px;
-        padding: 1 6px;
+        padding: 16px;
 
         .statCard {
             flex: 1;
@@ -24,6 +24,7 @@
             background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(208, 225, 255, 0.6) 100%);
             border-radius: 2px;
             border: 2px solid #FFFFFF;
+            // padding: 20px;
             margin: 0px 20px 0px 5px ;
             display: flex;
             align-items: center;

src/pages/nav_system_content/SystemContentList.js

@@ -16,7 +16,6 @@ import menuicon1 from '@/assets/img/menuicon1.svg'
 import menuicon2 from '@/assets/img/menuicon2.svg'
 import menuicon3 from '@/assets/img/menuicon3.svg'
 import menuicon4 from '@/assets/img/menuicon4.svg'
-import menuicon5 from '@/assets/img/menuicon5.svg'
 
 import book from '@/assets/img/book.svg'
 import danger from '@/assets/img/danger.svg'
@@ -127,13 +126,13 @@ const SystemContentList = (props) => {
                 "key": "/topnavbar00/business/emergencyDuty",
                 "label": "应急值班值守"
             },
-            // 事故接警单
+            // // 事故接警单
-            {
+            // {
-                "path": "/topnavbar00/business/emergencyAccident",
+            //     "path": "/topnavbar00/business/emergencyAccident",
-                icon: <img src={menuicon5} alt="事故接警单" style={{ width: '16px', height: '16px' }} />,
+            //     icon: <img src={menuicon1} alt="事故接警单" style={{ width: '16px', height: '16px' }} />,
-                "key": "/topnavbar00/business/emergencyAccident",
+            //     "key": "/topnavbar00/business/emergencyAccident",
-                "label": "事故接警单"
+            //     "label": "事故接警单"
-            },
+            // },
         ]
         setMenuItems(fixedMenuItems)
         // 初始化默认路由