submenubar
This commit is contained in:
parent
b8aa6d6be8
commit
556b004051
@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import { Breadcrumb, Header } from 'semantic-ui-react';
|
||||
import { Grid, Container, Breadcrumb, Header, Menu, Input, Segment } from 'semantic-ui-react';
|
||||
|
||||
export class TitleBar extends React.Component<any, any> {
|
||||
|
||||
@ -9,23 +9,46 @@ export class TitleBar extends React.Component<any, any> {
|
||||
};
|
||||
}
|
||||
|
||||
handleMenu(idx: number) {
|
||||
alert(idx);
|
||||
}
|
||||
|
||||
render() {
|
||||
let subMenus = [
|
||||
{
|
||||
"name": "Menu1",
|
||||
},
|
||||
{
|
||||
"name": "Menu2",
|
||||
},
|
||||
{
|
||||
"name": "Menu3",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<div>
|
||||
<Header as='h3'>Page Title<Header.Subheader>
|
||||
<Breadcrumb>
|
||||
<Breadcrumb.Section link>Home</Breadcrumb.Section>
|
||||
<Breadcrumb.Divider />
|
||||
<Breadcrumb.Section link>Monitoring</Breadcrumb.Section>
|
||||
<Breadcrumb.Divider />
|
||||
<Breadcrumb.Section active>Probes</Breadcrumb.Section>
|
||||
</Breadcrumb>
|
||||
</Header.Subheader>
|
||||
</Header>
|
||||
|
||||
|
||||
</div>
|
||||
<Grid>
|
||||
<Grid.Row>
|
||||
<Grid.Column width='3'>
|
||||
<Header as='h3'>Page Title<Header.Subheader>
|
||||
<Breadcrumb>
|
||||
<Breadcrumb.Section link>Home</Breadcrumb.Section>
|
||||
<Breadcrumb.Divider />
|
||||
<Breadcrumb.Section link>Monitoring</Breadcrumb.Section>
|
||||
<Breadcrumb.Divider />
|
||||
<Breadcrumb.Section active>Probes</Breadcrumb.Section>
|
||||
</Breadcrumb>
|
||||
</Header.Subheader>
|
||||
</Header>
|
||||
</Grid.Column>
|
||||
<Grid.Column width='13'>
|
||||
<Menu secondary borderless>
|
||||
{subMenus.map((menu: any, index: number) => (
|
||||
<Menu.Item name={menu.name} key={index} onClick={this.handleMenu.bind(this, index)}/>
|
||||
))}
|
||||
</Menu>
|
||||
</Grid.Column>
|
||||
</Grid.Row>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user