ecomp-sdk-app/src/main/webapp/WEB-INF/fusion/jsp/role.jsp

   1 <%--
   2   ================================================================================
   3   eCOMP Portal SDK
   4   ================================================================================
   5   Copyright (C) 2017 AT&T Intellectual Property
   6   ================================================================================
   7   Licensed under the Apache License, Version 2.0 (the "License");
   8   you may not use this file except in compliance with the License.
   9   You may obtain a copy of the License at
  10
  11        http://www.apache.org/licenses/LICENSE-2.0
  12
  13   Unless required by applicable law or agreed to in writing, software
  14   distributed under the License is distributed on an "AS IS" BASIS,
  15   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16   See the License for the specific language governing permissions and
  17   limitations under the License.
  18   ================================================================================
  19   --%>
  20 <%@ taglib prefix="c"      uri="http://java.sun.com/jsp/jstl/core" %>
  21 <%@ taglib prefix="fmt"    uri="http://java.sun.com/jsp/jstl/fmt" %>
  22 <%@ taglib prefix="fn"     uri="http://java.sun.com/jsp/jstl/functions" %>
  23
  24 <%@ include file="/WEB-INF/fusion/jsp/popup_modal.html" %>
  25 <%@ include file="/WEB-INF/fusion/jsp/popup_modal_rolefunction.html" %>
  26 <%@ include file="/WEB-INF/fusion/jsp/popup_modal_role.html" %>
  27 <style type="text/css">
  28     .bc-style{
  29         margin: 20px;
  30         align: left;
  31     }
  32 </style>
  33 <div class="bc-style">
  34     <ul class="breadcrumb" >
  35         <li><a href="welcome">Home</a></li>
  36         <li><a href="role_list">Roles</a></li>
  37         <li class="active">Role</li>
  38     </ul>
  39 </div>
  40 <div class="pageTitle">
  41 <h3>
  42         <c:choose>
  43                 <c:when test="${!empty param.role_id}">
  44                         <h1 class="heading1" style="margin-top:20px;">Role Edit</h1>
  45                 </c:when>
  46                 <c:otherwise>
  47                         <h1 class="heading1" style="margin-top:20px;">Role Create</h1>
  48                 </c:otherwise>
  49         </c:choose>
  50         </h3>
  51 </div>
  52
  53 <div ng-controller="roleController" >
  54
  55         <br>
  56      Please edit the role details below:&nbsp;<br>
  57
  58         <div class="fn-ebz-container" >
  59                 <label class="fn-ebz-text-label"><sup><b>*</b></sup>Name:</label><BR>
  60                 <input type="text" class="fn-ebz-text" ng-model="role.name"
  61                         maxlength="30" />
  62         </div>
  63
  64         <div class="fn-ebz-container" >
  65                 <label class="fn-ebz-text-label">Priority:</label><BR>
  66                 <input type="text" class="fn-ebz-text" ng-model="role.priority"
  67                         maxlength="30" />
  68         </div>
  69
  70         <div align="left" >
  71                 <button type="submit" ng-click="saveRole();" att-button
  72                         btn-type="primary" size="small">Save</button>
  73         </div>
  74
  75         <br>
  76         <div class="pageTitle">
  77                 <label>Role Functions</label>
  78                 <a ng-click="addNewRoleFunctionModalPopup();" class="icon-add" size="small"></a>
  79         </div>
  80
  81         <table table-data="role.roleFunctions" att-table >
  82              <thead att-table-row type="header">
  83                 <tr>
  84                         <th att-table-header sortable="false" align="left"  width="90%">Name</th>
  85                         <th att-table-header sortable="false"  width="10%">Remove?</th>
  86                 </tr>
  87                  </thead>
  88                  <tbody att-table-row type="body" row-repeat="roleFunction in role.roleFunctions" style="max-height: 980px;" ><!-- background colors will alternate not properly with multiple tbody-->
  89                   <tr>
  90                     <td att-table-body width="90%" >{{ roleFunction.name }}</td>
  91                     <td att-table-body width="10%">
  92                         <div ng-click="removeRoleFunction(roleFunction);" style="font-size:20px;"><a href="javascript:void(0)" class="icon-trash"></a></div>
  93                      </td>
  94                   </tr>
  95                  </tbody>
  96         </table>
  97         <a href="role_function_list.htm">Manage Role Functions</a><br><br>
  98
  99         <div class="pageTitle">
 100                 <label>Child Roles</label>
 101                 <a ng-click="addNewChildRoleModalPopup();" class="icon-add" size="small"></a>
 102         </div>
 103
 104         <table table-data="role.childRoles" att-table >
 105              <thead att-table-row type="header">
 106                 <tr>
 107                         <th att-table-header sortable="false" align="left"  width="90%">Name</th>
 108                         <th att-table-header sortable="false"  width="10%">Remove?</th>
 109                 </tr>
 110                  </thead>
 111                  <tbody att-table-row type="body" row-repeat="role in role.childRoles" style="max-height: 980px;" >
 112                   <tr>
 113                     <td att-table-body width="90%" >{{ role.name }}</td>
 114                     <td att-table-body width="10%">
 115                         <div ng-click="removeChildRole(role);" style="font-size:20px;"><a href="javascript:void(0)" class="icon-trash"></a></div>
 116                      </td>
 117                   </tr>
 118                  </tbody>
 119         </table>
 120
 121         <div id="dialogChildRole" title="Select Child Roles">
 122           <table table-data="availableRoles" att-table>
 123                 <thead att-table-row type="header">
 124                         <tr>
 125                                 <th att-table-header sortable="false" width="10%"> </th>
 126                                 <th att-table-header sortable="false" width="90%">Role</th>
 127                         </tr>
 128                         </thead>
 129                         <tbody att-table-row type="body" row-repeat="availableRole in availableRoles" style="max-height: 980px;" ><!-- background colors will alternate not properly with multiple tbody-->
 130                         <tr>
 131                         <td att-table-body width="10%">
 132                                 <div ng-click="toggleChildRole(availableRole.selected,availableRole);">
 133                         <input type="checkbox" ng-model="availableRole.selected" att-toggle-main>
 134                         </div>
 135                     </td>
 136                     <td att-table-body width="90%">{{ availableRole.name }}</td>
 137
 138                   </tr>
 139                   </tbody>
 140                 </table>
 141         </div>
 142 </div>
 143
 144
 145
 146 <script>
 147 app.controller('roleController', function ($scope, modalService, $modal){
 148         $scope.role=${role};
 149         console.log($scope.role.roleFunctions);
 150
 151         $( "#dialogRoleFunction" ).hide();
 152         $( "#dialogChildRole" ).hide();
 153
 154         $scope.ociavailableRoleFunctions=${availableRoleFunctions};
 155
 156         $scope.availableRoleFunctions = [];
 157         if($scope.ociavailableRoleFunctions)
 158                 $.each($scope.ociavailableRoleFunctions, function(i, a){
 159                         var availableRoleFunction = a;
 160                         availableRoleFunction.selected = false;
 161                     $.each($scope.role.roleFunctions, function(j, b){
 162                         if(a.code === b.code) {
 163                                 availableRoleFunction.selected = true;
 164                         }
 165                     });
 166                     $scope.availableRoleFunctions.push(availableRoleFunction);
 167                 });
 168                 ;
 169
 170                 $scope.saveRole = function() {
 171                           var uuu = "role/saveRole.htm?role_id=${param.role_id}";
 172                           var postData={role: $scope.role, childRoles: $scope.role.childRoles, roleFunctions : $scope.role.roleFunctions};
 173                           $.ajax({
 174                                  type : 'POST',
 175                                  url : uuu,
 176                                  dataType: 'json',
 177                                  contentType: 'application/json',
 178                                  data: JSON.stringify(postData),
 179                                  success : function(data){
 180                                          modalService.showSuccess("Success","Update Successful.");
 181                                  },
 182                                  error : function(data){
 183                                          console.log(data);
 184                                          modalService.showFailure("Fail","Error while saving.");
 185                                  }
 186                           });
 187                         };
 188
 189                 $scope.addNewRoleFunctionModalPopup = function() {
 190                         var modalInstance = $modal.open({
 191                             templateUrl: 'role_functions_popup.html',
 192                             controller: 'rolepopupController',
 193                             backdrop: 'static',
 194                             resolve: {
 195                                 role: function () {
 196                                   return $scope.role;
 197                                 }
 198                               }
 199                           });
 200                         modalInstance.result.then(function(response){
 201                     console.log('response', response);
 202                     $scope.role=response.role;
 203                 });
 204                 };
 205
 206                 $scope.addNewChildRoleModalPopup = function() {
 207                         var modalInstance = $modal.open({
 208                             templateUrl: 'child_roles_popup.html',
 209                             controller: 'rolepopupController',
 210                             backdrop: 'static',
 211                             resolve: {
 212                                 role: function () {
 213                                   return $scope.role;
 214                                 }
 215                               }
 216                           });
 217                         modalInstance.result.then(function(response){
 218                     console.log('response', response);
 219                     $scope.role=response.role;
 220                 });
 221                 };
 222
 223
 224
 225                 $scope.removeRoleFunction = function(roleFunction) {
 226                         modalService.popupConfirmWin("Confirm","You are about to remove the role function "+roleFunction.name+" from the role for "+$scope.role.name+". Do you want to continue?",
 227                                 function(){
 228                                           var uuu = "role/removeRoleFunction.htm?role_id=${param.role_id}";
 229                                                   var postData={roleFunction:roleFunction};
 230                                                   $.ajax({
 231                                                          type : 'POST',
 232                                                          url : uuu,
 233                                                          dataType: 'json',
 234                                                          contentType: 'application/json',
 235                                                          data: JSON.stringify(postData),
 236                                                          success : function(data){
 237                                                                 $scope.$apply(function(){
 238                                                                         $scope.role=data.role;
 239                                                                         $.each($scope.availableRoleFunctions, function(k, c){
 240                                                                         if(c.code === roleFunction.code) {
 241                                                                                 c.selected = false;
 242                                                                         }
 243                                                                     });
 244                                                                 });
 245
 246                                                          },
 247                                                          error : function(data){
 248                                                                  modalService.showFailure("Fail","Error while saving.");
 249                                                          }
 250                                                   });
 251
 252                 })
 253
 254                 };
 255
 256                 $scope.removeChildRole = function(childRole) {
 257                         modalService.popupConfirmWin("Confirm","You are about to remove the child role "+childRole.name+" from the role for "+$scope.role.name+". Do you want to continue?",
 258                                 function(){
 259                                       var uuu = "role/removeChildRole.htm?role_id=${param.role_id}";
 260                                           var postData={childRole:childRole};
 261                                           $.ajax({
 262                                                  type : 'POST',
 263                                                  url : uuu,
 264                                                  dataType: 'json',
 265                                                  contentType: 'application/json',
 266                                                  data: JSON.stringify(postData),
 267                                                  success : function(data){
 268                                                         $scope.$apply(function(){
 269                                                                 $scope.role=data.role;
 270                                                                 $.each($scope.availableRoles, function(k, c){
 271                                                                 if(c.id === childRole.id) {
 272                                                                         c.selected = false;
 273                                                                 }
 274                                                             });
 275                                                         });
 276
 277                                                  },
 278                                                  error : function(data){
 279                                                          modalService.showFailure("Fail","Error while saving.");
 280                                                  }
 281                                           });
 282
 283                 })
 284                 };
 285 });
 286 </script>