From e1c1f88af7313c1640d1a6f4d4942ccb50d8351d Mon Sep 17 00:00:00 2001
From: Renaud Michotte <renaud.michotte@gmail.com>
Date: Thu, 6 May 2021 16:04:52 +0200
Subject: [PATCH] circulation: add data into pending/pickup patron profile

* Adds a column into `pending` patron profile tab to display the request
  creation date.
* Adds a column into `pickup` patron profile tab to display the
  "available until" date.
* Closes rero/rero-ils#1778.

Co-Authored-By: Renaud Michotte <renaud.michotte@gmail.com>
---
 .../pending/pending-item/pending-item.component.html      | 8 ++++----
 .../patron/pending/pending-item/pending-item.component.ts | 2 +-
 .../app/circulation/patron/pending/pending.component.html | 8 ++++----
 .../patron/pickup/pickup-item/pickup-item.component.html  | 8 ++++----
 .../app/circulation/patron/pickup/pickup.component.html   | 8 ++++----
 5 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.html b/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.html
index 4a24a201e..b772bbf55 100644
--- a/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.html
+++ b/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.html
@@ -16,7 +16,7 @@
 -->
 <ng-container *ngIf="item; else loading">
   <!-- FIRST ROW : barcode, title, availability, action button -->
-  <div class="col-sm-2">
+  <div class="col-2">
     <button type="button" class="pl-0 pt-0 btn"
             (click)="isCollapsed = !isCollapsed"
             [attr.aria-expanded]="!isCollapsed"
@@ -25,7 +25,7 @@
     </button>
     <a [routerLink]="['/records', 'items', 'detail', item.pid]">{{ item.barcode }}</a>
   </div>
-  <div class="col-sm-6">
+  <div class="col-6">
     <a [routerLink]="['/records', 'documents', 'detail', document.pid]" *ngIf="document.title | mainTitle as title">
       {{ title }}
     </a><br/>
@@ -43,8 +43,8 @@
       </ul>
     </ng-container>
   </div>
-  <div class="col-sm-3">-</div>
-  <div class="col-sm-1"></div>
+  <div class="col-2">{{ loan.created | dateTranslate: 'short' }}</div>
+  <div class="col-2">-<!-- TODO :: display the computed expected_date --></div>
   <!-- SECOND ROW : item detail -->
   <div class="col-12" *ngIf="!isCollapsed">
     <dl class="row">
diff --git a/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.ts b/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.ts
index a88786a11..b7570d31a 100644
--- a/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.ts
+++ b/projects/admin/src/app/circulation/patron/pending/pending-item/pending-item.component.ts
@@ -46,7 +46,7 @@ export class PendingItemComponent implements OnInit {
   ) { }
 
   /**
-   * Init
+   * OnInit hook
    */
   ngOnInit() {
     if (this.loan) {
diff --git a/projects/admin/src/app/circulation/patron/pending/pending.component.html b/projects/admin/src/app/circulation/patron/pending/pending.component.html
index 849bd1a0d..e835b3ad5 100644
--- a/projects/admin/src/app/circulation/patron/pending/pending.component.html
+++ b/projects/admin/src/app/circulation/patron/pending/pending.component.html
@@ -18,10 +18,10 @@
   <div *ngIf="loans.length > 0; else noRequested">
     <!-- HEADER -->
     <div class="row p-2 mb-1 bg-dark rounded text-light">
-      <div class="col-sm-2" translate>Item</div>
-      <div class="col-sm-6" translate>Title</div>
-      <div class="col-sm-3" translate>Expected availability</div>
-      <div class="col-sm-1">&nbsp;</div>
+      <div class="col-2" translate>Item</div>
+      <div class="col-6" translate>Title</div>
+      <div class="col-2" translate>Request date</div>
+      <div class="col-2" translate>Expected availability</div>
     </div>
     <div *ngFor="let loan of loans">
       <admin-pending-item [loan]="loan" class="row p-2 mb-1 border rounded align-middle"></admin-pending-item>
diff --git a/projects/admin/src/app/circulation/patron/pickup/pickup-item/pickup-item.component.html b/projects/admin/src/app/circulation/patron/pickup/pickup-item/pickup-item.component.html
index feca9b78a..00d170a80 100644
--- a/projects/admin/src/app/circulation/patron/pickup/pickup-item/pickup-item.component.html
+++ b/projects/admin/src/app/circulation/patron/pickup/pickup-item/pickup-item.component.html
@@ -15,10 +15,10 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 <ng-container *ngIf="item && loan; else loading">
-  <div class="col-sm-2">
+  <div class="col-2">
     <a [routerLink]="['/records', 'items', 'detail', item.pid]">{{ item.barcode }}</a>
   </div>
-  <div class="col-sm-5">
+  <div class="col-5">
     <a [routerLink]="['/records', 'documents', 'detail', document.pid]" *ngIf="document.title | mainTitle as title">
       {{ title }}
     </a><br/>
@@ -36,10 +36,10 @@
       </ul>
     </ng-container>
   </div>
-  <div class="col-sm-3">
+  <div class="col-3">
     {{ loan.metadata.pickup_location_pid | getRecord: 'locations' : 'field' : 'pickup_name' | async }}
   </div>
-  <div class="col"></div>
+  <div class="col-2">-<!-- TODO :: display the computed to_pick_up_until_date --></div>
 </ng-container>
 
 <ng-template #loading>
diff --git a/projects/admin/src/app/circulation/patron/pickup/pickup.component.html b/projects/admin/src/app/circulation/patron/pickup/pickup.component.html
index 6697318e3..8d9055acd 100644
--- a/projects/admin/src/app/circulation/patron/pickup/pickup.component.html
+++ b/projects/admin/src/app/circulation/patron/pickup/pickup.component.html
@@ -18,10 +18,10 @@
   <div *ngIf="loans.length > 0; else noPickup">
     <!-- HEADER -->
     <div class="row p-2 mb-1 bg-dark rounded text-light row">
-      <div class="col-sm-2" translate>Item</div>
-      <div class="col-sm-5" translate>Title</div>
-      <div class="col-sm-3" translate>Pickup location</div>
-      <div class="col-sm-2">&nbsp;</div>
+      <div class="col-2" translate>Item</div>
+      <div class="col-5" translate>Title</div>
+      <div class="col-3" translate>Pickup location</div>
+      <div class="col-2" translate>To pick-up until</div>
     </div>
     <admin-pickup-item *ngFor="let loan of loans" [loan]="loan" class="row p-2 mb-1 border rounded align-middle"></admin-pickup-item>
   </div>