กำหนดผู้ประเมิน

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

@@ -4,9 +4,10 @@ import { EmployeeModel, MyEmployeeModel } from 'src/app/shared/model/employee.mo
 import { GroupApproveModel, MyGroupApproveModel } from 'src/app/shared/model/group-approve.model';
 import { EmployeeService } from 'src/app/shared/services/employee.service';
 import { FileService } from 'src/app/shared/services/file.service';
-import { PmsGroupApproveService } from 'src/app/shared/services/pms-group-approve.service';
+import { GroupApproveService } from 'src/app/shared/services/group-approve.service';
 interface table {
   currentPage: number,
+  pageSize: number,
   page: number[],
   search: string
 }
@@ -18,6 +19,7 @@ interface table {
 export class AssigningApproversComponent {
 
   currentPage = 1
+  pageSize = 10
   page = Array.from({ length: 1 }, (_, i) => i + 1);
   groupapprove_list: GroupApproveModel[] = []
   groupapprove_listLoading = false
@@ -29,6 +31,7 @@ export class AssigningApproversComponent {
   employee: EmployeeModel = new MyEmployeeModel({})
   employeeModal: table = {
     currentPage: 1,
+    pageSize: 10,
     page: Array.from({ length: 1 }, (_, i) => i + 1),
     search: ""
   }
@@ -39,7 +42,7 @@ export class AssigningApproversComponent {
 
   selectedFile: File | null = null;
   selectedFileName: string = 'กรุณาเลือกไฟล์';
-  constructor(private pmsGroupapproveService: PmsGroupApproveService,
+  constructor(private groupapproveService: GroupApproveService,
     private toastr: ToastrService,
     private cdr: ChangeDetectorRef,
     private employeeService: EmployeeService,
@@ -113,8 +116,8 @@ export class AssigningApproversComponent {
     })
   }
   employee_listFilter() {
-    return this.employee_list.filter(x => x.fname.toLowerCase().includes(this.search.toLowerCase()) ||
-      x.lname.toLowerCase().includes(this.search.toLowerCase()))
+    return this.employee_list.filter(x => x.fname.toLowerCase().includes(this.employeeModal.search.toLowerCase()) ||
+      x.lname.toLowerCase().includes(this.employeeModal.search.toLowerCase()))
   }
   searchEMP() {
     this.employeeModal.currentPage = 1
@@ -141,7 +144,7 @@ export class AssigningApproversComponent {
   }
   getGroupapprove_list() {
     this.groupapprove_listLoading = true
-    this.pmsGroupapproveService.getList().subscribe({
+    this.groupapproveService.getList().subscribe({
       next: response => {
         this.groupapprove_list = response.map(x => new MyGroupApproveModel(x))
         this.groupapprove_listLoading = false
@@ -187,7 +190,7 @@ export class AssigningApproversComponent {
   }
   addgroupapprove() {
     this.groupapprove_listLoading = true
-    this.pmsGroupapproveService.post(this.groupapprove).subscribe({
+    this.groupapproveService.post(this.groupapprove).subscribe({
       next: response => {
         if (response.success) {
           this.showAlert(response.message, 'success')
@@ -206,7 +209,7 @@ export class AssigningApproversComponent {
   }
   deletegroupapprove() {
     this.groupapprove_listLoading = true
-    this.pmsGroupapproveService.delete(this.groupapprove).subscribe({
+    this.groupapproveService.delete(this.groupapprove).subscribe({
       next: response => {
         if (response.success) {
           this.showAlert(response.message, 'success')

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

@@ -73,7 +73,7 @@
                     </tbody>
                     <tbody *ngIf="!pl.loading&&plListFilter().length">
                         <tr
-                            *ngFor="let item of plListFilter()| slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
+                            *ngFor="let item of plListFilter()| slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);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>
@@ -86,43 +86,8 @@
                 </table>
             </div>
         </div>
-        <nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
-            <ul class="ti-pagination">
-                <li>
-                    <a aria-label="anchor" class="page-link !pl-0" href="javascript:void(0);"
-                        (click)="currentPage = (currentPage-1 || 1)">
-                        <i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
-                    </a>
-                </li>
-                <li *ngFor="let item of page;let f = first;let l = last">
-                    <ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
-                        <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
-                        </a>
-                    </ng-container>
-                    <ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
-                        <a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
-                            (click)="currentPage=item">{{item}}
-                        </a>
-                    </ng-container>
-                    <ng-container
-                        *ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
-                        <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
-                        </a>
-                    </ng-container>
-                </li>
-                <li>
-                    <a aria-label="anchor" class="page-link" href="javascript:void(0);"
-                        (click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
-                        <i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
-                    </a>
-                </li>
-            </ul>
-            <ul class="nav-tabs mt-3">
-                <span>Show {{((currentPage-1) * 10)+1}} to {{plListFilter().length<10 ?plListFilter().length:
-                        (currentPage==page.length ? ((currentPage * 10) - ((currentPage * 10) - plListFilter().length) )
-                        :(currentPage * 10) ) }} of {{plListFilter().length}} items</span>
-            </ul>
-        </nav>
+        <app-pagination [totalItems]="plListFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event"
+            (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
     </div>
 
     <div id="evaluation-grouping-upload-modal" class="hs-overlay hidden ti-modal">

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

@@ -15,6 +15,7 @@ export class EvaluationGroupingComponent {
 
   currentPage = 1
   page = Array.from({ length: 1 }, (_, i) => i + 1);
+  pageSize = 10
   search = ""
   currentModal: 'add' | 'edit' | 'delete' | 'deleteGroup' = "add"