publish profile

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

@@ -9,6 +9,7 @@ import { EducationComponent } from './career-history/education/education.compone
 import { SkillsComponent } from './career-history/skills/skills.component';
 import { ReferencesComponent } from './career-history/references/references.component';
 import { TemplatesComponent } from './career-history/templates/templates.component';
+import { PublishComponent } from './career-history/publish/publish.component';
 
 @NgModule({
     imports: [
@@ -22,7 +23,8 @@ import { TemplatesComponent } from './career-history/templates/templates.compone
         EducationComponent,
         SkillsComponent,
         ReferencesComponent,
-        TemplatesComponent
+        TemplatesComponent,
+        PublishComponent
     ]
 })
 export class CareerHistoryModule {

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

@@ -29,25 +29,28 @@
 
             <div class="assessment-body-tabs mc-card career-builder">
                 <p-tabView (onChange)="tabChanged($event)">
-                    <p-tabPanel header="1{{isMobileView ? '' : '. Personal Data'}}" [selected]="activeTab === 'personal-data'">
+                    <p-tabPanel header="1{{isMobileView ? '' : '. Templates'}}" [selected]="activeTab === 'templates'">
+                        <app-templates></app-templates>
+                    </p-tabPanel>
+                    <p-tabPanel header="2{{isMobileView ? '' : '. Personal Data'}}" [selected]="activeTab === 'personal-data'">
                         <app-personal-details [asChildComponent]="true" (detailsSaved)="tabChanged({index: 1})">
                         </app-personal-details>
                     </p-tabPanel>
-                    <p-tabPanel header="2{{isMobileView ? '' : '. Work History'}}" [selected]="activeTab === 'work-history'">
+                    <p-tabPanel header="3{{isMobileView ? '' : '. Work History'}}" [selected]="activeTab === 'work-history'">
                         <app-work-history (workSaved)="tabChanged({index: 2})">
                         </app-work-history>
                     </p-tabPanel>
-                    <p-tabPanel header="3{{isMobileView ? '' : '. Education'}}" [selected]="activeTab === 'education'">
+                    <p-tabPanel header="4{{isMobileView ? '' : '. Education'}}" [selected]="activeTab === 'education'">
                         <app-education (educationSaved)="tabChanged({index: 3})"></app-education>
                     </p-tabPanel>
-                    <p-tabPanel header="4{{isMobileView ? '' : '. Skills'}}" [selected]="activeTab === 'skills'">
+                    <p-tabPanel header="5{{isMobileView ? '' : '. Skills'}}" [selected]="activeTab === 'skills'">
                         <app-skills (skillsSaved)="tabChanged({index: 4})"></app-skills>
                     </p-tabPanel>
-                    <p-tabPanel header="5{{isMobileView ? '' : '. References'}}" [selected]="activeTab === 'references'">
+                    <p-tabPanel header="6{{isMobileView ? '' : '. References'}}" [selected]="activeTab === 'references'">
                         <app-references (refereeSaved)="tabChanged({index: 5})"></app-references>
                     </p-tabPanel>
-                    <p-tabPanel header="6{{isMobileView ? '' : '. Templates'}}" [selected]="activeTab === 'templates'">
-                        <app-templates></app-templates>
+                    <p-tabPanel header="7{{isMobileView ? '' : '. Publish'}}" [selected]="activeTab === 'publish'">
+                        <app-publish></app-publish>
                     </p-tabPanel>
                 </p-tabView>
             </div>

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

@@ -10,7 +10,7 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class CareerHistoryComponent extends BaseComponent implements OnInit {
 
-    tabs = ['personal-data', 'work-history', 'education', 'skills', 'references', 'templates'];
+    tabs = ['templates', 'personal-data', 'work-history', 'education', 'skills', 'references', 'publish'];
     activeTab = '';
 
     constructor(

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

+<div class="position-relative">
+    <app-overlay [isActive]="isLoading || isSaving"></app-overlay>
+
+    <h4 class="tab-heading">Your Career Profile is ready, click the preview profile button to see a preview. </h4>
+
+    <div class="d-flex justify-content-center mt-3">
+        <button class="mc-primary" pButton label="Preview Profile"></button>
+    </div>
+
+
+    <div class="row">
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Change Template" routerLink="my-career-web/career-history/templates"></button>
+        </div>
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Update Profile Info" routerLink="my-career-web/career-history/personal-data"></button>
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Update Work History" routerLink="my-career-web/career-history/work-history"></button>
+        </div>
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Update Educational Qualifications" routerLink="my-career-web/career-history/education"></button>
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Update Skills" routerLink="my-career-web/career-history/skills"></button>
+        </div>
+        <div class="mt-3 col-md-6 d-flex justify-content-center">
+            <button class="mc-secondary" pButton label="Update Referees" routerLink="my-career-web/career-history/references"></button>
+        </div>
+    </div>
+
+    <div class="row mt-4">
+        <div class="col-md-6 d-flex justify-content-between">
+            <span class="ml-4">Do you wish to publish the career profile? </span>
+            <p-inputSwitch [(ngModel)]="careerProfile.PublishProfile" (onChange)="saveProfile()"></p-inputSwitch>
+        </div>
+    </div>
+
+    <div class="row mt-4" *ngIf="careerProfile?.PublishProfile">
+        <div class="col-md-6 d-flex justify-content-between">
+            <span class="ml-4" style="white-space: nowrap;">Share URL</span>
+            <a target="_blank" style="word-break: break-all; margin-left: 80px;" href="#">http://career.matchd.com/john+peters4</a>
+        </div>
+    </div>
+
+    <div class="d-flex justify-content-center mt-5">
+        <button class="mc-secondary" pButton label="Download Profile"></button>
+    </div>
+
+    <div class="d-flex justify-content-center mt-5">
+        <button class="mc-primary" pButton label="Complete"></button>
+    </div>
+</div>

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

+import { Component, OnInit } from '@angular/core';
+import { PersonalDetailsService } from '../../../services/personal-details.service';
+import { CareerProfileModel } from '../../../models/career-profile.model';
+import { HelperService } from '../../../services/helper.service';
+import { UtilsService } from '../../../../../oneit/services/utils.service';
+import { BaseComponent } from '../../../base/base.component';
+import { takeUntil } from 'rxjs/operators';
+
+@Component({
+  selector: 'app-publish',
+  templateUrl: './publish.component.html',
+  styleUrls: ['./publish.component.scss']
+})
+export class PublishComponent extends BaseComponent implements OnInit {
+
+    assocs = [];
+    careerProfile = new CareerProfileModel();
+
+    constructor(
+        private ps: PersonalDetailsService,
+        private us: UtilsService,
+        private hs: HelperService
+    ) {
+        super();
+    }
+
+    ngOnInit() {
+        this.getCareerProfile();
+    }
+
+    getCareerProfile(): void {
+        this.isLoading = true;
+        this.ps.getCareerProfile(this.assocs)
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(response => {
+                this.isLoading = false;
+                this.hs.oneItHttpResponse(response);
+                this.careerProfile = response;
+                this.updatedObjs[this.careerProfile.ObjectID] = this.careerProfile;
+            }, err => {
+                this.hs.handleHttpError(err);
+                this.isLoading = false;
+            })
+    }
+
+    saveProfile(): void {
+        this.isSaving = true;
+        this.ps.saveProfile(this.createdObjs, this.updatedObjs, this.deletedObjs)
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(res => {
+                this.isSaving = false;
+                this.hs.oneItHttpResponse(res);
+            }, err => {
+                this.hs.handleHttpError(err);
+                this.isSaving = false;
+            })
+    }
+
+}

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

 import { Component, OnInit } from '@angular/core';
+import { BaseComponent } from '../../../base/base.component';
+import { CareerProfileModel } from '../../../models/career-profile.model';
+import { PersonalDetailsService } from '../../../services/personal-details.service';
+import { UtilsService } from '../../../../../oneit/services/utils.service';
+import { HelperService } from '../../../services/helper.service';
+import { takeUntil } from 'rxjs/operators';
 
 @Component({
   selector: 'app-templates',
   templateUrl: './templates.component.html',
   styleUrls: ['./templates.component.scss']
 })
-export class TemplatesComponent implements OnInit {
+export class TemplatesComponent extends BaseComponent implements OnInit {
 
-  constructor() { }
+    assocs = ['Candidate', 'Candidate.CandidateTemplates'];
+    careerProfile = new CareerProfileModel();
 
-  ngOnInit() {
-  }
+    constructor(
+        private ps: PersonalDetailsService,
+        private us: UtilsService,
+        private hs: HelperService
+    ) {
+        super();
+    }
+
+    ngOnInit() {
+        this.getCareerProfile();
+    }
+
+    getCareerProfile(): void {
+        this.isLoading = true;
+        this.ps.getCareerProfile(this.assocs)
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(response => {
+                this.isLoading = false;
+                this.hs.oneItHttpResponse(response);
+                this.careerProfile = response;
+            }, err => {
+                this.hs.handleHttpError(err);
+                this.isLoading = false;
+            })
+    }
 
 }

frontend/angular/src/app/components/my-career-web/models/career-profile.model.ts

@@ -24,4 +24,5 @@ export class CareerProfileModel extends BaseModel {
     NoWorkExperience: boolean;
     NoEducationQualification: boolean;
     NoReference: boolean;
+    PublishProfile: boolean;
 }

frontend/angular/src/styles/my-career-styles/primeng/_button.scss

@@ -26,4 +26,29 @@
             background-color: #005A8D !important;
         }
     }
+
+    &.mc-primary {
+        width: 260px;
+        height: 50px;
+        border-radius: 73px;
+        background-color: $primaryColor !important;
+
+        &:hover {
+            background-color: #1091bf !important;
+        }
+    }
+
+    &.mc-secondary {
+        width: 260px;
+        height: 50px;
+        border-radius: 73px;
+        background: $white;
+        color: $primaryColor;
+        border: 1px solid $primaryColor;
+
+        &:hover {
+            background-color: #1091bf !important;
+            color: $white;
+        }
+    }
 }