Calibrate คะแนน

src/app/components/calibrate/calibrate.component.scss

+.bg-gradient-custom {
+    background: linear-gradient(135deg, #4f46e5, #ec4899 60%, #f59e0b);
+    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
+    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
+    mask-size: 100% 100%;
+    mask-repeat: no-repeat;
+}
+
+
+.row {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.col {
+    flex: 1;
+}
+
+@for $i from 1 through 12 {
+    $width: (
+        $i / 12) * 100%;
+
+    .col-#{$i} {
+        flex: 0 0 $width;
+        max-width: $width;
+    }
+}
+
+
+@for $i from 1 through 100 {
+    .m-#{$i}rem {
+        margin: #{$i}rem;
+    }
+
+    .mt-#{$i}rem {
+        margin-top: #{$i}rem;
+    }
+
+    .ml-#{$i}rem {
+        margin-left: #{$i}rem;
+    }
+
+    .mb-#{$i}rem {
+        margin-bottom: #{$i}rem;
+    }
+
+    .mr-#{$i}rem {
+        margin-right: #{$i}rem;
+    }
+
+    .p-#{$i}rem {
+        padding: #{$i}rem;
+    }
+
+    .pt-#{$i}rem {
+        padding-top: #{$i}rem;
+    }
+
+    .pl-#{$i}rem {
+        padding-left: #{$i}rem;
+    }
+
+    .pb-#{$i}rem {
+        padding-bottom: #{$i}rem;
+    }
+
+    .pr-#{$i}rem {
+        padding-right: #{$i}rem;
+    }
+}
+
+
+// th{
+//   position: relative;         // เทียบเท่า class "relative"
+//   padding: 10px;              // เทียบเท่า class "px-10px py-10px" (อาจเปลี่ยนตามต้องการ)
+//   background-color: rgb(96 165 250 / 0.1);  // ตัวอย่างแทน "bg-soft-secondary"
+//   color: #2b2b2b;             // ตัวอย่างแทน "text-primary"
+//   text-align: center !important;  // เทียบเท่า "!text-center"
+
+//   // หากต้องการดีไซน์อื่น ๆ เพิ่มเติมก็ใส่ในนี้ได้เลย เช่น:
+//   font-weight: 600;
+//   border-bottom: 1px solid #eee;
+// }
+.e-headercell,
+.e-detailheadercell {
+    background-color: rgb(96 165 250 / 0.1) !important;
+}
+
+.e-pager .e-currentitem,
+.e-pager .e-currentitem:hover {
+    background: rgb(96 165 250) !important;
+    color: #fff;
+    opacity: 1 !important;
+}
+
+
+.e-checkbox-wrapper .e-frame.e-check,
+.e-css.e-checkbox-wrapper .e-frame.e-check {
+    background-color: rgb(96 165 250) !important;
+    border-color: transparent;
+    color: #fff;
+}
+
+.e-checkbox-wrapper .e-frame,
+.e-css.e-checkbox-wrapper .e-frame {
+    border: 1px solid !important;
+    border-radius: 2px;
+    box-sizing: border-box;
+    cursor: pointer;
+    display: inline-block;
+    font-family: "e-icons";
+    height: 18px;
+    line-height: 10px;
+    padding: 2px 0;
+    text-align: center;
+    vertical-align: middle;
+    width: 1rem !important;
+    border-color: #64748b !important;
+}
+
+.e-grid td.e-selectionbackground {
+    background-color: #aec2ec !important;
+}
+
+
+
+
+
+
+.row {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.col {
+    flex: 1;
+}
+
+@for $i from 1 through 12 {
+    $width: (
+        $i / 12) * 100%;
+
+    .col-#{$i} {
+        flex: 0 0 $width;
+        max-width: $width;
+    }
+}
+
+
+@for $i from 1 through 100 {
+    .m-#{$i}rem {
+        margin: #{$i}rem;
+    }
+
+    .mt-#{$i}rem {
+        margin-top: #{$i}rem;
+    }
+
+    .ml-#{$i}rem {
+        margin-left: #{$i}rem;
+    }
+
+    .mb-#{$i}rem {
+        margin-bottom: #{$i}rem;
+    }
+
+    .mr-#{$i}rem {
+        margin-right: #{$i}rem;
+    }
+
+    .p-#{$i}rem {
+        padding: #{$i}rem;
+    }
+
+    .pt-#{$i}rem {
+        padding-top: #{$i}rem;
+    }
+
+    .pl-#{$i}rem {
+        padding-left: #{$i}rem;
+    }
+
+    .pb-#{$i}rem {
+        padding-bottom: #{$i}rem;
+    }
+
+    .pr-#{$i}rem {
+        padding-right: #{$i}rem;
+    }
+}
+
+@media print {
+    body * {
+        visibility: hidden;
+        /* ซ่อนทุก element */
+    }
+
+    #printArea,
+    #printArea * {
+        visibility: visible;
+        /* แสดงเฉพาะ #printArea */
+    }
+
+    #printArea {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+    }
+}
+
+.pdf-container {
+    transform: translateZ(0
+    );
+}
\ No newline at end of file

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

@@ -80,6 +80,7 @@ import { JobManagementComponent } from '../job-management/job-management.compone
 import { WelfareRewardComponent } from '../welfare-reward/welfare-reward.component';
 import { TimeAttendanceWizardComponent } from '../time-attendance-wizard/time-attendance-wizard.component';
 import { ReviewHistoryComponent } from '../review-history/review-history.component';
+import { CalibrateComponent } from '../calibrate/calibrate.component';
 
 
 
@@ -175,6 +176,7 @@ const routes: Routes = [
       { path: "ess/welfare-reward", title: 'Welfare & Reward', component: WelfareRewardComponent },
       { path: "ess/time-attendance-wizard", title: 'TimeAttendance', component: TimeAttendanceWizardComponent },
       { path: "ess/review-history", title: 'ดูข้อมูลย้อนหลัง', component: ReviewHistoryComponent },
+      { path: "ess/calibrate", title: 'calibrate คะแนน', component: CalibrateComponent },
     ]
   }
 ];

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

@@ -236,6 +236,7 @@ import { JobManagementComponent } from '../job-management/job-management.compone
 import { WelfareRewardComponent } from '../welfare-reward/welfare-reward.component';
 import { TimeAttendanceWizardComponent } from '../time-attendance-wizard/time-attendance-wizard.component';
 import { ReviewHistoryComponent } from '../review-history/review-history.component';
+import { CalibrateComponent } from '../calibrate/calibrate.component';
 
 export const MY_DATE_FORMATS = {
   parse: {
@@ -411,7 +412,8 @@ export class CustomDateAdapter extends NativeDateAdapter {
     JobManagementComponent,
     WelfareRewardComponent,
     TimeAttendanceWizardComponent,
-    ReviewHistoryComponent
+    ReviewHistoryComponent,
+    CalibrateComponent
   ], imports: [
     TranslateModule,
     CommonModule,

src/app/components/employee-self-service/employee-self-service.component.ts

@@ -41,7 +41,7 @@ export class EmployeeSelfServiceComponent {
     { text: "ผลงานดีเด่น", link: "/ess/outstanding-performance" },
     { text: "Feedback", link: "/ess/self-evaluation/kpi-sum10" },
     { text: "ดูข้อมูลย้อนหลัง", link: "/ess/review-history" },
-    { text: "Calibrate คะแนน", description: "หน้ารายงานที่มีการ Calibrate และแสดงค่า K" },
+    { text: "Calibrate คะแนน", link: "/ess/calibrate" },
     { text: "ข้อสอบ", link: "/ess/self-evaluation/com" },
     { text: "Download เอกสาร", description: "เป็น pop up แสดงข้อมูลไฟล์ให้ดาวน์โหลด เหมือนของ myHR plus" }
   ];

src/app/shared/components/sidebar/sidebar.component.ts

@@ -116,6 +116,7 @@ export class SidebarComponent {
       this.currentUrl.includes('ess/welfare-reward') ||
       this.currentUrl.includes('ess/time-attendance-wizard') ||
       this.currentUrl.includes('ess/review-history') ||
+      this.currentUrl.includes('ess/calibrate') ||
       this.currentUrl.includes('ess/job-description')
     if (this.showSideMenu) {
       const html: any = this.elementRef.nativeElement.ownerDocument.documentElement;;
@@ -206,6 +207,7 @@ export class SidebarComponent {
           this.currentUrl.includes('ess/welfare-reward') ||
           this.currentUrl.includes('ess/time-attendance-wizard') ||
           this.currentUrl.includes('ess/review-history') ||
+          this.currentUrl.includes('ess/calibrate') ||
           this.currentUrl.includes('ess/job-description')
         if (this.showSideMenu) {
           const html: any = this.elementRef.nativeElement.ownerDocument.documentElement;;