Open-ILS/src/eg2/src/app/staff/share/holdings/copy-notes-dialog.component.html

   1 <eg-string #successMsg text="Successfully Modified Item Notes" i18n-text></eg-string>
   2 <eg-string #errorMsg text="Failed To Modify Item Notes" i18n-text></eg-string>
   3
   4 <ng-template #dialogContent>
   5   <div class="modal-header">
   6     <h4 class="modal-title">
   7       <ng-container *ngIf="mode === 'create'">
   8         <span i18n>Adding notes for {{copyIds.length}} item(s).</span>
   9       </ng-container>
  10       <ng-container *ngIf="mode === 'manage'">
  11         <span i18n>Managing notes for item {{copy.barcode()}}</span>
  12       </ng-container>
  13       <span i18n></span>
  14     </h4>
  15     <button type="button" class="btn-close btn-close-white"
  16       i18n-aria-label aria-label="Close" (click)="close()"></button>
  17   </div>
  18   <div class="modal-body">
  19     <ng-container #editDialogContent *ngIf="mode === 'edit' && idToEdit; else manageDialogContent">
  20       <eg-copy-notes-edit [recordId]="idToEdit" (doneWithEdits)="returnToManage()">
  21       </eg-copy-notes-edit>
  22     </ng-container>
  23     <ng-template #manageDialogContent>
  24       <div class="p-4 form-validated">
  25         <ng-container *ngIf="mode === 'manage' && copy.notes().length">
  26           <h4 i18n>Existing Notes</h4>
  27           <div class="row mt-2 p-2" *ngFor="let note of copy.notes()">
  28             <div class="col-lg-3">{{note.title()}}</div>
  29             <div class="col-lg-5">{{note.value()}}</div>
  30             <div class="col-lg-2">
  31               <button class="btn btn-outline-info" (click)="editNote(note)" i18n>
  32                 Edit
  33               </button>
  34             </div>
  35             <div class="col-lg-2">
  36               <button class="btn btn-outline-danger"
  37                 (click)="removeNote(note)" i18n>Remove</button>
  38             </div>
  39           </div>
  40           <hr/>
  41         </ng-container>
  42
  43         <h4 i18n>New Notes</h4>
  44         <div class="row mt-2 p-2" *ngFor="let note of newNotes">
  45           <div class="col-lg-3">{{note.title()}}</div>
  46           <div class="col-lg-7">{{note.value()}}</div>
  47           <div class="col-lg-2">
  48             <button class="btn btn-outline-danger" (click)="removeNote(note)" i18n>
  49               Remove
  50             </button>
  51           </div>
  52         </div>
  53
  54         <div class="row mt-2 p-2 rounded border border-success">
  55           <div class="col-lg-12">
  56             <div class="row">
  57               <div class="col-lg-6">
  58                 <input type="text" class="form-control" [(ngModel)]="curNoteTitle"
  59                   i18n-placeholder placeholder="Note title..."/>
  60               </div>
  61               <div class="col-lg-6">
  62                 <div class="form-check">
  63                   <input class="form-check-input" type="checkbox"
  64                     [(ngModel)]="curNotePublic" id="pub-check">
  65                   <label class="form-label form-check-label" for="pub-check">Public Note</label>
  66                 </div>
  67               </div>
  68             </div>
  69             <div class="row mt-3">
  70               <div class="col-lg-9">
  71                 <textarea class="form-control" [(ngModel)]="curNote"
  72                   i18n-placeholder placeholder="Enter note value..."></textarea>
  73               </div>
  74               <div class="col-lg-3">
  75                 <button class="btn btn-success" (click)="addNew()" i18n>Add Note</button>
  76               </div>
  77             </div>
  78           </div>
  79         </div>
  80       </div>
  81     </ng-template>
  82   </div>
  83
  84   <div class="modal-footer" *ngIf="mode !== 'edit'">
  85     <button type="button" class="btn btn-secondary" (click)="close()" i18n>Cancel</button>
  86     <button class="btn btn-success me-2" (click)="applyChanges()" i18n>Apply Changes</button>
  87   </div>
  88 </ng-template>