diff --git a/src/assets/business_envinformation/stipulation1.svg b/src/assets/business_envinformation/stipulation1.svg new file mode 100644 index 0000000..6554c85 --- /dev/null +++ b/src/assets/business_envinformation/stipulation1.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/pages/business_envInformation/module/ComplianceManagement.less b/src/pages/business_envInformation/module/ComplianceManagement.less index 9c2da55..b58637a 100644 --- a/src/pages/business_envInformation/module/ComplianceManagement.less +++ b/src/pages/business_envInformation/module/ComplianceManagement.less @@ -66,7 +66,7 @@ // 右侧内容区 .rightContent { flex: 1; - background-color: #FFFFFF; + // background-color: #FFFFFF; border-radius: 4px; // padding: 20px; overflow: auto; diff --git a/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.js b/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.js index c6666b7..e7dbecb 100644 --- a/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.js +++ b/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.js @@ -1,6 +1,7 @@ -import React, { useState } from 'react'; -import { Form, Input, Button, DatePicker } from 'antd'; +import React from 'react'; +import { Form, Input, Button, DatePicker, Select } from 'antd'; import styles from './RegulationCompliance.less'; +import stipulation1 from '@/assets/business_envinformation/stipulation1.svg'; const RegulationCompliance = () => { const [form] = Form.useForm(); @@ -15,6 +16,7 @@ const RegulationCompliance = () => { // TODO: 重置搜索 }; + return (
{/* 第一块：搜索表单 */} @@ -46,9 +48,405 @@ const RegulationCompliance = () => {
- {/* 第二块：表格区域（待开发） */} + {/* 第二块：表格区域 */}
-
待开发
+
+ {/* 法规合规管理块1 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-24 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块2 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-25 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块3 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-26 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块4 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-27 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块5 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-28 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块6 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-29 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块7 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-30 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块8 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-08-31 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块9 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-09-01 +
+
+ 发布部门    环保部门名称9 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块10 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-09-02 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块11 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-09-03 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+ + {/* 法规合规管理块12 */} +
+ {/* 第一行：法规名称 */} +
+ 法规图标 + 2025排污许可条例 +
+ + {/* 第二行：发布时间和发布部门 */} +
+
+ 发布时间    2025-09-04 +
+
+ 发布部门    环保部门名称 +
+
+ + {/* 第三行：操作按钮 */} +
+
+ + + +
+
+ + + +
+
+
+
); diff --git a/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.less b/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.less index 4df4009..d7a35ca 100644 --- a/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.less +++ b/src/pages/business_envInformation/module/secondary_menu/RegulationCompliance.less @@ -1,17 +1,18 @@ .regulationContainer { width: 100%; height: 100%; - background-color: #fff; + display: flex; flex-direction: column; .searchSection { padding: 20px; + background-color: #fff; :global { .ant-form-inline { display: flex; - + .ant-form-item { margin-right: 16px; margin-bottom: 0; @@ -28,7 +29,7 @@ .ant-form-item-label { font-weight: 500; - + label { color: #666666; font-size: 13px; @@ -48,14 +49,93 @@ display: flex; flex-direction: column; overflow: hidden; - padding: 0 20px 20px; - align-items: center; - justify-content: center; + padding: 20px; + + .blocksContainer { + display: grid; + grid-template-columns: repeat(4, 1fr); + grid-template-rows: repeat(3, 1fr); + gap: 20px; + margin-bottom: 20px; + } + + .regulationBlock { + background-color: #fff; + // border: 1px solid #EEEEEE; + border-radius: 2px; + // padding: 8px 16px; + display: flex; + flex-direction: column; + justify-content: space-between; + min-height: 120px; + } + + + .regulationTitle { + font-size: 14px; + font-weight: 500; + color: #333333; + padding: 8px 16px; + border: 1px solid #EEEEEE; + border-bottom: none; + margin-bottom: 0; + display: flex; + align-items: center; + } + + .regulationInfo { + flex: 1; + display: flex; + flex-direction: column; + justify-content: center; + padding-left: 15px; + border: 1px solid #EEEEEE; + border-bottom: none; + margin-bottom: 0; + } - .developingTip { - font-size: 24px; - color: #999999; + .publishDate { + font-size: 12px; + color: #666666; font-weight: 400; + margin-bottom: 6px; + } + + .publishDepartment { + font-size: 12px; + color: #666666; + font-weight: 400; + + } + + .actionButtons { + display: flex; + + justify-content: center; + gap: 8px; + width: 100%; + // margin-bottom: 0; + border: 1px solid #EEEEEE; + border-bottom: none; + // padding-top: 4px; + } + + .actionButton { + width: calc(50% - 4px); + height: 24px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + border-radius: 2px; + transition: background-color 0.2s; + + &:hover { + background-color: #f5f5f5; + } + } + + } -} +} \ No newline at end of file