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 { public render(): JSX.Element {
return ( 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 { public render(): JSX.Element {
return ( 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 Sensor from '@overflow/sensor/api/model/Sensor';
import * as asyncRequestActions from '@overflow/commons/redux/action/asyncRequest'; 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 { export function mapStateToProps(state: any, props: any): SensorDetailInfoStateProps {
return { return {
sensorId:props.params.id, 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'; } from './components/SensorDetailItems';
import State from '../redux/state/ItemRead'; 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 { return {
sensorId: props.params.id, sensorId: props.params.id,
sensorItemList: state.SensorItemList,
}; };
} }
export function mapDispatchToProps(dispatch: Dispatch<any>): SensorDetailItemsDispatchProps { export function mapDispatchToProps(dispatch: Dispatch<any>): SensorDetailItemsDispatchProps {
return { return {
onRead: (id: number) => { onReadAllBySensor: (sensor: Sensor) => {
dispatch(ItemReadActions.request(id)); dispatch(asyncRequestActions.request('SensorItemService', 'readAllBySensor',
ItemReadAllBySensorActions.REQUEST, JSON.stringify(sensor)));
}, },
}; };
} }

137
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 { export interface SensorDetailInfoStateProps {
sensorId?: number; sensorId?: number;
probe?: Probe; probe?: Probe;
sensor?: Sensor;
} }
export interface SensorDetailInfoDispatchProps { export interface SensorDetailInfoDispatchProps {
@ -17,7 +18,7 @@ export interface SensorDetailInfoDispatchProps {
export type SensorDetailInfoProps = SensorDetailInfoStateProps & SensorDetailInfoDispatchProps; export type SensorDetailInfoProps = SensorDetailInfoStateProps & SensorDetailInfoDispatchProps;
export interface SensorDetailInfoState { export interface SensorDetailInfoState {
sensor: Sensor; // sensor: Sensor;
} }
export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, SensorDetailInfoState> { 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) { constructor(props: SensorDetailInfoProps, context: SensorDetailInfoState) {
super(props, context); super(props, context);
this.state = { this.state = {
sensor: SensorDetailJson, // sensor: SensorDetailJson,
}; };
this.props.onRead(this.props.sensorId);
} }
public handleStartStop(event: any, data: any): void { public handleStartStop(event: any, data: any): void {
@ -46,7 +49,7 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
public showStartStopBtn(): JSX.Element { 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} />; return <Button content='Stop' icon='stop' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
} else { } else {
return <Button content='Start' icon='play' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />; return <Button content='Start' icon='play' labelPosition='left' color={'blue'} floated={'right'} onClick={this.handleStartStop} />;
@ -56,25 +59,42 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
public render(): JSX.Element { public render(): JSX.Element {
return ( return (
<Container fluid> <Container fluid>
{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} />
{/*{this.showStartStopBtn()}*/}
</Container>
);
}
private renderDetail(): JSX.Element {
if (this.props.sensor === undefined) {
return null;
}
return (
<Table celled> <Table celled>
<Table.Body> <Table.Body>
<Table.Row> <Table.Row>
<Table.Cell> <Table.Cell>
<Header size='small'>Name</Header> <Header size='small'>Name</Header>
</Table.Cell> </Table.Cell>
<Table.Cell>{this.state.sensor.target.displayName}</Table.Cell> <Table.Cell>{this.props.sensor.target.displayName}</Table.Cell>
</Table.Row> </Table.Row>
<Table.Row> <Table.Row>
<Table.Cell> <Table.Cell>
<Header size='small'>Status</Header> <Header size='small'>Status</Header>
</Table.Cell> </Table.Cell>
<Table.Cell>{this.state.sensor.status.name}</Table.Cell> <Table.Cell>{this.props.sensor.status.name}</Table.Cell>
</Table.Row> </Table.Row>
<Table.Row> <Table.Row>
<Table.Cell> <Table.Cell>
<Header size='small'>Crawler</Header> <Header size='small'>Crawler</Header>
</Table.Cell> </Table.Cell>
<Table.Cell>{this.state.sensor.crawler.name}</Table.Cell> <Table.Cell>{this.props.sensor.crawler.name}</Table.Cell>
</Table.Row> </Table.Row>
<Table.Row> <Table.Row>
<Table.Cell> <Table.Cell>
@ -86,7 +106,7 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
<Table.Cell> <Table.Cell>
<Header size='small'>Created at</Header> <Header size='small'>Created at</Header>
</Table.Cell> </Table.Cell>
<Table.Cell>{this.state.sensor.createDate}</Table.Cell> <Table.Cell>{this.props.sensor.createDate}</Table.Cell>
</Table.Row> </Table.Row>
<Table.Row> <Table.Row>
<Table.Cell> <Table.Cell>
@ -96,62 +116,57 @@ export class SensorDetailInfo extends React.Component<SensorDetailInfoProps, Sen
</Table.Row> </Table.Row>
</Table.Body> </Table.Body>
</Table> </Table>
<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} />
{/*{this.showStartStopBtn()}*/}
</Container>
); );
} }
} }
const SensorDetailJson: any = { // const SensorDetailJson: any = {
'id': 1, // 'id': 1,
'createDate': 1498475947009, // 'createDate': 1498475947009,
'description': 'My sensor', // 'description': 'My sensor',
'status': { // 'status': {
'id': 1, // 'id': 1,
'name': 'RUNNING', // 'name': 'RUNNING',
}, // },
'target': { // 'target': {
'id': 1, // 'id': 1,
'createDate': 1498448242854, // 'createDate': 1498448242854,
'probe': { // 'probe': {
'id': 1, // 'id': 1,
'status': { // 'status': {
'id': 1, // 'id': 1,
'name': 'INITIAL', // 'name': 'INITIAL',
}, // },
'description': 'snoop probe', // 'description': 'snoop probe',
'createDate': 1498448699813, // 'createDate': 1498448699813,
'lastPollingDate': null, // 'lastPollingDate': null,
'nextPollingDate': null, // 'nextPollingDate': null,
'domain': { // 'domain': {
'id': 1, // 'id': 1,
'name': 'overFlow\'s domain', // 'name': 'overFlow\'s domain',
'createDate': 1498443944866, // 'createDate': 1498443944866,
}, // },
'probeKey': 'a1e1710557de11e78799080027658d13', // 'probeKey': 'a1e1710557de11e78799080027658d13',
'encryptionKey': '9c8d41ab57de11e7a2c9080027658d13', // 'encryptionKey': '9c8d41ab57de11e7a2c9080027658d13',
}, // },
'infra': { // 'infra': {
'id': 1, // 'id': 1,
'type': { // 'type': {
'id': 1, // 'id': 1,
'name': 'MACHINE', // 'name': 'MACHINE',
'createDate': 1498379502770, // 'createDate': 1498379502770,
}, // },
'childId': 0, // 'childId': 0,
'createDate': 1498446731809, // 'createDate': 1498446731809,
}, // },
}, // },
'crawler': { // 'crawler': {
'id': 1, // 'id': 1,
'createDate': 1498794968791, // 'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER', // 'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY', // 'description': 'ACTIVEDIRECTORY',
}, // },
'crawlerInputItems': null, // '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 { export interface StateProps {
sensorId?: number; sensorId?: number;
sensorItemList?: SensorItem[];
} }
export interface DispatchProps { export interface DispatchProps {
onReadAllBySensor?(sensor: Sensor): void;
} }
export type Props = StateProps & DispatchProps; export type Props = StateProps & DispatchProps;
export interface State { export interface State {
sensorItemList: SensorItem[];
} }
@ -23,9 +25,10 @@ export class SensorDetailItems extends React.Component<Props, State> {
constructor(props: Props, context: State) { constructor(props: Props, context: State) {
super(props, context); super(props, context);
this.state = { 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 = [{ // const SensorItemJson: any = [{
'id': 1, // 'id': 1,
'sensor': { // 'sensor': {
'id': 1, // 'id': 1,
'createDate': 1498475947009, // 'createDate': 1498475947009,
'description': 'My sensor', // 'description': 'My sensor',
'status': { // 'status': {
'id': 1, // 'id': 1,
'name': 'RUNNING', // 'name': 'RUNNING',
}, // },
'target': { // 'target': {
'id': 1, // 'id': 1,
'createDate': 1501154289555, // 'createDate': 1501154289555,
'displayName': 'ghost target', // 'displayName': 'ghost target',
'description': 'i am target', // 'description': 'i am target',
}, // },
'crawler': { // 'crawler': {
'id': 1, // 'id': 1,
'createDate': 1498794968791, // 'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER', // 'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY', // 'description': 'ACTIVEDIRECTORY',
}, // },
'crawlerInputItems': null, // 'crawlerInputItems': null,
}, // },
'item': { // 'item': {
'id': 1, // 'id': 1,
'itemType': { // 'itemType': {
'id': 1, // 'id': 1,
'name': 'CPU', // 'name': 'CPU',
'description': 'CPU blah blah blah', // 'description': 'CPU blah blah blah',
'createDate': 1498474179690, // 'createDate': 1498474179690,
}, // },
'key': 'cpu.usage', // 'key': 'cpu.usage',
'name': 'CPU USAGE', // 'name': 'CPU USAGE',
'createDate': 1498475408269, // 'createDate': 1498475408269,
}, // },
'createDate': 1498476076626, // 'createDate': 1498476076626,
}, // },
{ // {
'id': 2, // 'id': 2,
'sensor': { // 'sensor': {
'id': 1, // 'id': 1,
'createDate': 1498475947074, // 'createDate': 1498475947074,
'description': 'My sensor', // 'description': 'My sensor',
'status': { // 'status': {
'id': 1, // 'id': 1,
'name': 'RUNNING', // 'name': 'RUNNING',
}, // },
'target': { // 'target': {
'id': 1, // 'id': 1,
'createDate': 1501154289555, // 'createDate': 1501154289555,
'displayName': 'ghost target', // 'displayName': 'ghost target',
'description': 'i am target', // 'description': 'i am target',
}, // },
'crawler': { // 'crawler': {
'id': 1, // 'id': 1,
'createDate': 1498794968791, // 'createDate': 1498794968791,
'name': 'ACTIVEDIRECTORY_CRAWLER', // 'name': 'ACTIVEDIRECTORY_CRAWLER',
'description': 'ACTIVEDIRECTORY', // 'description': 'ACTIVEDIRECTORY',
}, // },
'crawlerInputItems': null, // 'crawlerInputItems': null,
}, // },
'item': { // 'item': {
'id': 2, // 'id': 2,
'itemType': { // 'itemType': {
'id': 1, // 'id': 1,
'name': 'CPU', // 'name': 'CPU',
'description': 'CPU blah blah blah', // 'description': 'CPU blah blah blah',
'createDate': 1498474179690, // 'createDate': 1498474179690,
}, // },
'key': 'cpu.free', // 'key': 'cpu.free',
'name': 'CPU FREE', // 'name': 'CPU FREE',
'createDate': 1498475408361, // 'createDate': 1498475408361,
}, // },
'createDate': 1498476110988, // '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 // Action Type
export type REQUEST = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST'; 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_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_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: 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_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_FAILURE: REQUEST_FAILURE = '@overflow/sensor_item/item_read_all_by_sensor/REQUEST/FAILURE';
// Action Creater // Action Creater
export type request = (sensor: Sensor) => Action<ItemReadAllBySensorPayload>; // export type request = (sensor: Sensor) => Action<ItemReadAllBySensorPayload>;
export type requestSuccess = (sensorItems: SensorItem[]) => Action<SensorItem[]>; // export type requestSuccess = (sensorItems: SensorItem[]) => Action<SensorItem[]>;
export type requestFailure = (error: Error) => Action; // export type requestFailure = (error: Error) => Action;
export const request: request = (sensor: Sensor): Action<ItemReadAllBySensorPayload> => { // export const request: request = (sensor: Sensor): Action<ItemReadAllBySensorPayload> => {
return { // return {
type: REQUEST, // type: REQUEST,
payload: { // payload: {
sensor: sensor, // sensor: sensor,
}, // },
}; // };
}; // };
export const requestSuccess: requestSuccess = (sensorItems: SensorItem[]): Action<SensorItem[]> => { // export const requestSuccess: requestSuccess = (sensorItems: SensorItem[]): Action<SensorItem[]> => {
return { // return {
type: REQUEST_SUCCESS, // type: REQUEST_SUCCESS,
payload: sensorItems, // payload: sensorItems,
}; // };
}; // };
export const requestFailure: requestFailure = (error: Error): Action => { // export const requestFailure: requestFailure = (error: Error): Action => {
return { // return {
type: REQUEST_FAILURE, // type: REQUEST_FAILURE,
error: error, // error: error,
}; // };
}; // };

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

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