108 lines
3.5 KiB
JavaScript
108 lines
3.5 KiB
JavaScript
|
import React, { useCallback, useEffect, useState } from 'react';
|
|||
|
|
import './ShYj.less';
|
|||
|
|
import appconsts from '../../../../models/appconsts';
|
|||
|
|
import { useDispatch } from 'react-redux';
|
|||
|
|
import apiurl from '../../../../models/apiurl';
|
|||
|
|
import { httpget } from '../../../../utils/request';
|
|||
|
|
import config from '../../../../config';
|
|||
|
|
import DpAlert from '../../../../layouts/mui/DpAlert';
|
|||
|
|
import { DcpjPromise } from '../../../../models/_/dcpj';
|
|||
|
|
|
|||
|
|
function Item({ data, viewInfo }) {
|
|||
|
|
return (
|
|||
|
|
<div className="item">
|
|||
|
|
<div className={`header alert${data.warngradeid === 5 ? 1 : 2}`}>
|
|||
|
|
</div>
|
|||
|
|
<div className="content">
|
|||
|
|
<div className="main">
|
|||
|
|
<div className="title" onClick={() => viewInfo(data)}>{data.adnm || '--'}</div>
|
|||
|
|
<div className="span"></div>
|
|||
|
|
<div className="extra">{appconsts.warnStatus_TYPE[data.warnstatusid]}</div>
|
|||
|
|
</div>
|
|||
|
|
<div className="desc">
|
|||
|
|
<span>{data.warndesc}</span>
|
|||
|
|
</div>
|
|||
|
|
<div className="tail">
|
|||
|
|
<span>{data.warnstm.substr(0, 'yyyy-mm-dd hh:mm'.length)}</span>
|
|||
|
|
<a onClick={() => viewInfo(data, 'danad')} style={{ textAlign: 'right' }}>危险区</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
function ShYj({ data }) {
|
|||
|
|
|
|||
|
|
const [hisdata, sethisdata] = useState();
|
|||
|
|
|
|||
|
|
useEffect(() => {
|
|||
|
|
if (!data) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (data.length === 0) {
|
|||
|
|
httpget(apiurl.shyj.find, { adcd: config.SHYJ_ADCD, page: 1, size: 10, warnstatusid: 30 })
|
|||
|
|
.then(({ data }) => sethisdata(data.list || []))
|
|||
|
|
}
|
|||
|
|
}, [data?.length]);
|
|||
|
|
|
|||
|
|
const dispatch = useDispatch();
|
|||
|
|
const viewInfo = useCallback((record, type) => {
|
|||
|
|
if (type === 'danad') {
|
|||
|
|
const adcd = record?.adcd?.replace(/([0]{3})*$/, '');
|
|||
|
|
if (adcd) {
|
|||
|
|
Promise.all([
|
|||
|
|
DcpjPromise.danad.get(),
|
|||
|
|
DcpjPromise.transfer.get(),
|
|||
|
|
DcpjPromise.placement.get(),
|
|||
|
|
]).then(([danads, transfers, placements]) => {
|
|||
|
|
const highlights = [
|
|||
|
|
...((danads || []).filter(o => o?.ADCD?.startsWith(adcd)).map(o => ({ ...o, type: 'danad' }))),
|
|||
|
|
...((transfers || []).filter(o => o?.ADCD?.startsWith(adcd)).map(o => ({ ...o, type: 'transfer' }))),
|
|||
|
|
...((placements || []).filter(o => o?.ADCD?.startsWith(adcd)).map(o => ({ ...o, type: 'placement' })))
|
|||
|
|
];
|
|||
|
|
if (highlights.length > 0) {
|
|||
|
|
dispatch.map.openHighlights({
|
|||
|
|
title: `${record.adnm}危险区/转移路线/安置点`,
|
|||
|
|
records: highlights.map(o => ({
|
|||
|
|
id: o.PID,
|
|||
|
|
adcd: o.ADCD,
|
|||
|
|
lgtd: o.lgtd,
|
|||
|
|
lttd: o.lttd,
|
|||
|
|
name: o.NAME,
|
|||
|
|
type: o.type,
|
|||
|
|
}))
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
dispatch.map.highlightFeatures(highlights.map(o => ({
|
|||
|
|
type: o.type,
|
|||
|
|
props: o,
|
|||
|
|
fill: 'rgb(239, 164, 114)',
|
|||
|
|
stroke: o.type === 'danad' ? 'rgb(239, 164, 114)' : '#f6f082'
|
|||
|
|
})));
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
dispatch.runtime.setInfoDlg({ layerId: 'ShWarn', properties: record })
|
|||
|
|
}
|
|||
|
|
}, [dispatch]);
|
|||
|
|
|
|||
|
|
const showdata = hisdata?.length > 0 ? hisdata : (data || []);
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className="dppanel-shyj">
|
|||
|
|
{
|
|||
|
|
hisdata?.length > 0 && <DpAlert severity="info">当前无预警，显示最新10条已关闭预警</DpAlert>
|
|||
|
|
}
|
|||
|
|
{
|
|||
|
|
showdata.map(o => (
|
|||
|
|
<Item key={o.warnid} viewInfo={viewInfo} data={o} />
|
|||
|
|
))
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default React.memo(ShYj);
|