work history tabs updated on section update

frontend/angular/src/app/my-career-web/career-history/career-history/career-history.component.html

@@ -30,27 +30,32 @@
             <div class="assessment-body-tabs mc-card career-builder position-relative" *ngIf="careerProfile">
                 <p-tabView (onChange)="tabChanged($event)">
                     <p-tabPanel header="1{{isMobileView ? '' : '. Personal Data'}}" [selected]="activeTab === 'personal-data'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.PERSONAL_DATA ? 'completed' : ''">
-                        <app-personal-details #personalDetailsComponent [asChildComponent]="true" (detailsSaved)="tabChanged({index: 1})">
+                        <app-personal-details (careerProfileLoaded)="careerProfileUpdated($event)" #personalDetailsComponent [asChildComponent]="true" (detailsSaved)="tabChanged({index: 1})" *ngIf="activeTab === 'personal-data'">
                         </app-personal-details>
                     </p-tabPanel>
                     <p-tabPanel header="2{{isMobileView ? '' : '. Work History'}}" [selected]="activeTab === 'work-history'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.WORK_HISTORY ? 'completed' : ''">
-                        <app-work-history #workHistoryComponent (workSaved)="tabChanged({index: 2})">
+                        <app-work-history (careerProfileLoaded)="careerProfileUpdated($event)" #workHistoryComponent (workSaved)="tabChanged({index: 2})" *ngIf="activeTab === 'work-history'">
                         </app-work-history>
                     </p-tabPanel>
                     <p-tabPanel header="3{{isMobileView ? '' : '. Education'}}" [selected]="activeTab === 'education'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.EDUCATION ? 'completed' : ''">
-                        <app-education #educationComponent (educationSaved)="tabChanged({index: 3})"></app-education>
+                        <app-education (careerProfileLoaded)="careerProfileUpdated($event)" #educationComponent (educationSaved)="tabChanged({index: 3})" *ngIf="activeTab === 'education'">
+                        </app-education>
                     </p-tabPanel>
                     <p-tabPanel header="4{{isMobileView ? '' : '. Skills'}}" [selected]="activeTab === 'skills'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.SKILLS ? 'completed' : ''">
-                        <app-skills #skillsComponent (skillsSaved)="tabChanged({index: 4})"></app-skills>
+                        <app-skills (careerProfileLoaded)="careerProfileUpdated($event)" #skillsComponent (skillsSaved)="tabChanged({index: 4})" *ngIf="activeTab === 'skills'">
+                        </app-skills>
                     </p-tabPanel>
                     <p-tabPanel header="5{{isMobileView ? '' : '. References'}}" [selected]="activeTab === 'references'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.REFERENCES ? 'completed' : ''">
-                        <app-references #referencesComponent (refereeSaved)="tabChanged({index: 5})"></app-references>
+                        <app-references (careerProfileLoaded)="careerProfileUpdated($event)" #referencesComponent (refereeSaved)="tabChanged({index: 5})" *ngIf="activeTab === 'references'">
+                        </app-references>
                     </p-tabPanel>
                     <p-tabPanel header="6{{isMobileView ? '' : '. Templates'}}" [selected]="activeTab === 'templates'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.TEMPLATES ? 'completed' : ''">
-                        <app-templates></app-templates>
+                        <app-templates (careerProfileLoaded)="careerProfileUpdated($event)" *ngIf="activeTab === 'templates'">
+                        </app-templates>
                     </p-tabPanel>
                     <p-tabPanel header="7{{isMobileView ? '' : '. Publish'}}" [selected]="activeTab === 'publish'" rightIcon="fa fa-check" [headerStyleClass]="careerProfile?.ProfileBulderTabCompletion?.PUBLISH ? 'completed' : ''">
-                        <app-publish [asChild]="true"></app-publish>
+                        <app-publish (careerProfileLoaded)="careerProfileUpdated($event)" [asChild]="true" *ngIf="activeTab === 'publish'">
+                        </app-publish>
                     </p-tabPanel>
                 </p-tabView>
             </div>

frontend/angular/src/app/my-career-web/career-history/career-history/career-history.component.ts

@@ -88,4 +88,8 @@ export class CareerHistoryComponent extends BaseComponent implements OnInit {
         this.router.navigate([`/my-career-web/career-history/${this.tabs[$event.index]}`]);
     }
 
+    careerProfileUpdated(profile: CareerProfileModel): void {
+        this.careerProfile = profile;
+    }
+
 }

frontend/angular/src/app/my-career-web/career-history/career-history/education/education.component.html

@@ -20,8 +20,8 @@
 
             <div class="row education-wrapper" *ngFor="let education of careerProfile.EducationCertificates; let i = index;">
 
-                <div class="remove-record">
-                    <i class="fa fa-remove" (click)="removeEducation(education)"></i>
+                <div class="remove-record" (click)="removeEducation(education)">
+                    <i class="fa fa-remove"></i>
                 </div>
 
                 <div class="col-md-9">

frontend/angular/src/app/my-career-web/career-history/career-history/education/education.component.ts

@@ -27,6 +27,7 @@ export class EducationComponent extends BaseComponent implements OnInit {
 
     @ViewChild('form') form: NgForm;
     @Output() educationSaved = new EventEmitter();
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -57,7 +58,7 @@ export class EducationComponent extends BaseComponent implements OnInit {
                 }
                 this.utilsService.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.EducationCertificates);
                 this.addEducation(true);
-                this.isLoading = false;
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.utilsService.handleError(err);
                 this.isLoading = false;

frontend/angular/src/app/my-career-web/career-history/career-history/publish/publish.component.ts

-import { Component, Input, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { PersonalDetailsService } from '../../../services/personal-details.service';
 import { CareerProfileModel } from '../../../models/career-profile.model';
 import { UtilsService } from '../../../../oneit/services/utils.service';
@@ -18,6 +18,7 @@ export class PublishComponent extends BaseComponent implements OnInit {
     assocs = [];
     careerProfile = new CareerProfileModel();
     @Input() asChild = false;
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -40,6 +41,7 @@ export class PublishComponent extends BaseComponent implements OnInit {
                 this.isLoading = false;
                 this.careerProfile = response;
                 this.updatedObjs[this.careerProfile.ObjectID] = this.careerProfile;
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/career-history/career-history/references/references.component.ts

@@ -27,6 +27,7 @@ export class ReferencesComponent extends BaseComponent implements OnInit {
 
     @ViewChild('form') form: NgForm;
     @Output() refereeSaved = new EventEmitter();
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -53,7 +54,7 @@ export class ReferencesComponent extends BaseComponent implements OnInit {
                 this.updatedObjs[this.careerProfile.ObjectID] = this.careerProfile;
                 this.utilsService.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.Referees);
                 this.addReferee(true);
-                this.isLoading = false;
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/career-history/career-history/skills/skills.component.ts

@@ -25,6 +25,7 @@ export class SkillsComponent extends BaseComponent implements OnInit {
 
     @ViewChild('form') form: NgForm;
     @Output() skillsSaved = new EventEmitter();
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -51,7 +52,7 @@ export class SkillsComponent extends BaseComponent implements OnInit {
                 this.updatedObjs[this.careerProfile.ObjectID] = this.careerProfile;
                 this.utilsService.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.Skills);
                 this.addSkill(true);
-                this.isLoading = false;
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/career-history/career-history/templates/templates.component.ts

-import { Component, OnInit } from '@angular/core';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
 import { BaseComponent } from '../../../base/base.component';
 import { CareerProfileModel } from '../../../models/career-profile.model';
 import { PersonalDetailsService } from '../../../services/personal-details.service';
@@ -22,6 +22,7 @@ export class TemplatesComponent extends BaseComponent implements OnInit {
     };
     templatesShown = false;
     apiBase = environment.baseUrl;
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -51,6 +52,7 @@ export class TemplatesComponent extends BaseComponent implements OnInit {
                     });
                     this.careerProfile.Candidate.AllTempletes.sort((t1, t2) => t1.SortOrder - t2.SortOrder);
                 }
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/career-history/career-history/work-history/work-history.component.ts

@@ -26,6 +26,7 @@ export class WorkHistoryComponent extends BaseComponent implements OnInit {
 
     @ViewChild('form') form: NgForm;
     @Output() workSaved = new EventEmitter();
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     constructor(
         private personalDetailsService: PersonalDetailsService,
@@ -58,6 +59,7 @@ export class WorkHistoryComponent extends BaseComponent implements OnInit {
                 }
                 this.utilsService.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.WorkExperiences);
                 this.addWorkExperience(true);
+                this.careerProfileLoaded.emit(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/dashboard/home/home.component.scss

@@ -128,6 +128,7 @@
                         color: #12A8DE;
                         cursor: pointer;
                         transition: .3s;
+                        white-space: nowrap;
 
                         &:hover {
                             background: #12A8DE;

frontend/angular/src/app/my-career-web/mc-shared/personal-details/personal-details.component.ts

@@ -28,6 +28,7 @@ export class PersonalDetailsComponent extends BaseComponent implements OnInit {
     assocs = ['Candidate.User', 'Candidate.OccupationPreference'];
     @Input() asChildComponent = false;
     @Output() detailsSaved = new EventEmitter();
+    @Output() careerProfileLoaded = new EventEmitter<CareerProfileModel>();
 
     @ViewChild('form') form: NgForm;
 
@@ -97,6 +98,7 @@ export class PersonalDetailsComponent extends BaseComponent implements OnInit {
                     this.careerProfile.Candidate.EmploymentPreference = this.careerProfile.Candidate.EmploymentPreference.map(p => p.Value);
                 }
                 this.personalDetailsService.careerProfileUpdated = this.careerProfile;
+                this.careerProfileLoaded.emit(this.careerProfile);
                 this.isLoading = false;
             }, err => {
                 this.isLoading = false;