Merge branch 'master' into qzc-dev
commit
7c7dfd0198
|
|
@ -413,7 +413,10 @@ const apiurl = {
|
||||||
edit: service_fxdd + "/termite/survey/update",
|
edit: service_fxdd + "/termite/survey/update",
|
||||||
delete: service_fxdd + "/termite/survey/del",
|
delete: service_fxdd + "/termite/survey/del",
|
||||||
detail: service_fxdd + "/termite/survey/detail",
|
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: {
|
fzxc: {
|
||||||
page: service_fxdd + "/termite/adver/file/page",
|
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) => {
|
.map((i) => {
|
||||||
return {
|
return {
|
||||||
id : i.stcd,
|
id : i.stcd,
|
||||||
|
|
@ -104,7 +104,6 @@ export default class ShuiKuLayer extends BaseLayer {
|
||||||
...i
|
...i
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
this._dispatch.runtime.setMarkers({
|
this._dispatch.runtime.setMarkers({
|
||||||
[this.getLayerName()]: list || []
|
[this.getLayerName()]: list || []
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -47,7 +47,7 @@ export default function drpOption(data,yjData) {
|
||||||
{
|
{
|
||||||
type: 'category',
|
type: 'category',
|
||||||
data: data.map(o => o.tm),
|
data: data.map(o => o.tm),
|
||||||
inverse: false,
|
inverse: true,
|
||||||
splitLine: {
|
splitLine: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -47,7 +47,7 @@ export default function drpOption(data,yjData) {
|
||||||
{
|
{
|
||||||
type: 'category',
|
type: 'category',
|
||||||
data: data.map(o => o.tm),
|
data: data.map(o => o.tm),
|
||||||
inverse: false,
|
inverse: true,
|
||||||
splitLine: {
|
splitLine: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -8,9 +8,9 @@ const Tabledata = ({tableData}) => {
|
||||||
{ title: '序号', key: '', dataIndex: '', align: 'center',render:(a,b,c)=>c+1},
|
{ title: '序号', key: '', dataIndex: '', align: 'center',render:(a,b,c)=>c+1},
|
||||||
{ title: '时间', key: 'tm', dataIndex: 'tm', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
|
{ 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: '库水位(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: 'X方向位移(mm)', key: 'de', dataIndex: 'de', align: 'center',render: (rec) => <span>{rec ?? "-"}</span>},
|
||||||
{ title: 'Y方向位移(mm)', key: 'y', dataIndex: 'y', 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: 'h', dataIndex: 'h', 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) {
|
export default function drpOption(data,yjData) {
|
||||||
console.log("data",data);
|
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 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.x),...data.map(obj => obj.y),...data.map(obj => obj.h),...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 max2 = Math.max(...data.map(obj => obj.rz))
|
||||||
const min2 = Math.min(...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',
|
type: 'category',
|
||||||
data: data.map(o => o.tm),
|
data: data.map(o => o.tm),
|
||||||
inverse: false,
|
inverse: true,
|
||||||
splitLine: {
|
splitLine: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
|
|
@ -75,7 +75,7 @@ export default function drpOption(data,yjData) {
|
||||||
// gridIndex: 1,
|
// gridIndex: 1,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
position: 'left',
|
position: 'left',
|
||||||
name: "位移(m)",
|
name: "位移(mm)",
|
||||||
nameTextStyle: {
|
nameTextStyle: {
|
||||||
padding: [0, 0, 10, 10],
|
padding: [0, 0, 10, 10],
|
||||||
color:'#333333',
|
color:'#333333',
|
||||||
|
|
|
||||||
|
|
@ -88,7 +88,7 @@ function ShenYa({ id, data, dispatch, onCancel }) {
|
||||||
<div className="normalModalStyle homeModal2">
|
<div className="normalModalStyle homeModal2">
|
||||||
<div className="normalModalStyle_title">
|
<div className="normalModalStyle_title">
|
||||||
<div className="normalModalStyle_title_icon"></div>
|
<div className="normalModalStyle_title_icon"></div>
|
||||||
{data.stationCode}
|
{data.cdnm}
|
||||||
<div className="normalModalStyle_title_cancel">
|
<div className="normalModalStyle_title_cancel">
|
||||||
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -677,7 +677,7 @@ const HomePage = ({ showPanels }) => {
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
item.children.map((item) =>
|
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('')
|
setSearchVal('')
|
||||||
setCheckedObj(item)
|
setCheckedObj(item)
|
||||||
|
|
@ -699,7 +699,7 @@ const HomePage = ({ showPanels }) => {
|
||||||
</div>
|
</div>
|
||||||
: null
|
: null
|
||||||
}
|
}
|
||||||
</dit>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
</Panel>
|
</Panel>
|
||||||
|
|
|
||||||
|
|
@ -40,50 +40,50 @@ const Page = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="home_shuizhi">
|
<div className="home_shuizhi">
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>建筑物型式:</div>
|
<div>建筑物型式:</div>
|
||||||
<div>{tableData.buildType}</div>
|
<div>{tableData.buildType}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>地基特性:</div>
|
<div>地基特性:</div>
|
||||||
<div>{tableData.foundCharacter}</div>
|
<div>{tableData.foundCharacter}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>坝顶高程(m):</div>
|
<div>坝顶高程(m):</div>
|
||||||
<div>{tableData.damTopElev}</div>
|
<div>{tableData.damTopElev}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>最大坝高(m):</div>
|
<div>最大坝高(m):</div>
|
||||||
<div>{tableData.damMaxHeig}</div>
|
<div>{tableData.damMaxHeig}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>坝顶长度(m):</div>
|
<div>坝顶长度(m):</div>
|
||||||
<div>{tableData.damTopLen}</div>
|
<div>{tableData.damTopLen}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>坝顶宽度(m):</div>
|
<div>坝顶宽度(m):</div>
|
||||||
<div>{tableData.damTopWid}</div>
|
<div>{tableData.damTopWid}</div>
|
||||||
</dit>
|
</div>
|
||||||
{/* <dit className='home_shuizhi_item2'>
|
{/* <div className='home_shuizhi_item2'>
|
||||||
<div>防浪墙顶高程(m):</div>
|
<div>防浪墙顶高程(m):</div>
|
||||||
<div>{tableData.damWaveWall}</div>
|
<div>{tableData.damWaveWall}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>开工日期:</div>
|
<div>开工日期:</div>
|
||||||
<div>{tableData?.startDate?.slice(0,10)}</div>
|
<div>{tableData?.startDate?.slice(0,10)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>竣工日期:</div>
|
<div>竣工日期:</div>
|
||||||
<div>{tableData?.endDate?.slice(0,10)}</div>
|
<div>{tableData?.endDate?.slice(0,10)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>蓄水日期:</div>
|
<div>蓄水日期:</div>
|
||||||
<div>{tableData?.storageDate?.slice(0,10)}</div>
|
<div>{tableData?.storageDate?.slice(0,10)}</div>
|
||||||
</dit> */}
|
</div> */}
|
||||||
{/* <dit className='home_shuizhi_item2'>
|
{/* <div className='home_shuizhi_item2'>
|
||||||
<div>图片资料</div>
|
<div>图片资料</div>
|
||||||
<div></div>
|
<div></div>
|
||||||
</dit>
|
</div>
|
||||||
<div style={{margin:'10px 35px',height:'70ox',overflow:'hidden' }}>
|
<div style={{margin:'10px 35px',height:'70ox',overflow:'hidden' }}>
|
||||||
<div style={{width:100*(imgList.length||0),position:'relative',left:left+'px'}}>
|
<div style={{width:100*(imgList.length||0),position:'relative',left:left+'px'}}>
|
||||||
{
|
{
|
||||||
|
|
@ -120,10 +120,10 @@ const Page = () => {
|
||||||
/>
|
/>
|
||||||
</div> */}
|
</div> */}
|
||||||
{/* */}
|
{/* */}
|
||||||
{/* <dit className='home_shuizhi_item2'>
|
{/* <div className='home_shuizhi_item2'>
|
||||||
<div>视频资料:</div>
|
<div>视频资料:</div>
|
||||||
<div></div>
|
<div></div>
|
||||||
</dit> */}
|
</div> */}
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,7 @@ const Page = () => {
|
||||||
]
|
]
|
||||||
}else{
|
}else{
|
||||||
return [
|
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: '监测时间', 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>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> },
|
{ 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 (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="home_shuizhi">
|
<div className="home_shuizhi">
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>工程位置:</div>
|
<div>工程位置:</div>
|
||||||
<div>{tableData.resLoc}</div>
|
<div>{tableData.resLoc}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>水库规模:</div>
|
<div>水库规模:</div>
|
||||||
<div>{
|
<div>{
|
||||||
{
|
{
|
||||||
|
|
@ -53,51 +53,51 @@ const Page = () => {
|
||||||
9:'其他',
|
9:'其他',
|
||||||
}[tableData.engScal]
|
}[tableData.engScal]
|
||||||
}</div>
|
}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>主要功能:</div>
|
<div>主要功能:</div>
|
||||||
<div>{tableData.rsvFunction}</div>
|
<div>{tableData.rsvFunction}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>坝址以上流域面积(km²):</div>
|
<div>坝址以上流域面积(km²):</div>
|
||||||
<div>{getNum(tableData.watShedArea)}</div>
|
<div>{getNum(tableData.watShedArea)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>总库容(万m³):</div>
|
<div>总库容(万m³):</div>
|
||||||
<div>{getNum(tableData.totCap)}</div>
|
<div>{getNum(tableData.totCap)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>校核洪水位(m):</div>
|
<div>校核洪水位(m):</div>
|
||||||
<div>{getNum(tableData.calFloodLev)}</div>
|
<div>{getNum(tableData.calFloodLev)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>设计洪水位(m):</div>
|
<div>设计洪水位(m):</div>
|
||||||
<div>{getNum(tableData.desFloodLev)}</div>
|
<div>{getNum(tableData.desFloodLev)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>正常蓄水位(m):</div>
|
<div>正常蓄水位(m):</div>
|
||||||
<div>{getNum(tableData.normWatLev)}</div>
|
<div>{getNum(tableData.normWatLev)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>汛限水位(m):</div>
|
<div>汛限水位(m):</div>
|
||||||
<div>{getNum(tableData.flLowLimLev)}</div>
|
<div>{getNum(tableData.flLowLimLev)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>死水位(m):</div>
|
<div>死水位(m):</div>
|
||||||
<div>{getNum(tableData.deadLev)}</div>
|
<div>{getNum(tableData.deadLev)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>兴利库容(万m³):</div>
|
<div>兴利库容(万m³):</div>
|
||||||
<div>{getNum(tableData.benResCap)}</div>
|
<div>{getNum(tableData.benResCap)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>死库容(万m³):</div>
|
<div>死库容(万m³):</div>
|
||||||
<div>{getNum(tableData.deadCap)}</div>
|
<div>{getNum(tableData.deadCap)}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>工程特性表:</div>
|
<div>工程特性表:</div>
|
||||||
<div style={{color:'#007AFDB3',cursor:'pointer'}} onClick={()=>setOpen(true)}>工程特性表详情</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 style={{width:'100%',color:'#007AFDB3',fontWeight:500,cursor:'pointer',marginTop:'10px',textAlign:'center'}}>更多详情</div> */}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -11,12 +11,12 @@ import Ykqk from './item_shuiku/yhqk'
|
||||||
|
|
||||||
const Page = () => {
|
const Page = () => {
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const [ checked, setChecked ] = useState(0)
|
const [ checked, setChecked ] = useState(1)
|
||||||
const [data,setData] = useState([])
|
const [data,setData] = useState([])
|
||||||
console.log('data',data);
|
console.log('data',data);
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
dispatch.map.setLayerVisible({ ShuiKuLayer: true })
|
dispatch.map.setLayerVisible({ ShuiKuLayer: true })
|
||||||
dispatch.map.setLayerVisible({ HdswLayer: true })
|
dispatch.map.setLayerVisible({ HdswLayer: false })
|
||||||
getData()
|
getData()
|
||||||
return ()=>{
|
return ()=>{
|
||||||
dispatch.map.setLayerVisible({ ShuiKuLayer: false })
|
dispatch.map.setLayerVisible({ ShuiKuLayer: false })
|
||||||
|
|
@ -27,7 +27,7 @@ const Page = () => {
|
||||||
const getData = async (params) => {
|
const getData = async (params) => {
|
||||||
const data = await reservoirlist(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.stnm==='檀树岗'),...data.filter(o=>o.stnm==='檀树岗(新)')]
|
const list = [...data.filter(o=>o.stcd==="61610700"),...data.filter(o=>o.stcd==="10818")]
|
||||||
setData(list)
|
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.stnm==='檀树岗'),...list.filter(o=>o.stnm==='檀树岗(新)')]
|
const list2 = [...list.filter(o=>o.stcd==="61610700"),...list.filter(o=>o.stcd==="10818")]
|
||||||
console.log('res',list2);
|
console.log('res',list2);
|
||||||
const data = list2[checked]
|
const data = list2[checked]
|
||||||
dispatch.runtime.setFeaturePop({
|
dispatch.runtime.setFeaturePop({
|
||||||
|
|
@ -64,7 +64,7 @@ const Page = () => {
|
||||||
<div className="home_yuqing_header" style={{marginBottom:'10px'}}>
|
<div className="home_yuqing_header" style={{marginBottom:'10px'}}>
|
||||||
{
|
{
|
||||||
data.map((item,index)=>
|
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>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -30,38 +30,38 @@ const Page = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="home_shuizhi">
|
<div className="home_shuizhi">
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>型式:</div>
|
<div>型式:</div>
|
||||||
<div>{tableData.buildType}</div>
|
<div>{tableData.buildType}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>堰顶高程(m):</div>
|
<div>堰顶高程(m):</div>
|
||||||
<div>{tableData.crestEle}</div>
|
<div>{tableData.crestEle}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>总净宽(m):</div>
|
<div>总净宽(m):</div>
|
||||||
<div>{tableData.netWidth}</div>
|
<div>{tableData.netWidth}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>最大单宽流量m³/(s·m):</div>
|
<div>最大单宽流量m³/(s·m):</div>
|
||||||
<div>{tableData.bwidQ}</div>
|
<div>{tableData.bwidQ}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>消能方式:</div>
|
<div>消能方式:</div>
|
||||||
<div>{tableData.elimMethod}</div>
|
<div>{tableData.elimMethod}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>消能防冲流量(m³/s):</div>
|
<div>消能防冲流量(m³/s):</div>
|
||||||
<div>{tableData.elimQ}</div>
|
<div>{tableData.elimQ}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>设计泄洪流量(m³/s):</div>
|
<div>设计泄洪流量(m³/s):</div>
|
||||||
<div>{tableData.desQ}</div>
|
<div>{tableData.desQ}</div>
|
||||||
</dit>
|
</div>
|
||||||
<dit className='home_shuizhi_item2'>
|
<div className='home_shuizhi_item2'>
|
||||||
<div>校核泄洪流量(m³/s):</div>
|
<div>校核泄洪流量(m³/s):</div>
|
||||||
<div>{tableData.caliQ}</div>
|
<div>{tableData.caliQ}</div>
|
||||||
</dit>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|
|
||||||
|
|
@ -6,9 +6,11 @@ import apiurl from "../../../../service/apiurl";
|
||||||
import moment from "moment";
|
import moment from "moment";
|
||||||
import Table_qx from './table_qx'
|
import Table_qx from './table_qx'
|
||||||
import Table_wy from './table_wy'
|
import Table_wy from './table_wy'
|
||||||
|
import Table_by from './table_by'
|
||||||
import Table_sl from './table_sl'
|
import Table_sl from './table_sl'
|
||||||
import Table_sy from './table_sy'
|
import Table_sy from './table_sy'
|
||||||
import Table_AI from './table_AI'
|
import Table_AI from './table_AI'
|
||||||
|
import { useNavigate } from "react-router";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -22,6 +24,8 @@ const Page = ({mySetTms}) => {
|
||||||
moment().format('YYYY-MM-DD HH:mm:ss'),
|
moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
])
|
])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
(async()=>{
|
(async()=>{
|
||||||
const params = {
|
const params = {
|
||||||
|
|
@ -39,6 +43,7 @@ const Page = ({mySetTms}) => {
|
||||||
])
|
])
|
||||||
setDataObj(data)
|
setDataObj(data)
|
||||||
})()
|
})()
|
||||||
|
|
||||||
},[])
|
},[])
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -85,6 +90,11 @@ const Page = ({mySetTms}) => {
|
||||||
<div className="content">AI告警</div>
|
<div className="content">AI告警</div>
|
||||||
<div></div>
|
<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>
|
</div>
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
|
|
@ -102,7 +112,7 @@ const Page = ({mySetTms}) => {
|
||||||
<div className="normalModalStyle">
|
<div className="normalModalStyle">
|
||||||
<div className="normalModalStyle_title">
|
<div className="normalModalStyle_title">
|
||||||
<div className="normalModalStyle_title_icon"></div>
|
<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">
|
<div className="normalModalStyle_title_cancel">
|
||||||
<CloseOutlined onClick={()=>setOpen(false)} style={{color:"#333"}}/>
|
<CloseOutlined onClick={()=>setOpen(false)} style={{color:"#333"}}/>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -112,6 +122,7 @@ const Page = ({mySetTms}) => {
|
||||||
{ key==='渗压告警'?<Table_sy data={dataObj.pressWarn} 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==='渗流告警'?<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>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
</div>
|
</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,
|
...obj,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if (result.length > 0) {
|
if (result.length > 0 || res.data.length == 0) {
|
||||||
setLoading(false)
|
setLoading(false)
|
||||||
}
|
}
|
||||||
// let res1 = result.map(item => ({...item,rz:(item.rz - 100).toFixed(2)})) //为了测试 最后需要删除
|
// 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]]]
|
[85, data[alltype[3]]]
|
||||||
]
|
]
|
||||||
: []
|
: []
|
||||||
|
const filteredArray = line.filter(subArray => {
|
||||||
|
return subArray.every(item => item !== null && item !== undefined);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
toolbox: {
|
toolbox: {
|
||||||
show: true,
|
show: true,
|
||||||
|
|
@ -371,13 +376,17 @@ export default function jrxOptions(data = {}, type = "1",typeName='1') {
|
||||||
symbol: 'none',
|
symbol: 'none',
|
||||||
symbolSize: 10,
|
symbolSize: 10,
|
||||||
z: 1,
|
z: 1,
|
||||||
|
smooth: 0.6, // 设置平滑度
|
||||||
|
smoothMonotone: 'x', // 保持 x 方向的单调性
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: '#5487FF'
|
color: '#5487FF'
|
||||||
},
|
},
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
color: '#5487FF',
|
color: '#5487FF',
|
||||||
|
width: 2,
|
||||||
|
curveness: 0.5 // 增加曲线程度
|
||||||
},
|
},
|
||||||
data: line
|
data: filteredArray
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -58,6 +58,7 @@ const Page = () => {
|
||||||
</span>
|
</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" },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -370,6 +370,18 @@ const ModalForm = ({ mode, record,onEdit,onSave,onSimilarSave }) => {
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</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 : (
|
mode === 'view' ? null : (
|
||||||
<>
|
<>
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ export default function dtOption(doubleData) {
|
||||||
const textColor = '#666'
|
const textColor = '#666'
|
||||||
return {
|
return {
|
||||||
title: {
|
title: {
|
||||||
text: `${doubleData?.stationCode}测压管水位过程线`,
|
text: `${doubleData?.cd}测压管水位过程线`,
|
||||||
bottom: "5%",
|
bottom: "5%",
|
||||||
left: "40%",
|
left: "40%",
|
||||||
textStyle: {
|
textStyle: {
|
||||||
|
|
@ -26,7 +26,7 @@ const textColor = '#666'
|
||||||
show: true,
|
show: true,
|
||||||
excludeComponents: ['toolbox'],
|
excludeComponents: ['toolbox'],
|
||||||
pixelRatio: 2,
|
pixelRatio: 2,
|
||||||
name:`${doubleData?.stationCode}测压管水位过程线`
|
name:`${doubleData?.cd}测压管水位过程线`
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
right: "20%",
|
right: "20%",
|
||||||
|
|
@ -144,7 +144,7 @@ const textColor = '#666'
|
||||||
|
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: doubleData?.stationCode,
|
name: doubleData?.cd,
|
||||||
type: 'line',
|
type: 'line',
|
||||||
yAxisIndex: 0,
|
yAxisIndex: 0,
|
||||||
symbol: 'circle',
|
symbol: 'circle',
|
||||||
|
|
|
||||||
|
|
@ -2,16 +2,30 @@ import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
|
||||||
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
||||||
import { Table, Card, Modal, Form, Input, Button, Row, Col, Timeline, message, Tabs, Image, Tag } 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 { FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector, useDispatch } from 'react-redux';
|
||||||
import ToolBar from './toolbar';
|
import ToolBar from './toolbar';
|
||||||
import ModalForm from './form';
|
import ModalForm from './form';
|
||||||
import apiurl from '../../../../service/apiurl';
|
import apiurl from '../../../../service/apiurl';
|
||||||
import usePageTable from '../../../../components/crud/usePageTable2';
|
import usePageTable from '../../../../components/crud/usePageTable2';
|
||||||
import { createCrudService } from '../../../../components/crud/_';
|
import { createCrudService } from '../../../../components/crud/_';
|
||||||
import { httppost2 } from '../../../../utils/request';
|
import { httppost2, httpget2 } from '../../../../utils/request';
|
||||||
import { CrudOpRender_text } from '../../../../components/crud/CrudOpRender';
|
import { CrudOpRender_text } from '../../../../components/crud/CrudOpRender';
|
||||||
|
import PointHistory from './pointHistory';
|
||||||
|
import PrecessForm from './precessForm'
|
||||||
import './index.less';
|
import './index.less';
|
||||||
import moment from 'moment';
|
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 url = "http://223.75.53.141:9100/gs-tsg"
|
||||||
const Page = () => {
|
const Page = () => {
|
||||||
const role = useSelector(state => state.auth.role);
|
const role = useSelector(state => state.auth.role);
|
||||||
|
|
@ -21,31 +35,31 @@ const Page = () => {
|
||||||
const initData = {
|
const initData = {
|
||||||
obDate: moment().format('YYYY-MM-DD')
|
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 refModal = useRef();
|
||||||
const [searchVal, setSearchVal] = useState({ ...initData })
|
const [searchVal, setSearchVal] = useState({ ...initData })
|
||||||
const [count, setCount] = useState({})
|
const [count, setCount] = useState({})
|
||||||
|
const [allCdList, setAllCdList] = useState([])
|
||||||
// const columns = [
|
// const columns = [
|
||||||
// { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
// { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
||||||
// {title: '填报日期', key: 'reportDate', dataIndex: 'reportDate', width: 140,},
|
// {title: '填报日期', key: 'reportDate', dataIndex: 'reportDate', width: 140,},
|
||||||
|
|
@ -116,7 +130,27 @@ const Page = () => {
|
||||||
</Tag>
|
</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]);
|
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||||
|
|
||||||
|
|
@ -143,6 +177,19 @@ const Page = () => {
|
||||||
refresh()
|
refresh()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 表格操作栏 查看按钮回调
|
||||||
|
const viewDetail = (r) => {
|
||||||
|
setDetailPoint(r);
|
||||||
|
setModalVisible(true)
|
||||||
|
}
|
||||||
|
// 表格操作栏 处理按钮回调
|
||||||
|
const handlerPrecess = (r,type) => {
|
||||||
|
setDetailPoint(r);
|
||||||
|
setPrecessVisible(true)
|
||||||
|
setMode(type)
|
||||||
|
}
|
||||||
|
|
||||||
// 获取白蚁统计数量
|
// 获取白蚁统计数量
|
||||||
const getCount = async () => {
|
const getCount = async () => {
|
||||||
const params = {
|
const params = {
|
||||||
|
|
@ -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(() => {
|
useEffect(() => {
|
||||||
const params = {
|
const params = {
|
||||||
search: {
|
search: {
|
||||||
|
|
@ -170,11 +381,93 @@ const Page = () => {
|
||||||
getCount();
|
getCount();
|
||||||
}, [searchVal])
|
}, [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 (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
||||||
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%" }}>
|
<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'>
|
<Row gutter={16} className='statsRow'>
|
||||||
<Col span={6}>
|
<Col span={6}>
|
||||||
<div className='statItem'>
|
<div className='statItem'>
|
||||||
|
|
@ -222,10 +515,42 @@ const Page = () => {
|
||||||
/>
|
/>
|
||||||
</Card>
|
</Card>
|
||||||
<div className="ant-card-body" style={{ padding: "20px 0 0 0", marginRight: 20 }}>
|
<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 )"}}/>
|
<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>
|
||||||
|
|
||||||
|
</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
|
<BasicCrudModal
|
||||||
width={1000}
|
width={1000}
|
||||||
ref={refModal}
|
ref={refModal}
|
||||||
|
|
|
||||||
|
|
@ -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">
|
<Form.Item label="监测日期" name="year">
|
||||||
<DatePicker
|
<DatePicker
|
||||||
allowClear={false}
|
allowClear={false}
|
||||||
style={{ width: "240px" }}
|
style={{ width: "140px" }}
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="测点编号" name="order">
|
<Form.Item label="测点编号" name="order">
|
||||||
<Input
|
<Input
|
||||||
allowClear
|
allowClear
|
||||||
style={{ width: "240px" }}
|
style={{ width: "140px" }}
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
{/* <Form.Item label="危害情况" name="isHarm">
|
{/* <Form.Item label="危害情况" name="isHarm">
|
||||||
|
|
|
||||||
|
|
@ -152,12 +152,8 @@ const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave,submit }) => {
|
||||||
const handleFile = (arr=[]) => {
|
const handleFile = (arr=[]) => {
|
||||||
const newArr = arr?.map(item => ({
|
const newArr = arr?.map(item => ({
|
||||||
name: item.fileName,
|
name: item.fileName,
|
||||||
response: {
|
|
||||||
data: {
|
|
||||||
filePath: item.filePath,
|
filePath: item.filePath,
|
||||||
fileId:item.fileId
|
fileId:item.fileId
|
||||||
}
|
|
||||||
},
|
|
||||||
}))
|
}))
|
||||||
return newArr
|
return newArr
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ export default function Sksq() {
|
||||||
|
|
||||||
const getData = async (params) => {
|
const getData = async (params) => {
|
||||||
const data = await reservoirlist(params)
|
const data = await reservoirlist(params)
|
||||||
setTableData(data.filter(o=>o.stnm==='檀树岗' || o.stnm==='檀树岗(新)'));
|
setTableData(data);
|
||||||
}
|
}
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let option = {
|
let option = {
|
||||||
|
|
@ -38,7 +38,7 @@ export default function Sksq() {
|
||||||
<span>站点:
|
<span>站点:
|
||||||
<NormalSelect
|
<NormalSelect
|
||||||
allowClear={false}
|
allowClear={false}
|
||||||
style={{ width: '150px' }}
|
style={{ width: '250px' }}
|
||||||
options={tableData.map((item,index)=>({ label: item.stnm, value:index }))}
|
options={tableData.map((item,index)=>({ label: item.stnm, value:index }))}
|
||||||
value={selected}
|
value={selected}
|
||||||
onChange={(e) => setSelected(e)}
|
onChange={(e) => setSelected(e)}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue