update ipmi page
This commit is contained in:
parent
432ff46ecd
commit
58057bcfa0
@ -1,12 +1,13 @@
|
||||
import React from 'react';
|
||||
import {Modal, Segment} from 'semantic-ui-react';
|
||||
import {Modal, Segment, Menu, Label, Container, Header, List, Table} from 'semantic-ui-react';
|
||||
import {convertTime} from '../../../../tools';
|
||||
|
||||
const stateDefault = () => ({
|
||||
open: false,
|
||||
tabIdx: 1
|
||||
})
|
||||
class IPMIInfoModal extends React.Component {
|
||||
|
||||
state = {...stateDefault()}
|
||||
componentWillReceiveProps(nextProps){
|
||||
if(nextProps.open != this.state.open){
|
||||
if(nextProps.open == false){
|
||||
@ -19,16 +20,129 @@ class IPMIInfoModal extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
changeIdx = (idx) => {
|
||||
this.setState({
|
||||
tabIdx: idx
|
||||
})
|
||||
}
|
||||
|
||||
getInfoView = () => {
|
||||
switch(this.state.tabIdx){
|
||||
case 1:
|
||||
return <BMCContent group={this.props.bmcgroup} data={this.props.bmcdata} />
|
||||
case 2:
|
||||
return <SensorContent sensor={this.props.sensor} />
|
||||
case 3:
|
||||
return <LogContent log={this.props.log} />
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
let {closeModal} = this.props;
|
||||
return (
|
||||
<Modal fluid open={this.state.open} onClose={()=>null}>
|
||||
<Modal size="fullscreen" open={this.state.open} onClose={()=>closeModal('ipmiinfo')}>
|
||||
<Modal.Header content="IPMI Info" />
|
||||
<Modal.Content>
|
||||
|
||||
<Menu attached="top" tabular>
|
||||
<Menu.Item name="BMC Info" active={this.state.tabIdx == 1} onClick={()=>this.changeIdx(1)} />
|
||||
<Menu.Item name="Sensor" active={this.state.tabIdx == 2} onClick={()=>this.changeIdx(2)} />
|
||||
<Menu.Item name="Log" active={this.state.tabIdx == 3} onClick={()=>this.changeIdx(3)} />
|
||||
</Menu>
|
||||
<Segment attached="bottom">
|
||||
{this.getInfoView()}
|
||||
</Segment>
|
||||
</Modal.Content>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const BMCContent = ({group, data}) => {
|
||||
|
||||
return (
|
||||
<Container fluid>
|
||||
{
|
||||
group.map((t,idx) => (
|
||||
<Segment key={idx}>
|
||||
<Header as="h3" color="blue">
|
||||
{t.name}
|
||||
<Header.Subheader>{t.value}</Header.Subheader>
|
||||
</Header>
|
||||
<List>
|
||||
{
|
||||
data.map((t2, idx) => (
|
||||
<List.Item key={idx}>
|
||||
<Label content={t2.name} basic />
|
||||
{t2.value}
|
||||
</List.Item>
|
||||
))
|
||||
}
|
||||
</List>
|
||||
</Segment>
|
||||
))
|
||||
}
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
||||
const LogContent = ({log}) => {
|
||||
|
||||
return (
|
||||
<Container fluid>
|
||||
<Table>
|
||||
<Table.Header>
|
||||
<Table.Row>
|
||||
<Table.HeaderCell>行號</Table.HeaderCell>
|
||||
<Table.HeaderCell>時間</Table.HeaderCell>
|
||||
<Table.HeaderCell>內容</Table.HeaderCell>
|
||||
</Table.Row>
|
||||
</Table.Header>
|
||||
<Table.Body>
|
||||
{
|
||||
log.map((t,idx) => (
|
||||
<Table.Row>
|
||||
<Table.Cell>{t.line}</Table.Cell>
|
||||
<Table.Cell>{convertTime(t.time, true)}</Table.Cell>
|
||||
<Table.Cell>{t.content}</Table.Cell>
|
||||
</Table.Row>
|
||||
))
|
||||
}
|
||||
</Table.Body>
|
||||
</Table>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
||||
const SensorContent = ({sensor}) => {
|
||||
|
||||
return (
|
||||
<Container fluid>
|
||||
<Table>
|
||||
<Table.Header>
|
||||
<Table.Row>
|
||||
<Table.HeaderCell>名稱</Table.HeaderCell>
|
||||
<Table.HeaderCell>數值</Table.HeaderCell>
|
||||
<Table.HeaderCell>單位</Table.HeaderCell>
|
||||
<Table.HeaderCell>狀態</Table.HeaderCell>
|
||||
</Table.Row>
|
||||
</Table.Header>
|
||||
<Table.Body>
|
||||
{
|
||||
sensor.map((t,idx) => (
|
||||
<Table.Row>
|
||||
<Table.Cell>{t.name}</Table.Cell>
|
||||
<Table.Cell>{t.value}</Table.Cell>
|
||||
<Table.Cell>{t.unit}</Table.Cell>
|
||||
<Table.Cell>{t.status}</Table.Cell>
|
||||
</Table.Row>
|
||||
))
|
||||
}
|
||||
</Table.Body>
|
||||
</Table>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
||||
export default IPMIInfoModal;
|
@ -5,7 +5,7 @@ import DevList from './DevList';
|
||||
import IPMIPage from './IPMIPage';
|
||||
import DevModal from './Modals/DevModal';
|
||||
import IPMIModal from './Modals/IPMIModal';
|
||||
import IPMIInfoModal from './Modals'
|
||||
import IPMIInfoModal from './Modals/IPMIInfoModal';
|
||||
|
||||
const stateDefault = ()=>({
|
||||
list: [],
|
||||
@ -293,6 +293,9 @@ class ServerPage extends React.Component {
|
||||
data={this.state.ipmiModal.data}
|
||||
closeModal={this.closeModal}
|
||||
submitModal={this.submitModal} />
|
||||
<IPMIInfoModal i18n={i18n}
|
||||
{...this.state.ipmiInfo}
|
||||
closeModal={this.closeModal} />
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user