Open-ILS/src/eg2/src/app/staff/admin/server/perm-group-tree.component.html

   1 <eg-staff-banner bannerText="Permission Group Configuration" i18n-bannerText>
   2 </eg-staff-banner>
   3
   4 <eg-string #createString i18n-text text="Permission Group Mapping Added">
   5 </eg-string>
   6 <eg-string #successString i18n-text text="Permission Group Update Succeeded">
   7 </eg-string>
   8 <eg-string #errorString i18n-text text="Permission Group Update Failed">
   9 </eg-string>
  10
  11 <eg-string #createMapString i18n-text text="Permission Group Mapping Added">
  12 </eg-string>
  13 <eg-string #successMapString i18n-text text="Permission Group Mapping Update Succeeded">
  14 </eg-string>
  15 <eg-string #errorMapString i18n-text text="Permission Group Mapping Update Failed">
  16 </eg-string>
  17
  18 <eg-fm-record-editor #editDialog idlClass="pgt" readonlyFields="parent"
  19    [fieldOptions]="fmEditorOptions()">
  20 </eg-fm-record-editor>
  21
  22 <eg-confirm-dialog #delConfirm
  23   i18n-dialogTitle i18n-dialogBody
  24   dialogTitle="Confirm Delete"
  25   dialogBody="Delete Permission Group {{selected ? selected.label : ''}}?">
  26 </eg-confirm-dialog>
  27
  28
  29 <eg-perm-group-map-dialog #addMappingDialog
  30   [permGroup]="selected ? selected.callerData : null"
  31   [orgDepths]="orgDepths"
  32   [permMaps]="groupPermMaps()" [permissions]="permissions">
  33 </eg-perm-group-map-dialog>
  34
  35 <div class="row">
  36   <div class="col-lg-3">
  37     <h3 i18n>Permission Groups</h3>
  38     <eg-tree [tree]="tree" (nodeClicked)="nodeClicked($event)"></eg-tree>
  39   </div>
  40   <div class="col-lg-9">
  41     <h3 i18n class="mb-3">Selected Permission Group</h3>
  42     <ng-container *ngIf="!selected">
  43       <div class="alert alert-info font-italic" i18n>
  44         Select a permission group from the tree on the left.
  45       </div>
  46       <ng-container *ngIf="loading">
  47           <div class="row">
  48             <div class="col-lg-6">
  49               <eg-progress-inline #loadProgress></eg-progress-inline>
  50             </div>
  51           </div>
  52         </ng-container>
  53     </ng-container>
  54     <div *ngIf="selected" class="common-form striped-even">
  55       <ul ngbNav #PermTabs="ngbNav" [(activeId)]="permTab" (navChange)="onNavChange($event)"
  56         [keyboard]="true" [roles]="false" role="tablist" class="nav-tabs">
  57         <li role="presentation" [ngbNavItem]="'detail'">
  58           <a i18n ngbNavLink role="tab">Group Details</a>
  59           <ng-template ngbNavContent>
  60             <div class="row">
  61               <div class="col-lg-3">
  62                 <label i18n>Actions for Selected: </label>
  63               </div>
  64               <div class="col-lg-9">
  65                 <button class="btn btn-info mr-2" (click)="edit()" i18n>Edit</button>
  66                 <button class="btn btn-info mr-2" (click)="addChild()" i18n>Add Child</button>
  67                 <button class="btn btn-warning mr-2" (click)="remove()" i18n>Delete</button>
  68               </div>
  69             </div>
  70             <div class="row">
  71               <div class="col-lg-4">
  72                 <label i18n>Name: </label>
  73               </div>
  74               <div class="col-lg-8 font-weight-bold">
  75                 {{selected.callerData.name()}}
  76               </div>
  77             </div>
  78             <div class="row">
  79               <div class="col-lg-4">
  80                 <label i18n>Description: </label>
  81               </div>
  82               <div class="col-lg-8 font-weight-bold">
  83                 {{selected.callerData.description()}}
  84               </div>
  85             </div>
  86             <div class="row">
  87               <div class="col-lg-4">
  88                 <label i18n>User Expiration Interval: </label>
  89               </div>
  90               <div class="col-lg-8 font-weight-bold">
  91                 {{selected.callerData.perm_interval()}}
  92               </div>
  93             </div>
  94             <div class="row">
  95               <div class="col-lg-4">
  96                 <label i18n>Application Permission: </label>
  97               </div>
  98               <div class="col-lg-8 font-weight-bold">
  99                 {{selected.callerData.application_perm()}}
 100               </div>
 101             </div>
 102             <div class="row">
 103               <div class="col-lg-4">
 104                 <label i18n>Hold Priority: </label>
 105               </div>
 106               <div class="col-lg-8 font-weight-bold">
 107                 {{selected.callerData.hold_priority()}}
 108               </div>
 109             </div>
 110             <div class="row">
 111               <div class="col-lg-4">
 112                 <label i18n>User Group?: </label>
 113               </div>
 114               <div class="col-lg-8 font-weight-bold">
 115                 <!-- TODO: replace with <eg-bool/> when merged -->
 116                 {{selected.callerData.usergroup() === 't'}}
 117               </div>
 118             </div>
 119           </ng-template>
 120         </li>
 121         <li role="presentation" [ngbNavItem]="'perm'">
 122           <a i18n ngbNavLink role="tab">Group Permissions</a>
 123           <ng-template ngbNavContent>
 124
 125             <div class="row d-flex m-2 mb-3">
 126               <button class="btn btn-success" (click)="applyChanges()" i18n
 127                 [disabled]='!changesPending()'>
 128                 Apply Changes
 129               </button>
 130               <button class="btn btn-info ml-3" (click)="openAddDialog()" i18n>
 131                 Add New Mapping
 132               </button>
 133               <div class="col-lg-3">
 134                 <input class="form-control ml-2" [(ngModel)]="filterText"
 135                   i18n-placeholder placeholder="Filter..."/>
 136               </div>
 137               <button class="btn btn-outline-secondary ml-1"
 138                 (click)="filterText=''" i18n>
 139                 Clear
 140               </button>
 141             </div>
 142
 143             <div class="row font-italic">
 144               <span class="label-with-material-icon" i18n>
 145                 Permissions marked with a
 146                 <span class="pl-1 pr-1 font-weight-bold text-danger
 147                   material-icons mat-icon-shrunk-in-button">new_releases</span>
 148                 override parent group permissions.
 149               </span>
 150             </div>
 151
 152             <div class="row font-weight-bold">
 153               <div class="col-lg-5" i18n>Permissions</div>
 154               <div class="col-lg-4" i18n>Group</div>
 155               <div class="col-lg-1" i18n>Depth</div>
 156               <div class="col-lg-1" i18n>Grantable?</div>
 157               <div class="col-lg-1" i18n>Delete?</div>
 158             </div>
 159
 160             <div class="row" *ngFor="let map of groupPermMaps()"
 161                 [ngClass]="{'bg-warning': map.isdeleted()}">
 162               <div class="col-lg-5">
 163                 <span class="label-with-material-icon">
 164                   <span i18n-title title="{{map.perm().description() || map.perm().code()}}">
 165                     {{map.perm().code()}}
 166                   </span>
 167                   <span *ngIf="permOverrides(map)"
 168                     i18n-title title="Permission Overrides a Parent Group Permission"
 169                     class="pl-1 font-weight-bold text-danger material-icons mat-icon-shrunk-in-button"
 170                     i18n>new_releases</span>
 171                 </span>
 172               </div>
 173               <ng-container *ngIf="permIsInherited(map); else nativeMap">
 174                 <div class="col-lg-4">
 175                   <button class="btn btn-link m-0 p-0"
 176                     (click)="selectGroup(map.grp().id())">
 177                     {{map.grp().name()}}
 178                   </button>
 179                 </div>
 180                 <div class="col-lg-1 text-center">{{map.depth()}}</div>
 181                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 182                   <div class="d-flex justify-content-center p-1 rounded">
 183                     <eg-bool [value]="map.grantable() === 't'"></eg-bool>
 184                   </div>
 185                 </div>
 186                 <div class="col-lg-1 font-italic" i18n>Inherited</div>
 187               </ng-container>
 188               <ng-template #nativeMap>
 189                 <div class="col-lg-4">{{map.grp().name()}}</div>
 190                 <div class="col-lg-1">
 191                   <select [ngModel]="map.depth()" class="p-1"
 192                     (ngModelChange)="map.depth($event); map.ischanged(true)">
 193                     <option *ngFor="let d of orgDepths" value="{{d}}">{{d}}</option>
 194                   </select>
 195                 </div>
 196                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 197                   <div class="d-flex justify-content-center p-1 rounded border border-info">
 198                     <input type="checkbox" class="align-middle"
 199                       i18n-title title="Grantable?"
 200                       [ngModel]="map.grantable() === 't'"
 201                       (ngModelChange)="map.grantable($event ? 't' : 'f'); map.ischanged(true)"/>
 202                   </div>
 203                 </div>
 204                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 205                   <div class="d-flex justify-content-center p-1 rounded border border-danger">
 206                     <input type="checkbox" class="align-middle"
 207                       i18n-title title="Delete Mapping"
 208                       [ngModel]="map.isdeleted()"
 209                       (ngModelChange)="map.isdeleted($event)"/>
 210                   </div>
 211                 </div>
 212               </ng-template>
 213             </div>
 214             <div class="row d-flex m-2 mb-3">
 215               <button class="btn btn-success" (click)="applyChanges()" i18n
 216                 [disabled]='!changesPending()'>
 217                 Apply Changes
 218               </button>
 219             </div>
 220           </ng-template>
 221         </li>
 222       </ul>
 223
 224       <div [ngbNavOutlet]="PermTabs" class="mt-2"></div>
 225     </div>
 226   </div>
 227 </div>