77 lines
2.4 KiB
JavaScript
77 lines
2.4 KiB
JavaScript
|
import React, { useEffect, useState, useMemo } from 'react';
|
||
|
|
import { Descriptions, Form, Button, Input, DatePicker } from 'antd';
|
||
|
|
import {CloseOutlined} from '@ant-design/icons';
|
||
|
|
import ReactEcharts from 'echarts-for-react';
|
||
|
|
import { httppost2 } from '../../../../../utils/request';
|
||
|
|
import apiurl from '../../../../../service/apiurl';
|
||
|
|
import moment from "moment"
|
||
|
|
import ToolBar from './toolbar';
|
||
|
|
import TableData from './TableData'
|
||
|
|
import drpOption from './drpOption';
|
||
|
|
|
||
|
|
function ShenLiu({ id, data, dispatch, onCancel }) {
|
||
|
|
console.log(data);
|
||
|
|
const [ tableData, setTableData ] = useState([])
|
||
|
|
const option = useMemo(() => drpOption(tableData), [tableData])
|
||
|
|
const width = 780;
|
||
|
|
|
||
|
|
const closePop = () => {
|
||
|
|
if(onCancel){
|
||
|
|
onCancel()
|
||
|
|
}
|
||
|
|
dispatch.runtime.closeFeaturePop(id);
|
||
|
|
};
|
||
|
|
|
||
|
|
const getData = async(tms,stationCode)=>{
|
||
|
|
const params = {
|
||
|
|
type: 2,
|
||
|
|
dateTimeRangeSo: {
|
||
|
|
start: moment(tms[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||
|
|
end: moment(tms[1]).format('YYYY-MM-DD HH:mm:ss'),
|
||
|
|
},
|
||
|
|
stationCode: stationCode
|
||
|
|
}
|
||
|
|
const { code, data} = await httppost2(apiurl.home.syslList,params)
|
||
|
|
if(code!==200){
|
||
|
|
return
|
||
|
|
}
|
||
|
|
setTableData(data)
|
||
|
|
}
|
||
|
|
|
||
|
|
useEffect(()=>{
|
||
|
|
getData([moment().add(-1,'months'),moment()],data.stationCode)
|
||
|
|
},[])
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<div className="normalModalStyle homeModal1">
|
||
|
|
<div className="normalModalStyle_title">
|
||
|
|
<div className="normalModalStyle_title_icon"></div>
|
||
|
|
{data.stationCode}
|
||
|
|
<div className="normalModalStyle_title_cancel">
|
||
|
|
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div style={{padding:'0 20px'}}>
|
||
|
|
<ToolBar search={(tms)=>getData(tms,data.stationCode)}/>
|
||
|
|
</div>
|
||
|
|
<div className='homeModal1_content'>
|
||
|
|
<div className='homeModal1_content_lf'>
|
||
|
|
<TableData tableData={tableData}/>
|
||
|
|
</div>
|
||
|
|
<div className='homeModal1_content_rf'>
|
||
|
|
{
|
||
|
|
tableData.length>0?
|
||
|
|
<ReactEcharts option={option} style={{width: "100%", height: '100%'}}/>
|
||
|
|
:<div style={{textAlign: "center", margin: "10%"}}><img src={`${process.env.PUBLIC_URL}/assets/noData.png`} alt=""/></div>
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default React.memo(ShenLiu);
|