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

sensor detail

Browse Source
This commit is contained in:
snoop 2017-08-10 19:19:01 +09:00
parent 22eaf7e5c2
commit a24b0a49cb
8 changed files with 254 additions and 231 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/ts/@overflow/app/views/monitoring/sensor/DetailInfo.tsx
View File

@ -10,7 +10,7 @@ class SensorDetailInfo extends React.Component<RouteComponentProps<object>, obje
public render(): JSX.Element {
return (
<SensorDetailInfoContainer />
<SensorDetailInfoContainer params={this.props.match.params}/>
);
}
}

2
src/ts/@overflow/app/views/monitoring/sensor/DetailItems.tsx
View File

@ -10,7 +10,7 @@ class SensorDetailItems extends React.Component<RouteComponentProps<object>, obj
public render(): JSX.Element {
return (
<SensorDetailItemsContainer />
<SensorDetailItemsContainer params={this.props.match.params}/>
);
}
}

3
src/ts/@overflow/sensor/react/SensorDetailInfo.tsx
View File

@ -11,10 +11,11 @@ import Target from '@overflow/target/api/model/Target';
import Sensor from '@overflow/sensor/api/model/Sensor';
import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest';
import { push as routerPush } from 'react-router-redux';
export function mapStateToProps(state: any, props: any): SensorDetailInfoStateProps {
return {
sensorId:props.params.id,
sensor:state.Sensor,
};
}

12
src/ts/@overflow/sensor/react/SensorDetailItems.tsx
View File

@ -6,18 +6,22 @@ import {
} from './components/SensorDetailItems';
import State from '../redux/state/ItemRead';
import * as ItemReadActions from '../redux/action/item_read';
import Sensor from '@overflow/sensor/api/model/Sensor';
export function mapStateToProps(state: any): SensorDetailItemsStateProps {
import * as ItemReadAllBySensorActions from '../redux/action/item_read_all_by_sensor';
import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest';
export function mapStateToProps(state: any, props: any): SensorDetailItemsStateProps {
return {
sensorId: props.params.id,
sensorItemList: state.SensorItemList,
};
}
export function mapDispatchToProps(dispatch: Dispatch<any>): SensorDetailItemsDispatchProps {
return {
onRead: (id: number) => {
dispatch(ItemReadActions.request(id));
onReadAllBySensor: (sensor: Sensor) => {
dispatch(asyncRequestActions.request('SensorItemService', 'readAllBySensor',
ItemReadAllBySensorActions.REQUEST, JSON.stringify(sensor)));
},
};
}

197
src/ts/@overflow/sensor/react/components/SensorDetailInfo.tsx
View File

@ -8,6 +8,7 @@ import Probe from '@overflow/probe/api/model/Probe';
export interface SensorDetailInfoStateProps {
sensorId?: number;
probe?: Probe;
sensor?: Sensor;
}
export interface SensorDetailInfoDispatchProps {
@ -17,7 +18,7 @@ export interface SensorDetailInfoDispatchProps {
export type SensorDetailInfoProps = SensorDetailInfoStateProps & SensorDetailInfoDispatchProps;
export interface SensorDetailInfoState {
sensor: Sensor;
// sensor: Sensor;
}
export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, SensorDetailInfoState> {
@ -25,8 +26,10 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
constructor(props: SensorDetailInfoProps, context: SensorDetailInfoState) {
super(props, context);
this.state = {
sensor: SensorDetailJson,
// sensor: SensorDetailJson,
};
this.props.onRead(this.props.sensorId);
}
public handleStartStop(event: any, data: any): void {
@ -46,7 +49,7 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
public showStartStopBtn(): JSX.Element {
if (this.state.sensor.status.name === 'STARTED') {
if (this.props.sensor.status.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} />;
@ -56,46 +59,7 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
public render(): JSX.Element {
return (
<Container fluid>
<Table celled>
<Table.Body>
<Table.Row>
<Table.Cell>
<Header size='small'>Name</Header>
</Table.Cell>
<Table.Cell>{this.state.sensor.target.displayName}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Status</Header>
</Table.Cell>
<Table.Cell>{this.state.sensor.status.name}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Crawler</Header>
</Table.Cell>
<Table.Cell>{this.state.sensor.crawler.name}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Item Count</Header>
</Table.Cell>
<Table.Cell>{44}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Created at</Header>
</Table.Cell>
<Table.Cell>{this.state.sensor.createDate}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Created by</Header>
</Table.Cell>
<Table.Cell>test Snoop</Table.Cell>
</Table.Row>
</Table.Body>
</Table>
{this.renderDetail()}
<Button content='Back' icon='left arrow' labelPosition='left' onClick={this.handleBack.bind(this)} />
<Button content='Discovery' icon='search' labelPosition='left' floated={'right'} positive onClick={this.handleDiscovery} />
@ -104,54 +68,105 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
</Container>
);
}
private renderDetail(): JSX.Element {
if (this.props.sensor === undefined) {
return null;
}
return (
<Table celled>
<Table.Body>
<Table.Row>
<Table.Cell>
<Header size='small'>Name</Header>
</Table.Cell>
<Table.Cell>{this.props.sensor.target.displayName}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Status</Header>
</Table.Cell>
<Table.Cell>{this.props.sensor.status.name}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Crawler</Header>
</Table.Cell>
<Table.Cell>{this.props.sensor.crawler.name}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Item Count</Header>
</Table.Cell>
<Table.Cell>{44}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Created at</Header>
</Table.Cell>
<Table.Cell>{this.props.sensor.createDate}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>
<Header size='small'>Created by</Header>
</Table.Cell>
<Table.Cell>test Snoop</Table.Cell>
</Table.Row>
</Table.Body>
</Table>
);
}
}
const SensorDetailJson: any = {
'id': 1,
'createDate': 1498475947009,
'description': 'My sensor',
'status': {
'id': 1,
'name': 'RUNNING',
},
'target': {
'id': 1,
'createDate': 1498448242854,
'probe': {
'id': 1,
'status': {
'id': 1,
'name': 'INITIAL',
},
'description': 'snoop probe',
'createDate': 1498448699813,
'lastPollingDate': null,
'nextPollingDate': null,
'domain': {
'id': 1,
'name': 'overFlow\'s domain',
'createDate': 1498443944866,
},
'probeKey': 'a1e1710557de11e78799080027658d13',
'encryptionKey': '9c8d41ab57de11e7a2c9080027658d13',
},
'infra': {
'id': 1,
'type': {
'id': 1,
'name': 'MACHINE',
'createDate': 1498379502770,
},
'childId': 0,
'createDate': 1498446731809,
},
},
'crawler': {
'id': 1,
'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY',
},
'crawlerInputItems': null,
};
// const SensorDetailJson: any = {
// 'id': 1,
// 'createDate': 1498475947009,
// 'description': 'My sensor',
// 'status': {
// 'id': 1,
// 'name': 'RUNNING',
// },
// 'target': {
// 'id': 1,
// 'createDate': 1498448242854,
// 'probe': {
// 'id': 1,
// 'status': {
// 'id': 1,
// 'name': 'INITIAL',
// },
// 'description': 'snoop probe',
// 'createDate': 1498448699813,
// 'lastPollingDate': null,
// 'nextPollingDate': null,
// 'domain': {
// 'id': 1,
// 'name': 'overFlow\'s domain',
// 'createDate': 1498443944866,
// },
// 'probeKey': 'a1e1710557de11e78799080027658d13',
// 'encryptionKey': '9c8d41ab57de11e7a2c9080027658d13',
// },
// 'infra': {
// 'id': 1,
// 'type': {
// 'id': 1,
// 'name': 'MACHINE',
// 'createDate': 1498379502770,
// },
// 'childId': 0,
// 'createDate': 1498446731809,
// },
// },
// 'crawler': {
// 'id': 1,
// 'createDate': 1498794968791,
// 'name': 'ACTIVEDIRECTORY_CRAWLER',
// 'description': 'ACTIVEDIRECTORY',
// },
// 'crawlerInputItems': null,
// };

161
src/ts/@overflow/sensor/react/components/SensorDetailItems.tsx
View File

@ -6,15 +6,17 @@ import SensorItem from '@overflow/sensor/api/model/SensorItem';
export interface StateProps {
sensorId?: number;
sensorItemList?: SensorItem[];
}
export interface DispatchProps {
onReadAllBySensor?(sensor: Sensor): void;
}
export type Props = StateProps & DispatchProps;
export interface State {
sensorItemList: SensorItem[];
}
@ -23,9 +25,10 @@ export class SensorDetailItems extends React.Component<Props, State> {
constructor(props: Props, context: State) {
super(props, context);
this.state = {
sensorItemList: SensorItemJson,
// sensorItemList: SensorItemJson,
};
this.props.onReadAllBySensor({id: this.props.sensorId});
}
@ -69,80 +72,80 @@ export class SensorDetailItems extends React.Component<Props, State> {
const SensorItemJson: any = [{
'id': 1,
'sensor': {
'id': 1,
'createDate': 1498475947009,
'description': 'My sensor',
'status': {
'id': 1,
'name': 'RUNNING',
},
'target': {
'id': 1,
'createDate': 1501154289555,
'displayName': 'ghost target',
'description': 'i am target',
},
'crawler': {
'id': 1,
'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY',
},
'crawlerInputItems': null,
},
'item': {
'id': 1,
'itemType': {
'id': 1,
'name': 'CPU',
'description': 'CPU blah blah blah',
'createDate': 1498474179690,
},
'key': 'cpu.usage',
'name': 'CPU USAGE',
'createDate': 1498475408269,
},
'createDate': 1498476076626,
},
{
'id': 2,
'sensor': {
'id': 1,
'createDate': 1498475947074,
'description': 'My sensor',
'status': {
'id': 1,
'name': 'RUNNING',
},
'target': {
'id': 1,
'createDate': 1501154289555,
'displayName': 'ghost target',
'description': 'i am target',
},
'crawler': {
'id': 1,
'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY',
},
'crawlerInputItems': null,
},
'item': {
'id': 2,
'itemType': {
'id': 1,
'name': 'CPU',
'description': 'CPU blah blah blah',
'createDate': 1498474179690,
},
'key': 'cpu.free',
'name': 'CPU FREE',
'createDate': 1498475408361,
},
'createDate': 1498476110988,
},
];
// const SensorItemJson: any = [{
// 'id': 1,
// 'sensor': {
// 'id': 1,
// 'createDate': 1498475947009,
// 'description': 'My sensor',
// 'status': {
// 'id': 1,
// 'name': 'RUNNING',
// },
// 'target': {
// 'id': 1,
// 'createDate': 1501154289555,
// 'displayName': 'ghost target',
// 'description': 'i am target',
// },
// 'crawler': {
// 'id': 1,
// 'createDate': 1498794968791,
// 'name': 'ACTIVEDIRECTORY_CRAWLER',
// 'description': 'ACTIVEDIRECTORY',
// },
// 'crawlerInputItems': null,
// },
// 'item': {
// 'id': 1,
// 'itemType': {
// 'id': 1,
// 'name': 'CPU',
// 'description': 'CPU blah blah blah',
// 'createDate': 1498474179690,
// },
// 'key': 'cpu.usage',
// 'name': 'CPU USAGE',
// 'createDate': 1498475408269,
// },
// 'createDate': 1498476076626,
// },
// {
// 'id': 2,
// 'sensor': {
// 'id': 1,
// 'createDate': 1498475947074,
// 'description': 'My sensor',
// 'status': {
// 'id': 1,
// 'name': 'RUNNING',
// },
// 'target': {
// 'id': 1,
// 'createDate': 1501154289555,
// 'displayName': 'ghost target',
// 'description': 'i am target',
// },
// 'crawler': {
// 'id': 1,
// 'createDate': 1498794968791,
// 'name': 'ACTIVEDIRECTORY_CRAWLER',
// 'description': 'ACTIVEDIRECTORY',
// },
// 'crawlerInputItems': null,
// },
// 'item': {
// 'id': 2,
// 'itemType': {
// 'id': 1,
// 'name': 'CPU',
// 'description': 'CPU blah blah blah',
// 'createDate': 1498474179690,
// },
// 'key': 'cpu.free',
// 'name': 'CPU FREE',
// 'createDate': 1498475408361,
// },
// 'createDate': 1498476110988,
// },
// ];

54
src/ts/@overflow/sensor/redux/action/item_read_all_by_sensor.ts
View File

@ -5,39 +5,39 @@ import ItemReadAllBySensorPayload from '../payload/ItemReadAllBySensorPayload';
// Action Type
export type REQUEST = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST';
export type REQUEST_SUCCESS = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST_SUCCESS';
export type REQUEST_FAILURE = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST_FAILURE';
export type REQUEST_SUCCESS = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST/SUCCESS';
export type REQUEST_FAILURE = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST/FAILURE';
export const REQUEST: REQUEST = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST';
export const REQUEST_SUCCESS: REQUEST_SUCCESS = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST_SUCCESS';
export const REQUEST_FAILURE: REQUEST_FAILURE = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST_FAILURE';
export const REQUEST_SUCCESS: REQUEST_SUCCESS = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST/SUCCESS';
export const REQUEST_FAILURE: REQUEST_FAILURE = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST/FAILURE';
// Action Creater
export type request = (sensor: Sensor) => Action<ItemReadAllBySensorPayload>;
export type requestSuccess = (sensorItems: SensorItem[]) => Action<SensorItem[]>;
export type requestFailure = (error: Error) => Action;
// export type request = (sensor: Sensor) => Action<ItemReadAllBySensorPayload>;
// export type requestSuccess = (sensorItems: SensorItem[]) => Action<SensorItem[]>;
// export type requestFailure = (error: Error) => Action;
export const request: request = (sensor: Sensor): Action<ItemReadAllBySensorPayload> => {
return {
type: REQUEST,
payload: {
sensor: sensor,
},
};
};
// export const request: request = (sensor: Sensor): Action<ItemReadAllBySensorPayload> => {
// return {
// type: REQUEST,
// payload: {
// sensor: sensor,
// },
// };
// };
export const requestSuccess: requestSuccess = (sensorItems: SensorItem[]): Action<SensorItem[]> => {
return {
type: REQUEST_SUCCESS,
payload: sensorItems,
};
};
// export const requestSuccess: requestSuccess = (sensorItems: SensorItem[]): Action<SensorItem[]> => {
// return {
// type: REQUEST_SUCCESS,
// payload: sensorItems,
// };
// };
export const requestFailure: requestFailure = (error: Error): Action => {
return {
type: REQUEST_FAILURE,
error: error,
};
};
// export const requestFailure: requestFailure = (error: Error): Action => {
// return {
// type: REQUEST_FAILURE,
// error: error,
// };
// };

54
src/ts/@overflow/sensor/redux/action/read.ts
View File

@ -4,39 +4,39 @@ import ReadPayload from '../payload/ReadPayload';
// Action Type
export type REQUEST = '@overflow/sensor/read/REQUEST';
export type REQUEST_SUCCESS = '@overflow/sensor/read/REQUEST_SUCCESS';
export type REQUEST_FAILURE = '@overflow/sensor/read/REQUEST_FAILURE';
export type REQUEST_SUCCESS = '@overflow/sensor/read/REQUEST/SUCCESS';
export type REQUEST_FAILURE = '@overflow/sensor/read/REQUEST/FAILURE';
export const REQUEST: REQUEST = '@overflow/sensor/read/REQUEST';
export const REQUEST_SUCCESS: REQUEST_SUCCESS = '@overflow/sensor/read/REQUEST_SUCCESS';
export const REQUEST_FAILURE: REQUEST_FAILURE = '@overflow/sensor/read/REQUEST_FAILURE';
export const REQUEST_SUCCESS: REQUEST_SUCCESS = '@overflow/sensor/read/REQUEST/SUCCESS';
export const REQUEST_FAILURE: REQUEST_FAILURE = '@overflow/sensor/read/REQUEST/FAILURE';
// Action Creater
export type request = (id: number) => Action<ReadPayload>;
export type requestSuccess = (sensor: Sensor) => Action<Sensor>;
export type requestFailure = (error: Error) => Action;
// export type request = (id: number) => Action<ReadPayload>;
// export type requestSuccess = (sensor: Sensor) => Action<Sensor>;
// export type requestFailure = (error: Error) => Action;
export const request: request = (id: number): Action<ReadPayload> => {
return {
type: REQUEST,
payload: {
id: id,
},
};
};
// export const request: request = (id: number): Action<ReadPayload> => {
// return {
// type: REQUEST,
// payload: {
// id: id,
// },
// };
// };
export const requestSuccess: requestSuccess = (sensor: Sensor): Action<Sensor> => {
return {
type: REQUEST_SUCCESS,
payload: sensor,
};
};
// export const requestSuccess: requestSuccess = (sensor: Sensor): Action<Sensor> => {
// return {
// type: REQUEST_SUCCESS,
// payload: sensor,
// };
// };
export const requestFailure: requestFailure = (error: Error): Action => {
return {
type: REQUEST_FAILURE,
error: error,
};
};
// export const requestFailure: requestFailure = (error: Error): Action => {
// return {
// type: REQUEST_FAILURE,
// error: error,
// };
// };