Skip to content

P
PERFORMA_REPLICA
Commit d7903a20 by Muhammad Usman
Options

reports completed

parent 105117bc
Showing with 698 additions and 108 deletions
frontend/angular/src/app/my-career-web/assessment/assessment.module.ts
......@@ -6,7 +6,6 @@ import { WorkStyleComponent } from './work-style/work-style.component';
import { WorkPreferenceComponent } from './work-preference/work-preference.component';
import { DiversityProfileComponent } from './diversity-profile/diversity-profile.component';
import { McSharedModule } from '../mc-shared/mc-shared.module';
import { SummaryReportComponent } from './summary-report/summary-report.component';
@NgModule({
imports: [
......@@ -17,8 +16,7 @@ import { SummaryReportComponent } from './summary-report/summary-report.componen
declarations: [
WorkStyleComponent,
WorkPreferenceComponent,
DiversityProfileComponent,
SummaryReportComponent
DiversityProfileComponent
]
})
export class AssessmentModule {
......
frontend/angular/src/app/my-career-web/assessment/assessment.routing.ts
......@@ -3,7 +3,6 @@ import { Routes, RouterModule } from '@angular/router';
import { WorkStyleComponent } from './work-style/work-style.component';
import { WorkPreferenceComponent } from './work-preference/work-preference.component';
import { DiversityProfileComponent } from './diversity-profile/diversity-profile.component';
import { SummaryReportComponent } from './summary-report/summary-report.component';
const routes: Routes = [
{
......@@ -17,11 +16,6 @@ const routes: Routes = [
{
path: 'diversity-profile',
component: DiversityProfileComponent
},
{
path: 'summary-report',
component: SummaryReportComponent
}
];
......
frontend/angular/src/app/my-career-web/assessment/summary-report/summary-report.component.scss deleted 100644 → 0
@import "../../../../styles/my-career-styles/variables";
.summary-report {
margin-top: 20px;
border: 2px solid $greyBorder;
border-radius: 10px;
.report-chart {
padding: 3% 5%;
.report-title {
text-align: center;
font-size: 16px;
margin-bottom: 24px;
font-weight: bold;
}
.report-circle {
margin: 0 auto;
width: 200px;
height: 200px;
background: #e5e8eb;
border-radius: 50%;
padding: 17px;
&-value {
width: 100%;
height: 100%;
border-radius: 50%;
background: $white;
font-size: 2.5em;
line-height: 166px;
text-align: center;
}
}
}
}
frontend/angular/src/app/my-career-web/career-history/career-history/skills/skills.component.html
......@@ -14,14 +14,14 @@
<div class="row skill-wrapper" *ngFor="let skill of careerProfile?.Skills; let i = index;"
style="padding-bottom: 16px;">
<div class="remove-record">
<i class="fa fa-remove" (click)="removeSkill(skill)"></i>
<div class="remove-record" (click)="removeSkill(skill)">
<i class="fa fa-remove"></i>
</div>
<div class="col-md-12 form-group">
<app-form-control>
<p-autoComplete [suggestions]="skills" name="Skill{{i}}" [(ngModel)]="skill.Skill" placeholder="Enter Skill" required
(completeMethod)="getSkills($event)" [forceSelection]="true" dataKey="ObjectID" field="Description">
(completeMethod)="getSkills($event)" dataKey="ObjectID" field="Description">
</p-autoComplete>
</app-form-control>
</div>
......
frontend/angular/src/app/my-career-web/career-history/career-history/skills/skills.component.ts
......@@ -100,19 +100,21 @@ export class SkillsComponent extends BaseComponent implements OnInit {
return this.helperService.validateAllFormFields(this.form);
}
this.isSaving = true;
this.personalDetailsService.saveProfile(this.createdObjs, this.updatedObjs, this.deletedObjs)
.pipe(takeUntil(this.componentInView))
.subscribe(res => {
this.isSaving = false;
if (customRoute) {
this.router.navigate([customRoute])
} else {
this.skillsSaved.emit();
}
}, err => {
this.isSaving = false;
this.utilsService.handleError(err);
})
console.log(this.careerProfile);
// console.log(this.createdObjs, this.updatedObjs, this.deletedObjs);
// this.personalDetailsService.saveProfile(this.createdObjs, this.updatedObjs, this.deletedObjs)
// .pipe(takeUntil(this.componentInView))
// .subscribe(res => {
// this.isSaving = false;
// if (customRoute) {
// this.router.navigate([customRoute])
// } else {
// this.skillsSaved.emit();
// }
// }, err => {
// this.isSaving = false;
// this.utilsService.handleError(err);
// })
}
}
frontend/angular/src/app/my-career-web/career-history/career-history/templates/templates.component.html
<h4 class="tab-heading">Select the design template for your Career Profile</h4>
<!--<p-carousel>-->
<!-- -->
<!--</p-carousel>-->
<div class="text-center mt-3">
<button pButton label="Please choose a profile template" class="ui-button-info rounded-btn"
(click)="showTemplates()"></button>
</div>
<div class="template-picker-wrapper" [ngClass]="{show: templatesShown}">
<div class="close-templates" (click)="templatesShown = false;">
<div class="fa fa-times"></div>
</div>
<div class="templates">
<p-carousel [value]="careerProfile?.Candidate?.AllTempletes" [numVisible]="2" iconReplacer
[iconsToReplace]="['pi-arrow-circle-right', 'pi-arrow-circle-left']" [delay]="2000"
[iconsToAdd]="['pi-chevron-right', 'pi-chevron-left']" styleClass="template-picker">
<ng-template let-template pTemplate="item">
<div class="template-wrapper">
<div class="template-img-wrapper">
<div class="template-img">
<img [src]="template.ImgPath" alt="">
</div>
<div class="template-actions">
<button pButton [label]="template.CanUse ? 'Select this template' : 'Upgrade to premium'"
class="ui-button-info rounded-btn" (click)="selectTemplate(template)">
</button>
</div>
</div>
<div class="template-info">
<div class="template-title">{{template.Name}}</div>
<div class="template-description">{{template.Description}}</div>
</div>
</div>
</ng-template>
</p-carousel>
</div>
</div>
frontend/angular/src/app/my-career-web/career-history/career-history/templates/templates.component.scss
.template-picker-wrapper {
background-color: rgba(43, 44, 45, 0.89);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
&.show {
display: block;
animation: fadeIn .3s;
@keyframes fadeIn {
from {opacity: 0;}
to {opacity: 1;}
}
}
.close-templates {
color: #58595B;
background: #fff;
width: 38px;
height: 38px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
right: 34px;
top: 34px;
cursor: pointer;
z-index: 1000;
.fa {
font-size: 24px;
}
}
.template-img-wrapper {
background: #fff;
.template-img {
height: 560px;
img {
max-height: 100%;
}
}
.template-actions {
height: 90px;
display: flex;
align-items: center;
justify-content: center;
}
}
.template-info {
color: #fff;
text-align: center;
margin-top: 28px;
.template-title {
font-size: 24px;
line-height: 32px;
font-weight: 600;
}
.template-description {
font-size: 18px;
line-height: 27px;
margin-top: 8px;
}
}
}
frontend/angular/src/app/my-career-web/career-history/career-history/templates/templates.component.ts
......@@ -4,6 +4,9 @@ import { CareerProfileModel } from '../../../models/career-profile.model';
import { PersonalDetailsService } from '../../../services/personal-details.service';
import { UtilsService } from '../../../../oneit/services/utils.service';
import { takeUntil } from 'rxjs/operators';
import { environment } from '../../../../../environments/environment';
import { CandidateTemplateModel } from '../../../models/candidate-template.model';
import { SaveService } from '../../../../oneit/services/save.service';
@Component({
selector: 'app-templates',
......@@ -14,9 +17,16 @@ export class TemplatesComponent extends BaseComponent implements OnInit {
assocs = ['Candidate', 'Candidate.CandidateTemplates'];
careerProfile = new CareerProfileModel();
tempalteStatus = {
INCLUDED_IN_FREE: 'INCLUDED_IN_FREE',
INCLUDED_IN_PREMIUM: 'INCLUDED_IN_PREMIUM',
};
templatesShown = false;
apiBase = environment.baseUrl;
constructor(
private personalDetailsService: PersonalDetailsService,
private saveService: SaveService,
private utilsService: UtilsService
) {
super();
......@@ -33,10 +43,36 @@ export class TemplatesComponent extends BaseComponent implements OnInit {
.subscribe(response => {
this.isLoading = false;
this.careerProfile = response;
if (this.careerProfile.Candidate.AllTempletes) {
this.careerProfile.Candidate.AllTempletes.map(t => {
t.CanUse = t.Availability === this.tempalteStatus.INCLUDED_IN_FREE
|| t.Availability === this.tempalteStatus.INCLUDED_IN_PREMIUM;
t.ImgPath = this.apiBase + t.FullImageURI
});
this.careerProfile.Candidate.AllTempletes.sort((t1, t2) => t1.SortOrder - t2.SortOrder);
this.utilsService.addObjsToJSONByObjectID(this.updatedObjs, this.careerProfile.Candidate.CandidateTemplates)
}
}, err => {
this.isLoading = false;
this.utilsService.handleError(err);
})
}
selectTemplate(template): void {
const templateModel = new CandidateTemplateModel();
templateModel.Candidate = this.careerProfile.Candidate.ObjectID;
templateModel.Template = template.Value;
this.utilsService.createObject(templateModel, this.createdObjs);
this.saveService.saveObjectsWithDefaultSvc(this.createdObjs, this.updatedObjs, this.updatedObjs)
.pipe(takeUntil(this.componentInView))
.subscribe(response => {
console.log(response);
});
}
showTemplates(): void {
this.templatesShown = true;
}
}
frontend/angular/src/app/my-career-web/config/constants.ts
......@@ -26,6 +26,7 @@ export const CLASSES = {
CAREER_SKILL: 'performa.orm.CareerProfileSkill',
SKILL: 'performa.orm.Skill',
REFEREE: 'performa.orm.Referee',
CandidateTemplate: 'performa.orm.CandidateTemplate',
INTRO: 'performa.orm.IntroductionLetter'
};
......
frontend/angular/src/app/my-career-web/dashboard/dashboard.module.ts
......@@ -8,6 +8,7 @@ import { HomeComponent } from './home/home.component';
import { LeftSidebarComponent } from './left-sidebar/left-sidebar.component';
import { ProfileTasksComponent } from './profile-tasks/profile-tasks.component';
import { GoPremiumComponent } from './go-premium/go-premium.component';
import { SummaryReportComponent } from './summary-report/summary-report.component';
@NgModule({
imports: [
......@@ -20,7 +21,8 @@ import { GoPremiumComponent } from './go-premium/go-premium.component';
HomeComponent,
LeftSidebarComponent,
ProfileTasksComponent,
GoPremiumComponent
GoPremiumComponent,
SummaryReportComponent
]
})
......
frontend/angular/src/app/my-career-web/dashboard/dashboard.routing.ts
......@@ -4,6 +4,7 @@ import { DashboardComponent } from './dashboard/dashboard.component';
import { HomeComponent } from './home/home.component';
import { PersonalDetailsComponent } from '../mc-shared/personal-details/personal-details.component';
import { GoPremiumComponent } from './go-premium/go-premium.component';
import { SummaryReportComponent } from './summary-report/summary-report.component';
const routes: Routes = [
{
......@@ -23,6 +24,10 @@ const routes: Routes = [
component: GoPremiumComponent
},
{
path: 'reports',
component: SummaryReportComponent
},
{
path: '',
redirectTo: 'home',
pathMatch: 'full'
......
frontend/angular/src/app/my-career-web/dashboard/left-sidebar/left-sidebar.component.html
......@@ -4,7 +4,7 @@
</div>
<div class="sidebar-navigation">
<div class="sidebar-navigation-item" routerLink="/my-career-web/dashboard" routerLinkActive="active">
<div class="sidebar-navigation-item" routerLink="/my-career-web/dashboard/home" routerLinkActive="active">
<span class="sidebar-navigation-item-icon">
<i class="fa fa-home"></i>
</span>
......@@ -22,7 +22,7 @@
</span>
</div>
<div class="sidebar-navigation-item">
<div class="sidebar-navigation-item" routerLink="/my-career-web/dashboard/reports" routerLinkActive="active">
<span class="sidebar-navigation-item-icon">
<i class="fa fa-clipboard"></i>
</span>
......
frontend/angular/src/app/my-career-web/dashboard/profile-tasks/profile-tasks.component.scss
......@@ -14,7 +14,6 @@
height: 112px;
margin: 0 auto;
border-radius: 100%;
background-color: #1469A2;
padding: 4px;
.user-profile-avatar {
......
frontend/angular/src/app/my-career-web/assessment/summary-report/summary-report.component.html → frontend/angular/src/app/my-career-web/dashboard/summary-report/summary-report.component.html
<div class="summary-report container position-relative">
<div class="report-wrapper">
<div class="career-web" *ngIf="!isMobileView">
<img src="assets/my-career-web/images/MATCHD_LOGO.jpg" alt="">
</div>
<div class="summary-report">
<app-overlay [isActive]="isLoading"></app-overlay>
<div class="row">
<div class="col-md-6 report-chart">
<div class="report-title">ROLE FIT</div>
<div class="report-circle" [ngStyle]="{backgroundImage: reportChart.role.backgroundImage, backgroundColor: reportChart.role.backgroundColor}">
<div class="report-circle-value">
54%
</div>
</div>
<div class="report-legend">
<div class="col-lg-6 report-chart" *ngFor="let report of reports;" [ngClass]="{selected: selectedReport === report}">
<div class="report-title">{{report.title}}</div>
<div class="report-circle" [ngStyle]="{backgroundImage: report.bgImg, backgroundColor: report.bgColor}">
<div class="report-circle-value">
{{ceil(report.report?.PercentageValue)}}%
</div>
</div>
<div class="col-md-6 report-chart">
<div class="report-title">CULTURE FIT</div>
<div class="report-circle">
<div class="report-circle-value">
65%
<div class="report-legend">
<div class="row">
<div class="col-md-6 report-dot" *ngFor="let dot of report.report?.Dots">
<div class="dot-div" [ngClass]="dot.DotClass"></div>
<div class="dot-label">{{dot.DotValue}}</div>
</div>
</div>
<div class="report-legend">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12" style="padding: 0;">
<div class="row report-bars">
<div class="col-lg-12">
<p-accordion>
<p-accordionTab>
<p-accordionTab *ngFor="let bar of selectedReport?.report?.Bars">
<p-header>
<div class="mc-tab-header-text">
Career Drives
{{bar.Label}}
</div>
<div class="mc-tab-header-content">
<div class="header-percentage-value">55%</div>
<div class="header-percentage-value">{{ceil(bar.RatingValue)}}%</div>
<div class="header-percentage-bar">
<p-progressBar [value]="50"></p-progressBar>
<div class="header-percentage-bar" [ngClass]="bar.ProgressBarClass">
<p-progressBar [value]="bar.RatingValue"></p-progressBar>
</div>
<div class="mc-accordion-icon" (click)="showBody = !showBody">
......@@ -58,6 +57,35 @@
</div>
</div>
</p-header>
<div class="sub-bars">
<div class="sub-bar" *ngFor="let subbar of bar.SubBars;">
<div class="sub-bar-title">
{{subbar.Label}}
</div>
<div class="sub-bar-content">
<div class="sub-bar-labels">
<div class="sub-bar-label">
{{subbar.LeftAnnotation}}
</div>
<div class="sub-bar-label">
{{subbar.RightAnnotation}}
</div>
</div>
<div class="sub-bar-progresses">
<div class="sub-bar-progress" [ngClass]="res.class" *ngFor="let res of subbar.ParsedResults;" [ngStyle]="{minWidth: res.value + '%'}">
</div>
<div class="sub-bar-triangle" [ngStyle]="{left: subbar.TriangleStyleLeft + '%'}"></div>
</div>
<div class="sub-bar-content">
{{subbar.BottomDetail}}
</div>
</div>
</div>
</div>
</p-accordionTab>
</p-accordion>
......@@ -65,7 +93,7 @@
</div>
</div>
<div class="d-flex justify-content-between" style="margin: 20px 0;">
<div class="d-flex justify-content-between" style="margin: 20px 30px;">
<button pButton label="Download" class="ui-button-info">
</button>
......@@ -74,4 +102,6 @@
</button>
</div>
</div>
</div>
frontend/angular/src/app/my-career-web/dashboard/summary-report/summary-report.component.scss 0 → 100644
@import "../../../../styles/my-career-styles/variables";
.report-wrapper {
padding: 0 5%;
margin-top: 40px;
.career-web {
width: 300px;
margin: 0 auto;
}
.summary-report {
margin-top: 20px;
border: 2px solid $greyBorder;
border-radius: 10px;
position: relative;
background: $white;
overflow: hidden;
.report-chart {
padding: 3% 5%;
border-right: 1px solid $greyBorder;
transition: .3s;
cursor: pointer;
.report-title {
text-align: center;
font-size: 16px;
margin-bottom: 24px;
font-weight: bold;
}
.report-circle {
margin: 0 auto;
width: 150px;
height: 150px;
transition: .3s;
border-radius: 50%;
padding: 12px;
&-value {
width: 100%;
height: 100%;
border-radius: 50%;
background: $white;
font-size: 2em;
display: flex;
align-items: center;
justify-content: center;
}
}
&.selected {
background: #f5f5f5;
}
.report-legend {
margin-top: 30px;
.report-dot {
display: flex;
align-items: center;
.dot-div {
width: 12px;
height: 12px;
border-radius: 50%;
margin-right: 10px;
}
}
}
}
.report-bars {
.sub-bars {
.sub-bar {
padding: 20px 50px 10px;
border-bottom: 1px solid #e0dede;
display: flex;
align-items: center;
&-title {
flex: 0 0 30%;
text-transform: uppercase;
}
&-content {
flex: 1;
font-size: 12px;
margin-top: 5px;
.sub-bar-labels {
display: flex;
justify-content: space-between;
}
.sub-bar-progresses {
height: 12px;
background: black;
margin: 5px 0;
display: flex;
position: relative;
.sub-bar-triangle {
position: absolute;
border: 5px solid transparent;
border-bottom: 10px solid #000;
z-index: 10;
bottom: 0;
}
}
}
}
}
}
}
}
.header-percentage-bar {
&.green-b {
::ng-deep {
.ui-progressbar-value {
background: #47BBB3;
}
}
}
&.red-b {
::ng-deep {
.ui-progressbar-value {
background: #fb5d67;
}
}
}
&.yellow-b {
::ng-deep {
.ui-progressbar-value {
background: #fbc712;
}
}
}
}
.report-dot {
.red-dot{
background-color: #fabdc1;
border:1px solid #fb5d67;
}
.yellow-dot{
background-color: #fbe7a1;
border: 1px solid #fbc712;
}
.green-dot{
background-color: #8CE2DB;
border: 1px solid #47BBB3;
}
}
@media screen and (max-width: 1024px) {
.report-wrapper {
.summary-report {
.report-bars {
.sub-bars {
.sub-bar {
padding: 15px 5px 10px;
display: block;
&-title {
text-align: center;
margin-bottom: 8px;
}
}
}
}
}
}
}
frontend/angular/src/app/my-career-web/assessment/summary-report/summary-report.component.ts → frontend/angular/src/app/my-career-web/dashboard/summary-report/summary-report.component.ts
......@@ -4,6 +4,7 @@ import { HelperService } from '../../services/helper.service';
import { AssessmentService } from '../../services/assessment.service';
import { takeUntil } from 'rxjs/operators';
import { UtilsService } from '../../../oneit/services/utils.service';
import { SummaryReportModel } from '../../models/summary-report.model';
@Component({
selector: 'app-summary-report',
......@@ -13,10 +14,15 @@ import { UtilsService } from '../../../oneit/services/utils.service';
export class SummaryReportComponent extends BaseComponent implements OnInit {
showBody = false;
reportChart = {
role: {backgroundColor: '', backgroundImage: ''},
culture: {backgroundColor: '', backgroundImage: ''}
colorClasses = {
'percent-yellow-b': {incompleteColor: '#e5e8eb', completeColor: '#fedd6f'}
};
reports: { report: SummaryReportModel, title: string, bgColor: string, bgImg: string }[] = [
{report: null, title: 'ROLE FIT', bgImg: '', bgColor: this.colorClasses['percent-yellow-b'].incompleteColor},
{report: null, title: 'CULTURE FIT', bgImg: '', bgColor: this.colorClasses['percent-yellow-b'].incompleteColor},
];
selectedReport: { report: SummaryReportModel, title: string };
ceil = Math.ceil;
constructor(
private assessmentService: AssessmentService,
......@@ -28,11 +34,25 @@ export class SummaryReportComponent extends BaseComponent implements OnInit {
ngOnInit(): void {
this.isLoading = true;
this.assessmentService.getSummaryReport()
this.assessmentService.getSummaryReport(['Dots', 'Bars.SubBars'])
.pipe(takeUntil(this.componentInView))
.subscribe(response => {
console.log(response);
.subscribe((response: SummaryReportModel[]) => {
this.isLoading = false;
response.forEach((r, i) => {
this.reports[i].report = r;
this.reports[i].bgImg = this.helperService.circleGradient(r.PercentageValue, this.colorClasses[r.ColorClass].completeColor, this.colorClasses[r.ColorClass].incompleteColor).backgroundImage;
this.reports[i].bgColor = this.colorClasses[r.ColorClass].completeColor;
r.Bars.forEach(b => {
b.SubBars.forEach(sb => {
sb.ParsedResults = [];
Object.keys(sb.Results).forEach(k => {
sb.ParsedResults.push({class: Object.keys(sb.Results[k])[0], value: sb.Results[k][Object.keys(sb.Results[k])[0]]});
});
})
});
});
this.selectedReport = this.reports[0];
}, err => {
this.utilsService.handleError(err);
this.isLoading = false;
......
frontend/angular/src/app/my-career-web/intro-letters/intro-letter/intro-letter.component.html
......@@ -51,7 +51,7 @@
<td>
<div class="exp-row">
<i class="fa fa-bars" pReorderableRowHandle></i>
<p-checkbox [value]="rowData.ObjectID" [(ngModel)]="introductionLetter.WorkExperiences" name="EXP{{index}}" [label]="rowData?.ILOJobTitle?.JobTitle"></p-checkbox>
<p-checkbox [value]="rowData.ObjectID" [(ngModel)]="introductionLetter.WorkExperiences" name="EXP{{index}}" [label]="rowData?.ActualJobTitle + ' - ' + rowData?.Employer"></p-checkbox>
</div>
</td>
</tr>
......
frontend/angular/src/app/my-career-web/intro-letters/intro-letter/intro-letter.component.ts
......@@ -50,7 +50,7 @@ export class IntroLetterComponent extends BaseComponent implements OnInit {
getCareerProfile(): void {
this.isLoadingSkillAndExp = true;
const assocs = ['WorkExperiences', 'Skills.Skill'];
const assocs = ['WorkExperiences', 'WorkExperiences.WorkExperiences', 'Skills.Skill'];
this.personalDetailsService.getCareerProfile(assocs)
.pipe(takeUntil(this.componentInView))
.subscribe(response => {
......@@ -61,6 +61,7 @@ export class IntroLetterComponent extends BaseComponent implements OnInit {
this.introductionLetter.Candidate = this.careerProfile.Candidate;
this.utilsService.createObject(this.introductionLetter, this.createdObjs);
}
console.log(this.careerProfile);
}, err => {
this.isLoadingSkillAndExp = false;
this.utilsService.handleError(err);
......
frontend/angular/src/app/my-career-web/layouts/wrapper/wrapper.component.ts
......@@ -32,7 +32,6 @@ export class WrapperComponent extends BaseComponent implements OnInit {
this.msgService.errorMsgsUpdated
.pipe(takeUntil(this.componentInView))
.subscribe(errors => {
console.log(errors);
if(Array.isArray(errors)) {
errors.forEach((err, i) => {
if (i > 0) {
......
frontend/angular/src/app/my-career-web/mc-shared/icon-replacer.directive.ts 0 → 100644
import { AfterViewInit, Directive, ElementRef, Input } from '@angular/core';
@Directive({
selector: '[iconReplacer]'
})
export class IconReplacerDirective implements AfterViewInit {
private readonly element: HTMLInputElement;
@Input() iconsToReplace = [];
@Input() iconsToAdd = [];
@Input() delay = 0;
constructor(
private elRef: ElementRef
) {
this.element = elRef.nativeElement;
}
ngAfterViewInit(): void {
setTimeout(() => {
this.iconsToReplace.forEach((icon, ind) => {
const el = this.element.querySelector(`.${icon}`);
if (el) {
el.classList.remove(icon);
el.classList.add(this.iconsToAdd[ind]);
}
});
}, this.delay);
}
}
frontend/angular/src/app/my-career-web/mc-shared/mc-shared.module.ts
......@@ -14,6 +14,7 @@ import { ConfirmDialogModule } from 'primeng/confirmdialog';
import { TooltipModule } from 'primeng/tooltip';
import { IntroLetterService } from '../services/intro-letter.service';
import { TableModule } from 'primeng/table';
import { IconReplacerDirective } from './icon-replacer.directive';
const MODULES = [
ReactiveFormsModule,
......@@ -31,7 +32,8 @@ const COMPONENTS = [
];
const DIRECTIVES = [
GooglePlacesAutocompleteDirective
GooglePlacesAutocompleteDirective,
IconReplacerDirective
];
const PIPES = [
......
frontend/angular/src/app/my-career-web/models/candidate-template.model.ts 0 → 100644
import { BaseModel } from './base.model';
import { CLASSES } from '../config/constants';
export class CandidateTemplateModel extends BaseModel {
ObjectClass = CLASSES.CandidateTemplate;
Template: string;
Candidate: string;
}
frontend/angular/src/app/my-career-web/models/candidate.model.ts
import { UserModel } from './user.model';
import { CLASSES } from '../config/constants';
import { BaseModel } from './base.model';
import { CandidateTemplateModel } from './candidate-template.model';
export class CandidateModel extends BaseModel {
ObjectClass = CLASSES.CANDIDATE;
......@@ -30,4 +31,16 @@ export class CandidateModel extends BaseModel {
CultureCriteriaAnswers: Array<string>;
ProfileAssessmentAnswers: Array<string>;
DiversityAnswers: Array<string>;
CandidateTemplates: Array<CandidateTemplateModel>;
AllTempletes: Array<{
Availability: string;
Description: string;
Disabled: boolean;
FullImageURI: string;
Name: string;
SortOrder: number;
Value: string;
ImgPath: string;
CanUse: boolean;
}>
}
frontend/angular/src/app/my-career-web/models/summary-report.model.ts 0 → 100644
export class SummaryReportModel {
ColorClass: string;
PercentageValue: number;
Dots: { DotValue: string; DotClass: string }[];
Bars: {
Label: string;
RatingValue: number;
ProgressBarClass: string;
SubBars: {
BottomDetail: string;
Label: string;
LeftAnnotation: string;
Results: {
[key: string]: number;
}[];
ParsedResults: {
class: string;
value: number;
}[];
RightAnnotation: string;
TriangleStyleLeft: number;
}[];
}[];
}
frontend/angular/src/app/my-career-web/services/helper.service.ts
......@@ -28,15 +28,15 @@ export class HelperService {
});
}
circleGradient(value = 0, fillColor: '#f0f', emptyColor = '#EAECEE'): { backgroundImage: string, backgroundColor: string } {
circleGradient(value = 0, completeColor= '#f0f', incompleteColor = '#EAECEE'): { backgroundImage: string, backgroundColor: string } {
const percentage = value * 3.6;
let grad;
if (percentage <= 180) {
grad = `linear-gradient(${90 + percentage}deg, transparent 50%, ${emptyColor} 50%),linear-gradient(90deg, ${emptyColor} 50%, transparent 50%)`;
grad = `linear-gradient(${90 + percentage}deg, transparent 50%, ${incompleteColor} 50%),linear-gradient(90deg, ${incompleteColor} 50%, transparent 50%)`;
} else {
grad = `linear-gradient(${percentage - 90}deg, transparent 50%, ${fillColor} 50%),linear-gradient(90deg, ${emptyColor} 50%, transparent 50%)`;
grad = `linear-gradient(${percentage - 90}deg, transparent 50%, ${completeColor} 50%),linear-gradient(90deg, ${incompleteColor} 50%, transparent 50%)`;
}
return {backgroundImage: grad, backgroundColor: emptyColor};
return {backgroundImage: grad, backgroundColor: incompleteColor};
}
}
frontend/angular/src/app/utils/common.modules.import.ts
......@@ -9,7 +9,7 @@ import { InputTextareaModule } from 'primeng/inputtextarea';
import {
AccordionModule,
ButtonModule,
CalendarModule,
CalendarModule, CarouselModule,
EditorModule,
FileUploadModule,
GrowlModule,
......@@ -71,5 +71,6 @@ export const PrimeNGModules = [
FileUploadModule,
TooltipModule,
KeyFilterModule,
AccordionModule
AccordionModule,
CarouselModule
];
frontend/angular/src/styles/my-career-styles/_styles.scss
......@@ -29,6 +29,7 @@
@import "primeng/select-button";
@import "primeng/upload";
@import "primeng/accordion";
@import "primeng/carousel";
}
......
frontend/angular/src/styles/my-career-styles/primeng/_accordion.scss
......@@ -52,6 +52,8 @@
font-weight: bold;
font-size: 24px;
color: $textGrey;
min-width: 70px;
text-align: right;
}
&-bar {
......@@ -86,3 +88,64 @@
}
}
@media screen and (max-width: 1024px) {
.ui-accordion-header > a {
padding: 30px 10px !important;
.ui-accordion-toggle-icon {
bottom: 60px;
width: 25px;
height: 25px;
right: 20px;
}
p-header {
display: block;
.mc-tab-header {
&-text {
justify-content: center;
margin-bottom: 8px;
}
&-content {
display: flex;
align-self: center;
flex: 0 0 75%;
position: relative;
.header-percentage {
display: flex;
align-self: center;
&-value {
font-size: 18px;
text-align: left;
}
&-bar {
p-progressBar {
.ui-progressbar {
height: 16px;
&-value {
height: 16px;
}
}
}
}
}
}
}
}
}
&-content {
padding: 0;
}
}
frontend/angular/src/styles/my-career-styles/primeng/_button.scss
......@@ -9,6 +9,18 @@
&:hover {
background-color: #1091bf !important;
}
&.rounded-btn {
height: 50px;
width: 260px;
border-radius: 73px;
font-weight: 600;
&:hover {
background-color: #127BAD;
}
}
}
&-google {
......
frontend/angular/src/styles/my-career-styles/primeng/_carousel.scss 0 → 100644
// Template picker
.template-picker {
&.ui-carousel {
background: transparent;
border: 0;
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
.ui-carousel-header {
background: transparent;
border: 0;
padding: 0 !important;
margin: 0;
position: fixed;
z-index: 100;
}
.ui-carousel-viewport {
width: 75%;
max-height: 90vh;
overflow: auto;
}
.ui-carousel-item {
border: 0;
background: transparent;
margin: 0 12px !important;
display: flex;
justify-content: center;
align-items: center;
}
.ui-carousel-button {
margin: 0 !important;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #12A8DE;
font-size: 24px;
color: #fff;
position: fixed;
top: calc(50% - 12px);
float: none;
&.ui-carousel-next-button {
right: 5%;
}
&.ui-carousel-prev-button {
left: 5%;
}
}
.ui-carousel-page-links {
display: none;
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment