102 lines
3.5 KiB
JavaScript
102 lines
3.5 KiB
JavaScript
import React from 'react';
|
|
import {Grid, Header, Container, Segment, List, Label} from 'semantic-ui-react';
|
|
import {getRequest} from '../../../../actions';
|
|
|
|
class LocStatusWloc extends React.Component {
|
|
state = {
|
|
loc: []
|
|
}
|
|
tick = null
|
|
|
|
componentDidMount() {
|
|
this.getLocList();
|
|
}
|
|
componentWillUnmount(){
|
|
clearInterval(this.tick);
|
|
}
|
|
|
|
runTick = ()=>{
|
|
this.getStatus();
|
|
}
|
|
|
|
getLocList = ()=>{
|
|
let {toggleLoading, showDialog} = this.props;
|
|
toggleLoading(1);
|
|
fetch('/api/wristband/getlocationlist', getRequest())
|
|
.then(response=>response.json())
|
|
.then(json=>{
|
|
toggleLoading(0);
|
|
if(json.status != 1) return showDialog(json.message);
|
|
this.setState({
|
|
loc: json.data.record || []
|
|
}, ()=>{
|
|
this.getStatus();
|
|
this.tick = setInterval(this.runTick, 5000);
|
|
})
|
|
})
|
|
}
|
|
|
|
getStatus = () => {
|
|
let {toggleLoading, showDialog} = this.props;
|
|
fetch('/api/wristband/getstatus', getRequest())
|
|
.then(response=>response.json())
|
|
.then(json => {
|
|
if(json.status != 1) return showDialog(json.message);
|
|
let record = json.data.record || [];
|
|
let locs = this.state.loc;
|
|
for(let i in locs){
|
|
locs[i].list = [];
|
|
}
|
|
for(let i in record) {
|
|
let tmp = record[i];
|
|
if(!tmp.locid) continue;
|
|
for(let j in locs) {
|
|
if(locs[j].serialnumber == tmp.locid) {
|
|
locs[j].list.push(tmp);
|
|
}
|
|
}
|
|
}
|
|
|
|
this.setState({
|
|
loc: locs
|
|
})
|
|
})
|
|
}
|
|
|
|
render() {
|
|
|
|
return (
|
|
<Container fluid>
|
|
<Grid columns={3}>
|
|
{
|
|
this.state.loc.map((t,idx) => (
|
|
<Grid.Column key={idx} className="clearfix" >
|
|
<Header as="h5" content={t.name} />
|
|
<Segment style={{height: '400px', overflow: 'auto'}}>
|
|
<List>
|
|
{
|
|
t.list ?
|
|
t.list.map((tt, idx) => (
|
|
<List.Item key={idx}>
|
|
{
|
|
tt.name ? (
|
|
<Label basic color="blue" size="tiny" content={tt.name}/>
|
|
) : null
|
|
}
|
|
<Label basic color="teal" size="tiny" content={tt.mac}/>
|
|
</List.Item>
|
|
))
|
|
: null
|
|
}
|
|
</List>
|
|
</Segment>
|
|
</Grid.Column>
|
|
))
|
|
}
|
|
</Grid>
|
|
</Container>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default LocStatusWloc; |