ประเมินผลCompetency

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

@@ -113,7 +113,7 @@ import { SelfEvaluationComponent } from '../performance-evaluation/self-evaluati
 import { CompanyRegistrationPageComponent } from '../company-components/company-registration/company-registration-page/company-registration-page.component';
 import { IdpEvalutionComponent } from '../performance-evaluation/idp-evaluation/idp-evalution.component';
 import { PmsEvalutionComponent } from '../performance-evaluation/pms-evaluation/pms-evalution.component';
-
+import { CEvaluationComponent } from '../performance-evaluation/c-evaluation/c-evaluation.component';
 @NgModule({
   declarations: [
     SalesComponent,
@@ -208,6 +208,7 @@ import { PmsEvalutionComponent } from '../performance-evaluation/pms-evaluation/
     IdpEvalutionComponent,
     CompanyRegistrationPageComponent,
     PmsEvalutionComponent,
+    CEvaluationComponent
   ],
   imports: [
     CommonModule,

src/app/components/performance-evaluation/c-evaluation/c-evaluation.component.ts

+import { Component, EventEmitter, OnInit, Output, TemplateRef, ViewChild } from '@angular/core';
+import Swal from 'sweetalert2';
+
+
+export interface DataModel {
+  code: string,
+  name: string,
+  bi: BiModel[],
+}
+export interface BiModel {
+  name: string,
+  tools: string[],
+  degree: string
+}
+
+export interface Data2Model {
+  score: string[],
+  condition: string[],
+  e: string,
+  a: string,
+  gap: string
+}
+
+@Component({
+  selector: 'app-c-evaluation',
+  templateUrl: './c-evaluation.component.html',
+  styleUrls: ['./c-evaluation.component.scss']
+})
+export class CEvaluationComponent implements OnInit {
+  @Output() sendPageEvalution: EventEmitter<string> = new EventEmitter<string>();
+  pathTitle = ['การประเมินผล', 'ประเมินตนเอง']
+
+
+  hoveredCode: string | null = null;
+  dataList: DataModel[] = [
+    {
+      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"
+      }],
+    }
+  ]
+
+
+  dataList2: Data2Model[] = [{
+    score: ["หากได้คะแนน 90 - 100% ถือว่า Gap +1", "หากได้คะแนน 80 - 89% ถือว่า ไม่มี Gap", "หากได้คะแนน 60 - 79% ถือว่า Gap - 1", "หากได้คะแนน 40 - 59% ถือว่า Gap -", "หากได้คะแนน 0 - 39% ถือว่า Gap - 3"],
+    condition: ["1.หากได้คะแนนสูงกว่า 80% แต่มี 3 2 หรือ 1 ด้วย ถือว่า Gap -1", "2.หากได้คะแนนต่ำกว่า 80% แต่มี 4 และ 5 ให้คิด Gap ตาม %", "3.คะแนนต่ำกว่า 80% แต่มี 2 และ 1 ให้คิด Gap ตาม %"],
+    e: "4",
+    a: "3",
+    gap: "-1"
+  }]
+  @ViewChild('selfEvaluation1_2', { static: true }) selfEvaluation1_2!: TemplateRef<any>;
+  @ViewChild('selfEvaluation1_2Edit', { static: true }) selfEvaluation1_2Edit!: TemplateRef<any>;
+  currentTemplate: TemplateRef<any> = this.selfEvaluation1_2
+  ngOnInit(): void {
+    this.currentTemplate = this.selfEvaluation1_2
+  }
+
+  dataListFilter() {
+    return this.dataList
+  }
+  dataList2Filter() {
+    return this.dataList2
+  }
+  showTools(data: string[]) {
+    return data.join("/")
+  }
+
+  saveDraft() {
+    Swal.fire({
+      iconHtml: `
+        <div class="flex items-center justify-center rounded-full !h-80px !w-80px" style="background-color: #E8F8EE;">
+            <svg width="39" height="39" viewBox="0 0 39 39" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <rect width="39" height="39" fill="#D2D2D2"/>
+                <g id="Component">
+                    <g id="alert cart">
+                        <g id="mdi:file-export">
+                            <circle cx="22.5" cy="19.5" r="33.5" fill="#E8F8EE"/>
+                            <path d="M9.75 3.25C8.88805 3.25 8.0614 3.59241 7.4519 4.2019C6.84241 4.8114 6.5 5.63805 6.5 6.5V32.5C6.5 33.362 6.84241 34.1886 7.4519 34.7981C8.0614 35.4076 8.88805 35.75 9.75 35.75H29.25C30.112 35.75 30.9386 35.4076 31.5481 34.7981C32.1576 34.1886 32.5 33.362 32.5 32.5V13L22.75 3.25M21.125 5.6875L30.0625 14.625H21.125M14.5113 19.8575H26V31.3463L22.555 27.9013L17.9563 32.5L13.3575 27.9013L17.9563 23.3188" 
+                            fill="#1DBE5A"/>
+                        </g>
+                    </g>
+                </g>
+            </svg>
+        </div>
+        `,
+      title: 'บันทึกแบบร่าง',
+      text: 'คุณต้องการบันทึกแบบร่างของการประเมินนี้ใช่หรือไม่',
+      showCancelButton: true,
+      confirmButtonText: 'ยืนยันการบันทึก',
+      cancelButtonText: 'ย้อนกลับ',
+      customClass: {
+        title: '!swal2-title-mt-20px',
+        actions: '!swal2-actions-mt-20px',
+        icon: '!swal2-icon-no-border',
+        confirmButton: '!swal2-button-bg-green',
+        cancelButton: '!swal2-button-bg-gray',
+      },
+    }).then((result) => {
+      if (result.isConfirmed) {
+        Swal.fire({
+          title: 'บันทึกสำเร็จ!',
+          text: 'การประเมินของคุณถูกบันทึกแล้ว',
+          icon: 'success',
+          customClass: {
+            confirmButton: '!swal2-button-bg-green',
+          }
+        });
+      } else if (result.dismiss === Swal.DismissReason.cancel) {
+        Swal.fire({
+          title: 'ยกเลิก!',
+          text: 'การบันทึกถูกยกเลิก',
+          icon: 'error',
+          customClass: {
+            confirmButton: '!swal2-button-bg-danger',
+          }
+        });
+      }
+    });
+  }
+
+  returnPage() {
+    this.sendPageEvalution.emit("")
+  }
+}

src/app/components/performance-evaluation/pms-evaluation/pms-evalution.component.html

@@ -1020,13 +1020,7 @@
                             <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&&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">
+                                <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>

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

@@ -60,15 +60,15 @@
                         <td style="font-size: 12px;">{{item[2]}}</td>
                         <td class="flex justify-center">
                             <button type="button" class="ti-btn rounded-sm ti-btn-secondary"
-                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;">
+                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;" (click)="returnPage('c')">
                                 CC
                             </button>
                             <button type="button" class="ti-btn rounded-sm ti-btn-warning"
-                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;">
+                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;" (click)="returnPage('c')">
                                 MC
                             </button>
                             <button type="button" class="ti-btn rounded-sm ti-btn-success"
-                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;">
+                                style="height: 15px; width: 45px; font-size: 12px; display: flex; align-items: center; justify-content: center;" (click)="returnPage('c')">
                                 PC
                             </button>
                         </td>

src/app/components/performance-evaluation/supervisor-evaluation/supervisor-evaluation.component.html

@@ -38,4 +38,7 @@
 </ng-container>
 <ng-container *ngIf="pageEvalution=='pms'">
     <app-pms-evalution (sendPageEvalution)="pageEvalution=$event"></app-pms-evalution>
+</ng-container>
+<ng-container *ngIf="pageEvalution=='c'">
+    <app-c-evaluation (sendPageEvalution)="pageEvalution=$event"></app-c-evaluation>
 </ng-container>
\ No newline at end of file

src/assets/css/style.css

@@ -3785,6 +3785,9 @@ select option:focus {
 .col-span-10 {
   grid-column: span 10 / span 10;
 }
+.col-span-8 {
+  grid-column: span 8 / span 8;
+}
 .col-span-11 {
   grid-column: span 11 / span 11;
 }
@@ -24832,6 +24835,13 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 .swal2-styled.swal2-cancel.\!swal2-button-bg-gray:focus {
   box-shadow: 0 0 0 3px rgba(110, 120, 129, 0.5) !important;
 }
+.swal2-styled.swal2-confirm.\!swal2-button-bg-danger {
+  background-color: rgb(var(--color-danger)) !important;
+  border-radius: 20px !important;
+}
+.swal2-styled.swal2-confirm.\!swal2-button-bg-danger:focus {
+  box-shadow: 0 0 0 0px rgba(110, 120, 129, 0.5) !important;
+}
 .\!w-80px {
   width: 80px !important;
 }
@@ -24890,4 +24900,4 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 }
 .\!\-mt-3 {
   margin-top: -0.75rem !important;
-}
+}
\ No newline at end of file