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

Merge remote-tracking branch 'origin/master'

Browse Source
This commit is contained in:
geek 2017-07-20 12:20:47 +09:00
commit f01f185ed6
4 changed files with 127 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
src/ts/@overflow/temp/react/components/NoauthProbes.tsx
View File

@ -1,6 +1,13 @@
import * as React from 'react'; import * as React from 'react';
import { Table, Checkbox, Button, Header, Container } from 'semantic-ui-react'; import { Table, Checkbox, Button, Header, Container } from 'semantic-ui-react';
export interface Props {
}
export interface State {
}
export class NoauthProbes extends React.Component<any, any> { export class NoauthProbes extends React.Component<any, any> {
@ -15,47 +22,46 @@ export class NoauthProbes extends React.Component<any, any> {
this.selectedIds = new Array(); this.selectedIds = new Array();
} }
public componentWillMount(): void {
componentWillMount() {
this.data = [ this.data = [
{ {
"id": "11", 'id': '11',
"MetaNoAuthProbeStatus": { 'MetaNoAuthProbeStatus': {
"name": "NORMAL" 'name': 'NORMAL',
}, },
"hostName": "insanity's windows", 'hostName': 'insanity windows',
"macAddress": "14:fe:b5:9d:54:7e", 'macAddress': '14:fe:b5:9d:54:7e',
"ipAddress": "192.168.1.105", 'ipAddress': '192.168.1.105',
"tempProbeKey": "45374d4egsdfw332", 'tempProbeKey': '45374d4egsdfw332',
"apiKey": "45374d4egsdfw332", 'apiKey': '45374d4egsdfw332',
"domain": { 'domain': {
}, },
"probe": { 'probe': {
}, },
}, },
{ {
"id": "22", 'id': '22',
"MetaNoAuthProbeStatus": { 'MetaNoAuthProbeStatus': {
"name": "NORMAL" 'name': 'NORMAL',
}, },
"hostName": "insanity's ubuntu", 'hostName': 'insanity ubuntu',
"macAddress": "14:fe:b5:9d:54:7e", 'macAddress': '14:fe:b5:9d:54:7e',
"ipAddress": "192.168.1.105", 'ipAddress': '192.168.1.105',
"tempProbeKey": "45374d4egsdfw332", 'tempProbeKey': '45374d4egsdfw332',
"apiKey": "45374d4egsdfw332", 'apiKey': '45374d4egsdfw332',
"domain": { 'domain': {
}, },
"probe": { 'probe': {
}, },
}, },
]; ];
} }
handleSelect(id: string) { public handleSelect(id: string): void {
let idx = this.selectedIds.indexOf(id); let idx = this.selectedIds.indexOf(id);
if (idx === -1) { if (idx === -1) {
this.selectedIds.push(id); this.selectedIds.push(id);
@ -67,29 +73,29 @@ export class NoauthProbes extends React.Component<any, any> {
}); });
} }
checkExist(id: string): boolean { public checkExist(id: string): boolean {
if (this.state.selected.indexOf(id) === -1) { if (this.state.selected.indexOf(id) === -1) {
return false; return false;
} }
return true; return true;
} }
handleAccept() { public handleAccept(): void {
alert(this.state.selected); alert(this.state.selected);
} }
handleDeny() { public handleDeny(): void {
alert(this.state.selected); alert(this.state.selected);
} }
handleRowActive(id: string):boolean { public handleRowActive(id: string):boolean {
if (this.state.selected.indexOf(id) === -1) { if (this.state.selected.indexOf(id) === -1) {
return false; return false;
} }
return true; return true;
} }
render() { public render(): JSX.Element {
return ( return (
<Container fluid> <Container fluid>

26
src/ts/@overflow/temp/react/components/ProbeDetails.tsx
View File

@ -2,7 +2,15 @@ import * as React from 'react';
import { Button, Table, Label, Segment, Header, Container } from 'semantic-ui-react'; import { Button, Table, Label, Segment, Header, Container } from 'semantic-ui-react';
import { TargetTable } from './Targets'; import { TargetTable } from './Targets';
export class ProbeDetails extends React.Component<any, any> { export interface Props {
probe: object;
}
export interface State {
}
export class ProbeDetails extends React.Component<Props, State> {
constructor(props: any, context: any) { constructor(props: any, context: any) {
super(props, context); super(props, context);
@ -10,11 +18,11 @@ export class ProbeDetails extends React.Component<any, any> {
}; };
} }
componentWillMount() { public componentWillMount(): void {
super.componentWillMount();
} }
render() { public render(): JSX.Element {
return ( return (
<Container fluid> <Container fluid>
<ProbeBasicInfo probe={this.props.probe} /> <ProbeBasicInfo probe={this.props.probe} />
@ -32,19 +40,19 @@ export class ProbeBasicInfo extends React.Component<any, any> {
}; };
} }
handleStartStop(event: any, data: any) { public handleStartStop(event: any, data: any): void {
console.log(event); console.log(event);
} }
handleDiscovery(event: any, data: any) { public handleDiscovery(event: any, data: any): void {
alert('Discovery'); alert('Discovery');
} }
handleBack(event: any, data: any) { public handleBack(event: any, data: any): void {
this.props.onBack(); this.props.onBack();
} }
showStartStopBtn() { public showStartStopBtn(): JSX.Element {
if (this.props.probe.metaProbeStatus.name === 'STARTED') { if (this.props.probe.metaProbeStatus.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 {
@ -52,7 +60,7 @@ export class ProbeBasicInfo extends React.Component<any, any> {
} }
} }
render() { public render(): JSX.Element {
return ( return (
<Container fluid> <Container fluid>
<Header as='h3' dividing>Probe Info</Header> <Header as='h3' dividing>Probe Info</Header>

0
src/ts/@overflow/probe/react/components/ProbeDown.tsx → src/ts/@overflow/temp/react/components/ProbeDown.tsx
View File

137
src/ts/@overflow/temp/react/components/Probes.tsx
View File

@ -3,64 +3,77 @@ import { Table, Header, Container, Form, Checkbox, Button } from 'semantic-ui-re
import { ProbeDetails } from './ProbeDetails'; import { ProbeDetails } from './ProbeDetails';
import { ListContainer } from './commons/ListContainer'; import { ListContainer } from './commons/ListContainer';
export class Probes extends React.Component<any, any> { export interface Props {
}
export interface State {
selected: object;
isDetail: boolean;
list: object[];
}
export class Probes extends React.Component<Props, State> {
private data: any; private data: any;
constructor(props: any, context: any) { constructor(props: any, context: any) {
super(props, context); super(props, context);
this.state = { this.state = {
selected: null, selected: null,
isDetail: false, isDetail: false,
list: [], list: null,
}; };
} }
componentWillMount() { public componentWillMount(): void {
super.componentWillMount();
this.data = [ this.data = [
{ {
"id": "11", 'id': '11',
"metaProbeStatus": { 'metaProbeStatus': {
"name": "STARTED" 'name': 'STARTED',
}, },
"domain": { 'domain': {
"name": "asus" 'name': 'asus',
}, },
"probeKey": "1AGBLKDFJ2452ASDGFL2KWJLKSDJ", 'probeKey': '1AGBLKDFJ2452ASDGFL2KWJLKSDJ',
"description": "description1111111111", 'description': 'description1111111111',
}, },
{ {
"id": "22", 'id': '22',
"metaProbeStatus": { 'metaProbeStatus': {
"name": "STOPPED" 'name': 'STOPPED',
}, },
"domain": { 'domain': {
"name": "ottugi" 'name': 'ottugi',
}, },
"probeKey": "2AGBLKDFJ2452ASDGFL2KWJLKSDJ", 'probeKey': '2AGBLKDFJ2452ASDGFL2KWJLKSDJ',
"description": "description22222222", 'description': 'description22222222',
}, },
{ {
"id": "33", 'id': '33',
"metaProbeStatus": { 'metaProbeStatus': {
"name": "STOPPED" 'name': 'STOPPED',
}, },
"domain": { 'domain': {
"name": "lg" 'name': 'lg',
}, },
"probeKey": "3AGBLKDFJ2452ASDGFL2KWJLKSDJ", 'probeKey': '3AGBLKDFJ2452ASDGFL2KWJLKSDJ',
"description": "description33333", 'description': 'description33333',
}, },
{ {
"id": "44", 'id': '44',
"metaProbeStatus": { 'metaProbeStatus': {
"name": "STARTED" 'name': 'STARTED',
}, },
"domain": { 'domain': {
"name": "apple" 'name': 'apple',
}, },
"probeKey": "4AGBLKDFJ2452ASDGFL2KWJLKSDJ", 'probeKey': '4AGBLKDFJ2452ASDGFL2KWJLKSDJ',
"description": "description4444", 'description': 'description4444',
}, },
]; ];
this.setState({ this.setState({
@ -68,27 +81,27 @@ export class Probes extends React.Component<any, any> {
}); });
} }
checkCellStatus(status: any): boolean { public checkCellStatus(status: any): boolean {
if (status.name === 'STOPPED') { if (status.name === 'STOPPED') {
return true; return true;
} }
return false; return false;
} }
handleSelect(selectedProbe: object) { public handleSelect(selectedProbe: object): void {
this.setState({ this.setState({
selected: selectedProbe, selected: selectedProbe,
isDetail: true, isDetail: true,
}); });
} }
handleSearch(result: object[]) { public handleSearch(result: object[]): void {
this.setState({ this.setState({
list: result, list: result,
}); });
} }
handleFilter(filterStr: string) { public handleFilter(filterStr: string): void {
if (filterStr === null) { if (filterStr === null) {
this.setState({ this.setState({
list: this.data, list: this.data,
@ -106,25 +119,7 @@ export class Probes extends React.Component<any, any> {
}); });
} }
renderRows() { public render(): JSX.Element {
if (this.state.list.length === 0) {
return <Table.Row error >
<Table.Cell textAlign='center' colSpan='5'>No results found.</Table.Cell>
</Table.Row>;
}
return this.state.list.map((probe: any, index: number) => (
<Table.Row key={index} onClick={this.handleSelect.bind(this, probe)}>
<Table.Cell >{probe.domain.name}</Table.Cell>
<Table.Cell>{index}</Table.Cell>
<Table.Cell negative={this.checkCellStatus(probe.metaProbeStatus)} textAlign={'center'}>{probe.metaProbeStatus.name}</Table.Cell>
<Table.Cell textAlign={'center'} >todo. {probe.targetCnt}</Table.Cell>
<Table.Cell textAlign={'center'} >todo. {probe.sensorCnt}</Table.Cell>
</Table.Row>
));
}
render() {
if (this.state.isDetail) { if (this.state.isDetail) {
return <ProbeDetails probe={this.state.selected} onBack={() => this.setState({ isDetail: false })} />; return <ProbeDetails probe={this.state.selected} onBack={() => this.setState({ isDetail: false })} />;
} }
@ -156,6 +151,24 @@ export class Probes extends React.Component<any, any> {
/> />
); );
} }
private renderRows(): (JSX.Element | JSX.Element[]) {
if (this.state.list.length === 0) {
return <Table.Row error >
<Table.Cell textAlign='center' colSpan='5'>No results found.</Table.Cell>
</Table.Row>;
}
return this.state.list.map((probe: any, index: number) => (
<Table.Row key={index} onClick={this.handleSelect.bind(this, probe)}>
<Table.Cell >{probe.domain.name}</Table.Cell>
<Table.Cell>{index}</Table.Cell>
<Table.Cell negative={this.checkCellStatus(probe.metaProbeStatus)} textAlign={'center'}>{probe.metaProbeStatus.name}</Table.Cell>
<Table.Cell textAlign={'center'} >todo. {probe.targetCnt}</Table.Cell>
<Table.Cell textAlign={'center'} >todo. {probe.sensorCnt}</Table.Cell>
</Table.Row>
));
}
} }
export class ProbeFilter extends React.Component<any, any> { export class ProbeFilter extends React.Component<any, any> {
@ -167,29 +180,29 @@ export class ProbeFilter extends React.Component<any, any> {
}; };
} }
handleChange(e: any, data: any) { public handleChange(e: any, data: any): void {
this.setState({ this.setState({
status: data.value, status: data.value,
}); });
this.props.onFilter(data.value); this.props.onFilter(data.value);
} }
handleReset(e: any, data: any) { public handleReset(e: any, data: any): void {
this.setState({ this.setState({
status: null, status: null,
}); });
this.props.onFilter(null); this.props.onFilter(null);
} }
render() { public render(): JSX.Element {
//todo. getting MetaProbeStatus // todo. getting MetaProbeStatus
let metaProbeStatus = [ let metaProbeStatus = [
{ {
"id": "1", 'id': '1',
"name": "STARTED", 'name': 'STARTED',
}, },
{ {
"id": "2", 'id': '2',
"name": "STOPPED", 'name': 'STOPPED',
}, },
]; ];
return ( return (