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 fst-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 class="form-label" i18n>Actions for Selected: </label>
  63               </div>
  64               <div class="col-lg-9">
  65                 <button type="button" class="btn btn-info me-2" (click)="edit()" i18n>Edit</button>
  66                 <button type="button" class="btn btn-info me-2" (click)="addChild()" i18n>Add Child</button>
  67                 <button type="button" class="btn btn-destroy me-2" (click)="remove()" i18n>Delete</button>
  68               </div>
  69             </div>
  70             <div class="row">
  71               <div class="col-lg-4">
  72                 <label class="form-label" i18n>Name: </label>
  73               </div>
  74               <div class="col-lg-8 fw-bold">
  75                 {{selected.callerData.name()}}
  76               </div>
  77             </div>
  78             <div class="row">
  79               <div class="col-lg-4">
  80                 <label class="form-label" i18n>Description: </label>
  81               </div>
  82               <div class="col-lg-8 fw-bold">
  83                 {{selected.callerData.description()}}
  84               </div>
  85             </div>
  86             <div class="row">
  87               <div class="col-lg-4">
  88                 <label class="form-label" i18n>User Expiration Interval: </label>
  89               </div>
  90               <div class="col-lg-8 fw-bold">
  91                 {{selected.callerData.perm_interval()}}
  92               </div>
  93             </div>
  94             <div class="row">
  95               <div class="col-lg-4">
  96                 <label class="form-label" i18n>Application Permission: </label>
  97               </div>
  98               <div class="col-lg-8 fw-bold">
  99                 {{selected.callerData.application_perm()}}
 100               </div>
 101             </div>
 102             <div class="row">
 103               <div class="col-lg-4">
 104                 <label class="form-label" i18n>Hold Priority: </label>
 105               </div>
 106               <div class="col-lg-8 fw-bold">
 107                 {{selected.callerData.hold_priority()}}
 108               </div>
 109             </div>
 110             <div class="row">
 111               <div class="col-lg-4">
 112                 <label class="form-label" i18n>User Group?: </label>
 113               </div>
 114               <div class="col-lg-8 fw-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 m-2 mb-3">
 126               <div class="col">
 127                 <button type="button" class="btn btn-success" (click)="applyChanges()" i18n
 128                   [disabled]='!changesPending()'>
 129                   Apply Changes
 130                 </button>
 131               </div>
 132               <div class="col">
 133                 <button type="button" class="btn btn-info ms-3" (click)="openAddDialog()" i18n>
 134                   Add New Mapping
 135                 </button>
 136               </div>
 137               <div class="col">
 138                 <input class="form-control ms-2" [(ngModel)]="filterText"
 139                   i18n-placeholder placeholder="Filter..."/>
 140               </div>
 141               <div class="col">
 142                 <button type="button" class="btn btn-outline-secondary ms-1"
 143                   (click)="filterText=''" i18n>
 144                   Clear
 145                 </button>
 146               </div>
 147             </div>
 148
 149             <div class="row fst-italic">
 150               <span class="label-with-material-icon">
 151               <span class="ps-1 pe-1 fw-bold text-danger
 152                 material-icons mat-icon-shrunk-in-button">new_releases</span>
 153               <span i18n>
 154                 Permissions marked with an enclosed checkmark
 155                 override parent group permissions.
 156               </span>
 157               </span>
 158             </div>
 159
 160             <div class="row fw-bold">
 161               <div class="col-lg-5" i18n>Permissions</div>
 162               <div class="col-lg-4" i18n>Group</div>
 163               <div class="col-lg-1" i18n>Depth</div>
 164               <div class="col-lg-1" i18n>Grantable?</div>
 165               <div class="col-lg-1" i18n>Delete?</div>
 166             </div>
 167
 168             <div class="row" *ngFor="let map of groupPermMaps()"
 169                 [ngClass]="{'bg-warning': map.isdeleted()}">
 170               <div class="col-lg-5">
 171                 <span class="label-with-material-icon">
 172                   <span i18n-title title="{{map.perm().description() || map.perm().code()}}">
 173                     {{map.perm().code()}}
 174                   </span>
 175                   <ng-container *ngIf="permOverrides(map)">
 176                     <span i18n-title title="Permission Overrides a Parent Group Permission"
 177                       class="ps-1 fw-bold text-danger material-icons mat-icon-shrunk-in-button">new_releases</span>
 178                     <span class="visually-hidden" i18n>Parent group override</span>
 179                   </ng-container>
 180                 </span>
 181               </div>
 182               <ng-container *ngIf="permIsInherited(map); else nativeMap">
 183                 <div class="col-lg-4">
 184                   <button type="button" class="btn btn-link m-0 p-0"
 185                     (click)="selectGroup(map.grp().id())">
 186                     {{map.grp().name()}}
 187                   </button>
 188                 </div>
 189                 <div class="col-lg-1 text-center">{{map.depth()}}</div>
 190                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 191                   <div class="d-flex justify-content-center p-1 rounded">
 192                     <eg-bool [value]="map.grantable() === 't'"></eg-bool>
 193                   </div>
 194                 </div>
 195                 <div class="col-lg-1 fst-italic" i18n>Inherited</div>
 196               </ng-container>
 197               <ng-template #nativeMap>
 198                 <div class="col-lg-4">{{map.grp().name()}}</div>
 199                 <div class="col-lg-1">
 200                   <select [ngModel]="map.depth()" class="p-1"
 201                     (ngModelChange)="map.depth($event); map.ischanged(true)">
 202                     <option *ngFor="let d of orgDepths" value="{{d}}">{{d}}</option>
 203                   </select>
 204                 </div>
 205                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 206                   <div class="d-flex justify-content-center p-1 rounded border border-info">
 207                     <input type="checkbox" class="align-middle"
 208                       i18n-title title="Grantable?"
 209                       [ngModel]="map.grantable() === 't'"
 210                       (ngModelChange)="map.grantable($event ? 't' : 'f'); map.ischanged(true)"/>
 211                   </div>
 212                 </div>
 213                 <div class="col-lg-1 d-flex flex-column justify-content-center">
 214                   <div class="d-flex justify-content-center p-1 rounded border border-danger">
 215                     <input type="checkbox" class="align-middle"
 216                       i18n-title title="Delete Mapping"
 217                       [ngModel]="map.isdeleted()"
 218                       (ngModelChange)="map.isdeleted($event)"/>
 219                   </div>
 220                 </div>
 221               </ng-template>
 222             </div>
 223             <div class="row d-flex m-2 mb-3">
 224               <button type="submit" class="btn btn-success" (click)="applyChanges()" i18n
 225                 [disabled]='!changesPending()'>
 226                 Apply Changes
 227               </button>
 228             </div>
 229           </ng-template>
 230         </li>
 231       </ul>
 232
 233       <div [ngbNavOutlet]="PermTabs" class="mt-2"></div>
 234     </div>
 235   </div>
 236 </div>