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

added leftmenu sensors

Browse Source
This commit is contained in:
snoop 2017-07-26 11:55:05 +09:00
parent 4497f31f99
commit c827892a86
2 changed files with 24 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/ts/@overflow/app/views/layout/LeftMenu.tsx
View File

@ -60,7 +60,7 @@ class LeftMenu extends React.Component<Props, State> {
<Menu.Item onClick={(e) => this.props.onChangeUrl('/probe_setup')} style={{ 'marginLeft': '30px' }}>
Probe Setup
</Menu.Item>
<Menu.Item href='#/' style={{ 'marginLeft': '30px' }}>
<Menu.Item onClick={(e) => this.props.onChangeUrl('/sensors')} style={{ 'marginLeft': '30px' }}>
Sensors
</Menu.Item>
</Menu.Menu>

34
src/ts/@overflow/meta/react/components/SensorItemTree.tsx
View File

@ -1,4 +1,5 @@
import * as React from 'react';
import * as _ from 'lodash';
// import update from 'immutability-helper';
import { Checkbox, Container, Label, Accordion, Icon, List, ListItemProps } from 'semantic-ui-react';
@ -24,7 +25,8 @@ export type SensorItemTreeProps = SensorItemTreeStateProps & SensorItemTreeDispa
export interface SensorItemTreeState {
portState: Map<number, boolean>;
categoryState: Map<number, boolean>;
itemState: Map<number, boolean[]>;
}
interface TreeItem {
@ -42,7 +44,8 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
this.itemMap = new Map;
this.state = {
portState: new Map(),
categoryState: new Map(),
itemState: new Map(),
};
this.sortItemMap();
@ -72,17 +75,18 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
// this.state.portState[key] = false;
elems.push(
<List.Item key={key} >
<List.Icon name={this.state.portState[key] ? 'chevron up' : 'chevron down'} onClick={() => {
<List.Icon name={this.state.categoryState[key] ? 'chevron up' : 'chevron down'} onClick={() => {
let newPortState: Map<number, boolean> = new Map(this.state.portState);
newPortState[key] = true;
this.setState({ portState: newPortState });
{/*let newPortState: Map<number, boolean> = new Map(this.state.portState);*/ }
let newCategoryState: Map<number, boolean> = _.cloneDeep(this.state.categoryState);
newCategoryState[key] = !newCategoryState[key];
this.setState({ categoryState: newCategoryState });
}} />
<List.Content>
<List.Header> <Checkbox label={data.metaSensorItemType.name} /> </List.Header>
<List.Description>Category</List.Description>
{this.state.portState[key] ? this.ViewSensorItem(data.metaSensorItemList) : ''}
{this.state.categoryState[key] ? this.ViewSensorItem(data.metaSensorItemList, key) : ''}
</List.Content>
</List.Item>,
);
@ -91,15 +95,23 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
return elems;
}
public ViewSensorItem(metaSensorItemList: MetaSensorItem[]): JSX.Element[] {
public ViewSensorItem(metaSensorItemList: MetaSensorItem[], parentKey: number): JSX.Element[] {
let elems: JSX.Element[] = new Array();
metaSensorItemList.map((item: MetaSensorItem, idx: number) => {
let checkList: boolean[] = this.state.itemState[parentKey];
elems.push(
<List.List key={idx * 1000}>
<List.Item>
<List.List key={String(parentKey) + String(idx)} onClick={() => {
{/*let newPortState: Map<number, boolean> = new Map(this.state.portState);*/ }
let newItemState: Map<number, boolean[]> = _.cloneDeep(this.state.itemState[parentKey]);
newItemState[idx] = !newItemState[idx];
this.setState({ itemState: newItemState });
}}>
<List.Item >
<List.Icon name='file' />
<List.Content>
<List.Header> <Checkbox label={item.name} /></List.Header>
<List.Header> <Checkbox label={item.name} checked={checkList[idx]} /></List.Header>
<List.Description>Sensor Item</List.Description>
</List.Content>
</List.Item>