Merge branch 'develop' into main

.gitignore

@@ -50,3 +50,5 @@ Thumbs.db
 build
 cloudapp/src/assets/manifest*.json
 config.json
+# See: https://github.com/ExLibrisGroup/cloudapp-sdk/issues/48
+cloudapp/src/proxy.conf.js

.nvmrc

@@ -1 +1 @@
-lts/fermium
+16

cloudapp/src/app/app.module.ts

@@ -4,7 +4,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MaterialModule, getTranslateModule, AlertModule } from '@exlibris/exl-cloudapp-angular-lib';
+import { MaterialModule, CloudAppTranslateModule, AlertModule } from '@exlibris/exl-cloudapp-angular-lib';
 
 import { AppComponent } from './app.component';
 import { AppRoutingModule } from './app-routing.module';
@@ -27,8 +27,8 @@ import { MainComponent } from './main/main.component';
     AlertModule,
     FormsModule,
     ReactiveFormsModule,
-    getTranslateModule(),
     ColumnOptionsModule,
+    CloudAppTranslateModule.forRoot(),
   ],
   providers: [
     { provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { appearance: 'standard' } },

cloudapp/src/app/app.service.ts

@@ -1,7 +1,6 @@
 import { Injectable } from '@angular/core'
 import { CloudAppEventsService, CloudAppStoreService, InitData } from '@exlibris/exl-cloudapp-angular-lib'
 import * as _ from 'lodash'
-import { last } from 'rxjs/operators'
 import { COLUMNS_DEFINITIONS } from './requested-resources/column-definitions'  // Direct to avoid circular dependency
 import { ColumnOption } from './column-options'
 import { ConfigService } from './config/config.service'
@@ -79,18 +78,18 @@ export class AppService {
       // Start with the columns in the order they are from the app configuration,
       ...(
         (this.configService.config?.columnDefaults ?? [])
-        // ... minus any that aren't defined anymore
-        .filter(c => missingColumnDefinitions.has(c.code))
-        .map(c => {
-          let name = missingColumnDefinitions.get(c.code).name
-          missingColumnDefinitions.delete(c.code)
-          return { include: false, limit: 0, hiddenInApp: false, ...c, name }
-        })
+          // ... minus any that aren't defined anymore
+          .filter(c => missingColumnDefinitions.has(c.code))
+          .map(c => {
+            let name = missingColumnDefinitions.get(c.code).name
+            missingColumnDefinitions.delete(c.code)
+            return { include: false, limit: 0, hiddenInApp: false, ...c, name }
+          })
       ),
       // Add any columns not in the app configuration, in the order they appear in the column definitions
       ...(
         Array.from(missingColumnDefinitions.values())
-             .map(c => ({ code: c.code, name: c.name, include: false, limit: 0, hiddenInApp: false }))
+          .map(c => ({ code: c.code, name: c.name, include: false, limit: 0, hiddenInApp: false }))
       )
     ]
   }
@@ -111,6 +110,11 @@ export class AppService {
   }
 
 
+  get groupByLocation(): boolean {
+    return this.configService.groupByLocation
+  }
+
+
   popLastSlipReportError(): SlipReportError | undefined {
     let e = this.lastSlipReportError
     this.lastSlipReportError = undefined
@@ -147,18 +151,18 @@ export class AppService {
         // Start with the columns in the order they are from the last used options,
         ...(
           (lastUsedOptions?.columnOptions ?? [])
-          // ... minus any that aren't defined anymore
-          .filter(c => missingColumnDefinitions.has(c.code))
-          .map(c => {
-            let name = missingColumnDefinitions.get(c.code).name
-            missingColumnDefinitions.delete(c.code)
-            return { include: false, limit: 0, hiddenInApp: false, ...c, name }
-          })
+            // ... minus any that aren't defined anymore
+            .filter(c => missingColumnDefinitions.has(c.code))
+            .map(c => {
+              let name = missingColumnDefinitions.get(c.code).name
+              missingColumnDefinitions.delete(c.code)
+              return { include: false, limit: 0, hiddenInApp: false, ...c, name }
+            })
         ),
         // Add any columns not in the app configuration, in the order they appear in the column definitions
         ...(
           Array.from(missingColumnDefinitions.values())
-               .map(c => ({ code: c.code, name: c.name, include: false, limit: 0, hiddenInApp: false }))
+            .map(c => ({ code: c.code, name: c.name, include: false, limit: 0, hiddenInApp: false }))
         )
       ]
     } else {
@@ -168,15 +172,15 @@ export class AppService {
 
 
   async saveLastUsed() {
-    let lastUsedOptions =  {
+    let lastUsedOptions = {
       libraryCode: this.libraryCode,
       circDeskCode: this.circDeskCode,
       columnOptions: (
         this.columnOptionsAreCustomised
-        ? this.columnOptions.map(c => ({
+          ? this.columnOptions.map(c => ({
             code: c.code, include: c.include, limit: c.limit, hiddenInApp: c.hiddenInApp
           }))
-        : undefined
+          : undefined
       )
     }
     if (lastUsedOptions.columnOptions) {

cloudapp/src/app/config/config.component.html

@@ -35,6 +35,19 @@ <h1>Configuration</h1>
   </mat-card>
 </mat-tab>
 
+<mat-tab label="Other">
+  <mat-card>
+    <mat-card-header>
+      <mat-card-title>
+        Other Settings
+      </mat-card-title>
+    </mat-card-header>
+    <mat-card-content>
+      <mat-slide-toggle formControlName="groupByLocation">Group by location</mat-slide-toggle>
+    </mat-card-content>
+  </mat-card>
+</mat-tab>
+
 </mat-tab-group>
 </form>
 

cloudapp/src/app/config/config.component.ts

@@ -20,6 +20,7 @@ export class ConfigComponent implements OnInit {
   form = this.fb.group({  // Initialised properly in restoreConfig()
     circDeskCodeDefaults: [ [] ],
     columnOptionsList: [ [] ],
+    groupByLocation: [ [] ],
   })
   ready = false
   saving = false
@@ -52,6 +53,11 @@ export class ConfigComponent implements OnInit {
   }
 
 
+  get groupByLocation(): FormControl {
+    return this.form.get('groupByLocation') as FormControl
+  }
+
+
   async onSave() {
     try {
       this.saving = true
@@ -71,6 +77,7 @@ export class ConfigComponent implements OnInit {
     this.form.setValue({
       circDeskCodeDefaults: this.restoreCircDeskCodeDefaults(),
       columnOptionsList: this.restoreColumnOptionsList(),
+      groupByLocation: this.restoreGroupByLocation(),
     })
   }
 
@@ -112,10 +119,15 @@ export class ConfigComponent implements OnInit {
     return columnOptions
   }
 
+  private restoreGroupByLocation(): boolean {
+    return this.configService.groupByLocation || false;
+  }
+
 
   async saveConfig() {
     this.saveCircDeskCodeDefaults()
     this.saveColumnOptionsList()
+    this.saveGroupByLocation()
     await this.configService.save()
   }
 
@@ -137,4 +149,9 @@ export class ConfigComponent implements OnInit {
     )
   }
 
+
+  private saveGroupByLocation() {
+    this.configService.groupByLocation = this.form.value.groupByLocation
+  }
+
 }

cloudapp/src/app/config/config.service.ts

@@ -7,6 +7,7 @@ import * as _ from 'lodash'
 export type PrintSlipReportConfig = {
   libraryConfigs: PrintSlipReportLibraryConfig[]
   columnDefaults: PrintSlipReportColumnConfig[]
+  groupByLocation: boolean
 }
 
 export type PrintSlipReportLibraryConfig = {
@@ -56,9 +57,19 @@ export class ConfigService {
   }
 
 
+  get groupByLocation() {
+    return this.config?.groupByLocation
+  }
+
+
+  set groupByLocation(v) {
+    this.config = { ...this.config, groupByLocation: v }
+  }
+
+
   async load() {
     if (!this.loaded) {
-      this.config = { columnDefaults: [], libraryConfigs: [] }
+      this.config = { columnDefaults: [], libraryConfigs: [] , groupByLocation: false }
       try {
         let loadedConfig: PrintSlipReportConfig | { } = await this.configService.get().toPromise()
         _.defaultsDeep(loadedConfig, { columnDefaults: [ { include: false, limit: 0 } ] })

cloudapp/src/app/print-slip-report/print-slip-report.component.html

@@ -1,16 +1,18 @@
 <ng-container *ngIf="!loading; else progressSpinner">
-  <table>
-    <thead>
-      <tr>
-        <td *ngFor="let c of includedColumnOptions">{{ c.name }}</td>
-      </tr>
-    </thead>
-    <tbody>
-      <tr *ngFor="let r of mappedRequestedResources">
-        <td *ngFor="let v of r">{{ v }}</td>
-      </tr>
-    </tbody>
-  </table>
+  <div *ngFor="let table of tables | keyvalue">
+    <table>
+      <thead>
+        <tr>
+          <td *ngFor="let column of includedColumnOptions">{{ column.name }}</td>
+        </tr>
+      </thead>
+      <tbody>
+        <tr *ngFor="let row of table.value">
+          <td *ngFor="let value of row.values">{{ value }}</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
 </ng-container>
 
 <ng-template #progressSpinner>

cloudapp/src/app/print-slip-report/print-slip-report.component.scss

@@ -6,12 +6,50 @@
 table,
 th,
 td {
-  border: 1px solid;
   border-collapse: collapse;
+  border-top: 1px solid;
+  border-left: 1px solid;
+}
+
+
+table,
+th:first-child,
+td:first-child {
+  border-left: none;
 }
 
 
 th,
 td {
   padding: .2rem .1rem;
 }
+
+
+td:first-child {
+  font-weight: 500;
+}
+
+
+thead {
+  font-weight: 500;
+  line-height: 150%;
+}
+
+
+@media screen {
+  table {
+    margin-bottom: 20px;
+  }
+}
+
+
+@media print {
+  div table {
+    page-break-after: always;
+  }
+
+
+  div:last-child table {
+    page-break-after: avoid;
+  }
+}