PHP CODE AND BOOTSTRAP : 
<div class="col-md-8 my-auto">
   <div class="container">
      <div class="row my-2 ">
         <div class="col-md-12  px-3 py-3 border  rounded  border">
            <div class="form-check my-auto">
               <input type="checkbox" class="form-check-input" id="checkPermissionAll" value="1">
               <label class="form-check-label font-weight-bold" for="checkPermissionAll"> সব সিলেক্ট করুন </label>
            </div>
         </div>
      </div>
   </div>
   <div class="container check-box-all">
      <?php
       foreach ($module_permissions as $module_permission){
          if(count($module_permission->permissions) > 0){
      ?>
      <div class="row my-2">
         <div class="col-md-5 px-3 py-3 border  rounded-left border-right-0  border">
            <div class="form-check h6 my-auto">
               <input class="form-check-input " type="checkbox"

                     value="<?=$module_permission->id?>"

                     id="module_<?=$module_permission->id?>"
                     onclick="checkPermissionByGroup('role-<?=$module_permission->id?>-management-checkbox', this)"
               >
               <label class="form-check-label font-weight-bold" for="module_<?=$module_permission->id?>">
                   <?= $module_permission->bn_name  ?>
               </label>
            </div>
         </div>
         <div class="col-md-7 border role-<?=$module_permission->id?>-management-checkbox p-2 border rounded-right">
            <?php
               foreach ($module_permission->permissions as $permission){
            ?>
            <div class="form-check h6">
               <input class="form-check-input" type="checkbox" name="permission_id[]"
                     onclick="singleChecked('role-<?=$module_permission->id?>-management-checkbox', 'module_<?=$module_permission->id?>')"
                     value="<?= $permission->id?>" id="permission_<?=$permission->id?>">
               <label class="form-check-label" for="permission_<?=$permission->id?>">
                   <?php echo $permission->bn_name?>
               </label>
            </div>
            <?php
               }
            ?>
         </div>
      </div>
      <?php
          }
       }
      ?>
   </div>

</div>

jQuery Code.


function checkPermissionByGroup(className, checkThis){
   const groupIdName = $("#"+checkThis.id);
   const classCheckBox = $('.'+className+' input');
   if(groupIdName.is(':checked')){
      classCheckBox.prop('checked', true);
      checkedChecker()
   }else{
      classCheckBox.prop('checked', false);
      checkedChecker()
   }
}
function singleChecked(className, module) {
   const classCheckBox = $('.'+className+' input');
   const groupIdName = $("#"+module);
   const ids =[] ;
   Object.entries(classCheckBox).forEach((data,index)=>{
        if (data[1].id){
            id = data[1].id;
            id = id.toString();
            if($('#'+id).is(':checked')){
             ids.push('checked')
            }
        }
   })
   if (ids.length>0){
      groupIdName.prop('checked', true);
   }else {
      groupIdName.prop('checked', false);
   }
   checkedChecker()
}


$("#checkPermissionAll").click(function(){
   if($(this).is(':checked')){
      $('input[type=checkbox]').prop('checked', true);

   }else{
      $('input[type=checkbox]').prop('checked', false);

   }
   checkedChecker()
});
const  checkedChecker  = ()=>{
   const ids =[] ;
   Object.entries($('.check-box-all input')).forEach((data,index)=>{
      if (data[1].id){
         id = data[1].id;
         id = id.toString();
         if($('#'+id).is(':checked')){
            ids.push('checked')
         }
      }
   })
   if (ids.length > 20){
      $("#checkPermissionAll").prop('checked', true);
   }else {
      $("#checkPermissionAll").prop('checked', false);
   }
}