From: Galen Charlton <gmc@equinoxOLI.org>
Date: Tue, 11 Jan 2022 20:33:17 +0000 (-0500)
Subject: LP#1942220: (follow-up) tweak LI expand/hide behavior
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=aa1a47e52ef87714c3dea71dae4f8a65fecefcc0;p=working%2FEvergreen.git

LP#1942220: (follow-up) tweak LI expand/hide behavior

- Expand/collapse at the individual LI level no longer expands
  only one line item at a time; user can exapnd or collapse as
  many as they see fit
- when navigating between pages of LIs, the current state of
  the expand/collapse all button controls whether the page of
  LIs are show as expanded or collapsed

Signed-off-by: Galen Charlton <gmc@equinoxOLI.org>
---

diff --git a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.html b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.html
index c49bd23f20..057e782853 100644
--- a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.html
@@ -307,11 +307,11 @@
             <span class="ml-1 mr-1" i18n> | </span>
             <a class="label-with-material-icon" title="Expand" i18n-title
               href="javascript:;" (click)="toggleShowExpand(li.id())">
-              <ng-container *ngIf="showExpandFor != li.id()">
+              <ng-container *ngIf="!expandLineitem[li.id()]">
                 <span class="material-icons small mr-1">unfold_more</span>
                 <span i18n>Expand</span>
               </ng-container>
-              <ng-container *ngIf="showExpandFor == li.id()">
+              <ng-container *ngIf="expandLineitem[li.id()]">
                 <span class="material-icons small mr-1">unfold_less</span>
                 <span i18n>Collapse</span>
               </ng-container>
@@ -498,7 +498,7 @@
       </eg-lineitem-notes>
     </div>
   </div>
-  <div class="row" *ngIf="showExpandFor == li.id() || expandAll">
+  <div class="row" *ngIf="expandLineitem[li.id()]">
     <div class="col-lg-10 offset-lg-1 p-2 mt-2 shadow">
 
       <!-- Note the flex values are set so they also match the layout
diff --git a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.ts b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.ts
index b37e856fb4..6a4f479254 100644
--- a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/lineitem-list.component.ts
@@ -105,7 +105,7 @@ export class LineitemListComponent implements OnInit {
     batchSelectPage = false;
     batchSelectAll = false;
     showNotesFor: number;
-    showExpandFor: number; // 'Expand'
+    expandLineitem: {[id: number]: boolean} = {};
     expandAll = false;
     action = '';
     batchFailure: EgEvent;
@@ -507,6 +507,12 @@ export class LineitemListComponent implements OnInit {
     ingestOneLi(li: IdlObject, replace?: boolean) {
         this.liMarcAttrs[li.id()] = {};
 
+        if (this.expandAll) {
+            this.expandLineitem[li.id()] = true;
+        } else {
+            this.expandLineitem[li.id()] = false;
+        }
+
         li.attributes().forEach(attr => {
             const name = attr.attr_name();
             this.liMarcAttrs[li.id()][name] =
@@ -676,19 +682,23 @@ export class LineitemListComponent implements OnInit {
     }
 
     toggleShowNotes(liId: number) {
-        this.showExpandFor = null;
         this.showNotesFor = this.showNotesFor === liId ? null : liId;
+        this.expandLineitem[liId] = false;
     }
 
     toggleShowExpand(liId: number) {
         this.showNotesFor = null;
-        this.showExpandFor = this.showExpandFor === liId ? null : liId;
+        this.expandLineitem[liId] = !this.expandLineitem[liId];
     }
 
     toggleExpandAll() {
         this.showNotesFor = null;
-        this.showExpandFor = null;
         this.expandAll = !this.expandAll;
+        if (this.expandAll) {
+            this.pageOfLineitems.forEach(li => this.expandLineitem[li.id()] = true);
+        } else {
+            this.pageOfLineitems.forEach(li => this.expandLineitem[li.id()] = false);
+        }
     }
 
     toggleFilterSort() {