การประเมินจัดการประสิทธิภาพ>การจัดการประเมิน>จัดกลุ่มประเมิน

src/app/components/company-components/account-settings/user-settings/user-settings.component.ts

@@ -284,14 +284,11 @@ export class UserSettingsComponent {
 
   clearDataUser(currentModal: string) {
     if (currentModal == 'add') {
-      this.user.select.usernameId = ''
-      this.user.select.employee.employeeId = ''
-      this.user.select.role.roleId = ''
-      this.user.select.level.userLevel = ''
+      this.selectUser()
     } else if (currentModal == 'edit') {
-      this.user.select.employee.employeeId = ''
-      this.user.select.role.roleId = ''
-      this.user.select.level.userLevel = ''
+      this.selectEmployee()
+      this.selectRole()
+      this.selectLevel()
     }
   }
   showAlert(text: string, type: 'success' | 'error') {

src/app/components/performance-management-evaluation/assessment-management/evaluation-grouping/edit-evaluation-grouping/edit-evaluation-grouping.component.ts

 import { ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core';
 import { ToastrService } from 'ngx-toastr';
 import { MyPLModel, PLModel } from 'src/app/shared/model/pl.model';
+import { MyPmsGroupAssessmentModel } from 'src/app/shared/model/pms-group-assessment.model';
 import { MyPmsGroupAssessment1Model, PmsGroupAssessment1Model } from 'src/app/shared/model/pms-group-assessment1.model';
+import { MyPmstopicModel, PmstopicModel } from 'src/app/shared/model/pmstopic.model';
 import { PmsGroupAssessmentService } from 'src/app/shared/services/pms-group-assessment.service';
+import { PmstopicService } from 'src/app/shared/services/pmstopic.service';
+export interface DataModal {
+  search: string,
+  currentPage: number,
+  page: number[]
+}
 @Component({
   selector: 'app-edit-evaluation-grouping',
   templateUrl: './edit-evaluation-grouping.component.html',
@@ -14,19 +22,60 @@ export class EditEvaluationGroupingComponent {
   currentPage = 1
   page = Array.from({ length: 1 }, (_, i) => i + 1);
   search = ""
-  currentModal: 'add' | 'edit' | 'delete' | 'deleteGroup' = "add"
+  currentModal: 'save' | 'delete' | 'deleteGroup' = "save"
+  modal: DataModal = {
+    search: "",
+    currentPage: 1,
+    page: Array.from({ length: 1 }, (_, i) => i + 1)
+  }
 
   pmsGroupAssessment: { loading: boolean, select: PmsGroupAssessment1Model, dataList: { check: boolean, data: PmsGroupAssessment1Model }[] } = { loading: false, select: new MyPmsGroupAssessment1Model(), dataList: [] }
+  pmsGroupAssessmentIndex = -1
+  pmstopic: { loading: boolean, select: PmstopicModel, dataList: { check: boolean, data: PmstopicModel }[] } = { loading: false, select: new MyPmstopicModel(), dataList: [] }
 
   numDataListChecked = 0
   isDataListChecked = false
   isDataListCheckedAll = false
   constructor(private toastr: ToastrService,
     private pmsGroupAssessmentService: PmsGroupAssessmentService,
-    private cdr: ChangeDetectorRef
+    private cdr: ChangeDetectorRef,
+    private pmstopicService: PmstopicService
   ) { }
   ngOnInit(): void {
     this.getPmsGroupAssessmentBy_plId()
+    this.getPmstopicList()
+  }
+  getPmstopicList() {
+    this.pmstopic.loading = true
+    this.pmstopicService.getList().subscribe({
+      next: response => {
+        this.pmstopic.dataList = response.map(x => ({ check: false, data: new MyPmstopicModel(x) }))
+        this.isDataListCheckedAll = false
+        this.dataListCheckAll()
+        this.pmstopic.loading = false
+        this.cdr.detectChanges()
+      }, error: error => {
+        this.pmstopic.loading = false
+        this.cdr.detectChanges()
+      }
+    })
+  }
+  pmstopicListFilter() {
+    return this.pmstopic.dataList.filter(x => {
+      const data = x.data
+      if (this.pmsGroupAssessment.dataList.some(y => y.data.pmsTopic.pmsTopicId == data.pmsTopicId)) {
+        return
+      }
+      const match = data.pmsTopicId.toLowerCase().includes(this.modal.search.toLowerCase()) ||
+        data.tdesc.toLowerCase().includes(this.modal.search.toLowerCase())
+      return match
+    })
+  }
+  selectPmstopic(data?: PmstopicModel) {
+    this.pmsGroupAssessment.dataList.push({ check: false, data: new MyPmsGroupAssessment1Model({ pmsTopic: new MyPmstopicModel(data) }) })
+    this.isDataListCheckedAll = false
+    this.dataListCheckAll()
+    this.cdr.markForCheck()
   }
 
   getPmsGroupAssessmentBy_plId() {
@@ -56,6 +105,11 @@ export class EditEvaluationGroupingComponent {
     this.pmsGroupAssessment.select = new MyPmsGroupAssessment1Model(data)
   }
 
+  searchModalChange(dataList: any[]) {
+    this.modal.currentPage = 1
+    this.modal.page = Array.from({ length: Math.ceil(dataList.length / 10) }, (_, i) => i + 1);
+    this.cdr.markForCheck()
+  }
   searchChange() {
     this.currentPage = 1
     this.page = Array.from({ length: Math.ceil(this.pmsGroupAssessmentListFilter().length / 10) }, (_, i) => i + 1)
@@ -74,6 +128,49 @@ export class EditEvaluationGroupingComponent {
     this.isDataListChecked = Boolean(this.numDataListChecked)
   }
 
+  savePmsGroupAssessment() {
+    const body = {
+      personalLevel: new MyPLModel(this.pl),
+      companyId: "",
+      pmsGroupAssessment1List: this.pmsGroupAssessment.dataList.map(x => new MyPmsGroupAssessment1Model(x.data))
+    }
+    this.pmsGroupAssessmentService.post(body).subscribe({
+      next: response => {
+        if (response.success) {
+          this.showAlert(response.message, 'success')
+        } else {
+          this.showAlert(response.message, 'error')
+        }
+        this.cdr.detectChanges()
+      }, error: error => {
+        this.showAlert(error.message, 'error')
+        this.cdr.detectChanges()
+      }
+    })
+  }
+  deletePmsGroupAssessment() {
+    switch (this.currentModal) {
+      case ('delete'): {
+        this.pmsGroupAssessment.dataList = this.pmsGroupAssessment.dataList.filter((_, i) => i != this.pmsGroupAssessmentIndex)
+        break;
+      }
+      case ('deleteGroup'): {
+        this.pmsGroupAssessment.dataList = this.pmsGroupAssessment.dataList.filter((x) => !x.check)
+        break;
+      }
+    }
+    this.isDataListCheckedAll = false
+    this.dataListCheckAll()
+    this.cdr.markForCheck()
+  }
+
+  showAlert(text: string, type: 'success' | 'error') {
+    this.toastr[type](text, 'แจ้งเตือน', {
+      timeOut: 3000,
+      positionClass: 'toast-top-right',
+    })
+  }
+
   onBack() {
     this.sendOnEdit.emit(false);
   }

src/app/components/performance-management-evaluation/assessment-management/evaluation-grouping/evaluation-grouping.component.html

@@ -54,8 +54,26 @@
                             </ng-container>
                         </tr>
                     </thead>
-                    <tbody>
-                        <tr *ngFor="let item of pl.dataList;let i = index">
+                    <tbody *ngIf="pl.loading">
+                        <tr>
+                            <td class="text-center" colspan="100%">
+                                <div *ngFor="let item of [1,2,3]" class="ti-spinner w-8 h-8 text-secondary mx-1"
+                                    role="status" aria-label="loading">
+                                    <span class="sr-only">Loading...</span>
+                                </div>
+                            </td>
+                        </tr>
+                    </tbody>
+                    <tbody *ngIf="!pl.loading&&!plListFilter().length">
+                        <tr>
+                            <td class="text-center" colspan="100%">
+                                ไม่พบข้อมูล
+                            </td>
+                        </tr>
+                    </tbody>
+                    <tbody *ngIf="!pl.loading&&plListFilter().length">
+                        <tr
+                            *ngFor="let item of plListFilter()| slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
                             <td style="font-size: 12px; padding-left: 4rem;">{{item.data.plId}}</td>
                             <td style="font-size: 12px; padding-left: 1.5rem; width: 600px;">{{item.data.tdesc}}
                             </td>

src/app/components/performance-management-evaluation/assessment-management/evaluation-grouping/evaluation-grouping.component.ts

@@ -99,7 +99,7 @@ export class EvaluationGroupingComponent {
   plListFilter() {
     return this.pl.dataList.filter(x => {
       const data = x.data
-      const match = data.plId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase()) || data.edesc.toLowerCase().includes(this.search.toLowerCase());
+      const match = data.plId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase())
       return match;
     });
   }

src/app/components/performance-management-evaluation/name-registration-perfomance/assessment-topics/assessment-topics.component.html

@@ -68,7 +68,7 @@
       <thead>
         <tr>
           <ng-container
-            *ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','การจัดการ']; let f = first; let l = last; let i = index">
+            *ngFor="let item of ['รหัส','ชื่อประเภท','ชื่อย่อ','Action']; let f = first; let l = last; let i = index">
             <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 class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
@@ -175,7 +175,8 @@
       <div class="w-full flex justify-end">
         <div class="absolute flex">
           <div class="px-1">
-            <button type="button" class="ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md" (click)="clearPmstopic(modalStatus)">
+            <button type="button" class="ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md"
+              (click)="clearPmstopic(modalStatus)">
               <svg class="svg-indigo" width="16" height="16" viewBox="0 0 64.00 64.00"
                 xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#595BEA" stroke-width="3.84"
                 transform="rotate(45)matrix(-1, 0, 0, 1, 0, 0)">

src/assets/css/style.css

@@ -24729,6 +24729,9 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 .bg-input-readonly {
   background-color: rgb(241 245 249 / var(--tw-bg-opacity));
 }
+.\!bg-input-readonly {
+  background-color: rgb(241 245 249) !important;
+}
 
 .ml-8 {
   margin-left: 2rem;
@@ -24907,10 +24910,9 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
   margin-top: -0.75rem !important;
 }
 
-
 .\!rounded-t-none {
-  border-top-left-radius: 0rem  !important;
-  border-top-right-radius: 0rem  !important;
+  border-top-left-radius: 0rem !important;
+  border-top-right-radius: 0rem !important;
 }
 .rounded-t-none {
   border-top-left-radius: 0rem;
@@ -24919,4 +24921,4 @@ div:where(.swal2-container) div:where(.swal2-validation-message) {
 
 .masked-input {
   -webkit-text-security: disc; /* Safari, Chrome */
-}
\ No newline at end of file
+}