target temporary

This commit is contained in:
insanity 2017-07-21 12:18:01 +09:00
parent f3ae270982
commit c1e6e004ea
7 changed files with 83 additions and 84 deletions

View File

@ -1,11 +1,12 @@
import * as React from 'react';
import { Route, RouteProps, Switch, } from 'react-router-dom';
import { Route, RouteProps, Switch } from 'react-router-dom';
import SignIn from '../views/member/SignIn';
import SignUp from '../views/member/SignUp';
import PWChange from '../views/member/ForgotPassword';
import SensorList from '../views/monitoring/sensor/SensorList';
import ProbeList from '../views/monitoring/probe/List';
import TargetList from '../views/infrastructure/target/List';
// import { SignUp } from '@overflow/member/react/components/SignUp';
// import { SignIn } from '@overflow/member/react/components/SignIn';
@ -52,7 +53,7 @@ const routes = (
<Route exact path='/test4' component={PWChange} />
<Route exact path='/probe_list' component={ProbeList} />
<Route exact path='/sensor_list' component={SensorList} />
<Route exact path='/target_list' component={TargetList} />
</Switch>

View File

@ -0,0 +1,26 @@
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import TargetListContainer from '@overflow/target/react/TargetList';
import WebSocketRPC from '@overflow/commons/websocket/WebSocketRPC';
import AppContext from '@overflow/commons/context';
import inject from '@overflow/commons/context/decorator/inject';
class TargetList extends React.Component<RouteComponentProps<object>, object> {
@inject()
private client: WebSocketRPC;
public constructor(props?: RouteComponentProps<object>, context?: object) {
super(props, context);
let con = AppContext.get<WebSocketRPC>();
}
public render(): JSX.Element {
return (
<TargetListContainer/>
);
}
}
export default TargetList;

View File

@ -47,7 +47,7 @@ export class LeftMenu extends React.Component<any, any> {
</Menu.Header>
<Menu.Menu>
<Menu.Item href='/' style={{ 'margin-left': '30px' }}>Maps</Menu.Item>
<Menu.Item href='/' style={{ 'margin-left': '30px' }}>Targets</Menu.Item>
<Menu.Item href='#/target_list' style={{ 'margin-left': '30px' }}>Targets</Menu.Item>
</Menu.Menu>
</Menu.Item>

View File

@ -6,7 +6,7 @@ import { Button,
Header,
Container,
} from 'semantic-ui-react';
import { TargetTable } from '@overflow/temp/react/components/Targets';
import { TargetTable } from '@overflow/target/react/components/TargetList';
import Probe from '@overflow/probe/api/model/Probe';
export interface StateProps {

View File

@ -0,0 +1,26 @@
import { connect, Dispatch } from 'react-redux';
import {
TargetList,
StateProps as StateProps,
DispatchProps as DispatchProps,
} from './components/TargetList';
import Probe from '@overflow/probe/api/model/Probe';
import * as targetListActions from '../redux/action/read_all_by_probe';
export function mapStateToProps(state: any): StateProps {
return {
};
}
export function mapDispatchToProps(dispatch: Dispatch<any>): DispatchProps {
return {
onReadAllByProbe: (probe: Probe) => {
dispatch(targetListActions.request(probe));
},
};
}
export default connect(mapStateToProps, mapDispatchToProps)(TargetList);

View File

@ -33,6 +33,10 @@ export class TargetDetails extends React.Component<TargetDetailsProps, TargetDet
public render(): JSX.Element {
if (this.props.probe === null) {
return null;
}
const items = [
{ name: 'Info', child: <TargetBasicInfo probe={this.props.probe} /> },
{ name: 'Sensors', child: <SensorList target={this.props.target} /> },

View File

@ -1,25 +1,33 @@
import * as React from 'react';
import { Table, Button, Modal, Input, Header, Container, InputOnChangeData, ButtonProps } from 'semantic-ui-react';
import { TargetDetails } from './TargetDetails';
import { TargetDetails } from './TargetDetail';
import Target from '@overflow/target/api/model/Target';
import Probe from '@overflow/probe/api/model/Probe';
export interface TargetsProps {
export interface StateProps {
}
export interface TargetsState {
export interface DispatchProps {
onReadAllByProbe(probe: Probe): void;
}
export type Props = StateProps & DispatchProps;
export interface State {
selected: Target;
openAddTarget: boolean;
}
export class Targets extends React.Component<TargetsProps, TargetsState> {
export class TargetList extends React.Component<Props, State> {
constructor(props: TargetsProps, context: TargetsState) {
constructor(props: Props, context: State) {
super(props, context);
// this.state = {
// openAddTarget: false,
// };
this.state = {
selected: null,
openAddTarget: false,
};
}
public handleAddTarget(event: React.MouseEvent<HTMLButtonElement>, data: ButtonProps): void {
@ -29,10 +37,6 @@ export class Targets extends React.Component<TargetsProps, TargetsState> {
}
public render(): JSX.Element {
const options = [
{ key: 'm', text: 'Male', value: 'male' },
{ key: 'f', text: 'Female', value: 'female' },
];
return (
<Container fluid>
@ -60,10 +64,6 @@ export class Targets extends React.Component<TargetsProps, TargetsState> {
</Container>
);
}
public componentWillMount(): void {
super.componentWillMount();
}
}
export interface TargetTableProps {
@ -91,25 +91,9 @@ export class TargetTable extends React.Component<TargetTableProps, TargetTableSt
});
}
public handleSearch(event: React.SyntheticEvent<HTMLInputElement>, data: InputOnChangeData): void {
let searchWord = data.value.toLowerCase();
let foundTarget = new Array();
for (let target of this.data) {
let typeName = target.infra.metaInfraType.name.toLowerCase();
if (typeName.indexOf(searchWord) !== -1) {
foundTarget.push(target);
}
}
this.setState({
list: foundTarget,
});
}
public render(): JSX.Element {
return (
<Container fluid>
<Header as='h3' dividing>Targets</Header>
<Input icon='search' placeholder='Search...' onChange={this.handleSearch.bind(this)} />
<Table celled selectable striped>
<Table.Header>
<Table.Row>
@ -124,7 +108,7 @@ export class TargetTable extends React.Component<TargetTableProps, TargetTableSt
{this.state.list.map((target: Target, index: number) => (
<Table.Row key={index} onClick={this.handleSelect.bind(this, target)}>
<Table.Cell textAlign={'center'}>{index + 1}</Table.Cell>
<Table.Cell textAlign={'center'}>{target.infra.type.name}</Table.Cell>
<Table.Cell textAlign={'center'}>todo</Table.Cell>
<Table.Cell>todo</Table.Cell>
<Table.Cell>todo</Table.Cell>
</Table.Row>
@ -135,48 +119,6 @@ export class TargetTable extends React.Component<TargetTableProps, TargetTableSt
);
}
public componentWillMount(): void {
super.componentWillMount();
this.data = [
{
'id': '1',
'createDate': '',
'probe': {
'id': '1',
},
'infra': {
'id': '1',
'metaInfraType': {
'id': '1',
'name': 'OS',
'createDate': '424252',
},
'childId': '1',
'createDate': '13345235',
},
},
{
'id': '2',
'createDate': '',
'probe': {
'id': '1',
},
'infra': {
'id': '1',
'metaInfraType': {
'id': '1',
'name': 'Host',
'createDate': '424252',
},
'childId': '1',
'createDate': '13345235',
},
},
];
this.setState({
list: this.data,
});
}
}