You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

63 lines
2.2 KiB
JavaScript

import React, { useState } from 'react';
import styles from './ComplianceManagement.less';
import PermitManagement from './secondary_menu/PermitManagement'; // 排污许可
import RegulationCompliance from './secondary_menu/RegulationCompliance'; // 法规符合性
import SupervisionInspection from './secondary_menu/SupervisionInspection'; // 监督检查
import InformationDisclosure from './secondary_menu/InformationDisclosure'; // 信息公开及绿色通道
const ComplianceManagement = () => {
const [activeMenu, setActiveMenu] = useState('permit');
const menuItems = [
{ key: 'permit', label: '排污许可' },
{ key: 'regulation', label: '法规符合性' },
{ key: 'inspection', label: '监督检查' },
{ key: 'disclosure', label: '信息公开及绿色通道' }
];
const handleMenuClick = (key) => {
setActiveMenu(key);
};
const renderContent = () => {
switch (activeMenu) {
case 'permit':
return <PermitManagement />;
case 'regulation':
return <RegulationCompliance />;
case 'inspection':
return <SupervisionInspection />;
case 'disclosure':
return <InformationDisclosure />;
default:
return <PermitManagement />;
}
};
return (
<div className={styles.container}>
{/* 左侧菜单 */}
<div className={styles.leftMenu}>
{menuItems.map(item => (
<div
key={item.key}
className={`${styles.menuItem} ${activeMenu === item.key ? styles.active : ''}`}
onClick={() => handleMenuClick(item.key)}
>
{activeMenu === item.key && <div className={styles.activeIndicator}></div>}
<span className={styles.menuText}>{item.label}</span>
</div>
))}
</div>
{/* 右侧内容区 */}
<div className={styles.rightContent}>
{renderContent()}
</div>
</div>
);
};
export default ComplianceManagement;