root 10 months ago
parent
commit
45e713b03c
  1. 106
      src/views/Master/MasterRoles/DialogMenuRoles.js

106
src/views/Master/MasterRoles/DialogMenuRoles.js

@ -337,31 +337,104 @@ export default class DialogMenuRoles extends Component {
this.setState({ stateMenu: copyStateMenu })
}
handleChangeCheckboxRead = (checked, index) => {
handleChangeCheckboxRead = (checked, index, menuItem = null, menuIdxList = []) => {
let copyStateRead = [...this.state.stateRead];
copyStateRead[index] = checked;
let menu = this.state.menu;
let checkMenuParent = menu.map((state, index) => {
if (state.parent_id === menuItem.id) {
return state.id
} else {
return null
}
}).filter(index => index !== null);
let stateReadIdx = [];
menuIdxList.forEach((menu, index) => {
checkMenuParent.forEach((check, idx) => {
if (check === menu) {
stateReadIdx.push(index);
}
});
});
stateReadIdx.map((stateRead) => {
copyStateRead[stateRead] = checked
})
this.setState({ stateRead: copyStateRead })
}
handleChangeCheckboxCreate = (checked, index) => {
handleChangeCheckboxCreate = (checked, index, menuItem = null, menuIdxList = []) => {
let copyStateCreate = [...this.state.stateCreate];
copyStateCreate[index] = checked;
let menu = this.state.menu;
let checkMenuParent = menu.map((state, index) => {
if (state.parent_id === menuItem.id) {
return state.id
} else {
return null
}
}).filter(index => index !== null);
let stateCreateIdx = [];
menuIdxList.forEach((menu, index) => {
checkMenuParent.forEach((check, idx) => {
if (check === menu) {
stateCreateIdx.push(index);
}
});
});
stateCreateIdx.map((stateCreate) => {
copyStateCreate[stateCreate] = checked
})
this.setState({ stateCreate: copyStateCreate })
}
handleChangeCheckboxEdit = (checked, index) => {
handleChangeCheckboxEdit = (checked, index, menuItem = null, menuIdxList = []) => {
let copyStateEdit = [...this.state.stateUpdate];
copyStateEdit[index] = checked;
let menu = this.state.menu;
let checkMenuParent = menu.map((state, index) => {
if (state.parent_id === menuItem.id) {
return state.id
} else {
return null
}
}).filter(index => index !== null);
let stateEditIdx = [];
menuIdxList.forEach((menu, index) => {
checkMenuParent.forEach((check, idx) => {
if (check === menu) {
stateEditIdx.push(index);
}
});
});
stateEditIdx.map((stateEdit) => {
copyStateEdit[stateEdit] = checked
})
this.setState({ stateUpdate: copyStateEdit })
}
handleChangeCheckboxDelete = (checked, index) => {
handleChangeCheckboxDelete = (checked, index, menuItem = null, menuIdxList = []) => {
let copyStateDelete = [...this.state.stateDelete];
copyStateDelete[index] = checked;
let menu = this.state.menu;
let checkMenuParent = menu.map((state, index) => {
if (state.parent_id === menuItem.id) {
return state.id
} else {
return null
}
}).filter(index => index !== null);
let stateDeleteIdx = [];
menuIdxList.forEach((menu, index) => {
checkMenuParent.forEach((check, idx) => {
if (check === menu) {
stateDeleteIdx.push(index);
}
});
});
stateDeleteIdx.map((stateDelete) => {
copyStateDelete[stateDelete] = checked
})
this.setState({ stateDelete: copyStateDelete })
}
@ -419,7 +492,8 @@ export default class DialogMenuRoles extends Component {
renderForm = () => {
const { menu, stateRead, stateCreate, stateUpdate, stateDelete } = this.state;
let menuIdxList = []
let menuIdx = 0
const getChildren = (parentId) => {
return menu.filter(item => item.parent_id === parentId);
};
@ -429,24 +503,28 @@ export default class DialogMenuRoles extends Component {
const children = getChildren(parentId);
return children.map((menuItem, index) => {
const currentIndex = menuIdx; // Capture current index
menuIdxList[currentIndex] = menuItem.id;
menuIdx++
const paddingLeft = depth * 20;
const fontWeight = menuItem.parent_id === null ? 'bold' : 'normal';
return (
<React.Fragment key={index}>
<React.Fragment key={menuIdx-1}>
<tr >
<td style={{ paddingLeft: paddingLeft }}>{menuItem.name}</td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxRead(e.target.checked, index)} defaultChecked={stateRead[index]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxCreate(e.target.checked, index)} defaultChecked={stateCreate[index]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxEdit(e.target.checked, index)} defaultChecked={stateUpdate[index]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxDelete(e.target.checked, index)} defaultChecked={stateDelete[index]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxRead(e.target.checked, currentIndex, menuItem, menuIdxList)} defaultChecked={stateRead[currentIndex]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxCreate(e.target.checked, currentIndex, menuItem, menuIdxList)} defaultChecked={stateCreate[currentIndex]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxEdit(e.target.checked, currentIndex, menuItem, menuIdxList)} defaultChecked={stateUpdate[currentIndex]} /></td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckboxDelete(e.target.checked, currentIndex, menuItem, menuIdxList)} defaultChecked={stateDelete[currentIndex]} /></td>
</tr>
{renderMenu(menuItem.id, depth + 1)} {/* Recursively render children */}
</React.Fragment>
);
});
};
menuIdxList = []
menuIdx = 0
// Render top-level menu items (parents)
return (
<React.Fragment>

Loading…
Cancel
Save