Merge remote-tracking branch 'origin/master'

This commit is contained in:
geek 2017-07-20 13:30:23 +09:00
commit 0569b7861e
8 changed files with 181 additions and 204 deletions

View File

@ -2,8 +2,17 @@ import * as React from 'react';
import { Icon, Step, Button, Table, Radio, Form, Container, Checkbox } from 'semantic-ui-react';
import { Grid, Image, Label, Segment, Dropdown, Input, List, Accordion, Loader } from 'semantic-ui-react';
import MetaCrawler from '@overflow/meta/api/model/MetaCrawler';
export class SensorConfiguration extends React.Component<any, any> {
export interface SensorConfigurationProps {
}
export interface SensorConfigurationState {
}
export class SensorConfiguration extends React.Component<SensorConfigurationProps, SensorConfigurationState> {
constructor(props: any, context: any) {
super(props, context);
@ -22,7 +31,15 @@ export class SensorConfiguration extends React.Component<any, any> {
}
export class ConfigStepper extends React.Component<any, any> {
export interface ConfigStepperProps {
steps: Array<JSX.Element>;
}
export interface ConfigStepperState {
currentStep: number;
}
export class ConfigStepper extends React.Component<ConfigStepperProps, ConfigStepperState> {
constructor(props: any, context: any) {
super(props, context);
@ -125,8 +142,17 @@ export class ConfigStepper extends React.Component<any, any> {
}
}
export interface CrawlerSelectorProps {
export class CrawlerSelector extends React.Component<any, any> {
}
export interface CrawlerSelectorState {
isInstalling: boolean;
selected: MetaCrawler;
}
export class CrawlerSelector extends React.Component<CrawlerSelectorProps, CrawlerSelectorState> {
private crawlers: object[];
@ -194,7 +220,7 @@ export class CrawlerSelector extends React.Component<any, any> {
this.setState({
isInstalling: false,
});
}, 1500);
}, 1500);
}
public render(): JSX.Element {
@ -226,7 +252,15 @@ export class CrawlerSelector extends React.Component<any, any> {
}
}
export class CrawlerAuthInputs extends React.Component<any, any> {
export interface CrawlerAuthInputsProps {
crawler?: MetaCrawler;
}
export interface CrawlerAuthInputsState {
isVerifying: boolean;
}
export class CrawlerAuthInputs extends React.Component<CrawlerAuthInputsProps, CrawlerAuthInputsState> {
private data: object[];
constructor(props: any, context: any) {
@ -328,9 +362,15 @@ export class CrawlerAuthInputs extends React.Component<any, any> {
}
}
export interface SensorItemSelectorProps {
}
export class SensorItemSelector extends React.Component<any, any> {
export interface SensorItemSelectorState {
}
export class SensorItemSelector extends React.Component<SensorItemSelectorProps, SensorItemSelectorState> {
constructor(props: any, context: any) {
super(props, context);
@ -365,12 +405,20 @@ export class SensorItemSelector extends React.Component<any, any> {
}
}
export class ETCSelector extends React.Component<any, any> {
export interface ETCSelectorProps {
}
export interface ETCSelectorState {
interval: string;
}
export class ETCSelector extends React.Component<ETCSelectorProps, ETCSelectorState> {
constructor(props: any, context: any) {
super(props, context);
this.state = {
interval: 5,
};
// this.state = {
// interval: 5,
// };
}
public handleIntervalChange(e: any, { value }: any): void {
this.setState({ interval: value });

View File

@ -2,8 +2,20 @@ import * as React from 'react';
import { Button, Table, Label, Segment, Header, Container } from 'semantic-ui-react';
import { DetailContainer } from './commons/DetailContainer';
import { SensorItems } from './SensorItems';
import Sensor from '@overflow/sensor/api/model/Sensor';
import Probe from '@overflow/probe/api/model/Probe';
export class SensorDetails extends React.Component<any, any> {
export interface SensorDetailsProps {
sensor?: Sensor;
probe?: Probe;
}
export interface SensorDetailsState {
}
export class SensorDetails extends React.Component<SensorDetailsProps, SensorDetailsState> {
constructor(props: any, context: any) {
super(props, context);
@ -27,7 +39,17 @@ export class SensorDetails extends React.Component<any, any> {
}
}
export class SensorBasicInfo extends React.Component<any, any> {
export interface SensorBasicInfoProps {
sensor?: Sensor;
probe?: Probe;
onBack?(): void;
}
export interface SensorBasicInfoState {
}
export class SensorBasicInfo extends React.Component<SensorBasicInfoProps, SensorBasicInfoState> {
constructor(props: any, context: any) {
super(props, context);
@ -48,7 +70,7 @@ export class SensorBasicInfo extends React.Component<any, any> {
public showStartStopBtn(): JSX.Element {
if (this.props.probe.metaProbeStatus.name === 'STARTED') {
if (this.props.probe.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} />;
@ -71,7 +93,7 @@ export class SensorBasicInfo extends React.Component<any, any> {
<Table.Cell>
<Header size='small'>Status</Header>
</Table.Cell>
<Table.Cell>{this.props.probe.metaProbeStatus.name}</Table.Cell>
<Table.Cell>{this.props.probe.status.name}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>

View File

@ -1,7 +1,18 @@
import * as React from 'react';
import { Table, Button, Header, Container } from 'semantic-ui-react';
export class SensorItems extends React.Component<any, any> {
import Sensor from '@overflow/sensor/api/model/Sensor';
export interface Props {
sensor?: Sensor;
}
export interface State {
}
export class SensorItems extends React.Component<Props, State> {
constructor(props: any, context: any) {
super(props, context);
@ -9,7 +20,7 @@ export class SensorItems extends React.Component<any, any> {
};
}
public componentWillMount():void {
public componentWillMount(): void {
super.componentWillMount();
}

View File

@ -2,16 +2,29 @@ import * as React from 'react';
import { Table, Button, Header, Container } from 'semantic-ui-react';
import { SensorDetails } from './SensorDetails';
export class Sensors extends React.Component<any, any> {
import Probe from '@overflow/probe/api/model/Probe';
import Sensor from '@overflow/sensor/api/model/Sensor';
export interface Props {
probe?: Probe;
}
export interface State {
isDetail: boolean;
selected: Sensor;
}
export class Sensors extends React.Component<Props, State> {
private data: any;
constructor(props: any, context: any) {
super(props, context);
this.state = {
selected: null,
isDetail: false, // temp
};
// this.state = {
// selected: null,
// isDetail: false, // temp
// };
}
public componentWillMount(): void {
@ -65,7 +78,7 @@ export class Sensors extends React.Component<any, any> {
];
}
public handleSelect(selectedSensor: object): void {
public handleSelect(selectedSensor: Sensor): void {
this.setState({
selected: selectedSensor,
isDetail: true,

View File

@ -9,20 +9,30 @@ const tableData = [
{ name: 'Ben', age: 70, gender: 'Male' },
];
export class TableExampleSortable extends React.Component<any, any> {
export interface Props {
}
export interface State {
column: string;
data: any;
direction: 'ascending' | 'descending';
}
export class TableExampleSortable extends React.Component<Props, State> {
constructor(props: any, context: any) {
super(props, context);
this.state = {
column: null,
data: tableData,
direction: null,
};
// this.state = {
// column: null,
// data: tableData,
// direction: null,
// };
}
public handleSort = (clickedColumn: any) => () => {
public handleSort = (clickedColumn: string) => () => {
const { column, data, direction } = this.state;
if (column !== clickedColumn) {
@ -48,10 +58,10 @@ export class TableExampleSortable extends React.Component<any, any> {
<Table sortable celled fixed>
<Table.Header>
<Table.Row>
<Table.HeaderCell sorted={column === 'name' ? direction : null} onClick={this.handleSort('name')}>
<Table.HeaderCell sorted={column === 'name' ? direction : 'ascending'} onClick={this.handleSort('name')}>
Name
</Table.HeaderCell>
<Table.HeaderCell sorted={column === 'age' ? direction : null} onClick={this.handleSort('age')}>
<Table.HeaderCell sorted={column === 'age' ? direction : 'ascending'} onClick={this.handleSort('age')}>
Age
</Table.HeaderCell>
<Table.HeaderCell sorted={column === 'gender' ? direction : null} onClick={this.handleSort('gender')}>

View File

@ -3,7 +3,18 @@ import { Button, Table, Header, Container } from 'semantic-ui-react';
import { Sensors } from './Sensors';
import { DetailContainer } from './commons/DetailContainer';
export class TargetDetails extends React.Component<any, any> {
import Probe from '@overflow/probe/api/model/Probe';
export interface TargetDetailsProps {
probe?: Probe;
target?: boolean;
}
export interface TargetDetailsState {
}
export class TargetDetails extends React.Component<TargetDetailsProps, TargetDetailsState> {
constructor(props: any, context: any) {
super(props, context);
@ -37,8 +48,15 @@ export class TargetDetails extends React.Component<any, any> {
}
export interface TargetBasicInfoProps {
probe?: Probe;
}
export class TargetBasicInfo extends React.Component<any, any> {
export interface TargetBasicInfoState {
}
export class TargetBasicInfo extends React.Component<TargetBasicInfoProps, TargetBasicInfoState> {
constructor(props: any, context: any) {
super(props, context);

View File

@ -2,13 +2,24 @@ import * as React from 'react';
import { Table, Button, Modal, Input, Header, Container, InputOnChangeData, ButtonProps } from 'semantic-ui-react';
import { TargetDetails } from './TargetDetails';
export class Targets extends React.Component<any, any> {
import Target from '@overflow/target/api/model/Target';
export interface TargetsProps {
}
export interface TargetsState {
selected: boolean;
openAddTarget: boolean;
}
export class Targets extends React.Component<TargetsProps, TargetsState> {
constructor(props: any, context: any) {
super(props, context);
this.state = {
openAddTarget: false,
};
// this.state = {
// openAddTarget: false,
// };
}
public handleAddTarget(event: React.MouseEvent<HTMLButtonElement>, data: ButtonProps): void {
@ -55,8 +66,16 @@ export class Targets extends React.Component<any, any> {
}
}
export interface TargetTableProps {
export class TargetTable extends React.Component<any, any> {
}
export interface TargetTableState {
list: Array<Target>;
selected: object;
}
export class TargetTable extends React.Component<TargetTableProps, TargetTableState> {
private data: any;
constructor(props: any, context: any) {
@ -102,10 +121,10 @@ export class TargetTable extends React.Component<any, any> {
</Table.Header>
<Table.Body>
{this.state.list.map((target: any, index: number) => (
{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.metaInfraType.name}</Table.Cell>
<Table.Cell textAlign={'center'}>{target.infra.type.name}</Table.Cell>
<Table.Cell>todo</Table.Cell>
<Table.Cell>todo</Table.Cell>
</Table.Row>

View File

@ -1,164 +0,0 @@
import *as React from 'react';
import {
Dropdown, Icon, Menu, Label,
Sidebar, Segment, Button, Image, Header,
} from 'semantic-ui-react';
import { Link, Route } from 'react-router-dom';
import * as History from 'history';
const options = [
{ key: 'angular', text: 'Angular', value: 'angular' },
{ key: 'css', text: 'CSS', value: 'css' },
{ key: 'design', text: 'Graphic Design', value: 'design' },
{ key: 'ember', text: 'Ember', value: 'ember' },
{ key: 'html', text: 'HTML', value: 'html' },
{ key: 'ia', text: 'Information Architecture', value: 'ia' },
{ key: 'javascript', text: 'Javascript', value: 'javascript' },
{ key: 'mech', text: 'Mechanical Engineering', value: 'mech' },
{ key: 'meteor', text: 'Meteor', value: 'meteor' },
{ key: 'node', text: 'NodeJS', value: 'node' },
{ key: 'plumbing', text: 'Plumbing', value: 'plumbing' },
{ key: 'python', text: 'Python', value: 'python' },
{ key: 'rails', text: 'Rails', value: 'rails' },
{ key: 'react', text: 'React', value: 'react' },
{ key: 'repair', text: 'Kitchen Repair', value: 'repair' },
{ key: 'ruby', text: 'Ruby', value: 'ruby' },
{ key: 'ui', text: 'UI Design', value: 'ui' },
{ key: 'ux', text: 'User Experience', value: 'ux' },
];
export class TopBar extends React.Component<any, any> {
constructor(props: any, context: any) {
super(props, context);
this.state = {
notification_visible: false,
};
}
public render(): JSX.Element {
{/*<h1>React Redux sample</h1>
<li><Link to='/test' >TopBar</Link></li>
<li><Link to='/test2' >Signup</Link></li>
<li><Link to='/test3' >SignIn</Link></li>
<li><Link to='/test4' >PWChange</Link></li>
<li><Link to='/test5' >ProbeDown</Link></li>
<li><Link to='/test6' >DiscoveryDetails</Link></li>
<li><Link to='/test14' >Insanity</Link></li>*/}
return (
<div>
<Menu inverted borderless size='tiny'>
<Menu.Item> overFlow </Menu.Item>
<Menu.Item href='/' > Home </Menu.Item>
<Dropdown text='Monitoring' pointing className='link item'>
<Dropdown.Menu>
<Dropdown.Header icon='angle right' content='Probe' />
<Dropdown.Divider />
<Dropdown.Item href='#/test14'> Probe List </Dropdown.Item>
<Dropdown.Item href='#/test14'> Noauth Probes </Dropdown.Item>
<Dropdown.Item href='#/test14'> Download </Dropdown.Item>
<Dropdown.Divider />
<Dropdown.Item href='#/test21'>Sensors</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<Dropdown text='Infrastructure' pointing className='link item'>
<Dropdown.Menu>
<Dropdown.Item> Maps </Dropdown.Item>
<Dropdown.Item>Targets</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<Menu.Item link> Dashboard </Menu.Item>
<Menu.Item link> Metrics </Menu.Item>
<Menu.Item link> Alert </Menu.Item>
<Menu.Item link> History </Menu.Item>
<Dropdown text='Custom' pointing className='link item'>
<Dropdown.Menu>
<Dropdown.Item href='#/test2'> SignUp </Dropdown.Item>
<Dropdown.Item href='#/test3'>SignIn</Dropdown.Item>
<Dropdown.Item href='#/test4'> PWChange </Dropdown.Item>
<Dropdown.Item href='#/test5'>ProbeDown</Dropdown.Item>
<Dropdown.Item href='#/test14'> Insanity </Dropdown.Item>
<Dropdown.Item href='#/test6'>DiscoveryDetails</Dropdown.Item>
<Dropdown.Item href='#/test7'>Tree</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<Menu.Item position='right' link>
<Icon name='setting' size='large' />
</Menu.Item>
<Menu.Item onClick={() => {
this.props.onSidebar();
}}>
<Label color='teal' horizontal>22</Label>
</Menu.Item>
<Menu.Item link>
<Dropdown icon='user' className='ui pointing dropdown top right'>
<Dropdown.Menu >
<Dropdown.Item text='Log out' />
<Dropdown.Divider />
<Dropdown.Item text='Settings' />
<Dropdown.Item text='- Profile' />
<Dropdown.Item text='- Preferences' />
<Dropdown.Item text='- Change Password' />
<Dropdown.Divider />
<Dropdown.Item text='Help' />
</Dropdown.Menu>
</Dropdown>
</Menu.Item>
</Menu>
{/*<Sidebar.Pushable as={Segment} >
<Sidebar
as={Menu}
animation='overlay'
width='thin'
direction='right'
visible={this.state.notification_visible}
icon='labeled'
vertical
inverted
>
<Menu.Item name='home'>
<Icon name='home' />
Home
</Menu.Item>
<Menu.Item name='gamepad'>
<Icon name='gamepad' />
Games
</Menu.Item>
<Menu.Item name='camera'>
<Icon name='camera' />
Channels
</Menu.Item>
</Sidebar>
<Sidebar.Pusher >
<Segment basic >
</Segment>
</Sidebar.Pusher>
</Sidebar.Pushable>*/}
</div>
);
}
}