fixed tree

This commit is contained in:
snoop 2017-07-26 15:04:35 +09:00
parent ebf6e465cc
commit 3a44072e53

View File

@ -8,7 +8,7 @@ import {
Label,
Accordion,
Icon,
List,
List, Button,
ListItemProps,
CheckboxProps,
} from 'semantic-ui-react';
@ -39,23 +39,25 @@ export interface SensorItemTreeState {
}
interface TreeItem {
metaSensorItemList: MetaSensorItem[];
metaSensorItemList: Array<MetaSensorItem>;
metaSensorItemType: MetaSensorItemType;
}
export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorItemTreeState> {
private itemMap: Map<number, TreeItem>;
private selectedItemMap: Map<number, Array<MetaSensorItem>>;
constructor(props: any, context: any) {
super(props, context);
this.itemMap = new Map;
this.selectedItemMap = new Map,
this.state = {
categoryState: new Map(),
itemState: new Map(),
};
this.state = {
categoryState: new Map(),
itemState: new Map(),
};
this.sortItemMap();
// fs.readFile('../../../../../dh.json', this.handlJSONFile);
@ -73,7 +75,7 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
item.metaSensorItemList = [];
item.metaSensorItemList.push(sensorItem);
item.metaSensorItemType = this.GetMetaSensorItemType(sensorItem.metaSensorItemType.id);
this.itemMap.set(sensorItem.id, item);
this.itemMap.set(sensorItem.metaSensorItemType.id, item);
}
});
}
@ -89,9 +91,7 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
{/*let newPortState: Map<number, boolean> = new Map(this.state.portState);*/ }
let newCategoryState: Map<number, boolean> = _.clone(this.state.categoryState);
newCategoryState[key] = !newCategoryState[key];
this.setState({ categoryState: newCategoryState });
}} />
@ -99,8 +99,15 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
<List.Header> <Checkbox label={data.metaSensorItemType.name} onChange={
(event: React.FormEvent<HTMLInputElement>, checkProps: CheckboxProps) => {
let newItemState: Map<number, Array<boolean>> = _.clone(this.state.itemState);
newItemState[key] = _.cloneDeep(this.state.itemState[key]);
if (newItemState[key] === undefined) {
newItemState[key] = new Array(data.metaSensorItemList.length).fill(false);
}
newItemState[key].fill(checkProps.checked);
if (checkProps.checked) {
this.selectedItemMap[key] = _.clone(data.metaSensorItemList);
} else {
this.selectedItemMap[key].length = 0;
}
this.setState({ itemState: newItemState });
}} /> </List.Header>
<List.Description>Category</List.Description>
@ -116,7 +123,7 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
public ViewSensorItem(metaSensorItemList: MetaSensorItem[], parentKey: number): JSX.Element[] {
let elems: JSX.Element[] = new Array();
if(this.state.itemState[parentKey] === undefined) {
if (this.state.itemState[parentKey] === undefined) {
this.state.itemState[parentKey] = new Array(metaSensorItemList.length).fill(false);
}
@ -133,7 +140,20 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
<List.Item >
<List.Icon name='file' />
<List.Content>
<List.Header> <Checkbox label={item.name} checked={this.state.itemState[parentKey][idx]} /></List.Header>
<List.Header> <Checkbox label={item.name} checked={this.state.itemState[parentKey][idx]} onChange={
(event: React.FormEvent<HTMLInputElement>, checkProps: CheckboxProps) => {
if(this.selectedItemMap[parentKey] === undefined) {
this.selectedItemMap[parentKey] = [];
}
if (checkProps.checked) {
this.selectedItemMap[parentKey].push(item);
} else {
let index: number = this.selectedItemMap[parentKey].indexOf(item);
if(index >= 0) {
this.selectedItemMap[parentKey].splice(index, 1);
}
}
}} /></List.Header>
<List.Description>Sensor Item</List.Description>
</List.Content>
</List.Item>
@ -150,6 +170,9 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
<List selection>
{this.ViewSensorItemType()}
</List>
<Button label='test' onClick={() => {
console.log(this.selectedItemMap);
}} />
</Container>
);
}