added infradetail
This commit is contained in:
parent
d673019a90
commit
60f212aeee
26
src/ts/@overflow/infra/react/InfraDetail.tsx
Normal file
26
src/ts/@overflow/infra/react/InfraDetail.tsx
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
import { connect, Dispatch } from 'react-redux';
|
||||||
|
import {
|
||||||
|
InfraDetail,
|
||||||
|
StateProps as InfraDetailStateProps,
|
||||||
|
DispatchProps as InfraDetailDispatchProps,
|
||||||
|
} from './components/InfraDetail';
|
||||||
|
|
||||||
|
import MetaInfraType from '@overflow/meta/api/model/MetaInfraType';
|
||||||
|
import * as ReadByChildActions from '../redux/action/read_by_child';
|
||||||
|
|
||||||
|
export function mapStateToProps(state: any, props: any): InfraDetailStateProps {
|
||||||
|
return {
|
||||||
|
target: props.target,
|
||||||
|
infra: props.infra,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function mapDispatchToProps(dispatch: Dispatch<any>): InfraDetailDispatchProps {
|
||||||
|
return {
|
||||||
|
onGetChildInfra: (type: MetaInfraType, id: number) => {
|
||||||
|
dispatch(ReadByChildActions.request(type, id));
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(mapStateToProps, mapDispatchToProps)(InfraDetail);
|
280
src/ts/@overflow/infra/react/components/InfraDetail.tsx
Normal file
280
src/ts/@overflow/infra/react/components/InfraDetail.tsx
Normal file
|
@ -0,0 +1,280 @@
|
||||||
|
import * as React from 'react';
|
||||||
|
import { Button, Table, Header, Container } from 'semantic-ui-react';
|
||||||
|
import { SensorList } from '@overflow/sensor/react/components/SensorList';
|
||||||
|
import { DetailContainer } from '@overflow/commons/react/component/DetailContainer';
|
||||||
|
|
||||||
|
import Target from '@overflow/target/api/model/Target';
|
||||||
|
import MetaInfraType from '@overflow/meta/api/model/MetaInfraType';
|
||||||
|
import Infra from '@overflow/infra/api/model/Infra';
|
||||||
|
import InfraHost from '@overflow/infra/api/model/InfraHost';
|
||||||
|
|
||||||
|
import * as Utils from '@overflow/commons/utils/Utils';
|
||||||
|
|
||||||
|
|
||||||
|
export interface StateProps {
|
||||||
|
target?: Target;
|
||||||
|
infra?: Infra;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DispatchProps {
|
||||||
|
}
|
||||||
|
|
||||||
|
export type Props = StateProps & DispatchProps;
|
||||||
|
|
||||||
|
export interface State {
|
||||||
|
childInfra: any; // todo. fix to InfraTypes
|
||||||
|
tableDatas: Array<TableData>;
|
||||||
|
testInfra: Infra;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export class InfraDetail extends React.Component<Props, State> {
|
||||||
|
|
||||||
|
constructor(props: Props, context: State) {
|
||||||
|
super(props, context);
|
||||||
|
this.state = {
|
||||||
|
childInfra: null,
|
||||||
|
tableDatas: null,
|
||||||
|
testInfra: InfraJson,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
public componentWillMount(): void {
|
||||||
|
// todo. getting infra and child infra
|
||||||
|
|
||||||
|
// this.getInfraChild();
|
||||||
|
|
||||||
|
this.setState({
|
||||||
|
childInfra: InfraHostJson,
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
public getInfraChild = () => {
|
||||||
|
let childObject = InfraHostJson;
|
||||||
|
|
||||||
|
this.setState({
|
||||||
|
childInfra: childObject,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public handleRemoveTarget(): void {
|
||||||
|
alert('remove');
|
||||||
|
}
|
||||||
|
|
||||||
|
public ConvertInfra = () => {
|
||||||
|
// let type = this.props.infra.type.name;
|
||||||
|
let NewTableDatas: Array<TableData>;
|
||||||
|
let type = this.state.testInfra.type.name;
|
||||||
|
switch (type) {
|
||||||
|
case 'MACHINE':
|
||||||
|
break;
|
||||||
|
case 'HOST':
|
||||||
|
NewTableDatas = this.ConvertTableDataForHost(this.state.childInfra);
|
||||||
|
break;
|
||||||
|
case 'OS': {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case 'OS_APPLICATION': {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case 'OS_DAEMON': {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case 'OS_PORT': {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case 'OS_SERVICE': {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
|
||||||
|
}
|
||||||
|
return NewTableDatas;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
public render(): JSX.Element {
|
||||||
|
return (
|
||||||
|
<Container fluid>
|
||||||
|
<InfraTable tableDatas={this.ConvertInfra()} />
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
private ConvertTableDataForHost(infraChild: InfraHost): Array<TableData> {
|
||||||
|
let NewTableDatas: Array<TableData>;
|
||||||
|
|
||||||
|
NewTableDatas = [{
|
||||||
|
header: 'IP',
|
||||||
|
contents: Utils.int2ip(infraChild.ip),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
header: 'MAC',
|
||||||
|
contents: Utils.intToMac(infraChild.mac),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
// this.setState({ tableDatas: NewTableDatas });
|
||||||
|
return NewTableDatas;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TableData {
|
||||||
|
header: string;
|
||||||
|
contents: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface InfraTableProps {
|
||||||
|
tableDatas: Array<TableData>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class InfraTable extends React.Component<InfraTableProps, any> {
|
||||||
|
constructor(props: InfraTableProps, context: any) {
|
||||||
|
super(props, context);
|
||||||
|
this.state = {
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
public ViewInfra(): JSX.Element[] {
|
||||||
|
let elems: Array<JSX.Element> = new Array();
|
||||||
|
|
||||||
|
for (let data of this.props.tableDatas) {
|
||||||
|
elems.push(
|
||||||
|
<Table.Row>
|
||||||
|
<Table.Cell collapsing>
|
||||||
|
<Header size='small'>{data.header}</Header>
|
||||||
|
</Table.Cell>
|
||||||
|
<Table.Cell>
|
||||||
|
{data.contents}
|
||||||
|
</Table.Cell>
|
||||||
|
</Table.Row>,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return elems;
|
||||||
|
}
|
||||||
|
|
||||||
|
public render(): JSX.Element {
|
||||||
|
return (
|
||||||
|
<Table celled={false}>
|
||||||
|
<Table.Body>
|
||||||
|
{this.ViewInfra()}
|
||||||
|
</Table.Body>
|
||||||
|
</Table>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const InfraJson: any = {
|
||||||
|
'id': 3,
|
||||||
|
'type': {
|
||||||
|
'id': 2,
|
||||||
|
'name': 'HOST',
|
||||||
|
'createDate': 1498379502894,
|
||||||
|
},
|
||||||
|
'childId': 1,
|
||||||
|
'createDate': 1501207730841,
|
||||||
|
'probe': {
|
||||||
|
'id': 1,
|
||||||
|
'status': {
|
||||||
|
'id': 1,
|
||||||
|
'name': 'INITIAL',
|
||||||
|
},
|
||||||
|
'description': 'snoop probe',
|
||||||
|
'createDate': 1501153288513,
|
||||||
|
'domain': {
|
||||||
|
'id': 1,
|
||||||
|
'name': 'overFlow\'s domain',
|
||||||
|
'createDate': 1498443944866,
|
||||||
|
},
|
||||||
|
'probeKey': '899fdd145bcc11e7b611080027658d13',
|
||||||
|
'encryptionKey': '8c51fa9c5bcc11e7980a080027658d13',
|
||||||
|
'targetCount': 0,
|
||||||
|
'sensorCount': 0,
|
||||||
|
'displayName': 'test probe',
|
||||||
|
'cidr': '192.168.1.0/24',
|
||||||
|
'authorizeDate': 1501153288513,
|
||||||
|
'authorizeMember': {
|
||||||
|
'id': 1,
|
||||||
|
'email': 'overflow@loafle.com',
|
||||||
|
'pw': 'qwer5795',
|
||||||
|
'name': 'overFlow',
|
||||||
|
'phone': '000-000-0000',
|
||||||
|
'companyName': 'loafle',
|
||||||
|
'createDate': 1498442847625,
|
||||||
|
'status': {
|
||||||
|
'id': 2,
|
||||||
|
'name': 'NORMAL',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'infraHost': {
|
||||||
|
'id': 1,
|
||||||
|
'os': {
|
||||||
|
'id': 1,
|
||||||
|
'machine': {
|
||||||
|
'id': 1,
|
||||||
|
'meta': '',
|
||||||
|
'createDate': 1501152866677,
|
||||||
|
},
|
||||||
|
'meta': '',
|
||||||
|
'createDate': 1501152947326,
|
||||||
|
'vendor': {
|
||||||
|
'id': 26,
|
||||||
|
'name': 'Windows',
|
||||||
|
'createDate': 1501136812985,
|
||||||
|
'metaInfraType': {
|
||||||
|
'id': 3,
|
||||||
|
'name': 'OS',
|
||||||
|
'createDate': 1498379502906,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'ip': 3232235980,
|
||||||
|
'mac': 8796753988883,
|
||||||
|
'createDate': 1501153030607,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'target': {
|
||||||
|
'id': 1,
|
||||||
|
'createDate': 1501154289555,
|
||||||
|
'displayName': 'ghost target',
|
||||||
|
'description': 'i am target',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const InfraHostJson: any = {
|
||||||
|
'id': 1,
|
||||||
|
'os': {
|
||||||
|
'id': 1,
|
||||||
|
'machine': {
|
||||||
|
'id': 1,
|
||||||
|
'meta': '',
|
||||||
|
'createDate': 1501152866677,
|
||||||
|
},
|
||||||
|
'meta': '',
|
||||||
|
'createDate': 1501152947326,
|
||||||
|
'vendor': {
|
||||||
|
'id': 26,
|
||||||
|
'name': 'Windows',
|
||||||
|
'createDate': 1501136812985,
|
||||||
|
'metaInfraType': {
|
||||||
|
'id': 3,
|
||||||
|
'name': 'OS',
|
||||||
|
'createDate': 1498379502906,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'ip': 3232235980,
|
||||||
|
'mac': 8796753988883,
|
||||||
|
'createDate': 1501153030607,
|
||||||
|
};
|
46
src/ts/@overflow/infra/redux/action/read_by_child.ts
Normal file
46
src/ts/@overflow/infra/redux/action/read_by_child.ts
Normal file
|
@ -0,0 +1,46 @@
|
||||||
|
import Action from '@overflow/commons/redux/Action';
|
||||||
|
import Infra from '../..//api/model/Infra';
|
||||||
|
|
||||||
|
import ReadByChildPayload from '../payload/ReadByChildPayload';
|
||||||
|
|
||||||
|
import MetaInfraType from '@overflow/meta/api/model/MetaInfraType';
|
||||||
|
|
||||||
|
// Action Type
|
||||||
|
export type REQUEST = '@overflow/infra/read_by_child/REQUEST';
|
||||||
|
export type REQUEST_SUCCESS = '@overflow/infra/read_by_child/REQUEST_SUCCESS';
|
||||||
|
export type REQUEST_FAILURE = '@overflow/infra/read_by_child/REQUEST_FAILURE';
|
||||||
|
|
||||||
|
export const REQUEST: REQUEST = '@overflow/infra/read_by_child/REQUEST';
|
||||||
|
export const REQUEST_SUCCESS: REQUEST_SUCCESS = '@overflow/infra/read_by_child/REQUEST_SUCCESS';
|
||||||
|
export const REQUEST_FAILURE: REQUEST_FAILURE = '@overflow/infra/read_by_child/REQUEST_FAILURE';
|
||||||
|
|
||||||
|
// Action Creater
|
||||||
|
export type request = (metaInfraType: MetaInfraType, id: number) => Action<ReadByChildPayload>;
|
||||||
|
export type requestSuccess = (infra: Infra) => Action<Infra>;
|
||||||
|
export type requestFailure = (error: Error) => Action;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export const request: request = (metaInfraType: MetaInfraType, id: number): Action<ReadByChildPayload> => {
|
||||||
|
return {
|
||||||
|
type: REQUEST,
|
||||||
|
payload: {
|
||||||
|
metaInfraType: metaInfraType,
|
||||||
|
id: id,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
export const requestSuccess: requestSuccess = (infra: Infra): Action<Infra> => {
|
||||||
|
return {
|
||||||
|
type: REQUEST_SUCCESS,
|
||||||
|
payload: infra,
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
export const requestFailure: requestFailure = (error: Error): Action => {
|
||||||
|
return {
|
||||||
|
type: REQUEST_FAILURE,
|
||||||
|
error: error,
|
||||||
|
};
|
||||||
|
};
|
|
@ -0,0 +1,8 @@
|
||||||
|
import MetaInfraType from '@overflow/meta/api/model/MetaInfraType';
|
||||||
|
|
||||||
|
interface ReadByChildPayload {
|
||||||
|
metaInfraType: MetaInfraType;
|
||||||
|
id: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReadByChildPayload;
|
|
@ -16,7 +16,7 @@ export function mapStateToProps(state: any): SensorItemTreeStateProps {
|
||||||
|
|
||||||
export function mapDispatchToProps(dispatch: Dispatch<any>): SensorItemTreeDispatchProps {
|
export function mapDispatchToProps(dispatch: Dispatch<any>): SensorItemTreeDispatchProps {
|
||||||
return {
|
return {
|
||||||
onRead: () => {
|
onReadAll: () => {
|
||||||
dispatch(SensorItemReadAllActions.request());
|
dispatch(SensorItemReadAllActions.request());
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue
Block a user