Merge branch 'master' into qzc-dev
commit
7c7dfd0198
|
|
@ -413,7 +413,10 @@ const apiurl = {
|
|||
edit: service_fxdd + "/termite/survey/update",
|
||||
delete: service_fxdd + "/termite/survey/del",
|
||||
detail: service_fxdd + "/termite/survey/detail",
|
||||
dictionary:service_fxdd + "/sysDictB/listByCd"
|
||||
dictionary: service_fxdd + "/sysDictB/listByCd",
|
||||
allCd: service_fxdd + '/termite/survey/list/allOrder',
|
||||
historyPage: service_fxdd + '/termite/survey/detail',
|
||||
process:service_fxdd + '/termite/survey/process'
|
||||
},
|
||||
fzxc: {
|
||||
page: service_fxdd + "/termite/adver/file/page",
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ export default class ShuiKuLayer extends BaseLayer {
|
|||
// }
|
||||
|
||||
|
||||
const list = data.filter(o=>o.stnm==='檀树岗' || o.stnm==='檀树岗(新)')
|
||||
const list = data.filter(o=>o.stcd==="61610700" || o.stcd==="10818")
|
||||
.map((i) => {
|
||||
return {
|
||||
id : i.stcd,
|
||||
|
|
@ -104,7 +104,6 @@ export default class ShuiKuLayer extends BaseLayer {
|
|||
...i
|
||||
}
|
||||
})
|
||||
|
||||
this._dispatch.runtime.setMarkers({
|
||||
[this.getLayerName()]: list || []
|
||||
});
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ export default function drpOption(data,yjData) {
|
|||
{
|
||||
type: 'category',
|
||||
data: data.map(o => o.tm),
|
||||
inverse: false,
|
||||
inverse: true,
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ export default function drpOption(data,yjData) {
|
|||
{
|
||||
type: 'category',
|
||||
data: data.map(o => o.tm),
|
||||
inverse: false,
|
||||
inverse: true,
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3,14 +3,14 @@ import React, {useEffect, useState} from 'react';
|
|||
import moment from 'moment'
|
||||
|
||||
|
||||
const Tabledata = ({tableData}) => {
|
||||
const Tabledata = ({ tableData }) => {
|
||||
const columns = [
|
||||
{ title: '序号', key: '', dataIndex: '', align: 'center',render:(a,b,c)=>c+1},
|
||||
{ title: '时间', key: 'tm', dataIndex: 'tm', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
|
||||
{ title: '库水位(m)', key: 'rz', dataIndex: 'rz', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
|
||||
{ title: 'X方向位移(mm)', key: 'x', dataIndex: 'x', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
{ title: 'Y方向位移(mm)', key: 'y', dataIndex: 'y', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
{ title: 'H方向位移(mm)', key: 'h', dataIndex: 'h', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
{ title: 'X方向位移(mm)', key: 'de', dataIndex: 'de', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
{ title: 'Y方向位移(mm)', key: 'dn', dataIndex: 'dn', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
{ title: 'H方向位移(mm)', key: 'du', dataIndex: 'du', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||
|
||||
|
||||
];
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
export default function drpOption(data,yjData) {
|
||||
console.log("data",data);
|
||||
const max1 = Math.max(...[...data.map(obj => obj.x),...data.map(obj => obj.y),...data.map(obj => obj.h),...yjData.map(obj => obj.value)])
|
||||
const min1 = Math.min(...[...data.map(obj => obj.x),...data.map(obj => obj.y),...data.map(obj => obj.h),...yjData.map(obj => obj.value)])
|
||||
const max1 = Math.max(...[...data.map(obj => obj.de),...data.map(obj => obj.dn),...data.map(obj => obj.du),...yjData.map(obj => obj.value)])
|
||||
const min1 = Math.min(...[...data.map(obj => obj.de),...data.map(obj => obj.dn),...data.map(obj => obj.du),...yjData.map(obj => obj.value)])
|
||||
const max2 = Math.max(...data.map(obj => obj.rz))
|
||||
const min2 = Math.min(...data.map(obj => obj.rz))
|
||||
|
||||
|
|
@ -49,7 +49,7 @@ export default function drpOption(data,yjData) {
|
|||
{
|
||||
type: 'category',
|
||||
data: data.map(o => o.tm),
|
||||
inverse: false,
|
||||
inverse: true,
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
|
|
@ -75,7 +75,7 @@ export default function drpOption(data,yjData) {
|
|||
// gridIndex: 1,
|
||||
type: 'value',
|
||||
position: 'left',
|
||||
name: "位移(m)",
|
||||
name: "位移(mm)",
|
||||
nameTextStyle: {
|
||||
padding: [0, 0, 10, 10],
|
||||
color:'#333333',
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ function ShenYa({ id, data, dispatch, onCancel }) {
|
|||
<div className="normalModalStyle homeModal2">
|
||||
<div className="normalModalStyle_title">
|
||||
<div className="normalModalStyle_title_icon"></div>
|
||||
{data.stationCode}
|
||||
{data.cdnm}
|
||||
<div className="normalModalStyle_title_cancel">
|
||||
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -677,7 +677,7 @@ const HomePage = ({ showPanels }) => {
|
|||
>
|
||||
{
|
||||
item.children.map((item) =>
|
||||
<dit className='homePage_Panel_item' style={(checkedObj.key === item.key && showTable) ? { color: '#409eff' } : {}} onClick={() => {
|
||||
<div className='homePage_Panel_item' style={(checkedObj.key === item.key && showTable) ? { color: '#409eff' } : {}} onClick={() => {
|
||||
// 清空搜索输入框
|
||||
setSearchVal('')
|
||||
setCheckedObj(item)
|
||||
|
|
@ -699,7 +699,7 @@ const HomePage = ({ showPanels }) => {
|
|||
</div>
|
||||
: null
|
||||
}
|
||||
</dit>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</Panel>
|
||||
|
|
|
|||
|
|
@ -40,50 +40,50 @@ const Page = () => {
|
|||
return (
|
||||
<>
|
||||
<div className="home_shuizhi">
|
||||
<dit className='home_shuizhi_item2'>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>建筑物型式:</div>
|
||||
<div>{tableData.buildType}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>地基特性:</div>
|
||||
<div>{tableData.foundCharacter}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>坝顶高程(m):</div>
|
||||
<div>{tableData.damTopElev}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>最大坝高(m):</div>
|
||||
<div>{tableData.damMaxHeig}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>坝顶长度(m):</div>
|
||||
<div>{tableData.damTopLen}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>坝顶宽度(m):</div>
|
||||
<div>{tableData.damTopWid}</div>
|
||||
</dit>
|
||||
{/* <dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
{/* <div className='home_shuizhi_item2'>
|
||||
<div>防浪墙顶高程(m):</div>
|
||||
<div>{tableData.damWaveWall}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>开工日期:</div>
|
||||
<div>{tableData?.startDate?.slice(0,10)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>竣工日期:</div>
|
||||
<div>{tableData?.endDate?.slice(0,10)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>蓄水日期:</div>
|
||||
<div>{tableData?.storageDate?.slice(0,10)}</div>
|
||||
</dit> */}
|
||||
{/* <dit className='home_shuizhi_item2'>
|
||||
</div> */}
|
||||
{/* <div className='home_shuizhi_item2'>
|
||||
<div>图片资料</div>
|
||||
<div></div>
|
||||
</dit>
|
||||
</div>
|
||||
<div style={{margin:'10px 35px',height:'70ox',overflow:'hidden' }}>
|
||||
<div style={{width:100*(imgList.length||0),position:'relative',left:left+'px'}}>
|
||||
{
|
||||
|
|
@ -120,10 +120,10 @@ const Page = () => {
|
|||
/>
|
||||
</div> */}
|
||||
{/* */}
|
||||
{/* <dit className='home_shuizhi_item2'>
|
||||
{/* <div className='home_shuizhi_item2'>
|
||||
<div>视频资料:</div>
|
||||
<div></div>
|
||||
</dit> */}
|
||||
</div> */}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ const Page = () => {
|
|||
]
|
||||
}else{
|
||||
return [
|
||||
{ title: '监测点', key: 'cd', dataIndex: 'cd',align: "center",width: 80, ellipsis: true },
|
||||
{ title: '监测点', key: 'cdnm', dataIndex: 'cdnm',align: "center",width: 80, ellipsis: true },
|
||||
{ title: '监测时间', key: 'tm', dataIndex: 'tm',align: "center",width: 80, ellipsis: true, render:(v,row)=><div style={{color:row.flag===1?'red':'#3B4859'}}><div>{v?.slice(5,10)}</div><div>{v?.slice(11,16)}</div></div> },
|
||||
{ title: <div><div>x方向</div><div>(mm)</div></div>, key: 'de', dataIndex: 'de',align: "center", ellipsis: true, render:(v,row)=><div style={{color:row.xstatus===1?'red':'#3B4859'}}>{v}</div> },
|
||||
{ title: <div><div>y方向</div><div>(mm)</div></div>, key: 'dn', dataIndex: 'dn',align: "center", ellipsis: true, render:(v,row)=><div style={{color:row.ystatus===1?'red':'#3B4859'}}>{v}</div> },
|
||||
|
|
|
|||
|
|
@ -37,11 +37,11 @@ const Page = () => {
|
|||
return (
|
||||
<>
|
||||
<div className="home_shuizhi">
|
||||
<dit className='home_shuizhi_item2'>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>工程位置:</div>
|
||||
<div>{tableData.resLoc}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>水库规模:</div>
|
||||
<div>{
|
||||
{
|
||||
|
|
@ -53,51 +53,51 @@ const Page = () => {
|
|||
9:'其他',
|
||||
}[tableData.engScal]
|
||||
}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>主要功能:</div>
|
||||
<div>{tableData.rsvFunction}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>坝址以上流域面积(km²):</div>
|
||||
<div>{getNum(tableData.watShedArea)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>总库容(万m³):</div>
|
||||
<div>{getNum(tableData.totCap)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>校核洪水位(m):</div>
|
||||
<div>{getNum(tableData.calFloodLev)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>设计洪水位(m):</div>
|
||||
<div>{getNum(tableData.desFloodLev)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>正常蓄水位(m):</div>
|
||||
<div>{getNum(tableData.normWatLev)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>汛限水位(m):</div>
|
||||
<div>{getNum(tableData.flLowLimLev)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>死水位(m):</div>
|
||||
<div>{getNum(tableData.deadLev)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>兴利库容(万m³):</div>
|
||||
<div>{getNum(tableData.benResCap)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>死库容(万m³):</div>
|
||||
<div>{getNum(tableData.deadCap)}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>工程特性表:</div>
|
||||
<div style={{color:'#007AFDB3',cursor:'pointer'}} onClick={()=>setOpen(true)}>工程特性表详情</div>
|
||||
</dit>
|
||||
</div>
|
||||
{/* <div style={{width:'100%',color:'#007AFDB3',fontWeight:500,cursor:'pointer',marginTop:'10px',textAlign:'center'}}>更多详情</div> */}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -11,12 +11,12 @@ import Ykqk from './item_shuiku/yhqk'
|
|||
|
||||
const Page = () => {
|
||||
const dispatch = useDispatch();
|
||||
const [ checked, setChecked ] = useState(0)
|
||||
const [ checked, setChecked ] = useState(1)
|
||||
const [data,setData] = useState([])
|
||||
console.log('data',data);
|
||||
useEffect(()=>{
|
||||
dispatch.map.setLayerVisible({ ShuiKuLayer: true })
|
||||
dispatch.map.setLayerVisible({ HdswLayer: true })
|
||||
dispatch.map.setLayerVisible({ HdswLayer: false })
|
||||
getData()
|
||||
return ()=>{
|
||||
dispatch.map.setLayerVisible({ ShuiKuLayer: false })
|
||||
|
|
@ -27,7 +27,7 @@ const Page = () => {
|
|||
const getData = async (params) => {
|
||||
const data = await reservoirlist(params) || []
|
||||
// const list = [...data.filter(o=>o.stnm==='檀树岗(新)'),...data.filter(o=>o.stnm!=='檀树岗(新)')]
|
||||
const list = [...data.filter(o=>o.stnm==='檀树岗'),...data.filter(o=>o.stnm==='檀树岗(新)')]
|
||||
const list = [...data.filter(o=>o.stcd==="61610700"),...data.filter(o=>o.stcd==="10818")]
|
||||
setData(list)
|
||||
}
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ const Page = () => {
|
|||
}
|
||||
})
|
||||
// const list2 = [...list.filter(o=>o.stnm==='檀树岗(新)'),...list.filter(o=>o.stnm!=='檀树岗(新)')]
|
||||
const list2 = [...list.filter(o=>o.stnm==='檀树岗'),...list.filter(o=>o.stnm==='檀树岗(新)')]
|
||||
const list2 = [...list.filter(o=>o.stcd==="61610700"),...list.filter(o=>o.stcd==="10818")]
|
||||
console.log('res',list2);
|
||||
const data = list2[checked]
|
||||
dispatch.runtime.setFeaturePop({
|
||||
|
|
@ -64,7 +64,7 @@ const Page = () => {
|
|||
<div className="home_yuqing_header" style={{marginBottom:'10px'}}>
|
||||
{
|
||||
data.map((item,index)=>
|
||||
<div style={{width:'50%'}}><div style={{width:'90%'}} className={checked===index?'home_yuqing_header_item avtive':'home_yuqing_header_item'} onClick={()=>setChecked(index)}>{item.stnm}</div></div>
|
||||
<div style={{width:'50%'}}><div style={{width:'100%'}} className={checked===index?'home_yuqing_header_item avtive':'home_yuqing_header_item'} onClick={()=>setChecked(index)}>{item.stnm}</div></div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -30,38 +30,38 @@ const Page = () => {
|
|||
return (
|
||||
<>
|
||||
<div className="home_shuizhi">
|
||||
<dit className='home_shuizhi_item2'>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>型式:</div>
|
||||
<div>{tableData.buildType}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>堰顶高程(m):</div>
|
||||
<div>{tableData.crestEle}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>总净宽(m):</div>
|
||||
<div>{tableData.netWidth}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>最大单宽流量m³/(s·m):</div>
|
||||
<div>{tableData.bwidQ}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>消能方式:</div>
|
||||
<div>{tableData.elimMethod}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>消能防冲流量(m³/s):</div>
|
||||
<div>{tableData.elimQ}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>设计泄洪流量(m³/s):</div>
|
||||
<div>{tableData.desQ}</div>
|
||||
</dit>
|
||||
<dit className='home_shuizhi_item2'>
|
||||
</div>
|
||||
<div className='home_shuizhi_item2'>
|
||||
<div>校核泄洪流量(m³/s):</div>
|
||||
<div>{tableData.caliQ}</div>
|
||||
</dit>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -6,14 +6,16 @@ import apiurl from "../../../../service/apiurl";
|
|||
import moment from "moment";
|
||||
import Table_qx from './table_qx'
|
||||
import Table_wy from './table_wy'
|
||||
import Table_by from './table_by'
|
||||
import Table_sl from './table_sl'
|
||||
import Table_sy from './table_sy'
|
||||
import Table_AI from './table_AI'
|
||||
import { useNavigate } from "react-router";
|
||||
|
||||
|
||||
|
||||
const Page = ({mySetTms}) => {
|
||||
const [ dataObj, setDataObj ] = useState({})
|
||||
const Page = ({ mySetTms }) => {
|
||||
const [dataObj, setDataObj] = useState({})
|
||||
console.log(dataObj)
|
||||
const [ open, setOpen ] = useState(false)
|
||||
const [ key , setkey ] = useState('')
|
||||
|
|
@ -22,6 +24,8 @@ const Page = ({mySetTms}) => {
|
|||
moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||
])
|
||||
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
(async()=>{
|
||||
const params = {
|
||||
|
|
@ -39,6 +43,7 @@ const Page = ({mySetTms}) => {
|
|||
])
|
||||
setDataObj(data)
|
||||
})()
|
||||
|
||||
},[])
|
||||
|
||||
|
||||
|
|
@ -85,6 +90,11 @@ const Page = ({mySetTms}) => {
|
|||
<div className="content">AI告警</div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div className="bodyBoxItem" onClick={()=>{setOpen(true);setkey('白蚁告警')}}>
|
||||
<div className="num">{dataObj.byWarn?.length || 0}<span style={{fontSize:14,color:"#000",marginLeft:2}}>处</span></div>
|
||||
<div className="content">白蚁告警</div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Modal
|
||||
|
|
@ -102,7 +112,7 @@ const Page = ({mySetTms}) => {
|
|||
<div className="normalModalStyle">
|
||||
<div className="normalModalStyle_title">
|
||||
<div className="normalModalStyle_title_icon"></div>
|
||||
{key}
|
||||
{key == '白蚁告警' ? key + "(" + tms[0]?.slice(0,16) + "至" + tms[1]?.slice(0,16) + ')':key }
|
||||
<div className="normalModalStyle_title_cancel">
|
||||
<CloseOutlined onClick={()=>setOpen(false)} style={{color:"#333"}}/>
|
||||
</div>
|
||||
|
|
@ -111,7 +121,8 @@ const Page = ({mySetTms}) => {
|
|||
{ key==='位移告警'?<Table_wy data={dataObj.shiftWarn} onCancel={()=>setOpen(false)}/>:null }
|
||||
{ key==='渗压告警'?<Table_sy data={dataObj.pressWarn} onCancel={()=>setOpen(false)}/>:null }
|
||||
{ key==='渗流告警'?<Table_sl data={dataObj.flowWarn} onCancel={()=>setOpen(false)}/>:null }
|
||||
{ key==='AI告警'?<Table_AI/>:null }
|
||||
{key === 'AI告警' ? <Table_AI /> : null}
|
||||
{ key==='白蚁告警'?<Table_by data={dataObj.byWarn} onCancel={()=>setOpen(false)}/>:null }
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,56 @@
|
|||
import React, { Fragment, useRef, useMemo, useEffect, useState } from 'react';
|
||||
import { Table, Modal, message,Tag } from 'antd';
|
||||
import { CloseOutlined } from "@ant-design/icons";
|
||||
import usePageTable from '../../../../components/crud/usePageTable2'
|
||||
import { createCrudService } from '../../../../components/crud/_';
|
||||
|
||||
import { httppost2 } from "../../../../utils/request";
|
||||
import apiurl from "../../../../service/apiurl";
|
||||
|
||||
|
||||
const Page = ({ data }) => {
|
||||
const columns = [
|
||||
{ title: '序号', key: 'inx', dataIndex: 'inx', align: "center", render: (text, rec, index) => index + 1 },
|
||||
{ title: '最近报警时间', key: 'obDate', dataIndex: 'obDate', ellipsis: true },
|
||||
{ title: '测点编号', key: 'order', dataIndex: 'order' },
|
||||
{
|
||||
title: '有无白蚁',
|
||||
dataIndex: 'status',
|
||||
align: 'center',
|
||||
key: 'status',
|
||||
width: 100,
|
||||
render: (text, record) => {
|
||||
// 如果 isHarm 为 null 或 undefined，显示无
|
||||
if (text == null) {
|
||||
return <Tag color="#04d919" style={{ borderRadius: '50%', padding: '4px 8px' }}>无</Tag>;
|
||||
}
|
||||
|
||||
// 如果 isHandle 为 null 或 undefined，当作 false 处理
|
||||
const isHandle = record.isHandle ?? false;
|
||||
|
||||
return (
|
||||
<Tag
|
||||
color={!text ? '#04d919' : '#d9001b'}
|
||||
style={{ borderRadius: '50%', padding: '4px 8px' }}
|
||||
>
|
||||
{!text ? '无' : '有'}
|
||||
</Tag>
|
||||
);
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="ant-card-body" style={{ padding: "10px" }}>
|
||||
<Table rowKey="id"
|
||||
sticky
|
||||
columns={columns}
|
||||
pagination={false}
|
||||
dataSource={data}
|
||||
scroll={{ y: "450px" }}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Page
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 597 KiB After Width: | Height: | Size: 618 KiB |
|
|
@ -99,7 +99,7 @@ export default function Xmzlmb() {
|
|||
...obj,
|
||||
}
|
||||
})
|
||||
if (result.length > 0) {
|
||||
if (result.length > 0 || res.data.length == 0) {
|
||||
setLoading(false)
|
||||
}
|
||||
// let res1 = result.map(item => ({...item,rz:(item.rz - 100).toFixed(2)})) //为了测试 最后需要删除
|
||||
|
|
|
|||
|
|
@ -115,6 +115,11 @@ export default function jrxOptions(data = {}, type = "1",typeName='1') {
|
|||
[85, data[alltype[3]]]
|
||||
]
|
||||
: []
|
||||
const filteredArray = line.filter(subArray => {
|
||||
return subArray.every(item => item !== null && item !== undefined);
|
||||
});
|
||||
|
||||
|
||||
return {
|
||||
toolbox: {
|
||||
show: true,
|
||||
|
|
@ -371,13 +376,17 @@ export default function jrxOptions(data = {}, type = "1",typeName='1') {
|
|||
symbol: 'none',
|
||||
symbolSize: 10,
|
||||
z: 1,
|
||||
smooth: 0.6, // 设置平滑度
|
||||
smoothMonotone: 'x', // 保持 x 方向的单调性
|
||||
itemStyle: {
|
||||
color: '#5487FF'
|
||||
},
|
||||
lineStyle: {
|
||||
color: '#5487FF',
|
||||
width: 2,
|
||||
curveness: 0.5 // 增加曲线程度
|
||||
},
|
||||
data: line
|
||||
data: filteredArray
|
||||
},
|
||||
]
|
||||
};
|
||||
|
|
|
|||
|
|
@ -57,7 +57,8 @@ const Page = () => {
|
|||
{record.valueTwo || ''}
|
||||
</span>
|
||||
},
|
||||
{ title: '校验规则描述', key: 'ruleDesc', dataIndex: 'ruleDesc', width: 250, ellipsis: true,align:"center", },
|
||||
{ title: '校验规则描述', key: 'ruleDesc', dataIndex: 'ruleDesc', width: 250, ellipsis: true, align: "center", },
|
||||
{ title: '处理建议', key: 'resolveSuggest', dataIndex: 'resolveSuggest', width: 200, ellipsis: true, align:"center" },
|
||||
];
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,61 +1,61 @@
|
|||
import React,{useEffect,useState,useMemo} from 'react';
|
||||
import { Form, Button, Input, Row, Col, DatePicker, Upload,message,Image,Modal,Radio } from 'antd';
|
||||
import React, { useEffect, useState, useMemo } from 'react';
|
||||
import { Form, Button, Input, Row, Col, DatePicker, Upload, message, Image, Modal, Radio } from 'antd';
|
||||
import { formItemLayout, btnItemLayout } from '../../../../components/crud/FormLayoutProps';
|
||||
import apiurl from '../../../../service/apiurl';
|
||||
import NormalSelect from '../../../../components/Form/NormalSelect';
|
||||
import { httppost2 } from '../../../../utils/request';
|
||||
|
||||
import moment from 'moment';
|
||||
const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
||||
const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
|
||||
const optionsType = [
|
||||
{
|
||||
label: "渗压监测",
|
||||
value:1
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: "渗流监测",
|
||||
value:2
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
label:"位移监测",
|
||||
value:3
|
||||
label: "位移监测",
|
||||
value: 3
|
||||
},
|
||||
]
|
||||
const optionsLevel = [
|
||||
{
|
||||
label: "黄色告警",
|
||||
value:1
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: "红色告警",
|
||||
value:2
|
||||
value: 2
|
||||
},
|
||||
]
|
||||
|
||||
const conditionOneType = [
|
||||
{
|
||||
label: ">",
|
||||
value:">"
|
||||
value: ">"
|
||||
},
|
||||
{
|
||||
label: "<",
|
||||
value:"<"
|
||||
value: "<"
|
||||
},
|
||||
{
|
||||
label: "=",
|
||||
value:"="
|
||||
value: "="
|
||||
},
|
||||
{
|
||||
label: ">=",
|
||||
value:">="
|
||||
value: ">="
|
||||
},
|
||||
{
|
||||
label: "<=",
|
||||
value:"<="
|
||||
value: "<="
|
||||
},
|
||||
{
|
||||
label: "!=",
|
||||
value:"!="
|
||||
value: "!="
|
||||
},
|
||||
]
|
||||
|
||||
|
|
@ -63,30 +63,30 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
const condition = [
|
||||
{
|
||||
label: "且",
|
||||
value:1
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: "或",
|
||||
value:2
|
||||
value: 2
|
||||
},
|
||||
]
|
||||
|
||||
const wyOptions = [
|
||||
{
|
||||
label: "X方向",
|
||||
value:"x"
|
||||
value: "x"
|
||||
},
|
||||
{
|
||||
label: "Y方向",
|
||||
value:"y"
|
||||
value: "y"
|
||||
},
|
||||
{
|
||||
label: "H方向",
|
||||
value:"h"
|
||||
value: "h"
|
||||
},
|
||||
]
|
||||
|
||||
console.log("record",record);
|
||||
console.log("record", record);
|
||||
const [form] = Form.useForm();
|
||||
const [staCodeList, setStaCodeList] = useState([])//渗压
|
||||
const [Condition, setCondition] = useState("")
|
||||
|
|
@ -94,14 +94,14 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
const [slStacodeList, setSlStacodeList] = useState([])//渗流
|
||||
const onFinish = (values) => {
|
||||
values.valueOne = values.valueOne ? Number(values.valueOne) : ''
|
||||
values.valueTwo = values.valueTwo ? Number(values.valueTwo) : ''
|
||||
values.valueTwo = values.valueTwo ? Number(values.valueTwo) : ''
|
||||
if (mode === 'edit') {
|
||||
values.id = record.id;
|
||||
values.createTime = record.createTime
|
||||
onEdit(apiurl.gcaqjc.gcaqyj.yjgzpz.edit,values)
|
||||
onEdit(apiurl.gcaqjc.gcaqyj.yjgzpz.edit, values)
|
||||
}
|
||||
if (mode === 'save') {
|
||||
onSave(apiurl.gcaqjc.gcaqyj.yjgzpz.save,values)
|
||||
onSave(apiurl.gcaqjc.gcaqyj.yjgzpz.save, values)
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -111,7 +111,7 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
const getwYCode = async () => {
|
||||
try {
|
||||
const res = await httppost2(apiurl.gcaqjc.sjtjcx.wycx.list)
|
||||
setCodeList(res.data.map(s=>({stationCode:s.cd,label:s.cdNm,value:s.cd})));//
|
||||
setCodeList(res.data.map(s => ({ stationCode: s.cd, label: s.cdNm, value: s.cd })));//
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
|
|
@ -120,23 +120,23 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
const getSlCode = async () => {
|
||||
try {
|
||||
const res = await httppost2(apiurl.gcaqjc.sjtjcx.wycx.slList)
|
||||
setSlStacodeList(res.data.map(s=>({stationCode:s.dvcd,label:s.dvcd,value:s.dvcd})));
|
||||
setSlStacodeList(res.data.map(s => ({ stationCode: s.dvcd, label: s.dvcd, value: s.dvcd })));
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
const getStationCode = async () => {
|
||||
try {
|
||||
const res = await httppost2(apiurl.gcaqjc.gcaqyj.yjgzpz.list)
|
||||
setStaCodeList(res.data.map(s=>({stationCode:s.dvcd,label:s.dvcd,value:s.dvcd})));
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
const getStationCode = async () => {
|
||||
try {
|
||||
const res = await httppost2(apiurl.gcaqjc.gcaqyj.yjgzpz.list)
|
||||
setStaCodeList(res.data.map(s => ({ stationCode: s.dvcd, label: s.dvcd, value: s.dvcd })));
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
if (mode !== "save" ) {
|
||||
// getFileInfo(record)
|
||||
useEffect(() => {
|
||||
if (mode !== "save") {
|
||||
// getFileInfo(record)
|
||||
setCondition(record?.condition)
|
||||
setTypes(record.type)
|
||||
}
|
||||
|
|
@ -149,7 +149,7 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
}, [])
|
||||
useEffect(() => {
|
||||
if (mode == "save") {
|
||||
form.setFieldValue("status", 1)
|
||||
form.setFieldValue("status", 1)
|
||||
}
|
||||
}, [mode])
|
||||
|
||||
|
|
@ -161,27 +161,27 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
onFinish={onFinish}
|
||||
initialValues={record}
|
||||
>
|
||||
<Row>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="告警类型"
|
||||
name="type"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Form.Item
|
||||
label="告警类型"
|
||||
name="type"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear options={optionsType}
|
||||
onChange={(e) => setTypes(e)}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="告警级别"
|
||||
name="level"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Form.Item
|
||||
label="告警级别"
|
||||
name="level"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
|
|
@ -189,18 +189,18 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
options={optionsLevel}
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Row>
|
||||
|
||||
<Row>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="测点编号"
|
||||
rules={[{ required: true }]}
|
||||
name="stationCode"
|
||||
<Form.Item
|
||||
label="测点编号"
|
||||
rules={[{ required: true }]}
|
||||
name="stationCode"
|
||||
|
||||
>
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
|
|
@ -208,181 +208,193 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
|||
options={
|
||||
types == 3 ? codeList :
|
||||
types == 1 ? staCodeList : slStacodeList
|
||||
} />
|
||||
</Form.Item>
|
||||
} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="校验规则描述"
|
||||
rules={[{ required: true }]}
|
||||
name="ruleDesc"
|
||||
>
|
||||
<Input disabled={mode==='view'} style={{width:'100%'}} allowClear />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="校验规则描述"
|
||||
rules={[{ required: true }]}
|
||||
name="ruleDesc"
|
||||
>
|
||||
<Input disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Row>
|
||||
{types != 3 ?
|
||||
<>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="阈值"
|
||||
name="conditionOne"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="阈值"
|
||||
name="conditionOne"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueOne"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="condition"
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueOne"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="condition"
|
||||
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
options={condition}
|
||||
onChange={(e) => { setCondition(e)} }
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionTwo"
|
||||
wrapperCol={{span:18,offset:6}}
|
||||
rules={[{ required: Condition ? true : false}]}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view' || !Condition} style={{ width: '78%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueTwo"
|
||||
rules={[{ required: Condition ? true : false}]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'|| !Condition} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
options={condition}
|
||||
onChange={(e) => { setCondition(e) }}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionTwo"
|
||||
wrapperCol={{ span: 18, offset: 6 }}
|
||||
rules={[{ required: Condition ? true : false }]}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view' || !Condition} style={{ width: '78%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueTwo"
|
||||
rules={[{ required: Condition ? true : false }]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view' || !Condition} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
:
|
||||
<>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="阈值"
|
||||
name="direction"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="阈值"
|
||||
name="direction"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={wyOptions} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={wyOptions} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
</Row>
|
||||
<Row >
|
||||
<Col span={6} >
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionOne"
|
||||
rules={[{ required: true }]}
|
||||
wrapperCol={{span:12,offset:12}}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={4}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueOne"
|
||||
wrapperCol={{span:20,offset:4}}
|
||||
</Row>
|
||||
<Row >
|
||||
<Col span={6} >
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionOne"
|
||||
rules={[{ required: true }]}
|
||||
wrapperCol={{ span: 12, offset: 12 }}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={4}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueOne"
|
||||
wrapperCol={{ span: 20, offset: 4 }}
|
||||
// wrapperCol={{span:20,offset:9}}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={3}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="condition"
|
||||
wrapperCol={{span:12,offset:12}}
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
options={condition}
|
||||
onChange={(e) => { setCondition(e)} }
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionTwo"
|
||||
wrapperCol={{span:12,offset:12}}
|
||||
rules={[{ required: Condition ? true : false}]}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view' || !Condition} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={3}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueTwo"
|
||||
// wrapperCol={{span:10,offset:12}}
|
||||
wrapperCol={{span:20,offset:4}}
|
||||
rules={[{ required: Condition ? true : false}]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'|| !Condition} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={3}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="condition"
|
||||
wrapperCol={{ span: 12, offset: 12 }}
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
options={condition}
|
||||
onChange={(e) => { setCondition(e) }}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="conditionTwo"
|
||||
wrapperCol={{ span: 12, offset: 12 }}
|
||||
rules={[{ required: Condition ? true : false }]}
|
||||
>
|
||||
<NormalSelect disabled={mode === 'view' || !Condition} style={{ width: '100%' }} allowClear options={conditionOneType} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={3}>
|
||||
<Form.Item
|
||||
label=""
|
||||
name="valueTwo"
|
||||
// wrapperCol={{span:10,offset:12}}
|
||||
wrapperCol={{ span: 20, offset: 4 }}
|
||||
rules={[{ required: Condition ? true : false }]}
|
||||
>
|
||||
<Input type='num' disabled={mode === 'view' || !Condition} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</>
|
||||
}
|
||||
}
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="是否启用"
|
||||
name="status"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Radio.Group disabled={mode === 'view'} >
|
||||
<Radio value={1}>启用</Radio>
|
||||
<Radio value={0}>不启用</Radio>
|
||||
<Form.Item
|
||||
label="是否启用"
|
||||
name="status"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Radio.Group disabled={mode === 'view'} >
|
||||
<Radio value={1}>启用</Radio>
|
||||
<Radio value={0}>不启用</Radio>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
{
|
||||
mode==='view'?null:(
|
||||
<>
|
||||
<Form.Item {...btnItemLayout}>
|
||||
<Button type="primary" htmlType="submit">
|
||||
</Row>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="处理建议"
|
||||
name="resolveSuggest"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
>
|
||||
<Input.TextArea disabled={mode === 'view'} style={{ width: '100%', minHeight: '100px' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
{
|
||||
mode === 'view' ? null : (
|
||||
<>
|
||||
<Form.Item {...btnItemLayout}>
|
||||
<Button type="primary" htmlType="submit">
|
||||
{mode === 'save' ? '保存' :
|
||||
mode === "similarSave" ? "保存" :
|
||||
'修改'}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</>
|
||||
)
|
||||
}
|
||||
'修改'}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</>
|
||||
)
|
||||
}
|
||||
</Form>
|
||||
</>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ export default function dtOption(doubleData) {
|
|||
const textColor = '#666'
|
||||
return {
|
||||
title: {
|
||||
text: `${doubleData?.stationCode}测压管水位过程线`,
|
||||
text: `${doubleData?.cd}测压管水位过程线`,
|
||||
bottom: "5%",
|
||||
left: "40%",
|
||||
textStyle: {
|
||||
|
|
@ -26,7 +26,7 @@ const textColor = '#666'
|
|||
show: true,
|
||||
excludeComponents: ['toolbox'],
|
||||
pixelRatio: 2,
|
||||
name:`${doubleData?.stationCode}测压管水位过程线`
|
||||
name:`${doubleData?.cd}测压管水位过程线`
|
||||
}
|
||||
},
|
||||
right: "20%",
|
||||
|
|
@ -144,7 +144,7 @@ const textColor = '#666'
|
|||
|
||||
series: [
|
||||
{
|
||||
name: doubleData?.stationCode,
|
||||
name: doubleData?.cd,
|
||||
type: 'line',
|
||||
yAxisIndex: 0,
|
||||
symbol: 'circle',
|
||||
|
|
|
|||
|
|
@ -1,51 +1,65 @@
|
|||
import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
|
||||
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,Tag } from 'antd';
|
||||
import {FileWordOutlined,FilePdfOutlined,FileZipOutlined,FileExcelOutlined } from '@ant-design/icons';
|
||||
import { useSelector } from 'react-redux';
|
||||
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, useDispatch } from 'react-redux';
|
||||
import ToolBar from './toolbar';
|
||||
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 { httppost2, httpget2 } from '../../../../utils/request';
|
||||
import { CrudOpRender_text } from '../../../../components/crud/CrudOpRender';
|
||||
import PointHistory from './pointHistory';
|
||||
import PrecessForm from './precessForm'
|
||||
import './index.less';
|
||||
import moment from 'moment';
|
||||
// 引入OpenLayers相关依赖
|
||||
import Map from 'ol/Map';
|
||||
import View from 'ol/View';
|
||||
import TileLayer from 'ol/layer/Tile';
|
||||
import XYZSource from 'ol/source/XYZ';
|
||||
import * as proj from 'ol/proj';
|
||||
import Feature from 'ol/Feature';
|
||||
import Point from 'ol/geom/Point';
|
||||
import { Vector as VectorLayer } from 'ol/layer';
|
||||
import { Vector as VectorSource } from 'ol/source';
|
||||
import { Circle as CircleStyle, Fill, Stroke, Style, Text } from 'ol/style';
|
||||
import Overlay from 'ol/Overlay';
|
||||
const url = "http://223.75.53.141:9100/gs-tsg"
|
||||
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 viewBtn = role?.rule?.find(item => item.menuName == "查看") || true;
|
||||
const delBtn = role?.rule?.find(item => item.menuName == "删除") || true;
|
||||
const initData = {
|
||||
obDate: moment().format('YYYY-MM-DD')
|
||||
}
|
||||
// 添加地图相关的状态和引用
|
||||
const mapContainerRef = useRef(null);
|
||||
const [map, setMap] = useState(null);
|
||||
const [vectorLayer, setVectorLayer] = useState(null);
|
||||
const [selectedFeature, setSelectedFeature] = useState(null);
|
||||
const [popupOverlay, setPopupOverlay] = useState(null);
|
||||
const popupRef = useRef(null);
|
||||
// 在组件顶部的状态声明中添加一个新的状态
|
||||
const [highlightLayer, setHighlightLayer] = useState(null);
|
||||
// 点位弹框
|
||||
const [modalVisible, setModalVisible] = useState(false)
|
||||
const [detailPoint, setDetailPoint] = useState({})
|
||||
|
||||
|
||||
// 白蚁处理弹框
|
||||
const [precessVisible, setPrecessVisible] = useState(false)
|
||||
const [mode, setMode] = useState('save')
|
||||
|
||||
const dispatch = useDispatch();
|
||||
|
||||
|
||||
const [stats, setStats] = useState({
|
||||
total: 400,
|
||||
withMosquito: 14,
|
||||
withoutMosquito: 382,
|
||||
noData: 4
|
||||
});
|
||||
const surveyType = {
|
||||
1: "日常检查排查",
|
||||
2: "定期普查",
|
||||
3:"专项调查"
|
||||
}
|
||||
const surveyWay = {
|
||||
1: "人工排查法",
|
||||
2: "引诱法",
|
||||
3: "仪器探测法",
|
||||
4:"其他"
|
||||
}
|
||||
const isHarm = {
|
||||
0: "无危害",
|
||||
1: "有危害",
|
||||
}
|
||||
const refModal = useRef();
|
||||
const [searchVal, setSearchVal] = useState({...initData})
|
||||
const [searchVal, setSearchVal] = useState({ ...initData })
|
||||
const [count, setCount] = useState({})
|
||||
const [allCdList, setAllCdList] = useState([])
|
||||
// const columns = [
|
||||
// { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
||||
// {title: '填报日期', key: 'reportDate', dataIndex: 'reportDate', width: 140,},
|
||||
|
|
@ -83,25 +97,25 @@ const Page = () => {
|
|||
dataIndex: 'obDate',
|
||||
key: 'obDate',
|
||||
width: 180,
|
||||
align:'center'
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '测点编号',
|
||||
dataIndex: 'order',
|
||||
key: 'order',
|
||||
width: 120,
|
||||
align:'center'
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '有无白蚁',
|
||||
dataIndex: 'status',
|
||||
align:'center',
|
||||
align: 'center',
|
||||
key: 'status',
|
||||
width: 100,
|
||||
render:(text, record) => {
|
||||
render: (text, record) => {
|
||||
// 如果 isHarm 为 null 或 undefined，显示无
|
||||
if (text == null) {
|
||||
return <Tag color="#04d919" style={{borderRadius: '50%', padding: '4px 8px'}}>无</Tag>;
|
||||
return <Tag color="#04d919" style={{ borderRadius: '50%', padding: '4px 8px' }}>无</Tag>;
|
||||
}
|
||||
|
||||
// 如果 isHandle 为 null 或 undefined，当作 false 处理
|
||||
|
|
@ -109,14 +123,34 @@ const Page = () => {
|
|||
|
||||
return (
|
||||
<Tag
|
||||
color={!text ?'#04d919' : '#d9001b'}
|
||||
style={{borderRadius: '50%', padding: '4px 8px'}}
|
||||
color={!text ? '#04d919' : '#d9001b'}
|
||||
style={{ borderRadius: '50%', padding: '4px 8px' }}
|
||||
>
|
||||
{!text ? '无' : '有'}
|
||||
</Tag>
|
||||
);
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'opreate',
|
||||
key: 'opreate',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
render: (v, r) => {
|
||||
let renderTag;
|
||||
if (!r.isProcess && r.status == 1) {
|
||||
renderTag = <Button style={{ marginRight: 4 }} type="link" size="small" onClick={()=> handlerPrecess(r,'save')} title="处理">处理</Button>;
|
||||
}
|
||||
if (r.hasInspectTask && r.jcskByRProcessVo) {
|
||||
renderTag = <Button style={{ marginRight: 4 }} type="link" size="small" onClick={()=> handlerPrecess(r,'view')} title="工单详情">工单详情</Button>;
|
||||
}
|
||||
return (<>
|
||||
{renderTag}
|
||||
<Button style={{ marginRight: 4 }} type="link" size="small" title="查看" onClick={()=> viewDetail(r)}>查看</Button>
|
||||
</>)
|
||||
}
|
||||
},
|
||||
];
|
||||
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||
|
||||
|
|
@ -136,11 +170,24 @@ const Page = () => {
|
|||
|
||||
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.byfz.bypc.page).find_noCode);
|
||||
|
||||
/**
|
||||
* @description 处理成功的回调
|
||||
*/
|
||||
const successCallback = () => {
|
||||
refresh()
|
||||
/**
|
||||
* @description 处理成功的回调
|
||||
*/
|
||||
const successCallback = () => {
|
||||
refresh()
|
||||
}
|
||||
|
||||
|
||||
// 表格操作栏 查看按钮回调
|
||||
const viewDetail = (r) => {
|
||||
setDetailPoint(r);
|
||||
setModalVisible(true)
|
||||
}
|
||||
// 表格操作栏 处理按钮回调
|
||||
const handlerPrecess = (r,type) => {
|
||||
setDetailPoint(r);
|
||||
setPrecessVisible(true)
|
||||
setMode(type)
|
||||
}
|
||||
|
||||
// 获取白蚁统计数量
|
||||
|
|
@ -160,6 +207,170 @@ const Page = () => {
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
// 获取白蚁所有测点
|
||||
const getCdList = async (params) => {
|
||||
|
||||
try {
|
||||
const res = await httppost2(apiurl.rcgl.byfz.bypc.allCd,params);
|
||||
if (res.code == 200) {
|
||||
setAllCdList(res.data);
|
||||
// 添加标记点到地图
|
||||
if (map && res.data && res.data.length > 0) {
|
||||
addMarkersToMap(res.data);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 添加标记点到地图
|
||||
const addMarkersToMap = (points) => {
|
||||
if (!map) return;
|
||||
|
||||
// 如果已存在矢量图层，先移除
|
||||
if (vectorLayer) {
|
||||
map.removeLayer(vectorLayer);
|
||||
}
|
||||
|
||||
// 创建矢量数据源
|
||||
const vectorSource = new VectorSource();
|
||||
|
||||
// 遍历所有点位数据
|
||||
points.forEach(point => {
|
||||
// 确保点位有经纬度
|
||||
if (point.lgtd && point.lttd) {
|
||||
// 创建要素
|
||||
const feature = new Feature({
|
||||
geometry: new Point(proj.fromLonLat([point.lgtd, point.lttd])),
|
||||
properties: point // 保存点位的所有属性
|
||||
});
|
||||
|
||||
// 根据status设置样式
|
||||
const color = point.status === 1 ? '#d9001b' :
|
||||
point.status === 0 ? '#04d919':'#8c8c8c'
|
||||
; // 1为红色，0为绿色 null 为灰色
|
||||
|
||||
feature.setStyle(new Style({
|
||||
image: new CircleStyle({
|
||||
radius: 4,
|
||||
fill: new Fill({ color: color }),
|
||||
stroke: new Stroke({ color: '#ffffff', width: 1 })
|
||||
})
|
||||
}));
|
||||
|
||||
// 添加要素到数据源
|
||||
vectorSource.addFeature(feature);
|
||||
}
|
||||
});
|
||||
|
||||
// 创建矢量图层
|
||||
const newVectorLayer = new VectorLayer({
|
||||
source: vectorSource,
|
||||
zIndex: 10 // 确保点位在地图上层显示
|
||||
});
|
||||
|
||||
// 添加图层到地图
|
||||
map.addLayer(newVectorLayer);
|
||||
|
||||
// 保存矢量图层引用
|
||||
setVectorLayer(newVectorLayer);
|
||||
|
||||
// 添加点击事件处理
|
||||
// map.on('click', (event) => {
|
||||
// const feature = map.forEachFeatureAtPixel(event.pixel, function(feature) {
|
||||
// return feature;
|
||||
// });
|
||||
|
||||
// if (feature) {
|
||||
// const properties = feature.get('properties');
|
||||
// if (properties) {
|
||||
// // 可以在这里处理点击事件，比如显示详情等
|
||||
// console.log('点击了标记点:', properties);
|
||||
// // 可以添加弹窗或其他交互
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
};
|
||||
|
||||
|
||||
// 修改高亮显示选中的测点函数
|
||||
const highlightFeature = (feature) => {
|
||||
if (!feature || !highlightLayer) return;
|
||||
|
||||
// 清除之前的高亮
|
||||
highlightLayer.getSource().clear();
|
||||
|
||||
// 获取要素属性
|
||||
const properties = feature.get('properties');
|
||||
const color = properties.status === 1 ? '#d9001b' : '#04d919';
|
||||
|
||||
// 创建一个新的要素用于高亮显示
|
||||
const highlightFeature = new Feature({
|
||||
geometry: feature.getGeometry().clone(),
|
||||
properties: properties
|
||||
});
|
||||
|
||||
// 设置高亮样式
|
||||
highlightFeature.setStyle(new Style({
|
||||
image: new CircleStyle({
|
||||
radius: 10, // 放大图标
|
||||
fill: new Fill({ color: color }),
|
||||
stroke: new Stroke({ color: '#ffffff', width: 3 })
|
||||
}),
|
||||
text: new Text({
|
||||
text: properties.order || '未命名测点',
|
||||
offsetY: -20,
|
||||
font: 'bold 14px Arial',
|
||||
fill: new Fill({ color: '#333' }),
|
||||
stroke: new Stroke({ color: '#fff', width: 3 })
|
||||
})
|
||||
}));
|
||||
|
||||
// 添加到高亮图层
|
||||
highlightLayer.getSource().addFeature(highlightFeature);
|
||||
|
||||
// 更新选中的要素引用
|
||||
setSelectedFeature(feature);
|
||||
|
||||
// 平移地图到选中的要素位置
|
||||
const geometry = feature.getGeometry();
|
||||
const coordinate = geometry.getCoordinates();
|
||||
map.getView().animate({
|
||||
center: coordinate,
|
||||
duration: 500,
|
||||
zoom: map.getView().getZoom() < 18 ? 18 : map.getView().getZoom()
|
||||
});
|
||||
};
|
||||
|
||||
// 根据测点ID查找对应的要素
|
||||
const findFeatureByDeviceId = (deviceId) => {
|
||||
if (!vectorLayer) return null;
|
||||
|
||||
let targetFeature = null;
|
||||
vectorLayer.getSource().forEachFeature((feature) => {
|
||||
const properties = feature.get('properties');
|
||||
if (properties && properties.order === deviceId) {
|
||||
targetFeature = feature;
|
||||
}
|
||||
});
|
||||
|
||||
return targetFeature;
|
||||
};
|
||||
|
||||
// 处理表格行点击事件
|
||||
const handleRowClick = (record,event) => {
|
||||
// 如果点击的是操作列中的元素，不触发地图交互
|
||||
if (event && (event.target.closest('button') || event.target.closest('.ant-btn'))) {
|
||||
return;
|
||||
}
|
||||
const feature = findFeatureByDeviceId(record.order);
|
||||
if (feature) {
|
||||
highlightFeature(feature);
|
||||
}
|
||||
};
|
||||
useEffect(() => {
|
||||
const params = {
|
||||
search: {
|
||||
|
|
@ -170,69 +381,183 @@ const Page = () => {
|
|||
getCount();
|
||||
}, [searchVal])
|
||||
|
||||
// 初始化地图
|
||||
useEffect(() => {
|
||||
if (!mapContainerRef.current) return;
|
||||
|
||||
// 创建地图实例
|
||||
const mapInstance = new Map({
|
||||
target: mapContainerRef.current,
|
||||
controls: [],
|
||||
view: new View({
|
||||
center: proj.fromLonLat([114.764317000, 31.496800000]), // 设置地图中心点坐标
|
||||
zoom: 18.4, // 设置初始缩放级别
|
||||
minZoom: 5.5,
|
||||
maxZoom: 30,
|
||||
}),
|
||||
});
|
||||
|
||||
// 添加天地图卫星影像图层
|
||||
const satelliteLayer = new TileLayer({
|
||||
source: new XYZSource({
|
||||
url: "https://t{0-7}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=efc861f25f96dc6e5f884f0403ebfefd",
|
||||
}),
|
||||
maxZoom: 30,
|
||||
});
|
||||
|
||||
// 设置图层名称
|
||||
satelliteLayer.set('name', 'SatelliteImage');
|
||||
|
||||
// 添加图层到地图
|
||||
mapInstance.addLayer(satelliteLayer);
|
||||
|
||||
// 创建高亮图层
|
||||
const highlightVectorLayer = new VectorLayer({
|
||||
source: new VectorSource(),
|
||||
zIndex: 999, // 确保高亮图层在最上面
|
||||
style: null
|
||||
});
|
||||
|
||||
// 添加高亮图层到地图
|
||||
mapInstance.addLayer(highlightVectorLayer);
|
||||
setHighlightLayer(highlightVectorLayer);
|
||||
|
||||
// 创建弹出层
|
||||
const overlay = new Overlay({
|
||||
element: popupRef.current,
|
||||
positioning: 'bottom-center',
|
||||
stopEvent: false,
|
||||
offset: [0, -10]
|
||||
});
|
||||
mapInstance.addOverlay(overlay);
|
||||
setPopupOverlay(overlay);
|
||||
|
||||
// 添加地图点击事件
|
||||
mapInstance.on('click', (event) => {
|
||||
const feature = mapInstance.forEachFeatureAtPixel(event.pixel, function (feature) {
|
||||
return feature;
|
||||
});
|
||||
|
||||
if (feature) {
|
||||
setModalVisible(true)
|
||||
setDetailPoint(feature?.values_?.properties)
|
||||
highlightFeature(feature);
|
||||
}
|
||||
});
|
||||
|
||||
// 保存地图实例
|
||||
setMap(mapInstance);
|
||||
|
||||
// 组件卸载时清理地图
|
||||
return () => {
|
||||
if (mapInstance) {
|
||||
mapInstance.setTarget(null);
|
||||
}
|
||||
};
|
||||
}, []);
|
||||
|
||||
// 当地图实例创建完成后获取测点数据
|
||||
useEffect(() => {
|
||||
if (map && searchVal) {
|
||||
getCdList(searchVal);
|
||||
}
|
||||
}, [map,searchVal]);
|
||||
return (
|
||||
<>
|
||||
<div className='content-root clearFloat xybm' style={{paddingRight:"0",paddingBottom:"0"}}>
|
||||
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%" }}>
|
||||
<Row gutter={16} className='statsRow'>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#722ed1' }}>{count.totalPoint}</span>
|
||||
<span className="unit">个</span>
|
||||
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
||||
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%", display: 'flex' }}>
|
||||
<div className='by-left' style={{ width: "60%", height: "calc(100vh - 180px)" }} ref={mapContainerRef}></div>
|
||||
<div className='by-right' style={{ width: "40%", marginLeft: 10 }}>
|
||||
<Row gutter={16} className='statsRow'>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#722ed1' }}>{count.totalPoint}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>总监测点数</span>
|
||||
</div>
|
||||
<span className='label'>总监测点数</span>
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#f5222d' }}>{count.hasAnt}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>有白蚁</span>
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#52c41a' }}>{count.notAnt}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>无白蚁</span>
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#8c8c8c' }}>{count.noData}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>离线</span>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
<Card className='nonebox'>
|
||||
<ToolBar
|
||||
setSearchVal={setSearchVal}
|
||||
initData={initData}
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#f5222d' }}>{count.hasAnt}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>有白蚁</span>
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#52c41a' }}>{count.notAnt}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>无白蚁</span>
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<div className='statItem'>
|
||||
<div className='valueWrapper'>
|
||||
<span className='number' style={{ color: '#8c8c8c' }}>{count.noData}</span>
|
||||
<span className="unit">个</span>
|
||||
</div>
|
||||
<span className='label'>离线</span>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
<Card className='nonebox'>
|
||||
<ToolBar
|
||||
setSearchVal={setSearchVal}
|
||||
initData={initData}
|
||||
// onSave={command('save')}
|
||||
// role={role}
|
||||
/>
|
||||
</Card>
|
||||
<div className="ant-card-body" style={{ padding: "20px 0 0 0" ,marginRight:20}}>
|
||||
<Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width , y: "calc( 100vh - 400px )"}}/>
|
||||
/>
|
||||
</Card>
|
||||
<div className="ant-card-body" style={{ padding: "20px 0 0 0", marginRight: 20 }}>
|
||||
<Table
|
||||
columns={columns}
|
||||
rowKey="inx"
|
||||
{...tableProps}
|
||||
scroll={{ x: width, y: "calc( 100vh - 400px )" }}
|
||||
onRow={(record) => ({
|
||||
onClick: (event) => handleRowClick(record,event), // 添加行点击事件
|
||||
style: { cursor: 'pointer' } // 添加鼠标指针样式
|
||||
})}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{/* 添加测点详情Modal */}
|
||||
<Modal
|
||||
title={detailPoint?.order}
|
||||
open={modalVisible}
|
||||
onCancel={() => setModalVisible(false)}
|
||||
width={1000}
|
||||
footer={null}
|
||||
destroyOnClose
|
||||
>
|
||||
<PointHistory data={detailPoint} />
|
||||
</Modal>
|
||||
{/*处理弹框 */}
|
||||
<Modal
|
||||
title={mode == 'save' ? "处理" : '工单详情'}
|
||||
open={precessVisible}
|
||||
onCancel={() => setPrecessVisible(false)}
|
||||
width={1000}
|
||||
footer={null}
|
||||
destroyOnClose
|
||||
>
|
||||
<PrecessForm record={detailPoint} mode={mode} refresh={refresh} setPrecessVisible={setPrecessVisible} />
|
||||
</Modal>
|
||||
<BasicCrudModal
|
||||
width={1000}
|
||||
ref={refModal}
|
||||
title=""
|
||||
component={ModalForm}
|
||||
onCrudSuccess={successCallback}
|
||||
// onCrudSuccess={()=>{refresh({addvcd:localStorage.getItem('ADCD6')})}}
|
||||
// onCrudSuccess={()=>{refresh({addvcd:localStorage.getItem('ADCD6')})}}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,109 @@
|
|||
import React,{useEffect,useState} from 'react'
|
||||
import { DatePicker, Table, Button, Form } from 'antd'
|
||||
import usePageTable from '../../../../components/crud/usePageTable2';
|
||||
import { createCrudService } from '../../../../components/crud/_';
|
||||
import apiurl from '../../../../service/apiurl';
|
||||
import moment from 'moment';
|
||||
const {RangePicker} = DatePicker
|
||||
export default function PointHistory({data}) {
|
||||
const columns = [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'inx',
|
||||
key: 'inx',
|
||||
width: 60,
|
||||
// render: (_, __, index) => index + 1
|
||||
},
|
||||
{
|
||||
title: '测点编号',
|
||||
dataIndex: 'order',
|
||||
key: 'order',
|
||||
width: 130
|
||||
},
|
||||
{
|
||||
title: '监测时间',
|
||||
dataIndex: 'obDate',
|
||||
key: 'obDate',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '白蚁入侵',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
width: 100,
|
||||
render: (status) => <span>{status === 1 ? '有' : '无'}</span>
|
||||
},
|
||||
{
|
||||
title: '电量',
|
||||
dataIndex: 'electricity',
|
||||
key: 'electricity',
|
||||
width: 80
|
||||
}
|
||||
]
|
||||
const [searchVal, setSearchVal] = useState({
|
||||
dateTimeRangeSo: {
|
||||
start: moment().subtract(1, 'days').format('YYYY-MM-DD HH:mm:ss'),
|
||||
end:moment().format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
})
|
||||
|
||||
const [form] = Form.useForm();
|
||||
|
||||
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.byfz.bypc.historyPage).find_noCode);
|
||||
const onReset = () => {
|
||||
form.resetFields();
|
||||
};
|
||||
const onFinish = (values) => {
|
||||
let dateSo;
|
||||
if (values.tm) {
|
||||
dateSo = {
|
||||
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||||
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
|
||||
}
|
||||
}
|
||||
delete values.tm
|
||||
setSearchVal({...values, dateTimeRangeSo:dateSo});
|
||||
}
|
||||
useEffect(() => {
|
||||
const params = {
|
||||
search: {
|
||||
...searchVal,
|
||||
order:data?.order
|
||||
}
|
||||
};
|
||||
search(params)
|
||||
}, [searchVal,data])
|
||||
|
||||
useEffect(() => {
|
||||
form.setFieldValue('tm',[moment().subtract(1,'days'),moment()])
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className='toolBar' >
|
||||
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||
<Form.Item label="监测时间" name="tm">
|
||||
<RangePicker
|
||||
allowClear
|
||||
style={{ width: "350px" }}
|
||||
showTime
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" >查询</Button>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button htmlType="button" onClick={onReset}>重置</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
|
||||
</div>
|
||||
<Table
|
||||
columns={columns}
|
||||
rowKey="inx"
|
||||
{...tableProps}
|
||||
style={{marginTop:10}}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,740 @@
|
|||
import React, { useEffect, useState, useMemo, useRef } from 'react';
|
||||
import { Form, Button, Input, Row, Upload, Col, Table, TreeSelect, DatePicker, InputNumber, message, Image, Radio, Modal, Descriptions, Tabs, Tooltip } from 'antd';
|
||||
import { VideoCameraOutlined } from '@ant-design/icons';
|
||||
import { formItemLayout, btnItemLayout } from '../../../../components/crud/FormLayoutProps';
|
||||
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
||||
import { CrudOpRender_text } from '../../../../components/crud/CrudOpRender';
|
||||
import apiurl from '../../../../service/apiurl';
|
||||
import FormComponent from "./formCom"
|
||||
import NormalSelect from '../../../../components/Form/NormalSelect';
|
||||
|
||||
import "./index.less"
|
||||
import moment from 'moment';
|
||||
import { httpget2, xyt_httpget2, httppost2 } from '../../../../utils/request';
|
||||
const { RangePicker } = DatePicker
|
||||
const { Dragger } = Upload;
|
||||
const url = "http://223.75.53.141:9100/gs-tsg"
|
||||
|
||||
|
||||
const ModalForm = ({ mode, record, refresh, setPrecessVisible }) => {
|
||||
const taskTypes = [
|
||||
{ label: "日常巡查", value: 1 },
|
||||
{ label: "特别检查", value: 2 },
|
||||
{ label: "汛前巡检", value: 3 },
|
||||
]
|
||||
|
||||
const xjStatus = {
|
||||
0: "cha",
|
||||
1: "gou"
|
||||
}
|
||||
const [form] = Form.useForm();
|
||||
const [form1] = Form.useForm();
|
||||
const [precessType, setPrecessType] = useState()
|
||||
const [itemList, setItemList] = useState([])
|
||||
const [itemParams, setItemParams] = useState([])
|
||||
const [list, setList] = useState([])
|
||||
const [totals, setTotals] = useState({})
|
||||
const [tabsRender, setTabsRender] = useState([])
|
||||
const [imgVisible, setImgVisible] = useState(false)
|
||||
const [imgList, setImgList] = useState([])
|
||||
const [videoOpen, setVideoOpen] = useState(false)
|
||||
const [videoParams, setVideoParams] = useState({})
|
||||
const [handleDetailsOpen, setHandleDetailsOpen] = useState(false)
|
||||
const [handleDetails, setHandleDetails] = useState({})
|
||||
const [handleImgfileList, setHandleImgFileList] = useState([]) //上传文件列表
|
||||
const [handleVideoFileList, setHandleVideoFileList] = useState([]) //上传文件列表
|
||||
const handleDetail = (row) => {
|
||||
setHandleDetailsOpen(true)
|
||||
setHandleDetails(row)
|
||||
}
|
||||
const reviewPic = (arrPic) => {
|
||||
if (arrPic.length > 0) {
|
||||
setImgVisible(true)
|
||||
setImgList(arrPic)
|
||||
}
|
||||
}
|
||||
|
||||
const reviewVideo = (arrVideo) => {
|
||||
if (arrVideo.length > 0) {
|
||||
setVideoOpen(true)
|
||||
setVideoParams(arrVideo[0])
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const renderTooltip = (value) => {
|
||||
return (
|
||||
<>
|
||||
<Descriptions>
|
||||
<Descriptions.Item label="问题描述" span={3}>
|
||||
{value?.itemProblemDesc}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="处理建议">
|
||||
{value?.handleSuggestion}
|
||||
</Descriptions.Item>
|
||||
</Descriptions>
|
||||
</>
|
||||
)
|
||||
}
|
||||
const columns = [
|
||||
{
|
||||
title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center",
|
||||
render: (value, row, index) => <span>{index + 1}</span>
|
||||
},
|
||||
{
|
||||
title: '巡查项', key: 'itemDesc', dataIndex: 'itemDesc', width: 200,
|
||||
render: (value, row, index) =>
|
||||
<div style={{ position: "relative" }}>
|
||||
<div style={{ width: "80%", whiteSpace: "nowrap", textOverflow: "ellipsis", overflow: "hidden" }} title={value}>{value}</div>
|
||||
<span style={{ position: "absolute", top: 0, right: 0 }}>
|
||||
<Tooltip
|
||||
title={renderTooltip(row)}
|
||||
color='#ffffff'
|
||||
>
|
||||
<img style={{ width: 20, height: 20 }} src={`${process.env.PUBLIC_URL}/assets/xyt/rcgl/wenhao.png`} />
|
||||
</Tooltip>
|
||||
</span>
|
||||
</div>
|
||||
},
|
||||
{
|
||||
title: '巡查状态', key: 'isNormal', dataIndex: 'isNormal', width: 100, align: "center",
|
||||
render: (value) => <div>
|
||||
{value === null ? '' :
|
||||
<img style={{ width: value ? 20 : 17, height: value ? 20 : 17 }} src={`${process.env.PUBLIC_URL}/assets/xyt/rcgl/${xjStatus[value]}.png`}
|
||||
alt='' />
|
||||
}
|
||||
</div>
|
||||
},
|
||||
{ title: '巡查问题描述', key: 'problemDesc', dataIndex: 'problemDesc', width: 300, ellipsis: true },
|
||||
{
|
||||
title: '巡查图片', key: 'inspectPics', dataIndex: 'inspectPics', width: 100, align: "center",
|
||||
render: (value) => <div>{value ? <a onClick={() => reviewPic(value)}> {value.length} </a> : ''}</div>
|
||||
|
||||
},
|
||||
{
|
||||
title: '巡查视频', key: 'inspectVideos', dataIndex: 'inspectVideos', width: 100, align: "center",
|
||||
render: (value) => <div>{value ? <a onClick={() => reviewVideo(value)}> {value.length} </a> : ''}</div>
|
||||
|
||||
},
|
||||
{
|
||||
title: '是否处理', key: 'isHandle', dataIndex: 'isHandle', width: 100, align: "center",
|
||||
render: (value) => <span>{value ? "是" : "否"}</span>
|
||||
},
|
||||
{ title: '处理人', key: 'handleUserName', dataIndex: 'handleUserName', width: 150 },
|
||||
{
|
||||
title: '操作', key: 'operator', dataIndex: 'operator', width: 150,
|
||||
render: (value, row) => <a onClick={() => handleDetail(row)}>处理详情</a>
|
||||
},
|
||||
|
||||
]
|
||||
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||
|
||||
const renderItems = (items) => {
|
||||
const result = items.map(o => ({
|
||||
key: o.pointId,
|
||||
label: o.name + `(${o.children.filter(r => r.isNormal == 0).length})`,
|
||||
children:
|
||||
<Table
|
||||
columns={columns}
|
||||
rowKey={o.id}
|
||||
pagination={false}
|
||||
dataSource={o.children}
|
||||
scroll={{ x: width, y: "calc( 100vh - 400px )" }} />
|
||||
}))
|
||||
setTabsRender(result)
|
||||
}
|
||||
|
||||
const getTabsDetail = async (id) => {
|
||||
let items = {};
|
||||
try {
|
||||
const res = await httpget2(apiurl.rcgl.xcxj.xjrw.info, { taskId: id });
|
||||
renderItems(res.data)
|
||||
res.data.forEach(o => {
|
||||
items.isNormalTotal = o.children.filter(item => item.isNormal == 0).length;
|
||||
items.normalTotal = o.children.filter(item => item.isNormal == 1).length;
|
||||
})
|
||||
setTotals(items);
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
const handleTree = (arr) => {
|
||||
|
||||
const res = arr.map(item => {
|
||||
item.value = item.id;
|
||||
item.title = item.itemDesc;
|
||||
if (item.children) {
|
||||
item.children = handleTree(item.children)
|
||||
}
|
||||
return item;
|
||||
})
|
||||
return res
|
||||
}
|
||||
|
||||
|
||||
const getItemList = async () => {
|
||||
try {
|
||||
const res = await httpget2(apiurl.rcgl.xcxj.xjrw.list);
|
||||
if (res.code === 200) {
|
||||
const arr1 = res.data.map(item => ({
|
||||
id: item.id,
|
||||
itemDesc: item.name,
|
||||
children: item.children,
|
||||
disabled: item.children.length > 0 ? false : true
|
||||
}));
|
||||
const result = handleTree(arr1)
|
||||
setList(res.data)
|
||||
console.log(result);
|
||||
setItemList(result)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
const onfinish = (values) => {
|
||||
const userId = localStorage.getItem('userId')
|
||||
const userName = localStorage.getItem('userName')
|
||||
values.inspectTask = values.isWarn == 2 ? {
|
||||
startDate: values.startDate || '',
|
||||
endDate: values.endDate || '',
|
||||
inspectUserName: deptUserList?.find(item => item.userId == values.inspectUserId)?.nickName,
|
||||
items: itemParams,
|
||||
inspectUserId: values?.inspectUserId,
|
||||
taskContent: values?.taskContent,
|
||||
taskTitle: values?.taskTitle,
|
||||
taskType: values?.taskType,
|
||||
createUserId: userId,
|
||||
createUserName: userName
|
||||
} : null
|
||||
if (mode === 'save') {
|
||||
onSave(apiurl.rcgl.byfz.bypc.process, values)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const onSave = async (url, params) => {
|
||||
const newParams = { ...params, order: record?.order, obDate: record?.obDate }
|
||||
try {
|
||||
const { code, data } = await httppost2(url, newParams);
|
||||
if (code == 200) {
|
||||
message.success('处理成功')
|
||||
setPrecessVisible(false)
|
||||
refresh();
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
const onValuesChange = (v, r) => {
|
||||
setPrecessType(r.isWarn)
|
||||
}
|
||||
|
||||
const itemChange = (a, b, c) => {
|
||||
const itemArr = a.map(item => {
|
||||
let pointId;
|
||||
list.forEach(o => {
|
||||
if (o.id != item && !pointId) {
|
||||
pointId = o.children?.find(t => t.id == item)?.pointId;
|
||||
}
|
||||
})
|
||||
return {
|
||||
itemId: item,
|
||||
pointId
|
||||
}
|
||||
})
|
||||
setItemParams(itemArr)
|
||||
}
|
||||
|
||||
|
||||
const [deptList, setDeptList] = useState([])
|
||||
const [deptUserList, setDeptUserList] = useState([])
|
||||
const buildTree = (data, parentId) => {
|
||||
let tree = [];
|
||||
data.forEach((node) => {
|
||||
node.title = node.deptName;
|
||||
node.key = node.deptId;
|
||||
|
||||
if (node.parentId === parentId) {
|
||||
let children = buildTree(data, node.deptId);
|
||||
if (children.length) {
|
||||
node.children = children;
|
||||
}
|
||||
tree.push(node);
|
||||
}
|
||||
});
|
||||
return tree;
|
||||
}
|
||||
|
||||
const handleTreeList = (dept, user) => {
|
||||
const deptArr = dept.map(item => {
|
||||
return {
|
||||
...item,
|
||||
value: item.deptId,
|
||||
title: item.deptName,
|
||||
disabled: item.userId ? false : true,
|
||||
children: user.filter(u => u.deptId == item.deptId).map(u => ({
|
||||
...u,
|
||||
value: u.userId,
|
||||
title: u.nickName
|
||||
}))
|
||||
}
|
||||
})
|
||||
console.log("deptArr", deptArr);
|
||||
const treelist = buildTree(deptArr, 0)
|
||||
return treelist
|
||||
}
|
||||
const treeList = useMemo(() => {
|
||||
if (deptUserList?.length > 0 && deptList?.length > 0) {
|
||||
return handleTreeList(deptList, deptUserList)
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
}, [deptUserList, deptList])
|
||||
|
||||
// 获取部门数据
|
||||
const getDeptList = async () => {
|
||||
try {
|
||||
const result = await xyt_httpget2(apiurl.rcgl.zbgl.zbb.deptlist);
|
||||
if (result.code == 200) {
|
||||
setDeptList(result.data);
|
||||
getDeptUser(result.data[0])
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
|
||||
// 获取部门人员数据
|
||||
const getDeptUser = async () => {
|
||||
try {
|
||||
const result = await xyt_httpget2(apiurl.rcgl.zbgl.zbb.userList, { pageNum: 1, pageSize: 9999 });
|
||||
if (result.code == 200) {
|
||||
setDeptUserList(result.rows)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
getDeptList()
|
||||
getItemList()
|
||||
}, [])
|
||||
|
||||
const handleFile = (arr = []) => {
|
||||
const newArr = arr?.map(item => ({
|
||||
name: item.fileName,
|
||||
filePath: item.filePath,
|
||||
fileId: item.fileId
|
||||
}))
|
||||
return newArr
|
||||
}
|
||||
useEffect(() => {
|
||||
const handleImgFile = handleFile(handleDetails?.handlePics || []);
|
||||
const hanldeVideoFile = handleFile(handleDetails?.handleVideos || []);
|
||||
setHandleImgFileList(handleImgFile)
|
||||
setHandleVideoFileList(hanldeVideoFile)
|
||||
}, [handleDetails])
|
||||
|
||||
useEffect(() => {
|
||||
if (mode != 'save' && record.jcskByRProcessVo) {
|
||||
const backParmas = {
|
||||
...record.jcskByRProcessVo,
|
||||
isWarn: 2,
|
||||
}
|
||||
form.setFieldsValue(backParmas)
|
||||
setPrecessType(2)
|
||||
getTabsDetail(record?.jcskByRProcessVo?.id)
|
||||
}
|
||||
}, [mode, record])
|
||||
|
||||
useEffect(() => {
|
||||
if (record && mode == 'save') {
|
||||
const title = record?.obDate ? record?.obDate + '白蚁处理' : ""
|
||||
const content = (record?.order && record?.obDate)? record?.order + '白蚁监测点于' + record?.obDate + '监测到白蚁入侵，请尽快排查处理':""
|
||||
const initalObj = {
|
||||
"hours": 24,
|
||||
"taskType": 2,
|
||||
"taskTitle":title,
|
||||
"taskContent":content,
|
||||
"startDate": moment(),
|
||||
"endDate":moment().add(7,'day')
|
||||
}
|
||||
for (let key in initalObj) {
|
||||
form.setFieldValue(key,initalObj[key])
|
||||
}
|
||||
}
|
||||
}, [record,mode])
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
{mode == 'view' &&
|
||||
<div
|
||||
style={{ marginBottom: 20, borderBottom: "1px solid #dfdfdf", width: "100%", paddingBottom: 5 }}>
|
||||
<span style={{ padding: "0px 3px", backgroundColor: "#0079fe", marginRight: 20 }}></span>基本信息
|
||||
</div>
|
||||
}
|
||||
<Form
|
||||
form={form}
|
||||
{...formItemLayout}
|
||||
onFinish={onfinish}
|
||||
onValuesChange={onValuesChange}
|
||||
>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="单点报警取消"
|
||||
name="isWarn"
|
||||
labelCol={{ span: 4 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Radio.Group disabled={mode === 'view'} >
|
||||
<Radio value={1}>误报并取消报警</Radio>
|
||||
<Radio value={2}>取消报警并创建工单</Radio>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="单点位报警重复豁免时长(h)"
|
||||
name="hours"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
labelCol={{ span: 6 }}
|
||||
wrapperCol={{ span: 18 }}
|
||||
>
|
||||
<InputNumber disabled={mode === 'view'} min={0} style={{ width: '30%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
{precessType == 2 ?
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="任务类型"
|
||||
name="taskType"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<NormalSelect
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
options={taskTypes}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="任务标题"
|
||||
name="taskTitle"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input
|
||||
disabled={mode === 'view'}
|
||||
style={{ width: '100%' }}
|
||||
allowClear
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="选择巡查人"
|
||||
name="inspectUserId"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<TreeSelect
|
||||
disabled={mode === 'view'}
|
||||
showSearch
|
||||
style={{
|
||||
width: '100%',
|
||||
}}
|
||||
dropdownStyle={{
|
||||
maxHeight: 400,
|
||||
overflow: 'auto',
|
||||
}}
|
||||
allowClear
|
||||
treeDefaultExpandAll
|
||||
treeData={treeList}
|
||||
treeNodeFilterProp='title'
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
{
|
||||
mode != 'view' &&
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="巡查项"
|
||||
name="items"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
>
|
||||
<TreeSelect
|
||||
showSearch
|
||||
style={{
|
||||
width: '100%',
|
||||
}}
|
||||
dropdownStyle={{
|
||||
maxHeight: 400,
|
||||
overflow: 'auto',
|
||||
}}
|
||||
onChange={itemChange}
|
||||
allowClear
|
||||
treeDefaultExpandAll
|
||||
treeData={itemList}
|
||||
treeNodeFilterProp='title'
|
||||
treeCheckable={true}
|
||||
maxTagCount={1}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
}
|
||||
|
||||
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="任务内容"
|
||||
name="taskContent"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
>
|
||||
<Input.TextArea disabled={mode === 'view'} style={{ width: '100%', minHeight: '100px' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="开始日期"
|
||||
name="startDate"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
getValueFromEvent={(e, dateString) => dateString}
|
||||
getValueProps={(value) => ({ value: value ? moment(value) : undefined })}
|
||||
|
||||
>
|
||||
<DatePicker disabled={mode === 'view'} format={'YYYY-MM-DD'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="结束日期"
|
||||
name="endDate"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
getValueFromEvent={(e, dateString) => dateString}
|
||||
getValueProps={(value) => ({ value: value ? moment(value) : undefined })}
|
||||
|
||||
>
|
||||
<DatePicker disabled={mode === 'view'} format={'YYYY-MM-DD'} style={{ width: '100%' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row> : null
|
||||
}
|
||||
{(mode == 'view') &&
|
||||
<>
|
||||
<div
|
||||
style={{ borderBottom: "1px solid #dfdfdf", width: "100%", paddingBottom: 5, display: "flex" }}>
|
||||
<span style={{ padding: "0px 3px", backgroundColor: "#0079fe", marginRight: 20 }}></span>
|
||||
<span>巡查信息</span>
|
||||
{record?.jcskByRProcessVo?.status == 2 ?
|
||||
<span style={{ marginLeft: "auto", marginRight: 30 }}>(异常项：<span style={{ color: "red" }}>{totals?.isNormalTotal}</span>，正常项：{totals?.normalTotal})</span>
|
||||
: null
|
||||
}
|
||||
</div>
|
||||
{
|
||||
record?.jcskByRProcessVo?.status == 2 ?
|
||||
<Tabs
|
||||
defaultActiveKey="1"
|
||||
items={tabsRender}
|
||||
tabBarStyle={{ marginLeft: 20 }}
|
||||
/>
|
||||
:
|
||||
<img
|
||||
src={`${process.env.PUBLIC_URL}/assets/noData.png`}
|
||||
alt=''
|
||||
style={{ marginLeft: '36%', marginTop: "3%" }}
|
||||
/>
|
||||
}
|
||||
</>
|
||||
}
|
||||
{
|
||||
mode === 'view' ? null : (
|
||||
<>
|
||||
<Form.Item wrapperCol={{ span: 3, offset: 21 }} style={{ marginTop: "4%" }}>
|
||||
<Button type="primary" htmlType="submit" >
|
||||
{mode === 'save' ? '提交' : '修改'}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</>
|
||||
)
|
||||
}
|
||||
</Form>
|
||||
<div style={{ display: "none" }}>
|
||||
<Image.PreviewGroup
|
||||
preview={{
|
||||
visible: imgVisible,
|
||||
onVisibleChange: (vis) => setImgVisible(vis),
|
||||
}}
|
||||
>
|
||||
{
|
||||
imgList.length > 0 ? imgList.map(item => (
|
||||
<Image src={url + item.filePath} key={item?.id} />
|
||||
))
|
||||
: null
|
||||
}
|
||||
|
||||
</Image.PreviewGroup>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<Modal
|
||||
open={videoOpen}
|
||||
width={800}
|
||||
title="视频预览"
|
||||
footer={null}
|
||||
onCancel={() => setVideoOpen(false)}
|
||||
>
|
||||
<video
|
||||
controls
|
||||
src={url + videoParams?.filePath}
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
/>
|
||||
</Modal>
|
||||
|
||||
<Modal
|
||||
open={handleDetailsOpen}
|
||||
width={800}
|
||||
title="处理详情"
|
||||
footer={null}
|
||||
onCancel={() => setHandleDetailsOpen(false)}
|
||||
>
|
||||
<>
|
||||
<Form
|
||||
form={form1}
|
||||
{...formItemLayout}
|
||||
initialValues={handleDetails}
|
||||
>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="处理图片"
|
||||
name="picId"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
>
|
||||
<Row gutter={[16]}>
|
||||
{
|
||||
handleImgfileList.length > 0 && handleImgfileList.map(file => {
|
||||
return (
|
||||
<Col span={12}>
|
||||
<div className={mode == "view" ? 'file-item view-file' : 'file-item'} >
|
||||
<div className='file-description'>
|
||||
<Image width={60} src={url + file.filePath} alt='' />
|
||||
<span>{file.name}</span>
|
||||
</div>
|
||||
</div>
|
||||
</Col>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Row>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="处理视频"
|
||||
name="picId"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
>
|
||||
<Row gutter={[16]}>
|
||||
{
|
||||
handleVideoFileList.length > 0 && handleVideoFileList.map(file => {
|
||||
return (
|
||||
<Col span={12}>
|
||||
<div className={mode == "view" ? 'file-item view-file' : 'file-item'} >
|
||||
<div className='file-description'>
|
||||
<div
|
||||
onClick={() => {setVideoOpen(true); setVideoParams(file) }}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<VideoCameraOutlined
|
||||
style={{ fontSize: 40 }}
|
||||
/>
|
||||
</div>
|
||||
<span>{file.name}</span>
|
||||
</div>
|
||||
</div>
|
||||
</Col>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Row>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form.Item
|
||||
label="处理描述"
|
||||
name="handleDesc"
|
||||
labelCol={{ span: 3 }}
|
||||
wrapperCol={{ span: 19 }}
|
||||
>
|
||||
<Input.TextArea disabled={mode === 'view'} style={{ width: '100%', minHeight: '100px' }} allowClear />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
</>
|
||||
</Modal>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ModalForm;
|
||||
|
|
@ -34,13 +34,13 @@ const ToolBar = ({ setSearchVal, onSave, storeData, role, initData }) => {
|
|||
<Form.Item label="监测日期" name="year">
|
||||
<DatePicker
|
||||
allowClear={false}
|
||||
style={{ width: "240px" }}
|
||||
style={{ width: "140px" }}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item label="测点编号" name="order">
|
||||
<Input
|
||||
allowClear
|
||||
style={{ width: "240px" }}
|
||||
style={{ width: "140px" }}
|
||||
/>
|
||||
</Form.Item>
|
||||
{/* <Form.Item label="危害情况" name="isHarm">
|
||||
|
|
|
|||
|
|
@ -152,12 +152,8 @@ const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave,submit }) => {
|
|||
const handleFile = (arr=[]) => {
|
||||
const newArr = arr?.map(item => ({
|
||||
name: item.fileName,
|
||||
response: {
|
||||
data: {
|
||||
filePath: item.filePath,
|
||||
fileId:item.fileId
|
||||
}
|
||||
},
|
||||
filePath: item.filePath,
|
||||
fileId:item.fileId
|
||||
}))
|
||||
return newArr
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ export default function Sksq() {
|
|||
|
||||
const getData = async (params) => {
|
||||
const data = await reservoirlist(params)
|
||||
setTableData(data.filter(o=>o.stnm==='檀树岗' || o.stnm==='檀树岗(新)'));
|
||||
setTableData(data);
|
||||
}
|
||||
useEffect(() => {
|
||||
let option = {
|
||||
|
|
@ -38,8 +38,8 @@ export default function Sksq() {
|
|||
<span>站点：
|
||||
<NormalSelect
|
||||
allowClear={false}
|
||||
style={{ width: '150px' }}
|
||||
options={tableData.map((item,index)=>({ label: item.stnm, value: index }))}
|
||||
style={{ width: '250px' }}
|
||||
options={tableData.map((item,index)=>({ label: item.stnm, value:index }))}
|
||||
value={selected}
|
||||
onChange={(e) => setSelected(e)}
|
||||
/>
|
||||
|
|
|
|||
Loading…
Reference in New Issue