LP#1850547: (follow-up) swap in ngbNav for the now-deprecated ngbTab user/gmcharlt/lp1850547-angular-acquisitions-search-v2
authorGalen Charlton <gmc@equinoxinitiative.org>
Thu, 13 Aug 2020 16:37:15 +0000 (12:37 -0400)
committerGalen Charlton <gmc@equinoxinitiative.org>
Thu, 13 Aug 2020 16:37:15 +0000 (12:37 -0400)
Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
Open-ILS/src/eg2/src/app/staff/acq/search/acq-search-form.component.ts
Open-ILS/src/eg2/src/app/staff/acq/search/acq-search.component.html
Open-ILS/src/eg2/src/app/staff/acq/search/acq-search.component.ts

index f0a4782..e9219d7 100644 (file)
@@ -1,6 +1,5 @@
 import {Component, OnInit, AfterViewInit, Input, Output, EventEmitter, ViewChild,
         OnChanges, SimpleChanges} from '@angular/core';
-import {NgbTabset, NgbTabChangeEvent} from '@ng-bootstrap/ng-bootstrap';
 import {Router, ActivatedRoute} from '@angular/router';
 import {StaffCommonModule} from '@eg/staff/common.module';
 import {IdlService, IdlObject} from '@eg/core/idl.service';
index d5d5a4d..87bd02c 100644 (file)
@@ -6,19 +6,24 @@
 </div>
 <div class="row" id="acq-search-page">
   <div class="col-lg-12">
-    <ngb-tabset #acqSearchTabs [activeId]="searchType" (tabChange)="onTabChange($event)">
-      <ngb-tab title="Line Items Search" i18n-title id="lineitems">
-        <ng-template ngbTabContent><eg-lineitem-results [initialSearchTerms]="urlSearchTerms"></eg-lineitem-results></ng-template>
-      </ngb-tab>
-      <ngb-tab title="Purchase Orders Search" i18n-title id="purchaseorders">
-        <ng-template ngbTabContent><eg-purchase-order-results [initialSearchTerms]="urlSearchTerms"></eg-purchase-order-results></ng-template>
-      </ngb-tab>
-      <ngb-tab title="Invoices Search" i18n-title id="invoices">
-        <ng-template ngbTabContent><eg-invoice-results [initialSearchTerms]="urlSearchTerms"></eg-invoice-results></ng-template>
-      </ngb-tab>
-      <ngb-tab title="Selection Lists Search" i18n-title id="selectionlists">
-        <ng-template ngbTabContent><eg-picklist-results [initialSearchTerms]="urlSearchTerms"></eg-picklist-results></ng-template>
-      </ngb-tab>
-    </ngb-tabset>
+    <ul ngbNav #acqSearchTabs="ngbNav" class="nav-tabs" [(activeId)]="searchType" (navChange)="onTabChange($event)">
+      <li [ngbNavItem]="'lineitems'">
+        <a ngbNavLink i18n>Line Items Search</a>
+        <ng-template ngbNavContent><eg-lineitem-results [initialSearchTerms]="urlSearchTerms"></eg-lineitem-results></ng-template>
+      </li>
+      <li [ngbNavItem]="'purchaseorders'">
+        <a ngbNavLink i18n>Purchase Orders Search</a>
+        <ng-template ngbNavContent><eg-purchase-order-results [initialSearchTerms]="urlSearchTerms"></eg-purchase-order-results></ng-template>
+      </li>
+      <li [ngbNavItem]="'invoices'">
+        <a ngbNavLink i18n>Inovices Search</a>
+        <ng-template ngbNavContent><eg-invoice-results [initialSearchTerms]="urlSearchTerms"></eg-invoice-results></ng-template>
+      </li>
+      <li [ngbNavItem]="'selectionlists'">
+        <a ngbNavLink i18n>Selection Lists Search</a>
+        <ng-template ngbNavContent><eg-picklist-results [initialSearchTerms]="urlSearchTerms"></eg-picklist-results></ng-template>
+      </li>
+    </ul>
+    <div [ngbNavOutlet]="acqSearchTabs"></div>
   </div>
 </div>
index 1ed74a8..959963f 100644 (file)
@@ -1,5 +1,5 @@
 import {Component, OnInit, AfterViewInit, ViewChild, ViewChildren, QueryList, OnDestroy} from '@angular/core';
-import {NgbTabset, NgbTabChangeEvent} from '@ng-bootstrap/ng-bootstrap';
+import {NgbNav, NgbNavChangeEvent} from '@ng-bootstrap/ng-bootstrap';
 import {Router, ActivatedRoute, ParamMap, RouterEvent, NavigationEnd} from '@angular/router';
 import {filter, takeUntil} from 'rxjs/operators';
 import {Subject} from 'rxjs';
@@ -24,8 +24,8 @@ export class AcqSearchComponent implements OnInit, AfterViewInit, OnDestroy {
 
     urlSearchTerms: AcqSearchTerm[] = [];
 
-    onTabChange: ($event: NgbTabChangeEvent) => void;
-    @ViewChild('acqSearchTabs', { static: true }) tabs: NgbTabset;
+    onTabChange: ($event: NgbNavChangeEvent) => void;
+    @ViewChild('acqSearchTabs', { static: true }) tabs: NgbNav;
     @ViewChildren(LineitemResultsComponent) liResults: QueryList<PurchaseOrderResultsComponent>;
     @ViewChildren(PurchaseOrderResultsComponent) poResults: QueryList<PurchaseOrderResultsComponent>;
     @ViewChildren(InvoiceResultsComponent) invResults: QueryList<PurchaseOrderResultsComponent>;
@@ -123,6 +123,8 @@ export class AcqSearchComponent implements OnInit, AfterViewInit, OnDestroy {
                 this.searchType = this.defaultSearchType;
                 this.router.navigate(['/staff', 'acq', 'search', this.searchType]);
             }
+        } else {
+            this.searchType = this.defaultSearchType;
         }
 
         this.onTabChange = ($event) => {