<app-page-header [pathTitle]="pathTitle"></app-page-header>
<div class="bg-card-white">
</div>
<div class="block-main-content">
<ng-container *ngTemplateOutlet="pmsEvaluation"></ng-container>
</div>
<ng-template #pmsEvaluation>
<div class="pb-2rem px-2rem pt-1.5rem w-full min-height-50px justify-between items-center">
<div class="flex">
<button type="button" class="ti-btn ti-btn-outline ti-btn-outline-light h-20px m-0 shadow-md text-blue-500"
(click)="returnPage()">
<i class="ti ti-chevron-left"></i>
ย้อนกลับ
</button>
<div class="font-size-18px font-weight-700 align-center text-primary pl-1rem">
ประเมินผล
</div>
</div>
</div>
<div class="pb-2rem px-2rem">
<div class="font-size-18px font-weight-700 text-primary">
JOB PERFORMANCE EVALUATION FORM
</div>
</div>
<div class="pb-1rem px-2rem">
<div class="py-2 grid grid-cols-8 gap-3">
<div class="col-span-1 text-gray-400">ชื่อผู้รับการประเมิน(Employee)</div>
<div class="col-span-1 text-gray-400">น.ส. กมลชนก ภูผาลินิน</div>
<div class="col-span-1 text-gray-400">รหัส (ID)</div>
<div class="col-span-1 text-gray-400">18794</div>
<div class="col-span-1 text-gray-400">ตำแหน่ง (Position)</div>
<div class="col-span-1 text-gray-400">HRD Training Officer</div>
<div class="col-span-1 text-gray-400">แผนก (Section)</div>
<div class="col-span-1 text-gray-400">ฝ่าย (Department)</div>
</div>
<div class="py-2 grid grid-cols-8 gap-3">
<div class="col-span-1 text-gray-400">ชื่อผู้รับการประเมิน(Employee)</div>
<div class="col-span-1 text-gray-400">น.ส. พิมพร อูรณการ</div>
<div class="col-span-1 text-gray-400">รหัส (ID)</div>
<div class="col-span-1 text-gray-400">17724</div>
<div class="col-span-1 text-gray-400">Human Resource Development Officer S3</div>
<div class="col-span-1 text-gray-400">HRD Training Officer</div>
<div class="col-span-1 text-gray-400">แผนก (Section)</div>
<div class="col-span-1 text-gray-400">ฝ่าย (Department)</div>
</div>
</div>
<ng-container *ngTemplateOutlet="part1"></ng-container>
<ng-container *ngTemplateOutlet="part2"></ng-container>
<ng-container *ngTemplateOutlet="part3"></ng-container>
<ng-container *ngTemplateOutlet="part4"></ng-container>
<ng-container *ngTemplateOutlet="part5"></ng-container>
<ng-container *ngTemplateOutlet="part6"></ng-container>
<ng-container *ngTemplateOutlet="part7"></ng-container>
<ng-container *ngTemplateOutlet="part8"></ng-container>
<ng-container *ngTemplateOutlet="part9"></ng-container>
<div class="pb-1rem px-2rem">
<div class="py-2 grid grid-cols-7 gap-3">
<div class="col-span-1">ผู้ประเมิน1</div>
<div class="col-span-1">น.ส. พิมพร อูรณการ</div>
<div class="col-span-1">
<input type="checkbox" id="hs-basic-usage" class="ti-switch">
<label for="hs-basic-usage" class="sr-only">ยืนยันผล</label>
</div>
<div class="col-span-2">
<textarea type="text" rows="2" class="ti-form-input mb-2"></textarea>
<span class="pt-2">
วันที่ :
</span>
</div>
</div>
<div class="py-2 grid grid-cols-7 gap-3">
<div class="col-span-1">ผู้ประเมิน2</div>
<div class="col-span-1">น.ส. นดี แป้นศรี</div>
<div class="col-span-1">
<input type="checkbox" id="hs-basic-usage" class="ti-switch">
<label for="hs-basic-usage" class="sr-only">ตรวจสอบ</label>
</div>
<div class="col-span-2">
<textarea type="text" rows="2" class="ti-form-input mb-2" value="ใส่ Comment ที่นี่"></textarea>
<span>
วันที่ :
</span>
</div>
</div>
<div class="py-2 grid grid-cols-7 gap-3">
<div class="col-span-1">ผู้อนุมัติ</div>
<div class="col-span-1">น.ส.ศรีไพ คชา</div>
<div class="col-span-1">
<input type="checkbox" id="hs-basic-usage" class="ti-switch">
<label for="hs-basic-usage" class="sr-only">อนุมัติ</label>
</div>
<div class="col-span-2">
<textarea type="text" rows="2" class="ti-form-input mb-2" value="ใส่ Comment ที่นี่"></textarea>
<span>
วันที่ :
</span>
</div>
</div>
</div>
<div class="flex justify-center mb-1rem pb-2rem">
<button type="submit" class="ti-btn ti-btn-success mx-2rem">
บันทึกร่าง
</button>
<button type="submit" class="ti-btn ti-btn-success mx-2rem">
บันทึกข้อมูล
</button>
</div>
</ng-template>
<ng-template #part1>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 1 : ประเมินผลการปฏิบัติงานตามนโยบายบริษัท (Corporate KPI)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part1show=!part1show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part1show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part1show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part1show"></div>
<div class="pb-2rem px-2rem" *ngIf="part1show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','งานตามนโยบาย\n(Hoshin)','ตัวชี้วัดผลงานหลัก\n(Performance Indicator)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)',
'กำหนดเวลาแล้วเสร็จ\n(Time Line)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==7?'1':'2'" [attr.colspan]="i==7?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=7" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==7" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="dataListFilter().length">
<tr *ngFor="let item of dataListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start">
{{item.hoshin}}
</td>
<td class="align-start !white-space-normal">
{{item.performance}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.timeLine}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part1radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part1radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start !white-space-normal text-center">
50
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
10
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
8
</td>
<td class="align-start !white-space-normal text-center">
40
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center">
100
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
15.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
80
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part2>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 2 : ประเมินผลการปฏิบัติงานประจำ(Department KPI)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part2show=!part2show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part2show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part2show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part2show"></div>
<div class="pb-2rem px-2rem" *ngIf="part2show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','ตัวชี้วัดผลงานหลัก\n(Performance Indicator)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)',
'กำหนดเวลาแล้วเสร็จ\n(Time Line)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==6?'1':'2'" [attr.colspan]="i==6?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=6" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==6" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data2ListFilter().length">
<tr *ngFor="let item of data2ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.performance}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.timeLine}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part2radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part2radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start !white-space-normal text-center">
70
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
14
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
10
</td>
<td class="align-start !white-space-normal text-center">
52
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center">
100
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
30.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
74.29
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part3>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 3 : ประเมินผลการปฏิบัติงานประจำ(Individual KPI)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part3show=!part3show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part3show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part3show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part3show"></div>
<div class="pb-2rem px-2rem" *ngIf="part3show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','ตัวชี้วัดผลงานหลัก\n(Performance Indicator)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)',
'กำหนดเวลาแล้วเสร็จ\n(Time Line)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==6?'1':'2'" [attr.colspan]="i==6?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=6" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==6" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data3ListFilter().length">
<tr *ngFor="let item of data3ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.performance}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.timeLine}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part2radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part2radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start !white-space-normal text-center">
70
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
14
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
10
</td>
<td class="align-start !white-space-normal text-center">
52
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center">
100
</td>
<td class="align-start !white-space-normal text-center">
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
30.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
74.29
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part4>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 4 : ประเมินผลสมรรถนะที่สนับสนุนการปฏิบัติงาน(Competency)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part4show=!part4show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part4show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part4show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part4show"></div>
<div class="pb-2rem px-2rem" *ngIf="part4show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','Competency','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==3?'1':'2'" [attr.colspan]="i==3?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=3" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==3" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data4ListFilter().length">
<tr *ngFor="let item of data4ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.competency}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
คะแนนดิบ
70
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
30
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
9
</td>
<td class="align-start !white-space-normal text-center">
90
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
100
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
35.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
60
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part5>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 5 : จำนวนการเข้างาน( Time Attendance)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part5show=!part5show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part5show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part5show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part5show"></div>
<div class="pb-2rem px-2rem" *ngIf="part5show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','จำนวนการเข้างาน\n(Time attendance)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==3?'1':'2'" [attr.colspan]="i==3?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=3" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==3" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data5ListFilter().length">
<tr *ngFor="let item of data5ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.timeAttendance}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part4radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part4radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
20
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
13
</td>
<td class="align-start !white-space-normal text-center">
65
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
10.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
65
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part6>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 6: งานที่ได้รับมอบหมายเพิ่มเติม ( Cross Functional Project Assignment)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part6show=!part6show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part6show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part6show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part6show"></div>
<div class="pb-2rem px-2rem" *ngIf="part6show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','งานที่ได้รับมอบหมายเพิ่มเติม (Cross Functional Project Assignment)','ตัวชี้วัดผลงานหลัก\n(Performance Indicator)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)','กำหนดเวลาแล้วเสร็จ\n(Time Line)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==7?'1':'2'" [attr.colspan]="i==7?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=7" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==7" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data6ListFilter().length">
<tr *ngFor="let item of data6ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.crossFunctionalProjectAssignment}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.performanceIndicator}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.timeLine}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part5radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part5radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start text-center">
</td>
<td class="align-start text-center">
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
20
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
13
</td>
<td class="align-start !white-space-normal text-center">
65
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start text-center">
</td>
<td class="align-start text-center">
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
10.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
65
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part7>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 7: กิจกรรมพิเศษ( Special Activities)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part7show=!part7show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part7show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part7show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part7show"></div>
<div class="pb-2rem px-2rem" *ngIf="part7show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['ลำดับ\n(No.)','กิจกรรมพิเศษ (Special Activities)','ตัวชี้วัดผลงานหลัก\n(Performance Indicator)','เป้าหมายผลงาน\n(Target)','หน่วยนับ\n(Unit)','กำหนดเวลาแล้วเสร็จ\n(Time Line)','น้ำหนัก\n(Weight) [(A)]','ค่าเป้าหมาย(Target Degree)','สรุปผลงาน\n(Summary)\n[(B)]','คะแนนที่ได้\n(Score)\n[(A)x(B)]'];let i = index;let l = last">
<th scope="col" [attr.rowspan]="i==7?'1':'2'" [attr.colspan]="i==7?'5':'1'"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l&&i!=7" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
<th *ngIf="i==7" scope="col" rowspan="2"
class="relative bg-soft-secondary text-primary !text-center !p-0">
<div class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
<tr class="font-size-12px">
<ng-container *ngFor="let item of ['A(5)','B(4)','C(3)','D(2)','E(1)']">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
{{item}}
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data7ListFilter().length">
<tr *ngFor="let item of data7ListFilter();let i = index">
<td class="align-start text-center">
{{i+1}}
</td>
<td class="align-start !white-space-normal">
{{item.specialActivities}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.performanceIndicator}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.target}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.unit}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.timeLine}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.weight}}
</td>
<td class="align-start !white-space-normal text-center"
*ngFor="let item2 of item.targetDegree.text;let i2 = index">
<input type="radio" [name]="'part6radio'+i" class="ti-form-radio cursor-pointer"
[id]="'part6radio'+i+''+i2" [value]="item2" [(ngModel)]="item.targetDegree.check"><br>
{{item2}}
</td>
<td class="!p-0"></td>
<td class="align-start !white-space-normal text-center">
{{item.summary}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.score}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบ
</td>
<td class="align-start text-center">
10
</td>
<td class="align-start text-center">
</td>
<td class="align-start text-center">
</td>
<td class="align-start !white-space-normal text-center">
คำนวนถ่วงน้ำหนัก
</td>
<td class="align-start !white-space-normal text-center">
2
</td>
<td class="align-start !white-space-normal text-end" colspan="6">
คะแนนประเมินที่ได้
</td>
<td class="align-start !white-space-normal text-center">
11
</td>
<td class="align-start !white-space-normal text-center">
8.5
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
</td>
<td class="align-start text-center">
คะแนนดิบคิดเป็นร้อยละ
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start text-center">
</td>
<td class="align-start text-center">
</td>
<td class="align-start !white-space-normal text-center">
ร้อยละของปัจจัย
</td>
<td class="align-start !white-space-normal text-center">
5.0
</td>
<td class="align-start !white-space-normal text-end" colspan="7">
คะแนนที่ได้คิดเป็นร้อยละ
</td>
<td class="align-start !white-space-normal text-center" style="font-size: 1.25rem">
85.00
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part8>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 8 : สรุปผลการปฏิบัติงาน (Summary)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part8show=!part8show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part8show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part8show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part8show"></div>
<div class="pb-2rem px-2rem" *ngIf="part8show">
<div class="overflow-auto rounded-top-0.65rem">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead class="height-50px">
<tr class="font-size-12px">
<ng-container
*ngFor="let item of ['การประเมินผล (Evaluation Factor)','คะแนนดิบคิดเป็นร้อยละ','ร้อยละของปัจจัย','คะแนนที่ได้คิดเป็นร้อยละ','คะแนนสุทธิ\n(Net Score)','ระดับผลการปฏิบัติงาน'];let i = index;let l = last">
<th scope="col"
class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
<span class="font-size-12px font-weight-700 ">{{ item }}</span>
<div *ngIf="!l" class="absolute top-1/2 transform -translate-y-1/2 right-0">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="data8ListFilter().length">
<tr *ngFor="let item of data8ListFilter();let i = index">
<td class="align-start !white-space-normal">
{{item.evaluationFactor}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.rawScore}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.factors}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.scoreObtained}}
</td>
<td class="align-start !white-space-normal text-center">
{{item.netScore}}
</td>
<td class="align-start !white-space-normal text-center">
<span *ngIf="item.Level">
<i class="ti ti-star"></i>
</span> {{item.Level}}
</td>
</tr>
<tr class="bg-table-soft-gray">
<td class="align-start text-center">
รวม
</td>
<td class="align-start text-center">
</td>
<td class="align-start text-center">
100
</td>
<td class="align-start text-center">
74.05
</td>
<td class="align-start text-center">
70.04
</td>
<td class="align-start !white-space-normal text-center">
</td>
</tr>
</tbody>
</table>
</div>
</div>
</ng-template>
<ng-template #part9>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 9 : พฤติกรรมบุคคลที่เป็นจุดแข็ง จุดอ่อน และการพัฒนา
(EMPLOYEE STRENGTHS , WEAKNESSES AND PLAN TO IMPROVED)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part9show=!part9show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part9show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part9show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part9show"></div>
<div class="pb-2rem px-2rem" *ngIf="part9show">
<div class="pb-1rem">
<div class="pb-2 grid grid-cols-2">
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
พฤติกรรมที่เป็นจุดแข็ง (EMPLOYEE STRENGTHS AND ACCOMPLISHMENTS)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
พฤติกรรมที่เป็นจุดแข็ง (EMPLOYEE STRENGTHS AND ACCOMPLISHMENTS)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
</div>
<div class="pb-2 grid grid-cols-2">
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
พฤติกรรมที่เป็นจุดอ่อน (PERFORMANCE AREAS WHICH NEED IMPROVEMENT)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
หัวข้อที่ต้องเรียนรู้เพิ่มเติม (สำหรับจุดอ่อน)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
</div>
<div class="pb-2 grid grid-cols-2">
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
พฤติกรรมที่ควรได้รับการพัฒนา (PLAN OF ACTION TOWARD IMPROVED PERFORMANCE)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
<div class="col-span-1 grid-cols-1 text-gray-400">
<div class="col-span-1 bg-soft-secondary p-2">
หัวข้อที่ต้องเรียนรู้เพิ่มเติม (สำหรับพฤติกรรมที่ควรได้รับการพัฒนา)
</div>
<div class="col-span-1 p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
</div>
</div>
</div>
</ng-template>
<ng-template #part10>
<div class="mx-2rem py-1rem px-1rem bg-primary">
<div class="font-size-18px font-weight-700 text-white flex justify-between">
<div class="align-center">
Part 10: คำชมหรือรางวัลที่ได้รับ (Conversation, Feedback, Recognise : CFR)
</div>
<span class="w-10 h-10 ti-btn p-0 transition-none rounded-full border-white border-4 cursor-pointer"
(click)="part10show=!part10show">
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="part10show">
<path
d="M2.27921 10.64L7.92565 4.99357C8.12091 4.79831 8.4375 4.79831 8.63276 4.99357L14.2792 10.64"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
<svg class="w-2.5 h-2.5 font-bold" width="16" height="16" viewBox="0 0 16 16" fill="none"
*ngIf="!part10show">
<path
d="M2.27921 4.64001L7.92565 10.2865C8.12091 10.4817 8.4375 10.4817 8.63276 10.2865L14.2792 4.64001"
stroke="currentColor" stroke-width="2" stroke-linecap="round" />
</svg>
</span>
</div>
</div>
<div class="pb-2rem" *ngIf="!part10show"></div>
<div class="pb-2rem px-2rem" *ngIf="part10show">
<div class="pb-1rem p-2">
<textarea type="text" rows="2" class="ti-form-input"></textarea>
</div>
</div>
</ng-template>