fixed tree
This commit is contained in:
parent
ebf6e465cc
commit
3a44072e53
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user