import React, { useState } from 'react';
import { Card, Row, Col, Statistic, Progress, Button, Space } from 'antd';
import styles from './EnvInformation.less';
import ComplianceManagement from './components/ComplianceManagement'; //合规性管理
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 SafeMajorHazardList = () => {
    const [activeModule, setActiveModule] = useState('organization');

    const handleModuleClick = (module) => {
        setActiveModule(module)
    }


    const renderModule = () => {
        switch (activeModule) {
            case 'organization':
                return <ComplianceManagement />;
            case 'equipment':
                return <OnlineMonitoring />;
            case 'firefighting':
                return <EnvironmentalPersonnelManagement />;
            case 'other':
                return <EvaluationReport />;
            case 'equipmentManagement':
                return <EquipmentManagement />;
            case 'pollutionSource':
                return <PollutionSourceManagement />;
            default:
                return <ComplianceManagement />;
        }
    };


    return (
        <div className={styles.container}>
            <div className={styles.TopButton}>
                <Button
                    className={`${styles.TopButtonItem} ${activeModule === "organization" ? styles.active : ""}`}
                    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 === "pollutionSource" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("pollutionSource")}
                >污染源管理
                </Button>
            </div>
            <div className={styles.content}>
                {renderModule()}
            </div>
        </div>
    );
};

export default SafeMajorHazardList;
