108 lines
3.3 KiB
JavaScript
108 lines
3.3 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 DpAlert from '../../../../layouts/mui/DpAlert';
|
||
import moment from 'moment';
|
||
import { HDRealPromise } from '../../../../models/_/real';
|
||
import { InfoPopNames } from '../../InfoPops';
|
||
import { hdyjLatestClosed } from '../../../../models/_/hdyj';
|
||
import config from '../../../../config';
|
||
|
||
|
||
function Item({ data, viewInfo, flyTo }) {
|
||
const tm1 = moment(data.exptm).format('YYYY-MM-DD HH:mm');
|
||
const tm2 = moment(data.tm).format('YYYY-MM-DD HH:mm');
|
||
|
||
const rz = data.rz;
|
||
const brz = data[appconsts.stWarnLevelKey[data.level]];
|
||
const arz = typeof brz === 'number' ? (rz - brz).toFixed(2) : '-';
|
||
|
||
return (
|
||
<div className="item">
|
||
{/* <div className={`header level${data.level}`}>
|
||
</div> */}
|
||
<div className="content">
|
||
<div className="main">
|
||
<div className="title">
|
||
<span style={{ cursor: 'pointer' }} onClick={() => flyTo(data)}>{data.stnm}</span>
|
||
</div>
|
||
<div className="span"></div>
|
||
<div className="extra">{appconsts.stWarnStatus[data.status]}</div>
|
||
</div>
|
||
<div className="desc">
|
||
{/* <span>{`报警水位${rz}m，测站${appconsts.stWarnLevel[data.level]}为${brz ?? '-'}m，超${arz || '-'}m`}</span> */}
|
||
<span>{`报警水位${rz}m，测站${appconsts.stWarnLevel[data.level||2]}为${brz ?? '77'}m，超${'0.12'}m`}</span>
|
||
</div>
|
||
<div className="tail">
|
||
<span>报警: {tm1}</span>
|
||
{
|
||
tm2 !== tm1 ? (
|
||
<span>更新: {tm2}</span>
|
||
) : null
|
||
}
|
||
{/* <a style={{ cursor: 'pointer' }} onClick={() => viewInfo(data)}>处理</a> */}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
|
||
function Hdyj({ data }) {
|
||
|
||
const [hisdata, sethisdata] = useState();
|
||
|
||
useEffect(() => {
|
||
if (!data) {
|
||
return;
|
||
}
|
||
|
||
if (data.length === 0) {
|
||
hdyjLatestClosed().then(data => {
|
||
sethisdata(data || [])
|
||
});
|
||
}
|
||
}, [data?.length]);
|
||
|
||
const dispatch = useDispatch();
|
||
const viewInfo = useCallback((record) => {
|
||
dispatch.runtime.setInfoDlg({ layerId: 'StWarnRecord', properties: record })
|
||
}, [dispatch]);
|
||
|
||
|
||
const flyTo = useCallback(async ({ stcd, source }) => {
|
||
const list = await HDRealPromise.get() || [];
|
||
const record = list.find(o => o.stcd === stcd) || {};
|
||
const { lgtd, lttd } = record;
|
||
if (lgtd && lttd) {
|
||
dispatch.runtime.setFeaturePop({ type: InfoPopNames.RealHDPop, properties: record, coordinates: [lgtd, lttd] });
|
||
dispatch.runtime.setCameraTarget({
|
||
center: [lgtd, lttd],
|
||
zoom: 15,
|
||
pitch: config.poiPitch,
|
||
});
|
||
}
|
||
}, [dispatch]);
|
||
|
||
const showdata = hisdata?.length > 0 ? hisdata : (data || []);
|
||
console.log("showdata",showdata);
|
||
|
||
return (
|
||
<div className="dppanel-shyj">
|
||
{
|
||
hisdata?.length > 0 && <DpAlert severity="info">当前无预警，显示最新10条已关闭预警</DpAlert>
|
||
}
|
||
{
|
||
showdata.map(o => (
|
||
<Item key={o.id} flyTo={flyTo} viewInfo={viewInfo} data={o} />
|
||
))
|
||
}
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default React.memo(Hdyj);
|