Skip to content

M
mySkill-x
Commit 157df7d3 by Nattana Chaiyamat
Options

แก้หน้าประเมิน

parent 1e2750f6
Showing with 413 additions and 255 deletions
src/app/components/dashboard/dashboard-routing.module.ts
...@@ -43,6 +43,8 @@ import { DayTypeRegistryComponent } from '../company-components/day-type-registr ...@@ -43,6 +43,8 @@ import { DayTypeRegistryComponent } from '../company-components/day-type-registr
import { TimeAttendanceComponent } from '../performance-management-evaluation/time-attendance/time-attendance.component'; import { TimeAttendanceComponent } from '../performance-management-evaluation/time-attendance/time-attendance.component';
import { RolePermissionConfigComponent } from '../company-components/account-settings/role-permission-config/role-permission-config.component'; import { RolePermissionConfigComponent } from '../company-components/account-settings/role-permission-config/role-permission-config.component';
import { PmsFormEmployeeComponent } from '../performance-evaluation/pms-form-employee/pms-form-employee.component'; import { PmsFormEmployeeComponent } from '../performance-evaluation/pms-form-employee/pms-form-employee.component';
import { EmployeeSelfServiceComponent } from '../employee-self-service/employee-self-service.component';
import { MySkillXModuleComponent } from '../my-skill-x-module/my-skill-x-module.component';
...@@ -94,7 +96,9 @@ const routes: Routes = [ ...@@ -94,7 +96,9 @@ const routes: Routes = [
{ path: "self-evaluation", title: 'ประเมินตนเอง', component: SelfEvaluationComponent }, { path: "self-evaluation", title: 'ประเมินตนเอง', component: SelfEvaluationComponent },
{ path: "day-type-registry", title: 'ประเมินตนเอง', component: DayTypeRegistryComponent }, { path: "day-type-registry", title: 'ประเมินตนเอง', component: DayTypeRegistryComponent },
{ path: "time-attendance", title: 'ทะเบียนการประเมินเวลาทำงาน', component: TimeAttendanceComponent }, { path: "time-attendance", title: 'ทะเบียนการประเมินเวลาทำงาน', component: TimeAttendanceComponent },
{ path: "role-permission-config", title: 'กำหนดสิทธิการเข้าใช้งาน', component: RolePermissionConfigComponent } { path: "role-permission-config", title: 'กำหนดสิทธิการเข้าใช้งาน', component: RolePermissionConfigComponent },
{ path: "employee-self-service", title: 'employee-self-service', component: EmployeeSelfServiceComponent },
{ path: "my-skill-x-module", title: 'my-skill-x-module', component: MySkillXModuleComponent }
] ]
} }
]; ];
......
src/app/components/dashboard/dashboard.module.ts
...@@ -176,6 +176,8 @@ import { PmsKpiComponent } from '../performance-evaluation/pms-form-employee/pms ...@@ -176,6 +176,8 @@ import { PmsKpiComponent } from '../performance-evaluation/pms-form-employee/pms
import { PmsIdpComponent } from '../performance-evaluation/pms-form-employee/pms-idp/pms-idp.component'; import { PmsIdpComponent } from '../performance-evaluation/pms-form-employee/pms-idp/pms-idp.component';
import { PmsSummaryComponent } from '../performance-evaluation/pms-form-employee/pms-summary/pms-summary.component'; import { PmsSummaryComponent } from '../performance-evaluation/pms-form-employee/pms-summary/pms-summary.component';
import { BarRatingModule } from 'ngx-bar-rating'; import { BarRatingModule } from 'ngx-bar-rating';
import { EmployeeSelfServiceComponent } from '../employee-self-service/employee-self-service.component';
import { MySkillXModuleComponent } from '../my-skill-x-module/my-skill-x-module.component';
export const MY_DATE_FORMATS = { export const MY_DATE_FORMATS = {
parse: { parse: {
...@@ -309,7 +311,9 @@ export class CustomDateAdapter extends NativeDateAdapter { ...@@ -309,7 +311,9 @@ export class CustomDateAdapter extends NativeDateAdapter {
PmsCompetencyComponent, PmsCompetencyComponent,
PmsKpiComponent, PmsKpiComponent,
PmsIdpComponent, PmsIdpComponent,
PmsSummaryComponent PmsSummaryComponent,
EmployeeSelfServiceComponent,
MySkillXModuleComponent
], ],
imports: [ imports: [
CommonModule, CommonModule,
......
src/app/components/employee-self-service/employee-self-service.component.ts 0 → 100644
import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'app-employee-self-service',
templateUrl: './employee-self-service.component.html',
styleUrls: ['./employee-self-service.component.scss']
})
export class EmployeeSelfServiceComponent {}
src/app/components/my-skill-x-module/my-skill-x-module.component.ts 0 → 100644
import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'app-my-skill-x-module',
templateUrl: './my-skill-x-module.component.html',
styleUrls: ['./my-skill-x-module.component.scss']
})
export class MySkillXModuleComponent {}
src/app/components/performance-evaluation/pms-form-employee/pms-competency/pms-competency.component.html
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex flex-row py-2 gap-2 sticky" style="top:0;z-index:2;background: white;"> <div class="flex flex-row py-2 gap-2 sticky" style="top:0;z-index:2;background: white;">
<ng-container *ngFor="let appraisalCompentency of appraisalCompentencyList ;let i=index"> <ng-container *ngFor="let appraisalCompentency of appraisalCompentencyList ;let i=index">
<button type="button" class="flex justify-center !items-center border bg-white p-2 text-center" <button type="button" class="flex justify-center !items-center border bg-white p-2 text-center font-semibold"
style="border-radius:20px;width: 100px" style="border-radius:20px;width: 100px"
(click)="getAppraisalCompentencyForm(i);currentPart=appraisalCompentency.comType" (click)="getAppraisalCompentencyForm(i);currentPart=appraisalCompentency.comType"
[ngClass]="{'!bg-primary text-white':currentPart==appraisalCompentency.comType}"> [ngClass]="{'!bg-primary text-white':currentPart==appraisalCompentency.comType}">
...@@ -28,7 +28,8 @@ ...@@ -28,7 +28,8 @@
</div> </div>
<div class="flex flex-col gap-2 relative" style="overflow-y: auto;min-height: calc(100vh - 480px);"> <div class="flex flex-col gap-2 relative" style="overflow-y: auto;min-height: calc(100vh - 480px);">
<ng-container *ngFor="let item2 of appraisalCompentencyFilter();let i = index;let f= first"> <ng-container *ngFor="let item2 of appraisalCompentencyFilter();let i = index;let f= first">
<button type="button" [attr.id]="'menu-' + i" class="p-4 w-full bg-secondary text-white text-left" <button type="button" [attr.id]="'menu-' + i"
class="p-4 w-full text-white text-left bg-gradient-to-r from-primary to-secondary font-semibold"
style="border-radius:20px" style="border-radius:20px"
(click)="scrollToMenu(i); (click)="scrollToMenu(i);
allBiOpen(!biOpen.get(item2.groupAssessment1.competencyIndicatorsCourses1Mini.competencyIndicatorsCourses0.competencyTopic.competencyTopicId),item2.groupAssessment1.competencyIndicatorsCourses1Mini.competencyIndicatorsCourses0.competencyTopic.competencyTopicId)"> allBiOpen(!biOpen.get(item2.groupAssessment1.competencyIndicatorsCourses1Mini.competencyIndicatorsCourses0.competencyTopic.competencyTopicId),item2.groupAssessment1.competencyIndicatorsCourses1Mini.competencyIndicatorsCourses0.competencyTopic.competencyTopicId)">
...@@ -103,26 +104,29 @@ ...@@ -103,26 +104,29 @@
*ngFor="let bi of item2.groupAssessment1.competencyIndicatorsCourses1Mini.behavioralIndicatorsList;let i2 = index;let f = first"> *ngFor="let bi of item2.groupAssessment1.competencyIndicatorsCourses1Mini.behavioralIndicatorsList;let i2 = index;let f = first">
<tr class="border-b border-gray-200"> <tr class="border-b border-gray-200">
<td class="py-2" style="vertical-align: top">{{bi.behavioralIndicators}}</td> <td class="py-2" style="vertical-align: top">{{bi.behavioralIndicators}}</td>
<td class="py-2 text-center" style="vertical-align: top">{{bi.assessmentId}}</td> <td class="py-2 text-center text-indigo-600 font-semibold" style="vertical-align: top">
{{bi.assessmentId}}</td>
<td class="py-2 text-center" style="vertical-align: top"> <td class="py-2 text-center" style="vertical-align: top">
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item of [5,4,3,2,1];let f = first">
<button type="button" <button type="button" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white"
style="border-radius:10px" style="border-radius:10px"
(mouseenter)="biScore.set(bi.behavioralIndicators+bi.assessmentId,item)" (mouseenter)="biScore.set(bi.behavioralIndicators+bi.assessmentId,item)"
(mouseleave)="biScore.clear()" (mouseleave)="biScore.clear()"
(click)="bi.competencyBehavioral.scoreTopicExpectation=item;calnumberCheck()" [ngClass]="{'!border-secondary !text-secondary':bi.competencyBehavioral.scoreTopicExpectation>=item||(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)>=item, (click)="bi.competencyBehavioral.scoreTopicExpectation=item;calnumberCheck()" [ngClass]="{
'!border-secondary': bi.competencyBehavioral.scoreTopicExpectation>=item||(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)>=item ,
'!text-indigo-600':bi.competencyBehavioral.scoreTopicExpectation>item||(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)>item,
'!text-white !bg-secondary': bi.competencyBehavioral.scoreTopicExpectation==item||(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)==item ,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item}} {{item}}
</button> </button>
</ng-container> </ng-container>
</div> </div>
<div class="flex justify-center" style="height: 20px;white-space: nowrap; overflow: visible"> <div class="flex justify-center" style="height: 20px;white-space: nowrap; overflow: visible">
<span *ngIf="biScore.get(bi.behavioralIndicators+bi.assessmentId)" class="text-secondary"> <span *ngIf="biScore.get(bi.behavioralIndicators+bi.assessmentId)" class="text-indigo-600">
{{scoreDescriptions[(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)] }} {{scoreDescriptions[(biScore.get(bi.behavioralIndicators+bi.assessmentId) ?? 0)] }}
</span> </span>
<span *ngIf="!biScore.get(bi.behavioralIndicators+bi.assessmentId)" class="text-secondary"> <span *ngIf="!biScore.get(bi.behavioralIndicators+bi.assessmentId)" class="text-indigo-600">
{{scoreDescriptions[bi.competencyBehavioral.scoreTopicExpectation] }} {{scoreDescriptions[bi.competencyBehavioral.scoreTopicExpectation] }}
</span> </span>
</div> </div>
...@@ -134,7 +138,8 @@ ...@@ -134,7 +138,8 @@
</ng-container> </ng-container>
</ng-container> </ng-container>
<button *ngIf="appraisalCompentencyFilter().length" [attr.id]="'menu-' + appraisalCompentencyFilter().length" <button *ngIf="appraisalCompentencyFilter().length" [attr.id]="'menu-' + appraisalCompentencyFilter().length"
type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" type="button" class="p-4 w-full text-white text-left bg-gradient-to-r from-primary to-secondary font-semibold"
style=" border-radius:20px"
(click)="scrollToMenu(appraisalCompentencyFilter().length);allBiOpen(!biOpen.get('สรุป'),'สรุป')"> (click)="scrollToMenu(appraisalCompentencyFilter().length);allBiOpen(!biOpen.get('สรุป'),'สรุป')">
<span style="padding-left:50px"> <span style="padding-left:50px">
สรุป สรุป
...@@ -147,7 +152,8 @@ ...@@ -147,7 +152,8 @@
<ng-container *ngIf="biOpen.get('สรุป')"> <ng-container *ngIf="biOpen.get('สรุป')">
<div class="pb-1rem px-2rem"> <div class="pb-1rem px-2rem">
<div class="py-2 grid grid-cols-11"> <div class="py-2 grid grid-cols-11">
<div class="col-span-8">ระดับความสามารถ (Target Degree)</div> <div class="col-span-8" style="font-size: 1rem;font-weight: 500; border-radius:20px">ระดับความสามารถ (Target
Degree)</div>
<div class="col-span-3 grid grid-cols-5"> <div class="col-span-3 grid grid-cols-5">
<div class="col-span-1 text-center" *ngFor="let item of [5,4,3,2,1]">{{item}}</div> <div class="col-span-1 text-center" *ngFor="let item of [5,4,3,2,1]">{{item}}</div>
</div> </div>
...@@ -189,17 +195,19 @@ ...@@ -189,17 +195,19 @@
</div> </div>
</div> </div>
<div class="py-2 grid grid-cols-11"> <div class="py-2 grid grid-cols-11">
<div class="col-span-8">คะแนนรวมหลังถ่วงน้ำหนัก</div> <div class="col-span-8 font-semibold" style=" border-radius:20px">คะแนนรวมหลังถ่วงน้ำหนัก
</div>
<div class="col-span-3 grid grid-cols-5"> <div class="col-span-3 grid grid-cols-5">
<div class="col-span-5 text-center"> <div class="col-span-5 text-center text-indigo-600 font-semibold">
{{showNumber(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].weightedTotal)}} {{showNumber(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].weightedTotal)}}
</div> </div>
</div> </div>
</div> </div>
<div class="py-2 grid grid-cols-11"> <div class="py-2 grid grid-cols-11">
<div class="col-span-8">คะแนนเฉลี่ยคิดเป็น</div> <div class="col-span-8 font-semibold" style=" border-radius:20px">คะแนนเฉลี่ยคิดเป็น
</div>
<div class="col-span-3 grid grid-cols-5"> <div class="col-span-3 grid grid-cols-5">
<div class="col-span-5 text-center"> <div class="col-span-5 text-center text-indigo-600 font-semibold">
{{showNumber(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}} {{showNumber(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}}
</div> </div>
</div> </div>
...@@ -239,10 +247,10 @@ ...@@ -239,10 +247,10 @@
<span>{{item2}} </span><br> <span>{{item2}} </span><br>
</div> </div>
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center text-indigo-600 font-semibold">
{{calAverage(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}} {{calAverage(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}}
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center text-indigo-600 font-semibold">
{{calGap(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}} {{calGap(appraisalCompentencyList[appraisalCompentencyIndex].masfromEvaluationAssessment1lList[0].averageScore)}}
</td> </td>
</tr> </tr>
......
src/app/components/performance-evaluation/pms-form-employee/pms-form-employee.component.html
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<div class="font-size-18px font-weight-700 text-primary"> <div class="font-size-18px font-weight-700 text-primary">
<div class="absolute " style="transform:translateY(-9px)"> <div class="absolute " style="transform:translateY(-9px)">
<button type="button" *ngIf="evaluationForm=='sup'" <button type="button" *ngIf="evaluationForm=='sup'"
class="ti-btn ti-btn-outline ti-btn-outline-light h-20px m-0 shadow-md text-blue-500 bg-white" class="ti-btn ti-btn-outline ti-btn-outline-light h-20px m-0 shadow-md hover:shadow-xl transition text-blue-500 bg-white"
(click)="returnPath()"> (click)="returnPath()">
<i class="ti ti-chevron-left"></i> <i class="ti ti-chevron-left"></i>
ย้อนกลับ ย้อนกลับ
...@@ -45,9 +45,23 @@ ...@@ -45,9 +45,23 @@
<div class="flex flex-col gap-2 w-1/4" [class.hidden]="menuClose.get('ข้อมูลรายละเอียด')"> <div class="flex flex-col gap-2 w-1/4" [class.hidden]="menuClose.get('ข้อมูลรายละเอียด')">
<div class="flex flex-col gap-2" style="height:calc(100vh - 177px);overflow-y: auto;"> <div class="flex flex-col gap-2" style="height:calc(100vh - 177px);overflow-y: auto;">
<div class="w-full" *ngIf="kpiScorePart.length > 0"> <div class="w-full" *ngIf="kpiScorePart.length > 0">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-body py-2"> <div class="box-body py-2">
<div class="flex flex-row gap-2" <div class="flex flex-col items-center gap-3">
<img [src]="evaluationForm=='sup' ? './assets/img/users/woman2.png' : './assets/img/users/man.PNG'"
class="h-24 w-24 rounded-full ring-4 ring-primary object-cover" alt="profile-img" />
<ng-container *ngIf="kpiScorePart[kpiScorePart.length-1].score as grade">
<div class="flex gap-1">
<ng-container *ngFor="let s of [1,2,3,4,5]">
<i class="ti text-xl"
[ngClass]="s <= gradeStar(grade) ? 'ti-star-filled text-yellow-400' : 'ti-star text-gray-300'">
</i>
</ng-container>
</div>
<span class="text-sm font-semibold text-gray-700">GRADE: {{ grade }}</span>
</ng-container>
</div>
<!-- <div class="flex flex-row gap-2"
[ngStyle]="{'justify-content':kpiScorePart[kpiScorePart.length-1].score?'space-between':'center'}"> [ngStyle]="{'justify-content':kpiScorePart[kpiScorePart.length-1].score?'space-between':'center'}">
<div <div
[ngClass]="{'w-full': !kpiScorePart[kpiScorePart.length-1].score,'w-1/2':kpiScorePart[kpiScorePart.length-1].score}"> [ngClass]="{'w-full': !kpiScorePart[kpiScorePart.length-1].score,'w-1/2':kpiScorePart[kpiScorePart.length-1].score}">
...@@ -68,12 +82,12 @@ ...@@ -68,12 +82,12 @@
kpiScorePart[kpiScorePart.length-1].score) : ''}} kpiScorePart[kpiScorePart.length-1].score) : ''}}
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>
<div class="w-full"> <div class="w-full">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-header" [class.border-none]="menuClose.get('ข้อมูลพนักงาน')"> <div class="box-header" [class.border-none]="menuClose.get('ข้อมูลพนักงาน')">
<div class="flex justify-between"> <div class="flex justify-between">
<h5 class="box-title align-center">ข้อมูลพนักงาน</h5> <h5 class="box-title align-center">ข้อมูลพนักงาน</h5>
...@@ -91,49 +105,51 @@ ...@@ -91,49 +105,51 @@
<table class="ti-custom-table border-0 ellipsis-text"> <table class="ti-custom-table border-0 ellipsis-text">
<tbody> <tbody>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">รหัสพนักงาน</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">รหัสพนักงาน
</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.employeeId}} {{evaluatee.data.employeeId}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">ชื่อ - สกุล</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">ชื่อ - สกุล
</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.thFullName}} {{evaluatee.data.thFullName}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">ตำเเหน่ง</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">ตำเเหน่ง</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start !text-warp"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.position.tdesc}} {{evaluatee.data.position.tdesc}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">ฝ่าย</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">ฝ่าย</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start !text-warp"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.bu1.tdesc}} {{evaluatee.data.bu1.tdesc}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">แผนก</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">แผนก</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start !text-warp"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.bu2.tdesc}} {{evaluatee.data.bu2.tdesc}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">ระดับ</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">ระดับ</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start !text-warp"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.pl.tdesc}} {{evaluatee.data.pl.tdesc}}
</td> </td>
</tr> </tr>
<tr class="!border-0"> <tr class="!border-0">
<td class="font-medium !p-2 align-start">E-mail</td> <td class="!p-2 align-start" style="font-size: 1rem;font-weight: 500;color:black;">E-mail</td>
<td class="!p-2 align-start">:</td> <td class="!p-2 align-start">:</td>
<td class="font-medium !p-2 align-start !text-warp"> <td class="font-medium !p-2 align-start !text-warp">
{{evaluatee.data.email}} {{evaluatee.data.email}}
...@@ -145,7 +161,7 @@ ...@@ -145,7 +161,7 @@
</div> </div>
</div> </div>
<div class="w-full" *ngIf="currentTap=='แบบประเมินสมรรถนะ'"> <div class="w-full" *ngIf="currentTap=='แบบประเมินสมรรถนะ'">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-header" [class.border-none]="menuClose.get('ค่าถ่วงน้ำหนักของความสามารถในแต่ละระดับ')"> <div class="box-header" [class.border-none]="menuClose.get('ค่าถ่วงน้ำหนักของความสามารถในแต่ละระดับ')">
<div class="flex justify-between"> <div class="flex justify-between">
<h5 class="box-title align-center">ค่าถ่วงน้ำหนักของความสามารถในแต่ละระดับ</h5> <h5 class="box-title align-center">ค่าถ่วงน้ำหนักของความสามารถในแต่ละระดับ</h5>
...@@ -180,7 +196,8 @@ ...@@ -180,7 +196,8 @@
คะแนนเฉลี่ย คะแนนเฉลี่ย
</div> </div>
<div class="flex-1 flex justify-center items-center"> <div class="flex-1 flex justify-center items-center">
<div class="w-3/4 border border-secondary text-center align-center" <div
class="w-3/4 border border-secondary text-center align-center text-indigo-600 font-semibold"
style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;"> style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;">
{{compentencyWeightScore}} {{compentencyWeightScore}}
</div> </div>
...@@ -189,7 +206,8 @@ ...@@ -189,7 +206,8 @@
ผล Gap ผล Gap
</div> </div>
<div class="flex-1 flex justify-center items-center"> <div class="flex-1 flex justify-center items-center">
<div class="w-3/4 border border-secondary text-center align-center" <div
class="w-3/4 border border-secondary text-center align-center text-indigo-600 font-semibold"
style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;"> style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;">
{{compentencyGap}} {{compentencyGap}}
</div> </div>
...@@ -201,7 +219,7 @@ ...@@ -201,7 +219,7 @@
</div> </div>
</div> </div>
<div class="w-full" *ngIf="currentTap=='ประเมินผลการปฏิบัติงาน'||currentTap=='สรุปคะแนนและข้อเสนอแนะ'"> <div class="w-full" *ngIf="currentTap=='ประเมินผลการปฏิบัติงาน'||currentTap=='สรุปคะแนนและข้อเสนอแนะ'">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-header" [class.border-none]="menuClose.get('สรุปผลประเมิน')"> <div class="box-header" [class.border-none]="menuClose.get('สรุปผลประเมิน')">
<div class="flex justify-between"> <div class="flex justify-between">
<h5 class="box-title align-center">สรุปผลประเมิน</h5> <h5 class="box-title align-center">สรุปผลประเมิน</h5>
...@@ -215,8 +233,8 @@ ...@@ -215,8 +233,8 @@
(click)="menuClose.set('สรุปผลประเมิน',true)"></i> (click)="menuClose.set('สรุปผลประเมิน',true)"></i>
</div> </div>
</div> </div>
<div class="box-body py-2" [class.hidden]="menuClose.get('สรุปผลประเมิน')"> <div class="box-body py-2 flex flex-col gap-6 " [class.hidden]="menuClose.get('สรุปผลประเมิน')">
<div class='flex flex-row gap-2'> <div class='flex-1 flex flex-row gap-2'>
<div class="flex-1 flex flex-col gap-2"> <div class="flex-1 flex flex-col gap-2">
<ng-container *ngFor="let item of kpiScorePart; let i=index"> <ng-container *ngFor="let item of kpiScorePart; let i=index">
<ng-container *ngIf="i<4 && i< kpiScorePart.length-2"> <ng-container *ngIf="i<4 && i< kpiScorePart.length-2">
...@@ -231,19 +249,6 @@ ...@@ -231,19 +249,6 @@
</div> </div>
</ng-container> </ng-container>
</ng-container> </ng-container>
<ng-container *ngFor="let item of kpiScorePart; let i=index">
<ng-container *ngIf="i >= kpiScorePart.length-2">
<div class="flex flex-row">
<div class="flex-1 font-size-18px font-weight-700" style="align-content:center">
{{item.text}}
</div>
<div class="flex-1 border border-secondary text-center align-center"
style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;">
{{item.score}}
</div>
</div>
</ng-container>
</ng-container>
</div> </div>
<div class="flex-1 flex flex-col gap-2"> <div class="flex-1 flex flex-col gap-2">
<ng-container *ngFor="let item of kpiScorePart; let i=index"> <ng-container *ngFor="let item of kpiScorePart; let i=index">
...@@ -260,42 +265,30 @@ ...@@ -260,42 +265,30 @@
</ng-container> </ng-container>
</ng-container> </ng-container>
</div> </div>
<!-- <div class="w-1/2 flex flex-row gap-2">
<ng-container *ngFor="let item of kpiScorePart; let i=index">
<ng-container *ngIf="true">
<div class="flex-1 flex flex-col gap-2">
<div class="flex-1 w-1/2">
{{item.text}}
</div> </div>
<div class="flex-1 w-1/2 border border-secondary text-center align-center" <div class='flex-1 flex flex-row gap-2'>
style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;">
{{item.score}}
</div>
</div>
</ng-container>
</ng-container>
</div>
<div class="w-1/2 flex flex-row gap-2">
<ng-container *ngFor="let item of kpiScorePart; let i=index"> <ng-container *ngFor="let item of kpiScorePart; let i=index">
<ng-container *ngIf="true"> <ng-container *ngIf="i >= kpiScorePart.length-2">
<div class="flex-1 flex flex-col gap-2"> <div class="flex-1 flex flex-col gap-2">
<div class="flex-1 w-1/2"> <div class="flex flex-row">
<div class="flex-1 font-size-18px font-weight-700" style="align-content:center">
{{item.text}} {{item.text}}
</div> </div>
<div class="flex-1 w-1/2 border border-secondary text-center align-center" <div
class="flex-1 border border-secondary text-center align-center text-indigo-600 font-semibold"
style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;"> style="border-radius:10px;--tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity));height: 30px;">
{{item.score}} {{item.score}}
</div> </div>
</div> </div>
</div>
</ng-container> </ng-container>
</ng-container> </ng-container>
</div> -->
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="w-full" *ngIf="compentency.data"> <div class="w-full" *ngIf="compentency.data">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-header" [class.border-none]="menuClose.get('สถานะการประเมิน')"> <div class="box-header" [class.border-none]="menuClose.get('สถานะการประเมิน')">
<div class="flex justify-between"> <div class="flex justify-between">
<h5 class="box-title align-center">สถานะการประเมิน</h5> <h5 class="box-title align-center">สถานะการประเมิน</h5>
...@@ -330,7 +323,7 @@ ...@@ -330,7 +323,7 @@
<div class="ltr:ml-5 rtl:mr-5 rounded-sm ltr:mr-auto rtl:ml-auto my-auto w-full space-y-3"> <div class="ltr:ml-5 rtl:mr-5 rounded-sm ltr:mr-auto rtl:ml-auto my-auto w-full space-y-3">
<div class="sm:flex"> <div class="sm:flex">
<h3 class="text-start my-auto text-gray-500 " style="line-height: 1.5"> <h3 class="text-start my-auto text-gray-500 " style="line-height: 1.5">
<p class="font-medium "> <p style="font-size: 1rem;font-weight: 500;color:black">
{{assessmentStatusText(compentency.data.currentStep,i,returnField(compentency.data,apsEmp+'.status'))}} {{assessmentStatusText(compentency.data.currentStep,i,returnField(compentency.data,apsEmp+'.status'))}}
</p> </p>
<p class="font-medium "> <p class="font-medium ">
...@@ -355,7 +348,7 @@ ...@@ -355,7 +348,7 @@
</div> </div>
</div> </div>
<div class="w-full" *ngIf="commentAllFilter().length"> <div class="w-full" *ngIf="commentAllFilter().length">
<div class="box m-0" style="border-radius:20px"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px">
<div class="box-header" [class.border-none]="menuClose.get('Timeline')"> <div class="box-header" [class.border-none]="menuClose.get('Timeline')">
<div class="flex justify-between"> <div class="flex justify-between">
<h5 class="box-title align-center">Timeline</h5> <h5 class="box-title align-center">Timeline</h5>
...@@ -387,7 +380,7 @@ ...@@ -387,7 +380,7 @@
<div class="ltr:ml-5 rtl:mr-5 rounded-sm ltr:mr-auto rtl:ml-auto my-auto w-full space-y-3"> <div class="ltr:ml-5 rtl:mr-5 rounded-sm ltr:mr-auto rtl:ml-auto my-auto w-full space-y-3">
<div class="w-full"> <div class="w-full">
<h3 class="text-start my-auto text-gray-500 " style="line-height: 1.5"> <h3 class="text-start my-auto text-gray-500 " style="line-height: 1.5">
<p class="font-medium" style="white-space: nowrap;"> <p style="font-size: 1rem;font-weight: 500;color:black;white-space: nowrap;">
{{statusCompetencyText(item.statusType)}} {{statusCompetencyText(item.statusType)}}
</p> </p>
<p class="font-medium"> <p class="font-medium">
...@@ -425,7 +418,7 @@ ...@@ -425,7 +418,7 @@
style="padding: 1px;font-size:27px;height:33px" (click)="menuClose.set('ข้อมูลรายละเอียด',false)"></i> style="padding: 1px;font-size:27px;height:33px" (click)="menuClose.set('ข้อมูลรายละเอียด',false)"></i>
</div> </div>
</div> </div>
<div class="box m-0" style="border-radius:20px;"> <div class="box shadow-md hover:shadow-xl transition m-0" style="border-radius:20px;">
<div class="box-header"> <div class="box-header">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<ng-container <ng-container
...@@ -487,7 +480,8 @@ ...@@ -487,7 +480,8 @@
[evaluaterId]="evaluaterId" [evaluateeId]="evaluateeId" [canEdit]="canEdit" [evaluaterId]="evaluaterId" [evaluateeId]="evaluateeId" [canEdit]="canEdit"
[currentStep]="compentency.data.currentStep" [dateIso]="dateIso" [currentStep]="compentency.data.currentStep" [dateIso]="dateIso"
(kpiFormRemain)="kpiFormRemain=$event" (scorePart)="kpiScorePart=$event" (kpiFormRemain)="kpiFormRemain=$event" (scorePart)="kpiScorePart=$event"
(kpiForm)="compentency.data.pms=$event" (scrollToMenuId)="scrollToMenu($event)"></app-pms-kpi> (kpiForm)="compentency.data.pms=$event" (scrollToMenuId)="scrollToMenu($event)"
[compentencyFormRemain]="compentencyFormRemain"></app-pms-kpi>
</div> </div>
<div class="min-height: calc(100vh - 406px);" [class.hidden]="currentTap!='แผนพัฒนาบุคคลากร'"> <div class="min-height: calc(100vh - 406px);" [class.hidden]="currentTap!='แผนพัฒนาบุคคลากร'">
<app-pms-idp [currentTap]="currentTap" [canSave]="canSave" [appraisalIdp]="compentency.data.idp" <app-pms-idp [currentTap]="currentTap" [canSave]="canSave" [appraisalIdp]="compentency.data.idp"
......
src/app/components/performance-evaluation/pms-form-employee/pms-information/pms-information.component.html
<div class="flex flex-col gap-2 pt-2" style="overflow-y: auto;min-height: calc(100vh - 422px)"> <div class="flex flex-col gap-2 pt-2" style="overflow-y: auto;min-height: calc(100vh - 422px)">
<div class="flex"> <div class="flex">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
(click)="menuClose.set('Compentency',!menuClose.get('Compentency'))"> class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px" (click)="menuClose.set('Compentency',!menuClose.get('Compentency'))">
รายละเอียดประเมินสมรรถนะ (Compentency) รายละเอียดประเมินสมรรถนะ (Compentency)
</button> </button>
</div> </div>
...@@ -50,8 +51,9 @@ ...@@ -50,8 +51,9 @@
</table> </table>
</ng-container> </ng-container>
<div class="flex" *ngIf="appraisalPms"> <div class="flex" *ngIf="appraisalPms">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
(click)="menuClose.set('PMS',!menuClose.get('PMS'))"> class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px" (click)="menuClose.set('PMS',!menuClose.get('PMS'))">
รายละเอียดประเมินผลการปฏิบัติงาน (PMS) รายละเอียดประเมินผลการปฏิบัติงาน (PMS)
</button> </button>
</div> </div>
......
src/app/components/performance-evaluation/pms-form-employee/pms-kpi/pms-kpi.component.html
...@@ -5,7 +5,8 @@ ...@@ -5,7 +5,8 @@
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex py-2 flex-row gap-2 sticky" style="top:0;z-index:2;background: white;"> <div class="flex py-2 flex-row gap-2 sticky" style="top:0;z-index:2;background: white;">
<ng-container *ngFor="let item of partShow;let i=index"> <ng-container *ngFor="let item of partShow;let i=index">
<button type="button" class="flex justify-center !items-center border bg-white p-1 text-center" <button type="button"
class="flex justify-center !items-center border bg-white p-1 text-center font-semibold"
(click)="scrollToMenu(currentTap == 'ประเมินผลการปฏิบัติงาน'?('menu-part-'+(i+1)):('menu-part-'+(i+8)));currentPart=item;toggleAllParts(true,item)" (click)="scrollToMenu(currentTap == 'ประเมินผลการปฏิบัติงาน'?('menu-part-'+(i+1)):('menu-part-'+(i+8)));currentPart=item;toggleAllParts(true,item)"
style="border-radius:20px;width: 100px" style="border-radius:20px;width: 100px"
[ngClass]="{'!bg-primary text-white':currentPart==item}"> [ngClass]="{'!bg-primary text-white':currentPart==item}">
...@@ -59,7 +60,9 @@ ...@@ -59,7 +60,9 @@
<ng-template #part1> <ng-template #part1>
<div class="flex flex-col gap-2" [attr.id]="'menu-part-1'"> <div class="flex flex-col gap-2" [attr.id]="'menu-part-1'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-1');toggleAllParts(!partOpen.get('PART 1'),'PART 1');"> (click)="scrollToMenu('menu-part-1');toggleAllParts(!partOpen.get('PART 1'),'PART 1');">
PART&nbsp;1&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานตามนโยบายบริษัท&nbsp;(Corporate KPI) PART&nbsp;1&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานตามนโยบายบริษัท&nbsp;(Corporate KPI)
</button> </button>
...@@ -164,11 +167,14 @@ ...@@ -164,11 +167,14 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white"
style="border-radius:5px" style="border-radius:5px"
(mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)" (mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
(click)="setScore(item,item2);allFormRemain()" [ngClass]="{'!border-secondary !text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2, (click)="setScore(item,item2);allFormRemain()" [ngClass]="{
'!border-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2 ,
'!text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>item2:item.scoreTopicExpectationBoss>item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>item2,
'!text-white !bg-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation==item2:item.scoreTopicExpectationBoss==item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)==item2,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item2}} {{item2}}
</button> </button>
...@@ -176,7 +182,7 @@ ...@@ -176,7 +182,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValue(item)}} {{getTargetDetailValue(item)}}
</span> </span>
</div> </div>
...@@ -190,32 +196,37 @@ ...@@ -190,32 +196,37 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScore(appraisalPms?.part1Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScore(appraisalPms?.part1Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigth(appraisalPms?.part1Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigth(appraisalPms?.part1Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScore(appraisalPms?.part1Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScore(appraisalPms?.part1Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScore(appraisalPms?.part1Detail)}} {{calExpectationTotalScore(appraisalPms?.part1Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part1Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part1Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScore(appraisalPms?.part1Detail),calRawScore(appraisalPms?.part1Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScore(appraisalPms?.part1Detail),calRawScore(appraisalPms?.part1Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -230,7 +241,9 @@ ...@@ -230,7 +241,9 @@
<ng-template #part2> <ng-template #part2>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-2'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-2'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-2');toggleAllParts(!partOpen.get('PART 2'),'PART 2')"> (click)="scrollToMenu('menu-part-2');toggleAllParts(!partOpen.get('PART 2'),'PART 2')">
PART&nbsp;2&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานประจำ&nbsp;(Department KPI) PART&nbsp;2&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานประจำ&nbsp;(Department KPI)
</button> </button>
...@@ -335,11 +348,14 @@ ...@@ -335,11 +348,14 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white"
style="border-radius:5px" style="border-radius:5px"
(mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)" (mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
(click)="setScore(item,item2);allFormRemain()" [ngClass]="{'!border-secondary !text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2, (click)="setScore(item,item2);allFormRemain()" [ngClass]="{
'!border-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2 ,
'!text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>item2:item.scoreTopicExpectationBoss>item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>item2,
'!text-white !bg-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation==item2:item.scoreTopicExpectationBoss==item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)==item2,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item2}} {{item2}}
</button> </button>
...@@ -347,7 +363,7 @@ ...@@ -347,7 +363,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValue(item)}} {{getTargetDetailValue(item)}}
</span> </span>
</div> </div>
...@@ -361,32 +377,37 @@ ...@@ -361,32 +377,37 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScore(appraisalPms?.part2Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScore(appraisalPms?.part2Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigth(appraisalPms?.part2Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigth(appraisalPms?.part2Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScore(appraisalPms?.part2Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScore(appraisalPms?.part2Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScore(appraisalPms?.part2Detail)}} {{calExpectationTotalScore(appraisalPms?.part2Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part2Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part2Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScore(appraisalPms?.part2Detail),calRawScore(appraisalPms?.part2Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScore(appraisalPms?.part2Detail),calRawScore(appraisalPms?.part2Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -401,7 +422,9 @@ ...@@ -401,7 +422,9 @@
<ng-template #part3> <ng-template #part3>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-3'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-3'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-3');toggleAllParts(!partOpen.get('PART 3'),'PART 3')"> (click)="scrollToMenu('menu-part-3');toggleAllParts(!partOpen.get('PART 3'),'PART 3')">
PART&nbsp;3&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานประจำ&nbsp;(Individual KPI) PART&nbsp;3&nbsp;:&nbsp;ประเมินผลการปฏิบัติงานประจำ&nbsp;(Individual KPI)
</button> </button>
...@@ -506,11 +529,14 @@ ...@@ -506,11 +529,14 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary bg-white"
style="border-radius:5px" style="border-radius:5px"
(mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)" (mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
(click)="setScore(item,item2);allFormRemain()" [ngClass]="{'!border-secondary !text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2, (click)="setScore(item,item2);allFormRemain()" [ngClass]="{
'!border-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2 ,
'!text-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>item2:item.scoreTopicExpectationBoss>item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>item2,
'!text-white !bg-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation==item2:item.scoreTopicExpectationBoss==item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)==item2,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item2}} {{item2}}
</button> </button>
...@@ -518,7 +544,7 @@ ...@@ -518,7 +544,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValue(item)}} {{getTargetDetailValue(item)}}
</span> </span>
</div> </div>
...@@ -532,32 +558,37 @@ ...@@ -532,32 +558,37 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScore(appraisalPms?.part3Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScore(appraisalPms?.part3Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigth(appraisalPms?.part3Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigth(appraisalPms?.part3Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScore(appraisalPms?.part3Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScore(appraisalPms?.part3Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScore(appraisalPms?.part3Detail)}} {{calExpectationTotalScore(appraisalPms?.part3Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part3Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part3Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScore(appraisalPms?.part3Detail),calRawScore(appraisalPms?.part3Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScore(appraisalPms?.part3Detail),calRawScore(appraisalPms?.part3Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -572,7 +603,9 @@ ...@@ -572,7 +603,9 @@
<ng-template #part4> <ng-template #part4>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-4'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-4'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-4');toggleAllParts(!partOpen.get('PART 4'),'PART 4')"> (click)="scrollToMenu('menu-part-4');toggleAllParts(!partOpen.get('PART 4'),'PART 4')">
PART&nbsp;4&nbsp;:&nbsp;ประเมินผลสมรรถนะที่สนับสนุนการปฏิบัติงาน&nbsp;(Competency) PART&nbsp;4&nbsp;:&nbsp;ประเมินผลสมรรถนะที่สนับสนุนการปฏิบัติงาน&nbsp;(Competency)
</button> </button>
...@@ -598,15 +631,17 @@ ...@@ -598,15 +631,17 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white pointer-events-none" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white pointer-events-none"
style="border-radius:5px" style="border-radius:5px" [ngClass]="{
[ngClass]="{'!border-secondary !text-secondary':calAverage(item.averageScore)>=item2 }"> '!border-secondary': calAverage(item.averageScore)>=item2 ,
'!text-secondary': calAverage(item.averageScore)>item2,
'!text-white !bg-secondary':calAverage(item.averageScore)==item2}">
{{item2}} {{item2}}
</button> </button>
</ng-container> </ng-container>
</div> </div>
<div style="height: 20px;"> <div style="height: 20px;">
<span class="text-secondary"> <span class="text-indigo-600">
<ng-container> <ng-container>
{{item.averageScore}} {{item.averageScore}}
</ng-container> </ng-container>
...@@ -621,32 +656,37 @@ ...@@ -621,32 +656,37 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="3"> <td class="align-start text-start !white-space-normal py-2" colspan="3">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScorePart4(appraisalPms?.part4Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScorePart4(appraisalPms?.part4Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigthPart4(appraisalPms?.part4Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigthPart4(appraisalPms?.part4Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScorePart4(appraisalPms?.part4Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScorePart4(appraisalPms?.part4Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScorePart4(appraisalPms?.part4Detail)}} {{calExpectationTotalScorePart4(appraisalPms?.part4Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="3"> <td class="align-start text-start !white-space-normal py-2" colspan="3">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part4Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part4Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScorePart4(appraisalPms?.part4Detail),calRawScorePart4(appraisalPms?.part4Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScorePart4(appraisalPms?.part4Detail),calRawScorePart4(appraisalPms?.part4Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -661,7 +701,9 @@ ...@@ -661,7 +701,9 @@
<ng-template #part5> <ng-template #part5>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-5'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-5'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-5');toggleAllParts(!partOpen.get('PART 5'),'PART 5')"> (click)="scrollToMenu('menu-part-5');toggleAllParts(!partOpen.get('PART 5'),'PART 5')">
PART&nbsp;5&nbsp;:&nbsp;อัตราการเข้างาน&nbsp;(Time Attendance) PART&nbsp;5&nbsp;:&nbsp;อัตราการเข้างาน&nbsp;(Time Attendance)
</button> </button>
...@@ -745,10 +787,13 @@ ...@@ -745,10 +787,13 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white"
style="border-radius:5px" (mouseenter)="partScore.set(item.tdesc,item2)" style="border-radius:5px" (mouseenter)="partScore.set(item.tdesc,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
(click)="setScorePart5(item,item2);allFormRemain()" [ngClass]="{'!border-secondary !text-secondary':(evaluaterId==evaluateeId?item.pmsWorkingTimScore>=item2:item.pmsWorkingTimScoreBoss>=item2)||(partScore.get(item.tdesc) ?? 0)>=item2, (click)="setScorePart5(item,item2);allFormRemain()" [ngClass]="{
'!border-secondary': (evaluaterId==evaluateeId?item.pmsWorkingTimScore>=item2:item.pmsWorkingTimScoreBoss>=item2)||(partScore.get(item.tdesc) ?? 0)>=item2 ,
'!text-secondary': (evaluaterId==evaluateeId?item.pmsWorkingTimScore>item2:item.pmsWorkingTimScoreBoss>item2)||(partScore.get(item.tdesc) ?? 0)>item2,
'!text-white !bg-secondary': (evaluaterId==evaluateeId?item.pmsWorkingTimScore==item2:item.pmsWorkingTimScoreBoss==item2)||(partScore.get(item.tdesc) ?? 0)==item2,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item2}} {{item2}}
</button> </button>
...@@ -756,7 +801,7 @@ ...@@ -756,7 +801,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValuePart5(item)}} {{getTargetDetailValuePart5(item)}}
</span> </span>
</div> </div>
...@@ -770,32 +815,38 @@ ...@@ -770,32 +815,38 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScorePart5(appraisalPms?.part5Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScorePart5(appraisalPms?.part5Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigthPart5(appraisalPms?.part5Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigthPart5(appraisalPms?.part5Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScorePart5(appraisalPms?.part5Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScorePart5(appraisalPms?.part5Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScorePart5(appraisalPms?.part5Detail)}} {{calExpectationTotalScorePart5(appraisalPms?.part5Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part5Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part5Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScorePart5(appraisalPms?.part5Detail),calRawScorePart5(appraisalPms?.part5Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScorePart5(appraisalPms?.part5Detail),calRawScorePart5(appraisalPms?.part5Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -810,7 +861,9 @@ ...@@ -810,7 +861,9 @@
<ng-template #part6> <ng-template #part6>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-6'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-6'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-6');toggleAllParts(!partOpen.get('PART 6'),'PART 6')"> (click)="scrollToMenu('menu-part-6');toggleAllParts(!partOpen.get('PART 6'),'PART 6')">
PART&nbsp;6&nbsp;:&nbsp;งานที่ได้รับมอบหมายเพิ่มเติม&nbsp;(Cross Functional Project Assignment) PART&nbsp;6&nbsp;:&nbsp;งานที่ได้รับมอบหมายเพิ่มเติม&nbsp;(Cross Functional Project Assignment)
</button> </button>
...@@ -915,11 +968,14 @@ ...@@ -915,11 +968,14 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary-no-hover bg-white"
style="border-radius:5px" style="border-radius:5px"
(mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)" (mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
(click)="setScore(item,item2);allFormRemain()" [ngClass]="{'!border-secondary !text-secondary':(evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2, (click)="setScore(item,item2);allFormRemain()" [ngClass]="{
'!border-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>=item2:item.scoreTopicExpectationBoss>=item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>=item2,
'!text-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation>item2:item.scoreTopicExpectationBoss>item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)>item2,
'!text-white !bg-secondary': (evaluaterId==evaluateeId?item.scoreTopicExpectation==item2:item.scoreTopicExpectationBoss==item2)||(partScore.get(item.groupAssessment1.pmsTopic.pmsTopicId) ?? 0)==item2,
'pointer-events-none':!canEdit}"> 'pointer-events-none':!canEdit}">
{{item2}} {{item2}}
</button> </button>
...@@ -927,7 +983,7 @@ ...@@ -927,7 +983,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValue(item)}} {{getTargetDetailValue(item)}}
</span> </span>
</div> </div>
...@@ -941,32 +997,38 @@ ...@@ -941,32 +997,38 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScore(appraisalPms?.part6Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScore(appraisalPms?.part6Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigth(appraisalPms?.part6Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigth(appraisalPms?.part6Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScore(appraisalPms?.part6Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScore(appraisalPms?.part6Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScore(appraisalPms?.part6Detail)}} {{calExpectationTotalScore(appraisalPms?.part6Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part6Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part6Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScore(appraisalPms?.part6Detail),calRawScore(appraisalPms?.part6Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScore(appraisalPms?.part6Detail),calRawScore(appraisalPms?.part6Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -981,7 +1043,9 @@ ...@@ -981,7 +1043,9 @@
<ng-template #part7> <ng-template #part7>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-7'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-7'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-7');toggleAllParts(!partOpen.get('PART 7'),'PART 7')"> (click)="scrollToMenu('menu-part-7');toggleAllParts(!partOpen.get('PART 7'),'PART 7')">
PART&nbsp;7&nbsp;:&nbsp;กิจกรรมพิเศษ&nbsp;(Special Activities) PART&nbsp;7&nbsp;:&nbsp;กิจกรรมพิเศษ&nbsp;(Special Activities)
</button> </button>
...@@ -1086,7 +1150,7 @@ ...@@ -1086,7 +1150,7 @@
<div class="flex flex-row justify-center gap-2 mb-2"> <div class="flex flex-row justify-center gap-2 mb-2">
<ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first"> <ng-container *ngFor="let item2 of [5,4,3,2,1];let f = first">
<button type="button" <button type="button"
class="h-12 w-12 p-0 shadow border !border-soft-secondary text-soft-secondary bg-white" class="h-12 w-12 p-0 shadow border text-soft-secondary bg-white"
style="border-radius:5px" style="border-radius:5px"
(mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)" (mouseenter)="partScore.set(item.groupAssessment1.pmsTopic.pmsTopicId,item2)"
(mouseleave)="partScore.clear()" (mouseleave)="partScore.clear()"
...@@ -1098,7 +1162,7 @@ ...@@ -1098,7 +1162,7 @@
</div> </div>
<div class="flex justify-center" <div class="flex justify-center"
style="height: 20px;white-space: nowrap; overflow: visible"> style="height: 20px;white-space: nowrap; overflow: visible">
<span class="text-secondary"> <span class="text-indigo-600">
{{getTargetDetailValue(item)}} {{getTargetDetailValue(item)}}
</span> </span>
</div> </div>
...@@ -1112,32 +1176,38 @@ ...@@ -1112,32 +1176,38 @@
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบ&nbsp;:&nbsp;{{calRawScore(appraisalPms?.part7Detail)}} คะแนนดิบ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calRawScore(appraisalPms?.part7Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;{{calWeigth(appraisalPms?.part7Detail)}} คำนวนถ่วงน้ำหนัก&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calWeigth(appraisalPms?.part7Detail)}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนประเมินที่ได้&nbsp;:&nbsp;{{calExpectationScore(appraisalPms?.part7Detail)}} คะแนนประเมินที่ได้&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calExpectationScore(appraisalPms?.part7Detail)}}</span>
</div> </div>
</div> </div>
</td> </td>
<td class="align-start !white-space-normal text-center py-2"> <td class="align-start !white-space-normal text-center py-2 font-semibold text-indigo-600">
{{calExpectationTotalScore(appraisalPms?.part7Detail)}} {{calExpectationTotalScore(appraisalPms?.part7Detail)}}
</td> </td>
</tr> </tr>
<tr class="bg-table-soft-gray"> <tr class="bg-table-soft-gray">
<td class="align-start text-start !white-space-normal py-2" colspan="4"> <td class="align-start text-start !white-space-normal py-2" colspan="4">
<div class="flex flex-row gap-2"> <div class="flex flex-row gap-2">
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;100 คะแนนดิบคิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">100</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
ร้อยละของปัจจัย&nbsp;:&nbsp;{{appraisalPms?.part6Percentage}} ร้อยละของปัจจัย&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{appraisalPms?.part6Percentage}}</span>
</div> </div>
<div class="flex-1"> <div class="flex-1 font-semibold">
คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;{{calPercentage(calExpectationTotalScore(appraisalPms?.part7Detail),calRawScore(appraisalPms?.part7Detail))}} คะแนนที่ได้คิดเป็นร้อยละ&nbsp;:&nbsp;<span
class="text-indigo-600 ">{{calPercentage(calExpectationTotalScore(appraisalPms?.part7Detail),calRawScore(appraisalPms?.part7Detail))}}</span>
</div> </div>
</div> </div>
</td> </td>
...@@ -1152,7 +1222,9 @@ ...@@ -1152,7 +1222,9 @@
<ng-template #part8> <ng-template #part8>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-8'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-8'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-8');toggleAllParts(!partOpen.get('PART 8'),'PART 8')"> (click)="scrollToMenu('menu-part-8');toggleAllParts(!partOpen.get('PART 8'),'PART 8')">
PART&nbsp;8&nbsp;:&nbsp;สรุปผลการปฏิบัติงาน&nbsp;(Summary) PART&nbsp;8&nbsp;:&nbsp;สรุปผลการปฏิบัติงาน&nbsp;(Summary)
</button> </button>
...@@ -1188,18 +1260,18 @@ ...@@ -1188,18 +1260,18 @@
</tr> </tr>
</ng-container> </ng-container>
<tr class="bg-table-soft-gray" style="height:35px"> <tr class="bg-table-soft-gray" style="height:35px">
<td class="align-start text-center"> <td class="align-start text-center font-semibold">
รวม รวม
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center">
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center font-semibold text-indigo-600">
{{calFactors()}} {{calFactors()}}
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center font-semibold text-indigo-600">
{{calScoreObtained()}} {{calScoreObtained()}}
</td> </td>
<td class="align-start text-center"> <td class="align-start text-center font-semibold text-indigo-600">
{{calNetScore()}} {{calNetScore()}}
</td> </td>
</tr> </tr>
...@@ -1211,7 +1283,9 @@ ...@@ -1211,7 +1283,9 @@
<ng-template #part9> <ng-template #part9>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-9'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-9'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-9');toggleAllParts(!partOpen.get('PART 9'),'PART 9')"> (click)="scrollToMenu('menu-part-9');toggleAllParts(!partOpen.get('PART 9'),'PART 9')">
PART&nbsp;9&nbsp;:&nbsp;พฤติกรรมบุคคลที่เป็นจุดแข็ง จุดอ่อน และการพัฒนา&nbsp;(EMPLOYEE STRENGTHS , PART&nbsp;9&nbsp;:&nbsp;พฤติกรรมบุคคลที่เป็นจุดแข็ง จุดอ่อน และการพัฒนา&nbsp;(EMPLOYEE STRENGTHS ,
WEAKNESSES AND PLAN TO IMPROVED) WEAKNESSES AND PLAN TO IMPROVED)
...@@ -1293,7 +1367,9 @@ ...@@ -1293,7 +1367,9 @@
<ng-template #part10> <ng-template #part10>
<div class=" flex flex-col gap-2" [attr.id]="'menu-part-10'"> <div class=" flex flex-col gap-2" [attr.id]="'menu-part-10'">
<button type="button" class="p-4 w-full bg-secondary text-white text-left" style="border-radius:20px" <button type="button"
class="p-4 w-full bg-gradient-to-r from-primary to-secondary text-white text-left font-semibold"
style="border-radius:20px"
(click)="scrollToMenu('menu-part-10');toggleAllParts(!partOpen.get('PART 10'),'PART 10')"> (click)="scrollToMenu('menu-part-10');toggleAllParts(!partOpen.get('PART 10'),'PART 10')">
PART&nbsp;10&nbsp;:&nbsp;คำชมหรือรางวัลที่ได้รับ&nbsp;(Conversation, Feedback, Recognise : CFR) PART&nbsp;10&nbsp;:&nbsp;คำชมหรือรางวัลที่ได้รับ&nbsp;(Conversation, Feedback, Recognise : CFR)
</button> </button>
......
src/app/components/performance-evaluation/pms-form-employee/pms-kpi/pms-kpi.component.ts
...@@ -81,6 +81,7 @@ export class PmsKpiComponent { ...@@ -81,6 +81,7 @@ export class PmsKpiComponent {
partShow: string[] = [] partShow: string[] = []
partOpen: Map<string, boolean> = new Map<string, boolean>() partOpen: Map<string, boolean> = new Map<string, boolean>()
partScore: Map<string, number> = new Map<string, number>() partScore: Map<string, number> = new Map<string, number>()
@Input() compentencyFormRemain = 0
@Input() evaluateeId = "" @Input() evaluateeId = ""
@Input() evaluaterId = "" @Input() evaluaterId = ""
@Input() appraisalPms?: Pms @Input() appraisalPms?: Pms
...@@ -96,7 +97,6 @@ export class PmsKpiComponent { ...@@ -96,7 +97,6 @@ export class PmsKpiComponent {
@ViewChild('scrollContainer') scrollContainer!: ElementRef; @ViewChild('scrollContainer') scrollContainer!: ElementRef;
@Output() scrollToMenuId: EventEmitter<any> = new EventEmitter<any>(); @Output() scrollToMenuId: EventEmitter<any> = new EventEmitter<any>();
remain = 0
constructor(private appraisalService: AppraisalService, constructor(private appraisalService: AppraisalService,
private pmsGroupGradeService: PmsGroupGradeService, private pmsGroupGradeService: PmsGroupGradeService,
private employeeService: EmployeeService, private employeeService: EmployeeService,
...@@ -517,9 +517,9 @@ export class PmsKpiComponent { ...@@ -517,9 +517,9 @@ export class PmsKpiComponent {
return 0 return 0
} }
allFormRemain() { allFormRemain() {
this.remain = [this.part1Remain(), this.part2Remain(), this.part3Remain(), this.part5Remain(), this.part6Remain(), this.part7Remain()].filter(data => data != 0).length const remain = [this.part1Remain(), this.part2Remain(), this.part3Remain(), this.compentencyFormRemain, this.part5Remain(), this.part6Remain(), this.part7Remain()].filter(data => data != 0).length
this.kpiForm.emit(this.appraisalPms) this.kpiForm.emit(this.appraisalPms)
this.kpiFormRemain.emit(this.remain) this.kpiFormRemain.emit(remain)
} }
remainList() { remainList() {
...@@ -527,7 +527,7 @@ export class PmsKpiComponent { ...@@ -527,7 +527,7 @@ export class PmsKpiComponent {
this.part1Remain(), this.part1Remain(),
this.part2Remain(), this.part2Remain(),
this.part3Remain(), this.part3Remain(),
this.remain, this.compentencyFormRemain,
this.part5Remain(), this.part5Remain(),
this.part6Remain(), this.part6Remain(),
this.part7Remain() this.part7Remain()
......
src/app/components/performance-evaluation/supervisor-evaluation/supervisor-evaluation.component.html
...@@ -35,12 +35,6 @@ ...@@ -35,12 +35,6 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-10 m-0 shadow-md">
<i class="ti ti-book fs-l"></i>
Help
</button>
</div> -->
</div> </div>
</div> </div>
<div class="w-full min-height-50px justify-between items-center py-2"> <div class="w-full min-height-50px justify-between items-center py-2">
...@@ -55,8 +49,9 @@ ...@@ -55,8 +49,9 @@
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover"> <table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead> <thead>
<tr> <tr>
<!-- ['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','เเผนพัฒนา','PMS','ผลประเมิน','เกรด' ,'สถานะผู้ประเมิน'] -->
<ng-container <ng-container
*ngFor="let item of subordinate.select?.showPms?['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','เเผนพัฒนา','PMS','ผลประเมิน','เกรด' ,'สถานะผู้ประเมิน']: *ngFor="let item of subordinate.select?.showPms?['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','ผลประเมิน','เกรด' ,'สถานะผู้ประเมิน']:
['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','เเผนพัฒนา','สถานะผู้ประเมิน']; let f = first; let l = last; let i = index"> ['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','เเผนพัฒนา','สถานะผู้ประเมิน']; let f = first; let l = last; let i = index">
<th scope="col" <th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary" class="relative px-10px py-10px bg-soft-secondary text-primary"
...@@ -105,16 +100,22 @@ ...@@ -105,16 +100,22 @@
<td style="font-size: 12px;">{{item.apsassessy.position.tdesc}}</td> <td style="font-size: 12px;">{{item.apsassessy.position.tdesc}}</td>
<td class="text-center"> <td class="text-center">
<div class="flex justify-center"> <div class="flex justify-center">
<button type="button" class="ti-btn rounded-sm " <!-- <button type="button" class="ti-btn rounded-sm "
*ngFor="let type of item.typeList" *ngFor="let type of item.typeList"
[class]="statusButtonClass(type.statusType)" [class]="statusButtonClass(type.statusType)"
style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;margin-left:4px;" style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;margin-left:4px;"
(click)="selectSubordinate(item,type.competencyTypeId,subordinate.select?.evaluationRoundId);pageEvalution=type.shortName"> (click)="selectSubordinate(item,type.competencyTypeId,subordinate.select?.evaluationRoundId);pageEvalution=type.shortName">
{{type.shortName}} {{type.shortName}}
</button> -->
<button type="button" class="ti-btn rounded-sm "
[class]="statusButtonClass(item.statusIdp.statusType)"
style="height: 30px; width: auto; font-size: 12px; display: flex; align-items: center; justify-content: center;margin-left:4px;"
(click)="selectSubordinate(item,'',subordinate.select?.evaluationRoundId,item.statusIdp.statusType);pageEvalution='open'">
{{statusCompetencyText(item.statusIdp.statusType)}}
</button> </button>
</div> </div>
</td> </td>
<td class="text-center"> <!-- <td class="text-center">
<div class="flex justify-center"> <div class="flex justify-center">
<button type="button" class="ti-btn rounded-sm" <button type="button" class="ti-btn rounded-sm"
[class]="statusButtonClass(item.statusIdp.statusType)" [class]="statusButtonClass(item.statusIdp.statusType)"
...@@ -133,7 +134,7 @@ ...@@ -133,7 +134,7 @@
PMS PMS
</button> </button>
</div> </div>
</td> </td> -->
<td class="text-center" style="font-size: 12px;" <td class="text-center" style="font-size: 12px;"
*ngIf="subordinate.select?.showPms"> *ngIf="subordinate.select?.showPms">
{{item.sumScore}}</td> {{item.sumScore}}</td>
......
src/app/components/performance-evaluation/supervisor-evaluation/supervisor-evaluation.component.ts
...@@ -38,6 +38,21 @@ export class SupervisorEvaluationComponent { ...@@ -38,6 +38,21 @@ export class SupervisorEvaluationComponent {
return "" return ""
} }
} }
statusCompetencyText = (status: string) => {
if (status === "no access") {
return "ยังไม่ถึงขั้นตอนดำเนินการ"
} else if (status === "pending") {
return "รอดำเนินการ"
} else if (status === "evaluating") {
return "อยู่ระหว่างดำเนินการ"
} else if (status === "completed") {
return "ดำเนินการเสร็จสิ้น"
} else if (status === "rejected") {
return "ส่งกลับ"
} else {
return ""
}
}
constructor(private appraisalService: AppraisalService, constructor(private appraisalService: AppraisalService,
private cdr: ChangeDetectorRef) { private cdr: ChangeDetectorRef) {
} }
......
src/app/shared/components/header/header.component.html
...@@ -738,7 +738,22 @@ ...@@ -738,7 +738,22 @@
<i class="ti ti-clipboard-check text-lg"></i> <i class="ti ti-clipboard-check text-lg"></i>
Task Manager Task Manager
</a> --> </a> -->
<a (click)="onSettingsClick()" class="ti-dropdown-item cursor-pointer"> <a *ngIf="!router.url.includes('/self-evaluation')" (click)="onNextPartClick('/self-evaluation')"
class="ti-dropdown-item cursor-pointer">
<i class="ti ti-settings text-lg"></i>
ประเมินตนเอง
</a>
<a *ngIf="!router.url.includes('/supervisor-evaluation')"
(click)="onNextPartClick('/supervisor-evaluation')" class="ti-dropdown-item cursor-pointer">
<i class="ti ti-settings text-lg"></i>
ประเมินโดยหัวหน้า
</a>
<a *ngIf="!router.url.includes('/employee-self-service')"
(click)="onNextPartClick('/employee-self-service')" class="ti-dropdown-item cursor-pointer">
<i class="ti ti-settings text-lg"></i>
employeeSelfServiceClick
</a>
<a (click)="onNextPartClick('/company-registration')" class="ti-dropdown-item cursor-pointer">
<i class="ti ti-settings text-lg"></i> <i class="ti ti-settings text-lg"></i>
Settings Settings
</a> </a>
......
src/app/shared/components/header/header.component.ts
...@@ -5,6 +5,7 @@ import { AuthService } from '../../services/auth.service'; ...@@ -5,6 +5,7 @@ import { AuthService } from '../../services/auth.service';
import { TokenService } from '../../services/token.service'; import { TokenService } from '../../services/token.service';
import { EmployeeService } from '../../services/employee.service'; import { EmployeeService } from '../../services/employee.service';
import { EmployeeModel, MyEmployeeModel } from '../../model/employee.model'; import { EmployeeModel, MyEmployeeModel } from '../../model/employee.model';
import { ActivatedRoute, Router } from '@angular/router';
@Component({ @Component({
selector: 'app-header', selector: 'app-header',
...@@ -13,19 +14,21 @@ import { EmployeeModel, MyEmployeeModel } from '../../model/employee.model'; ...@@ -13,19 +14,21 @@ import { EmployeeModel, MyEmployeeModel } from '../../model/employee.model';
}) })
export class HeaderComponent { export class HeaderComponent {
employeeProfile :EmployeeModel = new MyEmployeeModel(); employeeProfile: EmployeeModel = new MyEmployeeModel();
constructor(public navServices: NavService, constructor(public navServices: NavService,
private authService: AuthService, private authService: AuthService,
public tokenService:TokenService, public tokenService: TokenService,
private employeeService: EmployeeService, private employeeService: EmployeeService,
private elementRef: ElementRef, private elementRef: ElementRef,
public router: Router,
private route: ActivatedRoute,
private navService: NavService) { private navService: NavService) {
this.getEvaluatee(); this.getEvaluatee();
} }
getEvaluatee() { getEvaluatee() {
this.employeeProfile = new MyEmployeeModel(JSON.parse(sessionStorage.getItem('employeeProfile') || '{}')); this.employeeProfile = new MyEmployeeModel(JSON.parse(sessionStorage.getItem('employeeProfile') || '{}'));
if(this.employeeProfile?.employeeId == undefined || this.employeeProfile?.employeeId == null || this.employeeProfile?.employeeId == ''){ if (this.employeeProfile?.employeeId == undefined || this.employeeProfile?.employeeId == null || this.employeeProfile?.employeeId == '') {
this.employeeService.getWorking().subscribe({ this.employeeService.getWorking().subscribe({
next: response => { next: response => {
sessionStorage.setItem('employeeProfile', JSON.stringify(response)); sessionStorage.setItem('employeeProfile', JSON.stringify(response));
...@@ -142,4 +145,8 @@ export class HeaderComponent { ...@@ -142,4 +145,8 @@ export class HeaderComponent {
onSettingsClick() { onSettingsClick() {
this.navService.toggleEvaluationMenu(); this.navService.toggleEvaluationMenu();
} }
onNextPartClick(part: string) {
this.router.navigate([part]);
}
} }
src/app/shared/services/navservice.ts
...@@ -89,19 +89,19 @@ export class NavService implements OnDestroy { ...@@ -89,19 +89,19 @@ export class NavService implements OnDestroy {
} }
private MENUITEMS: Menu[] = [ private MENUITEMS: Menu[] = [
{ // {
title: 'ประเมินผล', // title: 'ประเมินผล',
type: 'sub', // type: 'sub',
selected: false, // selected: false,
active: false, // active: false,
path: '', // path: '',
id: 'm1', // id: 'm1',
show: true, // show: true,
children: [ // children: [
{ id: 'm11', path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link', show: true }, // { id: 'm11', path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link', show: true },
{ id: 'm12', path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link', show: true }, // { id: 'm12', path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link', show: true },
], // ],
}, // },
{ {
title: 'จัดการข้อมูลองค์กร', title: 'จัดการข้อมูลองค์กร',
type: 'sub', type: 'sub',
...@@ -188,22 +188,22 @@ export class NavService implements OnDestroy { ...@@ -188,22 +188,22 @@ export class NavService implements OnDestroy {
toggleEvaluationMenu() { toggleEvaluationMenu() {
// const menuItem = this.MENUITEMS.find(item => item.id === 'm1'); const menuItem = this.MENUITEMS.find(item => item.id === 'm1');
// if (menuItem) { if (menuItem) {
// menuItem.show = !menuItem.show; // Toggle ซ่อน/แสดง menuItem.show = !menuItem.show; // Toggle ซ่อน/แสดง
// menuItem.children?.forEach(child => child.show = menuItem.show); menuItem.children?.forEach(child => child.show = menuItem.show);
// this.menuItemsSubject.next([...this.MENUITEMS]); this.menuItemsSubject.next([...this.MENUITEMS]);
// const currentUrl = this.router.url; const currentUrl = this.router.url;
// const evaluationPaths = menuItem.children?.map(child => child.path) || []; const evaluationPaths = menuItem.children?.map(child => child.path) || [];
// if (!menuItem.show && evaluationPaths.includes(currentUrl)) { if (!menuItem.show && evaluationPaths.includes(currentUrl)) {
// this.router.navigate(['/company-registration']); this.router.navigate(['/company-registration']);
// } }
// if (menuItem.show) { if (menuItem.show) {
// this.router.navigate(['/self-evaluation']); this.router.navigate(['/self-evaluation']);
// } }
// } }
} }
} }
src/assets/css/style.css
...@@ -5860,6 +5860,11 @@ select option:focus { ...@@ -5860,6 +5860,11 @@ select option:focus {
--tw-gradient-to: rgb(var(--color-primary) / 0) var(--tw-gradient-to-position); --tw-gradient-to: rgb(var(--color-primary) / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
} }
.from-secondary {
--tw-gradient-from: rgb(var(--color-secondary)) var(--tw-gradient-from-position);
--tw-gradient-to: rgb(var(--color-secondary) / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-white { .from-white {
--tw-gradient-from: #fff var(--tw-gradient-from-position); --tw-gradient-from: #fff var(--tw-gradient-from-position);
--tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
...@@ -8151,6 +8156,9 @@ span.flatpickr-weekday { ...@@ -8151,6 +8156,9 @@ span.flatpickr-weekday {
.numInput:focus { .numInput:focus {
--tw-ring-color: rgb(var(--color-primary)); --tw-ring-color: rgb(var(--color-primary));
} }
.ring-primary {
--tw-ring-color: rgb(var(--color-primary));
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
--tw-bg-opacity: 1 !important; --tw-bg-opacity: 1 !important;
background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important; background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
...@@ -25110,6 +25118,9 @@ div:where(.swal2-container) div:where(.swal2-validation-message) { ...@@ -25110,6 +25118,9 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
color: rgb(var(--color-primary)); color: rgb(var(--color-primary));
} }
.text-soft-secondary-no-hover {
color: rgb(var(--color-secondary) / 0.25);
}
.text-soft-secondary { .text-soft-secondary {
color: rgb(var(--color-secondary) / 0.25); color: rgb(var(--color-secondary) / 0.25);
} }
...@@ -25138,3 +25149,7 @@ div:where(.swal2-container) div:where(.swal2-validation-message) { ...@@ -25138,3 +25149,7 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
.\!border-sort-secondary { .\!border-sort-secondary {
border-color: rgb(var(--color-secondary) / 0.1) !important; border-color: rgb(var(--color-secondary) / 0.1) !important;
} }
.\!ml-0{
margin-left: 0 !important;
}
\ No newline at end of file
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