环保设备
wangyunfei
2 weeks ago
parent
f24ad5e7f5
commit
9880ef1c57
@ -0,0 +1,3 @@
|
||||
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.2663 17.1003L17.0663 11.3003C17.2996 11.067 17.1329 10.6337 16.7996 10.6337H13.6663C13.4329 10.6337 13.2663 10.467 13.2663 10.2337V2.06699C13.2663 1.83367 13.0996 1.66699 12.8663 1.66699H9.16627C8.93295 1.66699 8.76627 1.83367 8.76627 2.06699V10.2337C8.76627 10.467 8.59961 10.6337 8.36627 10.6337H5.23295C4.86627 10.6337 4.69961 11.067 4.96627 11.3003L10.7329 17.1003C10.8663 17.2337 11.1329 17.2337 11.2663 17.1003ZM3.09961 20.3337H18.8996C19.2663 20.3337 19.5996 20.0337 19.5996 19.6337C19.5996 19.267 19.2996 18.9337 18.8996 18.9337H3.06627C2.69961 18.9337 2.36627 19.2337 2.36627 19.6337C2.39961 20.0337 2.69961 20.3337 3.09961 20.3337Z" fill="#A4A4A4"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 776 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 205 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 202 KiB |
@ -1,26 +1,159 @@
|
||||
.container {
|
||||
.dischargePermitManagement {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
.tabContainer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 15px;
|
||||
padding: 0 ;
|
||||
// border-bottom: 1px solid #e8e8e8;
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
color: #333;
|
||||
margin-bottom: 16px;
|
||||
font-weight: 500;
|
||||
.tabButtons {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
background-color: #F4F4F4;
|
||||
border-radius: 4px;
|
||||
padding: 4px 8px;
|
||||
align-items: center;
|
||||
|
||||
.tabButton {
|
||||
padding: 8px 20px;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
transition: all 0.3s ease;
|
||||
height: auto;
|
||||
line-height: 1.4;
|
||||
|
||||
&:hover {
|
||||
color: #1890ff;
|
||||
background-color: rgba(24, 144, 255, 0.1);
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: #03C598;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filterSection {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
border-radius: 4px;
|
||||
|
||||
.filterLabel {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.filterSelect {
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.filterInput {
|
||||
min-width: 200px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.queryBtn {
|
||||
background-color: #00D48A;
|
||||
border-color: #00D48A;
|
||||
border-radius: 4px;
|
||||
|
||||
&:hover {
|
||||
background-color: #389e0d;
|
||||
border-color: #389e0d;
|
||||
}
|
||||
}
|
||||
|
||||
.resetBtn, .uploadBtn {
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
border-color: #d9d9d9;
|
||||
border-radius: 4px;
|
||||
|
||||
|
||||
&:hover {
|
||||
border-color: #1890ff;
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tableContent {
|
||||
width: 100%;
|
||||
|
||||
// 覆盖表头样式
|
||||
:global {
|
||||
.ant-table-thead > tr > th {
|
||||
font-weight: 400 !important;
|
||||
font-size: 14px !important;
|
||||
color: #333 !important;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.ant-table-tbody > tr > td {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ant-table-wrapper {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.attachmentLink {
|
||||
color: #1890ff;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.actionButtons {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.downloadIcon, .deleteIcon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.1);
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
.downloadIcon {
|
||||
&:hover {
|
||||
filter: brightness(1.2);
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
margin: 0;
|
||||
.deleteIcon {
|
||||
&:hover {
|
||||
filter: brightness(1.2) saturate(1.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,26 +1,105 @@
|
||||
.container {
|
||||
.environmentalTaskListContainer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
height: 72vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.environmentalTaskListContent {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
color: #333;
|
||||
margin-bottom: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
margin: 0;
|
||||
}
|
||||
padding: 0px 20px;
|
||||
}
|
||||
|
||||
.environmentalTaskListText {
|
||||
max-width: 800px;
|
||||
text-align: left;
|
||||
line-height: 1.6;
|
||||
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
color: #333;
|
||||
margin-bottom: 20px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
margin-bottom: 15px;
|
||||
text-indent: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.environmentalTaskListPagination {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
background: #fff;
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
// box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.paginationInfo {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.paginationControls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.pageSizeSelect {
|
||||
padding: 4px 8px;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.pageNumbers {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.pageButton, .pageNumber {
|
||||
padding: 4px 8px;
|
||||
border: 1px solid #d9d9d9;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
min-width: 32px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
border-color: #1890ff;
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
|
||||
.pageNumber.active {
|
||||
background: #1890ff;
|
||||
color: #fff;
|
||||
border-color: #1890ff;
|
||||
}
|
||||
|
||||
.pageEllipsis {
|
||||
padding: 4px 8px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
@ -0,0 +1,18 @@
|
||||
import React from 'react';
|
||||
import { Button } from 'antd';
|
||||
import styles from './ProtectionFacilityMaintenance.less';
|
||||
|
||||
const ProtectionFacilityMaintenance = () => {
|
||||
return (
|
||||
<div className={styles.protectionFacilityMaintenance}>
|
||||
<div className={styles.content}>
|
||||
<Button type="primary" className={styles.button}>防护设施检维修管理</Button>
|
||||
<div className={styles.status}>
|
||||
待开发
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProtectionFacilityMaintenance;
|
||||
@ -0,0 +1,49 @@
|
||||
.protectionFacilityMaintenance {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
.placeholder {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 300px;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.status {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,802 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Form, Input, Button, DatePicker, Space, Modal, Select } from 'antd';
|
||||
import { SearchOutlined, RedoOutlined, CloseOutlined, EyeOutlined, DeleteOutlined, PlusOutlined, UploadOutlined, EditOutlined, DownloadOutlined } from '@ant-design/icons';
|
||||
import StandardTable from '@/components/StandardTable';
|
||||
import styles from './WasteGasPollutionControl.less';
|
||||
import licence1 from '@/assets/business_envinformation/image1.svg';
|
||||
import licence2 from '@/assets/business_envinformation/image2.svg';
|
||||
import viewicon from '@/assets/business_envinformation/viewicon.svg';
|
||||
import editicon from '@/assets/business_envinformation/editicon.svg';
|
||||
import downloadicon from '@/assets/business_envinformation/downloadicon.svg';
|
||||
import deleteicon from '@/assets/business_envinformation/deleteicon.svg';
|
||||
|
||||
const WasteGasPollutionControl = () => {
|
||||
const [form] = Form.useForm();
|
||||
const [isModalVisible, setIsModalVisible] = useState(false);
|
||||
const [currentImage, setCurrentImage] = useState(null);
|
||||
const [pagination, setPagination] = useState({
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
total: 12,
|
||||
});
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
||||
const [dataSource, setDataSource] = useState([
|
||||
{
|
||||
key: 1,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
recordTime: '2025-09-02',
|
||||
recorder: '王嘉琪',
|
||||
reviewer: '赵子能',
|
||||
facilityName: '复方水杨酸甲酯乳膏(曼秀雷敦)',
|
||||
code: '65.177.48.116',
|
||||
equipmentModel: '3D8d4ffa-bD7e-AffF-ED68-839DAFe74c27',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '14:10',
|
||||
endRunTime: '03:06',
|
||||
isNormal: '异常',
|
||||
pollutantFlueGasVolume: '2',
|
||||
pollutantFactor: '烟尘2',
|
||||
treatmentEfficiency: '93.81',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '59.12',
|
||||
pressure: '95',
|
||||
emissionTime: '100',
|
||||
powerConsumption: '34',
|
||||
byproductName: '二氧化碳',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-08-24 05:16',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
recordTime: '2025-09-06',
|
||||
recorder: '王嘉琪',
|
||||
reviewer: '郑清予',
|
||||
facilityName: '口炎清颗粒(大神)',
|
||||
code: '111.161.135.125',
|
||||
equipmentModel: '19b89E82-ae94-6bF7-2355-8DBC2d6a6009',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '12:26',
|
||||
endRunTime: '03:26',
|
||||
isNormal: '异常',
|
||||
pollutantFlueGasVolume: '2',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '91.40',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '59.95',
|
||||
pressure: '90',
|
||||
emissionTime: '95',
|
||||
powerConsumption: '55',
|
||||
byproductName: '二氧化碳',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-08-30 18:34',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 7,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 8,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 9,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 10,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 11,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
{
|
||||
key: 12,
|
||||
recordTime: '2025-08-29',
|
||||
recorder: '赵喜行',
|
||||
reviewer: '郑叶飞',
|
||||
facilityName: '塞隆风湿酒(同仁堂)',
|
||||
code: '35.236.217.212',
|
||||
equipmentModel: '6Ddb888D-3d7A-305E-3372-109F7154Ad3A',
|
||||
parameterName: '重量',
|
||||
designValue: '2',
|
||||
unit: 't',
|
||||
startRunTime: '00:46',
|
||||
endRunTime: '03:55',
|
||||
isNormal: '正常',
|
||||
pollutantFlueGasVolume: '1',
|
||||
pollutantFactor: '烟尘',
|
||||
treatmentEfficiency: '95.32',
|
||||
dataSource: '实时采集',
|
||||
exhaustStackHeight: '2',
|
||||
exhaustTemperature: '50.48',
|
||||
pressure: '100',
|
||||
emissionTime: '115',
|
||||
powerConsumption: '39',
|
||||
byproductName: '氮气',
|
||||
byproductProduction: '2',
|
||||
reagentName: '乳酸钠葡萄糖',
|
||||
reagentAdditionTime: '2025-09-01 07:53',
|
||||
reagentAdditionAmount: '2',
|
||||
},
|
||||
]);
|
||||
|
||||
const getCurrentPageData = () => {
|
||||
const { current, pageSize } = pagination;
|
||||
const start = (current - 1) * pageSize;
|
||||
const end = start + pageSize;
|
||||
return dataSource.slice(start, end);
|
||||
};
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: (
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={selectedRowKeys.length === getCurrentPageData().length && getCurrentPageData().length > 0}
|
||||
onChange={(e) => handleSelectAll(e.target.checked)}
|
||||
/>
|
||||
),
|
||||
key: 'selection',
|
||||
width: 60,
|
||||
align: 'center',
|
||||
fixed: 'left',
|
||||
render: (_, record) => (
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={selectedRowKeys.includes(record.key)}
|
||||
onChange={(e) => {
|
||||
if (e.target.checked) {
|
||||
setSelectedRowKeys([...selectedRowKeys, record.key]);
|
||||
} else {
|
||||
setSelectedRowKeys(selectedRowKeys.filter(key => key !== record.key));
|
||||
}
|
||||
}}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '记录时间',
|
||||
dataIndex: 'recordTime',
|
||||
key: 'recordTime',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '记录人',
|
||||
dataIndex: 'recorder',
|
||||
key: 'recorder',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '审核人',
|
||||
dataIndex: 'reviewer',
|
||||
key: 'reviewer',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '设施名称',
|
||||
dataIndex: 'facilityName',
|
||||
key: 'facilityName',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '编码',
|
||||
dataIndex: 'code',
|
||||
key: 'code',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '设备型号',
|
||||
dataIndex: 'equipmentModel',
|
||||
key: 'equipmentModel',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '参数名称',
|
||||
dataIndex: 'parameterName',
|
||||
key: 'parameterName',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '设计值',
|
||||
dataIndex: 'designValue',
|
||||
key: 'designValue',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'unit',
|
||||
key: 'unit',
|
||||
width: 80,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '开始运行时间',
|
||||
dataIndex: 'startRunTime',
|
||||
key: 'startRunTime',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '结束运行时间',
|
||||
dataIndex: 'endRunTime',
|
||||
key: 'endRunTime',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '是否正常',
|
||||
dataIndex: 'isNormal',
|
||||
key: 'isNormal',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
render: (text) => (
|
||||
<span style={{
|
||||
color: text === '异常' ? '#ff4d4f' : '#52c41a',
|
||||
backgroundColor: text === '异常' ? '#FFF1F0' : '#F6FFED',
|
||||
border: text === '异常' ? '1px solid #FFA39E' : '1px solid #B7EB8F',
|
||||
padding: '2px 8px',
|
||||
borderRadius: '4px',
|
||||
display: 'inline-block'
|
||||
}}>
|
||||
{text}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '污染物烟气量(m³/h)',
|
||||
dataIndex: 'pollutantFlueGasVolume',
|
||||
key: 'pollutantFlueGasVolume',
|
||||
width: 150,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '污染因子',
|
||||
dataIndex: 'pollutantFactor',
|
||||
key: 'pollutantFactor',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '治理效率(%)',
|
||||
dataIndex: 'treatmentEfficiency',
|
||||
key: 'treatmentEfficiency',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '数据来源',
|
||||
dataIndex: 'dataSource',
|
||||
key: 'dataSource',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '排气筒高度(m)',
|
||||
dataIndex: 'exhaustStackHeight',
|
||||
key: 'exhaustStackHeight',
|
||||
width: 130,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '排气温度(℃)',
|
||||
dataIndex: 'exhaustTemperature',
|
||||
key: 'exhaustTemperature',
|
||||
width: 130,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '压力(kpa)',
|
||||
dataIndex: 'pressure',
|
||||
key: 'pressure',
|
||||
width: 100,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '排放时间(h)',
|
||||
dataIndex: 'emissionTime',
|
||||
key: 'emissionTime',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '耗电量(kWh)',
|
||||
dataIndex: 'powerConsumption',
|
||||
key: 'powerConsumption',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '副产物名称',
|
||||
dataIndex: 'byproductName',
|
||||
key: 'byproductName',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '副产物产生量(t)',
|
||||
dataIndex: 'byproductProduction',
|
||||
key: 'byproductProduction',
|
||||
width: 140,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '药剂名称',
|
||||
dataIndex: 'reagentName',
|
||||
key: 'reagentName',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '药剂添加时间',
|
||||
dataIndex: 'reagentAdditionTime',
|
||||
key: 'reagentAdditionTime',
|
||||
width: 150,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '药剂添加量(t)',
|
||||
dataIndex: 'reagentAdditionAmount',
|
||||
key: 'reagentAdditionAmount',
|
||||
width: 140,
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
width: 140,
|
||||
align: 'center',
|
||||
fixed: 'right',
|
||||
render: (_, record) => (
|
||||
<Space size={13}>
|
||||
<img
|
||||
src={viewicon}
|
||||
alt="查看"
|
||||
style={{ width: 16, height: 16, cursor: 'pointer' }}
|
||||
onClick={() => handleView(record)}
|
||||
/>
|
||||
<img
|
||||
src={editicon}
|
||||
alt="编辑"
|
||||
style={{ width: 16, height: 16, cursor: 'pointer' }}
|
||||
onClick={() => handleEdit(record)}
|
||||
/>
|
||||
<img
|
||||
src={downloadicon}
|
||||
alt="下载"
|
||||
style={{ width: 16, height: 16, cursor: 'pointer' }}
|
||||
onClick={() => handleDownload(record)}
|
||||
/>
|
||||
<img
|
||||
src={deleteicon}
|
||||
alt="删除"
|
||||
style={{ width: 16, height: 16, cursor: 'pointer' }}
|
||||
onClick={() => handleDelete(record)}
|
||||
/>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
const handleSearch = (values) => {
|
||||
console.log('搜索参数:', values);
|
||||
// TODO: 实现搜索功能
|
||||
};
|
||||
|
||||
const handleReset = () => {
|
||||
form.resetFields();
|
||||
// TODO: 重置搜索
|
||||
};
|
||||
|
||||
const handleView = (record) => {
|
||||
console.log('查看:', record);
|
||||
// TODO: 实现查看功能
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
console.log('编辑:', record);
|
||||
// TODO: 实现编辑功能
|
||||
};
|
||||
|
||||
const handleDownload = (record) => {
|
||||
console.log('下载:', record);
|
||||
// TODO: 实现下载功能
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
console.log('删除:', record);
|
||||
// TODO: 实现删除功能
|
||||
};
|
||||
|
||||
const handleAdd = () => {
|
||||
console.log('新增');
|
||||
// TODO: 实现新增功能
|
||||
};
|
||||
|
||||
const handleImport = () => {
|
||||
console.log('导入');
|
||||
// TODO: 实现导入功能
|
||||
};
|
||||
|
||||
const handleQuery = () => {
|
||||
console.log('查询');
|
||||
// TODO: 实现查询功能
|
||||
};
|
||||
|
||||
const handleTableChange = (pagination) => {
|
||||
setPagination(pagination);
|
||||
};
|
||||
|
||||
// 全选功能
|
||||
const handleSelectAll = (checked) => {
|
||||
if (checked) {
|
||||
const allKeys = getCurrentPageData().map(item => item.key);
|
||||
setSelectedRowKeys(allKeys);
|
||||
} else {
|
||||
setSelectedRowKeys([]);
|
||||
}
|
||||
};
|
||||
|
||||
// 批量操作
|
||||
const handleBatchOperation = (operation) => {
|
||||
console.log(`批量${operation}:`, selectedRowKeys);
|
||||
// TODO: 实现批量操作功能
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={styles.wasteGasContainer}>
|
||||
{/* 第一块：操作按钮和筛选条件 */}
|
||||
<div className={styles.searchSection}>
|
||||
<div className={styles.leftButtons}>
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<PlusOutlined />}
|
||||
onClick={handleAdd}
|
||||
className={styles.addButton}
|
||||
>
|
||||
新增
|
||||
</Button>
|
||||
<Button
|
||||
// icon={<UploadOutlined />}
|
||||
onClick={handleImport}
|
||||
className={styles.importButton}
|
||||
>
|
||||
上传
|
||||
</Button>
|
||||
<Button
|
||||
// icon={<UploadOutlined />}
|
||||
onClick={() => handleBatchOperation('下载')}
|
||||
className={styles.importButton}
|
||||
disabled={selectedRowKeys.length === 0}
|
||||
>
|
||||
批量下载
|
||||
</Button>
|
||||
{/* <Button
|
||||
onClick={() => handleBatchOperation('删除')}
|
||||
className={styles.importButton}
|
||||
disabled={selectedRowKeys.length === 0}
|
||||
>
|
||||
批量删除
|
||||
</Button> */}
|
||||
</div>
|
||||
|
||||
<div className={styles.rightControls}>
|
||||
<span className={styles.filterLabel}>筛选条件</span>
|
||||
<Select
|
||||
placeholder="请选择"
|
||||
style={{ width: 140, height: 28 }}
|
||||
allowClear
|
||||
className={styles.selectInput}
|
||||
/>
|
||||
|
||||
<Input
|
||||
placeholder="请输入"
|
||||
style={{ width: 160, height: 28 }}
|
||||
/>
|
||||
<Button
|
||||
onClick={handleQuery}
|
||||
className={styles.queryButton}
|
||||
>
|
||||
查询
|
||||
</Button>
|
||||
<Button
|
||||
onClick={handleReset}
|
||||
className={styles.resetButton}
|
||||
>
|
||||
重置
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 第二块：表格 */}
|
||||
<div className={styles.tableSection}>
|
||||
<StandardTable
|
||||
columns={columns}
|
||||
data={{
|
||||
list: getCurrentPageData(),
|
||||
pagination: {
|
||||
...pagination,
|
||||
total: dataSource.length,
|
||||
showTotal: (total) => `共 ${total} 条`,
|
||||
showSizeChanger: false,
|
||||
}
|
||||
}}
|
||||
onChange={handleTableChange}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 图片弹窗 */}
|
||||
<Modal
|
||||
open={isModalVisible}
|
||||
onCancel={() => setIsModalVisible(false)}
|
||||
footer={null}
|
||||
closeIcon={<CloseOutlined style={{ color: '#fff', fontSize: 20 }} />}
|
||||
width="auto"
|
||||
centered
|
||||
styles={{
|
||||
mask: { backgroundColor: '#10101080' },
|
||||
content: { padding: 0, background: 'transparent', boxShadow: 'none' }
|
||||
}}
|
||||
>
|
||||
{currentImage && <img src={currentImage} alt="许可证" style={{ width: '100%', display: 'block' }} />}
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default WasteGasPollutionControl;
|
||||
@ -0,0 +1,238 @@
|
||||
.wasteGasContainer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
// padding: 20px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.searchSection {
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.leftButtons {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
|
||||
.addButton {
|
||||
background-color: #52c41a;
|
||||
border-color: #52c41a;
|
||||
color: white;
|
||||
height: 32px;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
|
||||
&:hover {
|
||||
background-color: #73d13d;
|
||||
border-color: #73d13d;
|
||||
}
|
||||
}
|
||||
|
||||
.importButton {
|
||||
background-color: white;
|
||||
border-color: #d9d9d9;
|
||||
color: #333;
|
||||
height: 32px;
|
||||
border-radius: 4px;
|
||||
|
||||
&:hover {
|
||||
border-color: #40a9ff;
|
||||
color: #40a9ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rightControls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
|
||||
.filterLabel {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.queryButton {
|
||||
background-color: #52c41a;
|
||||
border-color: #52c41a;
|
||||
color: white;
|
||||
height: 28px;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
background-color: #73d13d;
|
||||
border-color: #73d13d;
|
||||
}
|
||||
}
|
||||
|
||||
.selectInput {
|
||||
:global {
|
||||
.ant-select-selector {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 28px !important;
|
||||
}
|
||||
|
||||
.ant-select-selection-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.ant-select-selection-placeholder {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tableSection {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
padding: 0 20px 0;
|
||||
|
||||
// 添加水平滚动条
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
min-width: 0; // 确保可以收缩
|
||||
|
||||
|
||||
:global {
|
||||
.ant-spin-nested-loading {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.ant-spin-container {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.ant-table-wrapper {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-x: auto; // 添加水平滚动
|
||||
|
||||
.ant-table {
|
||||
flex: 1;
|
||||
overflow: visible; // 改为visible让滚动条显示
|
||||
margin: 0;
|
||||
min-width: 3000px; // 增加最小宽度确保所有列都能显示
|
||||
|
||||
.ant-table-container {
|
||||
overflow-x: auto;
|
||||
min-width: 3000px;
|
||||
}
|
||||
|
||||
.ant-table-content {
|
||||
overflow-x: auto;
|
||||
min-width: 3000px;
|
||||
}
|
||||
|
||||
.ant-table-body {
|
||||
overflow-x: auto;
|
||||
min-width: 3000px;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-table-pagination {
|
||||
flex-shrink: 0;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ant-table {
|
||||
font-size: 12px;
|
||||
|
||||
.ant-table-thead > tr > th {
|
||||
background-color: #fafafa;
|
||||
font-weight: 400;
|
||||
color: #000000D9;
|
||||
border-right: none;
|
||||
text-align: center;
|
||||
white-space: nowrap; // 防止换行
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.ant-table-tbody > tr > td {
|
||||
border-right: none;
|
||||
color: #000000D9;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
white-space: nowrap; // 防止换行
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.ant-table-tbody > tr:hover > td {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
// 固定列样式
|
||||
.ant-table-thead > tr > th.ant-table-cell-fix-left,
|
||||
.ant-table-tbody > tr > td.ant-table-cell-fix-left {
|
||||
background-color: #fafafa;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ant-table-thead > tr > th.ant-table-cell-fix-right,
|
||||
.ant-table-tbody > tr > td.ant-table-cell-fix-right {
|
||||
background-color: #fafafa;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
// 固定列阴影效果
|
||||
.ant-table-cell-fix-left {
|
||||
box-shadow: 0px 0 4px 0px #00000040;
|
||||
}
|
||||
|
||||
.ant-table-cell-fix-right {
|
||||
box-shadow: 0px 0 4px 0px #00000040;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #1890ff;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: #40a9ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ant-pagination {
|
||||
text-align: right;
|
||||
margin-top: 25px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,18 @@
|
||||
import React from 'react';
|
||||
import { Button } from 'antd';
|
||||
import styles from './WastewaterFacilityManagement.less';
|
||||
|
||||
const WastewaterFacilityManagement = () => {
|
||||
return (
|
||||
<div className={styles.wastewaterFacilityManagement}>
|
||||
<div className={styles.content}>
|
||||
<Button type="primary" className={styles.button}>废水设置运行管理</Button>
|
||||
<div className={styles.status}>
|
||||
待开发
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default WastewaterFacilityManagement;
|
||||
@ -0,0 +1,49 @@
|
||||
.wastewaterFacilityManagement {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
.placeholder {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 300px;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.status {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue