LP#1626157 Catalog MARC HTML view tab

Signed-off-by: Bill Erickson <berickxx@gmail.com>

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts b/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts
index 3d3d313..a4b4f61 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts
@@ -15,6 +15,7 @@ import {ResultFacetsComponent} from './result/facets.component';
 import {ResultRecordComponent} from './result/record.component';
 import {StaffCatalogService} from './catalog.service';
 import {RecordPaginationComponent} from './record/pagination.component';
+import {MarcViewComponent} from './record/marc-view.component';
 
 @NgModule({
   declarations: [
@@ -27,7 +28,8 @@ import {RecordPaginationComponent} from './record/pagination.component';
     ResultRecordComponent,
     ResultFacetsComponent,
     ResultPaginationComponent,
-    RecordPaginationComponent
+    RecordPaginationComponent,
+    MarcViewComponent
   ],
   imports: [
     EgStaffCommonModule,

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/record/marc-view.component.ts b/Open-ILS/src/eg2/src/app/staff/catalog/record/marc-view.component.ts
new file mode 100644 (file)
index 0000000..aa8677e
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/record/marc-view.component.ts
@@ -0,0 +1,63 @@
+import {Component, OnInit, Input, ElementRef} from '@angular/core';
+import {EgNetService} from '@eg/core/net.service';
+import {StaffCatalogService} from '../catalog.service';
+import {EgOrgService} from '@eg/core/org.service';
+
+@Component({
+  selector: 'eg-catalog-marc-view',
+  // bulk of display is generated from MARC HTML
+  template: '<div class="w-100"></div>'
+})
+export class MarcViewComponent implements OnInit {
+
+    recId: number;
+    initDone = false;
+
+    @Input() set recordId(id: number) {
+        this.recId = id;
+        // Only force new data collection when recordId()
+        // is invoked after ngInit() has already run.
+        if (this.initDone) {
+            this.collectData();
+        }
+    }
+
+    constructor(
+        private elm: ElementRef,
+        private net: EgNetService,
+        private staffCat: StaffCatalogService
+    ) {}
+
+    ngOnInit() {
+        this.initDone = true;
+        this.collectData();
+    }
+
+    collectData() {
+        if (!this.recId) { return; }
+        this.fetchMarcHtml();
+    }
+
+    fetchMarcHtml() {
+        this.net.request(
+            'open-ils.search',
+            'open-ils.search.biblio.record.html',
+            this.recId, false
+
+        ).subscribe(html => {
+
+            // Remove those pesky non-i8n labels / actions.
+            // Note: for printing, use the browser print page
+            // option.  The end result is the same.
+            html = html.replace(
+                /<button onclick="window.print(.*?)<\/button>/,'');
+            html = html.replace(/<title>(.*?)<\/title>/,'');
+
+            // remove reference to nonexistant CSS file
+            html = html.replace(/<link(.*?)\/>/,'');
+            this.elm.nativeElement.innerHTML = html;
+        });
+    }
+}
+
+

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/record/record.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/record/record.component.html
index 127254a..5203677 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/record/record.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/record/record.component.html
@@ -10,8 +10,19 @@
     <eg-bib-summary [bibSummary]="bibSummary">
     </eg-bib-summary>
   </div>
-  <div id='staff-catalog-copies-container' class='mt-3'>
-    <eg-catalog-copies [recordId]="recordId"></eg-catalog-copies>
+  <div id='staff-catalog-bib-tabs-container' class='mt-3'>
+    <ngb-tabset>
+      <ngb-tab title="Copy Table" i18n-title id="copy_table">
+        <ng-template ngbTabContent>
+          <eg-catalog-copies [recordId]="recordId"></eg-catalog-copies>
+        </ng-template>
+      </ngb-tab>
+      <ngb-tab title="MARC View" i18n-title id="marc_view">
+        <ng-template ngbTabContent>
+          <eg-catalog-marc-view [recordId]="recordId"></eg-catalog-marc-view>
+        </ng-template>
+      </ngb-tab>
+    </ngb-tabset>
   </div>
 </div>