Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts

   1 import {Component, Input, OnInit} from '@angular/core';
   2 import {Router} from '@angular/router';
   3 import {DomSanitizer, SafeUrl} from '@angular/platform-browser';
   4 import {GridToolbarButton, GridToolbarAction, GridContext} from '@eg/share/grid/grid';
   5 import {GridColumnWidthComponent} from './grid-column-width.component';
   6 import {GridPrintComponent} from './grid-print.component';
   7 import {GridColumn} from './grid';
   8
   9 @Component({
  10   selector: 'eg-grid-toolbar',
  11   templateUrl: 'grid-toolbar.component.html'
  12 })
  13
  14 export class GridToolbarComponent implements OnInit {
  15
  16     @Input() gridContext: GridContext;
  17     @Input() colWidthConfig: GridColumnWidthComponent;
  18     @Input() gridPrinter: GridPrintComponent;
  19     @Input() disableSaveSettings = false;
  20
  21     renderedGroups: {[group: string]: boolean} = {};
  22
  23     csvExportInProgress: boolean;
  24     csvExportUrl: SafeUrl;
  25     csvExportFileName: string;
  26
  27     constructor(
  28         private router: Router,
  29         private sanitizer: DomSanitizer
  30     ) {}
  31
  32     ngOnInit() {
  33         this.sortActions();
  34     }
  35
  36     sortActions() {
  37         const actions = this.gridContext.toolbarActions;
  38
  39         const unGrouped = actions.filter(a => !a.group)
  40         .sort((a, b) => {
  41             return a.label < b.label ? -1 : 1;
  42         });
  43
  44         const grouped = actions.filter(a => Boolean(a.group))
  45         .sort((a, b) => {
  46             if (a.group === b.group) {
  47                 return a.label < b.label ? -1 : 1;
  48             } else {
  49                 return a.group < b.group ? -1 : 1;
  50             }
  51         });
  52
  53         // Insert group markers for rendering
  54         const seen: any = {};
  55         const grouped2: any[] = [];
  56         grouped.forEach(action => {
  57             if (!seen[action.group]) {
  58                 seen[action.group] = true;
  59                 const act = new GridToolbarAction();
  60                 act.label = action.group;
  61                 act.isGroup = true;
  62                 grouped2.push(act);
  63             }
  64             grouped2.push(action);
  65         });
  66
  67         this.gridContext.toolbarActions = unGrouped.concat(grouped2);
  68     }
  69
  70     saveGridConfig() {
  71         // TODO: when server-side settings are supported, this operation
  72         // may offer to save to user/workstation OR org unit settings
  73         // depending on perms.
  74
  75         this.gridContext.saveGridConfig().then(
  76             // hide the with config after saving
  77             ok => this.colWidthConfig.isVisible = false,
  78             err => console.error(`Error saving columns: ${err}`)
  79         );
  80     }
  81
  82     performButtonAction(button: GridToolbarButton) {
  83         const rows = this.gridContext.getSelectedRows();
  84         console.log('BUTTON ACTION', button.routerLink);
  85         if (button.routerLink) {
  86             this.router.navigate([button.routerLink]);
  87         } else {
  88             button.onClick.emit(rows);
  89             if (button.action) { button.action(); }
  90         }
  91     }
  92
  93     printHtml() {
  94         this.gridPrinter.printGrid();
  95     }
  96
  97     generateCsvExportUrl($event) {
  98
  99         if (this.csvExportInProgress) {
 100             // This is secondary href click handler.  Give the
 101             // browser a moment to start the download, then reset
 102             // the CSV download attributes / state.
 103             setTimeout(() => {
 104                 this.csvExportUrl = null;
 105                 this.csvExportFileName = '';
 106                 this.csvExportInProgress = false;
 107                }, 500
 108             );
 109             return;
 110         }
 111
 112         this.csvExportInProgress = true;
 113
 114         // let the file name describe the grid
 115         this.csvExportFileName = (
 116             this.gridContext.persistKey || 'eg_grid_data'
 117         ).replace(/\s+/g, '_') + '.csv';
 118
 119         this.gridContext.gridToCsv().then(csv => {
 120             const blob = new Blob([csv], {type : 'text/plain'});
 121             const win: any = window; // avoid TS errors
 122             this.csvExportUrl = this.sanitizer.bypassSecurityTrustUrl(
 123                 (win.URL || win.webkitURL).createObjectURL(blob)
 124             );
 125
 126             // Fire the 2nd click event now that the browser has
 127             // information on how to download the CSV file.
 128             setTimeout(() => $event.target.click());
 129         });
 130
 131         $event.preventDefault();
 132     }
 133
 134     toggleVisibility(col: GridColumn) {
 135         col.visible = !col.visible;
 136         if (this.gridContext.reloadOnColumnChange) {
 137             this.gridContext.reloadWithoutPagerReset();
 138         }
 139     }
 140 }
 141
 142