Open-ILS/src/eg2/src/app/share/grid/grid-column-config.component.html

   1 <ng-template #dialogContent>
   2   <div class="modal-header bg-info">
   3     <h4 class="modal-title" i18n>Grid Columns Configuration</h4>
   4     <button type="button" class="close"
   5       i18n-aria-label aria-label="Close"
   6       (click)="dismiss('cross_click')">
   7       <span aria-hidden="true">&times;</span>
   8     </button>
   9   </div>
  10   <div class="modal-body eg-grid-column-config-dialog">
  11
  12     <div class="row">
  13       <div class="col-lg-1 eg-grid-header-cell" i18n>Visible</div>
  14       <div class="col-lg-3 eg-grid-header-cell" i18n>Column Name</div>
  15       <div class="col-lg-1 eg-grid-header-cell" i18n>Move Up</div>
  16       <div class="col-lg-1 eg-grid-header-cell" i18n>Move Down</div>
  17       <div class="col-lg-2 eg-grid-header-cell" i18n>First Visible</div>
  18       <div class="col-lg-2 eg-grid-header-cell" i18n>Last Visible</div>
  19       <div class="col-lg-2 eg-grid-header-cell"
  20         *ngIf="columnSet.isMultiSortable" i18n>Sort Priority</div>
  21     </div>
  22     <div class="row pt-1" *ngFor="let col of columnSet.columns"
  23       [ngClass]="{visible : col.visible}">
  24       <div class="col-lg-1" (click)="col.visible=!col.visible">
  25         <span *ngIf="col.visible" class="badge badge-success">&#x2713;</span>
  26         <span *ngIf="!col.visible" class="badge badge-warning">&#x2717;</span>
  27       </div>
  28       <div class="col-lg-3" (click)="col.visible=!col.visible">{{col.label}}</div>
  29       <div class="col-lg-1">
  30         <a class="no-href" title="Move column up" i18n-title
  31           (click)="columnSet.moveColumn(col, -1)">
  32           <span class="material-icons">arrow_upward</span>
  33         </a>
  34       </div>
  35       <div class="col-lg-1">
  36         <a class="no-href" title="Move column down" i18n-title
  37           (click)="columnSet.moveColumn(col, 1)">
  38           <span class="material-icons">arrow_downward</span>
  39         </a>
  40       </div>
  41       <div class="col-lg-2">
  42         <a class="no-href" title="Make first visible" i18n-title
  43           (click)="columnSet.moveColumn(col, -10000)">
  44           <span class="material-icons">vertical_align_top</span>
  45         </a>
  46       </div>
  47       <div class="col-lg-2">
  48         <a class="no-href" title="Make last visible" i18n-title
  49           (click)="columnSet.moveColumn(col, 10000)">
  50           <span class="material-icons">vertical_align_bottom</span>
  51         </a>
  52       </div>
  53       <div class="col-lg-2" *ngIf="columnSet.isMultiSortable">
  54         <div *ngIf="col.isMultiSortable">
  55           <input type='number' [(ngModel)]="col.sort"
  56             title="Sort Priority / Direction" i18n-title style='width:2.8em'/>
  57         </div>
  58       </div>
  59
  60     </div>
  61   </div>
  62   <div class="modal-footer">
  63     <button class="btn btn-info" (click)="columnSet.moveVisibleToFront()">
  64       Move Visible Columns To Top
  65     </button>
  66     <button type="button" class="btn btn-success ml-2"
  67       (click)="close('confirmed')" i18n>Close</button>
  68   </div>
  69 </ng-template>