diff --git a/src/service/apiurl.js b/src/service/apiurl.js index f5e936b..b95721e 100644 --- a/src/service/apiurl.js +++ b/src/service/apiurl.js @@ -183,6 +183,9 @@ const apiurl = { } }, gcyx: { + yxqk: { + list:service_ykz + '/gateInfo/list' + }, jbqk: { list: service_ykz + '/projectBasicInfo/list', edit: service_ykz + '/projectBasicInfo/update', diff --git a/src/views/Gcyx/InformationSearch/RunSituation/index.js b/src/views/Gcyx/InformationSearch/RunSituation/index.js index 4dc038b..9a0aa9f 100644 --- a/src/views/Gcyx/InformationSearch/RunSituation/index.js +++ b/src/views/Gcyx/InformationSearch/RunSituation/index.js @@ -1,52 +1,94 @@ import React, { useMemo,useEffect,useState } from 'react'; -import { Table } from 'antd'; +import { Table,Space } from 'antd'; import apiurl from '../../../../service/apiurl'; -import usePageTable from '../../../../components/crud/usePageTable2'; -import { createCrudService } from '../../../../components/crud/_'; +import { httppost2 } from '../../../../utils/request'; import clsx from 'clsx' import './index.less' const Page = () => { - const types = { - 0: "防汛物资", - 1: '食品和饮水', - 2: "防护用具", - 3: "照明设备", - 4: "金属材料类", - 5:"其它", + + + const StatusPower = ({ val }) => { + return ( + +
+ {val ? '正常' : '消失'} + + ) } - const [searchVal, setSearchVal] = useState({}) - const columns = [ - { title: '闸孔编号', key: 'inx', dataIndex: 'inx', width: 80}, - { - title: '闸门电源状态', key: 'name', dataIndex: 'name', width: 150, - render: (v) =>
- - 正常 + + const StatusFault = ({ val }) => { + const v = !val; + return ( + +
+ {v ? '正常' : '异常'} + + ) + } + + const Status1 = ({ val }) => { + if (val === undefined) { + return null; + } + return ( +
- }, - { title: '闸门上升中', key: 'adress', dataIndex: 'adress', width: 150}, - { title: '闸门下降中', key: 'type', dataIndex: 'type', width: 150}, - { title: '闸门故障状态', key: 'type', dataIndex: 'type', width: 150}, - { title: '上限位', key: 'type', dataIndex: 'type', width: 140}, - { title: '下限位', key: 'type', dataIndex: 'type', width: 140}, - { title: '实时开度(m)', key: 'type', dataIndex: 'type', width: 140}, + ) + } + const columns = [ + { title: '闸孔编号', key: 'gateNumber', dataIndex: 'gateNumber', width: 80}, { - title: '监测时间', key: 'eventsDate', dataIndex: 'eventsDate', width: 150, + title: '闸门电源状态', key: 'powerSignal', dataIndex: 'powerSignal', width: 150, + // render: (v) =>
+ // + // 正常 + //
+ render: (v) => + }, + { + title: '闸门上升中', key: 'openingSignal', dataIndex: 'openingSignal', width: 150, + render: (v) => + }, + { + title: '闸门下降中', key: 'closeingSignal', dataIndex: 'closeingSignal', width: 150, + render: (v) => + }, + { + title: '闸门故障状态', key: 'errorSignal', dataIndex: 'errorSignal', width: 150, + render: (v) => + }, + { + title: '上限位', key: 'openedSignal', dataIndex: 'openedSignal', width: 140, + render: (v) => + }, + { + title: '下限位', key: 'closedSignal', dataIndex: 'closedSignal', width: 140, + render: (v) => + + }, + { title: '实时开度(m)', key: 'realAperture', dataIndex: 'realAperture', width: 140}, + { + title: '监测时间', key: 'tm', dataIndex: 'tm', width: 150, }, ]; const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]); - const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.sbwh.whfabz.page).find_noCode); - useEffect(()=>{ - const params = { - search: { - ...searchVal, + const [gateList, setGateList] = useState([]) + const getGateStatus = async () => { + try { + const res = await httppost2(apiurl.gcyx.yxqk.list) + if (res.code == 200) { + setGateList(res.data) } - }; - search(params) - }, [searchVal]) + } catch (error) { + console.log(error); + } + } + useEffect(() => { + getGateStatus(); + }, []); return ( @@ -54,7 +96,13 @@ const Page = () => {
- +
diff --git a/src/views/Home/index.js b/src/views/Home/index.js index e75d1df..7977554 100644 --- a/src/views/Home/index.js +++ b/src/views/Home/index.js @@ -1,7 +1,7 @@ import React, { useEffect, useState, useMemo } from 'react' import { useNavigate } from 'react-router'; import { - RightCircleFilled, LeftCircleFilled + RightCircleFilled, LeftCircleFilled, BarsOutlined } from '@ant-design/icons'; import autofit from 'autofit.js' import Zmjk from "./zmjk" @@ -15,7 +15,7 @@ import apiurl from '../../service/apiurl'; import { useDispatch, useSelector } from 'react-redux'; import HFivePlayer from '../../components/video1Plary'; import moment from 'moment'; -import {loadMenu,loadRole} from '../../models/auth/_' +import { loadMenu, loadRole } from '../../models/auth/_' const MenuTitleCard = ({ key, title }) => { return (
@@ -26,11 +26,13 @@ const MenuTitleCard = ({ key, title }) => { export default function Home() { const menu = useSelector((state) => state.auth.menu); const [title, setTitle] = useState([]) + const [showTabLeft, setShowTabLeft] = useState(false) + const [showTabRight, setShowTabRight] = useState(false) // const title = menu.map(item => ({ title: item.menuName, key: item.path || item.redirect })) const jcdType = { 0: "闸后流量", 2: '闸前水位', - 3:'闸后水位' + 3: '闸后水位' } const types1 = { 0: "闸后流量(m³/s)", @@ -66,12 +68,12 @@ export default function Home() { try { const res = await httppost2(apiurl.jcsj.jcsj.realData) if (res.code == 200) { - const uptData = res.data.map(item => ({ + const uptData = res.data.map(item => ({ ...item, name: types1[item.type], - value:item.val, - time:item.tm - })) + value: item.val, + time: item.tm + })) setRealData(uptData) getHistoryData(uptData[0]) } @@ -81,91 +83,91 @@ export default function Home() { } const [historyList, setHistoryList] = useState([]) - - const pxOptions = useMemo(() => { - if (historyList) { - return options(historyList) - } else { - return options([]) - } - }, [historyList]) + + const pxOptions = useMemo(() => { + if (historyList) { + return options(historyList) + } else { + return options([]) + } + }, [historyList]) const getHistoryData = async (val) => { - const start = moment().subtract(7,'days').format('YYYY-MM-DD 00:00:00') - const end = moment().format('YYYY-MM-DD 23:59:59') - let params = { - pageSo: { - pageSize: 999, - pageNumber:1 - }, - type:val.type, - dateTimeRangeSo:{ - start, - end - } - } - try { - const res = await httppost2(apiurl.jcsj.jcsj.historyList,params) - if (res.code == 200) { - setHistoryList(res.data) - } - } catch (error) { - console.log(error); - } + const start = moment().subtract(7, 'days').format('YYYY-MM-DD 00:00:00') + const end = moment().format('YYYY-MM-DD 23:59:59') + let params = { + pageSo: { + pageSize: 999, + pageNumber: 1 + }, + type: val.type, + dateTimeRangeSo: { + start, + end } + } + try { + const res = await httppost2(apiurl.jcsj.jcsj.historyList, params) + if (res.code == 200) { + setHistoryList(res.data) + } + } catch (error) { + console.log(error); + } + } //安全监测数据 const [safeData, setSafeData] = useState(Array(5).fill(0).map((item, i) => ({ id: i, cd: "SY01", dm: '1#断面', kpa: 2749, time: '2024-08-15 15:00:00' }))) //操作日志 const [operateData, setOperateData] = useState([]) const getLogData = async () => { - const start = moment().subtract(7,'days').format('YYYY-MM-DD 00:00:00') + const start = moment().subtract(7, 'days').format('YYYY-MM-DD 00:00:00') const end = moment().format('YYYY-MM-DD 23:59:59') let params = { pageSo: { pageSize: 999, - pageNumber:1 - }, - dateTimeRangeSo:{ - start, - end - } - } - try { - const res = await httppost2(apiurl.gcyx.czrz.page, params) - if (res.code == 200) { - setOperateData(res.data?.records) - } - } catch (error) { - console.log(error); + pageNumber: 1 + }, + dateTimeRangeSo: { + start, + end } } + try { + const res = await httppost2(apiurl.gcyx.czrz.page, params) + if (res.code == 200) { + setOperateData(res.data?.records) + } + } catch (error) { + console.log(error); + } + } //报警信息 const [policeData, setPoliceData] = useState(Array(5).fill(0).map((item, i) => ({ id: i, zd: '闸前水位', watchvalue: "10.23", limit: 0, max: 10, time: '2024-08-15 15:00:00' }))) const getPoliceData = async (val) => { - const start = moment().subtract(7,'days').format('YYYY-MM-DD 00:00:00') + const start = moment().subtract(7, 'days').format('YYYY-MM-DD 00:00:00') const end = moment().format('YYYY-MM-DD 23:59:59') let params = { pageSo: { pageSize: 999, - pageNumber:1 - }, - dateTimeRangeSo:{ - start, - end - } - } - try { - const res = await httppost2(apiurl.jcsj.bjgl.bjjl.page,params) - if (res.code == 200) { - setPoliceData(res.data.records) - } - } catch (error) { - console.log(error); + pageNumber: 1 + }, + dateTimeRangeSo: { + start, + end } } - - + try { + const res = await httppost2(apiurl.jcsj.bjgl.bjjl.page, params) + if (res.code == 200) { + setPoliceData(res.data.records) + } + } catch (error) { + console.log(error); + } + } + + const navigate = useNavigate(); const jumpMenu = (item) => { navigate(item.key) @@ -246,141 +248,174 @@ export default function Home() {
-
- {/* 工程简介 */} -
-
工程简介
-
- - 盐卡闸位于湖北省荆州市经济开发区,荆江大堤左岸桩 745+614 处,位于观音寺闸上游 5km 处。盐卡闸主要工程任务为引水灌溉,解决四湖中下区农 - 业灌溉和洪湖生态保障不足的问题。利用盐卡泵站进水渠,反向从长江引水,引水灌溉设计流量55m³/s,水闸级别为 1 级,次要建筑物级别为 3 级。 -
-
- {/* 运行监测数据 */} -
-
运行监测数据
-
- {RealData.map((item, i) => ( -
{ setActiveOne(i); getHistoryData(item)}}> - {item.name} - {item.value} - {item.time} -
- ))} -
- {historyList.length > 0 ? - - : - } +
setShowTabLeft(!showTabLeft)} + >
+ {!showTabLeft && +
+ {/* 工程简介 */} +
+
工程简介
+
+ + 盐卡闸位于湖北省荆州市经济开发区,荆江大堤左岸桩 745+614 处,位于观音寺闸上游 5km 处。盐卡闸主要工程任务为引水灌溉,解决四湖中下区农 + 业灌溉和洪湖生态保障不足的问题。利用盐卡泵站进水渠,反向从长江引水,引水灌溉设计流量55m³/s,水闸级别为 1 级,次要建筑物级别为 3 级。
-
- {/* 安全监测数据 */} -
-
-
安全监测数据
+ {/* 运行监测数据 */} +
+
运行监测数据
+
+ {RealData.map((item, i) => ( +
{ setActiveOne(i); getHistoryData(item) }}> + {item.name} + {item.value} + {item.time} +
+ ))} +
+ {historyList.length > 0 ? + + : + } +
+
+
+ {/* 安全监测数据 */} +
+
+
安全监测数据
+
+
+ + + + + + + + + 4 ? 'scroll' : 'hidden' }}> + {safeData.length > 0 ? safeData.map((item, i) => ( + + + + + + + )) : + } + + +
测点编号监测断面渗压(KPa)监测时间
{item.cd}{item.dm}{item.kpa}{item.time}
+
+
+
+ +
} +
setShowTabRight(!showTabRight)} + >
+ { + !showTabRight && +
+ {/* 操作日志 */} +
+
操作日志
- - - - + + + + - 4 ? 'scroll' : 'hidden' }}> - {safeData.length >0 ? safeData.map((item, i) => ( + 6 ? 'scroll' : 'hidden' }}> + {operateData.length > 0 ? operateData.map((item, i) => ( - - - - + + + + - )): - } + )) : + }
测点编号监测断面渗压(KPa)监测时间闸孔编号操作内容操作人员操作时间
{item.cd}{item.dm}{item.kpa}{item.time}{item.gatePoreCode}{item.opContent}{item.createUserName}{item.createTime}
-
-
-
- {/* 操作日志 */} -
-
操作日志
-
- - - - - - - - - - 6 ? 'scroll' : 'hidden' }}> - {operateData.length > 0 ?operateData.map((item, i) => ( - - - - - + {/* 报警信息 */} +
+
报警信息
+
+
闸孔编号操作内容操作人员操作时间
{item.gatePoreCode}{item.opContent}{item.createUserName}{item.createTime}
+ + + + + + + - )): - } - + + 6 ? 'scroll' : 'hidden' }} > + {policeData.length > 0 ? policeData.map((item, i) => ( + + + + + + + + )) : + } + -
监测点监测值阈值下限阈值上限报警时间
{jcdType[item.type]}{item.val}{item.lowerLimit}{item.upperLimit}{item.warnTime}
+ +
+
+ {/* 视频监控 */} +
+
+ 视频监控 +
+
+ {index !== 0 && delClick()} />} + + {index !== videoList.length - 1 && addClick()} />} +
- {/* 报警信息 */} -
-
报警信息
-
- - - - - - - - - - - 6 ? 'scroll' : 'hidden' }} > - {policeData.length > 0 ? policeData.map((item, i) => ( - - - - - - - - )): - } - - -
监测点监测值阈值下限阈值上限报警时间
{jcdType[item.type]}{item.val}{item.lowerLimit}{item.upperLimit}{item.warnTime}
-
-
- {/* 视频监控 */} -
-
- 视频监控 -
-
- {index !== 0 && delClick()} />} - - {index !== videoList.length - 1 && addClick()} />} -
-
-
+ } ) } diff --git a/src/views/Home/index.less b/src/views/Home/index.less index c11a05d..61cb72c 100644 --- a/src/views/Home/index.less +++ b/src/views/Home/index.less @@ -73,6 +73,7 @@ .content-box{ display: flex; justify-content: center; + } .content-left{ position: absolute;