overflow_backup_2018_0455/overflow_app
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

routtttttttttttttttttttttttttttte

Browse Source
This commit is contained in:
insanity 2017-07-21 16:54:13 +09:00
parent a63f1c013d
commit a48ced2333
5 changed files with 37 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/ts/@overflow/app/views/layout/TempLayout.tsx
View File

@ -1,11 +1,12 @@
import * as React from 'react';
import { RouteComponentProps, RouteProps, Route } from 'react-router-dom';
import { RouteComponentProps, RouteProps, Route, Switch } from 'react-router-dom';
import { Container, Menu, Sidebar, Segment, Icon, Breadcrumb, Grid, Dropdown } from 'semantic-ui-react';
import { Header } from './Header';
import { Footer } from './Footer';
import LeftMenu from './LeftMenu';
import ProbeList from '../monitoring/probe/List';
import ProbeDetail from '../monitoring/probe/Detail';
export interface Props extends RouteComponentProps<any> {
}
@ -30,16 +31,17 @@ export class AppLayout extends React.Component<Props, State> {
public render(): JSX.Element {
return (
<Container fluid>
<LeftMenu />
<Segment vertical style={{ margin: '0 0 0 210px', padding: '0' }}>
<Header />
<Container fluid>
<LeftMenu />
<Segment vertical style={{ margin: '0 0 0 210px', padding: '0' }}>
<Header />
<Route path={`${this.props.match.url}/probe`} component={ProbeList} />
<Route exact path={`${this.props.match.url}/probe`} component={ProbeList} />
<Route exact path={`${this.props.match.url}/probe/:id`} component={ProbeDetail} />
<Footer />
</Segment>
</Container >
<Footer />
</Segment>
</Container >
);
}
}

4
src/ts/@overflow/app/views/monitoring/probe/Detail.tsx
View File

@ -5,7 +5,7 @@ import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
import AppContext from '@overflow/commons/context';
import inject from '@overflow/commons/context/decorator/inject';
class ProbeList extends React.Component<RouteComponentProps<object>, object> {
class ProbeDetail extends React.Component<RouteComponentProps<object>, object> {
@inject()
private client: WebSocketRPC;
@ -23,4 +23,4 @@ class ProbeList extends React.Component<RouteComponentProps<object>, object> {
}
export default ProbeList;
export default ProbeDetail;

1
src/ts/@overflow/probe/react/ProbeDetail.tsx
View File

@ -7,7 +7,6 @@ import {
export function mapStateToProps(state: any): ProbeDetailStateProps {
return {
probe: state.probe,
};
}

42
src/ts/@overflow/probe/react/components/ProbeDetail.tsx
View File

@ -1,16 +1,17 @@
import * as React from 'react';
import { Button,
import {
Button,
Table,
Label,
Segment,
Header,
Container,
} from 'semantic-ui-react';
import { TargetTable } from '@overflow/target/react/components/TargetList';
// import { TargetTable } from '@overflow/target/react/components/TargetList';
import Probe from '@overflow/probe/api/model/Probe';
export interface StateProps {
probe: Probe;
}
export interface DispatchProps {
@ -33,16 +34,21 @@ export class ProbeDetail extends React.Component<Props, State> {
public render(): JSX.Element {
return (
<Container fluid>
<ProbeBasicInfo probe={this.props.probe} />
<TargetTable />
Probe Detail....id: ?
{/* <ProbeBasicInfo probe={null} />
<TargetTable /> */}
</Container>
);
}
}
export class ProbeBasicInfo extends React.Component<Props, State> {
export interface DetailProps {
probe: Probe;
}
constructor(props: Props, context: State) {
export class ProbeBasicInfo extends React.Component<DetailProps, State> {
constructor(props: DetailProps, context: State) {
super(props, context);
this.state = {
};
@ -55,20 +61,20 @@ export class ProbeBasicInfo extends React.Component<Props, State> {
alert('Discovery');
}
public showStartStopBtn(): JSX.Element {
let temp: any = null;
temp = this.props.probe;
if (temp.metaProbeStatus.name === 'STARTED') {
return <Button content='Stop' icon='stop' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
} else {
return <Button content='Start' icon='play' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
}
}
// public showStartStopBtn(): JSX.Element {
// let temp: any = null;
// temp = this.props.probe;
// if (temp.metaProbeStatus.name === 'STARTED') {
// return <Button content='Stop' icon='stop' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
// } else {
// return <Button content='Start' icon='play' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
// }
// }
public render(): JSX.Element {
return (
<Container fluid>
<Header as='h3' dividing>Probe Info</Header>
{/* <Header as='h3' dividing>Probe Info</Header>
<Table celled={false}>
<Table.Body>
<Table.Row>
@ -111,7 +117,7 @@ export class ProbeBasicInfo extends React.Component<Props, State> {
</Table>
<Button content='Discovery' icon='search' labelPosition='left' floated={'right'} positive onClick={this.handleDiscovery} />
{this.showStartStopBtn()}
{this.showStartStopBtn()} */}
</Container>
);

6
src/ts/@overflow/probe/react/components/ProbeList.tsx
View File

@ -16,7 +16,6 @@ export type Props = StateProps & DispatchProps;
export interface State {
selected: Probe;
isDetail: boolean;
list: Probe[];
}
@ -29,7 +28,6 @@ export class ProbeList extends React.Component<Props, State> {
this.state = {
selected: null,
isDetail: false,
list: null,
};
}
@ -96,7 +94,6 @@ export class ProbeList extends React.Component<Props, State> {
public handleSelect(selectedProbe: any): void {
this.setState({
selected: selectedProbe,
isDetail: true,
});
}
@ -125,9 +122,6 @@ export class ProbeList extends React.Component<Props, State> {
}
public render(): JSX.Element {
if (this.state.isDetail) {
return <ProbeDetail probe={this.state.selected} />;
}
let probeList =
<Container fluid>
<Table selectable striped>