Skip to content

M
mySkill-x
Commit 23a71772 by Nakarin Luankla
Options

UPDATE เปี่ลยน dialog

parent 52f56c3d
Showing with 398 additions and 505 deletions
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.html
......@@ -20,16 +20,14 @@
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
data-hs-overlay="#sub-employee-registration-modal" (click)="currentModal='add';selectEmployee()">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" (click)="currentModal='add';selectEmployee();openDialog()">
<i class="ri-add-line"></i>
Add
</button>
</div>
<div class="px-1">
<button class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
data-hs-overlay="#sub-employee-registration-alert-delete-modal"
(click)="currentModal='delete';selectEmployee()">
(click)="currentModal='delete';selectEmployee();updateEmployeeList('delete')">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
......@@ -39,51 +37,26 @@
<div class="page px-rem">
<app-datagrid-syncfution [searchSettings]="searchSettings" [searchText]="search" [dataSource]="employee.dataList"
[columns]="columns" [selectedItems]="selectedItems" modalName="#sub-employee-registration-modal"
(sendSelectData)="currentModal='update';selectEmployee($event)" (sendSelectedItems)="onSelectItemChange($event)">
[columns]="columns" [selectedItems]="selectedItems"
(sendSelectData)="currentModal='update';selectEmployee($event);openDialog()" (sendSelectedItems)="onSelectItemChange($event)">
</app-datagrid-syncfution>
</div>
<div id="sub-employee-registration-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] !max-w-1/2">
<div class="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
ข้อมูลพนักงาน
<ng-template #employeeRegistrationModal let-modal>
<h3 mat-dialog-title>
{{currentModal=='add'?'เพิ่มข้อมูลพนักงาน':'แก้ไขข้อมูลพนักงาน'}}
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="w-full flex justify-end">
<div class="w-full flex justify-end mb-1rem">
<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)="selectEmployee()">
<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)">
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M15 49A24 24 0 0 1 32 8"></path>
<path d="M49 15a24 24 0 0 1-17 41"></path>
<polyline points="15.03 40 15.03 48.97 8 48.97"></polyline>
<polyline points="48.97 24 48.97 15.03 56 15.03"></polyline>
</g>
</svg>
<i class="ti ti-eraser text-base"></i>
Clear
</button>
</div>
</div>
</div>
<div class="ti-modal-body mt-5">
<mat-dialog-content>
<div class="space-y-3">
<div class="grid grid-cols-12 gap-x-6">
<label class="col-span-3 ti-form-label text-primary mt-2 align-center">รหัสพนักงาน<span
......@@ -131,8 +104,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-empgroup-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(empGroupListFilter())">
(click)="pageSize=10;search='';searchModalChange(empGroupListFilter());openEmpGroupDialog()">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
</div>
......@@ -184,7 +156,7 @@
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-emp-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(employeeModalListFilter())">
(click)="pageSize=10;search='';searchModalChange(employeeModalListFilter());openEmployeeListDialog()">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
</div>
......@@ -206,8 +178,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu1-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu1ListFilter())">
(click)="pageSize=10;search='';searchModalChange(bu1ListFilter());openBu1Dialog()">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
</div>
......@@ -231,8 +202,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu2-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu2ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu2ListFilter());openBu2Dialog()"
*ngIf="employee.select.bu1.bu1id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -257,8 +227,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu3-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu3ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu3ListFilter());openBu3Dialog()"
*ngIf="employee.select.bu2.bu2id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -283,8 +252,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu4-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu4ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu4ListFilter());openBu4Dialog()"
*ngIf="employee.select.bu3.bu3id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -309,8 +277,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu5-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu5ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu5ListFilter());openBu5Dialog()"
*ngIf="employee.select.bu4.bu4id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -334,8 +301,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu6-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu6ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu6ListFilter());openBu6Dialog()"
*ngIf="employee.select.bu5.bu5id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -359,8 +325,7 @@
<i class="ti ti-circle-x cursor-pointer"></i>
</button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-bu7-table-modal"
(click)="modal.pageSize=10;modal.search='';searchModalChange(bu7ListFilter())"
(click)="pageSize=10;search='';searchModalChange(bu7ListFilter());openBu7Dialog()"
*ngIf="employee.select.bu6.bu6id">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
......@@ -494,23 +459,21 @@
<input type="text" class="sm:col-span-6 ti-form-input" [(ngModel)]="employee.select.email">
</div>
</div>
<div class="flex justify-center my-3">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
<button type="button" class="ti-btn ti-btn-success"
data-hs-overlay="#sub-employee-registration-alert-add-modal"
<button type="button" class="ti-btn ti-btn-success" mat-button (click)="updateEmployeeList(currentModal)"
[class.ti-btn-disabled]="checkEmployeeModel()||(currentModal=='add'&&checkPrimary())"
[disabled]="checkEmployeeModel()||(currentModal=='add'&&checkPrimary())">
บันทึกข้อมูล
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-modal-upload" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out rounded-md">
......@@ -548,105 +511,17 @@
</div>
</div>
<div id="sub-employee-registration-alert-add-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
<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">
แจ้งเตือน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-alert-add-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body ">
<p class="mt-1 text-gray-800 dark:text-white/70">
ยืนยันการบันทึกข้อมูลหรือไม่
</p>
<div class="flex justify-end mt-2rem mb-1rem">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);"
data-hs-overlay="#sub-employee-registration-alert-add-modal" (click)="updateEmployeeList(currentModal)">
บันทึกข้อมูล
</a>
</div>
</div>
</div>
</div>
</div>
<div id="sub-employee-registration-alert-delete-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
<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">
แจ้งเตือน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-alert-delete-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body ">
<p class="mt-1 text-gray-800 dark:text-white/70">
<ng-container *ngIf="numSelectItem()y">
ยืนยันการลบข้อมูลหรือไม่
</ng-container>
<ng-container *ngIf="!numSelectItem()y">
เลือกข้อมูลที่ต้องการลบ
</ng-container>!
</p>
<div class="flex justify-end mt-2rem mb-1rem">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-alert-delete-modal">
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);"
data-hs-overlay="#sub-employee-registration-alert-delete-modal" (click)="updateEmployeeList(currentModal)"
*ngIf="numSelectItem()y">
ลบข้อมูล
</a>
</div>
</div>
</div>
</div>
</div>
<div id="sub-employee-registration-empgroup-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #empGroupModal let-modal>
<h3 mat-dialog-title>
ข้อมูลกลุ่มพนักงาน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(empGroupListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -690,11 +565,10 @@
</tbody>
<tbody *ngIf="!empGroup.loading&&empGroupListFilter().length">
<tr
*ngFor="let item of empGroupListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectDataModal(this.employee.select,'empGroup',item)"
data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of empGroupListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectDataModal(this.employee.select,'empGroup',item);closeEmpGroupDialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.groupId}}</td>
<td>{{item.tdesc}}</td>
......@@ -703,42 +577,110 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="empGroupListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="empGroupListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</mat-dialog-actions>
</ng-template>
<ng-template #employeeListModal let-modal>
<h3 mat-dialog-title>
ข้อมูลพนักงาน
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" id="hs-leading-icon" name="hs-leading-icon"
class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 " placeholder="Search by No. or Name"
[(ngModel)]="search" (ngModelChange)="searchModalChange(employeeModalListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
<i class="ri-search-line text-gray"></i>
</div>
</div>
</div>
</div>
</div>
<div class="page px-rem">
<div class="overflow-auto table-bordered rounded-t-md">
<div class="overflow-auto shadow-md rounded-t-md">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['รหัสพนักงาน','ชื่อ','นามสกุล','ตำแหน่ง']; let f = first; let l = last; let i = index">
<th scope="col" class=" 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">
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="employee.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="!employee.loading&&!employeeModalListFilter().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="!employee.loading&&employeeModalListFilter().length">
<tr
*ngFor="let item of employeeModalListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBoss(item);closeEmployeeListDialog()">
<td class="text-center">
{{item.employeeId}}
</td>
<td>{{item.fname}}</td>
<td>{{item.lname}}</td>
<td>{{item.position.tdesc}}</td>
<div id="sub-employee-registration-bu1-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
ข้อมูลทะเบียนฝ่าย
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</tr>
</tbody>
</table>
</div>
</div>
<div class="ti-modal-body">
<app-pagination [totalItems]="employeeModalListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</mat-dialog-actions>
</ng-template>
<ng-template #bu1Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลทะเบียนฝ่าย
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu1ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -782,10 +724,10 @@
</tbody>
<tbody *ngIf="!bu1.loading&&bu1ListFilter().length">
<tr
*ngFor="let item of bu1ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu1(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu1ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu1(item);closeBu1Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu1id}}</td>
<td>{{item.tdesc}}</td>
......@@ -794,42 +736,28 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu1ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu1ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu2-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu2Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลทะเบียนแผนก
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu2ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -873,10 +801,10 @@
</tbody>
<tbody *ngIf="!bu2.loading&&bu2ListFilter().length">
<tr
*ngFor="let item of bu2ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu2(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu2ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu2(item);closeBu2Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu2id}}</td>
<td>{{item.tdesc}}</td>
......@@ -885,42 +813,28 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu2ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu2ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu3-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu3Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลทะเบียนส่วน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu3ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -964,10 +878,10 @@
</tbody>
<tbody *ngIf="!bu3.loading&&bu3ListFilter().length">
<tr
*ngFor="let item of bu3ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu3(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu3ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu3(item);closeBu3Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu3id}}</td>
<td>{{item.tdesc}}</td>
......@@ -976,42 +890,28 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu3ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu3ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu4-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu4Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลส่วนย่อย1
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu4ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -1055,10 +955,10 @@
</tbody>
<tbody *ngIf="!bu4.loading&&bu4ListFilter().length">
<tr
*ngFor="let item of bu4ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu4(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu4ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu4(item);closeBu4Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu4id}}</td>
<td>{{item.tdesc}}</td>
......@@ -1067,42 +967,29 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu4ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu4ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu5-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu5Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลส่วนย่อย2
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu5ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -1146,10 +1033,10 @@
</tbody>
<tbody *ngIf="!bu5.loading&&bu5ListFilter().length">
<tr
*ngFor="let item of bu5ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu5(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu5ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu5(item);openBu5Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu5id}}</td>
<td>{{item.tdesc}}</td>
......@@ -1158,42 +1045,28 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu5ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu5ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu6-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu6Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลส่วนย่อย3
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu6ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -1237,10 +1110,10 @@
</tbody>
<tbody *ngIf="!bu6.loading&&bu6ListFilter().length">
<tr
*ngFor="let item of bu6ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu6(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu6ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu6(item);openBu6Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu6id}}</td>
<td>{{item.tdesc}}</td>
......@@ -1249,42 +1122,28 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu6ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu6ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-bu7-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
<ng-template #bu7Modal let-modal>
<h3 mat-dialog-title>
ข้อมูลส่วนย่อย4
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
</h3>
<mat-dialog-content>
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 "
placeholder="Search by No. or Name" [(ngModel)]="modal.search"
placeholder="Search by No. or Name" [(ngModel)]="search"
(ngModelChange)="searchModalChange(bu7ListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
......@@ -1328,10 +1187,10 @@
</tbody>
<tbody *ngIf="!bu7.loading&&bu7ListFilter().length">
<tr
*ngFor="let item of bu7ListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu7(item)" data-hs-overlay="#sub-employee-registration-modal">
*ngFor="let item of bu7ListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index"
class="cursor-pointer" (click)="selectBu7(item);openBu7Dialog()">
<td class="flex justify-center">
{{((modal.currentPage-1) * modal.pageSize)+(i+1)}}
{{((currentPage-1) * pageSize)+(i+1)}}
</td>
<td>{{item.bu7id}}</td>
<td>{{item.tdesc}}</td>
......@@ -1340,20 +1199,22 @@
</tbody>
</table>
</div>
<app-pagination [totalItems]="bu7ListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
<app-pagination [totalItems]="bu7ListFilter().length" [pageSize]="pageSize"
(pageChange)="currentPage = $event"
(pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" mat-button [mat-dialog-close]
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</ng-template>
<div id="sub-employee-registration-position-table-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">
......@@ -1724,101 +1585,6 @@
</div>
<div id="sub-employee-registration-emp-table-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="max-h-full overflow-hidden ti-modal-content">
<div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary">
ข้อมูลพนักงาน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-employee-registration-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
</div>
</div>
<div class="ti-modal-body">
<div class="flex justify-end pb-1rem">
<div class="px-1">
<div class="relative shadow-md">
<input type="text" id="hs-leading-icon" name="hs-leading-icon"
class="ti-form-input ltr:pl-11 rtl:pr-11 focus:z-10 " placeholder="Search by No. or Name"
[(ngModel)]="modal.search" (ngModelChange)="searchModalChange(employeeModalListFilter())">
<div
class="absolute inset-y-0 ltr:left-0 rtl:right-0 flex items-center pointer-events-none z-20 ltr:pl-4 rtl:pr-4">
<i class="ri-search-line text-gray"></i>
</div>
</div>
</div>
</div>
<div class="page px-rem">
<div class="overflow-auto table-bordered rounded-t-md">
<div class="overflow-auto shadow-md rounded-t-md">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['รหัสพนักงาน','ชื่อ','นามสกุล','ตำแหน่ง']; let f = first; let l = last; let i = index">
<th scope="col" class=" 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">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="employee.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="!employee.loading&&!employeeModalListFilter().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="!employee.loading&&employeeModalListFilter().length">
<tr
*ngFor="let item of employeeModalListFilter() | slice:((modal.currentPage-1) * modal.pageSize) : (((modal.currentPage-1) * modal.pageSize) + modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBoss(item)"
data-hs-overlay="#sub-employee-registration-modal">
<td class="text-center">
{{item.employeeId}}
</td>
<td>{{item.fname}}</td>
<td>{{item.lname}}</td>
<td>{{item.position.tdesc}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<app-pagination [totalItems]="employeeModalListFilter().length" [pageSize]="modal.pageSize"
(pageChange)="modal.currentPage = $event"
(pageSizeChange)="modal.pageSize = $event;modal.currentPage = 1"></app-pagination>
</div>
<div class="flex justify-end mt-2rem mb-1rem space-x-4">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
data-hs-overlay="#sub-employee-registration-modal">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="sub-employee-registration-pl-table-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">
......
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.ts
import { ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core';
import { ChangeDetectorRef, Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
import { ToastrService } from 'ngx-toastr';
import { BranchModel, MyBranchModel } from 'src/app/shared/model/branch.model';
import { Bu1Model, MyBu1Model } from 'src/app/shared/model/bu1.model';
......@@ -33,6 +33,8 @@ import { EmpStatusService } from 'src/app/shared/services/emp-status.service';
import { StatusModel, MyStatusModel } from 'src/app/shared/model/status.model';
import { MyBossModel } from 'src/app/shared/model/boss.model';
import { ColumnModel } from '@syncfusion/ej2-grids';
import { MatDialog } from '@angular/material/dialog';
import Swal from 'sweetalert2';
export interface DataModal {
search: string,
currentPage: number,
......@@ -83,6 +85,9 @@ export class SubEmployeeRegistrationComponent {
page: Array.from({ length: 1 }, (_, i) => i + 1),
pageSize: 10
}
pageSize: number = 10
page: number = 1
currentPage: number = 1
selectedFile: File | null = null;
selectedFileName: string = 'กรุณาเลือกไฟล์';
......@@ -102,6 +107,29 @@ export class SubEmployeeRegistrationComponent {
empType: { loading: boolean, dataList: EmpTypeModel[] } = { loading: false, dataList: [] }
pl: { loading: boolean, dataList: PLModel[] } = { loading: false, dataList: [] }
empStatus: { loading: boolean, dataList: StatusModel[] } = { loading: false, dataList: [] }
@ViewChild('employeeRegistrationModal') employeeRegistrationModal: any
dialogRef: any
@ViewChild('empGroupModal') empGroupModal: any
empGroupDialogRef: any
@ViewChild('employeeListModal') employeeListModal: any
employeeListDialogRef: any
@ViewChild('bu1Modal') bu1Modal: any
bu1DialogRef: any
@ViewChild('bu2Modal') bu2Modal: any
bu2DialogRef: any
@ViewChild('bu3Modal') bu3Modal: any
bu3DialogRef: any
@ViewChild('bu4Modal') bu4Modal: any
bu4DialogRef: any
@ViewChild('bu5Modal') bu5Modal: any
bu5DialogRef: any
@ViewChild('bu6Modal') bu6Modal: any
bu6DialogRef: any
@ViewChild('bu7Modal') bu7Modal: any
bu7DialogRef: any
constructor(private toastr: ToastrService,
private employeeService: EmployeeService,
private cdr: ChangeDetectorRef,
......@@ -119,7 +147,9 @@ export class SubEmployeeRegistrationComponent {
private empTypeService: EmpTypeService,
private empStatusService: EmpStatusService,
private fileService: FileService,
private pLService: PLService) { }
private pLService: PLService,
private dialog: MatDialog
) { }
ngOnInit(): void {
this.getEmployeeList()
......@@ -132,6 +162,87 @@ export class SubEmployeeRegistrationComponent {
this.getPlList()
this.getEmpStatusList()
}
openDialog() {
this.dialogRef = this.dialog.open(this.employeeRegistrationModal, {
width: '800px',
})
}
closeDialog() {
this.dialogRef.close()
}
openEmpGroupDialog() {
this.empGroupDialogRef = this.dialog.open(this.empGroupModal, {
width: '800px',
})
}
closeEmpGroupDialog() {
this.empGroupDialogRef.close()
}
openEmployeeListDialog() {
this.employeeListDialogRef = this.dialog.open(this.employeeListModal, {
width: '800px',
})
}
closeEmployeeListDialog() {
this.employeeListDialogRef.close()
}
openBu1Dialog() {
this.bu1DialogRef = this.dialog.open(this.bu1Modal, {
width: '800px',
})
}
closeBu1Dialog() {
this.bu1DialogRef.close()
}
openBu2Dialog() {
this.bu2DialogRef = this.dialog.open(this.bu2Modal, {
width: '800px',
})
}
closeBu2Dialog() {
this.bu2DialogRef.close()
}
openBu3Dialog() {
this.bu3DialogRef = this.dialog.open(this.bu3Modal, {
width: '800px',
})
}
closeBu3Dialog() {
this.bu3DialogRef.close()
}
openBu4Dialog() {
this.bu4DialogRef = this.dialog.open(this.bu4Modal, {
width: '800px',
})
}
closeBu4Dialog() {
this.bu4DialogRef.close()
}
openBu5Dialog() {
this.bu5DialogRef = this.dialog.open(this.bu5Modal, {
width: '800px',
})
}
closeBu5Dialog() {
this.bu5DialogRef.close()
}
openBu6Dialog() {
this.bu6DialogRef = this.dialog.open(this.bu6Modal, {
width: '800px',
})
}
closeBu6Dialog() {
this.bu6DialogRef.close()
}
openBu7Dialog() {
this.bu7DialogRef = this.dialog.open(this.bu7Modal, {
width: '800px',
})
}
closeBu7Dialog() {
this.bu7DialogRef.close()
}
onFileSelected(event: any) {
this.selectedFile = event.target.files.length > 0 ? event.target.files[0] : null;
this.selectedFileName = this.selectedFile?.name || "กรุณาเลือกไฟล์"
......@@ -301,9 +412,9 @@ export class SubEmployeeRegistrationComponent {
})
}
bu1ListFilter() {
return this.bu1.dataList.filter(x => x.bu1id.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.modal.search.toLowerCase()))
return this.bu1.dataList.filter(x => x.bu1id.toLowerCase().includes(this.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.search.toLowerCase()))
}
selectBu1(data?: Bu1Model) {
this.employee.select.bu1 = new MyBu1Model(data)
......@@ -334,9 +445,9 @@ export class SubEmployeeRegistrationComponent {
})
}
bu2ListFilter() {
return this.bu2.dataList.filter(x => x.bu2id.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.modal.search.toLowerCase()))
return this.bu2.dataList.filter(x => x.bu2id.toLowerCase().includes(this.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.search.toLowerCase()))
}
selectBu2(data?: Bu2Model) {
this.employee.select.bu2 = new MyBu2Model(data)
......@@ -506,9 +617,9 @@ export class SubEmployeeRegistrationComponent {
})
}
empGroupListFilter() {
return this.empGroup.dataList.filter(x => x.groupId.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.modal.search.toLowerCase()))
return this.empGroup.dataList.filter(x => x.groupId.toLowerCase().includes(this.search.toLowerCase()) ||
x.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
x.edesc.toLowerCase().includes(this.search.toLowerCase()))
}
......@@ -533,23 +644,32 @@ export class SubEmployeeRegistrationComponent {
})
}
employeeModalListFilter() {
return this.employeeModal.dataList.filter(x => x.employeeId.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.fname.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.lname.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.position.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()))
return this.employeeModal.dataList.filter(x => x.employeeId.toLowerCase().includes(this.search.toLowerCase()) ||
x.fname.toLowerCase().includes(this.search.toLowerCase()) ||
x.lname.toLowerCase().includes(this.search.toLowerCase()) ||
x.position.tdesc.toLowerCase().includes(this.search.toLowerCase()))
}
updateEmployeeList(type: 'add' | 'update' | 'delete') {
this.employee.loading = true
let body: any = this.employee.select
switch (type) {
case 'delete': {
if (type == 'delete') {
if (this.numSelectItem() == 0) {
this.showAlert('กรุณาเลือกข้อมูลที่จะลบ', 'error')
return
}
const selectedKeys = Array.from(this.selectedItems.data.keys());
body = this.employee.dataList.filter(x => selectedKeys.includes(x.employeeId) && this.selectedItems.data.get(x.employeeId)).map(x => new MyEmployeeModel(x))
break;
}
}
Swal.fire({
icon: 'question',
title: 'แจ้งเตือน',
text: type == 'delete' ? 'ยืนยันการลบข้อมูลหรือไม่' : 'ยืนยันการบันทึกข้อมูลหรือไม่',
showCancelButton: true,
confirmButtonText: type == 'delete' ? 'ลบข้อมูล' : 'บันทึกข้อมูล',
}).then((result) => {
if (result.isConfirmed) {
this.employeeService[type](body).subscribe({
next: response => {
if (response.success) {
......@@ -568,6 +688,9 @@ export class SubEmployeeRegistrationComponent {
}
})
}
})
}
selectEmployee(data?: EmployeeModel) {
if (this.currentModal == 'update' && !data) {
this.employee.select = { ...new MyEmployeeModel({ employeeId: this.employee.select.employeeId }), dateIso: '', dateEndIso: '2100-12-31' }
......@@ -631,17 +754,21 @@ export class SubEmployeeRegistrationComponent {
}
searchModalChange(dataList: any[]) {
this.modal.currentPage = 1
this.modal.page = Array.from({ length: Math.ceil(dataList.length / 10) }, (_, i) => i + 1);
this.currentPage = 1
this.page = Math.ceil(dataList.length / this.pageSize);
}
selectDataModal(target: { [key: string]: any }, field: string, data: any) {
target[field] = JSON.parse(JSON.stringify(data))
}
showAlert(text: string, type: 'success' | 'error') {
this.toastr[type](text, 'แจ้งเตือน', {
timeOut: 3000,
positionClass: 'toast-top-right',
Swal.fire({
icon: type,
title: 'แจ้งเตือน',
text: text,
showCancelButton: false,
confirmButtonText: 'ยืนยัน',
})
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment