Skip to content

T
Tia-dev
Commit 1c29402a authored by Dida Adams Arizona's avatar Dida Adams Arizona
Browse files
Options

Merge branch 'didam' into 'master' 

Didam

See merge request !103
parents 438eb1c7 40c36111
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 161 additions and 106 deletions
src/container/Otorisasi/User/AddUser.js
View file @ 1c29402a
This diff is collapsed.
src/container/Otorisasi/User/EditUser.js
View file @ 1c29402a
...@@ -183,7 +183,6 @@ export default class EditUser extends Component { ...@@ -183,7 +183,6 @@ export default class EditUser extends Component {
api.create().getPerusahaanHierarki().then((response) => { api.create().getPerusahaanHierarki().then((response) => {
if (response.data.status === 'success') { if (response.data.status === 'success') {
this.setState({ listCompany: response.data.data }) this.setState({ listCompany: response.data.data })
// console.log(response.data.data)
} }
}) })
} }
...@@ -216,10 +215,10 @@ export default class EditUser extends Component { ...@@ -216,10 +215,10 @@ export default class EditUser extends Component {
{item.child.map((data, index) => { {item.child.map((data, index) => {
return ( return (
<li> <li>
<Collapse timeout="auto" unmountOnExit in={item.collapse}> <Collapse key={index} timeout="auto" unmountOnExit in={item.collapse}>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.child) ? (padding + 20) : padding }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.child) ? (padding + 20) : padding }}>
{!R.isNil(data.child) && <span onClick={() => this.setState({ selectedIndex: data.company_id === this.state.selectedIndex ? 0 : data.company_id })} style={{ marginLeft: 7, marginRight: 2 }}> {!R.isNil(data.child) && <span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}>
{data.company_id === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {data.collapse? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} </span>}
<span> <span>
<CustomCheckbox <CustomCheckbox
...@@ -238,59 +237,56 @@ export default class EditUser extends Component { ...@@ -238,59 +237,56 @@ export default class EditUser extends Component {
) )
} }
renderChild(item, index) { handleCollapse(item) {
return ( let path = this.searchIt({child: this.state.listCompany}, item.company_id)
item.child.map((items, indexs, paddingLeft) => { let listCompany = this.state.listCompany
return ( let arrayPath = []
<div>
<div style={{ paddingLeft: R.isNil(items.child) ? 120 : 60, display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{/* {item.sub_menu.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} */}
{/* <RemoveIcon color={'action'} fontSize={'small'} /> */}
<span>
<CustomCheckbox
checked={this.handleItemChecked(items)}
onChange={() => this.handleItemClick(items)}
/>
</span>
<Typography style={{ fontSize: 12 }}>{titleCase(items.company_name)}</Typography>
</div>
{!R.isNil(items.child) && this.renderChild(items, indexs)}
</div>
)
})
)
}
handleCollapse(item, index) { if (path.length > 1) {
let result = this.findIndexNested(this.state.listCompany, index); arrayPath = path.split('-');
console.log("Found index " + index + " via these child indexes: " + result); arrayPath = arrayPath.map((item) => {return item})
} } else {
arrayPath.push(path)
}
// handleCollapseChildren(item,index) { let pathSelect = null
// let listCompany = this.state.listCompany[index] if (arrayPath.length == 1) {
// let index = listCompany.findIndex((val) => val.company_id === item.company_id) pathSelect= listCompany[arrayPath[0]]
// if (index == -1 ) { } else if (arrayPath.length == 2) {
// item.child.map((item,index) => this.handleCollapseChildren(item,index)) pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]]
// } else { } else if (arrayPath.length == 3) {
// listCompany[index].collapse = !listCompany[index].collapse pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]]
// } } else if (arrayPath.length == 4) {
// } pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]]
} else if (arrayPath.length == 5) {
findIndexNested(data, index) { pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]]
if (data.index === index) return []; } else if (arrayPath.length == 6) {
let result; pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]]
const i = (data.children || []).findIndex(child => { } else if (arrayPath.length == 7) {
return result = this.findIndexNested(child, index) pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]].child[arrayPath[6]]
}); }
if (result) return [i, ...result];
}
findByPath(data, path) { pathSelect.collapse = !pathSelect.collapse
for (let i of path) data = data.children[i]; // console.log(pathSelect.collapse)
return data this.setState({listCompany}, () => console.log(pathSelect))
} }
searchIt = (node, search, path = '', position = 0) => {
if (node.company_id && node.company_id === search) {return path !== '' ? `${path}-${position}` : position;}
if (!node.child) {return false}
const index = node.child.findIndex((x) => x.company_id && x.company_id === search);
if (index >= 0) {
return path !== '' ? `${path}-${index}` : index;
}
for (let i = 0; i < node.child.length; i++) {
const result = this.searchIt(node.child[i], search, path !== '' ? `${path}-${i}` : i , i);
if (result){
return result;
}
}
return false;
};
render() { render() {
return ( return (
<div className="test app-popup-show"> <div className="test app-popup-show">
...@@ -401,7 +397,7 @@ export default class EditUser extends Component { ...@@ -401,7 +397,7 @@ export default class EditUser extends Component {
/> />
</div> </div>
</div> </div>
<div className="column-2"> <div className="column-2">
<div className="margin-bottom-20px"> <div className="margin-bottom-20px">
<DatePicker <DatePicker
...@@ -480,8 +476,8 @@ export default class EditUser extends Component { ...@@ -480,8 +476,8 @@ export default class EditUser extends Component {
<ul> <ul>
<li> <li>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{item.child.length > 0 && <span onClick={() => this.handleCollapse(item, index)} style={{ marginLeft: 7, marginRight: 2 }}> {item.child.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} </span>}
<span> <span>
<CustomCheckbox <CustomCheckbox
...@@ -494,19 +490,6 @@ export default class EditUser extends Component { ...@@ -494,19 +490,6 @@ export default class EditUser extends Component {
{!R.isNil(item.child) && this.renderChildren(item)} {!R.isNil(item.child) && this.renderChildren(item)}
</li> </li>
</ul> </ul>
{/* <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{item.child.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>}
<span>
<CustomCheckbox
checked={this.handleItemChecked(item)}
onChange={() => this.handleItemClick(item)}
/>
</span>
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography>
</div> */}
{/* {this.renderChild(item,index, 0)} */}
</div> </div>
) )
})} })}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment