diff --git a/public/assets/bar/shuikudd1.png b/public/assets/bar/shuikudd1.png
new file mode 100644
index 0000000..d00043f
Binary files /dev/null and b/public/assets/bar/shuikudd1.png differ
diff --git a/public/assets/bar/shuikudd2.png b/public/assets/bar/shuikudd2.png
new file mode 100644
index 0000000..5a24ad9
Binary files /dev/null and b/public/assets/bar/shuikudd2.png differ
diff --git a/public/assets/bar/xiayouxh1.png b/public/assets/bar/xiayouxh1.png
new file mode 100644
index 0000000..7eab856
Binary files /dev/null and b/public/assets/bar/xiayouxh1.png differ
diff --git a/public/assets/bar/xiayouxh2.png b/public/assets/bar/xiayouxh2.png
new file mode 100644
index 0000000..bf42d7a
Binary files /dev/null and b/public/assets/bar/xiayouxh2.png differ
diff --git a/public/assets/calendar.png b/public/assets/calendar.png
new file mode 100644
index 0000000..e309940
Binary files /dev/null and b/public/assets/calendar.png differ
diff --git a/public/assets/right-arrow.png b/public/assets/right-arrow.png
new file mode 100644
index 0000000..b626a60
Binary files /dev/null and b/public/assets/right-arrow.png differ
diff --git a/public/assets/yybg.png b/public/assets/yybg.png
new file mode 100644
index 0000000..56f25db
Binary files /dev/null and b/public/assets/yybg.png differ
diff --git a/public/mapbox/sprite@2x.json b/public/mapbox/sprite@2x.json
index 2f581bd..f3d22ff 100644
--- a/public/mapbox/sprite@2x.json
+++ b/public/mapbox/sprite@2x.json
@@ -271,6 +271,14 @@
"pixelRatio": 1,
"visible": true
},
+ "流量站": {
+ "width": 32,
+ "height": 32,
+ "x": 160,
+ "y": 32,
+ "pixelRatio": 1,
+ "visible": true
+ },
"泵站": {
"width": 32,
"height": 32,
diff --git a/public/mapbox/sprite@2x.png b/public/mapbox/sprite@2x.png
index 96e20c7..7ab99c7 100644
Binary files a/public/mapbox/sprite@2x.png and b/public/mapbox/sprite@2x.png differ
diff --git a/src/models/map/index.js b/src/models/map/index.js
index 03a8d15..3880c50 100644
--- a/src/models/map/index.js
+++ b/src/models/map/index.js
@@ -614,6 +614,7 @@ const map = {
if (id != 504) {
dispatch.runtime.setYyfa({})
+ dispatch.runtime.setXiayouxh(false)
}
if (
diff --git a/src/models/map/layout.js b/src/models/map/layout.js
index cc3f0f6..7c253bd 100644
--- a/src/models/map/layout.js
+++ b/src/models/map/layout.js
@@ -87,8 +87,10 @@ export default function calcLayout(view, rightStack, hidePanels) {
} else if (view === 203) {
left = [
{ key: '天气' },
- { key: '关联站点',style: { height: '15rem', flexGrow: 1 } },
- { key: '水库水量统计',style: { height: '22rem' } },
+ { key: '关联站点', style: { height: '23rem', flexGrow: 1 } },
+ { key: '白蚁监测', style: { height: '17rem', flexGrow: 1 } },
+ { key: '视频监视', style: { height: '20rem', flexGrow: 1 } },
+
// { key: '安全监测', style: { height: '20rem', flexGrow: 1 } },
];
leftFullHeight = true;
@@ -311,9 +313,8 @@ export default function calcLayout(view, rightStack, hidePanels) {
];
} else if (view === 203) {
right = [
- { key: '白蚁监测', style: { height: '20rem', flexGrow: 1 } },
- { key: '视频监视', style: { height: '20rem', flexGrow: 1 } },
- { key: '监测告警', style: { height: '20rem', flexGrow: 1 } },
+ { key: '水库水量统计',style: { height: '34rem',flexGrow: 1 } },
+ { key: '监测告警', style: { height: '15rem', flexGrow: 1 } },
];
rightFullHeight=true
} else if (view === 204) {
@@ -322,10 +323,11 @@ export default function calcLayout(view, rightStack, hidePanels) {
];
} else if (view === 205) {
right = [
- { key: '水库预案', style: { height: '30%', flexGrow: 1 } },
- { key: '调度结果', style: { height: '70%', flexGrow: 1 } },
- { key: '方案对比', style: { height: '30%', flexGrow: 1 } },
+ { key: '水库预案', style: { height: '10rem', } },
+ { key: '调度结果', style: { height: '10rem', } },
+ { key: '方案对比', style: { height: '10rem', } },
];
+ rightFullHeight=true
} else if (view === 206) {
right = [
{ key: '巡查问题看板', style: { height: '70%', flexGrow: 1 } },
diff --git a/src/models/runtime/index.js b/src/models/runtime/index.js
index 05dc587..0af6647 100644
--- a/src/models/runtime/index.js
+++ b/src/models/runtime/index.js
@@ -14,6 +14,7 @@ function initState() {
layerSetting: {
},
yyObj: {},
+ xiayouxh:undefined,
yuananType:'sh',
duibifxNum:[],
shkshObj:undefined,
@@ -71,6 +72,9 @@ const runtime = {
setYuananType(state, props) {
return { ...state, yuananType: props }
},
+ setXiayouxh(state, props) {
+ return { ...state, xiayouxh: props }
+ },
setYyfa(state, props) {
return { ...state, yyObj: props }
},
diff --git a/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js b/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js
new file mode 100644
index 0000000..377a344
--- /dev/null
+++ b/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js
@@ -0,0 +1,304 @@
+import React, { useState, useEffect } from 'react';
+import ReactECharts from 'echarts-for-react';
+import { makeStyles } from '@material-ui/core/styles';
+import { Dialog, DialogContent, TextField, Button } from '@material-ui/core';
+import { legend } from 'echarts/lib/theme/dark';
+
+const useStyles = makeStyles({
+ root: {
+ backgroundColor: 'transparent',
+ padding: 20,
+ },
+ chart: {
+ height: 100,
+ marginBottom: 20,
+ },
+ dialog: {
+ '& .MuiDialog-paper': {
+ backgroundColor: '#1a1b1f',
+ color: '#fff',
+ },
+ },
+ input: {
+ '& .MuiInputBase-input': {
+ color: '#fff',
+ },
+ '& .MuiInputLabel-root': {
+ color: '#4a90e2',
+ },
+ '& .MuiOutlinedInput-root': {
+ '& fieldset': {
+ borderColor: '#4a90e2',
+ },
+ },
+ },
+ button: {
+ backgroundColor: '#4a90e2',
+ color: '#fff',
+ '&:hover': {
+ backgroundColor: '#357abd',
+ },
+ },
+});
+
+const ScheduleCharts = () => {
+ const classes = useStyles();
+ const [flowDialogOpen, setFlowDialogOpen] = useState(false);
+ const [levelDialogOpen, setLevelDialogOpen] = useState(false);
+ const [flowValue, setFlowValue] = useState('');
+ const [levelValue, setLevelValue] = useState('');
+ const [chartData, setChartData] = useState(null);
+
+ // 生成测试数据
+ useEffect(() => {
+ const generateData = () => {
+ const timePoints = [];
+ const openingData = [];
+ const inflowData = [];
+ const outflowData = [];
+ const levelData = [];
+
+ for (let i = 0; i < 96; i++) { // 24小时,每15分钟一个点
+ const time = new Date('2025-05-18');
+ time.setMinutes(time.getMinutes() + i * 15);
+ const timeStr = time.toLocaleTimeString('zh-CN', { hour12: false });
+ timePoints.push(timeStr);
+
+ // 模拟数据
+ openingData.push(i < 32 ? 1.5 : i < 80 ? 2 : 1.2);
+ inflowData.push(Math.sin(i / 10) * 300 + 400);
+ outflowData.push(Math.max(0, Math.sin((i - 10) / 10) * 100 + 150));
+ levelData.push(Math.min(68.04, 40 + Math.sin(i / 30) * 10 + 20));
+ }
+
+ return { timePoints, openingData, inflowData, outflowData, levelData };
+ };
+
+ setChartData(generateData());
+ }, []);
+
+ const handleFlowConfirm = () => {
+ // 这里处理流量修改逻辑
+ setFlowDialogOpen(false);
+ };
+
+ const handleLevelConfirm = () => {
+ // 这里处理水位修改逻辑
+ setLevelDialogOpen(false);
+ };
+
+ const handleChartEvents = {
+ click: (params) => {
+ if (params.componentType === 'markPoint') {
+ if (params.seriesIndex === 1) {
+ setFlowDialogOpen(true);
+ } else{
+ setLevelDialogOpen(true);
+ }
+ }
+ }
+};
+
+ const getOpeningOption = () => ({
+ grid: { top: 30, right: 20, bottom: 30, left: 50 },
+ tooltip: { trigger: 'axis' },
+ legend: {
+ data: ['开度'],
+ textStyle: { color: '#fff' },
+ top: 0
+ },
+ xAxis: {
+ type: 'category',
+ data: chartData?.timePoints,
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ },
+ yAxis: {
+ type: 'value',
+ name: '开度 m',
+ nameTextStyle: { color: '#fff' },
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ splitLine: { lineStyle: { color: '#2a2b2f' } },
+ },
+ series: [{
+ name: '开度',
+ data: chartData?.openingData?.map(item => item.toFixed(2)),
+ type: 'line',
+ smooth: true,
+ symbol:'none',
+ lineStyle: { color: '#4a90e2' },
+ areaStyle: { color: '#4a90e2', opacity: 0.1 },
+ itemStyle: { color: '#4a90e2' },
+ }],
+ });
+
+ const getFlowOption = () => ({
+ grid: { top: 30, right: 20, bottom: 30, left: 50 },
+ tooltip: { trigger: 'axis' },
+ legend: {
+ data: ['入库流量', '出库流量'],
+ textStyle: { color: '#fff' },
+ top: 0
+ },
+ xAxis: {
+ type: 'category',
+ data: chartData?.timePoints,
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ },
+ yAxis: {
+ type: 'value',
+ name: '流量 m³/s',
+ nameTextStyle: { color: '#fff' },
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ splitLine: { lineStyle: { color: '#2a2b2f' } },
+ },
+ series: [
+ {
+ name: '入库流量',
+ data: chartData?.inflowData?.map(item => item.toFixed(2)),
+ type: 'line',
+ symbol:'none',
+ smooth: true,
+ lineStyle: { color: '#ffd700' },
+ areaStyle: { color: '#ffd700', opacity: 0.1 },
+ itemStyle: { color: '#ffd700' },
+ },
+ {
+ name: '出库流量',
+ data: chartData?.outflowData?.map(item => item.toFixed(2)),
+ type: 'line',
+ symbol:'none',
+ smooth: true,
+ lineStyle: { color: '#4a90e2' },
+ areaStyle: { color: '#4a90e2', opacity: 0.1 },
+ itemStyle: { color: '#4a90e2' },
+ markPoint: {
+ data: [{ type: 'max', name: '最大值' }],
+ itemStyle: { color: '#4a90e2' },
+ label: { color: '#fff' },
+ symbolSize: 40,
+ onClick: () => { setFlowDialogOpen(true); console.log(1111111111111);
+ },
+ },
+ },
+ ],
+ });
+
+ const getLevelOption = () => ({
+ grid: { top: 30, right: 20, bottom: 30, left: 50 },
+ tooltip: { trigger: 'axis' },
+ legend: {
+ data: ['水位', '校核洪水位'],
+ textStyle: { color: '#fff' },
+ top: 0
+ },
+ xAxis: {
+ type: 'category',
+ data: chartData?.timePoints,
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ },
+ yAxis: {
+ type: 'value',
+ name: '水位 m',
+ nameTextStyle: { color: '#fff' },
+ axisLine: { lineStyle: { color: '#4a90e2' } },
+ axisLabel: { color: '#fff' },
+ splitLine: { lineStyle: { color: '#2a2b2f' } },
+ },
+ series: [{
+ name: '水位',
+ data: chartData?.levelData?.map(item => item.toFixed(2)),
+ type: 'line',
+ symbol:'none',
+ smooth: true,
+ lineStyle: { color: '#4a90e2' },
+ areaStyle: { color: '#4a90e2', opacity: 0.1 },
+ itemStyle: { color: '#4a90e2' },
+ markPoint: {
+ data: [{ type: 'max', name: '最高水位' }],
+ itemStyle: { color: '#4a90e2' },
+ label: { color: '#fff' },
+ symbolSize: 40,
+ onClick: () => setLevelDialogOpen(true),
+ },
+ markLine: {
+ silent: true,
+ lineStyle: { color: '#ff4d4f' },
+ data: [{ yAxis: 68.04, name: '校核洪水位' }],
+ label: { color: '#fff' },
+ },
+ }],
+ });
+
+ if (!chartData) return null;
+
+ return (
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ScheduleCharts;
\ No newline at end of file
diff --git a/src/views/Home/InfoDlg/EditFaDlg/index.js b/src/views/Home/InfoDlg/EditFaDlg/index.js
new file mode 100644
index 0000000..2031fea
--- /dev/null
+++ b/src/views/Home/InfoDlg/EditFaDlg/index.js
@@ -0,0 +1,41 @@
+import React from 'react';
+import DpTab from '../../../../layouts/mui/DpTab';
+import Dialog from '@material-ui/core/Dialog';
+import DialogContent from '@material-ui/core/DialogContent';
+import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
+import DpTabs from '../../../../layouts/mui/DpTabs';
+import DpAppBar from '../../../../layouts/mui/DpAppBar';
+import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
+import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
+import { Typography,Button } from '@material-ui/core';
+import ScheduleCharts from './ScheduleCharts'
+import { useDispatch, useSelector } from 'react-redux';
+
+function HDStDlg({ record, onClose }) {
+ const [value, setValue] = React.useState(0);
+ const dispatch = useDispatch();
+
+ return (
+
+ )
+}
+
+export default React.memo(HDStDlg);
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.js b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.js
new file mode 100644
index 0000000..6ead672
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.js
@@ -0,0 +1,239 @@
+import React, { useState } from 'react';
+import { Card, Row, Col, Table, Tag, Form, Input, DatePicker, Tabs } from 'antd';
+import './index.less';
+import moment from 'moment';
+import ModalView from './view'
+const TaskInspectionDetail = () => {
+ const [form] = Form.useForm();
+ const [activeTab, setActiveTab] = useState('dam');
+ const [visible, setVisible] = useState(false)
+
+ // 表单初始值
+ const initialValues = {
+ taskTitle: '06-02浮桥河日常巡查',
+ taskType: '日常巡查',
+ taskContent: '20250602每日巡检任务',
+ startTime: moment('2025-06-02 00:00:00'),
+ endTime: moment('2025-06-08 23:59:59'),
+ receiveTime: moment('2025-06-02 09:07:31'),
+ completeTime: moment('2025-06-02 09:08:05'),
+ inspector: '姜兴军',
+ taskStatus: '已完成'
+ };
+
+ // 巡查类别数据
+ const categories = [
+ { key: 'dam', label: '大坝', count: 0 },
+ { key: 'spillway', label: '溢洪道', count: 0 },
+ { key: 'waterPipe', label: '输水管', count: 0 },
+ { key: 'facilities', label: '管理设施', count: 0 },
+ { key: 'valve', label: '阀门与启闭机', count: 0 },
+ { key: 'others', label: '其他情况', count: 0 }
+ ];
+
+ const detailModal = (row) => {
+ setVisible(true)
+ }
+ // 表格列定义
+ const columns = [
+ {
+ title: '序号',
+ dataIndex: 'index',
+ key: 'index',
+ width: 80
+ },
+ {
+ title: '巡查项',
+ dataIndex: 'item',
+ key: 'item'
+ },
+ {
+ title: '巡查状态',
+ dataIndex: 'status',
+ key: 'status',
+ render: (status) => (
+ {status}
+ )
+ },
+ {
+ title: '问题描述',
+ dataIndex: 'description',
+ key: 'description'
+ },
+ {
+ title: '巡查图片',
+ dataIndex: 'images',
+ key: 'images'
+ },
+ {
+ title: '巡查视频',
+ dataIndex: 'videos',
+ key: 'videos'
+ },
+ {
+ title: '是否处理',
+ dataIndex: 'handled',
+ key: 'handled'
+ },
+ {
+ title: '处理人',
+ dataIndex: 'handler',
+ key: 'handler'
+ },
+ {
+ title: '操作',
+ key: 'action',
+ render: (v,r) => (
+ detailModal(r)}>详情
+ )
+ }
+ ];
+
+ // 表格数据
+ const tableData = [
+ {
+ key: '1',
+ index: 1,
+ item: '上游坝',
+ status: '正常',
+ handler: '姜兴军'
+ },
+ {
+ key: '2',
+ index: 2,
+ item: '下游坝',
+ status: '正常',
+ handler: '姜兴军'
+ }
+ ];
+
+ const handleTabChange = (key) => {
+ setActiveTab(key);
+ // 这里可以根据选中的tab加载对应的数据
+ };
+
+ return (
+
+ {/* 任务基本信息 */}
+
基本信息}>
+
+
+
+ {/* 巡查信息 */}
+
巡查信息}>
+
+ {categories.map(category => (
+
handleTabChange(category.key)}
+ >
+ {category.label}
+ ({category.count})
+
+ ))}
+
+
+
+ (异常项:0,正常项:13)
+
+
+
+
+
setVisible(false)}
+ >
+
+ );
+};
+
+export default TaskInspectionDetail;
\ No newline at end of file
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.less b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.less
new file mode 100644
index 0000000..b9e19f5
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/index.less
@@ -0,0 +1,140 @@
+.task-inspection-detail {
+ padding: 5px;
+ background-color: transparent;
+ min-height: 100vh;
+
+ .info-card {
+ margin-bottom: 24px;
+ background-color: transparent;
+ border: none;
+
+ .ant-card-body {
+ color: #fff;
+ }
+
+ .ant-form-item-label > label {
+ color: rgba(255, 255, 255, 0.85);
+ }
+
+ .ant-input,
+ .ant-picker {
+ background-color: rgba(255, 255, 255, 0.04);
+ border-color: rgba(255, 255, 255, 0.1);
+ color: rgba(255, 255, 255, 0.85);
+
+ &:hover,
+ &:focus {
+ border-color: #1890ff;
+ }
+ }
+
+ .ant-picker {
+ .ant-picker-input > input {
+ color: rgba(255, 255, 255, 0.85);
+ }
+
+ .ant-picker-suffix,
+ .ant-picker-separator {
+ color: rgba(255, 255, 255, 0.45);
+ }
+
+ .ant-picker-clear {
+ background: #1a1a27;
+ color: rgba(255, 255, 255, 0.45);
+ }
+ }
+
+ .ant-input-textarea {
+ .ant-input {
+ min-height: 80px;
+ }
+ }
+
+ .ant-picker-suffix {
+ color: rgba(255, 255, 255, 0.45);
+ }
+ }
+
+
+
+ .inspection-card {
+ background-color: transparent;
+ border: none;
+
+ .category-tabs {
+ display: flex;
+ margin-bottom: 16px;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+ padding-bottom: 16px;
+
+ .category-tab {
+ padding: 8px 16px;
+ cursor: pointer;
+ position: relative;
+ transition: all 0.3s;
+
+ &:hover {
+ color: #1890ff;
+ }
+
+ &.active {
+ color: #1890ff;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: -16px;
+ left: 0;
+ width: 100%;
+ height: 2px;
+ background-color: #1890ff;
+ }
+ }
+
+ .category-label {
+ color: rgba(255, 255, 255, 0.85);
+ }
+
+ .category-count {
+ margin-left: 4px;
+ color: rgba(255, 255, 255, 0.45);
+ }
+
+ &:hover .category-label,
+ &.active .category-label {
+ color: #1890ff;
+ }
+ }
+ }
+
+ .table-info {
+ margin-bottom: 16px;
+
+ .total-info {
+ color: rgba(255, 255, 255, 0.65);
+ }
+ }
+
+ .inspection-table {
+ .ant-table {
+ background-color: transparent;
+ color: #fff;
+
+ .ant-table-thead > tr > th {
+ background-color: rgba(255, 255, 255, 0.04);
+ color: rgba(255, 255, 255, 0.85);
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+ }
+
+ .ant-table-tbody > tr > td {
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+ color: rgba(255, 255, 255, 0.65);
+ }
+
+ .ant-table-tbody > tr:hover > td {
+ background-color: rgba(255, 255, 255, 0.08);
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/view.js b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/view.js
new file mode 100644
index 0000000..02116eb
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/TaskInspectionDetail/view.js
@@ -0,0 +1,46 @@
+import React from 'react';
+import DpTab from '../../../../../layouts/mui/DpTab';
+import Dialog from '@material-ui/core/Dialog';
+import DialogContent from '@material-ui/core/DialogContent';
+import DpPaperComponent from '../../../../../layouts/mui/DpPaperCompanent';
+import DpTabs from '../../../../../layouts/mui/DpTabs';
+import DpAppBar from '../../../../../layouts/mui/DpAppBar';
+import DpBackgroundDrop from '../../../../../layouts/mui/DpBackdrop';
+import DpCloseButton from '../../../../../layouts/mui/DpCloseButton';
+import { Grid } from '@material-ui/core';
+import DescriptionItem from '../../../components/DescrptionItem'
+function HDStDlg({ record, onClose,open }) {
+ const [value, setValue] = React.useState(0);
+
+ return (
+
+ )
+}
+
+export default React.memo(HDStDlg);
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/detail.js b/src/views/Home/InfoDlg/FlowjcDlg/detail.js
new file mode 100644
index 0000000..7588c82
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/detail.js
@@ -0,0 +1,492 @@
+import React, { useState, useEffect } from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import {
+ Paper,
+ Table,
+ TableBody,
+ TableCell,
+ TableContainer,
+ TableHead,
+ TableRow,
+ TextField,
+ Button,
+ Box,
+ IconButton,
+ ButtonGroup,
+ Grid,
+ Select,
+ MenuItem
+} from '@material-ui/core';
+import SearchIcon from '@material-ui/icons/Search';
+import RefreshIcon from '@material-ui/icons/Refresh';
+import { DatePicker } from 'antd';
+import moment from 'moment';
+import { useDispatch, useSelector } from 'react-redux';
+import ModalView from './view'
+import ReactECharts from 'echarts-for-react';
+import { color } from 'echarts/lib/theme/light';
+
+const { RangePicker } = DatePicker;
+
+const useStyles = makeStyles((theme) => ({
+ root: {
+ width: '100%',
+ backgroundColor: 'transparent',
+ color: '#fff'
+ },
+ toolbar: {
+ padding: theme.spacing(2),
+ display: 'flex',
+ gap: theme.spacing(2),
+ alignItems: 'center',
+ borderBottom: '1px solid rgba(255, 255, 255, 0.1)'
+ },
+ searchRow: {
+ display: 'flex',
+ gap: theme.spacing(2),
+ alignItems: 'center',
+ flexWrap: 'wrap'
+ },
+ searchField: {
+ '& .MuiInputBase-root': {
+ color: '#fff',
+ backgroundColor: 'rgba(255, 255, 255, 0.05)',
+ borderRadius: 4,
+ width: 200
+ },
+ '& .MuiInputLabel-root': {
+ color: '#fff'
+ },
+ '& .MuiOutlinedInput-notchedOutline': {
+ borderColor: 'rgba(255, 255, 255, 0.1)'
+ }
+ },
+ datePicker: {
+ '& .MuiInputBase-root': {
+ color: '#fff',
+ backgroundColor: 'rgba(255, 255, 255, 0.05)',
+ width: 200
+ },
+ '& .MuiIconButton-root': {
+ color: '#fff'
+ },
+ '& .MuiOutlinedInput-notchedOutline': {
+ borderColor: 'rgba(255, 255, 255, 0.1)'
+ }
+ },
+ buttonGroup: {
+ '& .MuiButton-root': {
+ color: '#fff',
+ borderColor: 'rgba(255, 255, 255, 0.3)',
+ '&.active': {
+ backgroundColor: '#2196f3',
+ borderColor: '#2196f3'
+ }
+ }
+ },
+ table: {
+ '& .MuiTableCell-head': {
+ backgroundColor: 'rgba(255, 255, 255, 0.05)',
+ color: '#fff',
+ fontWeight: 'bold',
+ borderBottom: '1px solid rgba(255, 255, 255, 0.1)'
+ },
+ '& .MuiTableCell-body': {
+ color: '#fff',
+ borderBottom: '1px solid rgba(255, 255, 255, 0.1)'
+ }
+ },
+ status: {
+ padding: '4px 8px',
+ borderRadius: 4,
+ backgroundColor: 'rgba(33, 150, 243, 0.1)',
+ color: '#2196f3'
+ },
+ actionButton: {
+ color: '#2196f3',
+ '&:hover': {
+ backgroundColor: 'rgba(33, 150, 243, 0.1)'
+ }
+ },
+ bodyCell: {
+ color: '#fff',
+ borderBottom: '1px solid rgba(255, 255, 255, 0.1)',
+ },
+ summaryRow: {
+ backgroundColor: 'transparent',
+ '& td': {
+ color: '#fff',
+ borderBottom: 'none',
+ },
+ },
+}));
+
+const TaskList = ({ tab = '生态' }) => {
+ const classes = useStyles();
+ const [startDate, setStartDate] = useState(null);
+ const dispatch = useDispatch();
+ const [endDate, setEndDate] = useState(null);
+ const [activeType, setActiveType] = useState('daily');
+ const [visible, setVisible] = useState(false)
+ const handleTypeChange = (type) => {
+ setActiveType(type);
+ };
+ const [dimension, setDimension] = useState('ft');
+
+ const columns = [
+ { id: 'sequence', label: '序号', width: 70 },
+ { id: 'city', label: '时间', with: 300 },
+ { id: 'district', label: '瞬时流量(m³/s)' },
+ ];
+
+ const mockData = [
+ {
+ sequence: 1,
+ city: '黄冈市',
+ district: '麻城市',
+ location: '',
+ taskType: '06-02浮桥河水库日常巡查',
+ taskContent: '20250602每日巡检',
+ status: '未完成',
+ person: '姜兴军',
+ startTime: '2025-06-02 00:00:00',
+ endTime: '2025-06-08 23:59:59',
+ problems: 0,
+ processed: 0,
+ createTime: '2025-06-02 02:00:00',
+ creator: ''
+ },
+ {
+ sequence: 2,
+ city: '黄冈市',
+ district: '麻城市',
+ location: '',
+ taskType: '06-02浮桥河水库汛前巡查',
+ taskContent: '20250602每日巡检',
+ status: '未完成',
+ person: '熊杰',
+ startTime: '2025-06-02 00:00:00',
+ endTime: '2025-06-08 23:59:59',
+ problems: 0,
+ processed: 0,
+ createTime: '2025-06-02 02:00:00',
+ creator: ''
+ },
+ {
+ sequence: 3,
+ city: '黄冈市',
+ district: '麻城市',
+ location: '',
+ taskType: '06-02浮桥河水库特别检查',
+ taskContent: '20250602每日巡检',
+ status: '未完成',
+ person: '白斌',
+ startTime: '2025-06-02 00:00:00',
+ endTime: '2025-06-08 23:59:59',
+ problems: 0,
+ processed: 0,
+ createTime: '2025-06-02 02:00:00',
+ creator: ''
+ },
+ {
+ sequence: 4,
+ city: '黄冈市',
+ district: '麻城市',
+ location: '',
+ taskType: '06-02浮桥河水库日常巡查',
+ taskContent: '20250602每日巡检',
+ status: '未完成',
+ person: '于静',
+ startTime: '2025-06-02 00:00:00',
+ endTime: '2025-06-08 23:59:59',
+ problems: 0,
+ processed: 0,
+ createTime: '2025-06-02 02:00:00',
+ creator: ''
+ }, {
+ sequence: 5,
+ city: '黄冈市',
+ district: '麻城市',
+ location: '',
+ taskType: '06-02浮桥河水库日常巡查',
+ taskContent: '20250602每日巡检',
+ status: '未完成',
+ person: '何义红',
+ startTime: '2025-06-02 00:00:00',
+ endTime: '2025-06-08 23:59:59',
+ problems: 0,
+ processed: 0,
+ createTime: '2025-06-02 02:00:00',
+ creator: ''
+ },
+ ];
+ const flyTo = (row) => {
+ // dispatch?.runtime.setInfoDlg({ layerId: 'ChaoshiDetailLayer', properties: {} })
+ if (row.sequence == 1) {
+ setVisible(true)
+
+ }
+ }
+ const [params, setParams] = useState({ tm: [] })
+
+ const searchTm = (e) => {
+ setParams({
+ ...params,
+ stm: e[0].format("YYYY-MM-DD HH:mm"),
+ etm: e[1].format("YYYY-MM-DD HH:mm"),
+ tm: e,
+ })
+ };
+ const [list, setList] = useState([])
+ const generateData = () => {
+ const data = [];
+ const startTime = moment();
+ for (let i = 0; i < 20; i++) { // 每10分钟一个点,10天共1440个点
+ const time = moment(startTime).add(i * 60 * 4, 'minutes').format('YYYY-MM-DD HH:mm');
+ // 生成0.2到0.4之间的随机数,保留3位小数
+ const value = +(Math.random() * (0.4 - 0.2) + 0.2).toFixed(3);
+ data.push([time, value]);
+ }
+ const res = data.map(item => ({ time: item[0], value: item[1] }))
+ setList(res)
+ };
+ useEffect(() => {
+ generateData()
+ }, [])
+
+ const stoption = {
+ tooltip: {
+ trigger: 'axis',
+ formatter: function (params) {
+ return `时间:${params[0].name}
流量:${params[0].value} m³/s`;
+ }
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ axisLabel: {
+ rotate: 45,
+ color: '#fff'
+ },
+ data: list.map(item => moment(item.time).format('HH:mm'))
+ },
+ yAxis: {
+ type: 'value',
+ name: '瞬时流量(m³/s)',
+ nameTextStyle: {
+ color: "#fff"
+ },
+ min: 0,
+ max: 0.6,
+ interval: 0.1,
+ axisLabel: {
+ color: '#fff'
+ },
+ },
+ series: [
+ {
+ name: '瞬时流量',
+ type: 'line',
+ smooth: true,
+ data: list.map(item => item.value),
+ markLine: {
+ silent: true,
+ symbol: 'none',
+ label: {
+ formatter: '{b}: {c}'
+ },
+ data: [
+ {
+ name: '日平均流量',
+ yAxis: 0.358,
+ lineStyle: {
+ color: '#FF4500'
+ },
+ label: {
+ position: 'end'
+ }
+ },
+ {
+ name: '生态流量目标',
+ yAxis: 0.32,
+ lineStyle: {
+ color: '#2E8B57'
+ },
+ label: {
+ position: 'end'
+ }
+ }
+ ]
+ }
+ }
+ ],
+ grid: {
+ left: '5%',
+ right: '16%',
+ bottom: '15%',
+ containLabel: true
+ }
+ };
+
+ const option = {
+ tooltip: {
+ trigger: 'axis',
+ formatter: function (params) {
+ return `时间:${params[0].name}
流量:${params[0].value} m³/s`;
+ }
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ axisLabel: {
+ rotate: 45,
+ color: '#fff'
+ },
+ data: list.map(item => moment(item.time).format('HH:mm'))
+ },
+ yAxis: {
+ type: 'value',
+ name: '瞬时流量(m³/s)',
+ nameTextStyle: {
+ color: "#fff"
+ },
+ min: 0,
+ max: 0.6,
+ interval: 0.1,
+ axisLabel: {
+ color: '#fff'
+ },
+ },
+ series: [
+ {
+ name: '瞬时流量',
+ type: 'line',
+ smooth: true,
+ data: list.map(item => item.value),
+ }
+ ],
+ grid: {
+ left: '5%',
+ right: '16%',
+ bottom: '15%',
+ containLabel: true
+ }
+ };
+
+ return (
+
+
+
+
+
+
+
+
时段选择:
+
+ trigger.parentElement}
+ />
+
+
+ }
+ >
+ 查询
+
+ }
+ >
+ 重置
+
+
+
+
+
+
+
+
+
+ {columns.map((column) => (
+
+ {column.label}
+
+ ))}
+
+
+
+ {list.map((row, index) => (
+
+ {index + 1}
+ {row.time}
+ {row.value}
+
+ ))}
+ {
+ tab == '生态' && <>
+
+
+ 日平均流量(m³/s)
+
+ 0.358
+
+ {/* 生态流量目标行 */}
+
+
+ 生态流量目标(m³/s)
+
+ 0.32
+
+ >
+ }
+
+
+
+
+
+ {
+ list.length > 0 &&
+ ;
+
+ }
+
+
+ );
+};
+
+export default TaskList;
\ No newline at end of file
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/index.js b/src/views/Home/InfoDlg/FlowjcDlg/index.js
new file mode 100644
index 0000000..598ad61
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/index.js
@@ -0,0 +1,41 @@
+import React from 'react';
+import DpTab from '../../../../layouts/mui/DpTab';
+import Dialog from '@material-ui/core/Dialog';
+import DialogContent from '@material-ui/core/DialogContent';
+import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
+import DpTabs from '../../../../layouts/mui/DpTabs';
+import DpAppBar from '../../../../layouts/mui/DpAppBar';
+import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
+import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
+import ContentDetail from './detail'
+import { Typography } from '@material-ui/core';
+function HDStDlg({ record, onClose }) {
+ const [value, setValue] = React.useState(0);
+
+ return (
+
+ )
+}
+
+export default React.memo(HDStDlg);
diff --git a/src/views/Home/InfoDlg/FlowjcDlg/view.js b/src/views/Home/InfoDlg/FlowjcDlg/view.js
new file mode 100644
index 0000000..05afc7b
--- /dev/null
+++ b/src/views/Home/InfoDlg/FlowjcDlg/view.js
@@ -0,0 +1,41 @@
+import React from 'react';
+import DpTab from '../../../../layouts/mui/DpTab';
+import Dialog from '@material-ui/core/Dialog';
+import DialogContent from '@material-ui/core/DialogContent';
+import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
+import DpTabs from '../../../../layouts/mui/DpTabs';
+import DpAppBar from '../../../../layouts/mui/DpAppBar';
+import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
+import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
+import TaskInspectionDetail from './TaskInspectionDetail'
+function HDStDlg({ record, onClose,open }) {
+ const [value, setValue] = React.useState(0);
+
+ return (
+
+ )
+}
+
+export default React.memo(HDStDlg);
diff --git a/src/views/Home/InfoDlg/YascDlg/index.js b/src/views/Home/InfoDlg/YascDlg/index.js
index 24c96c1..a2ce018 100644
--- a/src/views/Home/InfoDlg/YascDlg/index.js
+++ b/src/views/Home/InfoDlg/YascDlg/index.js
@@ -16,6 +16,7 @@ function HDStDlg({ record, onClose }) {
const loadFa = () => {
onClose()
dispatch.runtime.setYyfa({ yy: 111 })
+ dispatch.runtime.setXiayouxh(true)
}
return (
}else if (layerId === 'GwLayer') {
return
+ }else if (layerId === 'flowjcLayer') {
+ return
+ }else if (layerId === 'editFaLayer') {
+ return
}
diff --git a/src/views/Home/MapCtrl/index.js b/src/views/Home/MapCtrl/index.js
index 12b9f5a..a87f9e9 100644
--- a/src/views/Home/MapCtrl/index.js
+++ b/src/views/Home/MapCtrl/index.js
@@ -137,6 +137,7 @@ export default function MapCtrl({ initParams, onLoad }) {
if (feature.layer.id === '关联站点') {
const record = feature.properties
+ // debugger
if (record.cd_nm == 'GN1') {
dispatch?.runtime.setInfoDlg({ layerId: 'BxjcLayer', properties: record })
}else if (record.cd_nm == 'UPD1') {
@@ -149,7 +150,8 @@ export default function MapCtrl({ initParams, onLoad }) {
dispatch?.runtime.setInfoDlg({ layerId: 'RealSkLayer', properties: record })
} else if (record.type == 'sw') {
dispatch?.runtime.setFeaturePop({ layerId: 'RealHDPop', properties: record,coordinates: [record.lgtd, record.lttd] })
-
+ } else if (record.flow == 1) {
+ dispatch?.runtime.setInfoDlg({ layerId: 'flowjcLayer', properties: record })
}
// dispatch.runtime.setFeaturePop({ type: 'RealSkPop', properties: record, coordinates: [record.lgtd, record.lttd] });
}
diff --git a/src/views/Home/index.js b/src/views/Home/index.js
index 7c6386c..0f03df4 100644
--- a/src/views/Home/index.js
+++ b/src/views/Home/index.js
@@ -24,6 +24,7 @@ export default function Demo1() {
const wg = useSelector(s => s.runtime.shkshObj)
const showGw = useSelector(s => s.runtime.showGw)
const yuananType = useSelector(s => s.runtime.yuananType);
+ const xiayou = useSelector(s => s.runtime.xiayouxh);
console.log('wg', wg);
@@ -46,6 +47,9 @@ export default function Demo1() {
//
// >
}
+ {
+ xiayou &&
+ }
{/* {
isSc &&
diff --git a/src/views/Home/panels/GqWeatherForcast/WF.js b/src/views/Home/panels/GqWeatherForcast/WF.js
index e2e07cc..25bb332 100644
--- a/src/views/Home/panels/GqWeatherForcast/WF.js
+++ b/src/views/Home/panels/GqWeatherForcast/WF.js
@@ -50,13 +50,13 @@ function WF() {
const genWeatherContour24H = () => {
dispatch.runtime.setYyfa({})
-
+ dispatch.runtime.setXiayouxh(false)
dispatch.shyjview.showWeather24h();
}
const genWeatherContourRadar = () => {
dispatch.runtime.setYyfa({})
-
+ dispatch.runtime.setXiayouxh(false)
dispatch.shyjview.showWeatherRadar();
}
diff --git a/src/views/Home/panels/Jcgj/index.js b/src/views/Home/panels/Jcgj/index.js
index b287821..c7994d8 100644
--- a/src/views/Home/panels/Jcgj/index.js
+++ b/src/views/Home/panels/Jcgj/index.js
@@ -54,7 +54,7 @@ function HDReal({ style }) {
color="green"
extra={
- 2025-05-26~2025-06-02
+ {moment().subtract(6,'day').format('YYYY-MM-DD')}~{moment().format('YYYY-MM-DD')}
}
>
diff --git a/src/views/Home/panels/Jcgjz/index.js b/src/views/Home/panels/Jcgjz/index.js
index b287821..8c52d09 100644
--- a/src/views/Home/panels/Jcgjz/index.js
+++ b/src/views/Home/panels/Jcgjz/index.js
@@ -54,7 +54,7 @@ function HDReal({ style }) {
color="green"
extra={
- 2025-05-26~2025-06-02
+ {moment().subtract(6,'day').format('YYYY-MM-DD')}~{moment().format('YYYY-MM-DD')}
}
>
diff --git a/src/views/Home/panels/Sksltj/Calender/index.js b/src/views/Home/panels/Sksltj/Calender/index.js
new file mode 100644
index 0000000..b87a619
--- /dev/null
+++ b/src/views/Home/panels/Sksltj/Calender/index.js
@@ -0,0 +1,87 @@
+import React, { useState } from 'react';
+import moment from 'moment';
+import './index.less';
+
+const CustomCalendar = ({ markedDates = {} }) => {
+ const [currentDate, setCurrentDate] = useState(moment());
+
+ // 生成日历数据
+ const generateCalendarData = () => {
+ const firstDay = moment(currentDate).startOf('month');
+ const lastDay = moment(currentDate).endOf('month');
+ const startDay = moment(firstDay).startOf('week');
+ const endDay = moment(lastDay).endOf('week');
+
+ const calendar = [];
+ let week = [];
+
+ for (let day = moment(startDay); day.isSameOrBefore(endDay); day.add(1, 'day')) {
+ week.push({
+ date: moment(day),
+ isCurrentMonth: day.month() === currentDate.month(),
+ isToday: day.isSame(moment(), 'day'),
+ marks: markedDates[day.format('YYYY-MM-DD')] || []
+ });
+
+ if (week.length === 7) {
+ calendar.push(week);
+ week = [];
+ }
+ }
+
+ return calendar;
+ };
+
+ // 切换月份
+ const changeMonth = (offset) => {
+ setCurrentDate(moment(currentDate).add(offset, 'month'));
+ };
+
+ const weekDays = ['日', '一', '二', '三', '四', '五', '六'];
+ const calendar = generateCalendarData();
+ return (
+
+
+
+ {currentDate.format('YYYY年M月')}
+
+
+
+
+
+
+
+
+ {weekDays.map(day => (
+
{day}
+ ))}
+
+
+
+ {calendar.map((week, weekIndex) => (
+
+ {week.map(({ date, isCurrentMonth, isToday, marks }) => (
+
+ {date.date()}
+ {marks.map((mark, index) => (
+
+ ))}
+
+ ))}
+
+ ))}
+
+
+ );
+};
+
+export default CustomCalendar;
\ No newline at end of file
diff --git a/src/views/Home/panels/Sksltj/Calender/index.less b/src/views/Home/panels/Sksltj/Calender/index.less
new file mode 100644
index 0000000..1626caf
--- /dev/null
+++ b/src/views/Home/panels/Sksltj/Calender/index.less
@@ -0,0 +1,96 @@
+.calendar {
+ background-color: #34495e;
+ border-radius: 8px;
+ padding: 5px;
+ color: white;
+ transform: scale(0.8,0.9);
+}
+
+.header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 16px;
+}
+
+.currentMonth {
+ font-size: 18px;
+ font-weight: bold;
+}
+
+.navigation {
+ display: flex;
+ gap: 8px;
+
+ button {
+ background-color: #2c3e50;
+ border: none;
+ color: white;
+ padding: 8px 16px;
+ border-radius: 4px;
+ cursor: pointer;
+
+ &:hover {
+ background-color: #243342;
+ }
+ }
+}
+
+.weekDays {
+ display: grid;
+ grid-template-columns: repeat(7, 1fr);
+ text-align: center;
+ margin-bottom: 8px;
+}
+
+.weekDay {
+ padding: 8px;
+ font-weight: bold;
+}
+
+.days {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+}
+
+.week {
+ display: grid;
+ grid-template-columns: repeat(7, 1fr);
+ gap: 4px;
+}
+
+.day {
+ aspect-ratio: 1;
+ background-color: #2c3e50;
+ border-radius: 4px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding: 4px;
+ position: relative;
+
+ &.otherMonth {
+ opacity: 0.5;
+ }
+
+ &.today {
+ background-color: #3498db;
+ }
+}
+
+.dayNumber {
+ font-size: 14px;
+ margin-bottom: 4px;
+}
+
+.mark {
+ width: 6px;
+ height: 6px;
+ border-radius: 50%;
+ margin: 1px;
+
+ &:first-child {
+ margin-top: auto;
+ }
+}
\ No newline at end of file
diff --git a/src/views/Home/panels/Sksltj/barCgart.js b/src/views/Home/panels/Sksltj/barCgart.js
new file mode 100644
index 0000000..ba92e12
--- /dev/null
+++ b/src/views/Home/panels/Sksltj/barCgart.js
@@ -0,0 +1,106 @@
+import React from 'react';
+import ReactECharts from 'echarts-for-react';
+import { makeStyles } from '@material-ui/core/styles';
+
+const useStyles = makeStyles({
+ chart: {
+ height: 100,
+ backgroundColor: 'transparent'
+ }
+});
+
+const WaterSupplyChart = ({type}) => {
+ const classes = useStyles();
+
+ // 生成近7天的日期
+ const getDates = () => {
+ const dates = [];
+ for (let i = 6; i >= 0; i--) {
+ const date = new Date();
+ date.setDate(date.getDate() - i);
+ dates.push(date.toLocaleDateString('zh-CN', { month: '2-digit', day: '2-digit' }));
+ }
+ return dates;
+ };
+
+ const option = {
+ backgroundColor: 'transparent',
+ grid: {
+ left: '5%',
+ right: '5%',
+ top: '20%',
+ bottom: '1%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'category',
+ data: getDates(),
+ axisLine: {
+ lineStyle: { color: '#fff' }
+ },
+ axisLabel: {
+ color: '#fff',
+ fontSize: 12
+ }
+ },
+ yAxis: {
+ type: 'value',
+ name: 'm³',
+ nameTextStyle: {
+ color: '#fff',
+ fontSize: 12
+ },
+ axisLine: {
+ show: true,
+ lineStyle: { color: '#fff' }
+ },
+ axisLabel: {
+ color: '#fff',
+ fontSize: 12
+ },
+ splitLine: {
+ lineStyle: {
+ color: 'rgba(255, 255, 255, 0.1)',
+ type: 'dashed'
+ }
+ },
+ min: 0,
+ max: 3000,
+ interval: 1000
+ },
+ tooltip: {
+ trigger: 'axis',
+ backgroundColor: 'rgba(0, 0, 0, 0.7)',
+ borderColor: '#4a90e2',
+ textStyle: {
+ color: '#fff'
+ }
+ },
+ series: [{
+ name:'供水量',
+ data: type == 1 ? [1800, 1700, 1900, 1800, 1800, 2200, 2200]: [900, 1900, 1200, 2600, 1000, 2100, 2300], // 示例数据
+ type: 'bar',
+ barWidth: '40%',
+ itemStyle: {
+ color: '#4a90e2'
+ },
+ label: {
+ show: false,
+ position: 'top',
+ color: '#fff',
+ formatter: '{c} m³'
+ }
+ }]
+ };
+
+ return (
+
+ );
+};
+
+export default WaterSupplyChart;
\ No newline at end of file
diff --git a/src/views/Home/panels/Sksltj/index.js b/src/views/Home/panels/Sksltj/index.js
index bcf0bc9..b521d65 100644
--- a/src/views/Home/panels/Sksltj/index.js
+++ b/src/views/Home/panels/Sksltj/index.js
@@ -1,15 +1,20 @@
import React, { useMemo, useState } from 'react';
-import { Switch, FormControlLabel,InputLabel, Select, MenuItem,FormControl } from '@material-ui/core/index'
+import { Switch, FormControlLabel, InputLabel, Select, MenuItem, FormControl } from '@material-ui/core/index'
import PanelBox from '../../components/PanelBox';
import config from '../../../../config';
import { useDispatch, useSelector } from 'react-redux';
import AreaDrpChart from './chart';
import clsx from 'clsx';
-
-
+import './index.less'
+import moment from 'moment/moment';
+import CustomCalendar from './Calender'
+import WaterSupplyChart from './barCgart'
+import { parseGeoJSON } from "../../../../utils/tools";
function DrpReal({ style }) {
- const [tab,setTab] = useState('生态')
+ const [tab, setTab] = useState('生态')
+ const [dimension, setDimension] = useState('ft');
+
const dispatch = useDispatch();
const data = [
{
@@ -44,202 +49,466 @@ function DrpReal({ style }) {
"rzWarning": 0,
"rzState": 1,
"aRz": -4.18
- },{
- "stcd": "61612610",
- "type": "sk",
- "hasRz": true,
- "stnm": "三河口水库",
- "adcd": "421181109000",
- "wscd": null,
- "importancy": 0,
- "lgtd": 115.166667,
- "lttd": 31.333333,
- "elev": 0,
- "damel": 156.8,
- "dsflz": 154.99,
- "fsltdz": 149,
- "ddz": 124,
- "zcxsw": 149,
- "drpTm": "2025-06-03T02:00:00.000Z",
- "today": 0,
- "h1": 0,
- "h3": 0,
- "h6": 0,
- "h12": 0,
- "h24": 0,
- "h48": 12.5,
- "drpState": 1,
- "rz": 141.45,
- "w": 77.8,
- "a_fsltdz": -7.550000000000011,
- "rzTm": "2025-06-03T01:00:00.000Z",
- "rzWarning": 0,
- "rzState": 1,
- "aRz": -7.55
- },{
- "stcd": "61613010",
- "type": "sk",
- "hasRz": true,
- "stnm": "明山水库",
- "adcd": "421181103000",
- "wscd": null,
- "importancy": 0,
- "lgtd": 115.066667,
- "lttd": 31.016667,
- "elev": 0,
- "damel": 98.7,
- "dsflz": 96.07,
- "fsltdz": 93,
- "ddz": 78.02,
- "zcxsw": 93,
- "drpTm": "2025-06-03T02:00:00.000Z",
- "today": 0,
- "h1": 0,
- "h3": 0,
- "h6": 0,
- "h12": 0,
- "h24": 0,
- "h48": 12.5,
- "drpState": 1,
- "rz": 84.43,
- "w": 49.5,
- "a_fsltdz": -8.569999999999993,
- "rzTm": "2025-06-03T02:00:00.000Z",
- "rzWarning": 0,
- "rzState": 1,
- "aRz": -8.57
- },{
- "stcd": "716113901",
- "type": "sk",
- "hasRz": true,
- "stnm": "铺头坳水库",
- "adcd": "421181201000",
- "wscd": null,
- "importancy": 0,
- "lgtd": 115.169444,
- "lttd": 31.090278,
- "elev": 0,
- "damel": 266.7,
- "dsflz": 265.54,
- "fsltdz": 264.3,
- "ddz": 256,
- "zcxsw": 264.3,
- "drpTm": "2025-04-11T05:00:00.000Z",
- "today": 0,
- "h1": 0,
- "h3": 0,
- "h6": 0,
- "h12": 0,
- "h24": 0,
- "h48": 0,
- "drpState": 2,
- "rz": 263.16,
- "w": 0.991,
- "a_fsltdz": -1.1399999999999864,
- "rzTm": "2025-04-11T05:00:00.000Z",
- "rzWarning": 0,
- "rzState": 2,
- "pic": [
+ }, {
+ "stcd": "61612610",
+ "type": "sk",
+ "hasRz": true,
+ "stnm": "三河口水库",
+ "adcd": "421181109000",
+ "wscd": null,
+ "importancy": 0,
+ "lgtd": 115.166667,
+ "lttd": 31.333333,
+ "elev": 0,
+ "damel": 156.8,
+ "dsflz": 154.99,
+ "fsltdz": 149,
+ "ddz": 124,
+ "zcxsw": 149,
+ "drpTm": "2025-06-03T02:00:00.000Z",
+ "today": 0,
+ "h1": 0,
+ "h3": 0,
+ "h6": 0,
+ "h12": 0,
+ "h24": 0,
+ "h48": 12.5,
+ "drpState": 1,
+ "rz": 141.45,
+ "w": 77.8,
+ "a_fsltdz": -7.550000000000011,
+ "rzTm": "2025-06-03T01:00:00.000Z",
+ "rzWarning": 0,
+ "rzState": 1,
+ "aRz": -7.55
+ }, {
+ "stcd": "61613010",
+ "type": "sk",
+ "hasRz": true,
+ "stnm": "明山水库",
+ "adcd": "421181103000",
+ "wscd": null,
+ "importancy": 0,
+ "lgtd": 115.066667,
+ "lttd": 31.016667,
+ "elev": 0,
+ "damel": 98.7,
+ "dsflz": 96.07,
+ "fsltdz": 93,
+ "ddz": 78.02,
+ "zcxsw": 93,
+ "drpTm": "2025-06-03T02:00:00.000Z",
+ "today": 0,
+ "h1": 0,
+ "h3": 0,
+ "h6": 0,
+ "h12": 0,
+ "h24": 0,
+ "h48": 12.5,
+ "drpState": 1,
+ "rz": 84.43,
+ "w": 49.5,
+ "a_fsltdz": -8.569999999999993,
+ "rzTm": "2025-06-03T02:00:00.000Z",
+ "rzWarning": 0,
+ "rzState": 1,
+ "aRz": -8.57
+ }, {
+ "stcd": "716113901",
+ "type": "sk",
+ "hasRz": true,
+ "stnm": "铺头坳水库",
+ "adcd": "421181201000",
+ "wscd": null,
+ "importancy": 0,
+ "lgtd": 115.169444,
+ "lttd": 31.090278,
+ "elev": 0,
+ "damel": 266.7,
+ "dsflz": 265.54,
+ "fsltdz": 264.3,
+ "ddz": 256,
+ "zcxsw": 264.3,
+ "drpTm": "2025-04-11T05:00:00.000Z",
+ "today": 0,
+ "h1": 0,
+ "h3": 0,
+ "h6": 0,
+ "h12": 0,
+ "h24": 0,
+ "h48": 0,
+ "drpState": 2,
+ "rz": 263.16,
+ "w": 0.991,
+ "a_fsltdz": -1.1399999999999864,
+ "rzTm": "2025-04-11T05:00:00.000Z",
+ "rzWarning": 0,
+ "rzState": 2,
+ "pic": [
{
- "stcd": "716113901",
- "tm": "2023-03-12T08:02:00.000Z",
- "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716113901/20230312160200.jpg"
+ "stcd": "716113901",
+ "tm": "2023-03-12T08:02:00.000Z",
+ "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716113901/20230312160200.jpg"
},
{
- "stcd": "716113901",
- "tm": "2023-03-12T07:15:00.000Z",
- "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716113902/20230312151500.jpg"
+ "stcd": "716113901",
+ "tm": "2023-03-12T07:15:00.000Z",
+ "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716113902/20230312151500.jpg"
}
- ],
- "aRz": -1.14
- },{
- "stcd": "716111701",
- "type": "sk",
- "hasRz": true,
- "stnm": "桐枧冲水库",
- "adcd": "421181110000",
- "wscd": null,
- "importancy": 0,
- "lgtd": 115.135278,
- "lttd": 31.3925,
- "elev": 0,
- "damel": 276.56,
- "dsflz": 273.66,
- "fsltdz": 269.86,
- "ddz": 256.76,
- "zcxsw": 269.86,
- "drpTm": "2025-04-11T05:00:00.000Z",
- "today": 0,
- "h1": 0,
- "h3": 0,
- "h6": 0,
- "h12": 0,
- "h24": 0,
- "h48": 0,
- "drpState": 2,
- "rz": 265.12,
- "w": 0.689,
- "a_fsltdz": -4.740000000000009,
- "rzTm": "2025-04-11T05:00:00.000Z",
- "rzWarning": 0,
- "rzState": 2,
- "pic": [
+ ],
+ "aRz": -1.14
+ }, {
+ "stcd": "716111701",
+ "type": "sk",
+ "hasRz": true,
+ "stnm": "桐枧冲水库",
+ "adcd": "421181110000",
+ "wscd": null,
+ "importancy": 0,
+ "lgtd": 115.135278,
+ "lttd": 31.3925,
+ "elev": 0,
+ "damel": 276.56,
+ "dsflz": 273.66,
+ "fsltdz": 269.86,
+ "ddz": 256.76,
+ "zcxsw": 269.86,
+ "drpTm": "2025-04-11T05:00:00.000Z",
+ "today": 0,
+ "h1": 0,
+ "h3": 0,
+ "h6": 0,
+ "h12": 0,
+ "h24": 0,
+ "h48": 0,
+ "drpState": 2,
+ "rz": 265.12,
+ "w": 0.689,
+ "a_fsltdz": -4.740000000000009,
+ "rzTm": "2025-04-11T05:00:00.000Z",
+ "rzWarning": 0,
+ "rzState": 2,
+ "pic": [
{
- "stcd": "716111701",
- "tm": "2023-03-12T07:03:00.000Z",
- "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111701/20230312150300.jpg"
+ "stcd": "716111701",
+ "tm": "2023-03-12T07:03:00.000Z",
+ "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111701/20230312150300.jpg"
},
{
- "stcd": "716111701",
- "tm": "2023-03-12T07:27:00.000Z",
- "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111702/20230312152700.jpg"
+ "stcd": "716111701",
+ "tm": "2023-03-12T07:27:00.000Z",
+ "url": "http://223.75.53.106:8891/skjgimages/2023/0312/716111702/20230312152700.jpg"
}
- ],
- "aRz": -4.74
- },
+ ],
+ "aRz": -4.74
+ },
]
- return (
- {
+ const map = window.__mapref;
+ const layer = map.getLayer('关联站点')
+ if (layer) {
+ map.removeLayer('关联站点');
+ map.removeSource('关联站点');
+ }
+ map.addLayer({
+ 'id': '关联站点',//+new Date().getTime(),
+ 'type': 'symbol',
+ 'source': {
+ 'type': 'geojson',
+ 'data': {
+ 'type': 'FeatureCollection',
+ 'features': [],
+ },
+ },
+ 'layout': {
+ 'icon-allow-overlap': true,
+ 'text-allow-overlap': true,
+ 'icon-image': '流量站',
+ 'icon-size': [
+ 'interpolate', ['linear'], ['zoom'],
+ 10, 0.4,
+ 14, 0.8,
+ ],
+
+ 'text-allow-overlap': true,
+ 'text-size': [
+ 'interpolate', ['linear'], ['zoom'],
+ 10, 10,
+ 14, 14,
+ ],
+ 'text-font': ['Roboto Black'],
+ 'text-field': [
+ 'step',
+ ['zoom'],
+ '',
+ 12, ['get', 'stnm']
+ ],
+ 'text-anchor': 'top',
+ 'text-offset': [0, 1],
+
+ },
+ 'paint': {
+ 'text-color': '#fff'
+ },
+ 'visibility': 'visible',
+ });
+ const arrData = [...stPoint, ...scPoint, ...ggPoint]
+ map.getSource('关联站点').setData(parseGeoJSON(arrData))
+
+ }
+
+ return (
+
-
- {
- // dispatch.map.setLayerVisible({'BxjcLayer':true});
- // dispatch.map.setLayerVisible({'SyjcLayer':false});
- // dispatch.map.setLayerVisible({'SljcLayer':false});
- // dispatch.map.setLayerVisible({'ByjcLayer':false});
- setTab('生态')
- }}>生态
- {
- // dispatch.map.setLayerVisible({'BxjcLayer':false});
- // dispatch.map.setLayerVisible({'SyjcLayer':true});
- // dispatch.map.setLayerVisible({'SljcLayer':false});
- // dispatch.map.setLayerVisible({'ByjcLayer':false});
- setTab('灌溉发电')
- }}>灌溉发电
- {/* {
- // dispatch.map.setLayerVisible({'BxjcLayer':false});
- // dispatch.map.setLayerVisible({'SyjcLayer':false});
- // dispatch.map.setLayerVisible({'SljcLayer':true});
- // dispatch.map.setLayerVisible({'ByjcLayer':false});
- setTab('发电')
- }}>发电 */}
- {
- // dispatch.map.setLayerVisible({'BxjcLayer':false});
- // dispatch.map.setLayerVisible({'SyjcLayer':false});
- // dispatch.map.setLayerVisible({'SljcLayer':false});
- // dispatch.map.setLayerVisible({'ByjcLayer':true});
- setTab('泄洪')
- }}>泄洪
-
- >
- }
+ // extra={
+ // <>
+ //
+ // {
+ // // dispatch.map.setLayerVisible({'BxjcLayer':true});
+ // // dispatch.map.setLayerVisible({'SyjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SljcLayer':false});
+ // // dispatch.map.setLayerVisible({'ByjcLayer':false});
+ // setTab('生态')
+ // }}>生态
+ // {
+ // // dispatch.map.setLayerVisible({'BxjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SyjcLayer':true});
+ // // dispatch.map.setLayerVisible({'SljcLayer':false});
+ // // dispatch.map.setLayerVisible({'ByjcLayer':false});
+ // setTab('灌溉发电')
+ // }}>灌溉发电
+ // {/* {
+ // // dispatch.map.setLayerVisible({'BxjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SyjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SljcLayer':true});
+ // // dispatch.map.setLayerVisible({'ByjcLayer':false});
+ // setTab('发电')
+ // }}>发电 */}
+ // {
+ // // dispatch.map.setLayerVisible({'BxjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SyjcLayer':false});
+ // // dispatch.map.setLayerVisible({'SljcLayer':false});
+ // // dispatch.map.setLayerVisible({'ByjcLayer':true});
+ // setTab('泄洪')
+ // }}>泄洪
+ //
+ // >
+ // }
>
- {
+
+
+
+
+
+
供水统计分析
+

+
+ {
+ setTab('生态')
+ }}>生态
+ {
+ setTab('水厂')
+ }}>水厂 {
+ setTab('灌溉')
+ }}>灌溉
+
+
+
+
+
+
+

{
+ dispatch.runtime.setInfoDlg({ layerId: 'flowjcLayer', properties: { title: tab == '生态' ? '生态流量监测(浮桥河水库生态流量)' : tab == '水厂' ? '水厂流量监测(顺河镇供水监测)' : '灌溉流量监测(西干渠渠首流量监测)', tab } });
+ }} />
+
+
+
+ {
+ tab == '生态' ?
+ <>
+
+
+
0.363 m³/s
+
实时流量({moment().format('YYYY-MM-DD') + ' 09:00'})
+
+
+
+
0.358 m³/s
+
日平均流量({moment().format('YYYY-MM-DD')})
+
+
+
0.32 m³/s
+
生态流量目标({moment().format('YYYY-MM-DD')})
+
+
+ {/*
*/}
+

+ >
+ : null
+ }
+ {
+ tab == '水厂' ?
+
+
+
+
0.363 m³/s
+
实时流量({moment().format('YYYY-MM-DD') + ' 09:00'})
+
+
+
+
66390 m³
+
近30天累计供水({moment().format('YYYY-MM-DD')})
+
+
+
+
+ : null
+ }
+ {
+ tab == '灌溉' ?
+
+
+
+
0.351 m³/s
+
实时流量({moment().format('YYYY-MM-DD') + ' 09:00'})
+
+
+
+
96390 m³
+
近30天累计供水({moment().format('YYYY-MM-DD')})
+
+
+
+
+ : null
+ }
+
+
+
+
+ 未来10天来水量:87.2万m³({moment().format('YYYY-MM-DD')} ~ {moment().add(9, 'day').format('YYYY-MM-DD')})
+
+
+
+
+ {/* {
tab==='生态'?
@@ -313,9 +582,9 @@ function DrpReal({ style }) {
}
+
*/}
)
-}
-
+}
+
export default DrpReal;
diff --git a/src/views/Home/panels/Sksltj/index.less b/src/views/Home/panels/Sksltj/index.less
new file mode 100644
index 0000000..b859ee3
--- /dev/null
+++ b/src/views/Home/panels/Sksltj/index.less
@@ -0,0 +1,57 @@
+.water-source-box {
+ .source-total {
+ .source-container {
+ display: flex;
+ gap: 16px;
+ padding: 2px;
+
+ .source-card {
+ flex: 1;
+ padding-bottom: 10px;
+ border-radius: 8px;
+ color: white;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-width: 125px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ }
+
+ .source-value {
+ font-size: 32px;
+ font-weight: bold;
+ margin-bottom: 8px;
+ }
+
+ .source-label {
+ font-size: 14px;
+ opacity: 0.9;
+ }
+ }
+ }
+}
+
+.providerWater-total{
+ .button-group {
+ font-size: 0.8rem;
+ color: rgb(172, 188, 190);
+ margin-left: 1rem;
+
+ span {
+ cursor: pointer;
+ margin: 0 0.25rem;
+ display: inline-block;
+ border: 1px solid #209aec46;
+ padding: 0.1rem 0.5rem;
+ border-radius: 0.2rem;
+ }
+
+ .active {
+ color: #fff;
+ cursor: default;
+ font-weight: bold;
+ border: 1px solid #209aec9f;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/Home/panels/Skyb/index.js b/src/views/Home/panels/Skyb/index.js
index 9162bb5..454a184 100644
--- a/src/views/Home/panels/Skyb/index.js
+++ b/src/views/Home/panels/Skyb/index.js
@@ -12,7 +12,7 @@ function DrpReal({ style }) {
return (
diff --git a/src/views/Home/panels/WeatherForcast/WF.js b/src/views/Home/panels/WeatherForcast/WF.js
index 5c16552..5004df2 100644
--- a/src/views/Home/panels/WeatherForcast/WF.js
+++ b/src/views/Home/panels/WeatherForcast/WF.js
@@ -49,7 +49,8 @@ function WF() {
}, [contourSetting]);
const genWeatherContour24H = () => {
- dispatch.runtime.setYyfa({yy:''})
+ dispatch.runtime.setYyfa({ yy: '' })
+ dispatch.runtime.setXiayouxh(false)
dispatch.shyjview.showWeather24h();
const map = window.__mapref
if (map) {
@@ -58,7 +59,8 @@ function WF() {
}
const genWeatherContourRadar = () => {
- dispatch.runtime.setYyfa({yy:''})
+ dispatch.runtime.setYyfa({ yy: '' })
+ dispatch.runtime.setXiayouxh(false)
dispatch.shyjview.showWeatherRadar();
const map = window.__mapref
map.setLayoutProperty('热力图', 'visibility', 'none');
diff --git a/src/views/Home/panels/Yuanyfa/ddfa.js b/src/views/Home/panels/Yuanyfa/ddfa.js
new file mode 100644
index 0000000..7eab408
--- /dev/null
+++ b/src/views/Home/panels/Yuanyfa/ddfa.js
@@ -0,0 +1,131 @@
+import React, { useState,useEffect } from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import { Card, CardContent, Typography, Box } from '@material-ui/core';
+import { useDispatch, useSelector } from 'react-redux';
+
+const useStyles = makeStyles({
+ cardContainer: {
+ marginBottom: 16,
+ },
+ card: {
+ backgroundColor: 'transparent',
+ color: '#fff',
+ borderRadius: 8,
+ border: '1px solid #2a2b2f',
+ cursor: 'pointer',
+ transition: 'all 0.3s ease',
+ '&:hover': {
+ borderColor: '#4a90e2',
+ },
+ },
+ selectedCard: {
+ borderColor: '#00ff00',
+ boxShadow: '0 0 10px rgba(0, 255, 0, 0.2)',
+ },
+ title: {
+ display: 'flex',
+ alignItems: 'center',
+ marginBottom: 16,
+ '& svg': {
+ marginRight: 8,
+ fontSize: 16,
+ },
+ },
+ content: {
+ color: '#ccc',
+ '& p': {
+ marginBottom: 8,
+ },
+ },
+ editIcon: {
+ marginLeft: 'auto',
+ color: '#4a90e2',
+ },
+});
+
+const ScheduleCard = ({ data, selected, onClick }) => {
+ const classes = useStyles();
+
+ return (
+
+
+
+
+ 调度方案-{data.date}
+ {/*
+ ✎
+ */}
+
+
+
+ 初始水位为{data.initialLevel}m,通过开启工作闸门进行提前泄洪,开度最大为
+ {data.maxOpening}m,最大下泄流量为{data.maxFlow}m³/s,共持续调控
+ {data.duration}小时,期间最高水位为{data.maxLevel}m,未超过校核洪水位
+ {data.checkLevel}m,大坝处于安全状态。
+
+
+
+
+
+ );
+};
+
+// 父组件示例
+const ScheduleList = ({setfayy}) => {
+ const [selectedCard, setSelectedCard] = useState(null);
+
+ const schedules = [
+ {
+ id: '20250602',
+ date: '20250602',
+ initialLevel: 64.0,
+ maxOpening: 1.2,
+ maxFlow: 12.42,
+ duration: 143,
+ maxLevel: 66.12,
+ checkLevel: 68.7
+ },
+ {
+ id: '20250524',
+ date: '20250524',
+ initialLevel: 64.2,
+ maxOpening: 2.1,
+ maxFlow: 22.31,
+ duration: 65,
+ maxLevel: 67.12,
+ checkLevel: 68.7
+ }
+ ];
+const [compareList, setCompareList] = useState([])
+ const scheduleClick = (schedule) => {
+ setfayy();
+ setSelectedCard(schedule.id)
+ const findItem = schedules.find(item => item.id == schedule.id);
+ setCompareList([...compareList,findItem])
+ }
+ const dispatch = useDispatch();
+
+ useEffect(() => {
+ const redList = Array.from(new Set(compareList.map(item => item.id)))
+ dispatch.runtime.setDuibifx(redList)
+ }, [compareList])
+
+ return (
+
+ {schedules.map((schedule) => (
+ scheduleClick(schedule)}
+ />
+ ))}
+
+ );
+};
+
+export default ScheduleList;
\ No newline at end of file
diff --git a/src/views/Home/panels/Yuanyfa/index.js b/src/views/Home/panels/Yuanyfa/index.js
index 8f87854..422ecb2 100644
--- a/src/views/Home/panels/Yuanyfa/index.js
+++ b/src/views/Home/panels/Yuanyfa/index.js
@@ -14,14 +14,54 @@ import Hdyj from './Hdyj';
import Shqx from './Shqx';
import ShYj from './ShYj';
import { styled } from '@material-ui/styles';
-
-import { RadioGroup, Radio, Switch, FormControlLabel, InputLabel, Select, MenuItem, FormControl } from '@material-ui/core/index';
-import { backgroundColor } from 'echarts/lib/theme/dark';
+import { makeStyles } from '@material-ui/core/styles';
+import { RadioGroup, Radio, Switch, Box, FormControlLabel, InputLabel, Select, MenuItem, FormControl } from '@material-ui/core/index';
import { Description } from '@material-ui/icons';
import DescriptionItem from '../../components/DescrptionItem';
-import WaterLevelAlert from './WaterLevelAlert'
+import WaterLevelAlert from './WaterLevelAlert'
+import ScheduleList from './ddfa'
+const useStyles = makeStyles({
+ cardContainer: {
+ marginBottom: 16,
+ },
+ card: {
+ backgroundColor: 'transparent',
+ color: '#fff',
+ borderRadius: 8,
+ border: '1px solid #2a2b2f',
+ cursor: 'pointer',
+ transition: 'all 0.3s ease',
+ '&:hover': {
+ borderColor: '#4a90e2',
+ },
+ },
+ selectedCard: {
+ borderColor: '#00ff00',
+ boxShadow: '0 0 10px rgba(0, 255, 0, 0.2)',
+ },
+ title: {
+ display: 'flex',
+ alignItems: 'center',
+ marginBottom: 16,
+ '& svg': {
+ marginRight: 8,
+ fontSize: 16,
+ },
+ },
+ content: {
+ color: '#ccc',
+ '& p': {
+ marginBottom: 8,
+ },
+ },
+ editIcon: {
+ color: '#4a90e2',
+ },
+});
export default function Warn({ style }) {
const dispatch = useDispatch();
+ const classes = useStyles();
+
const res = useSelector(s => s.runtime.yyObj)
const [value, setValue] = React.useState(res.yy ?? '');
const [yyValue, setYyValue] = React.useState(false);
@@ -66,11 +106,15 @@ export default function Warn({ style }) {
});
const [dimension, setDimension] = useState('fqh');
const [checked, setChecked] = React.useState(false);
+ const xiayou = useSelector(s => s.runtime.xiayouxh);
+
const fayy = () => {
setYyValue(true)
- if (value) {
- dispatch.runtime.setYyfa({ yy: value })
- }
+ dispatch.runtime.setYyfa({ yy: true })
+ dispatch.runtime.setXiayouxh(true)
+
+ // if (value) {
+ // }
}
// useEffect(() => {
@@ -105,35 +149,67 @@ export default function Warn({ style }) {
}
// dispatch.runtime.setYyfa({})
};
-
+
useEffect(() => {
- dispatch.runtime.setDuibifx(selectedSchemes)
+ dispatch.runtime.setDuibifx(selectedSchemes)
}, [selectedSchemes])
-
+
const productFa = () => {
dispatch?.runtime.setInfoDlg({ layerId: 'YuananLayer', properties: {} })
dispatch.runtime.setYyfa({})
-
+ dispatch.runtime.setXiayouxh(false)
}
const changeYY = (e) => {
setValue(e.target.value)
dispatch.runtime.setYyfa({})
}
+
+ const handleFaEdit = () => {
+ dispatch.runtime.setInfoDlg({ layerId: 'editFaLayer', properties: {} });
+ }
+
+ const btgroup = [
+ {
+ name: '水库调度',
+ key: 'dd',
+ icon: 'shuikudd1.png',
+ icon2: 'shuikudd2.png'
+ },
+ {
+ name: '下游行洪',
+ key: 'xh',
+ icon: 'xiayouxh1.png',
+ icon2: 'xiayouxh2.png'
+ }
+ ]
+ const [view, setView] = useState('dd')
+ const handleBtnGroup = (row) => {
+ setView(row.key)
+ if (row.key == 'dd') {
+ dispatch.runtime.setYyfa({ yy: true })
+ // dispatch.runtime.setXiayouxh(false)
+ } else {
+ dispatch.runtime.setYyfa({})
+ dispatch.runtime.setXiayouxh(true)
+ }
+ }
return (
自动生成方案
- 加载方案
+ {yyValue && ✎}
+ {/* 加载方案 */}
+
}
>
-
+ {/*
-
+ */}
+
{res.yy &&

@@ -169,10 +246,19 @@ export default function Warn({ style }) {
*/}
}
-
+
-
+
+
+ {
+ xiayou && btgroup.map(item => (
+
handleBtnGroup(item)} key={item.key}>
+

+
+ ))
+ }
+
)