การประเมินผล > ประเมินตนเอง

src/app/components/Performance Evaluation/self-evaluation/self-evaluation.component.html

+<app-page-header [pathTitle]="pathTitle"></app-page-header>
+<div class="bg-card-white">
+</div>
+<div class="block-main-content">
+    <ng-container *ngTemplateOutlet="currentTemplate"></ng-container>
+</div>
+
+<ng-template #selfEvaluation1_2>
+    <div class="font-size-18px font-weight-700 pt-1.5rem text-primary px-2rem">
+        ประเมินผล ประจำปี 2024
+    </div>
+    <div class="pt-0.75rem">
+        <div class="border-b border-gray-200 dark:border-white/10 px-2rem">
+            <nav class=" flex space-x-2 rtl:space-x-reverse">
+                <a class="border justify-center rounded-top-4px bg-primary text-white -mb-px py-2 px-3 inline-flex items-center gap-2 font-size-16px font-weight-500 text-center text-gray-600 active"
+                    href="javascript:void(0);" id="card-type-item-1" data-hs-tab="#underline-1"
+                    aria-controls="underline-1">
+                    รอบการประเมินที่ 1/2
+                </a>
+                <a class="border justify-center rounded-top-4px bg-primary text-white -mb-px py-2 px-3 inline-flex items-center gap-2 font-size-16px font-weight-500 text-center text-gray-600 active"
+                    href="javascript:void(0);" id="card-type-item-1" data-hs-tab="#underline-1"
+                    aria-controls="underline-1">
+                    รอบการประเมินที่ 2/2
+                </a>
+            </nav>
+        </div>
+        <div class="pt-50px">
+            <div id="underline-1" role="tabpanel" aria-labelledby="underline-item-1">
+                <div class="pb-2">
+                    <div class="w-full min-height-50px justify-between items-center pb-2">
+                        <div class="px-2rem py-3 bg-soft-secondary font-size-18px font-weight-700 text-primary">
+                            ข้อมูลพนักงาน
+                        </div>
+                    </div>
+                    <div class="p-2 grid grid-cols-12">
+                        <div class="col-span-2"></div>
+                        <div class="col-span-1 text-secondary">รหัสพนักงาน</div>
+                        <div class="col-span-2">20220064</div>
+                        <div class="col-span-1 text-secondary">ตำเเหน่ง</div>
+                        <div class="col-span-6">Customer Service Officer - Chain Store</div>
+                    </div>
+                    <div class="p-2 grid grid-cols-12">
+                        <div class="col-span-2"></div>
+                        <div class="col-span-1 text-secondary">ชื่อ - สกุล</div>
+                        <div class="col-span-2">อนันท์ ว่อง</div>
+                        <div class="col-span-1 text-secondary">ฝ่าย</div>
+                        <div class="col-span-6">ฝ่ายปฏิบัติการ</div>
+                    </div>
+                    <div class="p-2 grid grid-cols-12">
+                        <div class="col-span-2"></div>
+                        <div class="col-span-1 text-secondary">แผนก</div>
+                        <div class="col-span-2">แผนกบริการลูกค้า</div>
+                        <div class="col-span-1 text-secondary">ส่วน</div>
+                        <div class="col-span-6">ส่วนงานบริการลูกค้า-Chain Store</div>
+                    </div>
+                    <div class="p-2 grid grid-cols-12">
+                        <div class="col-span-2"></div>
+                        <div class="col-span-1 text-secondary">ส่วนย่อย</div>
+                        <div class="col-span-2">-</div>
+                        <div class="col-span-1 text-secondary">ส่วนย่อย 1 </div>
+                        <div class="col-span-6">-</div>
+                    </div>
+                </div>
+                <div class="pb-2">
+                    <div class="w-full min-height-50px justify-between items-center pb-2">
+                        <div class="px-2rem py-3 bg-soft-secondary font-size-18px font-weight-700 text-primary">
+                            รายละเอียดประเมินสมรรถนะ
+                        </div>
+                    </div>
+                    <div class="overflow-auto rounded-top-0.65rem px-2rem p-2">
+                        <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 ['รหัส','ชื่อเอกสาร','วันที่เริ่มต้น','วันที่สิ้นสุด','สถานะ','Action']; let f = first; let l = last">
+                                        <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
+                                            [class.!text-center]="f||l">
+                                            <span class="font-size-12px font-weight-700">{{ item }}</span>
+                                            <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
+                                                <i class="ti ti-dots-vertical fs-l"></i>
+                                            </div>
+                                        </th>
+                                    </ng-container>
+                                </tr>
+                            </thead>
+                            <tbody *ngIf="!dataListFilter().length">
+                                <tr>
+                                    <td class="text-center" colspan="100%">
+                                        ไม่พบข้อมูล
+                                    </td>
+                                </tr>
+                            </tbody>
+                            <tbody *ngIf="dataListFilter().length">
+                                <tr *ngFor="let item of dataListFilter();let i = index">
+                                    <td class="flex justify-center items-center">
+                                        {{item.code}}
+                                    </td>
+                                    <td>
+                                        {{item.name}}
+                                    </td>
+                                    <td>
+                                        {{item.startDate}}
+                                    </td>
+                                    <td>
+                                        {{item.endDate}}
+                                    </td>
+                                    <td>
+                                        {{item.status}}
+                                    </td>
+                                    <td class="flex justify-center items-center">
+                                        <span class="rounded-md bg-success text-white px-3 py-1 cursor-pointer"
+                                            (click)="currentTemplate = selfEvaluation1_2Edit ; pathTitle = ['การประเมินผล', 'ประเมินผล']">
+                                            ประเมิน
+                                        </span>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+                <div class="pb-2">
+                    <div class="w-full min-height-50px justify-between items-center pb-2">
+                        <div class="px-2rem py-3 bg-soft-secondary font-size-18px font-weight-700 text-primary">
+                            รายละเอียดประเมินผลงานการปฏิบัติงาน
+                        </div>
+                    </div>
+                    <div class="overflow-auto rounded-top-0.65rem px-2rem p-2">
+                        <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 ['รหัส','ชื่อเอกสาร','วันที่เริ่มต้น','วันที่สิ้นสุด','สถานะ','Action']; let f = first; let l = last">
+                                        <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
+                                            [class.!text-center]="f||l">
+                                            <span class="font-size-12px font-weight-700">{{ item }}</span>
+                                            <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
+                                                <i class="ti ti-dots-vertical fs-l"></i>
+                                            </div>
+                                        </th>
+                                    </ng-container>
+                                </tr>
+                            </thead>
+                            <tbody *ngIf="!dataList2Filter().length">
+                                <tr>
+                                    <td class="text-center" colspan="100%">
+                                        ไม่พบข้อมูล
+                                    </td>
+                                </tr>
+                            </tbody>
+                            <tbody *ngIf="dataList2Filter().length">
+                                <tr *ngFor="let item of dataList2Filter();let i = index">
+                                    <td class="flex justify-center items-center">
+                                        {{item.code}}
+                                    </td>
+                                    <td>
+                                        {{item.name}}
+                                    </td>
+                                    <td>
+                                        {{item.startDate}}
+                                    </td>
+                                    <td>
+                                        {{item.endDate}}
+                                    </td>
+                                    <td>
+                                        {{item.status}}
+                                    </td>
+                                    <td class="flex justify-center items-center">
+                                        <span class="rounded-md bg-success text-white px-3 py-1 cursor-pointer">
+                                            ประเมิน
+                                        </span>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</ng-template>
+
+
+
+<ng-template #selfEvaluation1_2Edit>
+    <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)="currentTemplate = selfEvaluation1_2 ;   pathTitle = ['การประเมินผล', 'ประเมินตนเอง']">
+                <i class="ti ti-chevron-left"></i>
+                ย้อนกลับ
+            </button>
+            <div class="font-size-18px font-weight-700 align-center text-primary pl-1rem">
+                ประเมินผล ประจำปี 2024
+            </div>
+        </div>
+    </div>
+    <div class="pb-2rem px-2rem">
+        <div class="font-size-18px font-weight-700 text-primary">
+            แบบประเมินสมรรถนะพนักงาน ประจำปี 2024
+        </div>
+    </div>
+    <div class="pb-2rem px-2rem">
+        <div class="p-2 grid grid-cols-6 gap-3">
+            <div class="grid-cols-1">
+                <div class="text-gray-400">เครื่องมือประเมิน</div>
+                <div class="text-gray-400">O = แบบสังเกต</div>
+                <div class="text-gray-400">P = แบบการปฏิบัติงาน</div>
+                <div class="text-gray-400">D = การบันทึก/เอกสาร</div>
+                <div class="text-gray-400">I = การสัมภาษณ์</div>
+                <div class="text-gray-400">T = แบบทดสอบ</div>
+            </div>
+            <div class="grid-cols-1">
+                <div class="text-gray-400">คำชี้แจง</div>
+                <div class="text-gray-400">- ใช้วิธีประเมินโดย ผู้บังคับบัญชา = 100 %</div>
+            </div>
+            <div class="col-span-2 grid-cols-1">
+                <div class="text-gray-400">ระดับความสามารถ (Target Degree)</div>
+                <div class="text-gray-400">ระดับ 1 = ไม่มีความรู้พื้นฐานเลย ขาดทักษะในงาน</div>
+                <div class="text-gray-400">ระดับ 2 = มีความรู้ในงานบ้างแต่ยังไม่สามารถ ประยุกต์ใช้ในงานได้</div>
+                <div class="text-gray-400">ระดับ 3 = นำความรู้มาประยุกต์ใช้ในงานได้ ปฏิบัติงานเองได้ด้วยตัวเอง
+                    แก้ไขปัญหาหน้างานได้</div>
+                <div class="text-gray-400">ระดับ 4 = สอนผู้อื่นได้ มีความคล่องตัว เชื่อมโยง ความรู้ในงานได้</div>
+                <div class="text-gray-400">ระดับ 5 = มีความชำนาญ เชี่ยวชาญ เป็นที่ยอมรับ ในองค์กร</div>
+            </div>
+            <div class="grid-cols-1">
+                <div class="text-gray-400 text-center">ระดับความคาดหวัง</div>
+                <div class="text-gray-400 text-center">1</div>
+                <div class="text-gray-400 text-center">2</div>
+                <div class="text-gray-400 text-center">3</div>
+                <div class="text-gray-400 text-center">4</div>
+                <div class="text-gray-400 text-center">5</div>
+                <div class="text-gray-400 text-center">6</div>
+                <div class="text-gray-400 text-center">7</div>
+                <div class="text-gray-400 text-center">8</div>
+            </div>
+            <div class="grid-cols-1">
+                <div class="text-gray-400 text-center">สำหรับพนักงานระดับ</div>
+                <div class="text-gray-400 text-center">O1 - O2</div>
+                <div class="text-gray-400 text-center">O3 - O4</div>
+                <div class="text-gray-400 text-center">S1 - S2</div>
+                <div class="text-gray-400 text-center">S3 - S4</div>
+                <div class="text-gray-400 text-center">M1 - M2</div>
+                <div class="text-gray-400 text-center">M3 - M4</div>
+                <div class="text-gray-400 text-center">E1 - E2</div>
+                <div class="text-gray-400 text-center">E3 - E4</div>
+            </div>
+        </div>
+    </div>
+    <div class="pb-2rem px-2rem">
+        <div class="overflow-auto rounded-top-0.65rem">
+            <table class="ti-custom-table ti-custom-table-head ti-custom-table-hover2">
+                <thead class="height-50px">
+                    <tr class="font-size-12px">
+                        <ng-container
+                            *ngFor="let item of ['ลำดับที่','รหัสสมรรถนะ','ชื่อสมรรถนะ','Behavior Indicator (BI)','เครื่องมือประเมิน\n(ตัวย่อ)\n(O,P,D,I,T)']">
+                            <th scope="col" rowspan="2"
+                                class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
+                                <span class="font-size-12px font-weight-700 ">{{ item }}</span>
+                                <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>
+                        <th scope="col" colspan="5"
+                            class="relative px-10px py-10px bg-soft-secondary text-primary !text-center">
+                            ระดับความสามารถ (Target Degree)
+                        </th>
+                    </tr>
+                    <tr class="font-size-12px">
+                        <ng-container *ngFor="let item of [5,4,3,2,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="!dataList3Filter().length">
+                    <tr>
+                        <td class="text-center" colspan="100%">
+                            ไม่พบข้อมูล
+                        </td>
+                    </tr>
+                </tbody>
+                <tbody *ngIf="dataList3Filter().length">
+                    <ng-container *ngFor=" let data of dataList3Filter();let i = index">
+                        <tr *ngFor="let item of data.bi;let i2 = index;let f = first"
+                            (mouseenter)="hoveredCode = data.code" (mouseleave)="hoveredCode = null"
+                            [ngClass]="{ 'table-hover2': data.code === hoveredCode ,'border-none':!f }">
+                            <td class="align-start text-center">
+                                <ng-container *ngIf="f">
+                                    {{i+1}}
+                                </ng-container>
+                            </td>
+                            <td class="align-start text-center">
+                                <ng-container *ngIf="f">
+                                    {{data.code}}
+                                </ng-container>
+                            </td>
+                            <td class="align-start" style="white-space:normal">
+                                <ng-container *ngIf="f">
+                                    {{data.name}}
+                                </ng-container>
+                            </td>
+                            <td class="align-start" style="white-space:normal">
+                                {{item.name}}
+                            </td>
+                            <td class="align-center text-center">
+                                {{showTools(item.tools)}}
+                            </td>
+                            <td class="align-center text-center"
+                                *ngFor="let value of ['5','4','3','2','1']; let i3=index">
+                                <input type="radio" [name]="'radio'+i+''+i2" class="ti-form-radio"
+                                    [id]="'radio'+i+''+i2+''+i3" [value]="value" [(ngModel)]="item.degree">
+                            </td>
+                        </tr>
+                    </ng-container>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</ng-template>
\ No newline at end of file

src/app/components/Performance Evaluation/self-evaluation/self-evaluation.component.ts

+import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
+
+export interface DataModel {
+  code: string,
+  name: string,
+  startDate: string,
+  endDate: string,
+  status: string
+}
+export interface Data2Model {
+  code: string,
+  name: string,
+  bi: BiModel[],
+}
+export interface BiModel {
+  name: string,
+  tools: string[],
+  degree: string
+}
+
+@Component({
+  selector: 'app-self-evaluation',
+  templateUrl: './self-evaluation.component.html',
+  styleUrls: ['./self-evaluation.component.scss']
+})
+export class SelfEvaluationComponent implements OnInit {
+
+  pathTitle = ['การประเมินผล', 'ประเมินตนเอง']
+
+  dataList: DataModel[] = [
+    {
+      code: "CC",
+      name: "การประเมินผลการปฏิบัติงาน (Performance Evaluation)",
+      startDate: "1 ตุลาคม 2567",
+      endDate: "30 ตุลาคม 2567",
+      status: "ยังไม่ประเมิน"
+    },
+    {
+      code: "MC",
+      name: "การประเมินศักยภาพ (Potential Evaluation)",
+      startDate: "1 ตุลาคม 2567",
+      endDate: "30 ตุลาคม 2567",
+      status: "ยังไม่ประเมิน"
+    },
+    {
+      code: "PC",
+      name: "การประเมินประสิทธิภาพขององค์กร (Organizational Effectiveness Evaluation)",
+      startDate: "1 ตุลาคม 2567",
+      endDate: "30 ตุลาคม 2567",
+      status: "ยังไม่ประเมิน"
+    }
+  ]
+  dataList2: DataModel[] = [
+    {
+      code: "KPI",
+      name: "Performance Management System",
+      startDate: "1 ตุลาคม 2567",
+      endDate: "30 ตุลาคม 2567",
+      status: "ยังไม่ประเมิน"
+    }
+  ]
+  
+  hoveredCode: string | null = null;
+  dataList3: Data2Model[] = [
+    {
+      code: "CC-01",
+      name: "จิตสำนึกด้านความปลอดภัยและคุณภาพ (Safety & Quality)",
+      bi: [{
+        name: "สอนงานด้านความปลอดภัย และคุณภาพของบริษัทให้กับพนักงานในหน่วยงาน",
+        tools: ["O"],
+        degree: "4"
+      }, {
+        name: "ติดตามและปรับปรุงการทำงานด้านความปลอดภัยและคุณภาพของทีมงาน",
+        tools: ["O", "D"],
+        degree: "5"
+      }],
+    },
+    {
+      code: "CC-02",
+      name: "การทำงานเป็นทีมแบบ TAT (TAT Teamwork)",
+      bi: [{
+        name: "คิดวิเคราะห์เพื่อแก้ปัญหาด้านความปลอดภัยและคุณภาพในหน่วยงานที่รับผิดชอบ",
+        tools: ["O", "D"],
+        degree: "5"
+      }, {
+        name: "นำเสนอและจัดทำรายงานด้านความปลอดภัยและคุณภาพทั้งภาษาไทยและภาษาอังกฤษ",
+        tools: ["O"],
+        degree: "2"
+      },
+      {
+        name: "สอนงาน และพัฒนาทีมงานให้เกิดการทำงานเป็นทีม โดยยึดเป้าหมายเดียวกัน (TAT Goal) และคำนึงถึง ความต้องการของลูกค้าเป็นหลัก (Next Customer)",
+        tools: ["O"],
+        degree: "2"
+      },
+      {
+        name: "สนับสนุนทีมงานให้ดำเนินการตามเป้าหมายของทีม และสิ่งที่ตนเองได้รับมอบหมาย",
+        tools: ["O", "D"],
+        degree: "4"
+      },
+      {
+        name: "วิเคราะห์และแก้ไขปัญหาที่เกิดจากการทำงานเป็นทีม รวมถึงการควบคุมดูแลให้เป็นไปตามเป้าหมาย",
+        tools: ["O"],
+        degree: "5"
+      },
+      {
+        name: "สื่อสารเพื่อสร้างความเข้าใจ และรับฟังความคิดเห็น ของสมาชิกในทีม ชื่นชมทีมงานแต่ละคนที่เป็น ส่วนหนึ่งในความสำเร็จของทีมร่วมกัน",
+        tools: ["O", "D"],
+        degree: "5"
+      }],
+    }
+  ]
+  @ViewChild('selfEvaluation1_2', { static: true }) selfEvaluation1_2!: TemplateRef<any>;
+  @ViewChild('selfEvaluation1_2Edit', { static: true }) selfEvaluation1_2Edit!: TemplateRef<any>;
+  currentTemplate: TemplateRef<any> = this.selfEvaluation1_2Edit
+  ngOnInit(): void {
+    this.currentTemplate = this.selfEvaluation1_2Edit
+  }
+  dataListFilter() {
+    return this.dataList
+  }
+  dataList2Filter() {
+    return this.dataList2
+  }
+  dataList3Filter() {
+    return this.dataList3
+  }
+  showTools(data: string[]) {
+    return data.join("/")
+  }
+}

src/app/components/Performance Evaluation/supervisor-evaluation/round-one/round-one.component.html

@@ -32,7 +32,7 @@
                              <ng-container
                              *ngFor="let item of ['รหัสพนักงาน','ชื่อพนักงาน','ตำเเหน่งงาน','ประเมิน','เเผนพัฒนา','PMS','ผลประเมิน','เกรด','สถานะ','สถานะผู้ประเมิน']; let f = first; let l = last; let i = index">
                                  <th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
-                                    [class.!text-center]="f||l||'ประเมิณ'||'เเผนพัฒนา'||'PMS'">
+                                    [class.!text-center]="f||l||'ประเมิน'||'เเผนพัฒนา'||'PMS'">
                                      <span class="text-sm">{{ item }}</span>
                                      <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l&&!f&&!i">
                                          <svg class="head-table-icon" xmlns="http://www.w3.org/2000/svg" width="50" 

src/app/components/competency-assessment/competency-management/indicators-and-curriculum/edit-group-indicators/edit-group-indicators.html

@@ -113,13 +113,13 @@
                         <div *ngIf="data.behaviorIndicators.length" class="grid grid-cols-1 gap-2 mb-2">
                             <span *ngFor="let item of data.behaviorIndicators;" class="grid grid-cols-12 height-20px">
                                 <div class="col-span-11 flex align-center">
-                                    <div class="hs-tooltip ti-main-tooltip [--trigger:hover] truncate">
-                                        <div class="hs-tooltip-toggle cursor-pointer truncate">
+                                    <div class="hs-tooltip ti-main-tooltip [--trigger:click] truncate">
+                                        <a class="hs-tooltip-toggle cursor-pointer truncate" href="javascript:;">
                                             {{item}}
                                             <div class="hs-tooltip-content ti-main-tooltip-content" role="tooltip">
                                                 {{item}}
                                             </div>
-                                        </div>
+                                        </a>
                                     </div>
                                 </div>
                                 <div class="col-span-1 text-center align-center">
@@ -144,30 +144,30 @@
                             <span *ngFor="let assessmentTools of data.assessmentTools; let l=index"
                                 class="grid grid-cols-5 text-center align-center height-20px">
                                 <button type="button" *ngFor="let item of assessmentTools | slice: 0 : 4; let m=index"
-                                    class="ti-btn rounded-sm ti-btn-secondary text-center m-0 hs-tooltip ti-main-tooltip [--trigger:hover] flex"
-                                    [ngClass]="{'cursor-default': m < 3,
-                                    ' cursor-pointer': m == 3}" style="height: 15px; width: 45px"
+                                    class="ti-btn rounded-sm ti-btn-secondary text-center m-0 hs-tooltip ti-main-tooltip  flex"
+                                    [ngClass]="{'cursor-default [--trigger:click]': m < 3,
+                                    ' cursor-pointer [--trigger:hover]': m == 3}" style="height: 15px; width: 45px"
                                     (click)="(m < 3 ? null :dataSelect=data);(m < 3 ? null :assessmentToolsSelect=l)"
                                     [attr.data-hs-overlay]="m < 3 ? null : '#assessment-tools-modal'">
                                     <ng-container [ngSwitch]="m < 3">
                                         <ng-container *ngSwitchCase="true">
-                                            <span class="hs-tooltip-toggle">
+                                            <a class="hs-tooltip-toggle" href="javascript:;">
                                                 {{item.nameShow}}
                                                 <div class="hs-tooltip-content ti-main-tooltip-content" role="tooltip">
                                                     {{item.code}} : {{item.name}}
                                                 </div>
-                                            </span>
+                                            </a>
                                             <div class="ciricon flex text-start items-center cursor-pointer">
                                                 <i class="ri-close-line text-red-500"></i>
                                             </div>
                                         </ng-container>
                                         <ng-container *ngSwitchDefault>
-                                            <span class="hs-tooltip-toggle">
+                                            <a class="hs-tooltip-toggle" href="javascript:;">
                                                 ...
                                                 <div class="hs-tooltip-content ti-main-tooltip-content" role="tooltip">
                                                     คลิกเพื่อดูเครื่องมือประเมินเพิ่มเติม
                                                 </div>
-                                            </span>
+                                            </a>
                                         </ng-container>
                                     </ng-container>
                                 </button>
@@ -194,14 +194,14 @@
                                     <span *ngFor="let item of data.curriculum;"
                                         class="grid grid-cols-12 border rounded-sm px-5px bg-white">
                                         <span class="col-span-11 align-center truncate">
-                                            <div class="hs-tooltip ti-main-tooltip [--trigger:hover] flex truncate">
-                                                <div class="hs-tooltip-toggle cursor-pointer truncate">
+                                            <div class="hs-tooltip ti-main-tooltip [--trigger:click] flex truncate">
+                                                <a class="hs-tooltip-toggle cursor-pointer truncate" href="javascript:;">
                                                     {{item.name}}
                                                     <div class="hs-tooltip-content ti-main-tooltip-content"
                                                         role="tooltip">
                                                         {{item.name}}
                                                     </div>
-                                                </div>
+                                                </a>
                                             </div>
                                         </span>
 

src/app/components/dashboard/dashboard-routing.module.ts

@@ -37,6 +37,7 @@ import { NameRegistrationPerfomanceComponent } from '../performance-management-e
 import { EvaluationFactorsComponent } from '../performance-management-evaluation/evaluation-factors/evaluation-factors.component';
 import { GradeRegistrationComponent } from '../competency-assessment/grade-registration/grade-registration.component';
 import { SettingPerformanceEvalutionComponent } from '../performance-management-evaluation/setting-performance-evalution/setting-performance-evalution.component';
+import { SelfEvaluationComponent } from '../Performance Evaluation/self-evaluation/self-evaluation.component';
 
 
 
@@ -58,31 +59,32 @@ const routes: Routes = [
       { path: "dashboard/course", component: CourseComponent },
 
       // myComponent
-      { path: "company-registration",title: 'ทะเบียนบริษัท', component: CompanyRegistrationComponent },
-      { path: "job-description",title: 'ข้อมูลลักษณะงาน', component: JobDescriptionComponent },
-      { path: "account-settings",title: 'ตั้งค่าผู้ใช้งาน', component: AccountSettingsComponent },
-      { path: "name-registration",title: 'ทะเบียนกำหนดชื่อ', component: NameRegistrationComponent },
-      { path: "tool-register",title: 'ทะเบียนเครื่องมือ', component: ToolRegisterComponent },
-      { path: "competency-management",title: 'การจัดการสมรรถนะ', component: CompetencyManagementComponent },
-      { path: "job-detail-management",title: 'การจัดการรายละเอียดงาน', component: JobDetailManagementComponent },
-      { path: "course-registration",title: 'ทะเบียนหลักสูตร', component: CourseRegistrationComponent },
-      { path: "edit-group-competencies",title: 'แก้ไขกลุ่มสมรรถนะ', component: EditGroupCompetenciesComponent },
-      { path: "evaluation-cycle-manager",title: 'การจัดการรอบการประเมิน', component: EvaluationCycleManagerComponent  },
-      { path: "setting-competency",title: 'การตั้งค่า', component: SettingCompetencyComponent },
-      { path: "idp-development-plan",title: 'เเผนพัฒนา IDP', component: IdpDevelopmentPlanComponent },
-      { path: "job-competency",title: 'ความรู้ ทักษะ ความสามารถในตำเเหน่งงาน', component: JobCompetencyComponent },
-      { path: "job-qualifications",title: 'คุณสมบัติที่จำเป็นต่อการปฏิบัติหน้าที่', component: JobQualificationsComponent },
-      { path: "job-detail",title: 'รายละเอียดของงาน', component: JobDetailComponent },
-      { path: "command-structure",title: 'โครงสร้างสายการบังคับบัญชา', component: CommandStructureComponent },
-      { path: "assessment-management",title: 'การจัดการการประเมิน', component: AssessmentManagementComponent },
-      { path: "job-position-indicators",title: 'ตัวชี้วัดของตำแหน่งงาน', component: JobPositionIndicatorsComponent },
-      { path: "evaluation-cycle-performance",title: 'รอบการประเมิน', component: EvaluationCyclePerformanceComponent },
-      { path: "supervisor-evaluation",title: 'ประเมินโดยหัวหน้า', component: SupervisorEvaluationComponent },
-      { path: "employee-registration",title: 'ทะเบียนพนักงาน', component: EmployeeRegistrationComponent },
-      { path: "name-registration-perfomance",title: 'ทะเบียนกำหนดชื่อ', component: NameRegistrationPerfomanceComponent },
-      { path: "evaluation-factors",title: 'การประเมินจัดการประสิทธิภาพ', component: EvaluationFactorsComponent },
-      { path: "grade-registration",title: 'ทะเบียนเกรด', component: GradeRegistrationComponent },
-      { path: "setting-performance-evalution",title: 'การตั้งค่า', component: SettingPerformanceEvalutionComponent },
+      { path: "company-registration", title: 'ทะเบียนบริษัท', component: CompanyRegistrationComponent },
+      { path: "job-description", title: 'ข้อมูลลักษณะงาน', component: JobDescriptionComponent },
+      { path: "account-settings", title: 'ตั้งค่าผู้ใช้งาน', component: AccountSettingsComponent },
+      { path: "name-registration", title: 'ทะเบียนกำหนดชื่อ', component: NameRegistrationComponent },
+      { path: "tool-register", title: 'ทะเบียนเครื่องมือ', component: ToolRegisterComponent },
+      { path: "competency-management", title: 'การจัดการสมรรถนะ', component: CompetencyManagementComponent },
+      { path: "job-detail-management", title: 'การจัดการรายละเอียดงาน', component: JobDetailManagementComponent },
+      { path: "course-registration", title: 'ทะเบียนหลักสูตร', component: CourseRegistrationComponent },
+      { path: "edit-group-competencies", title: 'แก้ไขกลุ่มสมรรถนะ', component: EditGroupCompetenciesComponent },
+      { path: "evaluation-cycle-manager", title: 'การจัดการรอบการประเมิน', component: EvaluationCycleManagerComponent },
+      { path: "setting-competency", title: 'การตั้งค่า', component: SettingCompetencyComponent },
+      { path: "idp-development-plan", title: 'เเผนพัฒนา IDP', component: IdpDevelopmentPlanComponent },
+      { path: "job-competency", title: 'ความรู้ ทักษะ ความสามารถในตำเเหน่งงาน', component: JobCompetencyComponent },
+      { path: "job-qualifications", title: 'คุณสมบัติที่จำเป็นต่อการปฏิบัติหน้าที่', component: JobQualificationsComponent },
+      { path: "job-detail", title: 'รายละเอียดของงาน', component: JobDetailComponent },
+      { path: "command-structure", title: 'โครงสร้างสายการบังคับบัญชา', component: CommandStructureComponent },
+      { path: "assessment-management", title: 'การจัดการการประเมิน', component: AssessmentManagementComponent },
+      { path: "job-position-indicators", title: 'ตัวชี้วัดของตำแหน่งงาน', component: JobPositionIndicatorsComponent },
+      { path: "evaluation-cycle-performance", title: 'รอบการประเมิน', component: EvaluationCyclePerformanceComponent },
+      { path: "supervisor-evaluation", title: 'ประเมินโดยหัวหน้า', component: SupervisorEvaluationComponent },
+      { path: "employee-registration", title: 'ทะเบียนพนักงาน', component: EmployeeRegistrationComponent },
+      { path: "name-registration-perfomance", title: 'ทะเบียนกำหนดชื่อ', component: NameRegistrationPerfomanceComponent },
+      { path: "evaluation-factors", title: 'การประเมินจัดการประสิทธิภาพ', component: EvaluationFactorsComponent },
+      { path: "grade-registration", title: 'ทะเบียนเกรด', component: GradeRegistrationComponent },
+      { path: "setting-performance-evalution", title: 'การตั้งค่า', component: SettingPerformanceEvalutionComponent },
+      { path: "self-evaluation", title: 'ประเมินตนเอง', component: SelfEvaluationComponent },
 
     ]
   }

src/app/components/dashboard/dashboard.module.ts

@@ -109,6 +109,7 @@ import { EditGroupGradeComponent } from '../competency-assessment/grade-registra
 import { SubGradeRegistrationComponent } from '../competency-assessment/grade-registration/grade-management/sub-grade-registration/sub-grade-registration.component';
 import { SettingPerformanceEvalutionComponent } from '../performance-management-evaluation/setting-performance-evalution/setting-performance-evalution.component';
 import { AssessmentSystemConfigurationComponent } from '../performance-management-evaluation/setting-performance-evalution/assessment-system-configuration/assessment-system-configuration.component';
+import { SelfEvaluationComponent } from '../Performance Evaluation/self-evaluation/self-evaluation.component';
 
 @NgModule({
   declarations: [
@@ -200,6 +201,7 @@ import { AssessmentSystemConfigurationComponent } from '../performance-managemen
     SubGradeRegistrationComponent,
     SettingPerformanceEvalutionComponent,
     AssessmentSystemConfigurationComponent,
+    SelfEvaluationComponent
   ],
   imports: [
     CommonModule,

src/app/shared/services/navservice.ts

@@ -155,6 +155,7 @@ export class NavService implements OnDestroy {
       active: false,
       path: '/supervisor-evaluation',
       children: [
+        { path: '/self-evaluation', title: 'ประเมินตนเอง', type: 'link' },
         { path: '/', title: 'การจัดการการประเมิน', type: 'link' },
         { path: '/supervisor-evaluation', title: 'ประเมินโดยหัวหน้า', type: 'link' },
       ],

src/assets/css/style.css

@@ -24766,6 +24766,10 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 .rounded-4px {
   border-radius: 4px;
 }
+.rounded-top-4px {
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
+}
 
 .rounded-top-0\.65rem {
   border-top-left-radius: 0.65rem;
@@ -24848,3 +24852,16 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 .\!pl-0 {
   padding-left: 0 !important;
 }
+
+.\-mx-2rem {
+  margin-left: -2rem;
+  margin-right: -2rem;
+}
+
+.ti-custom-table-hover2 tbody tr.table-hover2 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(241 245 249 / var(--tw-bg-opacity));
+}
+.border-none {
+  border: none;
+}