UPDATE รอบการประเมินผล

src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle-manager.component.ts

@@ -8,6 +8,6 @@ import { StatusCodeModel } from 'src/app/shared/model/status-code.model';
 
 export class EvaluationCycleManagerComponent {
   @Input() pathTitle = ['การประเมินสมรรถนะ', 'การจัดการรอบการประเมิน', 'รอบการประเมิน']
-  activeTab: string = 'underline-2'; // Tab แรกแสดงเป็นค่าเริ่มต้น
+  activeTab: string = 'underline-1'; // Tab แรกแสดงเป็นค่าเริ่มต้น
   groupShow = '1'
 }
\ No newline at end of file

src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle/evaluation-cycle.component.html

@@ -95,6 +95,7 @@
               id="checkbox-{{item.data.evaluationRoundId}}" [(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
           </td>
           <td >
+            <i class="ti ti-user cursor-pointer i-gray fs-l px-1" data-hs-overlay="#evaluation-cycle-person-modal" (click)="openModal('evaluation-cycle-person-modal',item.data.evaluationRoundId)"></i>
             <label for="checkbox-{{item.data.evaluationRoundId}}">&nbsp;{{item.data.evaluationRoundId}}</label>
           </td>
           <td>{{item.data.tdesc}}</td>
@@ -136,7 +137,7 @@
           <td class="flex justify-center items-center">
             <i class="ti ti-edit cursor-pointer i-gray fs-l px-1" (click)="modalStatus='edit';setData(item.data)"
               data-hs-overlay="#evaluation-cycle-page-modal"></i>
-            <i class="ti ti-user cursor-pointer i-gray fs-l px-1" data-hs-overlay="#evaluation-cycle-person-modal"></i>
+            <i class="ti ti-user cursor-pointer i-gray fs-l px-1" data-hs-overlay="#evaluation-cycle-person-modal" (click)="openModal('evaluation-cycle-person-modal',item.data.evaluationRoundId)"></i>
             <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="modalStatus='delete';setData(item.data)"
               data-hs-overlay="#evaluation-cycle-page-alert-modal"></i>
             <!-- <span class="badge text-white m-1" *ngIf="item.data.statusCode.code!='1'"
@@ -350,7 +351,7 @@
 </div>
 
 <div id="evaluation-cycle-person-modal" class="hs-overlay hidden ti-modal">
-  <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto">
+  <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out  m-3 lg:!mx-auto " style="min-width: 70%;">
     <div class="max-h-full overflow-hidden ti-modal-content w-full">
       <div class="ti-modal-header">
         <h3 class="text-xxl font-bold text-primary">
@@ -365,7 +366,7 @@
         </div>
       </div>
       <div class="ti-modal-body ">
-        <app-edit-evaluation-form></app-edit-evaluation-form>
+        <app-edit-evaluation-form *ngIf="evaluationRoundId" [evaluationRoundId]="evaluationRoundId" ></app-edit-evaluation-form>
       </div>
     </div>
   </div>

src/app/components/competency-assessment/evaluation-cycle-manager/evaluation-cycle/evaluation-cycle.component.ts

-import { ChangeDetectorRef, Component } from '@angular/core';
+import { ChangeDetectorRef, Component, EventEmitter, Output } from '@angular/core';
 import { ToastrService } from 'ngx-toastr';
 import { EvaluationCycleModel, MyEvaluationCycleModel } from 'src/app/shared/model/evaluation-cycle.model';
 import { EvaluationCycleService } from 'src/app/shared/services/evaluation-cycle.service';
 import { MyStatusCodeModel, StatusCodeModel } from 'src/app/shared/model/status-code.model';
+import { EvaluationAssessmentService } from 'src/app/shared/services/evaluation-assessment.service';
 
 export interface DataModel {
   evaluationRoundId: string;
@@ -20,6 +21,7 @@ export interface DataModel {
   styleUrls: ['./evaluation-cycle.component.scss']
 })
 export class EvaluationCycleComponent {
+  @Output() evaluationRoundIdChange = new EventEmitter<string>();
   apsPeriodStart: string = '';
   apsPeriodEnd: string = '';
 
@@ -35,10 +37,10 @@ export class EvaluationCycleComponent {
   isDataListChecked = false
   isDataListCheckedAll = false
   numDataListChecked = 0
-
+  evaluationRoundId = ''
   constructor(private evaluationCycleService: EvaluationCycleService,
     private toastr: ToastrService,
-    private cdr: ChangeDetectorRef
+    private cdr: ChangeDetectorRef,
   ) { }
 
   ngOnInit(): void {
@@ -171,6 +173,22 @@ export class EvaluationCycleComponent {
       this.setData(new MyEvaluationCycleModel({ evaluationRoundId: this.dataSelect.evaluationRoundId }))
     }
   }
+
+  openModal(id: string,evaluationRoundId:string) {
+    this.evaluationRoundId = ''
+    if(id == 'evaluation-cycle-person-modal'){
+      this.evaluationRoundId = evaluationRoundId
+      this.evaluationRoundIdChange.emit(evaluationRoundId)
+      setTimeout(() => {
+        document.getElementById(id)?.classList.add('open');
+      document.getElementById(id)?.classList.remove('hidden');
+        document.getElementById(id)?.setAttribute('aria-overlay', 'false');
+      }, 10);
+    }
+  }
+
+  
+
 }
 
 

src/styles.scss

@@ -363,4 +363,16 @@ ngx-dropzone {
 .detail-td{
   font-size: 12px;
    padding-left: 1.5rem;
+}
+.width-80{
+  width: 80%;
+}
+.\!width-80{
+  width: 80% !important;
+}
+.width-70{
+  width: 70%;
+}
+.\!width-70{
+  width: 70% !important;
 }
\ No newline at end of file