107 lines
3.6 KiB
JavaScript
107 lines
3.6 KiB
JavaScript
import React from 'react';
|
|
import {Container, Segment, Divider, Grid, Label, List} from 'semantic-ui-react';
|
|
import {getRequest} from '../../actions';
|
|
import {convertTime} from '../../tools';
|
|
import AlertItem from './AlertItem';
|
|
|
|
class DashBoardUnit extends React.Component {
|
|
state = {
|
|
timeOffset: 0,
|
|
timeStr: '',
|
|
show: false
|
|
}
|
|
|
|
tick = null;
|
|
|
|
runTick = () => {
|
|
let time = Date.now();
|
|
if(Math.floor(time/1000)%5 == 0){
|
|
this.props.getDashboard();
|
|
}
|
|
this.setState({
|
|
timeStr: convertTime((time + this.state.timeOffset), true)
|
|
})
|
|
}
|
|
|
|
componentDidMount(){
|
|
this.checkRunTick();
|
|
fetch('/api/system/gettime', getRequest())
|
|
.then(response => response.json())
|
|
.then(json => {
|
|
if(json.status != 1) return this.props.showDialog(json.message);
|
|
let t = Date.now();
|
|
let timeOffset = t - (json.data.record[0].time * 1000);
|
|
this.setState({
|
|
timeOffset
|
|
})
|
|
})
|
|
}
|
|
|
|
componentWillReceiveProps (np) {
|
|
if(np.show != this.state.show) {
|
|
this.setState({
|
|
show: np.show
|
|
}, ()=>{
|
|
this.checkRunTick();
|
|
})
|
|
}
|
|
}
|
|
|
|
checkRunTick = () => {
|
|
if(this.state.show){
|
|
this.tick = setInterval(this.runTick, 1000)
|
|
}else{
|
|
clearInterval(this.tick);
|
|
this.props.clearList();
|
|
}
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
clearInterval(this.tick);
|
|
this.props.clearList();
|
|
}
|
|
|
|
render(){
|
|
let {i18n, data} = this.props;
|
|
if(!this.state.show) return null;
|
|
return (
|
|
<Container style={{fontSize: '20px', marginBottom: '30px'}}>
|
|
<Segment>
|
|
<Divider horizontal>{i18n&&i18n.t ? i18n.t('dashboard.sysinfo') : ''}</Divider>
|
|
<Grid columns={3}>
|
|
<Grid.Column textAlign="center">
|
|
<Label basic size="large" content={i18n&&i18n.t?i18n.t('dashboard.systime') : ''} />
|
|
<br />
|
|
{this.state.timeStr}
|
|
</Grid.Column>
|
|
<Grid.Column textAlign="center">
|
|
<Label basic size="large" content={i18n&&i18n.t?i18n.t('dashboard.sysip') : ''} />
|
|
<br />
|
|
{data.ip}
|
|
</Grid.Column>
|
|
<Grid.Column textAlign="center">
|
|
<Label basic size="large" content={i18n&&i18n.t?i18n.t('dashboard.sysversion') : ''} />
|
|
<br />
|
|
{data.version}
|
|
</Grid.Column>
|
|
</Grid>
|
|
<Divider horizontal>{i18n&&i18n.t ? i18n.t('dashboard.devstats') : ''}</Divider>
|
|
<Grid>
|
|
{
|
|
data.di.map((t,idx)=>(
|
|
<AlertItem key={`di${idx}`} i18n={i18n} name={t.diname} type="di" />
|
|
))
|
|
}
|
|
{
|
|
data.leone.map((t,idx)=>(
|
|
<AlertItem key={`le${idx}`} i18n={i18n} name={t.leonename} type="leone" />
|
|
))
|
|
}
|
|
</Grid>
|
|
</Segment>
|
|
</Container>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default DashBoardUnit; |