Commits

Endy Muhardin  committed 479b2ed

implement checkbox behavior untuk tabel permission

  • Participants
  • Parent commits b250975

Comments (0)

Files changed (2)

File belajar-restful-web/src/main/webapp/js/aplikasi-controller.js

             if(x.id == null){
                 return; 
             }
-            $scope.currentConfig = ApplicationConfigService.get({configId: x.id});
+            $scope.currentConfig = ApplicationConfigService.get({
+                configId: x.id
+                });
         };
         $scope.baru = function(){
             $scope.currentConfig = null;
             if(x.id == null){
                 return; 
             }
-            $scope.currentMenu = SystemMenuService.get({id: x.id});
+            $scope.currentMenu = SystemMenuService.get({
+                id: x.id
+                });
         };
         $scope.baru = function(){
             $scope.currentMenu = null;
             if(x.id == null){
                 return; 
             }
-            $scope.currentPermission = PermissionService.get({id: x.id});
+            $scope.currentPermission = PermissionService.get({
+                id: x.id
+                });
         };
         $scope.baru = function(){
             $scope.currentPermission = null;
     }])
     .controller('RoleController', ['$scope', 'RoleService', function($scope, RoleService){
         $scope.roles = RoleService.query();
-        $scope.unselectedPermission = null;
-        $scope.unselectedMenu = null;
+        
+        $scope.unselectedPermission = [];
+        $scope.unselectedMenu = [];
+        
+        $scope.selectedPermission = [];
+        
         $scope.edit = function(x){
             if(x.id == null){
                 return; 
             }
-            $scope.currentRole = RoleService.get({id: x.id});
+            $scope.currentRole = RoleService.get({
+                id: x.id
+                });
             RoleService.unselectedPermission(x).success(function(data){
                 $scope.unselectedPermission = data;
             });
                 $scope.roles = RoleService.query();
             });
         }
+        
+        $scope.selectAllPermission = function($event){
+            if($event.target.checked){
+                for ( var i = 0; i < $scope.unselectedPermission.length; i++) {
+                    var p = $scope.unselectedPermission[i];
+                    if($scope.selectedPermission.indexOf(p.id) < 0){
+                        $scope.selectedPermission.push(p.id);
+                    }
+                }
+            } else {
+                $scope.selectedPermission = [];
+            }
+        }
+        
+        $scope.updateSelectedPermission = function($event, id){
+            var checkbox = $event.target;
+            if(checkbox.checked  && $scope.selectedPermission.indexOf(id) < 0){
+                $scope.selectedPermission.push(id);
+            } else {
+                $scope.selectedPermission.splice($scope.selectedPermission.indexOf(id), 1);
+            }
+        }
+        
+        $scope.isPermissionSelected = function(id){
+            return $scope.selectedPermission.indexOf(id) >= 0;
+        }
+
+        $scope.isAllPermissionSelected = function(){
+            return $scope.unselectedPermission.length === $scope.selectedPermission.length;
+        }
+        
+        $scope.saveSelectedPermission = function(){
+            console.log($scope.selectedPermission);
+            $scope.showPermissionDialog = false;
+        }
+        
+        $scope.cancelSelectedPermission = function(){
+            $scope.selectedPermission = [];
+            console.log($scope.selectedPermission);
+            $scope.showPermissionDialog = false;
+        }
     }])
     .controller('UserController', ['$scope', 'UserService', 'RoleService', function($scope, UserService, RoleService){
         $scope.users = UserService.query();
             if(x.id == null){
                 return; 
             }
-            $scope.currentUser = UserService.get({id: x.id});
+            $scope.currentUser = UserService.get({
+                id: x.id
+                });
         };
         $scope.baru = function(){
             $scope.currentUser = null;

File belajar-restful-web/src/main/webapp/pages/system/role.html

         <table class="table table-striped" ng-show="unselectedPermission">
             <thead>
                 <tr>
-                    <th>Pilih</th>
+                    <th>
+                        <input type="checkbox"
+                               ng-checked="isAllPermissionSelected()"
+                               ng-click="selectAllPermission($event)">
+                    </th>
                     <th>Nama</th>
                     <th>Nilai</th>
                 </tr>
             <tbody>
                 <tr ng-repeat="p in unselectedPermission">
                     <td>
-                        <input type="checkbox" value="{{p.id}}">
+                        <input type="checkbox" 
+                               ng-checked="isPermissionSelected(p.id)" 
+                               ng-click="updateSelectedPermission($event, p.id)">
                     </td>
                     <td>{{p.label}}</td>
                     <td>{{p.value}}</td>
         </table>
     </div>
     <div class="modal-footer">
-        <a class="btn" ng-click="showPermissionDialog=false">Batal</a>
-        <a class="btn btn-primary">Tambah Permission</a>
+        <a class="btn" ng-click="cancelSelectedPermission()">Batal</a>
+        <a class="btn btn-primary" ng-click="saveSelectedPermission()">Tambah Permission</a>
     </div>
 </div>
 <div ui-modal class="fade" ng-model="showMenuDialog" id="dialogMenu">
         <table class="table table-striped" ng-show="unselectedMenu">
             <thead>
                 <tr>
-                    <th>Pilih</th>
+                    <th><input type="checkbox"></th>
                     <th>Nama</th>
                     <th>Action</th>
                 </tr>