skills & references added for profile builder

frontend/angular/src/app/components/my-career-web/assessment/diversity-profile/diversity-profile.component.html

@@ -9,10 +9,9 @@
             <div class="header-actions">
                 <span class="auto-saved" *ngIf="autoSaveLabel">Auto saved {{autoSaveLabel}}</span>
 
-                <button pButton label="Save & exit" (click)="exit()" class="ui-button-info"></button>
+                <button pButton label="Save & exit" [disabled]="isSaving" (click)="exit()" class="ui-button-info"></button>
             </div>
         </div>
-        <p-progressBar [value]="20"></p-progressBar>
 
         <div class="assessment-body container">
 
@@ -30,18 +29,20 @@
             <div class="assessment-body-question-wrapper mc-card">
                 <app-overlay [isActive]="isLoading"></app-overlay>
 
-                <div class="question-wrapper" *ngFor="let diversity of diversityProfiles;">
+                <div class="question-wrapper" *ngFor="let diversity of diversityProfiles; let i = index;">
                     <div class="question-title">{{diversity.QuestionText}}?</div>
 
                     <div class="answer-options" *ngIf="!diversity.MultipleAnswers">
                         <div class="answer-option" *ngFor="let answer of diversity.Answers;">
-                            <p-radioButton [label]="answer.Answer"></p-radioButton>
+                            <p-radioButton [value]="answer" [label]="answer.Answer" name="Q{{i}}" [(ngModel)]="selectedAnswers[diversity.ObjectID]">
+                            </p-radioButton>
                         </div>
                     </div>
 
                     <div class="answer-options" *ngIf="diversity.MultipleAnswers">
-                        <div class="answer-option" *ngFor="let answer of diversity.Answers;">
-                            <p-checkbox [label]="answer.Answer" [binary]="true" [(ngModel)]="answer.IsSelected"></p-checkbox>
+                        <div class="answer-option" *ngFor="let answer of diversity.Answers; let i = index;">
+                            <p-checkbox [label]="answer.Answer" name="M{{i}}" [value]="answer.ObjectID" [(ngModel)]="selectedAnswers[diversity.ObjectID]">
+                            </p-checkbox>
                         </div>
                     </div>
                 </div>

frontend/angular/src/app/components/my-career-web/assessment/diversity-profile/diversity-profile.component.ts

@@ -19,6 +19,7 @@ export class DiversityProfileComponent extends BaseComponent implements OnInit {
     autoSaveInterval;
     autoSavedOn;
     autoSaveLabel = '';
+    selectedAnswers = [];
 
     constructor(
         private as: AssessmentService,
@@ -41,19 +42,48 @@ export class DiversityProfileComponent extends BaseComponent implements OnInit {
                 this.isLoading = false;
                 this.autoSavedOn = new Date();
                 this.diversityProfiles = response;
-                console.log(this.diversityProfiles);
+                this.setAnswers();
             }, err => {
                 this.isLoading = false;
                 this.hs.handleHttpError(err);
             });
     }
 
+    setAnswers(): void {
+        this.diversityProfiles.forEach(div => {
+            if (!div.MultipleAnswers) {
+                this.selectedAnswers[div.ObjectID] = div.Answers.find(a => a.IsSelected);
+            } else {
+                this.selectedAnswers[div.ObjectID] = div.Answers.filter(a => a.IsSelected).map(a => a.ObjectID);
+            }
+        });
+    }
+
     exit(): void {
-        this.r.navigate(['/my-career-web/dashboard/home']);
+        this.isSaving = true;
+        const answers = [];
+        this.diversityProfiles.forEach(div => {
+            if (div.MultipleAnswers) {
+                answers.push(...this.selectedAnswers[div.ObjectID]);
+            } else {
+                answers.push(this.selectedAnswers[div.ObjectID])
+            }
+        });
+        this.as.saveDiversityProfile({Answers: answers})
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(response => {
+                this.isSaving = false;
+                this.hs.oneItHttpResponse(response);
+                this.r.navigate(['/my-career-web/dashboard/home']);
+            }, err => {
+                this.isSaving = false;
+                this.hs.handleHttpError(err);
+            });
     }
 
     setAutoSaveInterval(): void {
         if (!this.autoSaveInterval) {
+            this.autoSave();
             setInterval(() => {
                 this.autoSave();
             }, 60000);

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

@@ -27,7 +27,9 @@
                     <div class="col-md-6 form-group">
                         <label>Course or Certification</label>
                         <app-form-control>
-                            <input type="text" class="form-control" placeholder="Certification" name="Certification" [(ngModel)]="education.Certification">
+                            <p-autoComplete [suggestions]="certifications" name="Certification{{i}}" [(ngModel)]="education.Certification" placeholder="Enter Certificate" required
+                                            (completeMethod)="getCertificates($event)" [forceSelection]="true" dataKey="ObjectID" field="CertificateName">
+                            </p-autoComplete>
                         </app-form-control>
                     </div>
                 </div>
@@ -69,8 +71,19 @@
                 <div class="row">
                     <div class="col-md-4 form-group">
                         <label>Upload Certificate</label>
-                        <p-fileUpload mode="basic" name="Upload your Cover Letter" withCredentials="true" auto="true"
-                                      chooseLabel="Browse"></p-fileUpload>
+
+                        <p-fileUpload *ngIf="!education.Certificate" name="File" withCredentials="true" auto="true" chooseLabel="Browse" [disabled]="uploadingFile"
+                                      url="{{apiUrl}}uploadFile" (onUpload)="onUpload($event, education)" (onBeforeUpload)="uploadStarted()">
+                            <ng-template let-file pTemplate="file">
+                                <div>Uploading...</div>
+                            </ng-template>
+                        </p-fileUpload>
+                        <div class="uploaded-attachment" *ngIf="education?.Certificate">
+                            <span *ngIf="!education.Certificate.URI">{{education.Certificate.Name}}</span>
+                            <a *ngIf="education.Certificate.URI" target="_blank" [href]="apiUrl + education.Certificate.URI">{{education.Certificate.Name}}</a>
+                            <i class="pi pi-times" (click)="removeAttachment(education)"></i>
+                        </div>
+
                     </div>
                 </div>
             </div>
@@ -80,7 +93,7 @@
 
         <div class="row">
             <div class="col-md-12">
-                <button pButton class="btn btn-info-outline add-more" label="Add Education +" (click)="addEducation()"></button>
+                <button pButton class="btn btn-info-outline add-more" label="Add education +" (click)="addEducation()"></button>
             </div>
         </div>
 
@@ -89,7 +102,7 @@
 
 
     <div class="d-flex justify-content-center" style="margin-top: 48px;">
-        <button pButton label="Next Section" class="ui-button-info next-section" (click)="saveEducation()"></button>
+        <button pButton label="Next Section" class="ui-button-info next-section" [disabled]="isSaving || uploadingFile" (click)="saveEducation()"></button>
     </div>
 
 

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

@@ -8,6 +8,7 @@ import { NgForm } from '@angular/forms';
 import { BaseComponent } from '../../../base/base.component';
 import { takeUntil } from 'rxjs/operators';
 import { EducationModel } from '../../../models/education.model';
+import { environment } from '../../../../../../environments/environment';
 
 @Component({
     selector: 'app-education',
@@ -18,6 +19,9 @@ export class EducationComponent extends BaseComponent implements OnInit {
 
     assocs = ['EducationCertificates'];
     careerProfile = new CareerProfileModel();
+    apiUrl = environment.baseUrl;
+    uploadingFile = false;
+    certifications = [];
 
     @ViewChild('form') form: NgForm;
     @Output() educationSaved = new EventEmitter();
@@ -96,4 +100,31 @@ export class EducationComponent extends BaseComponent implements OnInit {
             })
     }
 
+    getCertificates($event): void {
+        this.ps.getCertifications({CertificateName: $event.query})
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(response => {
+                this.certifications = response;
+            }, err => {
+                this.hs.handleHttpError(err);
+            })
+    }
+
+    uploadStarted(): void {
+        this.uploadingFile = true;
+    }
+
+    onUpload($event, education: EducationModel): void {
+        const response = JSON.parse($event.xhr.response);
+        education.Certificate = {
+            FileToken: response.files[0].token,
+            Name: response.files[0].fileName,
+        };
+        this.uploadingFile = false;
+    }
+
+    removeAttachment(education: EducationModel): void {
+        delete education.Certificate;
+    }
+
 }

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

@@ -62,7 +62,8 @@
                             </ng-template>
                         </p-fileUpload>
                         <div class="uploaded-attachment" *ngIf="referee?.WrittenReference">
-                            {{referee.WrittenReference.Name}}
+                            <span *ngIf="!referee.WrittenReference.URI">{{referee.WrittenReference.Name}}</span>
+                            <a *ngIf="referee.WrittenReference.URI" target="_blank" [href]="apiUrl + referee.WrittenReference.URI">{{referee.WrittenReference.Name}}</a>
                             <i class="pi pi-times" (click)="removeAttachment(referee)"></i>
                         </div>
                     </div>
@@ -76,7 +77,7 @@
 
         <div class="row">
             <div class="col-md-12">
-                <button pButton class="btn btn-info-outline add-more" label="Add Reference +" (click)="addReferee()">
+                <button pButton class="btn btn-info-outline add-more" label="Add reference +" (click)="addReferee()">
                 </button>
             </div>
         </div>

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

@@ -48,7 +48,6 @@ export class ReferencesComponent extends BaseComponent implements OnInit {
                 this.us.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.Referees);
                 this.addReferee(true);
                 this.isLoading = false;
-                console.log(this.careerProfile);
             }, err => {
                 this.hs.handleHttpError(err);
                 this.isLoading = false;

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

@@ -38,7 +38,7 @@
 
         <div class="row">
             <div class="col-md-12">
-                <button pButton class="btn btn-info-outline add-more" label="Add Skill +" (click)="addSkill()"></button>
+                <button pButton class="btn btn-info-outline add-more" label="Add skill +" (click)="addSkill()"></button>
             </div>
         </div>
 

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

@@ -55,7 +55,7 @@ export class SkillsComponent extends BaseComponent implements OnInit {
     }
 
     getSkills($event): void {
-        this.ps.getSkills({JobTitle: $event.query})
+        this.ps.getSkills({Description: $event.query})
             .pipe(takeUntil(this.componentInView))
             .subscribe(response => {
                 this.skills = response;

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

@@ -89,7 +89,7 @@
 
         <div class="row">
             <div class="col-md-12">
-                <button pButton class="btn btn-info-outline add-more" label="Add Experience +" (click)="addWorkExperience()"></button>
+                <button pButton class="btn btn-info-outline add-more" label="Add work experience +" (click)="addWorkExperience()"></button>
             </div>
         </div>
 

frontend/angular/src/app/components/my-career-web/config/constants.ts

@@ -38,6 +38,7 @@ export const SERVICES = {
     CAREER_PROFILES: 'CareerProfiles',
     JOB_TITLES: 'JobTitles',
     SKILLS: 'Skills',
+    CERTIFICATIONS: 'Certifications',
     LOGIN_LINKEDIN: 'LoginWithLinkedIn',
     LOGIN_GOOGLE: 'LoginWithGoogle',
 };

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

@@ -40,6 +40,7 @@
             }
 
             &-action {
+                min-width: 212px;
                 border-radius: 73px;
                 background-color: #12A8DE;
                 color: #FFFFFF;

frontend/angular/src/app/components/my-career-web/services/assessment.service.ts

@@ -46,5 +46,9 @@ export class AssessmentService {
         return this.us.processObjects('SaveWorkPreferences', params);
     }
 
+    saveDiversityProfile(params): Observable<any> {
+        return this.us.processObjects('SaveDiversityProfile', params);
+    }
+
 
 }

frontend/angular/src/app/components/my-career-web/services/personal-details.service.ts

@@ -55,6 +55,15 @@ export class PersonalDetailsService {
           )
     }
 
+    getCertifications(queryParams = {}, assocs = []): Observable<any> {
+        return this.ss.getObjects(SERVICES.CERTIFICATIONS, 'All', queryParams, assocs, 'Autocomplete', null, null, null)
+          .map(
+            data => {
+                return this.us.convertResponseToObjects(data, assocs);
+            }
+          )
+    }
+
     getSkillRatings(): Observable<any> {
         return this.es.getEnums('SkillRatings', true);
     }

frontend/angular/src/styles/my-career-styles/_misc.scss

@@ -29,12 +29,17 @@
 }
 
 .uploaded-attachment {
-    padding: 4px 8px;
+    padding: 6px 10px;
     background: #f2f2f2;
     border-radius: 7px;
     position: relative;
     border: 1px solid #c2c2c2;
 
+    a {
+        color: #03a0e7;
+        text-decoration: underline;
+    }
+
     .pi-times {
         position: absolute;
         right: 6px;

frontend/angular/src/styles/my-career-styles/_profile-builder.scss

@@ -49,6 +49,7 @@
         border: 1px solid $primaryColor;
         position: static;
         transition: .3s;
+        font-weight: bold;
 
 
         &:hover {