import React, { useState } from 'react';
import { Card, Row, Col, Statistic, Progress, Button, Space } from 'antd';
import styles from './basic.less';
import Nyfl from './components/nyfl';
import Fgpsdsz from './components/fgpsdsz';
import Jgfx from './components/jgfx';
import Bmzstx from './components/bmzstx';
import Nhtjcs from './components/nhtjcs';



const SafeMajorHazardList = () => {
    const [activeModule, setActiveModule] = useState('nyfl');

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


    const renderModule = () => {
        switch (activeModule) {
            case 'nyfl':
                return <Nyfl />;
            case 'fgpsdsz':
                return <Fgpsdsz />;
            case 'jgtx':
                return <Jgfx />;
            case 'bmzstx':
                return <Bmzstx />;
            case 'nhtjcs':
                return <Nhtjcs />;
            default:
                return <Nyfl />;
        }
    };


    return (
        <div className={styles.container}>
            <div className={styles.TopButton}>
                <Button 
                    className={`${styles.TopButtonItem} ${activeModule === "nyfl" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("nyfl")}
                >能源分类
                </Button>
                <Button 
                    className={`${styles.TopButtonItem} ${activeModule === "fgpsdsz" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("fgpsdsz")}
                >峰谷平时段设置
                </Button>
                <Button 
                    className={`${styles.TopButtonItem} ${activeModule === "jgtx" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("jgtx")}
                >价格体系
                </Button>
                <Button 
                    className={`${styles.TopButtonItem} ${activeModule === "bmzstx" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("bmzstx")}
                >标煤折算体系
                </Button>
                <Button 
                    className={`${styles.TopButtonItem} ${activeModule === "nhtjcs" ? styles.active : ""}`}
                    onClick={() => handleModuleClick("nhtjcs")}
                >能耗统计参数
                </Button>
            </div>
            <div className={styles.content}>
                {renderModule()}
            </div>
        </div>
    );
};

export default SafeMajorHazardList;
