From 1a03b68453cd845a19684ae0d42c6fdab4c39c1f Mon Sep 17 00:00:00 2001 From: Bill Erickson Date: Mon, 14 May 2018 12:12:48 -0400 Subject: [PATCH] LP#1775466 printing / more dates Signed-off-by: Bill Erickson --- Open-ILS/src/eg2/src/app/app.component.ts | 2 +- Open-ILS/src/eg2/src/app/common.module.ts | 8 +- Open-ILS/src/eg2/src/app/migration.module.ts | 92 ---------------------- .../share/date-select/date-select.component.html | 2 +- .../app/share/date-select/date-select.component.ts | 6 ++ .../app/share/fm-editor/fm-editor.component.html | 2 +- .../eg2/src/app/share/print/print.component.html | 5 ++ .../src/eg2/src/app/share/print/print.component.ts | 29 +++++++ .../src/eg2/src/app/share/print/print.service.ts | 21 +++++ .../src/app/staff/sandbox/sandbox.component.html | 15 +--- .../eg2/src/app/staff/sandbox/sandbox.component.ts | 15 +++- Open-ILS/src/eg2/src/styles.css | 13 +++ 12 files changed, 101 insertions(+), 109 deletions(-) delete mode 100644 Open-ILS/src/eg2/src/app/migration.module.ts create mode 100644 Open-ILS/src/eg2/src/app/share/print/print.component.html create mode 100644 Open-ILS/src/eg2/src/app/share/print/print.component.ts create mode 100644 Open-ILS/src/eg2/src/app/share/print/print.service.ts diff --git a/Open-ILS/src/eg2/src/app/app.component.ts b/Open-ILS/src/eg2/src/app/app.component.ts index d049f7a828..4a36d04493 100644 --- a/Open-ILS/src/eg2/src/app/app.component.ts +++ b/Open-ILS/src/eg2/src/app/app.component.ts @@ -2,7 +2,7 @@ import {Component} from '@angular/core'; @Component({ selector: 'eg-root', - template: '' + template: '' }) export class EgBaseComponent { diff --git a/Open-ILS/src/eg2/src/app/common.module.ts b/Open-ILS/src/eg2/src/app/common.module.ts index 5f5f97f9b6..6f072aada9 100644 --- a/Open-ILS/src/eg2/src/app/common.module.ts +++ b/Open-ILS/src/eg2/src/app/common.module.ts @@ -6,7 +6,6 @@ import {NgModule, ModuleWithProviders} from '@angular/core'; import {FormsModule} from '@angular/forms'; import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; - import {EgEventService} from '@eg/core/event.service'; import {EgStoreService} from '@eg/core/store.service'; import {EgIdlService} from '@eg/core/idl.service'; @@ -17,9 +16,12 @@ import {EgPcrudService} from '@eg/core/pcrud.service'; import {EgOrgService} from '@eg/core/org.service'; import {EgAudioService} from '@eg/share/util/audio.service'; import {EgFormatService} from '@eg/share/util/format.service'; +import {EgPrintService} from '@eg/share/print/print.service'; +import {EgPrintComponent} from '@eg/share/print/print.component'; @NgModule({ declarations: [ + EgPrintComponent ], imports: [ CommonModule, @@ -29,7 +31,8 @@ import {EgFormatService} from '@eg/share/util/format.service'; exports: [ CommonModule, NgbModule, - FormsModule + FormsModule, + EgPrintComponent ] }) @@ -50,6 +53,7 @@ export class EgCommonModule { EgPermService, EgPcrudService, EgOrgService, + EgPrintService, EgAudioService, EgFormatService ] diff --git a/Open-ILS/src/eg2/src/app/migration.module.ts b/Open-ILS/src/eg2/src/app/migration.module.ts deleted file mode 100644 index 5c878b54c4..0000000000 --- a/Open-ILS/src/eg2/src/app/migration.module.ts +++ /dev/null @@ -1,92 +0,0 @@ -/** - * EgMigrationModule - * - * This module has no internal components or routing. It's just a - * pass-through for AngularJS. - * - * 1. Loads the ang1 => ang2 upgrade components. - * 2. Downgrades and injects shared ang2 services and components for use - * by ang1. - * 3. Bootstraps ang1. - */ -import {BrowserModule} from '@angular/platform-browser'; -import {NgModule} from '@angular/core'; -import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; // ng-bootstrap -import {CookieModule} from 'ngx-cookie'; // import CookieMonster -import {UpgradeModule, downgradeInjectable, downgradeComponent} - from '@angular/upgrade/static'; - -// Replacement for egStrings.setPageTitle() -import {Title} from '@angular/platform-browser'; - -// Import service handles so we can downgrade them. -import {EgCommonModule} from './common.module'; -import {EgEventService} from '@eg/core/event.service'; -import {EgStoreService} from '@eg/core/store.service'; -import {EgIdlService} from '@eg/core/idl.service'; -import {EgNetService} from '@eg/core/net.service'; -import {EgAuthService} from '@eg/core/auth.service'; -import {EgPermService} from '@eg/core/perm.service'; -import {EgPcrudService} from '@eg/core/pcrud.service'; -import {EgOrgService} from '@eg/core/org.service'; - -// Downgraded components -//import {EgDialogComponent} from '@eg/share/dialog/dialog.component'; -//import {EgConfirmDialogComponent} from '@eg/share/dialog/confirm.component'; - -declare var angular: any; - -@NgModule({ - imports: [ - UpgradeModule, - BrowserModule, - NgbModule.forRoot(), - CookieModule.forRoot(), - EgCommonModule.forRoot() - ], - declarations: [ - //EgDialogComponent, - //EgConfirmDialogComponent - ], - entryComponents: [ - //EgDialogComponent, - //EgConfirmDialogComponent - ] -}) - -export class EgMigrationModule { - - constructor(private upgrade: UpgradeModule) {} - - ngDoBootstrap() { - let myWin: any = window; // hush compiler warnings - - if (!myWin.ang1PageApp) { - console.error('NO PAGE APP DEFINED'); - return; - } - - console.log(`Ang2 loading Ang1 app ${myWin.ang1PageApp}`); - - angular.module(myWin.ang1PageApp) - .factory('eg2Event', downgradeInjectable(EgEventService)) - .factory('eg2Store', downgradeInjectable(EgStoreService)) - .factory('eg2Idl', downgradeInjectable(EgIdlService)) - .factory('eg2Net', downgradeInjectable(EgNetService)) - .factory('eg2Auth', downgradeInjectable(EgAuthService)) - .factory('eg2Perm', downgradeInjectable(EgPermService)) - .factory('eg2Pcrud', downgradeInjectable(EgPcrudService)) - .factory('eg2Org', downgradeInjectable(EgOrgService)) - .factory('ng2Title', downgradeInjectable(Title)) - /* - .directive('eg2ConfirmDialog', - downgradeComponent({component: EgConfirmDialogComponent})) - */ - - ; - - this.upgrade.bootstrap(document.body, [myWin.ang1PageApp]); - } -} - - diff --git a/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.html b/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.html index c686be4d28..93dc5cffb0 100644 --- a/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.html +++ b/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.html @@ -4,7 +4,7 @@ class="form-control" ngbDatepicker #datePicker="ngbDatepicker" - placeholder="yyyy-mm-dd" + [placeholder]="yyyy-mm-dd" class="form-control" name="{{fieldName}}" [required]="required" diff --git a/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.ts b/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.ts index 7cc188fcfc..f203a5bb7e 100644 --- a/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.ts +++ b/Open-ILS/src/eg2/src/app/share/date-select/date-select.component.ts @@ -1,6 +1,12 @@ import {Component, OnInit, Input, Output, ViewChild, EventEmitter} from '@angular/core'; import {NgbDateStruct} from '@ng-bootstrap/ng-bootstrap'; +/** + * RE: displaying locale dates in the input field: + * https://github.com/ng-bootstrap/ng-bootstrap/issues/754 + * https://stackoverflow.com/questions/40664523/angular2-ngbdatepicker-how-to-format-date-in-inputfield + */ + @Component({ selector: 'eg-date-select', templateUrl: './date-select.component.html' diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html index 3da8b1b83a..38e6c388cb 100644 --- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html +++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html @@ -50,7 +50,7 @@ + initialIso="{{record[field.name]()}}"> diff --git a/Open-ILS/src/eg2/src/app/share/print/print.component.html b/Open-ILS/src/eg2/src/app/share/print/print.component.html new file mode 100644 index 0000000000..bc47c3851a --- /dev/null +++ b/Open-ILS/src/eg2/src/app/share/print/print.component.html @@ -0,0 +1,5 @@ + +
+ +
+ diff --git a/Open-ILS/src/eg2/src/app/share/print/print.component.ts b/Open-ILS/src/eg2/src/app/share/print/print.component.ts new file mode 100644 index 0000000000..9a2ccea5f8 --- /dev/null +++ b/Open-ILS/src/eg2/src/app/share/print/print.component.ts @@ -0,0 +1,29 @@ +import {Component, OnInit, TemplateRef} from '@angular/core'; +import {EgPrintService, EgPrintRequest} from './print.service'; + +@Component({ + selector: 'eg-print', + templateUrl: './print.component.html' +}) + +export class EgPrintComponent implements OnInit { + + template: TemplateRef; + context: any; + + constructor(private print: EgPrintService) {} + + ngOnInit() { + this.print.onPrintRequest$.subscribe( + printReq => this.handlePrintRequest(printReq)); + } + + handlePrintRequest(printReq: EgPrintRequest) { + this.template = printReq.template; + this.context = printReq.context; + + // TODO: hatch + setTimeout(() => window.print()); + } +} + diff --git a/Open-ILS/src/eg2/src/app/share/print/print.service.ts b/Open-ILS/src/eg2/src/app/share/print/print.service.ts new file mode 100644 index 0000000000..cc521f6795 --- /dev/null +++ b/Open-ILS/src/eg2/src/app/share/print/print.service.ts @@ -0,0 +1,21 @@ +import {Injectable, EventEmitter, TemplateRef} from '@angular/core'; + +export interface EgPrintRequest { + template: TemplateRef, + context: any +} + +@Injectable() +export class EgPrintService { + + onPrintRequest$: EventEmitter; + + constructor() { + this.onPrintRequest$ = new EventEmitter(); + } + + print(printReq: EgPrintRequest) { + this.onPrintRequest$.emit(printReq); + } +} + diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html index fedfd064db..b66343436d 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html @@ -67,22 +67,15 @@
HERE: {{testDate}}
- - - - - - + - - + +Hello, {{world}}! diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts index d34e773485..5579e25efd 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts @@ -8,6 +8,7 @@ import {EgIdlService, EgIdlObject} from '@eg/core/idl.service'; import {EgPcrudService} from '@eg/core/pcrud.service'; import {Pager} from '@eg/share/util/pager'; import {EgDateSelectComponent} from '@eg/share/date-select/date-select.component'; +import {EgPrintService} from '@eg/share/print/print.service'; @Component({ templateUrl: 'sandbox.component.html' @@ -20,6 +21,10 @@ export class EgSandboxComponent implements OnInit { @ViewChild('dateSelect') private dateSelector: EgDateSelectComponent; + @ViewChild('printTemplate') + private printTemplate: TemplateRef; + + //@ViewChild('helloStr') private helloStr: EgStringComponent; gridDataSource: EgGridDataSource = new EgGridDataSource(); @@ -39,7 +44,8 @@ export class EgSandboxComponent implements OnInit { private idl: EgIdlService, private pcrud: EgPcrudService, private strings: EgStringService, - private toast: EgToastService + private toast: EgToastService, + private printer: EgPrintService ) {} ngOnInit() { @@ -59,6 +65,13 @@ export class EgSandboxComponent implements OnInit { } } + doPrint() { + this.printer.print({ + template: this.printTemplate, + context: {world : 'world'} + }); + } + changeDate(date) { console.log('HERE WITH ' + date); this.testDate = date; diff --git a/Open-ILS/src/eg2/src/styles.css b/Open-ILS/src/eg2/src/styles.css index cc1ee6fdab..18d5f954c4 100644 --- a/Open-ILS/src/eg2/src/styles.css +++ b/Open-ILS/src/eg2/src/styles.css @@ -98,3 +98,16 @@ h5 {font-size: .95rem} border-left: 8px solid #FA787E; } +#eg-print-container { + display: none; +} + +@media print { + head { display: none; } /* just to be safe */ + body div:not([id="eg-print-container"]) { display:none } + div { display: none } + #eg-print-container { display: block } + #eg-print-container div { display: block } + #eg-print-container pre { border: none } +} + -- 2.11.0