LP1840773 SCKO Angular
authorBill Erickson <berickxx@gmail.com>
Tue, 21 Jun 2022 17:33:17 +0000 (13:33 -0400)
committerBill Erickson <berickxx@gmail.com>
Tue, 21 Jun 2022 17:33:17 +0000 (13:33 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/scko/banner.component.html
Open-ILS/src/eg2/src/app/scko/banner.component.ts
Open-ILS/src/eg2/src/app/scko/checkout.component.html [new file with mode: 0644]
Open-ILS/src/eg2/src/app/scko/checkout.component.ts [new file with mode: 0644]
Open-ILS/src/eg2/src/app/scko/routing.module.ts
Open-ILS/src/eg2/src/app/scko/scko.component.css
Open-ILS/src/eg2/src/app/scko/scko.component.html
Open-ILS/src/eg2/src/app/scko/scko.module.ts
Open-ILS/src/eg2/src/app/scko/scko.service.ts
Open-ILS/src/eg2/src/app/scko/summary.component.html

index 963fe5d..979f44e 100644 (file)
@@ -4,7 +4,7 @@
                <img src="/images/self_eg_logo.png"/>
        </div>
   <div class="scko-scan-container mt-3">
-    <ng-container *ngIf="scko.auth.user() && !scko.patron">
+    <ng-container *ngIf="scko.auth.user() && !scko.patronSummary">
       <div id="scko-scan-input-text" i18n>
         Please log in with your username or library barcode.
       </div>
@@ -35,7 +35,7 @@
       </div>
     </ng-container>
 
-    <ng-container *ngIf="scko.patron">
+    <ng-container *ngIf="scko.patronSummary">
       <div id="scko-scan-input-text" i18n>Please enter an item barcode</div>
       <div class="d-flex mt-3 mb-3">
         <div class="flex-1"></div>
@@ -55,7 +55,8 @@
         <div class="flex-1 d-flex">
           <div class="flex-1"></div>
           <div id="scko-welcome-message" class="mr-2 rounded" i18n>Welcome,
-            {{scko.patron.pref_first_given_name() || scko.patron.first_given_name()}}
+            {{scko.patronSummary.patron.pref_first_given_name() 
+              || scko.patronSummary.patron.first_given_name()}}
           </div>
         </div>
       </div>
index 8a9e281..e599453 100644 (file)
@@ -111,12 +111,12 @@ export class SckoBannerComponent implements OnInit {
     submitPatronLogin() {
         this.patronLoginFailed = false;
         this.loadPatron().finally(() => {
-            this.patronLoginFailed = this.scko.patron === null;
+            this.patronLoginFailed = this.scko.patronSummary === null;
         });
     }
 
     loadPatron(): Promise<any> {
-        this.scko.patron = null;
+        this.scko.resetPatron();
 
         if (!this.patronUsername) { return; }
 
@@ -167,21 +167,7 @@ export class SckoBannerComponent implements OnInit {
                 return Promise.reject('User not found');
             }
 
-            return this.net.request(
-                'open-ils.actor',
-                'open-ils.actor.user.fleshed.retrieve.authoritative',
-                this.auth.token(), patronId).toPromise();
-
-        }).then(patron => {
-
-            const evt = this.evt.parse(patron);
-
-            if (evt) {
-                console.error('fetchPatron()', evt);
-                return Promise.reject('User not found');
-            }
-
-            this.scko.patron = patron;
+            return this.scko.loadPatron(patronId);
         });
     }
 
diff --git a/Open-ILS/src/eg2/src/app/scko/checkout.component.html b/Open-ILS/src/eg2/src/app/scko/checkout.component.html
new file mode 100644 (file)
index 0000000..5b10c7e
--- /dev/null
@@ -0,0 +1,17 @@
+<div>
+  <table class='oils-selfck-item-table'>
+    <thead>
+      <tr>
+        <td class="rounded-left" id='oils-self-circ-pic-cell'></td>
+        <td i18n>Barcode</td>
+        <td i18n>Title</td>
+        <td i18n>Author</td>
+        <td i18n>Due Date</td>
+        <td i18n>Renewals Left</td>
+        <td class="rounded-right" i18n>Type</td>
+      </tr>
+    </thead>
+    <tbody id='oils-selfck-circ-out-tbody' class='oils-selfck-item-table'>
+    </tbody>
+  </table>
+</div>
diff --git a/Open-ILS/src/eg2/src/app/scko/checkout.component.ts b/Open-ILS/src/eg2/src/app/scko/checkout.component.ts
new file mode 100644 (file)
index 0000000..89ff3d3
--- /dev/null
@@ -0,0 +1,22 @@
+import {Component, OnInit, ViewEncapsulation} from '@angular/core';
+import {Router, ActivatedRoute, NavigationEnd} from '@angular/router';
+import {AuthService} from '@eg/core/auth.service';
+import {SckoService} from './scko.service';
+import {ServerStoreService} from '@eg/core/server-store.service';
+
+@Component({
+  templateUrl: 'checkout.component.html'
+})
+
+export class SckoCheckoutComponent implements OnInit {
+
+    constructor(
+        private router: Router,
+        private route: ActivatedRoute,
+        public  scko: SckoService
+    ) {}
+
+    ngOnInit() {
+    }
+}
+
index 6d52229..4c9ed2a 100644 (file)
@@ -1,15 +1,15 @@
 import {NgModule} from '@angular/core';
 import {RouterModule, Routes} from '@angular/router';
 import {SckoComponent} from './scko.component';
+import {SckoCheckoutComponent} from './checkout.component';
 
 const routes: Routes = [{
   path: '',
   component: SckoComponent,
-  /*
   children: [{
-
+    path: '',
+    component: SckoCheckoutComponent
   }]
-  */
 }];
 
 @NgModule({
index bf79e6e..f3ed0fd 100644 (file)
@@ -2,6 +2,10 @@ body {
     font-family: Arial, Verdana;                                               
     font-size: 13px;                                                           
 }                                                                              
+
+A {
+    text-decoration: none;
+}
                                                                                
 #scko-banner {                                                         
     background: #00593d; /* Old browsers */                                    
@@ -77,3 +81,27 @@ body {
     outline: 0 none;
     text-decoration: none;
 }
+
+
+.oils-selfck-item-table  {
+    width: 98%;
+    margin-top: 15px;
+}
+
+.oils-selfck-item-table td {
+    text-align: left;
+    padding: 7px;
+}
+
+.oils-selfck-item-table thead {
+    font-weight: bold;
+    color: #00593D;
+    background-color: #D8D8D8;                                                 
+    padding: 8px 0 7px;                                                        
+}
+
+.oils-selfck-item-table tbody tr {
+    border-bottom: 1px solid #888;
+}
+
+
index 4159fa2..c9df088 100644 (file)
@@ -1,9 +1,11 @@
 
 <eg-scko-banner></eg-scko-banner>
 
-<div *ngIf="scko.patron" class="row mt-5">
+<div *ngIf="scko.patronSummary" class="row mt-5">
   <div class="col-lg-8">
-    <router-outlet></router-outlet>
+    <div class="ml-2">
+      <router-outlet></router-outlet>
+    </div>
   </div>
   <div class="col-lg-4"><eg-scko-summary></eg-scko-summary></div>
 </div>
index 5743595..e4b795d 100644 (file)
@@ -3,22 +3,26 @@ import {EgCommonModule} from '@eg/common.module';
 import {CommonWidgetsModule} from '@eg/share/common-widgets.module';
 import {AudioService} from '@eg/share/util/audio.service';
 import {TitleComponent} from '@eg/share/title/title.component';
+import {PatronModule} from '@eg/staff/share/patron/patron.module';
 
 import {SckoComponent} from './scko.component';
 import {SckoRoutingModule} from './routing.module';
 import {SckoService} from './scko.service';
 import {SckoBannerComponent} from './banner.component';
 import {SckoSummaryComponent} from './summary.component';
+import {SckoCheckoutComponent} from './checkout.component';
 
 @NgModule({
   declarations: [
     SckoComponent,
     SckoBannerComponent,
     SckoSummaryComponent,
+    SckoCheckoutComponent,
   ],
   imports: [
     EgCommonModule,
     CommonWidgetsModule,
+    PatronModule,
     SckoRoutingModule
   ],
   providers: [
index 0f9fd1d..376a750 100644 (file)
@@ -5,29 +5,33 @@ import {EventService, EgEvent} from '@eg/core/event.service';
 import {IdlService, IdlObject} from '@eg/core/idl.service';
 import {StoreService} from '@eg/core/store.service';
 import {ServerStoreService} from '@eg/core/server-store.service';
+import {PatronService, PatronSummary, PatronStats} from '@eg/staff/share/patron/patron.service';
 
 @Injectable({providedIn: 'root'})
 export class SckoService {
 
     // Currently active patron account object.
-    patron: IdlObject;
+    patronSummary: PatronSummary;
     barcodeRegex: RegExp;
     patronPasswordRequired = false;
 
-    sessionTotalCheckouts = 0;
     accountTotalCheckouts = 0;
 
-    totalHolds = 0;
-    holdsReady = 0;
-    totalFines = 0;
+    sessionCheckouts: any[] = [];
 
     constructor(
         private net: NetService,
         private evt: EventService,
         private serverStore: ServerStoreService,
-        public auth: AuthService
+        public auth: AuthService,
+        private patrons: PatronService,
     ) {}
 
+    resetPatron() {
+        this.patronSummary = null;
+        this.sessionCheckouts = [];
+    }
+
     load(): Promise<any> {
         this.auth.authDomain = 'eg.scko';
 
@@ -56,6 +60,17 @@ export class SckoService {
             console.log('REQ', this.patronPasswordRequired);
         });
     }
+
+    loadPatron(id: number): Promise<any> {
+        return this.patrons.getFleshedById(id).then(
+            patron => this.patronSummary = new PatronSummary(patron))
+        .then(_ => this.patrons.getVitalStats(this.patronSummary.patron))
+        .then(stats => this.patronSummary.stats = stats);
+    }
+
+    sessionTotalCheckouts(): number {
+        return this.sessionCheckouts.length;
+    }
 }
 
 
index 012a342..673f8a3 100644 (file)
@@ -39,7 +39,7 @@
     <legend i18n>Items Checked Out</legend>
     <div>
       <span i18n>Total items this session: </span>
-      <span>{{scko.sessionTotalCheckouts}}</span>
+      <span>{{scko.sessionTotalCheckouts()}}</span>
     </div>
     <div class="mt-2">
       <span i18n>Total items on account: </span>
@@ -63,7 +63,7 @@
   </fieldset>
   <fieldset>
     <legend i18n>Fines</legend>
-    <div>{{scko.totalFines | currency}}</div>
+    <div>{{scko.patronSummary.stats.fines.balance_owed | currency}}</div>
     <div class="mt-2">
       <span>
         <a href='javascript:void(0);' id='oils-selfck-view-fines-link'>