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.
59 lines
1.8 KiB
JavaScript
59 lines
1.8 KiB
JavaScript
import React, { useState } from 'react';
|
|
import { Tabs } from 'antd';
|
|
import styles from './EquipmentManagement.less';
|
|
|
|
// 导入子页面组件
|
|
import WasteGasPollutionControl from './secondary_menu/WasteGasPollutionControl';
|
|
import WastewaterFacilityManagement from './secondary_menu/WastewaterFacilityManagement';
|
|
import ProtectionFacilityMaintenance from './secondary_menu/ProtectionFacilityMaintenance';
|
|
|
|
const EquipmentManagement = () => {
|
|
const [activeTab, setActiveTab] = useState('waste-gas-control');
|
|
|
|
// 标签页配置
|
|
const tabItems = [
|
|
{
|
|
key: 'waste-gas-control',
|
|
label: '废气污染防治信息',
|
|
children: <WasteGasPollutionControl />
|
|
},
|
|
{
|
|
key: 'wastewater-facility',
|
|
label: '废水设置运行管理',
|
|
children: <WastewaterFacilityManagement />
|
|
},
|
|
{
|
|
key: 'protection-facility',
|
|
label: '防护设施检维修管理',
|
|
children: <ProtectionFacilityMaintenance />
|
|
}
|
|
];
|
|
|
|
// 标签页切换处理
|
|
const handleTabChange = (key) => {
|
|
setActiveTab(key);
|
|
};
|
|
|
|
return (
|
|
<div className={styles.container}>
|
|
<Tabs
|
|
activeKey={activeTab}
|
|
onChange={handleTabChange}
|
|
items={tabItems}
|
|
className={styles.tabs}
|
|
style={{
|
|
'--ant-tabs-tab-color': '#AFAFAF',
|
|
'--ant-tabs-tab-active-color': '#009D6F',
|
|
'--ant-tabs-tab-active-bg': '#fff'
|
|
}}
|
|
tabBarStyle={{
|
|
'--ant-tabs-tab-active-color': '#009D6F'
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default EquipmentManagement;
|
|
|