diff --git a/public/assets/images/zb130.png b/public/assets/images/zb130.png new file mode 100644 index 000000000..8f639cb7e Binary files /dev/null and b/public/assets/images/zb130.png differ diff --git a/public/assets/images/zb250.png b/public/assets/images/zb250.png new file mode 100644 index 000000000..9fb5e2c74 Binary files /dev/null and b/public/assets/images/zb250.png differ diff --git a/public/assets/images/zb370.png b/public/assets/images/zb370.png new file mode 100644 index 000000000..8747b575e Binary files /dev/null and b/public/assets/images/zb370.png differ diff --git a/src/components/DashboardLayout/HeaderUser.tsx b/src/components/DashboardLayout/HeaderUser.tsx index 3be8a430b..4baa019bf 100644 --- a/src/components/DashboardLayout/HeaderUser.tsx +++ b/src/components/DashboardLayout/HeaderUser.tsx @@ -9,7 +9,7 @@ import {divIcon} from "leaflet"; import { httppost2 } from '../../utils/request'; import apiurl from '../../service/apiurl'; import CryptoJS from 'crypto-js'; - +import { createCrudService } from '../../components/crud/_'; const { SubMenu } = Menu; const HeaderUser: React.FC<{ @@ -38,26 +38,36 @@ const HeaderUser: React.FC<{ } - const onFinish = async(val:any)=>{ - if(val.newSecretKey!==val.secondSecretKey){ - message.error('确认密码错误') - return - } - const params = { - oldSecretKey:encryptData(val.oldSecretKey), - newSecretKey:encryptData(val.newSecretKey), - secondSecretKey:encryptData(val.secondSecretKey), - userId: localStorage.getItem('userId') - } - const res = await httppost2(apiurl.setPassword,params) - if(res.code===200){ - message.success('修改成功') - setTimeout(() => { - logout() - }, 1500); - }else{ - message.error(res.description) - } + const onFinish = async (val: any) => { + const path = `${apiurl.systemM.userM.updatePassword}?oldPassword=${val.oldPassword}&newPassword=${val.newPassword}`; + createCrudService(path).userEdit().then((result) => { + if (result?.code === 200) { + message.success('修改成功，即将重新登录') + setOpen(false) + setTimeout(() => { + logout() + }, 1500); + } + }) + // if(val.newSecretKey!==val.secondSecretKey){ + // message.error('确认密码错误') + // return + // } + // const params = { + // oldSecretKey:encryptData(val.oldSecretKey), + // newSecretKey:encryptData(val.newSecretKey), + // secondSecretKey:encryptData(val.secondSecretKey), + // userId: localStorage.getItem('userId') + // } + // const res = await httppost2(apiurl.setPassword,params) + // if(res.code===200){ + // message.success('修改成功') + // setTimeout(() => { + // logout() + // }, 1500); + // }else{ + // message.error(res.description) + // } } @@ -90,7 +100,7 @@ const HeaderUser: React.FC<{ :null } - setOpen(false)} onCancel={()=>setOpen(false)} footer={null}> + setOpen(false)} onCancel={()=>setOpen(false)} footer={null}>
- - + */} { const menuItem:any = menu.find(m => m.id == id); if (menuItem.title === "雨水工灾情") { - getReadStatus() + // getReadStatus() } const url = getMenuUrl(menuItem); @@ -74,17 +74,17 @@ const TopMenu: React.FC<{ * @description 由于进入雨水工灾情 初始化进入是这个页面 发请求来获取未读和已读状态 * */ - const getReadStatus = () => { - createCrudService(apiurl.ssyq.status).delGet().then((res) => { - if (res.code === 200) { - dispatch.runtime.setIsReadObject(res.data) - } - }) - } +// const getReadStatus = () => { +// createCrudService(apiurl.ssyq.status).delGet().then((res) => { +// if (res.code === 200) { +// dispatch.runtime.setIsReadObject(res.data) +// } +// }) +// } -useEffect(() => { - getReadStatus() -}, []) +// useEffect(() => { +// getReadStatus() +// }, []) return (
diff --git a/src/components/crud/_.js b/src/components/crud/_.js index 1cf029846..58940927e 100644 --- a/src/components/crud/_.js +++ b/src/components/crud/_.js @@ -1,4 +1,4 @@ -import {httppost2, download, httpPostFile, httpget, httpget2,httpget6} from "../../utils/request"; +import {httppost2, download, httpPostFile, httpget, httpget2,httpget6,xyt_httpput} from "../../utils/request"; import apiurl from "../../service/apiurl"; import {config} from "../../config"; @@ -156,6 +156,10 @@ export function createCrudService(urlSet) { const resData = await httppost2(urlSet, params) || {}; return resData; } + const userEdit = async (params) => { + const resData = await xyt_httpput(urlSet, params) || {}; + return resData; + } const edit1 = async (params) => { const resData = await httppost2(urlSet, params) || {}; @@ -246,6 +250,7 @@ export function createCrudService(urlSet) { todo: todo, save: save, edit: edit, + userEdit, edit1: edit1, del: del, insert:insert, diff --git a/src/models/auth/_.ts b/src/models/auth/_.ts index f7b83d68f..5b25db91c 100644 --- a/src/models/auth/_.ts +++ b/src/models/auth/_.ts @@ -350,7 +350,7 @@ export async function loadMenu(): Promise { { id: id(), title: '白蚁防治', redirect: '/mgr/sg/byfz/bypc', children: [ - { id: id(), title: '白蚁普查', path: '/mgr/sg/byfz/bypc' }, + { id: id(), title: '白蚁监测', path: '/mgr/sg/byfz/bypc' }, { id: id(), title: '防治宣传', path: '/mgr/sg/byfz/byxc' }, ] }, @@ -360,9 +360,9 @@ export async function loadMenu(): Promise { { id: id(), title: '维修养护', path: '/mgr/sg/wxyh', }, - { - id: id(), title: '库容管理', path: '/mgr/sg/krgl', - }, + // { + // id: id(), title: '库容管理', path: '/mgr/sg/krgl', + // }, { id: id(), title: '值班管理', redirect: '/mgr/sg/zbgl/zbb', children: [ diff --git a/src/service/apiurl.js b/src/service/apiurl.js index 23077b5e0..08ab5e79e 100644 --- a/src/service/apiurl.js +++ b/src/service/apiurl.js @@ -1,5 +1,4 @@ import { config } from '../config' -import Zfzl from '../views/gxsl/zfzl' const pubapi_old = 'https://owrsvr.cloudowr.cn/svr' const pubapi = 'https://owrsvr.cloudowr.cn/pubapi' @@ -8,7 +7,11 @@ const service_fxdd = '/gunshiApp/tsg' const service_xyt = '/gunshiApp/tsg'//登陆先用小玉潭 const service_shzh = '/shzh' const apiurl = { - + systemM: { + userM: { + updatePassword:service_xyt + '/system/user/profile/updatePwd' + } + }, krline: { list: service_fxdd + "/stZvarlB/list", save: service_fxdd + "/stZvarlB/insert", @@ -354,7 +357,9 @@ const apiurl = { }, byfz: { bypc: { - page: service_fxdd + "/termite/survey/page", + // page: service_fxdd + "/termite/survey/page", + page: service_fxdd + "/termite/survey/pageDetail", + count:service_fxdd + "/termite/survey/count", save: service_fxdd + "/termite/survey/insert", edit: service_fxdd + "/termite/survey/update", delete: service_fxdd + "/termite/survey/del", @@ -984,6 +989,10 @@ const apiurl = { update: service_fxdd + "/attResBase/update", getFile:service_fxdd + "/attResBase/file/get" }, + buildInfo: { + detail: service_fxdd + "/attResBuilding/info", + update: service_fxdd + "/attResBuilding/update", + }, kr: { list: service_fxdd + "/stZvarlB/list", save: service_fxdd + "/stZvarlB/insert", diff --git a/src/setupProxy.js b/src/setupProxy.js index 6f6a432ac..a760dedc3 100644 --- a/src/setupProxy.js +++ b/src/setupProxy.js @@ -10,6 +10,7 @@ module.exports = function (app) { // target: 'http://36.139.207.50:18083/',//移动云 // target: 'http://192.168.66.49:24105/',//移动云 // target: 'http://192.168.66.32:24105/',//ls + // target: 'http://192.168.66.32:24105/', //ls changeOrigin: true, }) ); diff --git a/src/utils/request.js b/src/utils/request.js index 3c6ea73f3..630a783fd 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -53,7 +53,19 @@ async function send(url, options) { return {}; } +export function xyt_httpput(url, data = {}) { + const options = { + method: 'PUT', + headers: { + 'Content-Type': 'application/json', + 'adcd': localStorage.getItem('ADCD6'), + "authorization":"Bearer" + ' ' + localStorage.getItem('access_token') + }, + body: JSON.stringify(data), + }; + return send(url, options); +} export function httpget(url, data = {}) { const params = []; for (const k in data) { diff --git a/src/views/Home/MapCtrl/components/Sqjcsj/drpOption.js b/src/views/Home/MapCtrl/components/Sqjcsj/drpOption.js index 40704cfc0..fb96b1f1a 100644 --- a/src/views/Home/MapCtrl/components/Sqjcsj/drpOption.js +++ b/src/views/Home/MapCtrl/components/Sqjcsj/drpOption.js @@ -30,7 +30,7 @@ export default function drpOption({ data, wrz, grz }) { // 显示图例 show: true, // 图例的位置 - data: ['警戒水位', '危险水位', "降雨量", "水位", "转换流量"], + data: ['警戒水位', '保证水位', "降雨量", "水位", "转换流量"], }, xAxis: [ { @@ -165,7 +165,7 @@ export default function drpOption({ data, wrz, grz }) { { xAxisIndex: 1, yAxisIndex: 1, - name: '危险水位', + name: '保证水位', type: 'line', color: "#D9001B", lineStyle: { diff --git a/src/views/gcaqjc/gcaqfx/jrx/index.js b/src/views/gcaqjc/gcaqfx/jrx/index.js index c12411894..25f3a012c 100644 --- a/src/views/gcaqjc/gcaqfx/jrx/index.js +++ b/src/views/gcaqjc/gcaqfx/jrx/index.js @@ -1,5 +1,5 @@ -import React, { useState, useEffect,useMemo,useRef } from 'react' -import { Table, Card,Button,message,Popconfirm } from 'antd'; +import React, { useState, useEffect, useMemo, useRef } from 'react' +import { Table, Card, Button, message, Popconfirm,Spin } from 'antd'; import ToolBar from './toolbar'; import { useSelector } from 'react-redux'; import ReactEcharts from 'echarts-for-react'; @@ -12,26 +12,34 @@ import jrxOption from "./jrxOptions" import { Rnd } from "react-rnd" export default function Xmzlmb() { + const typeName = { + '大坝B0+130': '1', + '大坝B0+132': '2', + '大坝B0+250': '3', + '大坝B0+252': '4', + '大坝B0+370': '5', + '大坝B0+372': '6', + } const role = useSelector(state => state.auth.role); - const [code, setCode] = useState([]) const [searchVal, setSearchVal] = useState({}) const [dataSources, setDateSources] = useState([]) - const [table2Data, setTable2Data] = useState([]) const [dmList, setDmList] = useState([]) const [trData, setTrData] = useState([]) const [swiper, setSwiper] = useState(false) const [timer, setTimer] = useState(100); // 定时器 - const [dbType, setDbType] = useState('1') + const [dbType, setDbType] = useState('1'); + const [dbType1, setDbType1] = useState('1'); + const [loading, setLoading] = useState(false); const echartsRef = useRef(null) const jrxOptions = useMemo(() => { - if (dataSources && dbType) { - return jrxOption(dataSources[0],dbType) + if (dataSources && dbType && dbType1) { + return jrxOption(dataSources[0], dbType,dbType1) } else { return dataSources[0]; } - }, [dataSources,dbType]) - + }, [dataSources, dbType,dbType1]) + const columns = [ { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" }, { title: '时间', key: 'tm', dataIndex: 'tm', width: 150, align: "center" }, @@ -40,56 +48,60 @@ export default function Xmzlmb() { const zcColumns = [ { title: '结果分析', key: 'status', dataIndex: 'status', width: 150, align: "center", - render: (rec, record) => {rec == 1 ? "正常" : rec == 0 ? "异常" : ''} - }, + render: (rec, record) => {rec == 1 ? "正常" : rec == 0 ? "异常" : ''} + }, ]; const columns1 = useMemo(() => { - if (trData.length > 0) { - let newCol = trData.map(s => ({ + if (trData.length > 0) { + let newCol = trData.map(s => ({ title: `${s}(m)`, key: s, dataIndex: s, width: 150, align: "center", - render: (rec, record) => {rec || "-"} - })) - return [...columns,...newCol,...zcColumns]; - } - },[trData]) + render: (rec, record) => {rec || "-"} + })) + return [...columns, ...newCol, ...zcColumns]; + } + }, [trData]) const width = useMemo(() => columns1?.reduce((total, cur) => total + (cur.width), 0), [columns1]); // 单图多线以及数据表的数据 - const getTableData = async(params) => { + const getTableData = async (params) => { + setLoading(true); try { const res = await httppost2(apiurl.gcaqjc.gcaqfx.jrx.page, params) let newArr = []; let newData = res.data.map((s, i) => { - newArr.push(s.list.map(c => ({ - [c.stationCode]: c.value || '-', - tm: c.tm, - + newArr.push(s.list.map(c => ({ + [c.stationCode]: c.value || '-', + tm: c.tm, + }))) return { tm: s.tm, rz: s.rz, status: s.status || '', - inx:i+1 + inx: i + 1 } }) let filterData = newArr.filter(s => s.length > 0).flat() let result = newData.map(s => { let tm1 = s.tm; let r = filterData.filter(t => { - return t.tm == tm1 + return t.tm == tm1 }) let obj = {}; r.forEach(s1 => { - obj = {...s1,...obj} + obj = { ...s1, ...obj } }) return { ...s, ...obj, } }) + if (result.length > 0) { + setLoading(false) + } // let res1 = result.map(item => ({...item,rz:(item.rz - 100).toFixed(2)})) //为了测试 最后需要删除 setDateSources(result) } catch (error) { @@ -97,25 +109,17 @@ export default function Xmzlmb() { } } - // 多图单线数据 - const getTable2Data = async (params) => { - try { - const res = await httppost2(apiurl.gcaqjc.sjtjcx.czcx.list1, params) - setTable2Data(res.data) - } catch (error) { - console.log(error); - } - } + const exportExcel = () => { let params = { ...searchVal, profileName: dmList.find(s => s.id == code).projNm, stationCodes: trData, - id:1 + id: 1 } httppost5(apiurl.gcaqjc.gcaqfx.jrx.export, params).then(res => { - exportFile(`浸润线.xlsx`,res.data) - }) + exportFile(`浸润线.xlsx`, res.data) + }) } const getDmList = async () => { @@ -127,11 +131,11 @@ export default function Xmzlmb() { } } - const getDmTree = async() => { + const getDmTree = async () => { try { const res = await httppost2(apiurl.gcaqjc.sjtjcx.czcx.tree) let filterData = res.data.filter(s => s.profileCode == code) - setTrData(filterData[0].children) + setTrData(filterData[0]?.children) } catch (error) { console.log(error); } @@ -139,7 +143,7 @@ export default function Xmzlmb() { const InitialScroll = (data) => { - let index = 0; + let index = 0; const v = document.getElementsByClassName("ant-table-body")[0]; if (data.length >= Number(1)) { // 只有当大于10条数据的时候 才会看起滚动 @@ -149,9 +153,9 @@ export default function Xmzlmb() { Math.ceil(v.scrollTop) >= parseFloat((v.scrollHeight - v.clientHeight).toString()) ) { v.scrollTop = 0; - // setTimeout(() => { v.scrollTop = 0 }, 1000) + // setTimeout(() => { v.scrollTop = 0 }, 1000) } - echartsRef.current.getEchartsInstance().setOption(jrxOption(dataSources[index % dataSources.length],dbType)) + echartsRef.current.getEchartsInstance().setOption(jrxOption(dataSources[index % dataSources.length], dbType,dbType1)) index++; }, Number(1000)); setTimer(time); // 定时器保存变量 利于停止 @@ -161,24 +165,7 @@ export default function Xmzlmb() { const [scale, setScale] = useState(1) const scaleRef = useRef(null) scaleRef.current = scale; - // 放大 - const zoomIn = () => { - const img = document.getElementById("img"); - scaleRef.current += 0.05 - // setScale(scaleRef.current) - img.style.transform = `scale(${scaleRef.current})`; - } - - // 缩小 - const zoomOut = () => { - console.log(scaleRef); - const img = document.getElementById("img"); - if (scaleRef.current > 1) { - scaleRef.current -= 0.05 - // setScale(scaleRef.current) - } - img.style.transform = `scale(${scaleRef.current})`; - } + useEffect(() => { if (trData.length > 0 && searchVal) { let params = { @@ -186,30 +173,33 @@ export default function Xmzlmb() { ...searchVal } getTableData(params) - getTable2Data(params) } - + }, [trData, searchVal]); - + useEffect(() => { - if (code) { + if (code.length) { getDmTree() } if (timer) { clearInterval(timer) } - if (dmList.length > 0 && code) { + if (dmList.length > 0 && code.length) { let name = dmList.find(s => s.id == code)?.projNm - let type = name == "大坝B0+060" ? "1" : - name == "大坝B0+090" ? "2" : - name == "大坝B0+120" ? "2" : '' + let type = (name == "大坝B0+130" || name == "大坝B0+132") ? "1" : + (name == "大坝B0+250" || name == "大坝B0+252") ? "2" : + (name == "大坝B0+370" || name == "大坝B0+372") ? "3" : ''; + let type1 = typeName[name]; setDbType(type) + setDbType1(type1) } - }, [code]) + }, [code, dmList]) + + useEffect(() => { getDmList() }, []) - + useEffect(() => { if (swiper && dataSources.length > 0) { InitialScroll(dataSources) @@ -220,12 +210,11 @@ export default function Xmzlmb() { clearInterval(timer); // 停止定时器 } }, [swiper, dataSources]) - - useEffect(()=>{ + useEffect(() => { let scale = 1 const img = document.getElementById("img"); + if (!img) return; const fun = (e) => { - console.log(1111) // 大于0:滚轮向上滚动 小于0:滚轮向下滚动 if (e.wheelDelta > 0) { scale += 0.05; @@ -241,93 +230,78 @@ export default function Xmzlmb() { img.style.transform = `scale(${scale})`; } } - } + } img.addEventListener("wheel",fun) return ()=>{ img.removeEventListener("wheel",fun) } - - },[]) - - return ( -
-
+ + },[loading]) + +return ( +
+
-
-
- { - // clearInterval(timer) - // }} - > - - -
- -
- +
+
+ { + // clearInterval(timer) + // }} + > + + + { + !loading ?
+ +
+ -
-
断面名称:{ dmList.find(s => s.id == code)?.projNm}
- {/*
-
- + -
-
- - -
-
*/} - +
+
断面名称:{dmList.find(s => s.id == code)?.projNm}
+ -
- -
-
- { - return { - onClick:() => {echartsRef.current.getEchartsInstance().setOption(jrxOption(record,dbType))} - } - }} + /> + + + +
+
{ + return { + onClick: () => { echartsRef.current.getEchartsInstance().setOption(jrxOption(record, dbType,dbType1)) } + } + }} /> - - - - - ) + + : + + } + + + +) } diff --git a/src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js b/src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js index 58045d2ba..de909759a 100644 --- a/src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js +++ b/src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js @@ -1,312 +1,268 @@ -export default function jrxOptions(data = {}, type = "1") { - // const yMin = type == "1" ? 147 : type == "2" ? 146 : 146; - // const yMax = type == "1" ? 209 : type == "2" ? 210 : 210; - const yMin = type == "1" ? 70 : type == "2" ? 70 : 70; - const yMax = type == "1" ? 154 : type == "2" ? 150 : 150; - const type1 = ["SY05", "SY06", "SY07", "SY08"] - const type2 = ["SY09","SY10","SY11","SY12"] - const alltype = type == "1" ? type1 : type == "2" ? type2 : type2; - - // 字体颜色 -const textColor = '#666' - const imageUrl060 = `${process.env.PUBLIC_URL}/assets/images/060.png ` - const imageUrl090 = `${process.env.PUBLIC_URL}/assets/images/090.png ` - const imageUrl = type == "1" ? imageUrl060 : - type == "2" ? imageUrl090 : imageUrl090; - const rule = `${process.env.PUBLIC_URL}/assets/images/ruler.png ` - // const xValue = type == "1" ? (((data?.rz - 169) + 0.75 * 14) / 0.75): - // type == "2" ? (((data?.rz - 169) + 0.85 * 14) / 0.85) : (((data?.rz - 169) + 0.85 * 14) / 0.85) - - const xValue = type == "1" ? (((data?.rz - 99) + 1.1 * 13) / 1.1): - type == "2" ? (((data?.rz - 99) + 1 * 14) / 1) : (((data?.rz - 99) + 1 * 14) / 1) +export default function jrxOptions(data = {}, type = "1",typeName='1') { + // debugger + const yMin = type == "3" ? 70 : type == "2" ? 67 : + type == '1' ? 59 : 70; + const yMax = type == "3" ? 129 : type == "2" ? 117 + : type == "1" ? 118 : 150; + const type1 = ["SY01", "SY04", "SY07", "SY16"]; + const type2 = ["SY10", "SY13"]; + const type3 = ["SY02", "SY05", "SY08", "SY17"]; + const type4 = ["SY11", "SY14"]; + const type5 = ["SY03", "SY06", "SY09"]; + const type6 = ["SY12", "SY15"]; + const alltype = typeName == "1" ? type1 : + typeName == "2" ? type2 : + typeName == "3" ? type3 : + typeName == "4" ? type4 : + typeName == "5" ? type5 : + typeName == "6" ? type6 :[] + ; + + // 字体颜色 + const textColor = '#666' + const imageUrl370 = `${process.env.PUBLIC_URL}/assets/images/zb370.png ` + const imageUrl250 = `${process.env.PUBLIC_URL}/assets/images/zb250.png ` + const imageUrl130 = `${process.env.PUBLIC_URL}/assets/images/zb130.png ` + const imageUrl = type == "1" ? imageUrl130 : + type == "2" ? imageUrl250 : + type == "3" ? imageUrl370 : imageUrl370 + ; + const rule = `${process.env.PUBLIC_URL}/assets/images/ruler.png ` + + // rz 是最上面那条线 rz1是那条贴近坝面的线 xValue求解的是最上面那条线的末尾横坐标 + const xValue = type == "3" ? (((data?.rz - 86) + 0.6 * 5) / 0.6) : + type == "2" ? (((data?.rz - 87) + 0.63 * 7) / 0.63) : + type == "1" ? (((data?.rz - 88) + 0.7 * 10) / 0.7) : + (((data?.rz - 99) + 1 * 14) / 1) const rz = data?.rz ? - [[xValue, data?.rz], [0, data?.rz], ] : + [[xValue, data?.rz], [0, data?.rz],] : [] const rz1 = data?.rz ? - type == "1" ? - [[0, 99], [13, 99], [xValue, data?.rz]]: + type == "3" ? + [[0, 86], [5, 86], [xValue, data?.rz]] : type == "2" ? - [[0, 99], [14, 99], [xValue, data?.rz]] - : [[0, 99], [14, 99], [xValue, data?.rz]] - : + [[0, 87], [7, 87], [xValue, data?.rz]] + : + type == "1" ? + [[0, 88], [10, 88], [xValue, data?.rz]] + : + [[0, 99], [14, 99], [xValue, data?.rz]] + : [] + // gz1、gz2、gz3、gz4分别为渗压管 const gz1 = data[alltype[0]] ? - type == "1" ? [[51.6, 85], [51.6, data[alltype[0]]]] : - type == "2" ? [[47.5, 85], [47.5, data[alltype[0]]]] : + type == "3" ? [[47, 101], [47, data[alltype[0]]]] : + type == "2" ? [[45.5, 98], [45.5, data[alltype[0]]]] : + type == "1" ? [[44, 83], [44, data[alltype[0]]]] : [[47.5, 158], [85, data[alltype[0]]]] : []; - // const gz1 = [[51.6, 85],[51.6, 91]]; - // const gz2 = [[53.6, 85], [53.6, 94]]; - - // const gz3 = [[72.5, 90], [72.5, 95]]; - // const gz4 = [[84.5, 96], [84.5, 99]]; - const gz2 = data[alltype[1]] ? - type == "1" ? [[53.6, 85], [53.6, data[alltype[1]]]] : - type == "2" ? [[49.5, 85], [49.5, data[alltype[1]]]] : - [[53.6, 158], [53.6, data[alltype[1]]]] : + type == "3" ? [[51, 101], [51, data[alltype[1]]]] : + type == "2" ? [[50, 98], [50, data[alltype[1]]]] : + type == "1" ? [[51.5, 82], [51.5, data[alltype[1]]]] : + [[53.6, 158], [53.6, data[alltype[1]]]] : []; - + const gz3 = data[alltype[2]] ? - type == "1" ? [[72.5, 90], [72.5, data[alltype[2]]]] : - type == "2" ? [[66.5, 90], [66.5, data[alltype[2]]]] : + type == "3" ? [[58.5, 95], [58.5, data[alltype[2]]]] : + type == "2" ? [[58, 92], [58, data[alltype[2]]]] : + type == "1" ? [[58, 81], [58, data[alltype[2]]]] : [[73, 161], [73, data[alltype[2]]]] : []; + const gz4 = data[alltype[3]] ? - type == "1" ? [[84.5, 96], [84.5, data[alltype[3]]]] : - type == "2" ? [[77, 96], [77, data[alltype[3]]]] : + type == "3" ? [] : + type == "2" ? [[77, 82], [77, data[alltype[3]]]] : + type == "1" ? [[79, 78], [79, data[alltype[3]]]] : [[85, 166], [85, data[alltype[3]]]] : []; + // 将渗压管连起来的线 const line = data?.rz ? - type == "1" ? - [ - [xValue, data?.rz], - [51.6, data[alltype[0]]], - [53.6, data[alltype[1]]], - [72.5, data[alltype[2]]], - [84.5, data[alltype[3]]] + type == "3" ? + [ + [xValue, data?.rz], + [47, data[alltype[0]]], + [51, data[alltype[1]]], + [58.5, data[alltype[2]]], + ] : type == "2" ? - [ - [xValue, data?.rz], - [47.5, data[alltype[0]]], - [49.5, data[alltype[1]]], - [66.5, data[alltype[2]]], - [77, data[alltype[3]]] + [ + [xValue, data?.rz], + [45.5, data[alltype[0]]], + [50, data[alltype[1]]], + [58, data[alltype[2]]], + [77, data[alltype[3]]] ] : + type == "1"? + [ + [xValue, data?.rz], + [44, data[alltype[0]]], + [51.5, data[alltype[1]]], + [58, data[alltype[2]]], + [79, data[alltype[3]]] + ]: [ [xValue, data?.rz], [51.6, data[alltype[0]]], [53.6, data[alltype[1]]], [73, data[alltype[2]]], [85, data[alltype[3]]] - ] - : [] -return { - toolbox: { - show: true, - feature: { - saveAsImage: { - show: true, - excludeComponents: ['toolbox'], - pixelRatio: 2, - name:"测值图" - }, - }, - right: "10%", - top:"4%" + ] + : [] + return { + toolbox: { + show: true, + feature: { + saveAsImage: { + show: true, + excludeComponents: ['toolbox'], + pixelRatio: 2, + name: "测值图" + }, + }, + right: "10%", + top: "4%" }, - // title: { - // show: true, - // text: "断面名称", - // left: 'center', - // bottom: '-5%', - // // textStyle: { - // }, - graphic: [ - { - type: 'image', - // id: 'background', - left: 'center', + // title: { + // show: true, + // text: "断面名称", + // left: 'center', + // bottom: '-5%', + // // textStyle: { + // }, + graphic: [ + { + type: 'image', + // id: 'background', + left: 'center', // top: '11%', top: 0, - bottom:0, - z: 1, - bounding: 'all', - style: { - image: imageUrl, - width: 1100, - height: 380 - } - }, - { - type: 'image', - // id: 'background', - left: '7%', - bottom:"5%", + bottom: 0, z: 1, bounding: 'all', style: { - image: rule, - width: 10, - height: 450 + image: imageUrl, + width: 1100, + height: 380 } - } + }, + { + type: 'image', + // id: 'background', + left: '7%', + bottom: "5%", + z: 1, + bounding: 'all', + style: { + image: rule, + width: 10, + height: 450 + } + } ], - grid: { - // top: '10%', - // left: '2%', - // right: '5%', - // bottom: '10%', - // containLabel: true - top: '0%', - left: '2%', - right: '5%', - bottom: '0%', - containLabel: true - }, - xAxis: { - min: 0, - max:100, - axisLabel: { - show:false, - // 坐标轴字体颜色 - color: textColor, - fontSize: 18 + grid: { + // top: '10%', + // left: '2%', + // right: '5%', + // bottom: '10%', + // containLabel: true + top: '0%', + left: '2%', + right: '5%', + bottom: '0%', + containLabel: true }, - axisLine: { - show:false, - lineStyle: { - color: textColor - } - }, - axisTick: { - // y轴刻度线 - show: false - }, - splitLine: { - // 网格 - show: false - }, - boundaryGap: false - }, - yAxis: { - type: 'value', - min: yMin, - max: yMax, - interval:5, - // data:[155,160,180,190,210], - nameTextStyle: { - color: '#333', - fontSize: 18, - padding: [0, 0, 0, 80] - }, - axisLabel: { - // 坐标轴字体颜色 - color: textColor, - fontSize: 18, - formatter: function (value, index,i) { - if (index === 0 || value === yMax) { - return ''; // 隐藏第一个刻度和最后一个刻度 - } else { - return value; // 显示其他刻度 - } - } - }, - axisLine: { - show: false - }, - axisTick: { - // y轴刻度线 - show: false - }, - splitLine: { - // 网格 - show: false, - lineStyle: { - color: '#CCCCCC', - type: 'dashed' - } - } - }, - - series: [ - // 和大坝坡面重合的线 斜率为0.75 - { - - type: 'line', - symbol: 'none', - symbolSize: 10, - z: 1, - itemStyle: { - color: '#fff' + xAxis: { + min: 0, + max: 100, + axisLabel: { + show: false, + // 坐标轴字体颜色 + color: textColor, + fontSize: 18 }, - lineStyle: { - color: '#fff' - }, - areaStyle: { - origin: "end", - color: 'rgba(0, 128, 255, 0.3)' // 设置区域填充颜色 - }, - data:[...rz,...rz1] - - }, - { - - type: 'line', - symbol: 'none', - symbolSize: 10, - z: 1, - itemStyle: { - color: '#5487FF' - }, - lineStyle: { - color: '#5487FF' - }, - markPoint: { - data: [{ type: 'max',x:"20%", coord: [xValue, data?.rz] }], - symbol: 'pin', - symbolSize: [30, 10], - itemStyle: { - color: '#fff', // 标注点颜色 - borderColor: '#ffa500', // 标注点边框颜色 - borderWidth: 0 // 标注点边框宽度 - }, - label: { - show: data?.rz ? true : false, // 是否显示标签 - formatter: "库水位" +data?.rz + "m", // 标签格式 - color: '#5487FF', // 标签文字颜色 - fontSize: 12, // 标签文字大小 + axisLine: { + show: false, + lineStyle: { + color: textColor } - }, - data:rz - }, - { - - type: 'line', - symbol: 'none', - symbolSize: 10, - z: 1, - itemStyle: { - color: '#5487FF' }, - lineStyle: { - color: '#5487FF' + axisTick: { + // y轴刻度线 + show: false }, - data:rz1 - }, - // 管位 - { - type: 'line', - symbol: 'none', - symbolSize: 10, - z: 1, - itemStyle: { - color: '#5487FF' - }, - lineStyle: { - color: '#5487FF', - width:6 - }, - data: gz1 - }, - { - type: 'line', - symbol: 'none', - symbolSize: 10, - z: 1, - itemStyle: { - color: '#5487FF' - }, - lineStyle: { - color: '#5487FF', - width:6 - }, - data: gz2 - }, - { + splitLine: { + // 网格 + show: false + }, + boundaryGap: false + }, + yAxis: { + type: 'value', + min:yMin, + max: yMax, + interval: 5, + // data:[155,160,180,190,210], + nameTextStyle: { + color: '#333', + fontSize: 18, + padding: [0, 0, 0, 80] + }, + axisLabel: { + // 坐标轴字体颜色 + color: textColor, + fontSize: 18, + formatter: function (value, index, i) { + if (index === 0 || value === yMax) { + return ''; // 隐藏第一个刻度和最后一个刻度 + } else { + return value; // 显示其他刻度 + } + } + }, + axisLine: { + show: false + }, + axisTick: { + // y轴刻度线 + show: false + }, + splitLine: { + // 网格 + show: true, + lineStyle: { + color: '#CCCCCC', + type: 'dashed' + } + } + }, + + series: [ + // 和大坝坡面重合的线 斜率为0.75 + { + + type: 'line', + symbol: 'none', + symbolSize: 10, + z: 1, + itemStyle: { + color: '#fff' + }, + lineStyle: { + color: '#fff' + }, + areaStyle: { + origin: "end", + color: 'rgba(0, 128, 255, 0.3)' // 设置区域填充颜色 + }, + data: [...rz, ...rz1] + + }, + { + type: 'line', symbol: 'none', symbolSize: 10, @@ -315,12 +271,84 @@ return { color: '#5487FF' }, lineStyle: { - color: '#5487FF', - width:6 + color: '#5487FF' + }, + markPoint: { + data: [{ type: 'max', x: "20%", coord: [xValue, data?.rz] }], + symbol: 'pin', + symbolSize: [30, 10], + itemStyle: { + color: '#fff', // 标注点颜色 + borderColor: '#ffa500', // 标注点边框颜色 + borderWidth: 0 // 标注点边框宽度 + }, + label: { + show: data?.rz ? true : false, // 是否显示标签 + formatter: "库水位" + data?.rz + "m", // 标签格式 + color: '#5487FF', // 标签文字颜色 + fontSize: 12, // 标签文字大小 + } + }, + data: rz + }, + { + + type: 'line', + symbol: 'none', + symbolSize: 10, + z: 1, + itemStyle: { + color: '#5487FF' + }, + lineStyle: { + color: '#5487FF' + }, + data: rz1 + }, + // 管位 + { + type: 'line', + symbol: 'none', + symbolSize: 10, + z: 1, + itemStyle: { + color: '#5487FF' + }, + lineStyle: { + color: '#5487FF', + width: 6 + }, + data: gz1 + }, + { + type: 'line', + symbol: 'none', + symbolSize: 10, + z: 1, + itemStyle: { + color: '#5487FF' + }, + lineStyle: { + color: '#5487FF', + width: 6 + }, + data: gz2 + }, + { + type: 'line', + symbol: 'none', + symbolSize: 10, + z: 1, + itemStyle: { + color: '#5487FF' + }, + lineStyle: { + color: '#5487FF', + width: 6 }, data: gz3 - }, - { + }, + { type: 'line', symbol: 'none', symbolSize: 10, @@ -329,13 +357,13 @@ return { color: '#5487FF' }, lineStyle: { - color: '#5487FF', - width:6 + color: '#5487FF', + width: 6 }, data: gz4 - }, - // 管位连接线 - { + }, + // 管位连接线 + { type: 'line', symbol: 'none', symbolSize: 10, @@ -344,11 +372,11 @@ return { color: '#5487FF' }, lineStyle: { - color: '#5487FF', + color: '#5487FF', }, data: line - }, - ] -}; + }, + ] + }; } \ No newline at end of file diff --git a/src/views/rcgl/byfz/bypc/index.js b/src/views/rcgl/byfz/bypc/index.js index 41e0d6977..030abf020 100644 --- a/src/views/rcgl/byfz/bypc/index.js +++ b/src/views/rcgl/byfz/bypc/index.js @@ -1,6 +1,6 @@ import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react'; import BasicCrudModal from '../../../../components/crud/BasicCrudModal'; -import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image } from 'antd'; +import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image,Tag } from 'antd'; import {FileWordOutlined,FilePdfOutlined,FileZipOutlined,FileExcelOutlined } from '@ant-design/icons'; import { useSelector } from 'react-redux'; import ToolBar from './toolbar'; @@ -8,14 +8,22 @@ import ModalForm from './form'; import apiurl from '../../../../service/apiurl'; import usePageTable from '../../../../components/crud/usePageTable2'; import { createCrudService } from '../../../../components/crud/_'; +import { httppost2 } from '../../../../utils/request'; import {CrudOpRender_text} from '../../../../components/crud/CrudOpRender'; - +import './index.less'; const url = "http://223.75.53.141:9102/test.by-lyf.tmp" const Page = () => { const role = useSelector(state => state.auth.role); const editBtn = role?.rule?.find(item => item.menuName == "编辑") || true; const viewBtn = role?.rule?.find(item => item.menuName == "查看")|| true; - const delBtn = role?.rule?.find(item => item.menuName == "删除")|| true; + const delBtn = role?.rule?.find(item => item.menuName == "删除") || true; + + const [stats, setStats] = useState({ + total: 400, + withMosquito: 14, + withoutMosquito: 382, + noData: 4 + }); const surveyType = { 1: "日常检查排查", 2: "定期普查", @@ -33,40 +41,81 @@ const Page = () => { } const refModal = useRef(); const [searchVal, setSearchVal] = useState({}) - const columns = [ - { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" }, - {title: '填报日期', key: 'reportDate', dataIndex: 'reportDate', width: 140,}, - { - title: '普查类型', key: 'surveyType', dataIndex: 'surveyType', width: 200, - render: (value) => {value ? surveyType[value] : ''} - }, - { - title: '普查方式', key: 'surveyWay', dataIndex: 'surveyWay', width: 200, - render: (value) => {value ? surveyWay[value] : ''} + const [count, setCount] = useState({}) + // const columns = [ + // { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" }, + // {title: '填报日期', key: 'reportDate', dataIndex: 'reportDate', width: 140,}, + // { + // title: '普查类型', key: 'surveyType', dataIndex: 'surveyType', width: 200, + // render: (value) => {value ? surveyType[value] : ''} + // }, + // { + // title: '普查方式', key: 'surveyWay', dataIndex: 'surveyWay', width: 200, + // render: (value) => {value ? surveyWay[value] : ''} + // }, + // { + // title: '危害情况', key: 'isHarm', dataIndex: 'isHarm', width: 200, + // render: (value, row) =>( + // 0 ? { color: "red" } : {}}>{isHarm[row.harmNum > 0 ? 1 : 0]}) + // }, + // {title: '白蚁危害处数', key: 'harmNum', dataIndex: 'harmNum', width: 100}, + // {title: '已处置处数', key: 'handleNum', dataIndex: 'handleNum', width: 100}, + // {title: '上报人', key: 'reportUserName', dataIndex: 'reportUserName', width: 100}, + // { + // title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center', + // render: (value, row, index) => ( + // () => command(cmd)(row)} />) + // }, + // ]; + + const columns = [ + { + title: '监测时间', + dataIndex: 'reportDate', + key: 'reportDate', + width: 180, + align:'center' }, { - title: '危害情况', key: 'isHarm', dataIndex: 'isHarm', width: 200, - render: (value, row) =>( - 0 ? { color: "red" } : {}}>{isHarm[row.harmNum > 0 ? 1 : 0]}) + title: '测点编号', + dataIndex: 'pileNumber', + key: 'pileNumber', + width: 120, + align:'center' }, - {title: '白蚁危害处数', key: 'harmNum', dataIndex: 'harmNum', width: 100}, - {title: '已处置处数', key: 'handleNum', dataIndex: 'handleNum', width: 100}, - {title: '上报人', key: 'reportUserName', dataIndex: 'reportUserName', width: 100}, { - title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center', - render: (value, row, index) => ( - () => command(cmd)(row)} />) - }, + title: '有无白蚁', + dataIndex: 'isHarm', + align:'center', + key: 'isHarm', + width: 100, + render:(text, record) => { + // 如果 isHarm 为 null 或 undefined，显示无 + if (text == null) { + return 无; + } + + // 如果 isHandle 为 null 或 undefined，当作 false 处理 + const isHandle = record.isHandle ?? false; + + return ( + + {text ? (isHandle ? '无' : '有') : '无'} + + ); + } + } ]; - - const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]); - + const command = (type) => (params) => { if (type === 'save') { refModal.current.showSave(); @@ -88,7 +137,27 @@ const Page = () => { */ const successCallback = () => { refresh() -} + } + + // 获取白蚁统计数量 + const getCount = async () => { + const params = { + pageSo: { + pageNumber: 1, + pageSize: 99999, + } + } + try { + const res = await httppost2(apiurl.rcgl.byfz.bypc.count, params); + setCount(res.data); + } catch (error) { + console.log(error); + + } + } + useEffect(() => { + getCount(); + }, []) useEffect(() => { if (searchVal) { const params = { @@ -104,12 +173,50 @@ const Page = () => { return ( <>
-
+
+ +
+
+
+ {count.totalPoint} + 个 +
+ 总监测点数 +
+ + +
+
+ {count.hasAnt} + 个 +
+ 有白蚁 +
+ + +
+
+ {count.notAnt} + 个 +
+ 无白蚁 +
+ + +
+
+ {count.noData} + 个 +
+ 无数据 +
+ +
diff --git a/src/views/rcgl/byfz/bypc/index.less b/src/views/rcgl/byfz/bypc/index.less index e0bd72879..1c3be22ef 100644 --- a/src/views/rcgl/byfz/bypc/index.less +++ b/src/views/rcgl/byfz/bypc/index.less @@ -1,30 +1,33 @@ -.basic-info{ - position: relative; - font-size: 16px; - margin-bottom: 20px; - padding:5px 25px; - border-bottom: 1px solid #eee; - &::before{ - position: absolute; - top:8px; - left:0; - content: ""; - display: block; - width: 5px; - height: 20px; - background-color: #0079fe; - } -} -.time-line{ - width: 50%; - margin-left: 6%; - margin-top: 1%; - .time-line-item{ +.statsRow { + display: flex; + justify-content: space-between; + margin-bottom: 24px; + padding: 16px; + + .statItem { display: flex; - // align-items: center; - column-gap: 20px; - .item-right{ - flex:1 - } - } + flex-direction: column; + text-align: center; + align-items: center; + .unit { + font-size: 14px; + margin-right: 8px; + color: rgba(0, 0, 0, 0.65); + } + .valueWrapper { + display: flex; + align-items: baseline; + } + .number { + display: block; + font-size: 32px; + font-weight: 600; + + } + + .label { + color: rgba(0, 0, 0, 0.65); + font-size: 16px; + } + } } \ No newline at end of file diff --git a/src/views/rcgl/byfz/bypc/toolbar.js b/src/views/rcgl/byfz/bypc/toolbar.js index 320c1e47f..97a4ab865 100644 --- a/src/views/rcgl/byfz/bypc/toolbar.js +++ b/src/views/rcgl/byfz/bypc/toolbar.js @@ -5,17 +5,17 @@ import moment from 'moment'; import NormalSelect from '../../../../components/Form/NormalSelect'; const { RangePicker } = DatePicker; const ToolBar = ({ setSearchVal, onSave, storeData, role }) => { - const addBtn = role?.rule?.find(item => item.menuName == "新增")|| true; - const searchBtn = role?.rule?.find(item => item.menuName == "查询")|| true; + // const addBtn = role?.rule?.find(item => item.menuName == "新增")|| true; + // const searchBtn = role?.rule?.find(item => item.menuName == "查询")|| true; const [form] = Form.useForm(); const onFinish = (values) => { let dateSo; if (values.year) { - dateSo = moment(values.year).format('YYYY') + dateSo = moment(values.year).format('YYYY-MM-DD') } delete values.year - setSearchVal({...values, year:Number(dateSo)}); + setSearchVal({...values, searchDate:dateSo}); } // useEffect(() => { @@ -31,29 +31,27 @@ const ToolBar = ({ setSearchVal, onSave, storeData, role }) => { <>
- + - + + + + {/* - - {searchBtn ? + */} + - : null } - { - (onSave && addBtn) ? - - - - :null - } +
diff --git a/src/views/rcgl/xcxj/xjrw/detailForm.js b/src/views/rcgl/xcxj/xjrw/detailForm.js index b35dddc2e..42d71aa9d 100644 --- a/src/views/rcgl/xcxj/xjrw/detailForm.js +++ b/src/views/rcgl/xcxj/xjrw/detailForm.js @@ -425,7 +425,7 @@ console.log(record);
diff --git a/src/views/rcgl/xcxj/xjrw/form.js b/src/views/rcgl/xcxj/xjrw/form.js index 16ef5b328..5fe7efb0e 100644 --- a/src/views/rcgl/xcxj/xjrw/form.js +++ b/src/views/rcgl/xcxj/xjrw/form.js @@ -20,9 +20,9 @@ const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => { const [itemParams, setItemParams] = useState([]) const [list, setList] = useState([]) const taskTypes = [ - {label:"日常巡查",value:0}, - {label:"特别检查",value:1}, - {label:"汛前巡检",value:2}, + {label:"日常巡查",value:1}, + {label:"特别检查",value:2}, + {label:"汛前巡检",value:3}, ] const [form] = Form.useForm(); diff --git a/src/views/rcgl/xcxj/xjwtcl/form.js b/src/views/rcgl/xcxj/xjwtcl/form.js index 62c9cae82..9bb3f3aa3 100644 --- a/src/views/rcgl/xcxj/xjwtcl/form.js +++ b/src/views/rcgl/xcxj/xjwtcl/form.js @@ -268,7 +268,7 @@ console.log(record); > { - handleImgfileList.length > 0 && handleImgfileList.map(file => { + handleImgfileList?.length > 0 && handleImgfileList.map(file => { return (
@@ -295,7 +295,7 @@ console.log(record); > { - handleVideoFileList.length > 0 && handleVideoFileList.map(file => { + handleVideoFileList?.length > 0 && handleVideoFileList.map(file => { return (
diff --git a/src/views/rcgl/xcxj/xjxpz/AdcdTreeSelector/index.tsx b/src/views/rcgl/xcxj/xjxpz/AdcdTreeSelector/index.tsx index a15a10f64..ba649331b 100644 --- a/src/views/rcgl/xcxj/xjxpz/AdcdTreeSelector/index.tsx +++ b/src/views/rcgl/xcxj/xjxpz/AdcdTreeSelector/index.tsx @@ -74,6 +74,9 @@ const AdcdTreeSelector: React.FC = ({ onSelectFun, setAdcd, showCheckbox setTreeData(adcdTreedata); setLoading(false); setOrderMax(Math.max(...adcdTreedata.map((item:any) => item?.orderIndex))) + } else { + setLoading(false); + setTreeData([]); } }; // @ts-ignore diff --git a/src/views/rcgl/zmjk/ModalContent.js b/src/views/rcgl/zmjk/ModalContent.js new file mode 100644 index 000000000..4ddc22ba2 --- /dev/null +++ b/src/views/rcgl/zmjk/ModalContent.js @@ -0,0 +1,65 @@ +import React,{useState,useEffect} from 'react' +import {Card,Table} from 'antd' +import ModalToolBar from './ModalToolBar'; +import { httppost5 } from '../../../utils/request'; +import { exportFile } from '../../../utils/tools'; +import apiurl from '../../../service/apiurl'; +export default function ModalContent() { + const columns = [ + { + title: '序号', + key: 'inx', + width: 80, + render: (r, i) => {i + 1} + }, + { + title: '闸门名称', + key: 'project', + width: 150, + }, + { + title: '操作内容', + key: 'project', + width: 150, + }, + { + title: '操作结果', + key: 'project', + width: 150, + } + , + { + title: '操作时间', + key: 'project', + width: 150, + } + ] + const [searchVal, setSearchVal] = useState(false) + + const exportExcel = () => { + let params = { + ...searchVal, + // pageSo: { + // pageNumber: tableProps.pagination.current, + // pageSize:tableProps.pagination.pageSize + // } + } + httppost5(apiurl.gcaqjc.sjtjcx.ndsytjb.export, params).then(res => { + exportFile(`闸门操作记录.xlsx`,res.data) + }) + } + return ( +
+ + + + +
+
+ + + ) +} diff --git a/src/views/rcgl/zmjk/ModalToolBar.js b/src/views/rcgl/zmjk/ModalToolBar.js new file mode 100644 index 000000000..69d405e47 --- /dev/null +++ b/src/views/rcgl/zmjk/ModalToolBar.js @@ -0,0 +1,118 @@ +import React, { useEffect, useState } from 'react'; +import { Form, Input, Button, DatePicker } from 'antd'; + +import moment from 'moment'; +import NormalSelect from '../../../components/Form/NormalSelect'; +const { RangePicker } = DatePicker; +const ToolBar = ({ setSearchVal, exportFile }) => { + const optionsType = [ + { + label: "今日", + value: 1 + }, + { + label: "近一周", + value: 2 + }, + { + label: "近一月", + value: 3 + }, + { + label: "近三月", + value: 4 + }, + { + label: "近一年", + value: 5 + }, + ] + const types = [ + { label: "主坝", value: 1 }, + { label: "副坝", value: 2 }, + { label: "灌溉发电洞", value: 3 }, + + ] + const [form] = Form.useForm(); + + const onFinish = (values) => { + let dateTimeSo; + if (values.tm) { + dateTimeSo = { + start: moment(values.tm[0]).format('YYYY-MM-DD 00:00:00'), + end: moment(values.tm[1]).format('YYYY-MM-DD 00:00:00') + } + } + delete values.tm + setSearchVal({ ...values, dateTimeSo }); + } + + const onValuesChange = (e) => { + switch (e.ranger) { + case 1: + form.setFieldValue("tm",[moment().startOf("day"),moment()]) + break; + case 2: + form.setFieldValue("tm",[moment().subtract(7, 'days'),moment()]) + break; + case 3: + form.setFieldValue("tm",[moment().subtract(1, 'months'),moment()]) + break; + case 4: + form.setFieldValue("tm",[moment().subtract(3, 'months'),moment()]) + break; + case 5: + form.setFieldValue("tm",[moment().subtract(1, 'years'),moment()]) + break; + default: + break; + } + + } + useEffect(() => { + let dateTimeSo = { + start: moment().subtract(1, "years").format('YYYY-MM-DD 00:00:00'), + end: moment().format('YYYY-MM-DD 00:00:00') + } + form.setFieldValue("tm", [moment(dateTimeSo.start), moment(dateTimeSo.end)]) + setSearchVal({ dateTimeSo }) + }, []) + + return ( + <> +
+
+ + + + + + + + + + + + + + + + + + + + +
+ + ); +} + +export default ToolBar; \ No newline at end of file diff --git a/src/views/rcgl/zmjk/index.js b/src/views/rcgl/zmjk/index.js index b61dbb66f..8de4d3acc 100644 --- a/src/views/rcgl/zmjk/index.js +++ b/src/views/rcgl/zmjk/index.js @@ -1,5 +1,6 @@ import React, { useEffect, useMemo, useState } from 'react' -import { Modal, Tabs, Descriptions, Image } from 'antd'; +import { Modal, Tabs, Descriptions, Image, Divider, Table } from 'antd'; +import {DoubleRightOutlined} from '@ant-design/icons' import { Stage } from 'react-konva'; import Sider from './Sider'; import Topper1 from './Topper1'; @@ -11,11 +12,12 @@ import HFivePlayer from '../../../components/video1Plary' import './index.less'; import { httpget, httpget2, httppost2 } from '../../../utils/request'; import apiurl from '../../../service/apiurl'; +import ModalContent from './ModalContent'; const url = "http://223.75.53.141:9102/test.by-lyf.tmp" const CanvasW = 1080 const CanvasH = 640 // const waterRatio = 0 -const zmobj ={ +const zmobj = { "hpCode": "HP0074208040002120", "stcd": "4265630075", "ctrlType": "PLC", @@ -44,84 +46,11 @@ const zmobj ={ "lgtd": 112.242945, "lttd": 30.848166, "runtime": [ - null, - { - "stcd": "4265630075", - "gateNumber": 1, - "realAperture": 376, - "setAperture": 0, - "sensorLever": null, - "altitudeLever": null, - "remoteSignal": 0, - "powerSignal": 0, - "openingSignal": 0, - "closeingSignal": 0, - "errorSignal": 0, - "openedSignal": 0, - "closedSignal": 0, - "tm": "2024-09-25 20:03:26", - "_online": true - }, - { - "stcd": "4265630075", - "gateNumber": 2, - "realAperture": 388, - "setAperture": 0, - "sensorLever": null, - "altitudeLever": null, - "remoteSignal": 0, - "powerSignal": 0, - "openingSignal": 0, - "closeingSignal": 0, - "errorSignal": 0, - "openedSignal": 0, - "closedSignal": 0, - "tm": "2024-09-25 20:03:26", - "_online": true - }, - { - "stcd": "4265630075", - "gateNumber": 3, - "realAperture": 394, - "setAperture": 0, - "sensorLever": null, - "altitudeLever": null, - "remoteSignal": 0, - "powerSignal": null, - "openingSignal": 0, - "closeingSignal": 0, - "errorSignal": 0, - "openedSignal": 0, - "closedSignal": 0, - "tm": "2024-09-25 20:03:26", - "_online": true - } - ], - "real": { - "stcd": "4265630075", - "stationName": "五岭包节制闸", - "z1": null, - "zz1": null, - "z1tm": null, - "z2": null, - "zz2": null, - "z2tm": null, - "hq": null, - "hqtm": null, - "demtl": null - }, - "cctvs": [], - "_idx": 88, - "_fav": false, - "_sort": 10086 -} - -const runtime = [ - null, - { + null, + { "stcd": "4265630075", "gateNumber": 1, - "realAperture": 976, + "realAperture": 376, "setAperture": 0, "sensorLever": null, "altitudeLever": null, @@ -132,9 +61,10 @@ const runtime = [ "errorSignal": 0, "openedSignal": 0, "closedSignal": 0, - "tm": "2024-09-25 20:03:31" - }, - { + "tm": "2024-09-25 20:03:26", + "_online": true + }, + { "stcd": "4265630075", "gateNumber": 2, "realAperture": 388, @@ -148,9 +78,10 @@ const runtime = [ "errorSignal": 0, "openedSignal": 0, "closedSignal": 0, - "tm": "2024-09-25 20:03:31" - }, - { + "tm": "2024-09-25 20:03:26", + "_online": true + }, + { "stcd": "4265630075", "gateNumber": 3, "realAperture": 394, @@ -164,24 +95,154 @@ const runtime = [ "errorSignal": 0, "openedSignal": 0, "closedSignal": 0, - "tm": "2024-09-25 20:03:31" + "tm": "2024-09-25 20:03:26", + "_online": true + } + ], + "real": { + "stcd": "4265630075", + "stationName": "五岭包节制闸", + "z1": null, + "zz1": null, + "z1tm": null, + "z2": null, + "zz2": null, + "z2tm": null, + "hq": null, + "hqtm": null, + "demtl": null + }, + "cctvs": [], + "_idx": 88, + "_fav": false, + "_sort": 10086 +} + +const runtime = [ + null, + { + "stcd": "4265630075", + "gateNumber": 1, + "realAperture": 976, + "setAperture": 0, + "sensorLever": null, + "altitudeLever": null, + "remoteSignal": 0, + "powerSignal": 0, + "openingSignal": 0, + "closeingSignal": 0, + "errorSignal": 0, + "openedSignal": 0, + "closedSignal": 0, + "tm": "2024-09-25 20:03:31" + }, + { + "stcd": "4265630075", + "gateNumber": 2, + "realAperture": 388, + "setAperture": 0, + "sensorLever": null, + "altitudeLever": null, + "remoteSignal": 0, + "powerSignal": 0, + "openingSignal": 0, + "closeingSignal": 0, + "errorSignal": 0, + "openedSignal": 0, + "closedSignal": 0, + "tm": "2024-09-25 20:03:31" + }, + { + "stcd": "4265630075", + "gateNumber": 3, + "realAperture": 394, + "setAperture": 0, + "sensorLever": null, + "altitudeLever": null, + "remoteSignal": 0, + "powerSignal": null, + "openingSignal": 0, + "closeingSignal": 0, + "errorSignal": 0, + "openedSignal": 0, + "closedSignal": 0, + "tm": "2024-09-25 20:03:31" } ] const myType = { // 闸前水位站 2闸后水位站 3流量站 - '1':'闸前水位/水深(m)', - '2':'闸后水位/水深(m)', - '3':'流量 (m³/s)', + '1': '闸前水位/水深(m)', + '2': '闸后水位/水深(m)', + '3': '流量 (m³/s)', } const Page = () => { - const [itemIndex,setItemIndex] = useState(null) - const [waterRatio,setWaterRatio] = useState(0) - const [data,setData] = useState({}) - const [list, setList ] = useState([]) - const [damList, setDamList ] = useState([]) - const [videoList, setVideoList ] = useState([]) + + const jcColumns = [ + { + title: '项目', + key: 'project', + width: 150, + }, + { + title: '实时数据', + key: 'project', + width: 150, + }, + { + title: '数据采集时间', + key: 'project', + width: 150, + } + ] + + const zfColumns = [ + { + title: '闸阀名称', + key: 'project', + width: 150, + }, + { + title: '当前开关状态', + key: 'project', + width: 150, + }, + { + title: '数据采集时间', + key: 'project', + width: 150, + } + ] + + const jlColumns = [ + { + title: '闸阀名称', + key: 'project', + width: 150, + }, + { + title: '操作内容', + key: 'project', + width: 150, + }, + { + title: '操作结果', + key: 'project', + width: 150, + }, + { + title: '操作时间', + key: 'project', + width: 150, + } + ] + const [itemIndex, setItemIndex] = useState(null) + const [waterRatio, setWaterRatio] = useState(0) + const [data, setData] = useState({}) + const [list, setList] = useState([]) + const [damList, setDamList] = useState([]) + const [videoList, setVideoList] = useState([]) const [videoArr, setvideoArr] = useState({}) const [open, setOpen] = useState(false) @@ -191,42 +252,42 @@ const Page = () => { const pts = contextCoordinates(xunit, hole); const eqpnoList = useMemo(() => damList ? new Array(damList.length).fill(0).map((o, index) => index) : [], [damList]); - useEffect(()=>{ + useEffect(() => { getList() - },[]) + }, []) - const getList = async()=>{ - const {code, data} = await httppost2(apiurl.zmjk.getList) - if(code!==200){ + const getList = async () => { + const { code, data } = await httppost2(apiurl.zmjk.getList) + if (code !== 200) { return } - const obj = data[0]||{} + const obj = data[0] || {} getInformation(obj.gateCode) getDamData(obj.stcd) getVideo(obj.gateCode) setData(obj) } - const getInformation = async(gateCode)=>{ - const {code, data} = await httpget2(apiurl.zmjk.getInformation,{gateCode}) - if(code!==200){ + const getInformation = async (gateCode) => { + const { code, data } = await httpget2(apiurl.zmjk.getInformation, { gateCode }) + if (code !== 200) { return } - data.map((item)=>{ - if(item.type===2){ - setWaterRatio(item.value/5||0) + data.map((item) => { + if (item.type === 2) { + setWaterRatio(item.value / 5 || 0) } }) setList(data) } - const getDamData = async(stcd)=>{ - const {code, data} = await httpget2(apiurl.zmjk.getDamData,{stcd}) - if(code!==200){ + const getDamData = async (stcd) => { + const { code, data } = await httpget2(apiurl.zmjk.getDamData, { stcd }) + if (code !== 200) { return } - const list = [] - data.map((item)=>{ + const list = [] + data.map((item) => { list.push({ ...item }) @@ -234,38 +295,71 @@ const Page = () => { setDamList(list) } - const getVideo = async(valveCode)=>{ - const {code, data} = await httppost2(apiurl.zmjk.getVideo,{valveCode}) - if(code!==200){ + const getVideo = async (valveCode) => { + const { code, data } = await httppost2(apiurl.zmjk.getVideo, { valveCode }) + if (code !== 200) { return } setVideoList(data) + getVideoSrc(data[0]?.indexCode) } const getVideoSrc = async (current) => { const res = await httpget2(`${apiurl.gsxl.zfzl.videosrc}${current}`)//32023a7f27d8448fa10511f24e96acff if (res.code == 200 && res.data?.length !== 0) { - setvideoArr({src:res.data}) - }else{ + setvideoArr({ src: res.data }) + } else { setvideoArr({}) } } - const getNum = (a,b)=>{ - const aa = Number(a||0) - const bb = Number(b||0) - const num = Number(aa-bb).toFixed(3) + const getNum = (a, b) => { + const aa = Number(a || 0) + const bb = Number(b || 0) + const num = Number(aa - bb).toFixed(3) return num } return ( <> -
-
+
+
{/* */}
- +
+
+ + 闸阀监控 +
+
+
record.id} + dataSource={[]} + pagination={false} + /> + +
+
+ 最近操作记录
+
setOpen(true)}> +
+ 查看更多信息 + +
+
+
+
+
record.id} + dataSource={[]} + pagination={false} + /> + + + {/*
@@ -302,12 +396,14 @@ const Page = () => { }
- - + */} +
-
视频监控
+
+ + 监控视频
-
+ {/*
{ videoList.map((item,index)=>(
{setItemIndex(index);getVideoSrc(item.indexCode)}}> @@ -315,20 +411,20 @@ const Page = () => {
)) } -
+
*/}
{ - videoArr?.src && + videoArr?.src &&
{ - // if (controlerParams.type == 1) { - // setVideoOpen(true) - // setIsShow(!isShow) - // } - }} - > + className="content-video" + style={{ width: '100%', height: '100%', cursor: "pointer" }} + onClick={() => { + // if (controlerParams.type == 1) { + // setVideoOpen(true) + // setIsShow(!isShow) + // } + }} + > {/*
注：单击视频显示/隐藏云台
*/}
@@ -337,9 +433,17 @@ const Page = () => {
-
监测数据
-
- { +
+ + 监测数据
+
+
record.id} + dataSource={[]} + pagination={false} + /> + {/* { list?.map((item)=>{ if(item.type===1){ return ( @@ -367,45 +471,46 @@ const Page = () => { ) } }) - } + } */} -
setOpen(true)}>查看更多信息
- + {/*
setOpen(true)}>查看更多信息
*/} + { setOpen(false) }} > -
- +
+ + {/* - {{1:'卷扬式',2:'螺杆式',3:'凹轮式',4:'涡轮式',5:'丝杆式'}?.[data?.hdgrTp]||'-'} - {{1:'手动',2:'电动',3:'手电两用'}?.[data?.pwrTp]||'-'} - {{1:'分（泄）洪闸',2:'节制闸',3:'排（退）水闸',4:'引（进）水闸',5:'挡潮闸',6:'船闸',9:'其他'}?.[data?.wagaType]||'-'} - {data?.inEle||'-'} m - {data?.outEle||'-'} m - {data?.gaorNum||'-'} 孔 - {data?.dsfl||'-'} m³/s - {data?.stfl||'-'} m³/s - {data?.gateSize||'-'} m*m - {{1:'Ⅰ',2:'Ⅱ',3:'Ⅲ',4:'Ⅳ',5:'Ⅴ'}?.[data?.engGrad]||'-'} - {{1:'在用良好',2:'在用故障',3:'停用'}?.[data?.runStat]||'-'} - {data?.compDate||'-'} + {{ 1: '卷扬式', 2: '螺杆式', 3: '凹轮式', 4: '涡轮式', 5: '丝杆式' }?.[data?.hdgrTp] || '-'} + {{ 1: '手动', 2: '电动', 3: '手电两用' }?.[data?.pwrTp] || '-'} + {{ 1: '分（泄）洪闸', 2: '节制闸', 3: '排（退）水闸', 4: '引（进）水闸', 5: '挡潮闸', 6: '船闸', 9: '其他' }?.[data?.wagaType] || '-'} + {data?.inEle || '-'} m + {data?.outEle || '-'} m + {data?.gaorNum || '-'} 孔 + {data?.dsfl || '-'} m³/s + {data?.stfl || '-'} m³/s + {data?.gateSize || '-'} m*m + {{ 1: 'Ⅰ', 2: 'Ⅱ', 3: 'Ⅲ', 4: 'Ⅳ', 5: 'Ⅴ' }?.[data?.engGrad] || '-'} + {{ 1: '在用良好', 2: '在用故障', 3: '停用' }?.[data?.runStat] || '-'} + {data?.compDate || '-'} - + */}
diff --git a/src/views/rcgl/zmjk/index.less b/src/views/rcgl/zmjk/index.less index b97ba316a..3cc8c83cf 100644 --- a/src/views/rcgl/zmjk/index.less +++ b/src/views/rcgl/zmjk/index.less @@ -2,12 +2,24 @@ .ant-card-body{ display: flex; height: 100%; + column-gap: 20px; .sg_zmjk_left{ - top: 30px; + // top: 30px; position: relative; - width: 1080px; - height: 640px; - transform: scale(0.9,1); + width: 930px; + // height: 640px; + .sg_zmjk_left_title{ + height: 35px; + line-height: 35px; + border-bottom: 1px solid #bbb; + font-weight: 600; + font-size: 18px; + } + .sz_left_up_table{ + margin-top: 10px; + // height: 355px; + } + } .sg_zmjk_right{ @@ -19,16 +31,18 @@ .sg_zmjk_right_video{ height: 400px; - margin: 30px 20px 30px -30px; + // margin: 30px 20px 30px -30px; border-radius: 5px; - border: 1px solid #bbb; + // border: 1px solid #bbb; display: flex; flex-direction: column; .sg_zmjk_right_video_title{ height: 35px; line-height: 35px; - padding-left: 10px; + // padding-left: 10px; border-bottom: 1px solid #bbb; + font-weight: 600; + font-size: 18px; } .sg_zmjk_right_video_content{ flex: 1; @@ -57,7 +71,7 @@ } } .sg_zmjk_right_video_content_right{ - flex: 1; + width: 100%; height: 100%; padding: 10px; } @@ -65,14 +79,16 @@ } .sg_zmjk_right_information{ height: 180px; - margin: -10px 20px 30px -30px; + // margin: -10px 20px 30px -30px; border-radius: 5px; - border: 1px solid #bbb; + // border: 1px solid #bbb; .sg_zmjk_right_information_title{ height: 35px; line-height: 35px; - padding-left: 10px; + // padding-left: 10px; border-bottom: 1px solid #bbb; + font-weight: 600; + font-size: 18px; } .sg_zmjk_right_information_content{ display: flex; @@ -83,10 +99,7 @@ } } } - .sg_zmjk_right_more{ - margin: -10px 20px 30px -30px; - cursor: pointer; - } + } } } \ No newline at end of file diff --git a/src/views/sq/qys/gcys/buildInfo/index.js b/src/views/sq/qys/gcys/buildInfo/index.js new file mode 100644 index 000000000..b1d300bd0 --- /dev/null +++ b/src/views/sq/qys/gcys/buildInfo/index.js @@ -0,0 +1,496 @@ +import React, { useState, useEffect } from 'react' +import { Row, Col, Form, Input, Divider, DatePicker, Button, Upload, message, Modal } from "antd" +import { formItemLayout } from '../../../../../components/crud/FormLayoutProps' +import { httpget2, httppost2 } from '../../../../../utils/request'; +import apiurl from '../../../../../service/apiurl'; +import './index.less' +export default function BuildInfo() { + const [form] = Form.useForm(); + const [skdisabled, setSkDisabled] = useState(true) + const [data, setData] = useState() + const getData = async () => { + try { + const res = await httpget2(apiurl.dataResourcesCenter.projectAndWater.buildInfo.detail) + if (res.code == 200) { + form.setFieldsValue(res.data) + setData(res.data) + } + } catch (error) { + console.log(error); + } + } + const onFinish = async () => { + try { + const values = form.getFieldsValue(); + const params = { + ...data, + ...values, + } + const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.buildInfo.update, params) + if (res.code == 200) { + message.success("修改成功") + setSkDisabled(true) + getData() + } + } catch (error) { + console.log(error); + + } + } + + + useEffect(() => { + getData() + }, []) + return ( +
+
+
+ + 主坝 +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + 副坝 +
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + 溢洪道 +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + 灌溉发电洞 +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + 放空洞 +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + 拦洪坝 +
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + 防汛道路 +
+ + + + + + + + + + + + + + + + { + skdisabled ? : +
+ + +
+ } + + + + + + + ) +} diff --git a/src/views/sq/qys/gcys/buildInfo/index.less b/src/views/sq/qys/gcys/buildInfo/index.less new file mode 100644 index 000000000..e6f3febc0 --- /dev/null +++ b/src/views/sq/qys/gcys/buildInfo/index.less @@ -0,0 +1,39 @@ +.basic-info-container { + background: #fff; + .ant-descriptions { + .ant-descriptions-header { + margin-bottom: 16px; + padding: 8px; + border-left: 4px solid #1890ff; + background-color: #e7f4ff; + .ant-descriptions-title { + font-size: 16px; + font-weight: 500; + color: rgba(0, 0, 0, 0.85); + } + } + + .ant-descriptions-view { + border: 1px solid #f0f0f0; + + .ant-descriptions-item { + padding: 12px 24px; + + .ant-descriptions-item-label { + width: 160px; + background: #fafafa; + color: rgba(0, 0, 0, 0.85); + font-weight: normal; + } + + .ant-descriptions-item-content { + color: rgba(0, 0, 0, 0.65); + } + } + } + } + + .ant-descriptions + .ant-descriptions { + margin-top: 24px; + } + } diff --git a/src/views/sq/qys/gcys/constance.js b/src/views/sq/qys/gcys/constance.js new file mode 100644 index 000000000..8061a82ae --- /dev/null +++ b/src/views/sq/qys/gcys/constance.js @@ -0,0 +1,52 @@ +const descriptionsConfig = [ + { + title: '主坝', + column: 3, + items: [ + { + label: '坝型', + key: 'bx' + }, + { + label: '坝顶高程', + key: 'gc' + }, + { + label: '统一社会信用代码', + key: 'creditCode2' + } + // ... 其他基础信息项 + ] + }, + { + title: '许可信息', + column: 2, + items: [ + { + label: '取水证号', + key: 'licenseNo' + }, + { + label: '取水项目名称', + key: 'projectName' + } + // ... 其他许可信息项 + ] + } + // ... 可以添加更多描述组 +]; +const dataconfig = { + unitName: 'XX市老城区龙泉供水有限责任公司', + creditCode: '915107242056002w', + creditCode2: '91510724205600', + licenseNo: 'B510705G2021-1061', + projectName: 'XX市老城区龙泉供水有限责任公司', + projectName2: 'XX市老城区龙泉供水', + approvalOrg: 'XXXX省水利厅', + waterType: '地下水', + waterType2: '地下水', + waterPurpose: '制水供水', + yearAmount: '699', + yearAmount2: '699' +}; +export {descriptionsConfig,dataconfig} ; \ No newline at end of file diff --git a/src/views/sq/qys/gcys/index.js b/src/views/sq/qys/gcys/index.js index 90059ee6e..b47dc18a5 100644 --- a/src/views/sq/qys/gcys/index.js +++ b/src/views/sq/qys/gcys/index.js @@ -7,6 +7,7 @@ import apiurl from '../../../../service/apiurl'; import { httpget2, httppost2 } from '../../../../utils/request'; import XlLine from './xlLine' import "./index.less" +import BuildInfo from './buildInfo' export default function ShuikuBasicInfo() { const [tabVal, setTabVal] = useState('1') const [data,setData] =useState('') @@ -36,6 +37,10 @@ export default function ShuikuBasicInfo() { className={tabVal === '2' ? 'fxdd_hsybjs_toolbar_item hsybjs_checked' : 'fxdd_hsybjs_toolbar_item'} onClick={() => setTabVal('2')}>主要特征参数 +
setTabVal('5')}>主要建筑物信息 +
setTabVal('3')}>水库库容曲线 @@ -44,10 +49,10 @@ export default function ShuikuBasicInfo() { className={tabVal === '4' ? 'fxdd_hsybjs_toolbar_item hsybjs_checked' : 'fxdd_hsybjs_toolbar_item'} onClick={() => setTabVal('4')}>水库泄流曲线
-
setTabVal('5')}>月生态流量 -
+ */}
: null} {tabVal === "3" ? : null} {tabVal === "4" ? : null} - {tabVal === "5" ? : null} - + {/* {tabVal === "5" ? : null} */} + {tabVal === "5" ? : null}
) diff --git a/src/views/sq/qys/gcys/projectBasicInfo/index.js b/src/views/sq/qys/gcys/projectBasicInfo/index.js index e41a5d5ed..25dba9862 100644 --- a/src/views/sq/qys/gcys/projectBasicInfo/index.js +++ b/src/views/sq/qys/gcys/projectBasicInfo/index.js @@ -1,6 +1,6 @@ -import React,{useState,useEffect} from 'react' -import { Row, Col, Form, Input, DatePicker, Button,Upload,message,Modal } from "antd" -import {PaperClipOutlined,DeleteOutlined} from '@ant-design/icons'; +import React, { useState, useEffect } from 'react' +import { Row, Col, Form, Input, DatePicker, Button, Upload, message, Modal } from "antd" +import { PaperClipOutlined, DeleteOutlined } from '@ant-design/icons'; import NormalSelect from '../../../../../components/Form/NormalSelect'; import { formItemLayout } from '../../../../../components/crud/FormLayoutProps' import apiurl from '../../../../../service/apiurl'; @@ -8,451 +8,481 @@ import { httpget2, httppost2 } from '../../../../../utils/request'; import moment from 'moment' import "./index.less" export default function ProjectBasciInfo() { - const [form] = Form.useForm(); - const [data, setData] = useState() - const [fileList, setFileList] = useState([]) //上传文件列表 - const [fileIds, setFileIds] = useState([]) - const [loading, setLoading] = useState(false) - const [iframeId, setIframeId] = useState('') - const [perviewOpen, setPerviewOpen] = useState(false) - const [skdisabled, setSkDisabled] = useState(true) - const optionsLevel = [ - { - label: "大 (1)型", - value:"1" - }, - { - label: "大 (2)型", - value:"2" - }, - { - label: "中型", - value:"3" - }, - { - label: "小 (1)型", - value:"4" - }, - { - label: "小 (2)型", - value:"5" - }, - { - label: "其他", - value:"9" - } - ] - - const getData = async () => { - try { - - const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.detail) - // debugger; - if (res.code == 200) { - form.setFieldsValue(res.data[0]) - setData(res.data[0]) - if (res.data[0].files.length > 0) { - getFileInfo(res.data[0]?.files[0]?.fileId) - } - } - } catch (error) { - console.log(error); - } + const [form] = Form.useForm(); + const [data, setData] = useState() + const [fileList, setFileList] = useState([]) //上传文件列表 + const [fileIds, setFileIds] = useState([]) + const [loading, setLoading] = useState(false) + const [iframeId, setIframeId] = useState('') + const [perviewOpen, setPerviewOpen] = useState(false) + const [skdisabled, setSkDisabled] = useState(true) + const optionsLevel = [ + { + label: "大 (1)型", + value: "1" + }, + { + label: "大 (2)型", + value: "2" + }, + { + label: "中型", + value: "3" + }, + { + label: "小 (1)型", + value: "4" + }, + { + label: "小 (2)型", + value: "5" + }, + { + label: "其他", + value: "9" } + ] - const beforeUpload = (file) => { - const isPdf = file.type === 'application/pdf' - if (!isPdf) { - message.error("请上传pdf文件") - } - return isPdf - } + const getData = async () => { + try { - const fileChange = (info) => { - - if (info.file.status === "done") { - setLoading(false); - - } - if (info.file.status === "uploading") { - setLoading(true); - - } - if (info.file.status === "error") { - message.error("文件上传失败") - setLoading(false); - - } - if (info?.file.type === "application/pdf") { - let fileIds = info.fileList.map(file => { - return file.response?.data?.fileId - }) - setFileIds(fileIds) - setFileList(info.fileList) - + const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.detail) + // debugger; + if (res.code == 200) { + form.setFieldsValue(res.data[0]) + setData(res.data[0]) + if (res.data[0].files.length > 0) { + getFileInfo(res.data[0]?.files[0]?.fileId) } } - - const deleteFile = (fileId) => { - let filterFile = fileList.filter(item => item.response?.data?.fileId !== fileId); - setFileList(filterFile) + } catch (error) { + console.log(error); } + } - const onFinish = async () => { - try { - let oldFiles = fileList.map(item => ({ fileId: item.response?.data?.fileId })) - const values = form.getFieldsValue(); - const params = { - ...data, - ...values, - files:oldFiles - } - const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.update,params) - if (res.code == 200) { - message.success("修改成功") - setSkDisabled(true) - getData() - } - } catch (error) { - console.log(error); - - } - + const beforeUpload = (file) => { + const isPdf = file.type === 'application/pdf' + if (!isPdf) { + message.error("请上传pdf文件") } + return isPdf + } - const getFileInfo = async(id) => { - try { - const res = await httpget2(`${apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.getFile}/${id}`) - let obj ={ - name: res.data.fileName, - response: { - data: { - filePath: res.data.filePath, - fileId:res.data.fileId - } - }, - } - setFileList([obj]) - } catch (error) { - console.log(error); - - } + const fileChange = (info) => { + let newFileList = [...info.fileList]; + newFileList = newFileList.slice(-1); + // 处理文件状态 + newFileList = newFileList.map(file => { + if (file.response) { + return { + ...file, + status: 'done', // 确保状态正确 + url: file.response.url, + fileId: file.response.data?.fileId + }; + } + return file; + }); + if (info.file.status === "done") { + setLoading(false); + message.success(`${info.file.name} 上传成功`); } - useEffect(() => { + if (info.file.status === "uploading") { + setLoading(true); + + } + if (info.file.status === "error") { + message.error("文件上传失败") + setLoading(false); + + } + if (info?.file.type === "application/pdf") { + let fileIds = info.fileList.map(file => { + return file.response?.data?.fileId + }) + setFileIds(fileIds) + setFileList(newFileList) + + } + } + + const deleteFile = (fileId) => { + let filterFile = fileList.filter(item => item.response?.data?.fileId !== fileId); + setFileList(filterFile) + } + + const onFinish = async () => { + try { + let oldFiles = fileList.map(item => ({ fileId: item.response?.data?.fileId })) + const values = form.getFieldsValue(); + const params = { + ...data, + ...values, + files: oldFiles + } + const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.update, params) + if (res.code == 200) { + message.success("修改成功") + setSkDisabled(true) getData() - }, []) - + } + } catch (error) { + console.log(error); + + } + + } + + const getFileInfo = async (id) => { + try { + const res = await httpget2(`${apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.getFile}/${id}`) + let obj = { + name: res.data.fileName, + response: { + data: { + filePath: res.data.filePath, + fileId: res.data.fileId + } + }, + } + setFileList([obj]) + } catch (error) { + console.log(error); + + } + } + console.log('f', fileList); + + useEffect(() => { + getData() + }, []) + return (
-
- -
- - - - - - - - - - - - - - - - - - moment(dateString).format('YYYY-MM-DD HH:mm:ss')} - getValueProps={value => ({ - value: value ? moment(value) : undefined - })} - > - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - moment(dateString).format('YYYY-MM-DD HH:mm:ss')} - getValueProps={value => ({ - value: value ? moment(value) : undefined - })} - > - - - - - moment(dateString).format('YYYY-MM-DD HH:mm:ss')} - getValueProps={value => ({ - value: value ? moment(value) : undefined - })} - > - - - - - - - - - - - - - - - - - - { - return ( -
- - { setPerviewOpen(true); setIframeId(file.response?.data?.fileId)}} - > - {file?.name} - {skdisabled ? null : - deleteFile(file.response?.data?.fileId)} - /> - } -
- ) - }} - > - {skdisabled ? null : - - } - - - - - - - - - - - - - - - - - - - - - - { - skdisabled ? : -
- - -
- } - - - - - - - + + + + + + + + + + + + + + + + + + + + moment(dateString).format('YYYY-MM-DD HH:mm:ss')} + getValueProps={value => ({ + value: value ? moment(value) : undefined + })} + > + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + moment(dateString).format('YYYY-MM-DD HH:mm:ss')} + getValueProps={value => ({ + value: value ? moment(value) : undefined + })} + > + + + + + moment(dateString).format('YYYY-MM-DD HH:mm:ss')} + getValueProps={value => ({ + value: value ? moment(value) : undefined + })} + > + + + + + + + + + + + + + + + + + + + {fileList.map(file => ( +
+ + { + e.stopPropagation(); // 阻止触发上传 + if (file.response?.data?.fileId) { + setPerviewOpen(true); + setIframeId(file.response.data.fileId); + } + }} + > + {file.name} + + {!skdisabled && ( + { + e.stopPropagation(); // 阻止触发上传 + deleteFile(file.response?.data?.fileId); + }} + /> + )} +
+ ))} + {!skdisabled && fileList.length === 0 && ( + + )} + + + + + + + + + + + + + + + + + + + + + + { + skdisabled ? : +
+ + +
+ } + + + + + + + { setPerviewOpen(false) }} > -