Skip to content

M
myAppraisal
Commit c1d1b86c by Nattana Chaiyamat
Options

ทะเบียนพนักงาน

parent 0ec94dcc
Showing with 178 additions and 0 deletions
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.html
...@@ -274,6 +274,30 @@ ...@@ -274,6 +274,30 @@
</div> </div>
</div> </div>
<div class="grid grid-cols-12 gap-x-6"> <div class="grid grid-cols-12 gap-x-6">
<label class="col-span-3 ti-form-label text-primary mt-2">หัวหน้างาน<span
class="text-danger">*</span></label>
<div class="col-span-6 sm:col-span-6 ">
<div class="flex">
<div class="relative flex rounded-md">
<input type="text" class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10"
readonly style="padding-right: 3.5rem;"
[value]="employee.select.boss.fname+' '+employee.select.boss.lname">
<div
class="absolute inset-y-0 ltr:right-0 rtl:left-0 flex items-center z-20 ltr:pr-4 rtl:pl-4 space-x-2">
<button type="button" class="flex items-center text-red-500"
(click)="employee.select.boss.employee='';employee.select.boss.fname='';employee.select.boss.lname=''">
<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-emp-table-modal" (click)="modal.search=''">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-12 gap-x-6">
<label class="col-span-3 ti-form-label text-primary mt-2">ทะเบียนฝ่าย<span <label class="col-span-3 ti-form-label text-primary mt-2">ทะเบียนฝ่าย<span
class="text-danger">*</span></label> class="text-danger">*</span></label>
<div class="col-span-6 sm:col-span-6 "> <div class="col-span-6 sm:col-span-6 ">
...@@ -2199,6 +2223,140 @@ ...@@ -2199,6 +2223,140 @@
</div> </div>
</div> </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) * 10) : (((modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectDataModal(this.employee.select,'boss',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>
<td>{{item.jobCode.bu1.tdesc}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<nav class="pagination-style-3 my-5" *ngIf="modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="modal.currentPage = (modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of modal.page;let f = first;let l = last">
<ng-container *ngIf="item==3&&modal.currentPage!=1&&modal.currentPage!=2&&modal.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==modal.currentPage-1||item==modal.currentPage||item==modal.currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==modal.currentPage"
(click)="modal.currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==modal.page.length-2&&modal.currentPage!=modal.page.length&&modal.currentPage!=modal.page.length-1&&modal.currentPage!=modal.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)="modal.currentPage = (modal.currentPage > modal.page.length-1 ? modal.currentPage: modal.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 {{((modal.currentPage-1) * 10)+1}} to {{employeeModalListFilter().length<10
?employeeModalListFilter().length: (modal.currentPage==modal.page.length ? ((modal.currentPage * 10) -
((modal.currentPage * 10) - employeeModalListFilter().length) ) :(modal.currentPage * 10) ) }} of
{{employeeModalListFilter().length}} items</span>
</ul>
</nav>
</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 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"> <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="max-h-full overflow-hidden ti-modal-content">
......
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.ts
...@@ -70,6 +70,7 @@ export class SubEmployeeRegistrationComponent { ...@@ -70,6 +70,7 @@ export class SubEmployeeRegistrationComponent {
selectedFileName: string = 'กรุณาเลือกไฟล์'; selectedFileName: string = 'กรุณาเลือกไฟล์';
empGroup: { loading: boolean, dataList: EmpGroupModel[] } = { loading: false, dataList: [] } empGroup: { loading: boolean, dataList: EmpGroupModel[] } = { loading: false, dataList: [] }
employeeModal: { loading: boolean, dataList: EmployeeModel[] } = { loading: false, dataList: [] }
bu1: { loading: boolean, dataList: Bu1Model[] } = { loading: false, dataList: [] } bu1: { loading: boolean, dataList: Bu1Model[] } = { loading: false, dataList: [] }
bu2: { loading: boolean, dataList: Bu2Model[] } = { loading: false, dataList: [] } bu2: { loading: boolean, dataList: Bu2Model[] } = { loading: false, dataList: [] }
bu3: { loading: boolean, dataList: Bu3Model[] } = { loading: false, dataList: [] } bu3: { loading: boolean, dataList: Bu3Model[] } = { loading: false, dataList: [] }
...@@ -429,6 +430,7 @@ export class SubEmployeeRegistrationComponent { ...@@ -429,6 +430,7 @@ export class SubEmployeeRegistrationComponent {
this.employeeService.getList().subscribe({ this.employeeService.getList().subscribe({
next: response => { next: response => {
this.employee.dataList = response.map((x: any) => ({ check: false, data: new MyEmployeeModel(x) })) this.employee.dataList = response.map((x: any) => ({ check: false, data: new MyEmployeeModel(x) }))
this.employeeModal.dataList = response.map((x: any) => new MyEmployeeModel(x)).filter(x => x.employeeId != this.decodeJWT(sessionStorage.getItem("accessToken") || '').employeeid)
this.employee.loading = false this.employee.loading = false
this.isDataListCheckedAll = false this.isDataListCheckedAll = false
this.dataListCheckAll() this.dataListCheckAll()
...@@ -440,6 +442,15 @@ export class SubEmployeeRegistrationComponent { ...@@ -440,6 +442,15 @@ export class SubEmployeeRegistrationComponent {
} }
}) })
} }
employeeModalListFilter() {
return this.employeeModal.dataList.filter(x => x.employeeId.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.fname.toLowerCase().includes(this.search.toLowerCase()) ||
x.lname.toLowerCase().includes(this.search.toLowerCase()) ||
x.position.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.jobCode.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()))
}
updateEmployeeList(type: 'add' | 'update' | 'delete' | 'deleteGroup') { updateEmployeeList(type: 'add' | 'update' | 'delete' | 'deleteGroup') {
let body = this.employee.select let body = this.employee.select
switch (type) { switch (type) {
...@@ -566,4 +577,13 @@ export class SubEmployeeRegistrationComponent { ...@@ -566,4 +577,13 @@ export class SubEmployeeRegistrationComponent {
return disable return disable
} }
decodeJWT(token: string) {
let base64Url = token.split('.')[1]; // ดึงส่วนที่เป็น Payload
let base64 = base64Url.replace('-', '+').replace('_', '/'); // แก้ไข base64 ให้ถูกต้อง
let jsonPayload = decodeURIComponent(atob(base64).split('').map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
}
} }
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