Commit 781f2df9 authored by EKSAD's avatar EKSAD

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into riri

parents 536cda47 1c29402a
...@@ -78,6 +78,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -78,6 +78,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
//Menu //Menu
const getMenu = () => api.get('menu/get_menu_hierarki') const getMenu = () => api.get('menu/get_menu_hierarki')
const getMenuByRole = () => api.get('menu/get_menu_hierarki_by_role')
//UNIT BISNIS //UNIT BISNIS
const getUnitBisnis = () => api.get('business_unit/get_all_business_unit') const getUnitBisnis = () => api.get('business_unit/get_all_business_unit')
...@@ -122,6 +123,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -122,6 +123,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const createReportItems = (body) => api.post('/item_report/create_item_report', body) const createReportItems = (body) => api.post('/item_report/create_item_report', body)
const checkUploadReportItems = (body) => api.post('/item_report/check_import', body) const checkUploadReportItems = (body) => api.post('/item_report/check_import', body)
const uploadReportItems = (body) => api.post('/item_report/import_item_report', body) const uploadReportItems = (body) => api.post('/item_report/import_item_report', body)
const getItemReportHierarki = () => api.get('item_report/get_item_report_hierarki')
//PARAMETER //PARAMETER
const getAllParameter = () => api.get('/setting/get_all_setting') const getAllParameter = () => api.get('/setting/get_all_setting')
...@@ -204,7 +206,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -204,7 +206,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
getPerusahaanActive, getPerusahaanActive,
getRoleActive, getRoleActive,
checkUploadParameter, checkUploadParameter,
uploadParameter uploadParameter,
getItemReportHierarki,
getMenuByRole
} }
} }
......
...@@ -126,13 +126,174 @@ export default function MiniDrawer() { ...@@ -126,13 +126,174 @@ export default function MiniDrawer() {
const [selectedSubIndex, setSelectSub] = React.useState([]); const [selectedSubIndex, setSelectSub] = React.useState([]);
const [userFullname, setUserFullname] = React.useState("") const [userFullname, setUserFullname] = React.useState("")
const [userEmail, setUserEmail] = React.useState("") const [userEmail, setUserEmail] = React.useState("")
const [data, setData] = React.useState({
array: [
{
img: Images.Home,
label: 'Home',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.budgetTahunan,
label: 'Master Budget & CAT',
path: 'budget-tahunan',
subItem: null,
collapse: false,
},
{
img: Images.laporanBulanan,
label: 'Monthly Report',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.rolling,
label: 'Rolling Outlook & CAT Revision',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.outlookperformance,
label: 'Outlook Performance Appraisal',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.operatingindicator,
label: 'Operating Indicator',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.manajemenDokumen,
label: 'Document Management',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.laporan,
label: 'Reports',
path: '',
subItem: [
{
img: 'beranda',
label: 'CAT Dashboard',
path: 'dashboard-cat',
},
{
img: 'beranda',
label: 'Summary of Triputra Group',
path: 'beranda',
},
{
img: '',
label: 'Sub Holding',
path: 'beranda',
}
],
collapse: false,
},
{
img: '',
label: 'Settings',
path: 'beranda',
subItem: null,
collapse: false,
},
{
img: Images.masterdata,
label: 'Master Data',
path: '',
subItem: [
{
img: '',
label: 'Business Unit',
path: 'unit-bisnis',
},
{
img: '',
label: 'Company',
path: 'perusahaan',
},
{
img: '',
label: 'Report Items',
path: 'report-items',
},
{
img: '',
label: 'Parameters',
path: 'parameter',
},
],
collapse: false,
},
{
img: Images.otorisasi,
label: 'Authorization',
path: '',
subItem: [
{
img: '',
label: 'User Role',
path: 'userrole',
},
{
img: '',
label: 'User',
path: 'user',
}
],
collapse: false,
},
{
img: Images.approvalmatrix,
label: 'Approval Matrix',
path: 'approval-matrix',
subItem: null,
collapse: false,
},
{
img: Images.otorisasi,
label: 'User Management',
path: '',
subItem: [
{
img: '',
label: 'Profile',
path: 'profile',
},
{
img: '',
label: 'Logout',
path: '',
},
],
collapse: false,
}
]
})
React.useEffect(() => { React.useEffect(() => {
if(userFullname == "" && userEmail == "") { if(userFullname == "" && userEmail == "") {
getUserData() getUserData()
getMenuHierarki()
} }
}) })
const getMenuHierarki = () => {
api.create().getMenuByRole().then((response) => {
console.log(response.data.data)
})
}
const getUserData = () => { const getUserData = () => {
let userId = localStorage.getItem(Constant.USER) let userId = localStorage.getItem(Constant.USER)
api.create().getDetailUser(userId).then((response) => { api.create().getDetailUser(userId).then((response) => {
...@@ -176,6 +337,13 @@ export default function MiniDrawer() { ...@@ -176,6 +337,13 @@ export default function MiniDrawer() {
const { height, width } = UseWindowDimensions(); const { height, width } = UseWindowDimensions();
function handleCollapse(item){
let arr = data.array
let index = arr.findIndex((val) => val.label === item.label)
arr[index].collapse = !arr[index].collapse
setData({...data, array: arr})
}
return ( return (
<div className={classes.root}> <div className={classes.root}>
<CssBaseline /> <CssBaseline />
...@@ -250,15 +418,15 @@ export default function MiniDrawer() { ...@@ -250,15 +418,15 @@ export default function MiniDrawer() {
</div> </div>
} }
<List> <List>
{ArraySide.map((item, index) => ( {data.array.map((item, index) => (
<div style={{ marginTop: index === 0 ? null : 5 }} > <div style={{ marginTop: index === 0 ? null : 5 }} >
{item.subItem != null ? {item.subItem != null ?
<div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10 }} onClick={() => selectedIndexs == null ? setSelectedIndexs(item.label) : setSelectedIndexs(null)}> <div style={{ justifyContent: 'space-between', flexDirection: 'row', display: 'flex', paddingLeft: 5, paddingRight: 10 }} onClick={() => {handleCollapse(item)}}>
<ListItem key={item.label}> <ListItem key={item.label}>
<ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon> <ListItemIcon style={{ minWidth: open ? 40 : 56 }}><img src={item.img} /></ListItemIcon>
<Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography> <Typography style={{ fontFamily: 'nunito', color: '#525355', fontSize: 14 }}>{item.label}</Typography>
</ListItem> </ListItem>
{item.subItem != null ? (item.label === selectedIndex ? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null} {item.subItem != null ? (item.collapse? <ExpandLess style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} /> : <ExpandMore style={{ color: "#525355", marginLeft: 50, alignSelf: 'center' }} />) : null}
</div> </div>
: :
item.label === 'Settings' ? item.label === 'Settings' ?
...@@ -280,7 +448,7 @@ export default function MiniDrawer() { ...@@ -280,7 +448,7 @@ export default function MiniDrawer() {
} }
{item.subItem != null && {item.subItem != null &&
<div> <div>
<Collapse in={item.label === selectedIndexs} timeout="auto" unmountOnExit> <Collapse in={item.collapse} timeout="auto" unmountOnExit>
<List component="div" disablePadding> <List component="div" disablePadding>
{item.subItem.map((sub, indexs) => { {item.subItem.map((sub, indexs) => {
return ( return (
......
...@@ -5,6 +5,7 @@ import MinimizeIcon from '@material-ui/icons/Minimize'; ...@@ -5,6 +5,7 @@ import MinimizeIcon from '@material-ui/icons/Minimize';
import AddIcon from '@material-ui/icons/Add'; import AddIcon from '@material-ui/icons/Add';
import RemoveIcon from '@material-ui/icons/Remove'; import RemoveIcon from '@material-ui/icons/Remove';
import Nestable from 'react-nestable'; import Nestable from 'react-nestable';
import api from '../../../api';
const useStyles = makeStyles((theme) => ({ const useStyles = makeStyles((theme) => ({
root: { root: {
...@@ -50,24 +51,24 @@ export default class VisualReportItems extends Component { ...@@ -50,24 +51,24 @@ export default class VisualReportItems extends Component {
this.state = { this.state = {
open: false, open: false,
items: [ items: [
{ id: 0, text: 'Accumulated Depreciation (negative value)', collapse: false, { id: 0, GG: 'Accumulated Depreciation (negative value)', collapse: false,
children: [ children: [
{ id: 3, text: 'Beginning Balance', collapse: false }, { id: 3, GG: 'Beginning Balance', collapse: false },
{ id: 4, text: 'Depreciation expense MTD (please fill in, if any)', collapse: false }, { id: 4, GG: 'Depreciation expense MTD (please fill in, if any)', collapse: false },
{ id: 5, text: 'Depreciation expense MTD (please fill in, if any)', collapse: false } { id: 5, GG: 'Depreciation expense MTD (please fill in, if any)', collapse: false }
] ]
},{ },{
id: 1, text: 'Control Gain/(Loss) on Fixed Assets', collapse: false id: 1, GG: 'Control Gain/(Loss) on Fixed Assets', collapse: false
},{ },{
id: 2, text: 'Gain/(Loss) on Fixed Assets', collapse: false, id: 2, GG: 'Gain/(Loss) on Fixed Assets', collapse: false,
children: [ children: [
{ id: 6, text: 'NBV', collapse: false, { id: 6, GG: 'NBV', collapse: false,
children : [ children : [
{ id: 8, text: 'Cost', collapse: false }, { id: 8, GG: 'Cost', collapse: false },
{ id: 9, text: 'Accm. Depreciation', collapse: false }, { id: 9, GG: 'Accm. Depreciation', collapse: false },
] ]
}, },
{ id: 7, text: 'Proceed from sale or disposal of Fixed Assets (please fill in, if any)', collapse: false }, { id: 7, GG: 'Proceed from sale or disposal of Fixed Assets (please fill in, if any)', collapse: false },
] ]
}, },
], ],
...@@ -78,6 +79,15 @@ export default class VisualReportItems extends Component { ...@@ -78,6 +79,15 @@ export default class VisualReportItems extends Component {
componentDidMount() { componentDidMount() {
console.log(this.props.height) console.log(this.props.height)
this.getItemHierarki()
}
getItemHierarki() {
api.create().getItemReportHierarki().then((response) => {
if (response.data.status == 'success') {
this.setState({items : response.data.data})
}
})
} }
handleCollapse(item) { handleCollapse(item) {
...@@ -114,11 +124,13 @@ export default class VisualReportItems extends Component { ...@@ -114,11 +124,13 @@ export default class VisualReportItems extends Component {
return ( return (
<div> <div>
{collapseIcon ? (this.state.arrayCollapse.includes(item.id)? <AddIcon/> : <RemoveIcon/>) : null} {collapseIcon ? (this.state.arrayCollapse.includes(item.id)? <AddIcon/> : <RemoveIcon/>) : null}
<button type="button" onClick={() => this.collapse(item.id)}>{item.text}</button> <button type="button" onClick={() => this.collapse(item.id)}>{item.report_name}</button>
</div> </div>
) )
}; };
render() { render() {
return ( return (
......
...@@ -8,6 +8,7 @@ import format from "date-fns/format"; ...@@ -8,6 +8,7 @@ import format from "date-fns/format";
import RemoveIcon from '@material-ui/icons/Remove'; import RemoveIcon from '@material-ui/icons/Remove';
import AddIcon from '@material-ui/icons/Add'; import AddIcon from '@material-ui/icons/Add';
import { DatePicker } from '@material-ui/pickers'; import { DatePicker } from '@material-ui/pickers';
import * as R from 'ramda'
const CustomCheckbox = withStyles({ const CustomCheckbox = withStyles({
root: { root: {
...@@ -108,13 +109,15 @@ export default class AddUser extends Component { ...@@ -108,13 +109,15 @@ export default class AddUser extends Component {
"end_date": this.state.endDate "end_date": this.state.endDate
} }
api.create().createUser(payload).then((response) => { api.create().createUser(payload).then((response) => {
console.log(response) // console.log(response)
if (String(response.data.status).toLocaleUpperCase === 'success') { // if (String(response.data.status).toLocaleUpperCase === 'Success' || String(response.data.status).toLocaleUpperCase === 'success') {
this.props.onClickClose() this.props.onClickClose()
this.props.refresh() this.props.refresh()
} else { // } else {
alert(response.data.message) // alert(response.data.message)
} // this.props.onClickClose()
// this.props.refresh()
// }
}) })
} }
...@@ -164,6 +167,90 @@ export default class AddUser extends Component { ...@@ -164,6 +167,90 @@ export default class AddUser extends Component {
this.setState({ company }) this.setState({ company })
} }
renderChildren = (item, pad) => {
let padding = null
if (pad !== undefined) {
padding = pad
} else {
padding = 20
}
return (
<ul>
{item.child.map((data, index) => {
return (
<li>
<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 }}>
{!R.isNil(data.child) && <span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}>
{data.collapse? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>}
<span>
<CustomCheckbox
checked={this.handleItemChecked(data)}
onChange={() => this.handleItemClick(data)}
/>
</span>
<Typography style={{ fontSize: 12 }}>{titleCase(data.company_name)}</Typography>
</div>
{!R.isNil(data.child) && this.renderChildren(data, padding + 20)}
</Collapse>
</li>
)
})}
</ul>
)
}
handleCollapse(item) {
let path = this.searchIt({child: this.state.listCompany}, item.company_id)
let listCompany = this.state.listCompany
let arrayPath = []
if (path.length > 1) {
arrayPath = path.split('-');
arrayPath = arrayPath.map((item) => {return item})
} else {
arrayPath.push(path)
}
let pathSelect = null
if (arrayPath.length == 1) {
pathSelect= listCompany[arrayPath[0]]
} else if (arrayPath.length == 2) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]]
} else if (arrayPath.length == 3) {
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) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]]
} else if (arrayPath.length == 6) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]]
} else if (arrayPath.length == 7) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]].child[arrayPath[6]]
}
pathSelect.collapse = !pathSelect.collapse
// console.log(pathSelect.collapse)
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">
...@@ -349,38 +436,23 @@ export default class AddUser extends Component { ...@@ -349,38 +436,23 @@ export default class AddUser extends Component {
{this.state.listCompany.map((item,index) => { {this.state.listCompany.map((item,index) => {
return( return(
<div> <div>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> <ul>
{item.childCompany.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}> <li>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
</span>} {item.child.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}>
<span> {item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
<CustomCheckbox </span>}
checked={this.handleItemChecked(item)} <span>
onChange={() => this.handleItemClick(item)} <CustomCheckbox
/> checked={this.handleItemChecked(item)}
</span> onChange={() => this.handleItemClick(item)}
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography> />
</div> </span>
{item.childCompany.length > 0 && item.childCompany.map((items,indexs) => { <Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography>
return ( </div>
<Collapse in={index === this.state.selectedIndex} timeout="auto" unmountOnExit> {!R.isNil(item.child) && this.renderChildren(item)}
<div style={{ paddingLeft: 60, display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> </li>
{/* {item.sub_menu.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}> </ul>
{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>
</Collapse>
)
})}
</div> </div>
) )
})} })}
......
...@@ -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={data.company_id === this.state.selectedIndex}> */} <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
...@@ -230,7 +229,7 @@ export default class EditUser extends Component { ...@@ -230,7 +229,7 @@ export default class EditUser extends Component {
<Typography style={{ fontSize: 12 }}>{titleCase(data.company_name)}</Typography> <Typography style={{ fontSize: 12 }}>{titleCase(data.company_name)}</Typography>
</div> </div>
{!R.isNil(data.child) && this.renderChildren(data, padding + 20)} {!R.isNil(data.child) && this.renderChildren(data, padding + 20)}
{/* </Collapse> */} </Collapse>
</li> </li>
) )
})} })}
...@@ -238,30 +237,56 @@ export default class EditUser extends Component { ...@@ -238,30 +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' }}> if (path.length > 1) {
{/* {item.sub_menu.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}> arrayPath = path.split('-');
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} arrayPath = arrayPath.map((item) => {return item})
</span>} */} } else {
{/* <RemoveIcon color={'action'} fontSize={'small'} /> */} arrayPath.push(path)
<span> }
<CustomCheckbox
checked={this.handleItemChecked(items)} let pathSelect = null
onChange={() => this.handleItemClick(items)} if (arrayPath.length == 1) {
/> pathSelect= listCompany[arrayPath[0]]
</span> } else if (arrayPath.length == 2) {
<Typography style={{ fontSize: 12 }}>{titleCase(items.company_name)}</Typography> pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]]
</div> } else if (arrayPath.length == 3) {
{!R.isNil(items.child) && this.renderChild(items, indexs)} pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]]
</div> } else if (arrayPath.length == 4) {
) pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]]
}) } else if (arrayPath.length == 5) {
) pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]]
} else if (arrayPath.length == 6) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]]
} else if (arrayPath.length == 7) {
pathSelect= listCompany[arrayPath[0]].child[arrayPath[1]].child[arrayPath[2]].child[arrayPath[3]].child[arrayPath[4]].child[arrayPath[5]].child[arrayPath[6]]
}
pathSelect.collapse = !pathSelect.collapse
// console.log(pathSelect.collapse)
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">
...@@ -451,8 +476,8 @@ export default class EditUser extends Component { ...@@ -451,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.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : 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
...@@ -465,19 +490,6 @@ export default class EditUser extends Component { ...@@ -465,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