Issue 135

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/assessment-energy-opportunities-form.component.html

@@ -10,17 +10,18 @@ <h2 class="col-sm-5 col-form-label" for="assessmentName">Energy Efficiency Oppor
             <h2 class="accordion-header">
                 <button class="accordion-button" type="button" data-bs-toggle="collapse"
                     [attr.data-bs-target]="'#'+energyOpportunityGuid" aria-expanded="true"
-                    [attr.aria-controls]="energyOpportunityGuid" [ngClass]="{'collapsed': accordionIndex != index}"
-                    (click)="setAccordionIndex(index)">
+                    [attr.aria-controls]="energyOpportunityGuid"
+                    [ngClass]="{'collapsed': accordionGuid != energyOpportunityGuid}"
+                    (click)="toggleBS(energyOpportunityGuid)">
                     <fa-icon class="pe-2" [icon]="faFileLines"></fa-icon> {{energyOpportunityGuid |
                     energyOpportunityDisplay:energyOpportunities}}
                 </button>
             </h2>
-            <div [id]="energyOpportunityGuid" class="accordion-collapse collapse"
-                data-bs-parent="#energyOpportunityAccordion" [ngClass]="{'show': accordionIndex == index}">
+            <div [id]="'#'+energyOpportunityGuid" class="accordion-collapse collapse"
+                data-bs-parent="#energyOpportunityAccordion">
                 <div class="accordion-body">
                     <app-energy-opportunity-setup-form
-                        [energyOpportunityGuid]="energyOpportunityGuid"></app-energy-opportunity-setup-form>
+                        [energyOpportunityGuid]="energyOpportunityGuid" (emitInitialized)="childFormInitialized(energyOpportunityGuid)"></app-energy-opportunity-setup-form>
                 </div>
             </div>
         </div>

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/assessment-energy-opportunities-form.component.spec.ts

@@ -12,6 +12,9 @@ import { RouterTestingModule } from '@angular/router/testing';
 import { FormsModule } from '@angular/forms';
 import { EnergyOpportunitySetupFormComponent } from './energy-opportunity-setup-form/energy-opportunity-setup-form.component';
 import { NebFormsAccordionComponent } from '../neb-forms-accordion/neb-forms-accordion.component';
+import { LocalStorageDataService } from 'src/app/shared/shared-services/local-storage-data.service';
+import { ChangeDetectorRef } from '@angular/core';
+import { BootstrapService } from 'src/app/shared/shared-services/bootstrap.service';
 
 describe('AssessmentEnergyOpportunitiesFormComponent', () => {
   let component: AssessmentEnergyOpportunitiesFormComponent;
@@ -28,6 +31,9 @@ describe('AssessmentEnergyOpportunitiesFormComponent', () => {
   let energyOpportunityIdbService: Partial<EnergyOpportunityIdbService> = {
     energyOpportunities: new BehaviorSubject<Array<IdbEnergyOpportunity>>([])
   }
+  let localStorageDataService: Partial<LocalStorageDataService> = {};
+  let cd: Partial<ChangeDetectorRef> = {};
+  let bootstrapService: Partial<BootstrapService> = {};
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [FontAwesomeModule, RouterTestingModule, FormsModule],
@@ -36,6 +42,9 @@ describe('AssessmentEnergyOpportunitiesFormComponent', () => {
         { provide: SetupWizardService, useValue: setupWizardService },
         { provide: AssessmentIdbService, useValue: assessmentIdbService },
         { provide: EnergyOpportunityIdbService, useValue: energyOpportunityIdbService },
+        { provide: LocalStorageDataService, useValue: localStorageDataService },
+        { provide: ChangeDetectorRef, useValue: cd },
+        { provide: BootstrapService, useValue: bootstrapService }
       ]
     })
     .compileComponents();

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/assessment-energy-opportunities-form.component.ts

@@ -1,10 +1,12 @@
-import { Component } from '@angular/core';
+import { ChangeDetectorRef, Component } from '@angular/core';
 import { IconDefinition, faFileLines, faPlus } from '@fortawesome/free-solid-svg-icons';
 import { Subscription, firstValueFrom } from 'rxjs';
 import { AssessmentIdbService } from 'src/app/indexed-db/assessment-idb.service';
 import { EnergyOpportunityIdbService } from 'src/app/indexed-db/energy-opportunity-idb.service';
 import { IdbAssessment } from 'src/app/models/assessment';
 import { IdbEnergyOpportunity, getNewIdbEnergyOpportunity } from 'src/app/models/energyOpportunity';
+import { BootstrapService } from 'src/app/shared/shared-services/bootstrap.service';
+import { LocalStorageDataService } from 'src/app/shared/shared-services/local-storage-data.service';
 
 @Component({
   selector: 'app-assessment-energy-opportunities-form',
@@ -23,10 +25,14 @@ export class AssessmentEnergyOpportunitiesFormComponent {
 
   assessmentEnergyOpportunityGuids: Array<string> = [];
 
-  accordionIndex: number = 0;
+  accordionGuid: string;
+  isAddNew: boolean;
   constructor(
     private energyOpportunityIdbService: EnergyOpportunityIdbService,
-    private assessmentIdbService: AssessmentIdbService
+    private assessmentIdbService: AssessmentIdbService,
+    private bootstrapService: BootstrapService,
+    private cd: ChangeDetectorRef,
+    private localStorageDataService: LocalStorageDataService
   ) {
   }
 
@@ -42,11 +48,20 @@ export class AssessmentEnergyOpportunitiesFormComponent {
     });
   }
 
-  ngOnDestroy(){
+  ngOnDestroy() {
     this.energyOpportuntiesSub.unsubscribe();
     this.assessmentSub.unsubscribe();
   }
 
+  ngAfterViewInit() {
+    //open the accordion for last viewed energy opp
+    let energyOppGuid: string = this.localStorageDataService.energyOppAccordionGuid;
+    if (energyOppGuid && this.assessmentEnergyOpportunityGuids.includes(energyOppGuid)) {
+      this.toggleBS(energyOppGuid);
+      this.cd.detectChanges();
+    }
+  }
+
   setAssessmentEnergyOpportunityGuids() {
     //only want to update opportunity list if changes made
     //otherwise forms get re-init when the list updates
@@ -61,8 +76,8 @@ export class AssessmentEnergyOpportunitiesFormComponent {
         this.assessmentEnergyOpportunityGuids = tmpAssessmentOpportunities;
       } else {
         let notEqual: boolean = false;
-        for(let i = 0; i < this.assessmentEnergyOpportunityGuids.length; i++){
-          if(tmpAssessmentOpportunities[i] != this.assessmentEnergyOpportunityGuids[i]){
+        for (let i = 0; i < this.assessmentEnergyOpportunityGuids.length; i++) {
+          if (tmpAssessmentOpportunities[i] != this.assessmentEnergyOpportunityGuids[i]) {
             notEqual = true;
           }
         }
@@ -74,6 +89,7 @@ export class AssessmentEnergyOpportunitiesFormComponent {
   }
 
   async addEnergyOpportunity() {
+    this.isAddNew = true;
     let newOpportunity: IdbEnergyOpportunity = getNewIdbEnergyOpportunity(this.assessment.userId, this.assessment.companyId, this.assessment.facilityId, this.assessment.guid);
     let assessmentEnergyOpportunities: Array<IdbEnergyOpportunity> = this.energyOpportunities.filter(prj => {
       return prj.assessmentId == this.assessment.guid;
@@ -83,7 +99,21 @@ export class AssessmentEnergyOpportunitiesFormComponent {
     await this.energyOpportunityIdbService.setEnergyOpportunities();
   }
 
-  setAccordionIndex(num: number){
-    this.accordionIndex = num;
+  toggleBS(opportunityGuid: string) {
+    this.bootstrapService.bsCollapse('#' + opportunityGuid);
+    if (this.accordionGuid != opportunityGuid) {
+      this.accordionGuid = opportunityGuid;
+    } else {
+      this.accordionGuid = undefined;
+    }
+    this.localStorageDataService.setEnergyOppAccordionGuid(this.accordionGuid);
+  }
+
+  childFormInitialized(oppGuid: string) {
+    if (this.isAddNew == true) {
+      this.toggleBS(oppGuid);
+      this.isAddNew = false;
+      this.cd.detectChanges();
+    }
   }
 }

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/energy-opportunity-setup-form/energy-opportunity-setup-form.component.html

@@ -116,10 +116,10 @@ <h6>
             </div>
             <div class="dropdown">
                 <button class="btn btn-outline-neb btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown"
-                    aria-expanded="false">
+                    aria-expanded="false" (click)="toggleAddNebDropdown()">
                     <fa-icon [icon]="faPlus"></fa-icon> Add NEB
                 </button>
-                <ul class="dropdown-menu">
+                <ul class="dropdown-menu" [ngClass]="{'show': showAddNebDropdown}">
                     <li>
                         <a class="dropdown-item" (click)="addNEB()">
                             <fa-icon [icon]="faPlus"></fa-icon> Add Custom NEB

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/energy-opportunity-setup-form/energy-opportunity-setup-form.component.spec.ts

@@ -12,6 +12,9 @@ import { FormsModule } from '@angular/forms';
 import { EnergyOpportunityIdbService } from 'src/app/indexed-db/energy-opportunity-idb.service';
 import { IdbEnergyOpportunity, getNewIdbEnergyOpportunity } from 'src/app/models/energyOpportunity';
 import { NebFormsAccordionComponent } from '../../neb-forms-accordion/neb-forms-accordion.component';
+import { LocalStorageDataService } from 'src/app/shared/shared-services/local-storage-data.service';
+import { ChangeDetectorRef } from '@angular/core';
+import { BootstrapService } from 'src/app/shared/shared-services/bootstrap.service';
 
 describe('EnergyOpportunitySetupFormComponent', () => {
   let component: EnergyOpportunitySetupFormComponent;
@@ -29,6 +32,9 @@ describe('EnergyOpportunitySetupFormComponent', () => {
     nonEnergyBenefits: new BehaviorSubject<Array<IdbNonEnergyBenefit>>([])
   };
   let dbChangesService: Partial<DbChangesService> = {}
+  let localStorageDataService: Partial<LocalStorageDataService> = {};
+  let cd: Partial<ChangeDetectorRef> = {};
+  let bootstrapService: Partial<BootstrapService> = {};
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [FontAwesomeModule, RouterTestingModule, FormsModule],
@@ -38,6 +44,9 @@ describe('EnergyOpportunitySetupFormComponent', () => {
         { provide: EnergyOpportunityIdbService, useValue: energyOpportunityIdbService },
         { provide: NonEnergyBenefitsIdbService, useValue: nonEnergyBenefitsIdbService },
         { provide: DbChangesService, useValue: dbChangesService },
+        { provide: LocalStorageDataService, useValue: localStorageDataService },
+        { provide: ChangeDetectorRef, useValue: cd },
+        { provide: BootstrapService, useValue: bootstrapService }
       ]
 
     })

src/app/setup-wizard/data-collection/on-site-assessment/assessment-energy-opportunities-form/energy-opportunity-setup-form/energy-opportunity-setup-form.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input } from '@angular/core';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { SetupWizardService } from 'src/app/setup-wizard/setup-wizard.service';
 import { IconDefinition, faFileLines, faPlus, faSearchPlus, faTrash, faWeightHanging } from '@fortawesome/free-solid-svg-icons';
 import { EnergyOpportunityType, FanOpportunities } from 'src/app/shared/constants/energyOpportunityOptions';
@@ -17,6 +17,8 @@ import { firstValueFrom } from 'rxjs';
 export class EnergyOpportunitySetupFormComponent {
   @Input({ required: true })
   energyOpportunityGuid: string;
+  @Output('emitInitialized')
+  emitInitialized = new EventEmitter<boolean>();
 
 
   energyOpportunity: IdbEnergyOpportunity;
@@ -27,8 +29,9 @@ export class EnergyOpportunitySetupFormComponent {
   faPlus: IconDefinition = faPlus;
   faWeightHanging: IconDefinition = faWeightHanging;
 
-  opportunityTypes: Array<EnergyOpportunityType> = [{value: 'other', label: 'Other'}];
+  opportunityTypes: Array<EnergyOpportunityType> = [{ value: 'other', label: 'Other' }];
   displayDeleteModal: boolean = false;
+  showAddNebDropdown: boolean = false;
   constructor(
     private energyOpportunityIdbService: EnergyOpportunityIdbService,
     private dbChangesService: DbChangesService,
@@ -44,6 +47,10 @@ export class EnergyOpportunitySetupFormComponent {
   ngOnDestroy() {
   }
 
+  ngAfterViewInit() {
+    this.emitInitialized.emit(true);
+  }
+
   async deleteEnergyOpportunity() {
     await this.dbChangesService.deleteEnergyOpportunity(this.energyOpportunity)
     this.closeDeleteModal();
@@ -62,18 +69,22 @@ export class EnergyOpportunitySetupFormComponent {
   }
 
   showSuggestedNEBs() {
+    this.showAddNebDropdown = false;
     this.setupWizardService.displayAddNebsModal.next({
       assessmentId: this.energyOpportunity.assessmentId,
       energyOpportunityId: this.energyOpportunity.guid
     });
   }
 
   async addNEB() {
+    this.showAddNebDropdown = false;
     let newNonEnergyBenefit: IdbNonEnergyBenefit = getNewIdbNonEnergyBenefit(this.energyOpportunity.userId, this.energyOpportunity.companyId, this.energyOpportunity.facilityId, this.energyOpportunity.assessmentId, this.energyOpportunity.guid, undefined, true);
     await firstValueFrom(this.nonEnergyBenefitsIdbService.addWithObservable(newNonEnergyBenefit));
     await this.nonEnergyBenefitsIdbService.setNonEnergyBenefits();
   }
 
+  toggleAddNebDropdown() {
+    this.showAddNebDropdown = !this.showAddNebDropdown;
+  }
 
-
 }

src/app/setup-wizard/data-collection/on-site-assessment/assessment-nebs-form/assessment-nebs-form.component.html

@@ -5,10 +5,10 @@ <h6 class="pt-2 pb-2">
         </div>
         <div class="dropdown">
             <button class="btn btn-outline-neb btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown"
-                aria-expanded="false">
+                aria-expanded="false" (click)="toggleAddNebDropdown()">
                 <fa-icon [icon]="faPlus"></fa-icon> Add NEB
             </button>
-            <ul class="dropdown-menu">
+            <ul class="dropdown-menu" [ngClass]="{'show': showAddNebDropdown}">
                 <li>
                     <a class="dropdown-item" (click)="addNEB()">
                         <fa-icon [icon]="faPlus"></fa-icon> Add Custom NEB

src/app/setup-wizard/data-collection/on-site-assessment/assessment-nebs-form/assessment-nebs-form.component.spec.ts

@@ -16,6 +16,9 @@ import { EnergyOpportunityNebsTableComponent } from './energy-opportunity-nebs-t
 import { EnergyOpportunityIdbService } from 'src/app/indexed-db/energy-opportunity-idb.service';
 import { IdbEnergyOpportunity } from 'src/app/models/energyOpportunity';
 import { EnergyOpportunityNebsListPipe } from './energy-opportunity-nebs-table/energy-opportunity-nebs-list.pipe';
+import { LocalStorageDataService } from 'src/app/shared/shared-services/local-storage-data.service';
+import { ChangeDetectorRef } from '@angular/core';
+import { BootstrapService } from 'src/app/shared/shared-services/bootstrap.service';
 
 describe('AssessmentNebsFormComponent', () => {
   let component: AssessmentNebsFormComponent;
@@ -35,6 +38,9 @@ describe('AssessmentNebsFormComponent', () => {
   let energyOpportunityIdbService: Partial<EnergyOpportunityIdbService> = {
     energyOpportunities: new BehaviorSubject<Array<IdbEnergyOpportunity>>([])
   }
+  let localStorageDataService: Partial<LocalStorageDataService> = {};
+  let cd: Partial<ChangeDetectorRef> = {};
+  let bootstrapService: Partial<BootstrapService> = {};
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [FontAwesomeModule, FormsModule, RouterTestingModule],
@@ -43,7 +49,10 @@ describe('AssessmentNebsFormComponent', () => {
         { provide: SetupWizardService, useValue: setupWizardService },
         { provide: AssessmentIdbService, useValue: assessmentIdbService },
         { provide: NonEnergyBenefitsIdbService, useValue: nonEnergyBenefitsIdbService },
-        { provide: EnergyOpportunityIdbService, useValue: energyOpportunityIdbService }
+        { provide: EnergyOpportunityIdbService, useValue: energyOpportunityIdbService },
+        { provide: LocalStorageDataService, useValue: localStorageDataService },
+        { provide: ChangeDetectorRef, useValue: cd },
+        { provide: BootstrapService, useValue: bootstrapService }
       ]
     })
       .compileComponents();

src/app/setup-wizard/data-collection/on-site-assessment/assessment-nebs-form/assessment-nebs-form.component.ts

@@ -23,6 +23,7 @@ export class AssessmentNebsFormComponent {
 
   newNebName: string;
   displayNebModal: boolean = false;
+  showAddNebDropdown: boolean = false;
   constructor(private assessmentIdbService: AssessmentIdbService,
     private setupWizardService: SetupWizardService,
     private nonEnergyBenefitIdbService: NonEnergyBenefitsIdbService
@@ -40,12 +41,20 @@ export class AssessmentNebsFormComponent {
   }
 
   openNebModal() {
+    this.showAddNebDropdown = false;
     this.setupWizardService.displayAddNebsModal.next({ assessmentId: this.assessment.guid, energyOpportunityId: undefined });
   }
 
   async addNEB() {
+    this.showAddNebDropdown = false;
     let newNonEnergyBenefit: IdbNonEnergyBenefit = getNewIdbNonEnergyBenefit(this.assessment.userId, this.assessment.companyId, this.assessment.facilityId, this.assessment.guid, undefined, undefined, true);
     await firstValueFrom(this.nonEnergyBenefitIdbService.addWithObservable(newNonEnergyBenefit))
     await this.nonEnergyBenefitIdbService.setNonEnergyBenefits();
   }
+
+  toggleAddNebDropdown() {
+    this.showAddNebDropdown = !this.showAddNebDropdown;
+
+  }
+
 }

src/app/setup-wizard/data-collection/on-site-assessment/neb-forms-accordion/neb-forms-accordion.component.html

@@ -1,18 +1,18 @@
 <ng-template [ngIf]="nebGuids.length > 0" [ngIfElse]="noNEBsBlock">
-    <div class="accordion" id="nebFormsAccordion">
-        <div class="accordion-item" *ngFor="let nebGuid of nebGuids; let index = index;">
+    <div class="accordion" [id]="'nebFormsAccordion_'+energyOpportunity?.guid">
+        <div class="accordion-item" *ngFor="let nebGuid of nebGuids; let index = index; let last = last;">
             <h2 class="accordion-header">
-                <button class="accordion-button" type="button" data-bs-toggle="collapse"
-                    [attr.data-bs-target]="'#'+nebGuid" aria-expanded="true" [attr.aria-controls]="nebGuid"
-                    [ngClass]="{'collapsed': accordionIndex != index}" (click)="setAccordionIndex(index)">
+                <button class="accordion-button" type="button" [attr.data-bs-target]="'#'+nebGuid" aria-expanded="true"
+                    [attr.aria-controls]="nebGuid" (click)="toggleBS(nebGuid)"
+                    [ngClass]="{'collapsed': accordionGuid != nebGuid}">
                     <fa-icon class="pe-2" [icon]="faWeightHanging"></fa-icon> {{nebGuid |
                     nebDisplay:nonEnergyBenefits}}
                 </button>
             </h2>
-            <div [id]="nebGuid" class="accordion-collapse collapse" data-bs-parent="#nebFormsAccordion"
-                [ngClass]="{'show': accordionIndex == index}">
+            <div [id]="'#'+nebGuid" class="accordion-collapse collapse" [attr.data-bs-parent]="'#nebFormsAccordion_'+energyOpportunity?.guid">
                 <div class="accordion-body">
-                    <app-neb-setup-form [nebGuid]="nebGuid"></app-neb-setup-form>
+                    <app-neb-setup-form [nebGuid]="nebGuid"
+                        (emitInitialized)="childFormInitialized(nebGuid, last)"></app-neb-setup-form>
                 </div>
             </div>
         </div>

src/app/setup-wizard/data-collection/on-site-assessment/neb-forms-accordion/neb-forms-accordion.component.spec.ts

@@ -5,6 +5,9 @@ import { NonEnergyBenefitsIdbService } from 'src/app/indexed-db/non-energy-benef
 import { IdbNonEnergyBenefit } from 'src/app/models/nonEnergyBenefit';
 import { BehaviorSubject } from 'rxjs';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { LocalStorageDataService } from 'src/app/shared/shared-services/local-storage-data.service';
+import { ChangeDetectorRef } from '@angular/core';
+import { BootstrapService } from 'src/app/shared/shared-services/bootstrap.service';
 
 describe('NebFormsAccordionComponent', () => {
   let component: NebFormsAccordionComponent;
@@ -13,12 +16,19 @@ describe('NebFormsAccordionComponent', () => {
   let nonEnergyBenefitsIdbService: Partial<NonEnergyBenefitsIdbService> = {
     nonEnergyBenefits: new BehaviorSubject<Array<IdbNonEnergyBenefit>>([])
   };
+
+  let localStorageDataService: Partial<LocalStorageDataService> = {};
+  let cd: Partial<ChangeDetectorRef> = {};
+  let bootstrapService: Partial<BootstrapService> = {};
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [FontAwesomeModule],
       declarations: [NebFormsAccordionComponent],
       providers: [
-        { provide: NonEnergyBenefitsIdbService, useValue: nonEnergyBenefitsIdbService }
+        { provide: NonEnergyBenefitsIdbService, useValue: nonEnergyBenefitsIdbService },
+        { provide: LocalStorageDataService, useValue: localStorageDataService },
+        { provide: ChangeDetectorRef, useValue: cd },
+        { provide: BootstrapService, useValue: bootstrapService }
       ]
     })
     .compileComponents();