From a08a05a5f4492562f9f0bbca64db023ba5f5f37b Mon Sep 17 00:00:00 2001
From: Jane Sandberg <sandbej@linnbenton.edu>
Date: Thu, 27 May 2021 19:32:27 -0700
Subject: [PATCH] Add to carousel option in angular catalog

Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
---
 .../eg2/src/app/staff/catalog/catalog.module.ts    |  2 +
 .../staff/catalog/record/actions.component.html    | 24 +++---
 .../record/add-to-carousel-dialog.component.html   | 31 ++++++++
 .../record/add-to-carousel-dialog.component.ts     | 85 ++++++++++++++++++++++
 4 files changed, 133 insertions(+), 9 deletions(-)
 create mode 100644 Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.html
 create mode 100644 Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.ts

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 9b7d57acdc..cff15a18af 100644
--- a/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/catalog.module.ts
@@ -21,6 +21,7 @@ import {RecordActionsComponent} from './record/actions.component';
 import {BasketActionsComponent} from './basket-actions.component';
 import {HoldComponent} from './hold/hold.component';
 import {PartsComponent} from './record/parts.component';
+import {AddToCarouselDialogComponent} from './record/add-to-carousel-dialog.component';
 import {PartMergeDialogComponent} from './record/part-merge-dialog.component';
 import {BrowseComponent} from './browse.component';
 import {BrowseResultsComponent} from './browse/results.component';
@@ -47,6 +48,7 @@ import {PreferencesComponent} from './prefs.component';
     BasketActionsComponent,
     HoldComponent,
     PartsComponent,
+    AddToCarouselDialogComponent,
     PartMergeDialogComponent,
     BrowseComponent,
     BrowseResultsComponent,
diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/record/actions.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/record/actions.component.html
index 9a64f73fad..2b5bc7f973 100644
--- a/Open-ILS/src/eg2/src/app/staff/catalog/record/actions.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/record/actions.component.html
@@ -1,18 +1,21 @@
 
-<eg-string key="catalog.record.toast.conjoined" 
+<eg-string key="catalog.record.toast.conjoined"
   i18n-text text="Conjoined Record Target Set"></eg-string>
-<eg-string key="catalog.record.toast.overlay" 
+<eg-string key="catalog.record.toast.overlay"
   i18n-text text="Record Overlay Target Set"></eg-string>
-<eg-string key="catalog.record.toast.holdTransfer" 
+<eg-string key="catalog.record.toast.holdTransfer"
   i18n-text text="Hold Transfer Target Set"></eg-string>
-<eg-string key="catalog.record.toast.holdingTransfer" 
+<eg-string key="catalog.record.toast.holdingTransfer"
   i18n-text text="Holding Transfer Target Set"></eg-string>
-<eg-string key="catalog.record.toast.cleared" 
+<eg-string key="catalog.record.toast.cleared"
   text="Record Marks Cleared"></eg-string>
 
 <eg-bucket-dialog #recordBucketDialog bucketClass="biblio" [itemIds]="[recId]">
 </eg-bucket-dialog>
 
+<eg-add-to-carousel-dialog #recordCarouselDialog [recordIds]="[recId]">
+</eg-add-to-carousel-dialog>
+
 <div class="row ml-0 mr-0">
 
   <a routerLink="/staff/catalog/hold/T" [queryParams]="{target: recId}">
@@ -42,19 +45,19 @@
     <div ngbDropdownMenu aria-labelledby="actionsForDd">
       <button class="dropdown-item" (click)="mark('conjoined')">
         <span i18n>
-          Conjoined Items<ng-container *ngIf="targets.conjoined.current"> 
+          Conjoined Items<ng-container *ngIf="targets.conjoined.current">
             (Currently {{targets.conjoined.current}})</ng-container>
         </span>
       </button>
       <button class="dropdown-item" (click)="mark('overlay')">
         <span i18n>
-          Overlay Target<ng-container *ngIf="targets.overlay.current"> 
+          Overlay Target<ng-container *ngIf="targets.overlay.current">
             (Currently {{targets.overlay.current}})</ng-container>
         </span>
       </button>
       <button class="dropdown-item" (click)="mark('holdTransfer')">
         <span i18n>
-          Title Hold Transfer<ng-container *ngIf="targets.holdTransfer.current"> 
+          Title Hold Transfer<ng-container *ngIf="targets.holdTransfer.current">
             (Currently {{targets.holdTransfer.current}})</ng-container>
         </span>
       </button>
@@ -77,7 +80,10 @@
       <button class="dropdown-item" (click)="recordBucketDialog.open({size: 'lg'})">
         <span i18n>Add To Bucket</span>
       </button>
-      <a class="dropdown-item" 
+      <button class="dropdown-item" (click)="recordCarouselDialog.open({size: 'lg'})">
+        <span i18n>Add To Carousel</span>
+      </button>
+      <a class="dropdown-item"
         href="/eg/staff/acq/legacy/lineitem/related/{{recId}}?target=bib">
         <span i18n>View/Place Orders</span>
       </a>
diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.html
new file mode 100644
index 0000000000..9199bd96ad
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.html
@@ -0,0 +1,31 @@
+<eg-string #successMsg text="Successfully added to carousel" i18n-text></eg-string>
+<eg-string #errorMsg text="Failed to add to carousel" i18n-text></eg-string>
+
+<ng-template #dialogContent>
+  <div class="modal-header bg-info">
+    <h4 class="modal-title">
+      <span i18n>Add to Carousel</span>
+    </h4>
+    <button type="button" class="close"
+    i18n-aria-label aria-label="Close" (click)="close(false)">
+    <span aria-hidden="true">&times;</span>
+  </button>
+</div>
+<div class="modal-body">
+  <div *ngIf="!carousels.length">
+    <p i18n>There are no eligible carousels.</p>
+    <p> <a routerLink="/staff/admin/local/container/carousel" i18n>Would you like to add one?</a></p>
+  </div>
+  <div class="row" *ngIf="carousels.length">
+    <div class="col-lg-3 font-weight-bold" i18n>Carousel</div>
+    <div class="col-lg-5">
+      <eg-combobox [entries]="formatCarouselEntries()" [formControl]="selectedCarousel">
+      </eg-combobox>
+    </div>
+  </div>
+</div>
+<div class="modal-footer">
+  <button type="button" class="btn btn-success"
+  (click)="addToCarousel()" i18n>Add to carousel</button>
+</div>
+</ng-template>
diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.ts b/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.ts
new file mode 100644
index 0000000000..2448845ffa
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/record/add-to-carousel-dialog.component.ts
@@ -0,0 +1,85 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {FormControl} from '@angular/forms';
+import {takeLast} from 'rxjs/operators';
+import {DialogComponent} from '@eg/share/dialog/dialog.component';
+import {AuthService} from '@eg/core/auth.service';
+import {NetService} from '@eg/core/net.service';
+import {EventService} from '@eg/core/event.service';
+import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
+import {ComboboxEntry} from '@eg/share/combobox/combobox.component';
+import {StringComponent} from '@eg/share/string/string.component';
+
+@Component({
+  selector: 'eg-add-to-carousel-dialog',
+  templateUrl: './add-to-carousel-dialog.component.html'
+})
+
+
+export class AddToCarouselDialogComponent extends DialogComponent {
+
+    // IDs of records to add to the carousel
+    @Input() recordIds: number[];
+
+
+    @ViewChild('successMsg', { static: true }) private successMsg: StringComponent;
+    @ViewChild('errorMsg', { static: true }) private errorMsg: StringComponent;
+
+    selectedCarousel = new FormControl('');
+
+    private carousels = [];
+    private reset: () => void;
+
+    constructor(
+        private modal: NgbModal,
+        private auth: AuthService,
+        private evt: EventService,
+        private net: NetService
+    ) {
+        super(modal);
+    }
+
+    ngOnInit() {
+        this.onOpen$.subscribe(ok => {
+            this.reset();
+            this.net.request(
+                'open-ils.actor',
+                'open-ils.actor.carousel.retrieve_manual_by_staff',
+                this.auth.token()
+            ).subscribe(carousels => this.carousels = carousels)
+        });
+
+        this.reset = () => {
+            this.carousels = [];
+        };
+
+        this.addToCarousel = () => {
+            this.net.request(
+                'open-ils.actor',
+                'open-ils.actor.container.item.create.batch',
+                this.auth.token(),
+                'biblio_record_entry',
+                this.selectedCarousel.value['id'],
+                this.recordIds
+            ).pipe(takeLast(1))
+            .subscribe(
+                result => {
+                    const evt = this.evt.parse(result);
+                    if (evt) {
+                        this.errorMsg.current().then(m => this.toast.danger(m));
+                    } else {
+                        this.successMsg.current().then(m => this.toast.danger(m));
+                    }
+
+                }
+            )
+
+        };
+    }
+
+    formatCarouselEntries(): ComboboxEntry[] {
+        return this.carousels.map(carousel => ({id: carousel['bucket'], label: carousel['name']}));
+    }
+
+
+
+}
-- 
2.11.0