Open-ILS/src/eg2/src/app/staff/admin/local/course-reserves/course-page.component.html

   1 <eg-staff-banner
   2   bannerText=" {{currentCourse.course_number()}}: {{currentCourse.name()}}"
   3   i18n-bannerText class="mb-3" *ngIf="currentCourse"
   4   [bannerStyle]="currentCourse.is_archived() == 't' ? 'alert-secondary' : null"
   5   [bannerIcon]="currentCourse.is_archived() == 't' ? 'lock' : null">
   6 </eg-staff-banner>
   7 <ngb-tabset class="mb-3">
   8
   9   <!-- Edit Tab -->
  10   <ngb-tab title="Edit Course" i18n-title id="edit">
  11     <ng-template ngbTabContent>
  12       <div class="row">
  13         <div class="col-lg-3 mt-3">
  14           <button class="p-2 mb-3 btn btn-danger btn-lg"
  15             (click)="archiveCourse()" [disabled]="currentCourse && currentCourse.is_archived() == 't'">
  16             <i class="material-icons align-middle"
  17               *ngIf="currentCourse && currentCourse.is_archived() == 't'">block</i>
  18             <span class="align-middle">Archive Course</span>
  19           </button>
  20         </div>
  21         <div class="col-lg-6 mt-3">
  22           <eg-fm-record-editor displayMode="inline"
  23             hiddenFieldsList="id,is_archived"
  24             idlClass="acmc"
  25             [preloadLinkedValues]="true"
  26             [record]="currentCourse">
  27           </eg-fm-record-editor>
  28         </div>
  29       </div>
  30     </ng-template>
  31   </ngb-tab>
  32
  33   <!-- Materials Tab -->
  34   <ngb-tab title="Course Materials" i18n-title id="courseMaterials">
  35     <ng-template ngbTabContent>
  36       <div class="row mt-3">
  37         <!-- Input Sidebar -->
  38         <div class="col-lg-4 mt-3">
  39           <div class="row mt-3">
  40             <div class="col-lg-12 d-flex">
  41               <div class="input-group">
  42                 <div class="input-group-prepend">
  43                   <span class="input-group-text" i18n>Barcode</span>
  44                 </div>
  45                 <input type="text" class="flex-grow-1" [(ngModel)]="barcodeInput"
  46                   (click)="$event.target.select()"
  47                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
  48                   (keyup.enter)="associateItem(barcodeInput, relationshipInput)" />
  49               </div>
  50             </div>
  51           </div>
  52           <div class="row mt-3">
  53             <div class="col-lg-12 d-flex">
  54               <div class="input-group">
  55                 <div class="input-group-prepend">
  56                   <span class="input-group-text" i18n>Relationship</span>
  57                 </div>
  58                 <input type="text" [(ngModel)]="relationshipInput"
  59                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
  60                   placeholder-i18n placeholder="e.g. Required"
  61                   class="flex-grow-1" />
  62               </div>
  63             </div>
  64           </div>
  65           <div class="row mt-3">
  66             <div class="col-lg-12 text-right">
  67               <button class="btn btn-primary"
  68                 [disabled]="currentCourse && currentCourse.is_archived() == 't'"
  69                 (click)="associateItem(barcodeInput, relationshipInput)"
  70                 i18n [disabled]="!barcodeInput">
  71                 Add Material
  72               </button>
  73             </div>
  74           </div>
  75           <div class="row justify-content-center mt-3">
  76             <div class="col">
  77               <h5 i18n>The following fields will be applied to the material
  78                     added, and reverted once the course is no longer associated
  79                     with the material.</h5>
  80             </div>
  81           </div>
  82           <div class="row mt-3">
  83             <div class="col-lg-12 d-flex">
  84               <div class="input-group">
  85                 <div class="input-group-prepend">
  86                   <div class="input-group-text">
  87                     <span i18n>Call Number</span>
  88                   </div>
  89                 </div>
  90                 <input type="text" [(ngModel)]="tempCallNumber"
  91                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
  92                   (input)="isModifyingCallNumber = true" class="flex-grow-1" />
  93                 <div class="input-group-append">
  94                   <div class="input-group-text">
  95                     <input type="checkbox" [(ngModel)]="isModifyingCallNumber"
  96                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
  97                       aria-label="Checkbox for setting a temporary Call Number" />
  98                   </div>
  99                 </div>
 100               </div>
 101             </div>
 102           </div>
 103           <div class="row mt-3">
 104             <div class="col-lg-12 d-flex">
 105               <div class="input-group">
 106                 <div class="input-group-prepend">
 107                   <div class="input-group-text">
 108                     <span i18n>Circulation Modifier</span>
 109                   </div>
 110                 </div>
 111                 <eg-combobox i18n-placeholder placeholder="Circulation Modifier..."
 112                   idlClass="ccm" idlField="name" [displayTemplate]="idlClassLabel"
 113                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 114                   [asyncSupportsEmptyTermClick]="true" class="flex-grow-1"
 115                   (onChange)="tempCircMod = $event.id; isModifyingCircMod = true">
 116                 </eg-combobox>
 117                 <div class="input-group-append">
 118                   <div class="input-group-text">
 119                     <input type="checkbox" [(ngModel)]="isModifyingCircMod"
 120                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 121                       aria-label="Checkbox for setting a temporary Circulation Modifier" />
 122                   </div>
 123                 </div>
 124               </div>
 125             </div>
 126           </div>
 127           <div class="row mt-3">
 128             <div class="col-lg-12 d-flex">
 129               <div class="input-group">
 130                 <div class="input-group-prepend">
 131                   <div class="input-group-text">
 132                     <span i18n>Item Status</span>
 133                   </div>
 134                 </div>
 135                 <eg-combobox i18n-placeholder placeholder="Item Status..."
 136                   idlClass="ccs" idlField="name" [displayTemplate]="idlClassLabel"
 137                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 138                   [asyncSupportsEmptyTermClick]="true" class="flex-grow-1"
 139                   (onChange)="tempStatus = $event.id; isModifyingStatus = true">
 140                 </eg-combobox>
 141                 <div class="input-group-append">
 142                   <div class="input-group-text">
 143                     <input type="checkbox" [(ngModel)]="isModifyingStatus"
 144                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 145                       aria-label="Checkbox for setting a temporary Item Status" />
 146                   </div>
 147                 </div>
 148               </div>
 149             </div>
 150           </div>
 151           <div class="row mt-3">
 152             <div class="col-lg-12 d-flex">
 153               <div class="input-group">
 154                 <div class="input-group-prepend">
 155                   <div class="input-group-text">
 156                     <span i18n>Shelving Location</span>
 157                   </div>
 158                 </div>
 159                 <eg-item-location-select permFilter="MANAGE_RESERVES" class="flex-grow-1"
 160                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 161                   [(ngModel)]="tempLocation" (valueChange)="isModifyingLocation = true">
 162                 </eg-item-location-select>
 163                 <div class="input-group-append">
 164                   <div class="input-group-text">
 165                     <input type="checkbox" [(ngModel)]="isModifyingLocation"
 166                       [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 167                       aria-label="Checkbox for setting a temporary Shelving Location" />
 168                   </div>
 169                 </div>
 170               </div>
 171             </div>
 172           </div>
 173         </div>
 174         <!-- End Input Sidebar -->
 175         <div class="col-lg-8 mt-3">
 176           <eg-grid #materialsGrid [dataSource]="materialsDataSource">
 177             <eg-grid-toolbar-action label="Delete Selected" i18n-label (onClick)="deleteSelected($event)">
 178             </eg-grid-toolbar-action>
 179
 180             <eg-grid-column path="id" [index]=true [hidden]="true" label="ID" i18n-label></eg-grid-column>
 181             <eg-grid-column label="Barcode" i18n-label name="barcode" [cellTemplate]="barcodeCellTemplate"></eg-grid-column>
 182             <eg-grid-column label="Title" i18n-label name="title" [cellTemplate]="titleCellTemplate"></eg-grid-column>
 183             <eg-grid-column path="call_number.label" label="Call Number" i18n-label></eg-grid-column>
 184             <eg-grid-column path="call_number.prefix.label" [hidden]="true" label="Call Number Prefix" i18n-label hidden></eg-grid-column>
 185             <eg-grid-column path="call_number.suffix.label" [hidden]="true" label="Call Number Suffix" i18n-label hidden></eg-grid-column>
 186             <eg-grid-column path="circ_modifier" [hidden]="true" label="Circulation Modifier" i18n-label></eg-grid-column>
 187             <eg-grid-column path="circ_lib.shortname" label="Circulation Library" i18n-label></eg-grid-column>
 188             <eg-grid-column path="location.name" [hidden]="true" label="Shelving Location" i18n-label></eg-grid-column>
 189             <eg-grid-column path="status.name" [hidden]="true" label="Copy Status" i18n-label></eg-grid-column>
 190             <eg-grid-column path="_relationship" label="Relationship" i18n-label></eg-grid-column>
 191           </eg-grid>
 192         </div>
 193       </div>
 194       <ng-template #barcodeCellTemplate let-entry="row">
 195         <span>
 196           <a class="pl-1"
 197             href="/eg/staff/cat/item/{{entry.id()}}">
 198             {{entry.barcode()}}
 199           </a>
 200         </span>
 201       </ng-template>
 202       <ng-template #titleCellTemplate let-entry="row">
 203         <span>
 204           <a class="pl-1"
 205             href="/eg/staff/cat/catalog/record/{{entry.call_number().record()}}">
 206             {{entry._title}}
 207           </a>
 208         </span>
 209       </ng-template>
 210       <ng-template #idlClassLabel let-r="result" i18n>
 211         {{r.label}}
 212       </ng-template>
 213     </ng-template>
 214   </ngb-tab>
 215
 216   <!-- Users Tab -->
 217   <ngb-tab title="Course Users" i18n-title id="courseUsers">
 218     <ng-template ngbTabContent>
 219       <div class="row mt-3">
 220         <div class="col-lg-4 mt-3">
 221           <div class="row mt-3">
 222             <div class="col-lg-12 d-flex">
 223               <div class="input-group">
 224                 <div class="input-group-prepend">
 225                   <span class="input-group-text" i18n>Patron Barcode</span>
 226                 </div>
 227                 <input type="text" class="flex-grow-1" [(ngModel)]="userBarcode"
 228                   (click)="$event.target.select()"
 229                   [disabled]="currentCourse && currentCourse.is_archived() == 't'" />
 230                   <!--(keyup.enter)="associateUser(userBarcode)"-->
 231               </div>
 232             </div>
 233           </div>
 234           <div class="row mt-3">
 235             <div class="col-lg-12 d-flex">
 236               <div class="input-group">
 237                 <div class="input-group-prepend">
 238                   <span class="input-group-text" i18n>Role</span>
 239                 </div>
 240                 <input type="text" [(ngModel)]="userRoleInput"
 241                   [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 242                   placeholder-i18n placeholder="e.g. Student, TA, Instructor..."
 243                   class="flex-grow-1" />
 244               </div>
 245             </div>
 246           </div>
 247           <div class="row mt-3">
 248             <div class="col-lg-12 text-right">
 249               <!--(click)="associateUser(userBarcode)"-->
 250               <button class="btn btn-primary"
 251                 [disabled]="currentCourse && currentCourse.is_archived() == 't'"
 252                 i18n [disabled]="!userBarcode">
 253                 Add User
 254               </button>
 255             </div>
 256           </div>
 257         </div>
 258         <div class="col-lg-8 mt-3">
 259           <!-- eg-grid -->
 260         </div>
 261       </div>
 262     </ng-template>
 263   </ngb-tab>
 264 </ngb-tabset>
 265
 266 <eg-string #archiveFailedString i18n-text text="Archival of Course failed or was not allowed"></eg-string>
 267 <eg-string #archiveSuccessString i18n-text text="Archival of Course succeeded"></eg-string>
 268 <eg-string #materialDeleteFailedString i18n-text text="Disassociation of Course Material failed or was not allowed"></eg-string>
 269 <eg-string #materialDeleteSuccessString i18n-text text="Disassociation of Course Material succeeded"></eg-string>
 270 <eg-string #materialAddSuccessString i18n-text text="Association of Course Material succeeded"></eg-string>
 271 <eg-string #materialAddFailedString i18n-text text="Association of Course Material failed or was not allowed"></eg-string>
 272 <eg-string #MaterialAddDifferentLibraryString i18n-text text="Material exists at a different library"></eg-string>