Skip to content

M
myAppraisal
Commit 64229704 by Nakarin Luankla
Options

Merge branch 'DEV' of https://mygit.myhr.co.th/angular/myAppraisal into DEV

parents 26805bd3 672f115e
Showing with 689 additions and 931 deletions
src/app/components/company-components/company-registration/branch-business-unit/branch-business-unit.component.html
<div class="font-size-16px font-weight-600 pt-2rem pb-1rem text-primary"> <div class="font-size-16px font-weight-600 pt-2rem pb-1rem text-primary">
รายละเอียดสาขาและหน่วยธุรกิจ รายละเอียดหน่วยธุรกิจ
</div> </div>
<div class="page"> <div class="page">
<nav class="flex rtl:space-x-reverse space-x-2"> <nav class="flex rtl:space-x-reverse space-x-2">
......
src/app/components/company-components/company-registration/branch-business-unit/branch-business-unit.component.ts
...@@ -6,12 +6,12 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; ...@@ -6,12 +6,12 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
styleUrls: ['./branch-business-unit.component.scss'] styleUrls: ['./branch-business-unit.component.scss']
}) })
export class BranchBusinessUnitComponent { export class BranchBusinessUnitComponent {
@Input() pathTitle = ['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท', 'สาขาและหน่วยธุรกิจ', 'ทะเบียนฝ่าย'] @Input() pathTitle = ['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท', 'หน่วยธุรกิจ', 'ทะเบียนฝ่าย']
@Output() sendPathTitle: EventEmitter<string[]> = new EventEmitter<string[]>(); @Output() sendPathTitle: EventEmitter<string[]> = new EventEmitter<string[]>();
currentTab = 1 currentTab = 1
onSendPathTitle(pathTitle: string) { onSendPathTitle(pathTitle: string) {
this.sendPathTitle.emit(['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท', 'สาขาและหน่วยธุรกิจ', pathTitle]) this.sendPathTitle.emit(['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท', 'หน่วยธุรกิจ', pathTitle])
} }
} }
src/app/components/company-components/company-registration/branch-business-unit/department-list/department-list.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<!-- Content ของ div แรก --> <div class="flex items-center">
<div class="px-1"> <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" [(ngModel)]="isDataListChecked">
data-hs-overlay="#department-list-upload-modal" <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> {{numDataListChecked}} Selected</label>
<i class="ri-add-line"></i> </div>
นำเข้าข้อมูล <div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -29,17 +30,33 @@ ...@@ -29,17 +30,33 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#department-list-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu1();selectBu2()" data-hs-overlay="#department-list-modal-add"> (click)="currentModal='add';selectBu1();selectBu2()" data-hs-overlay="#department-list-modal-add">
<i class="ri-add-line"></i> <i class="ri-add-line"></i>
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
(click)="currentModal='delete';selectBu1()" data-hs-overlay="#department-list-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -57,10 +74,10 @@ ...@@ -57,10 +74,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสแผนก','รายละเอียดแผนก (ไทย)','รายละเอียดแผนก (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสแผนก','รายละเอียดแผนก (ไทย)','รายละเอียดแผนก (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -88,14 +105,15 @@ ...@@ -88,14 +105,15 @@
<tr <tr
*ngFor="let item of filterBu2Table() | slice:((bu2Table.currentPage-1) * 10) : (((bu2Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu2Table() | slice:((bu2Table.currentPage-1) * 10) : (((bu2Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td class="text-center">
{{((bu2Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu2id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu2id}}</td> <td class="text-center">{{item.data.bu2id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="currentModal='edit';selectBu2(item)" (click)="currentModal='edit';selectBu2(item.data)"
data-hs-overlay="#department-list-modal-edit"></i> data-hs-overlay="#department-list-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1"
(click)="currentModal='delete';selectBu2(item)" (click)="currentModal='delete';selectBu2(item)"
...@@ -192,8 +210,7 @@ ...@@ -192,8 +210,7 @@
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
name="hs-leading-button-add-on-with-icon-and-button" name="hs-leading-button-add-on-with-icon-and-button"
class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" readonly class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" readonly
style="padding-right: 3.5rem;" [(ngModel)]="bu1.bu1id" style="padding-right: 3.5rem;" [(ngModel)]="bu1.bu1id" (ngModelChange)="bu1idChange()">
(ngModelChange)="bu1idChange()">
<div <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"> 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)="selectBu1()"> <button type="button" class="flex items-center text-red-500" (click)="selectBu1()">
...@@ -213,18 +230,9 @@ ...@@ -213,18 +230,9 @@
<label class="ti-form-label mt-2rem">เเผนก<span class="text-danger">*</span></label> <label class="ti-form-label mt-2rem">เเผนก<span class="text-danger">*</span></label>
<div class="relative flex rounded-md w-1/2"> <div class="relative flex rounded-md w-1/2">
<input type="text" class="ti-form-input h-16" [(ngModel)]="bu2.bu2id"> <input type="text" class="ti-form-input h-16" [(ngModel)]="bu2.bu2id">
<!-- <input type="text" id="hs-leading-button-add-on-with-icon-and-button" name="hs-leading-button-add-on-with-icon-and-button" class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" style="padding-right: 3.5rem;"
[(ngModel)]="bu2.bu2id" (ngModelChange)="bu2idChange()">
<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)="selectBu2()">
<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="#department-list-bu2-table-modal">
<i class="ri-search-line cursor-pointer text-gray"></i>
</button>
</div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดแผนก (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดแผนก (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu2.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu2.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดแผนก (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดแผนก (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu2.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu2.edesc">
...@@ -289,7 +297,8 @@ ...@@ -289,7 +297,8 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
...@@ -319,7 +328,8 @@ ...@@ -319,7 +328,8 @@
readonly [value]="bu2.bu2id"> readonly [value]="bu2.bu2id">
</div> </div>
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดแผนก (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดแผนก (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu2.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu2.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดแผนก (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดแผนก (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu2.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu2.edesc">
...@@ -469,108 +479,6 @@ ...@@ -469,108 +479,6 @@
</div> </div>
</div> </div>
<div id="department-list-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">
ข้อมูลทะเบียนแผนก
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#department-list-modal-add">
<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)]="bu2Modal.search"
(ngModelChange)="onBu2ModalSearchChange()">
<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="overflow-auto border">
<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">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu2Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu2Modal().length">
<tr *ngFor="let item of filterBu2Modal() | slice:((bu2Modal.currentPage-1) * 10) : (((bu2Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu2(item)"
data-hs-overlay="#department-list-modal-add">
<td class="flex justify-center">
{{((bu2Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu2id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu2Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu2Modal.currentPage = (bu2Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu2Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu2Modal.currentPage"
(click)="bu2Modal.currentPage=item">{{item}}
</a>
<!-- <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a> -->
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu2Modal.currentPage = (bu2Modal.currentPage > bu2Modal.page.length-1 ? bu2Modal.currentPage: bu2Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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="#department-list-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="department-list-alert-modal" class="hs-overlay hidden ti-modal"> <div id="department-list-alert-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="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="max-h-full overflow-hidden ti-modal-content w-full">
...@@ -697,6 +605,11 @@ ...@@ -697,6 +605,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" <button type="submit" class="ti-btn ti-btn-secondary"
data-hs-overlay="#department-list-upload-modal" [class.ti-btn-disabled]="!selectedFile" data-hs-overlay="#department-list-upload-modal" [class.ti-btn-disabled]="!selectedFile"
......
src/app/components/company-components/company-registration/branch-business-unit/department-list/department-list.component.ts
...@@ -16,7 +16,7 @@ interface table { ...@@ -16,7 +16,7 @@ interface table {
styleUrls: ['./department-list.component.scss'] styleUrls: ['./department-list.component.scss']
}) })
export class DepartmentListComponent implements OnInit { export class DepartmentListComponent implements OnInit {
bu2List: Bu2Model[] = [] bu2List: { check: boolean, data: Bu2Model }[] = []
bu2ListLoading = false bu2ListLoading = false
bu2: Bu2Model = new MyBu2Model() bu2: Bu2Model = new MyBu2Model()
bu2Table: table = { bu2Table: table = {
...@@ -41,6 +41,11 @@ export class DepartmentListComponent implements OnInit { ...@@ -41,6 +41,11 @@ export class DepartmentListComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'delete' = "add" currentModal: 'add' | 'edit' | 'delete' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu2Service: Bu2Service, constructor(private bu2Service: Bu2Service,
private bu1Service: Bu1Service, private bu1Service: Bu1Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -104,9 +109,11 @@ export class DepartmentListComponent implements OnInit { ...@@ -104,9 +109,11 @@ export class DepartmentListComponent implements OnInit {
this.bu2ListLoading = true this.bu2ListLoading = true
this.bu2Service.getList().subscribe({ this.bu2Service.getList().subscribe({
next: response => { next: response => {
this.bu2List = response.map(x => new MyBu2Model(x)) this.bu2List = response.map(x => ({ check: false, data: new MyBu2Model(x) }))
this.bu2ListLoading = false this.bu2ListLoading = false
this.onBu2TableSearchChange() this.onBu2TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.cdr.detectChanges() this.cdr.detectChanges()
}, error: error => { }, error: error => {
this.bu2ListLoading = false this.bu2ListLoading = false
...@@ -119,9 +126,12 @@ export class DepartmentListComponent implements OnInit { ...@@ -119,9 +126,12 @@ export class DepartmentListComponent implements OnInit {
this.bu2Table.page = Array.from({ length: Math.ceil(this.filterBu2Table().length / 10) }, (_, i) => i + 1); this.bu2Table.page = Array.from({ length: Math.ceil(this.filterBu2Table().length / 10) }, (_, i) => i + 1);
} }
filterBu2Table() { filterBu2Table() {
return this.bu2List.filter(x => x.bu2id.toLowerCase().includes(this.bu2Table.search.toLowerCase()) || return this.bu2List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu2Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu2Table.search.toLowerCase())) return data.bu2id.toLowerCase().includes(this.bu2Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu2Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu2Table.search.toLowerCase())
})
} }
selectBu2(bu2?: Bu2Model) { selectBu2(bu2?: Bu2Model) {
this.bu2 = new MyBu2Model(bu2) this.bu2 = new MyBu2Model(bu2)
...@@ -133,18 +143,22 @@ export class DepartmentListComponent implements OnInit { ...@@ -133,18 +143,22 @@ export class DepartmentListComponent implements OnInit {
}) })
} }
} }
bu2idChange() { // bu2idChange() {
const bu2 = this.bu2List.find(x => x.bu2id == this.bu2.bu2id) // const bu2 = this.bu2List.find(x => x.bu2id == this.bu2.bu2id)
this.selectBu2(bu2 || new MyBu2Model({ bu2id: this.bu2.bu2id })) // this.selectBu2(bu2 || new MyBu2Model({ bu2id: this.bu2.bu2id }))
} // }
onBu2ModalSearchChange() { onBu2ModalSearchChange() {
this.bu2Modal.currentPage = 1 this.bu2Modal.currentPage = 1
this.bu2Modal.page = Array.from({ length: Math.ceil(this.filterBu2Modal().length / 10) }, (_, i) => i + 1); this.bu2Modal.page = Array.from({ length: Math.ceil(this.filterBu2Modal().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu2Modal() { filterBu2Modal() {
return this.bu2List.filter(x => x.bu2id.toLowerCase().includes(this.bu2Modal.search.toLowerCase()) || return this.bu2List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu2Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu2Modal.search.toLowerCase())) return data.bu2id.toLowerCase().includes(this.bu2Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu2Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu2Table.search.toLowerCase())
})
} }
...@@ -196,7 +210,8 @@ export class DepartmentListComponent implements OnInit { ...@@ -196,7 +210,8 @@ export class DepartmentListComponent implements OnInit {
} }
deleteBu2() { deleteBu2() {
this.bu2ListLoading = true this.bu2ListLoading = true
this.bu2Service.delete(this.bu2).subscribe({ const body = this.bu2List.filter(x => x.check).map(x => new MyBu2Model(x.data))
this.bu2Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -211,5 +226,18 @@ export class DepartmentListComponent implements OnInit { ...@@ -211,5 +226,18 @@ export class DepartmentListComponent implements OnInit {
} }
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu2Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu2Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu2List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/department-register/department-register.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#department-register-upload-modal" [(ngModel)]="isDataListChecked">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
<i class="ri-add-line"></i> {{numDataListChecked}} Selected</label>
นำเข้าข้อมูล </div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -27,17 +29,34 @@ ...@@ -27,17 +29,34 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#department-register-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
data-hs-overlay="#department-register-modal-add" (click)="currentModel='add';selectBu1()"> data-hs-overlay="#department-register-modal-add" (click)="currentModel='add';selectBu1()">
<i class="ri-add-line"></i> <i class="ri-add-line"></i>
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
(click)="currentModel='deleteGroup';selectBu1()"
data-hs-overlay="#department-register-delete-alert-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -55,10 +74,10 @@ ...@@ -55,10 +74,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสฝ่าย','รายละเอียดฝ่าย (ไทย)','รายละเอียดฝ่าย (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสฝ่าย','รายละเอียดฝ่าย (ไทย)','รายละเอียดฝ่าย (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -85,13 +104,16 @@ ...@@ -85,13 +104,16 @@
<tbody *ngIf="!bu1ListLoading&&bu1ListFilter().length"> <tbody *ngIf="!bu1ListLoading&&bu1ListFilter().length">
<tr <tr
*ngFor="let item of bu1ListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of bu1ListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
<td class="text-center">{{((currentPage-1) * 10)+(i+1)}}</td> <td class="text-center">
<td class="text-center">{{item.bu1id}}</td> <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu1id}}"
<td>{{item.tdesc}}</td> [(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
<td>{{item.edesc}}</td> </td>
<td class="text-center">{{item.data.bu1id}}</td>
<td>{{item.data.tdesc}}</td>
<td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="currentModel='edit';selectBu1(item)" (click)="currentModel='edit';selectBu1(item.data)"
data-hs-overlay="#department-register-modal-edit"></i> data-hs-overlay="#department-register-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1"
(click)="currentModel='delete';selectBu1(item)" (click)="currentModel='delete';selectBu1(item)"
...@@ -364,6 +386,11 @@ ...@@ -364,6 +386,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" data-hs-overlay="#department-register-upload-modal" <button type="submit" data-hs-overlay="#department-register-upload-modal"
class="ti-btn ti-btn-secondary" [class.ti-btn-disabled]="!selectedFile" (click)="uploadFile()" class="ti-btn ti-btn-secondary" [class.ti-btn-disabled]="!selectedFile" (click)="uploadFile()"
......
src/app/components/company-components/company-registration/branch-business-unit/department-register/department-register.component.ts
...@@ -12,7 +12,7 @@ import { FileService } from 'src/app/shared/services/file.service'; ...@@ -12,7 +12,7 @@ import { FileService } from 'src/app/shared/services/file.service';
export class DepartmentRegisterComponent implements OnInit { export class DepartmentRegisterComponent implements OnInit {
currentPage = 1 currentPage = 1
page = Array.from({ length: 1 }, (_, i) => i + 1); page = Array.from({ length: 1 }, (_, i) => i + 1);
bu1List: Bu1Model[] = [] bu1List: { check: boolean, data: Bu1Model }[] = []
bu1ListLoading = false bu1ListLoading = false
bu1: Bu1Model = new MyBu1Model() bu1: Bu1Model = new MyBu1Model()
search = "" search = ""
...@@ -20,7 +20,11 @@ export class DepartmentRegisterComponent implements OnInit { ...@@ -20,7 +20,11 @@ export class DepartmentRegisterComponent implements OnInit {
selectedFile: File | null = null; selectedFile: File | null = null;
selectedFileName: string = 'กรุณาเลือกไฟล์'; selectedFileName: string = 'กรุณาเลือกไฟล์';
currentModel: 'add' | 'edit' | 'delete' = "add" currentModel: 'add' | 'edit' | 'delete' | 'deleteGroup' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu1Service: Bu1Service, constructor(private bu1Service: Bu1Service,
private toastr: ToastrService, private toastr: ToastrService,
private cdr: ChangeDetectorRef, private cdr: ChangeDetectorRef,
...@@ -82,7 +86,9 @@ export class DepartmentRegisterComponent implements OnInit { ...@@ -82,7 +86,9 @@ export class DepartmentRegisterComponent implements OnInit {
this.bu1ListLoading = true this.bu1ListLoading = true
this.bu1Service.getList().subscribe({ this.bu1Service.getList().subscribe({
next: response => { next: response => {
this.bu1List = response.map(x => new MyBu1Model(x)) this.bu1List = response.map(x => ({ check: false, data: new MyBu1Model(x) }))
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.bu1ListLoading = false this.bu1ListLoading = false
this.searchChange() this.searchChange()
this.cdr.detectChanges() this.cdr.detectChanges()
...@@ -95,11 +101,15 @@ export class DepartmentRegisterComponent implements OnInit { ...@@ -95,11 +101,15 @@ export class DepartmentRegisterComponent implements OnInit {
searchChange() { searchChange() {
this.currentPage = 1 this.currentPage = 1
this.page = Array.from({ length: Math.ceil(this.bu1ListFilter().length / 10) }, (_, i) => i + 1); this.page = Array.from({ length: Math.ceil(this.bu1ListFilter().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
bu1ListFilter() { bu1ListFilter() {
return this.bu1List.filter(x => x.bu1id.toLowerCase().includes(this.search.toLowerCase()) || return this.bu1List.filter(x => {
x.tdesc.toLowerCase().includes(this.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.search.toLowerCase())) return data.bu1id.toLowerCase().includes(this.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.search.toLowerCase())
})
} }
selectBu1(bu1?: Bu1Model) { selectBu1(bu1?: Bu1Model) {
this.bu1 = new MyBu1Model(bu1) this.bu1 = new MyBu1Model(bu1)
...@@ -130,7 +140,8 @@ export class DepartmentRegisterComponent implements OnInit { ...@@ -130,7 +140,8 @@ export class DepartmentRegisterComponent implements OnInit {
} }
deleteBu1() { deleteBu1() {
this.bu1ListLoading = true this.bu1ListLoading = true
this.bu1Service.delete(this.bu1).subscribe({ const body = this.bu1List.filter(x => x.check).map(x => new MyBu1Model(x.data))
this.bu1Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -145,6 +156,17 @@ export class DepartmentRegisterComponent implements OnInit { ...@@ -145,6 +156,17 @@ export class DepartmentRegisterComponent implements OnInit {
} }
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.bu1ListFilter().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.bu1ListFilter();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu1List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/section-registration/section-registration.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#section-registration-upload-modal" (click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> [(ngModel)]="isDataListChecked">
<i class="ri-add-line"></i> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
นำเข้าข้อมูล {{numDataListChecked}} Selected</label>
</div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -27,6 +30,15 @@ ...@@ -27,6 +30,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#section-registration-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu2();selectBu3()" (click)="currentModal='add';selectBu2();selectBu3()"
data-hs-overlay="#section-registration-modal-add"> data-hs-overlay="#section-registration-modal-add">
...@@ -34,11 +46,18 @@ ...@@ -34,11 +46,18 @@
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
(click)="currentModal='delete'" data-hs-overlay="#section-registration-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -57,10 +76,10 @@ ...@@ -57,10 +76,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วน','รายละเอียดส่วน (ไทย)','รายละเอียดส่วน (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสส่วน','รายละเอียดส่วน (ไทย)','รายละเอียดส่วน (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -88,14 +107,15 @@ ...@@ -88,14 +107,15 @@
<tr <tr
*ngFor="let item of filterBu3Table() | slice:((bu3Table.currentPage-1) * 10) : (((bu3Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu3Table() | slice:((bu3Table.currentPage-1) * 10) : (((bu3Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td class="text-center">
{{((bu3Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu3id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu3id}}</td> <td class="text-center">{{item.data.bu3id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="selectBu3(item);currentModal='edit'" (click)="selectBu3(item.data);currentModal='edit'"
data-hs-overlay="#section-registration-modal-edit"></i> data-hs-overlay="#section-registration-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" currentModal='delete' <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" currentModal='delete'
(click)="selectBu3(item)" data-hs-overlay="#section-registration-alert-delete-modal"></i> --> (click)="selectBu3(item)" data-hs-overlay="#section-registration-alert-delete-modal"></i> -->
...@@ -226,7 +246,8 @@ ...@@ -226,7 +246,8 @@
</button> </button>
</div> --> </div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วน (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วน (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu3.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu3.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วน (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วน (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu3.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu3.edesc">
...@@ -292,7 +313,8 @@ ...@@ -292,7 +313,8 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
...@@ -322,7 +344,8 @@ ...@@ -322,7 +344,8 @@
readonly [value]="bu3.bu3id"> readonly [value]="bu3.bu3id">
</div> </div>
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วน (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วน (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu3.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu3.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วน (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วน (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu3.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu3.edesc">
...@@ -472,107 +495,6 @@ ...@@ -472,107 +495,6 @@
</div> </div>
</div> </div>
<div id="section-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">
ข้อมูลทะเบียนส่วน
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#section-registration-modal-add">
<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)]="bu3Modal.search"
(ngModelChange)="onBu3ModalSearchChange()">
<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="overflow-auto border">
<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">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu3Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu3Modal().length">
<tr *ngFor="let item of filterBu3Modal() | slice:((bu3Modal.currentPage-1) * 10) : (((bu3Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu3(item)"
data-hs-overlay="#section-registration-modal-add">
<td class="flex justify-center">
{{((bu3Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu3id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu3Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu3Modal.currentPage = (bu3Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu3Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu3Modal.currentPage"
(click)="bu3Modal.currentPage=item">{{item}}
</a>
<!-- <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a> -->
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu3Modal.currentPage = (bu3Modal.currentPage > bu3Modal.page.length-1 ? bu3Modal.currentPage: bu3Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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="#section-registration-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="section-registration-alert-modal" class="hs-overlay hidden ti-modal"> <div id="section-registration-alert-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="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
...@@ -701,6 +623,11 @@ ...@@ -701,6 +623,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" <button type="submit" class="ti-btn ti-btn-secondary"
data-hs-overlay="#section-registration-upload-modal" (click)="uploadFile()" data-hs-overlay="#section-registration-upload-modal" (click)="uploadFile()"
......
src/app/components/company-components/company-registration/branch-business-unit/section-registration/section-registration.component.ts
...@@ -16,7 +16,7 @@ interface table { ...@@ -16,7 +16,7 @@ interface table {
styleUrls: ['./section-registration.component.scss'] styleUrls: ['./section-registration.component.scss']
}) })
export class SectionRegistrationComponent implements OnInit { export class SectionRegistrationComponent implements OnInit {
bu3List: Bu3Model[] = [] bu3List: { check: boolean, data: Bu3Model }[] = []
bu3ListLoading = false bu3ListLoading = false
bu3: Bu3Model = new MyBu3Model() bu3: Bu3Model = new MyBu3Model()
bu3Table: table = { bu3Table: table = {
...@@ -41,6 +41,10 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -41,6 +41,10 @@ export class SectionRegistrationComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'delete' = "add" currentModal: 'add' | 'edit' | 'delete' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu3Service: Bu3Service, constructor(private bu3Service: Bu3Service,
private bu2Service: Bu2Service, private bu2Service: Bu2Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -105,9 +109,11 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -105,9 +109,11 @@ export class SectionRegistrationComponent implements OnInit {
this.bu3ListLoading = true this.bu3ListLoading = true
this.bu3Service.getList().subscribe({ this.bu3Service.getList().subscribe({
next: response => { next: response => {
this.bu3List = response.map(x => new MyBu3Model(x)) this.bu3List = response.map(x => ({ check: false, data: new MyBu3Model(x) }))
this.bu3ListLoading = false this.bu3ListLoading = false
this.onBu3TableSearchChange() this.onBu3TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.cdr.detectChanges() this.cdr.detectChanges()
}, error: error => { }, error: error => {
this.bu3ListLoading = false this.bu3ListLoading = false
...@@ -118,11 +124,15 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -118,11 +124,15 @@ export class SectionRegistrationComponent implements OnInit {
onBu3TableSearchChange() { onBu3TableSearchChange() {
this.bu3Table.currentPage = 1 this.bu3Table.currentPage = 1
this.bu3Table.page = Array.from({ length: Math.ceil(this.filterBu3Table().length / 10) }, (_, i) => i + 1); this.bu3Table.page = Array.from({ length: Math.ceil(this.filterBu3Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu3Table() { filterBu3Table() {
return this.bu3List.filter(x => x.bu3id.toLowerCase().includes(this.bu3Table.search.toLowerCase()) || return this.bu3List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu3Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu3Table.search.toLowerCase())) return data.bu3id.toLowerCase().includes(this.bu3Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu3Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu3Table.search.toLowerCase())
})
} }
selectBu3(bu3?: Bu3Model) { selectBu3(bu3?: Bu3Model) {
this.bu3 = new MyBu3Model(bu3) this.bu3 = new MyBu3Model(bu3)
...@@ -134,18 +144,21 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -134,18 +144,21 @@ export class SectionRegistrationComponent implements OnInit {
}) })
} }
} }
bu3idChange() { // bu3idChange() {
const bu3 = this.bu3List.find(x => x.bu3id == this.bu3.bu3id) // const bu3 = this.bu3List.find(x => x.bu3id == this.bu3.bu3id)
this.selectBu3(bu3 || new MyBu3Model({ bu3id: this.bu3.bu3id })) // this.selectBu3(bu3 || new MyBu3Model({ bu3id: this.bu3.bu3id }))
} // }
onBu3ModalSearchChange() { onBu3ModalSearchChange() {
this.bu3Modal.currentPage = 1 this.bu3Modal.currentPage = 1
this.bu3Modal.page = Array.from({ length: Math.ceil(this.filterBu3Modal().length / 10) }, (_, i) => i + 1); this.bu3Modal.page = Array.from({ length: Math.ceil(this.filterBu3Modal().length / 10) }, (_, i) => i + 1);
} }
filterBu3Modal() { filterBu3Modal() {
return this.bu3List.filter(x => x.bu3id.toLowerCase().includes(this.bu3Modal.search.toLowerCase()) || return this.bu3List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu3Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu3Modal.search.toLowerCase())) return data.bu3id.toLowerCase().includes(this.bu3Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu3Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu3Table.search.toLowerCase())
})
} }
addBu3() { addBu3() {
this.bu3ListLoading = true this.bu3ListLoading = true
...@@ -166,7 +179,8 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -166,7 +179,8 @@ export class SectionRegistrationComponent implements OnInit {
} }
deleteBu3() { deleteBu3() {
this.bu3ListLoading = true this.bu3ListLoading = true
this.bu3Service.delete(this.bu3).subscribe({ const body = this.bu3List.filter(x => x.check).map(x => new MyBu3Model(x.data))
this.bu3Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -211,5 +225,18 @@ export class SectionRegistrationComponent implements OnInit { ...@@ -211,5 +225,18 @@ export class SectionRegistrationComponent implements OnInit {
positionClass: 'toast-top-right', positionClass: 'toast-top-right',
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu3Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu3Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu3List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/sub-department-four/sub-department-four.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#sub-department-four-upload-modal" [(ngModel)]="isDataListChecked">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
<i class="ri-add-line"></i> {{numDataListChecked}} Selected</label>
นำเข้าข้อมูล </div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -28,6 +30,15 @@ ...@@ -28,6 +30,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#sub-department-four-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu6();selectBu7()" (click)="currentModal='add';selectBu6();selectBu7()"
data-hs-overlay="#sub-department-four-modal-add"> data-hs-overlay="#sub-department-four-modal-add">
...@@ -35,11 +46,18 @@ ...@@ -35,11 +46,18 @@
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
(click)="currentModal='delete'" data-hs-overlay="#sub-department-four-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -57,10 +75,10 @@ ...@@ -57,10 +75,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย4','รายละเอียดส่วนย่อย4 (ไทย)','รายละเอียดส่วนย่อย4 (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสส่วนย่อย4','รายละเอียดส่วนย่อย4 (ไทย)','รายละเอียดส่วนย่อย4 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -88,14 +106,15 @@ ...@@ -88,14 +106,15 @@
<tr <tr
*ngFor="let item of filterBu7Table() | slice:((bu7Table.currentPage-1) * 10) : (((bu7Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu7Table() | slice:((bu7Table.currentPage-1) * 10) : (((bu7Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td class="text-center">
{{((bu7Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu7id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu7id}}</td> <td class="text-center">{{item.data.bu7id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="selectBu7(item);currentModal='edit'" (click)="selectBu7(item.data);currentModal='edit'"
data-hs-overlay="#sub-department-four-modal-edit"></i> data-hs-overlay="#sub-department-four-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="selectBu7(item)" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="selectBu7(item)"
data-hs-overlay="#sub-department-four-alert-delete-modal"></i> --> data-hs-overlay="#sub-department-four-alert-delete-modal"></i> -->
...@@ -226,7 +245,8 @@ ...@@ -226,7 +245,8 @@
</button> </button>
</div> --> </div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu7.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu7.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu7.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu7.edesc">
...@@ -292,7 +312,8 @@ ...@@ -292,7 +312,8 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
...@@ -315,14 +336,16 @@ ...@@ -315,14 +336,16 @@
readonly [value]="bu6.tdesc"> readonly [value]="bu6.tdesc">
</div> </div>
</div> </div>
<label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย4<span class="text-danger">*</span></label> <label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย4<span
class="text-danger">*</span></label>
<div class="sm:grid grid-cols-2 gap-1"> <div class="sm:grid grid-cols-2 gap-1">
<div class="relative w-full"> <div class="relative w-full">
<input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly" <input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly"
readonly [value]="bu7.bu7id"> readonly [value]="bu7.bu7id">
</div> </div>
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu7.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu7.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu7.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu7.edesc">
...@@ -472,108 +495,6 @@ ...@@ -472,108 +495,6 @@
</div> </div>
</div> </div>
<div id="sub-department-four-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">
ข้อมูลทะเบียนส่วนย่อย 4
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-four-modal-add">
<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)]="bu7Modal.search"
(ngModelChange)="onBu7ModalSearchChange()">
<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="overflow-auto border">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย4','รายละเอียดส่วนย่อย4 (ไทย)','รายละเอียดส่วนย่อย4 (อังกฤษ)']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu7Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu7Modal().length">
<tr *ngFor="let item of filterBu7Modal() | slice:((bu7Modal.currentPage-1) * 10) : (((bu7Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu7(item)"
data-hs-overlay="#sub-department-four-modal-add">
<td class="flex justify-center">
{{((bu7Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu7id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu7Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu7Modal.currentPage = (bu7Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu7Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu7Modal.currentPage"
(click)="bu7Modal.currentPage=item">{{item}}
</a>
<!-- <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a> -->
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu7Modal.currentPage = (bu7Modal.currentPage > bu7Modal.page.length-1 ? bu7Modal.currentPage: bu7Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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-department-four-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="sub-department-four-alert-add-modal" class="hs-overlay hidden ti-modal"> <div id="sub-department-four-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="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="max-h-full overflow-hidden ti-modal-content w-full">
...@@ -701,6 +622,11 @@ ...@@ -701,6 +622,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()" <button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()"
data-hs-overlay="#sub-department-four-upload-modal" [class.ti-btn-disabled]="!selectedFile" data-hs-overlay="#sub-department-four-upload-modal" [class.ti-btn-disabled]="!selectedFile"
......
src/app/components/company-components/company-registration/branch-business-unit/sub-department-four/sub-department-four.component.ts
...@@ -17,7 +17,7 @@ interface table { ...@@ -17,7 +17,7 @@ interface table {
styleUrls: ['./sub-department-four.component.scss'] styleUrls: ['./sub-department-four.component.scss']
}) })
export class SubDepartmentFourComponent implements OnInit { export class SubDepartmentFourComponent implements OnInit {
bu7List: Bu7Model[] = [] bu7List: { check: boolean, data: Bu7Model }[] = []
bu7ListLoading = false bu7ListLoading = false
bu7: Bu7Model = new MyBu7Model() bu7: Bu7Model = new MyBu7Model()
bu7Table: table = { bu7Table: table = {
...@@ -42,6 +42,10 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -42,6 +42,10 @@ export class SubDepartmentFourComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'delete' = "add" currentModal: 'add' | 'edit' | 'delete' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu7Service: Bu7Service, constructor(private bu7Service: Bu7Service,
private bu6Service: Bu6Service, private bu6Service: Bu6Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -105,9 +109,11 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -105,9 +109,11 @@ export class SubDepartmentFourComponent implements OnInit {
this.bu7ListLoading = true this.bu7ListLoading = true
this.bu7Service.getList().subscribe({ this.bu7Service.getList().subscribe({
next: response => { next: response => {
this.bu7List = response.map(x => new MyBu7Model(x)) this.bu7List = response.map(x => ({ check: false, data: new MyBu7Model(x) }))
this.bu7ListLoading = false this.bu7ListLoading = false
this.onBu7TableSearchChange() this.onBu7TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.cdr.detectChanges() this.cdr.detectChanges()
}, error: error => { }, error: error => {
this.bu7ListLoading = false this.bu7ListLoading = false
...@@ -118,11 +124,15 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -118,11 +124,15 @@ export class SubDepartmentFourComponent implements OnInit {
onBu7TableSearchChange() { onBu7TableSearchChange() {
this.bu7Table.currentPage = 1 this.bu7Table.currentPage = 1
this.bu7Table.page = Array.from({ length: Math.ceil(this.filterBu7Table().length / 10) }, (_, i) => i + 1); this.bu7Table.page = Array.from({ length: Math.ceil(this.filterBu7Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu7Table() { filterBu7Table() {
return this.bu7List.filter(x => x.bu7id.toLowerCase().includes(this.bu7Table.search.toLowerCase()) || return this.bu7List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu7Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu7Table.search.toLowerCase())) return data.bu7id.toLowerCase().includes(this.bu7Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu7Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu7Table.search.toLowerCase())
})
} }
selectBu7(bu7?: Bu7Model) { selectBu7(bu7?: Bu7Model) {
this.bu7 = new MyBu7Model(bu7 || {}) this.bu7 = new MyBu7Model(bu7 || {})
...@@ -134,18 +144,17 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -134,18 +144,17 @@ export class SubDepartmentFourComponent implements OnInit {
}) })
} }
} }
bu7idChange() {
const bu7 = this.bu7List.find(x => x.bu7id == this.bu7.bu7id)
this.selectBu7(bu7 || new MyBu7Model({ bu7id: this.bu7.bu7id }))
}
onBu7ModalSearchChange() { onBu7ModalSearchChange() {
this.bu7Modal.currentPage = 1 this.bu7Modal.currentPage = 1
this.bu7Modal.page = Array.from({ length: Math.ceil(this.filterBu7Modal().length / 10) }, (_, i) => i + 1); this.bu7Modal.page = Array.from({ length: Math.ceil(this.filterBu7Modal().length / 10) }, (_, i) => i + 1);
} }
filterBu7Modal() { filterBu7Modal() {
return this.bu7List.filter(x => x.bu7id.toLowerCase().includes(this.bu7Modal.search.toLowerCase()) || return this.bu7List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu7Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu7Modal.search.toLowerCase())) return data.bu7id.toLowerCase().includes(this.bu7Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu7Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu7Table.search.toLowerCase())
})
} }
addBu7() { addBu7() {
this.bu7ListLoading = true this.bu7ListLoading = true
...@@ -166,7 +175,8 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -166,7 +175,8 @@ export class SubDepartmentFourComponent implements OnInit {
} }
deleteBu7() { deleteBu7() {
this.bu7ListLoading = true this.bu7ListLoading = true
this.bu7Service.delete(this.bu7).subscribe({ const body = this.bu7List.filter(x => x.check).map(x => new MyBu7Model(x.data))
this.bu7Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -211,6 +221,19 @@ export class SubDepartmentFourComponent implements OnInit { ...@@ -211,6 +221,19 @@ export class SubDepartmentFourComponent implements OnInit {
positionClass: 'toast-top-right', positionClass: 'toast-top-right',
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu7Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu7Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu7List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/sub-department-one/sub-department-one.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#sub-department-one-upload-modal" [(ngModel)]="isDataListChecked">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
<i class="ri-add-line"></i> {{numDataListChecked}} Selected</label>
นำเข้าข้อมูล </div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)=" downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
<div class="px-1"> <div class="px-1">
<div class="relative shadow-md"> <div class="relative shadow-md">
...@@ -28,6 +30,15 @@ ...@@ -28,6 +30,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#sub-department-one-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu3();selectBu4()" (click)="currentModal='add';selectBu3();selectBu4()"
data-hs-overlay="#sub-department-one-modal-add"> data-hs-overlay="#sub-department-one-modal-add">
...@@ -35,11 +46,18 @@ ...@@ -35,11 +46,18 @@
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
data-hs-overlay="#sub-department-one-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -57,10 +75,10 @@ ...@@ -57,10 +75,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย1','รายละเอียดส่วนย่อย1 (ไทย)','รายละเอียดส่วนย่อย1 (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสส่วนย่อย1','รายละเอียดส่วนย่อย1 (ไทย)','รายละเอียดส่วนย่อย1 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -88,14 +106,15 @@ ...@@ -88,14 +106,15 @@
<tr <tr
*ngFor="let item of filterBu4Table() | slice:((bu4Table.currentPage-1) * 10) : (((bu4Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu4Table() | slice:((bu4Table.currentPage-1) * 10) : (((bu4Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td class="text-center">
{{((bu4Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu4id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu4id}}</td> <td class="text-center">{{item.data.bu4id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="selectBu4(item);currentModal='edit'" (click)="selectBu4(item.data);currentModal='edit'"
data-hs-overlay="#sub-department-one-modal-edit"></i> data-hs-overlay="#sub-department-one-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1"
(click)="currentModal='delete';selectBu4(item)" (click)="currentModal='delete';selectBu4(item)"
...@@ -228,7 +247,8 @@ ...@@ -228,7 +247,8 @@
</button> </button>
</div> --> </div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu4.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu4.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu4.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu4.edesc">
...@@ -294,7 +314,8 @@ ...@@ -294,7 +314,8 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label ">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label ">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
...@@ -317,14 +338,16 @@ ...@@ -317,14 +338,16 @@
readonly [value]="bu3.tdesc"> readonly [value]="bu3.tdesc">
</div> </div>
</div> </div>
<label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย1<span class="text-danger">*</span></label> <label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย1<span
class="text-danger">*</span></label>
<div class="sm:grid grid-cols-2 gap-1"> <div class="sm:grid grid-cols-2 gap-1">
<div class="relative w-full"> <div class="relative w-full">
<input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly" <input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly"
readonly [value]="bu4.bu4id"> readonly [value]="bu4.bu4id">
</div> </div>
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu4.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu4.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย1 (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu4.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu4.edesc">
...@@ -474,107 +497,6 @@ ...@@ -474,107 +497,6 @@
</div> </div>
</div> </div>
<div id="sub-department-one-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">
ข้อมูลทะเบียนส่วนย่อย 1
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-one-modal-add">
<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)]="bu4Modal.search"
(ngModelChange)="onBu4ModalSearchChange()">
<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="overflow-auto border">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย1','รายละเอียดส่วนย่อย1 (ไทย)','รายละเอียดส่วนย่อย1 (อังกฤษ)']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu4Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu4Modal().length">
<tr *ngFor="let item of filterBu4Modal() | slice:((bu4Modal.currentPage-1) * 10) : (((bu4Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu4(item)"
data-hs-overlay="#sub-department-one-modal-add">
<td class="flex justify-center">
{{((bu4Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu4id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu4Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu4Modal.currentPage = (bu4Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu4Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu4Modal.currentPage"
(click)="bu4Modal.currentPage=item">{{item}}
</a>
<!-- <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a> -->
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu4Modal.currentPage = (bu4Modal.currentPage > bu4Modal.page.length-1 ? bu4Modal.currentPage: bu4Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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-department-one-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="sub-department-one-alert-modal" class="hs-overlay hidden ti-modal"> <div id="sub-department-one-alert-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="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
...@@ -708,6 +630,11 @@ ...@@ -708,6 +630,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()" <button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()"
data-hs-overlay="#sub-department-one-upload-modal" [class.ti-btn-disabled]="!selectedFile" data-hs-overlay="#sub-department-one-upload-modal" [class.ti-btn-disabled]="!selectedFile"
......
src/app/components/company-components/company-registration/branch-business-unit/sub-department-one/sub-department-one.component.ts
...@@ -16,7 +16,7 @@ interface table { ...@@ -16,7 +16,7 @@ interface table {
styleUrls: ['./sub-department-one.component.scss'] styleUrls: ['./sub-department-one.component.scss']
}) })
export class SubDepartmentOneComponent implements OnInit { export class SubDepartmentOneComponent implements OnInit {
bu4List: Bu4Model[] = [] bu4List: { check: boolean, data: Bu4Model }[] = []
bu4ListLoading = false bu4ListLoading = false
bu4: Bu4Model = new MyBu4Model() bu4: Bu4Model = new MyBu4Model()
bu4Table: table = { bu4Table: table = {
...@@ -41,6 +41,10 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -41,6 +41,10 @@ export class SubDepartmentOneComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'delete' = "add" currentModal: 'add' | 'edit' | 'delete' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu4Service: Bu4Service, constructor(private bu4Service: Bu4Service,
private bu3Service: Bu3Service, private bu3Service: Bu3Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -104,7 +108,7 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -104,7 +108,7 @@ export class SubDepartmentOneComponent implements OnInit {
this.bu4ListLoading = true this.bu4ListLoading = true
this.bu4Service.getList().subscribe({ this.bu4Service.getList().subscribe({
next: response => { next: response => {
this.bu4List = response.map(x => new MyBu4Model(x)) this.bu4List = response.map(x => ({ check: false, data: new MyBu4Model(x) }))
this.bu4ListLoading = false this.bu4ListLoading = false
this.onBu4TableSearchChange() this.onBu4TableSearchChange()
this.cdr.detectChanges() this.cdr.detectChanges()
...@@ -117,11 +121,15 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -117,11 +121,15 @@ export class SubDepartmentOneComponent implements OnInit {
onBu4TableSearchChange() { onBu4TableSearchChange() {
this.bu4Table.currentPage = 1 this.bu4Table.currentPage = 1
this.bu4Table.page = Array.from({ length: Math.ceil(this.filterBu4Table().length / 10) }, (_, i) => i + 1); this.bu4Table.page = Array.from({ length: Math.ceil(this.filterBu4Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu4Table() { filterBu4Table() {
return this.bu4List.filter(x => x.bu4id.toLowerCase().includes(this.bu4Table.search.toLowerCase()) || return this.bu4List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu4Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu4Table.search.toLowerCase())) return data.bu4id.toLowerCase().includes(this.bu4Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu4Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu4Table.search.toLowerCase())
})
} }
selectBu4(bu4?: Bu4Model) { selectBu4(bu4?: Bu4Model) {
this.bu4 = new MyBu4Model(bu4 || {}) this.bu4 = new MyBu4Model(bu4 || {})
...@@ -133,18 +141,17 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -133,18 +141,17 @@ export class SubDepartmentOneComponent implements OnInit {
}) })
} }
} }
bu4idChange() {
const bu4 = this.bu4List.find(x => x.bu4id == this.bu4.bu4id)
this.selectBu4(bu4 || new MyBu4Model({ bu4id: this.bu4.bu4id }))
}
onBu4ModalSearchChange() { onBu4ModalSearchChange() {
this.bu4Modal.currentPage = 1 this.bu4Modal.currentPage = 1
this.bu4Modal.page = Array.from({ length: Math.ceil(this.filterBu4Modal().length / 10) }, (_, i) => i + 1); this.bu4Modal.page = Array.from({ length: Math.ceil(this.filterBu4Modal().length / 10) }, (_, i) => i + 1);
} }
filterBu4Modal() { filterBu4Modal() {
return this.bu4List.filter(x => x.bu4id.toLowerCase().includes(this.bu4Modal.search.toLowerCase()) || return this.bu4List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu4Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu4Modal.search.toLowerCase())) return data.bu4id.toLowerCase().includes(this.bu4Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu4Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu4Table.search.toLowerCase())
})
} }
addBu4() { addBu4() {
this.bu4ListLoading = true this.bu4ListLoading = true
...@@ -165,7 +172,8 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -165,7 +172,8 @@ export class SubDepartmentOneComponent implements OnInit {
} }
deleteBu4() { deleteBu4() {
this.bu4ListLoading = true this.bu4ListLoading = true
this.bu4Service.delete(this.bu4).subscribe({ const body = this.bu4List.filter(x => x.check).map(x => new MyBu4Model(x.data))
this.bu4Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -210,6 +218,20 @@ export class SubDepartmentOneComponent implements OnInit { ...@@ -210,6 +218,20 @@ export class SubDepartmentOneComponent implements OnInit {
positionClass: 'toast-top-right', positionClass: 'toast-top-right',
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu4Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu4Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu4List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/sub-department-three/sub-department-three.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#sub-department-three-upload-modal" [(ngModel)]="isDataListChecked">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
<i class="ri-add-line"></i> {{numDataListChecked}} Selected</label>
นำเข้าข้อมูล </div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
<div class="px-1"> <div class="px-1">
<div class="relative shadow-md"> <div class="relative shadow-md">
...@@ -28,6 +30,15 @@ ...@@ -28,6 +30,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#sub-department-three-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu5();selectBu6()" (click)="currentModal='add';selectBu5();selectBu6()"
data-hs-overlay="#sub-department-three-modal-add"> data-hs-overlay="#sub-department-three-modal-add">
...@@ -35,11 +46,18 @@ ...@@ -35,11 +46,18 @@
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
data-hs-overlay="#sub-department-three-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -57,10 +75,10 @@ ...@@ -57,10 +75,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย3','รายละเอียดส่วนย่อย3 (ไทย)','รายละเอียดส่วนย่อย3 (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสส่วนย่อย3','รายละเอียดส่วนย่อย3 (ไทย)','รายละเอียดส่วนย่อย3 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -88,14 +106,15 @@ ...@@ -88,14 +106,15 @@
<tr <tr
*ngFor="let item of filterBu6Table() | slice:((bu6Table.currentPage-1) * 10) : (((bu6Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu6Table() | slice:((bu6Table.currentPage-1) * 10) : (((bu6Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td class="text-center">
{{((bu6Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu6id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu6id}}</td> <td class="text-center">{{item.data.bu6id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="selectBu6(item);currentModal='edit'" (click)="selectBu6(item.data);currentModal='edit'"
data-hs-overlay="#sub-department-three-modal-edit"></i> data-hs-overlay="#sub-department-three-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="selectBu6(item)" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" (click)="selectBu6(item)"
data-hs-overlay="#sub-department-three-alert-delete-modal"></i> --> data-hs-overlay="#sub-department-three-alert-delete-modal"></i> -->
...@@ -226,7 +245,8 @@ ...@@ -226,7 +245,8 @@
</button> </button>
</div> --> </div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย3 (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย3 (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu6.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu6.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย3 (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย3 (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu6.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu6.edesc">
...@@ -292,7 +312,8 @@ ...@@ -292,7 +312,8 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label ">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label ">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
...@@ -315,7 +336,8 @@ ...@@ -315,7 +336,8 @@
readonly [value]="bu5.tdesc"> readonly [value]="bu5.tdesc">
</div> </div>
</div> </div>
<label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย3<span class="text-danger">*</span></label> <label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย3<span
class="text-danger">*</span></label>
<div class="sm:grid grid-cols-2 gap-1"> <div class="sm:grid grid-cols-2 gap-1">
<div class="relative w-full"> <div class="relative w-full">
<input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly" <input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly"
...@@ -474,107 +496,6 @@ ...@@ -474,107 +496,6 @@
</div> </div>
</div> </div>
<div id="sub-department-three-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">
ข้อมูลทะเบียนส่วนย่อย 3
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-three-modal-add">
<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)]="bu6Modal.search"
(ngModelChange)="onBu6ModalSearchChange()">
<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="overflow-auto border">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย3','รายละเอียดส่วนย่อย3 (ไทย)','รายละเอียดส่วนย่อย3 (อังกฤษ)']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu6Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu6Modal().length">
<tr *ngFor="let item of filterBu6Modal() | slice:((bu6Modal.currentPage-1) * 10) : (((bu6Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu6(item)"
data-hs-overlay="#sub-department-three-modal-add">
<td class="flex justify-center">
{{((bu6Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu6id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu6Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu6Modal.currentPage = (bu6Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu6Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu6Modal.currentPage"
(click)="bu6Modal.currentPage=item">{{item}}
</a>
<!-- <a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a> -->
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu6Modal.currentPage = (bu6Modal.currentPage > bu6Modal.page.length-1 ? bu6Modal.currentPage: bu6Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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-department-three-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="sub-department-three-alert-add-modal" class="hs-overlay hidden ti-modal"> <div id="sub-department-three-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="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out h-[calc(100%-3.5rem)] flex items-center">
...@@ -703,6 +624,11 @@ ...@@ -703,6 +624,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()" <button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()"
data-hs-overlay="#sub-department-three-upload-modal" [class.ti-btn-disabled]="!selectedFile" data-hs-overlay="#sub-department-three-upload-modal" [class.ti-btn-disabled]="!selectedFile"
......
src/app/components/company-components/company-registration/branch-business-unit/sub-department-three/sub-department-three.component.ts
...@@ -17,7 +17,7 @@ interface table { ...@@ -17,7 +17,7 @@ interface table {
styleUrls: ['./sub-department-three.component.scss'] styleUrls: ['./sub-department-three.component.scss']
}) })
export class SubDepartmentThreeComponent implements OnInit { export class SubDepartmentThreeComponent implements OnInit {
bu6List: Bu6Model[] = [] bu6List: { check: boolean, data: Bu6Model }[] = []
bu6ListLoading = false bu6ListLoading = false
bu6: Bu6Model = new MyBu6Model() bu6: Bu6Model = new MyBu6Model()
bu6Table: table = { bu6Table: table = {
...@@ -42,6 +42,10 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -42,6 +42,10 @@ export class SubDepartmentThreeComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'detele' = "add" currentModal: 'add' | 'edit' | 'detele' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu6Service: Bu6Service, constructor(private bu6Service: Bu6Service,
private bu5Service: Bu5Service, private bu5Service: Bu5Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -105,9 +109,11 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -105,9 +109,11 @@ export class SubDepartmentThreeComponent implements OnInit {
this.bu6ListLoading = true this.bu6ListLoading = true
this.bu6Service.getList().subscribe({ this.bu6Service.getList().subscribe({
next: response => { next: response => {
this.bu6List = response.map(x => new MyBu6Model(x)) this.bu6List = response.map(x => ({ check: false, data: new MyBu6Model(x) }))
this.bu6ListLoading = false this.bu6ListLoading = false
this.onBu6TableSearchChange() this.onBu6TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.cdr.detectChanges() this.cdr.detectChanges()
}, error: error => { }, error: error => {
this.bu6ListLoading = false this.bu6ListLoading = false
...@@ -118,11 +124,15 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -118,11 +124,15 @@ export class SubDepartmentThreeComponent implements OnInit {
onBu6TableSearchChange() { onBu6TableSearchChange() {
this.bu6Table.currentPage = 1 this.bu6Table.currentPage = 1
this.bu6Table.page = Array.from({ length: Math.ceil(this.filterBu6Table().length / 10) }, (_, i) => i + 1); this.bu6Table.page = Array.from({ length: Math.ceil(this.filterBu6Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu6Table() { filterBu6Table() {
return this.bu6List.filter(x => x.bu6id.toLowerCase().includes(this.bu6Table.search.toLowerCase()) || return this.bu6List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu6Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu6Table.search.toLowerCase())) return data.bu6id.toLowerCase().includes(this.bu6Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu6Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu6Table.search.toLowerCase())
})
} }
selectBu6(bu6?: Bu6Model) { selectBu6(bu6?: Bu6Model) {
this.bu6 = new MyBu6Model(bu6) this.bu6 = new MyBu6Model(bu6)
...@@ -134,18 +144,17 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -134,18 +144,17 @@ export class SubDepartmentThreeComponent implements OnInit {
}) })
} }
} }
bu6idChange() {
const bu6 = this.bu6List.find(x => x.bu6id == this.bu6.bu6id)
this.selectBu6(bu6 || new MyBu6Model({ bu6id: this.bu6.bu6id }))
}
onBu6ModalSearchChange() { onBu6ModalSearchChange() {
this.bu6Modal.currentPage = 1 this.bu6Modal.currentPage = 1
this.bu6Modal.page = Array.from({ length: Math.ceil(this.filterBu6Modal().length / 10) }, (_, i) => i + 1); this.bu6Modal.page = Array.from({ length: Math.ceil(this.filterBu6Modal().length / 10) }, (_, i) => i + 1);
} }
filterBu6Modal() { filterBu6Modal() {
return this.bu6List.filter(x => x.bu6id.toLowerCase().includes(this.bu6Modal.search.toLowerCase()) || return this.bu6List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu6Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu6Modal.search.toLowerCase())) return data.bu6id.toLowerCase().includes(this.bu6Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu6Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu6Table.search.toLowerCase())
})
} }
addBu6() { addBu6() {
this.bu6ListLoading = true this.bu6ListLoading = true
...@@ -166,7 +175,8 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -166,7 +175,8 @@ export class SubDepartmentThreeComponent implements OnInit {
} }
deleteBu6() { deleteBu6() {
this.bu6ListLoading = true this.bu6ListLoading = true
this.bu6Service.delete(this.bu6).subscribe({ const body = this.bu6List.filter(x => x.check).map(x => new MyBu6Model(x.data))
this.bu6Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -211,6 +221,19 @@ export class SubDepartmentThreeComponent implements OnInit { ...@@ -211,6 +221,19 @@ export class SubDepartmentThreeComponent implements OnInit {
positionClass: 'toast-top-right', positionClass: 'toast-top-right',
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu6Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu6Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu6List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/branch-business-unit/sub-department-two/sub-department-two.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex pr-2"> <div class="flex">
<div class="px-1"> <div class="flex items-center">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
data-hs-overlay="#sub-department-two-upload-modal" [(ngModel)]="isDataListChecked">
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'"> <label for="hs-default-checkbox" class="text-sm text-gray-500 mx-2 pointer-events-none">
<i class="ri-add-line"></i> {{numDataListChecked}} Selected</label>
นำเข้าข้อมูล </div>
<div class="mx-1 flex items-center">
<button (click)="isDataListCheckedAll = !isDataListCheckedAll;dataListCheckAll()" id='check-boxall'
class="focus:ring-2 focus:ring-primary rounded-sm flex item-center">
<i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end" <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -28,6 +30,15 @@ ...@@ -28,6 +30,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#sub-department-two-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="currentModal='add';selectBu4();selectBu5()" (click)="currentModal='add';selectBu4();selectBu5()"
data-hs-overlay="#sub-department-two-modal-add"> data-hs-overlay="#sub-department-two-modal-add">
...@@ -35,11 +46,18 @@ ...@@ -35,11 +46,18 @@
Add Add
</button> </button>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-info h-45px m-0 shadow-md">
<i class="ri-printer-line"></i> <i class="ri-printer-line"></i>
Print Print
</button> </button>
</div> -->
<div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-danger h-45px m-0 shadow-md"
data-hs-overlay="#sub-department-two-alert-delete-modal">
<i class="ri-delete-bin-6-line"></i>
Delete
</button>
</div> </div>
<!-- <div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
...@@ -56,10 +74,10 @@ ...@@ -56,10 +74,10 @@
<thead> <thead>
<tr> <tr>
<ng-container <ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย2','รายละเอียดส่วนย่อย2 (ไทย)','รายละเอียดส่วนย่อย2 (อังกฤษ)','การจัดการ']; let f = first; let l = last"> *ngFor="let item of ['','รหัสส่วนย่อย2','รายละเอียดส่วนย่อย2 (ไทย)','รายละเอียดส่วนย่อย2 (อังกฤษ)','การจัดการ']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary !text-center"> <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> <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"> <div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!f&&!l">
<i class="ti ti-dots-vertical fs-l"></i> <i class="ti ti-dots-vertical fs-l"></i>
</div> </div>
</th> </th>
...@@ -86,15 +104,16 @@ ...@@ -86,15 +104,16 @@
<tbody *ngIf="!bu5ListLoading&&filterBu5Table().length"> <tbody *ngIf="!bu5ListLoading&&filterBu5Table().length">
<tr <tr
*ngFor="let item of filterBu5Table() | slice:((bu5Table.currentPage-1) * 10) : (((bu5Table.currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of filterBu5Table() | slice:((bu5Table.currentPage-1) * 10) : (((bu5Table.currentPage-1) * 10) + 10);let i = index">
<td class="text-center"> <td td class="text-center">
{{((bu5Table.currentPage-1) * 10)+(i+1)}} <input type="checkbox" class="ti-form-checkbox cursor-pointer" id="checkbox-{{item.data.bu5id}}"
[(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center">{{item.bu5id}}</td> <td class="text-center">{{item.data.bu5id}}</td>
<td>{{item.tdesc}}</td> <td>{{item.data.tdesc}}</td>
<td>{{item.edesc}}</td> <td>{{item.data.edesc}}</td>
<td class="flex justify-center"> <td class="flex justify-center">
<i class="ti ti-edit cursor-pointer i-gray fs-l px-1" <i class="ti ti-edit cursor-pointer i-gray fs-l px-1"
(click)="selectBu5(item);currentModal='edit'" (click)="selectBu5(item.data);currentModal='edit'"
data-hs-overlay="#sub-department-two-modal-edit"></i> data-hs-overlay="#sub-department-two-modal-edit"></i>
<!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1" <!-- <i class="ti ti-trash cursor-pointer i-gray fs-l px-1"
(click)="currentModal='delete';selectBu5(item)" (click)="currentModal='delete';selectBu5(item)"
...@@ -190,9 +209,8 @@ ...@@ -190,9 +209,8 @@
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
name="hs-leading-button-add-on-with-icon-and-button" name="hs-leading-button-add-on-with-icon-and-button"
class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" readonly
readonly style="padding-right: 3.5rem;" [(ngModel)]="bu4.bu4id" style="padding-right: 3.5rem;" [(ngModel)]="bu4.bu4id" (ngModelChange)="bu4idChange()">
(ngModelChange)="bu4idChange()">
<div <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"> 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)="selectBu4()"> <button type="button" class="flex items-center text-red-500" (click)="selectBu4()">
...@@ -227,7 +245,8 @@ ...@@ -227,7 +245,8 @@
</button> </button>
</div> --> </div> -->
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu5.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu5.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu5.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu5.edesc">
...@@ -293,14 +312,14 @@ ...@@ -293,14 +312,14 @@
</div> </div>
</div> </div>
<div class="ti-modal-body"> <div class="ti-modal-body">
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span class="text-danger">*</span></label> <label for="hs-trailing-button-add-on-with-icon" class="ti-form-label">อยู่ภายใต้หน่วยงาน<span
class="text-danger">*</span></label>
<div class="flex"> <div class="flex">
<div class="relative flex rounded-md"> <div class="relative flex rounded-md">
<input type="text" id="hs-leading-button-add-on-with-icon-and-button" <input type="text" id="hs-leading-button-add-on-with-icon-and-button"
name="hs-leading-button-add-on-with-icon-and-button" name="hs-leading-button-add-on-with-icon-and-button"
class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" class="ti-form-input rounded-sm ltr:rounded-r-sm rtl:rounded-l-sm focus:z-10" readonly
readonly style="padding-right: 3.5rem;" [(ngModel)]="bu4.bu4id" style="padding-right: 3.5rem;" [(ngModel)]="bu4.bu4id" (ngModelChange)="bu4idChange()">
(ngModelChange)="bu4idChange()">
<div <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"> 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)="selectBu4()"> <button type="button" class="flex items-center text-red-500" (click)="selectBu4()">
...@@ -317,14 +336,16 @@ ...@@ -317,14 +336,16 @@
readonly [value]="bu4.tdesc"> readonly [value]="bu4.tdesc">
</div> </div>
</div> </div>
<label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย2<span class="text-danger">*</span></label> <label for="input-label" class="ti-form-label mt-2rem">ส่วนย่อย2<span
class="text-danger">*</span></label>
<div class="sm:grid grid-cols-2 gap-1"> <div class="sm:grid grid-cols-2 gap-1">
<div class="relative w-full"> <div class="relative w-full">
<input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly" <input type="text" id="input-label" class="ti-form-input w-full pr-10 bg-input-readonly"
readonly [value]="bu5.bu5id"> readonly [value]="bu5.bu5id">
</div> </div>
</div> </div>
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu5.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="bu5.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียดส่วนย่อย2 (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu5.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="bu5.edesc">
...@@ -474,106 +495,6 @@ ...@@ -474,106 +495,6 @@
</div> </div>
</div> </div>
<div id="sub-department-two-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">
ข้อมูลทะเบียนส่วนย่อย 2
</h3>
<div class="flex justify-end">
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-two-modal-add">
<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)]="bu5Modal.search"
(ngModelChange)="onBu5ModalSearchChange()">
<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="overflow-auto border">
<table class="ti-custom-table ti-custom-table-head ti-custom-table-hover">
<thead>
<tr>
<ng-container
*ngFor="let item of ['ลำดับ','รหัสส่วนย่อย2','รายละเอียดส่วนย่อย2 (ไทย)','รายละเอียดส่วนย่อย2 (อังกฤษ)']; let f = first; let l = last">
<th scope="col" class="relative px-10px py-10px bg-soft-secondary text-primary"
[class.!text-center]="f">
<span class="text-sm">{{ item }}</span>
<div class="absolute top-1/2 transform -translate-y-1/2 right-0" *ngIf="!l">
<i class="ti ti-dots-vertical fs-l"></i>
</div>
</th>
</ng-container>
</tr>
</thead>
<tbody *ngIf="!filterBu5Modal().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="filterBu5Modal().length">
<tr *ngFor="let item of filterBu5Modal() | slice:((bu5Modal.currentPage-1) * 10) : (((bu5Modal.currentPage-1) * 10) + 10);let i = index"
class="cursor-pointer" (click)="selectBu5(item)"
data-hs-overlay="#sub-department-two-modal-add">
<td class="flex justify-center">
{{((bu5Modal.currentPage-1) * 10)+(i+1)}}
</td>
<td>{{item.bu5id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="bu5Modal.page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu5Modal.currentPage = (bu5Modal.currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of bu5Modal.page">
<a class="page-link" href="javascript:void(0);" [class.active]="item==bu5Modal.currentPage"
(click)="bu5Modal.currentPage=item">{{item}}
</a>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="bu5Modal.currentPage = (bu5Modal.currentPage > bu5Modal.page.length-1 ? bu5Modal.currentPage: bu5Modal.currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
</nav>
<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-department-two-modal-add">
ย้อนกลับ
</button>
</div>
</div>
</div>
</div>
</div>
<div id="sub-department-two-alert-add-modal" class="hs-overlay hidden ti-modal"> <div id="sub-department-two-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="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="max-h-full overflow-hidden ti-modal-content w-full">
...@@ -700,6 +621,11 @@ ...@@ -700,6 +621,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()" <button type="submit" class="ti-btn ti-btn-secondary" (click)="uploadFile()"
data-hs-overlay="#sub-department-two-upload-modal" [class.ti-btn-disabled]="!selectedFile" data-hs-overlay="#sub-department-two-upload-modal" [class.ti-btn-disabled]="!selectedFile"
......
src/app/components/company-components/company-registration/branch-business-unit/sub-department-two/sub-department-two.component.ts
...@@ -16,7 +16,7 @@ interface table { ...@@ -16,7 +16,7 @@ interface table {
styleUrls: ['./sub-department-two.component.scss'] styleUrls: ['./sub-department-two.component.scss']
}) })
export class SubDepartmentTwoComponent implements OnInit { export class SubDepartmentTwoComponent implements OnInit {
bu5List: Bu5Model[] = [] bu5List: { check: boolean, data: Bu5Model }[] = []
bu5ListLoading = false bu5ListLoading = false
bu5: Bu5Model = new MyBu5Model() bu5: Bu5Model = new MyBu5Model()
bu5Table: table = { bu5Table: table = {
...@@ -41,6 +41,11 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -41,6 +41,11 @@ export class SubDepartmentTwoComponent implements OnInit {
search: "" search: ""
} }
currentModal: 'add' | 'edit' | 'delete' = "add" currentModal: 'add' | 'edit' | 'delete' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
constructor(private bu5Service: Bu5Service, constructor(private bu5Service: Bu5Service,
private bu4Service: Bu4Service, private bu4Service: Bu4Service,
private toastr: ToastrService, private toastr: ToastrService,
...@@ -104,9 +109,11 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -104,9 +109,11 @@ export class SubDepartmentTwoComponent implements OnInit {
this.bu5ListLoading = true this.bu5ListLoading = true
this.bu5Service.getList().subscribe({ this.bu5Service.getList().subscribe({
next: response => { next: response => {
this.bu5List = response.map(x => new MyBu5Model(x)) this.bu5List = response.map(x => ({ check: false, data: new MyBu5Model(x) }))
this.bu5ListLoading = false this.bu5ListLoading = false
this.onBu5TableSearchChange() this.onBu5TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.cdr.detectChanges() this.cdr.detectChanges()
}, error: error => { }, error: error => {
this.bu5ListLoading = false this.bu5ListLoading = false
...@@ -117,11 +124,15 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -117,11 +124,15 @@ export class SubDepartmentTwoComponent implements OnInit {
onBu5TableSearchChange() { onBu5TableSearchChange() {
this.bu5Table.currentPage = 1 this.bu5Table.currentPage = 1
this.bu5Table.page = Array.from({ length: Math.ceil(this.filterBu5Table().length / 10) }, (_, i) => i + 1); this.bu5Table.page = Array.from({ length: Math.ceil(this.filterBu5Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
} }
filterBu5Table() { filterBu5Table() {
return this.bu5List.filter(x => x.bu5id.toLowerCase().includes(this.bu5Table.search.toLowerCase()) || return this.bu5List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu5Table.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu5Table.search.toLowerCase())) return data.bu5id.toLowerCase().includes(this.bu5Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu5Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu5Table.search.toLowerCase())
})
} }
selectBu5(bu5?: Bu5Model) { selectBu5(bu5?: Bu5Model) {
this.bu5 = new MyBu5Model(bu5 || {}) this.bu5 = new MyBu5Model(bu5 || {})
...@@ -133,18 +144,17 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -133,18 +144,17 @@ export class SubDepartmentTwoComponent implements OnInit {
}) })
} }
} }
bu5idChange() {
const bu5 = this.bu5List.find(x => x.bu5id == this.bu5.bu5id)
this.selectBu5(bu5 || new MyBu5Model({ bu5id: this.bu5.bu5id }))
}
onBu5ModalSearchChange() { onBu5ModalSearchChange() {
this.bu5Modal.currentPage = 1 this.bu5Modal.currentPage = 1
this.bu5Modal.page = Array.from({ length: Math.ceil(this.filterBu5Modal().length / 10) }, (_, i) => i + 1); this.bu5Modal.page = Array.from({ length: Math.ceil(this.filterBu5Modal().length / 10) }, (_, i) => i + 1);
} }
filterBu5Modal() { filterBu5Modal() {
return this.bu5List.filter(x => x.bu5id.toLowerCase().includes(this.bu5Modal.search.toLowerCase()) || return this.bu5List.filter(x => {
x.tdesc.toLowerCase().includes(this.bu5Modal.search.toLowerCase()) || const data = x.data
x.edesc.toLowerCase().includes(this.bu5Modal.search.toLowerCase())) return data.bu5id.toLowerCase().includes(this.bu5Table.search.toLowerCase()) ||
data.tdesc.toLowerCase().includes(this.bu5Table.search.toLowerCase()) ||
data.edesc.toLowerCase().includes(this.bu5Table.search.toLowerCase())
})
} }
addBu5() { addBu5() {
this.bu5ListLoading = true this.bu5ListLoading = true
...@@ -165,7 +175,8 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -165,7 +175,8 @@ export class SubDepartmentTwoComponent implements OnInit {
} }
deleteBu5() { deleteBu5() {
this.bu5ListLoading = true this.bu5ListLoading = true
this.bu5Service.delete(this.bu5).subscribe({ const body = this.bu5List.filter(x => x.check).map(x => new MyBu5Model(x.data))
this.bu5Service.delete(body).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -210,5 +221,18 @@ export class SubDepartmentTwoComponent implements OnInit { ...@@ -210,5 +221,18 @@ export class SubDepartmentTwoComponent implements OnInit {
positionClass: 'toast-top-right', positionClass: 'toast-top-right',
}) })
} }
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu5Table().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.filterBu5Table();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.bu5List.filter(x => x.check).length
this.isDataListChecked = Boolean(this.numDataListChecked)
}
} }
src/app/components/company-components/company-registration/company-registration-page/company-registration-page.component.html
<div class="w-full min-height-50px mb-10px justify-between items-center"> <div class="w-full min-height-50px mb-10px justify-between items-center">
<div class="flex pr-2 pb-2rem"> <div class="flex justify-between">
<div class="flex"> <div class="flex">
<div class="flex items-center"> <div class="flex items-center">
<input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox" <input type="checkbox" class="ti-form-checkbox pointer-events-none" id="hs-default-checkbox"
...@@ -13,23 +13,7 @@ ...@@ -13,23 +13,7 @@
<i class="fs-l transition-all duration-200" <i class="fs-l transition-all duration-200"
[ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i> [ngClass]="{'ri-checkbox-multiple-line text-gray-500': !isDataListCheckedAll, 'ri-checkbox-multiple-fill text-primary': isDataListCheckedAll}"></i>
</button> </button>
<label class="text-sm text-gray-500 ml-2" for="check-boxall" >Select All</label> <label class="text-sm text-gray-500 ml-2" for="check-boxall">Select All</label>
</div>
</div>
</div>
<div class="flex justify-between">
<div class="flex pr-2">
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-20px m-0 shadow-md"
data-hs-overlay="#company-registration-page-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ri-add-line"></i>
นำเข้าข้อมูล
</button>
<a class="mx-2 justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px text-center text-secondary border-secondary border-b-2 align-items-end"
href="javascript:void(0);" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์
</a>
</div> </div>
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
...@@ -44,6 +28,15 @@ ...@@ -44,6 +28,15 @@
</div> </div>
</div> </div>
<div class="px-1"> <div class="px-1">
<button type="button"
class=" h-45px ti-btn ti-btn bg-pink-500/10 text-pink-500 hover:text-white hover:bg-pink-500 ring-offset-white focus:ring-pink-500 dark:focus:ring-offset-white/10 h-10 m-0 shadow-md"
data-hs-overlay="#company-registration-page-upload-modal"
(click)="fileInput.value = '';selectedFile=null;selectedFileName = 'กรุณาเลือกไฟล์'">
<i class="ti ti-file-plus"></i>
import
</button>
</div>
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md" <button type="button" class="ti-btn ti-btn-soft-secondary h-45px m-0 shadow-md"
(click)="modalStatus='add';setData()" data-hs-overlay="#company-registration-page-modal"> (click)="modalStatus='add';setData()" data-hs-overlay="#company-registration-page-modal">
<i class="ri-add-line"></i> <i class="ri-add-line"></i>
...@@ -109,7 +102,7 @@ ...@@ -109,7 +102,7 @@
id="checkbox-{{item.data.code}}" [(ngModel)]="item.check" (ngModelChange)="dataListCheck()"> id="checkbox-{{item.data.code}}" [(ngModel)]="item.check" (ngModelChange)="dataListCheck()">
</td> </td>
<td class="text-center"> <td class="text-center">
<label for="checkbox-{{item.data.code}}">&nbsp;{{item.data.code}}</label> <label for="checkbox-{{item.data.code}}">&nbsp;{{item.data.code}}</label>
</td> </td>
<td>{{item.data.tdesc}}</td> <td>{{item.data.tdesc}}</td>
...@@ -211,11 +204,13 @@ ...@@ -211,11 +204,13 @@
</div> </div>
</div> </div>
<div class="ti-modal-body padding-16px pt-0 overflow-y-0"> <div class="ti-modal-body padding-16px pt-0 overflow-y-0">
<label for="input-label" class="ti-form-label mt-2rem">รหัสบริษัท<span class="text-danger">*</span></label> <label for="input-label" class="ti-form-label mt-2rem">รหัสบริษัท<span
class="text-danger">*</span></label>
<input type="text" id="input-label" class="ti-form-input w-1/2" <input type="text" id="input-label" class="ti-form-input w-1/2"
[ngClass]="{'bg-input-readonly':modalStatus=='edit'}" [readonly]="modalStatus=='edit'" [ngClass]="{'bg-input-readonly':modalStatus=='edit'}" [readonly]="modalStatus=='edit'"
[(ngModel)]="dataSelect.code" [maxLength]="5"> [(ngModel)]="dataSelect.code" [maxLength]="5">
<label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span class="text-danger">*</span></label> <label for="detail_th" class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span
class="text-danger">*</span></label>
<input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="dataSelect.tdesc"> <input type="text" id="detail_th" class="ti-form-input h-16" [(ngModel)]="dataSelect.tdesc">
<label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label> <label for="detail_eng" class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label>
<input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="dataSelect.edesc"> <input type="text" id="detail_eng" class="ti-form-input h-16" [(ngModel)]="dataSelect.edesc">
...@@ -323,6 +318,11 @@ ...@@ -323,6 +318,11 @@
<i class="ti ti-upload"></i> <i class="ti ti-upload"></i>
</button> </button>
</div> </div>
<div class="flex justify-center mt-2rem ">
<h1 class="cursor-pointer justify-center -mb-px inline-flex items-center gap-2 font-weight-500 font-size-12px
text-center text-secondary border-secondary border-b-2 align-items-end" (click)="downloadFile()">
ดาวน์โหลดตัวอย่างไฟล์</h1>
</div>
<div class="flex justify-center mt-2rem mb-1rem space-x-4"> <div class="flex justify-center mt-2rem mb-1rem space-x-4">
<button type="submit" class="ti-btn ti-btn-secondary" <button type="submit" class="ti-btn ti-btn-secondary"
data-hs-overlay="#company-registration-page-upload-modal" data-hs-overlay="#company-registration-page-upload-modal"
......
src/app/components/company-components/company-registration/company-registration.component.html
...@@ -17,8 +17,8 @@ ...@@ -17,8 +17,8 @@
<a class="font-size-16px font-weight-500 hs-tab-active:font-weight-700 hs-tab-active:border-secondary hs-tab-active:text-secondary pb-3 px-1 inline-flex items-center gap-2 border-b-[3px] border-transparent whitespace-nowrap text-gray-500 hover:text-secondary" <a class="font-size-16px font-weight-500 hs-tab-active:font-weight-700 hs-tab-active:border-secondary hs-tab-active:text-secondary pb-3 px-1 inline-flex items-center gap-2 border-b-[3px] border-transparent whitespace-nowrap text-gray-500 hover:text-secondary"
href="javascript:void(0);" id="underline-item-2" data-hs-tab="#underline-2" href="javascript:void(0);" id="underline-item-2" data-hs-tab="#underline-2"
aria-controls="underline-2" aria-controls="underline-2"
(click)="pathTitle = ['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท','สาขาและหน่วยธุรกิจ' ,'ทะเบียนฝ่าย'];currentPath=2"> (click)="pathTitle = ['การจัดการข้อมูลองค์กร', 'ทะเบียนบริษัท','หน่วยธุรกิจ' ,'ทะเบียนฝ่าย'];currentPath=2">
สาขาและหน่วยธุรกิจ หน่วยธุรกิจ
</a> </a>
</nav> </nav>
</div> </div>
......
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.html
...@@ -259,7 +259,8 @@ ...@@ -259,7 +259,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-empgroup-table-modal"
(click)="modal.search='';searchModalChange(empGroupListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -310,7 +311,8 @@ ...@@ -310,7 +311,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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=''"> data-hs-overlay="#sub-employee-registration-emp-table-modal"
(click)="modal.search='';searchModalChange(employeeModalListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -333,7 +335,8 @@ ...@@ -333,7 +335,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu1-table-modal"
(click)="modal.search='';searchModalChange(bu1ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -356,7 +359,8 @@ ...@@ -356,7 +359,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu2-table-modal"
(click)="modal.search='';searchModalChange(bu2ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -379,7 +383,8 @@ ...@@ -379,7 +383,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu3-table-modal"
(click)="modal.search='';searchModalChange(bu3ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -402,7 +407,8 @@ ...@@ -402,7 +407,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu4-table-modal"
(click)="modal.search='';searchModalChange(bu4ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -425,7 +431,8 @@ ...@@ -425,7 +431,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu5-table-modal"
(click)="modal.search='';searchModalChange(bu5ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -447,7 +454,8 @@ ...@@ -447,7 +454,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu6-table-modal"
(click)="modal.search='';searchModalChange(bu6ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -469,7 +477,8 @@ ...@@ -469,7 +477,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <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.search=''"> data-hs-overlay="#sub-employee-registration-bu7-table-modal"
(click)="modal.search='';searchModalChange(bu7ListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -492,7 +501,8 @@ ...@@ -492,7 +501,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-position-table-modal" (click)="modal.search=''"> data-hs-overlay="#sub-employee-registration-position-table-modal"
(click)="modal.search='';searchModalChange(positionListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -515,7 +525,8 @@ ...@@ -515,7 +525,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-jobcode-table-modal" (click)="modal.search=''"> data-hs-overlay="#sub-employee-registration-jobcode-table-modal"
(click)="modal.search='';searchModalChange(jobcodeListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -538,7 +549,8 @@ ...@@ -538,7 +549,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-branch-table-modal" (click)="modal.search=''"> data-hs-overlay="#sub-employee-registration-branch-table-modal"
(click)="modal.search='';searchModalChange(branchListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -561,7 +573,8 @@ ...@@ -561,7 +573,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-emptype-table-modal" (click)="modal.search=''"> data-hs-overlay="#sub-employee-registration-emptype-table-modal"
(click)="modal.search='';searchModalChange(empTypeListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
...@@ -584,7 +597,8 @@ ...@@ -584,7 +597,8 @@
<i class="ti ti-circle-x cursor-pointer"></i> <i class="ti ti-circle-x cursor-pointer"></i>
</button> </button>
<button type="button" class="flex items-center text-gray-500 dark:text-white/70" <button type="button" class="flex items-center text-gray-500 dark:text-white/70"
data-hs-overlay="#sub-employee-registration-pl-table-modal" (click)="modal.search=''"> data-hs-overlay="#sub-employee-registration-pl-table-modal"
(click)="modal.search='';searchModalChange(plListFilter())">
<i class="ri-search-line cursor-pointer text-gray"></i> <i class="ri-search-line cursor-pointer text-gray"></i>
</button> </button>
</div> </div>
......
src/app/components/company-components/employee-registration/sub-employee-registration/sub-employee-registration.component.ts
...@@ -448,7 +448,7 @@ export class SubEmployeeRegistrationComponent { ...@@ -448,7 +448,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.employeeModal.dataList = response.filter(x => x.employeeId != this.decodeJWT(sessionStorage.getItem("accessToken") || '').employeeid).map((x: any) => new MyEmployeeModel(x))
this.employee.loading = false this.employee.loading = false
this.isDataListCheckedAll = false this.isDataListCheckedAll = false
this.dataListCheckAll() this.dataListCheckAll()
...@@ -462,8 +462,8 @@ export class SubEmployeeRegistrationComponent { ...@@ -462,8 +462,8 @@ export class SubEmployeeRegistrationComponent {
} }
employeeModalListFilter() { employeeModalListFilter() {
return this.employeeModal.dataList.filter(x => x.employeeId.toLowerCase().includes(this.modal.search.toLowerCase()) || return this.employeeModal.dataList.filter(x => x.employeeId.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.fname.toLowerCase().includes(this.search.toLowerCase()) || x.fname.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.lname.toLowerCase().includes(this.search.toLowerCase()) || x.lname.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.position.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) || x.position.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()) ||
x.jobCode.tdesc.toLowerCase().includes(this.modal.search.toLowerCase())) x.jobCode.tdesc.toLowerCase().includes(this.modal.search.toLowerCase()))
} }
......
src/app/components/competency-assessment/grade-registration/grade-management/grade-management.component.ts
...@@ -10,6 +10,7 @@ export interface DataModel { ...@@ -10,6 +10,7 @@ export interface DataModel {
tdesc: string; tdesc: string;
edesc: string; edesc: string;
competencyGrades: CompetencyGradeModel[] competencyGrades: CompetencyGradeModel[]
companyId: string
} }
@Component({ @Component({
...@@ -29,7 +30,7 @@ export class GradeManagementComponent { ...@@ -29,7 +30,7 @@ export class GradeManagementComponent {
dataList: DataModel[] = []; dataList: DataModel[] = [];
dataLoading = false dataLoading = false
dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] } dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
constructor(private toastr: ToastrService, constructor(private toastr: ToastrService,
private competencyGroupGradeService: CompetencyGroupGradeService, private competencyGroupGradeService: CompetencyGroupGradeService,
...@@ -40,13 +41,13 @@ export class GradeManagementComponent { ...@@ -40,13 +41,13 @@ export class GradeManagementComponent {
this.getCompetencyGroupGradeList() this.getCompetencyGroupGradeList()
} }
selectData(data?: DataModel) { selectData(data?: DataModel) {
this.dataSelect = JSON.parse(JSON.stringify(data || { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] })) this.dataSelect = JSON.parse(JSON.stringify(data || { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }))
} }
getCompetencyGroupGradeList() { getCompetencyGroupGradeList() {
this.dataLoading = true this.dataLoading = true
this.competencyGroupGradeService.getList().subscribe({ this.competencyGroupGradeService.getList().subscribe({
next: response => { next: response => {
this.dataList = response.map(x => ({ check: false, code: x.groupGradeId, tdesc: x.tdesc, edesc: x.edesc, competencyGrades: x.competencyGrades })) this.dataList = response.map(x => ({ check: false, code: x.groupGradeId, tdesc: x.tdesc, edesc: x.edesc, competencyGrades: x.competencyGrades, companyId: x.companyId }))
this.isDataListCheckedAll = false this.isDataListCheckedAll = false
this.dataListCheckAll() this.dataListCheckAll()
this.searchChange() this.searchChange()
...@@ -97,7 +98,7 @@ export class GradeManagementComponent { ...@@ -97,7 +98,7 @@ export class GradeManagementComponent {
} }
deleteCompetencyGroupGradeList() { deleteCompetencyGroupGradeList() {
const body = this.dataSelect.code ? new MyCompetencyGroupGradeModel({ groupGradeId: this.dataSelect.code, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc }) : this.dataList.filter(x => x.check).map(x => new MyCompetencyGroupGradeModel({ groupGradeId: x.code, tdesc: x.tdesc, edesc: x.edesc })) const body = this.dataSelect.code ? new MyCompetencyGroupGradeModel({ groupGradeId: this.dataSelect.code, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc, companyId: this.dataSelect.companyId }) : this.dataList.filter(x => x.check).map(x => new MyCompetencyGroupGradeModel({ groupGradeId: x.code, tdesc: x.tdesc, edesc: x.edesc }))
this.dataLoading = true this.dataLoading = true
this.competencyGroupGradeService.delete(body).subscribe({ this.competencyGroupGradeService.delete(body).subscribe({
next: response => { next: response => {
......
src/app/components/competency-assessment/grade-registration/grade-management/group-grade/group-grade.component.ts
...@@ -9,6 +9,7 @@ export interface DataModel { ...@@ -9,6 +9,7 @@ export interface DataModel {
tdesc: string tdesc: string
edesc: string edesc: string
competencyGrades: CompetencyGradeModel[] competencyGrades: CompetencyGradeModel[]
companyId: string
} }
@Component({ @Component({
...@@ -19,22 +20,22 @@ export interface DataModel { ...@@ -19,22 +20,22 @@ export interface DataModel {
export class GroupGradeComponent implements OnInit { export class GroupGradeComponent implements OnInit {
@Output() sendBackTab: EventEmitter<undefined> = new EventEmitter<undefined>(); @Output() sendBackTab: EventEmitter<undefined> = new EventEmitter<undefined>();
@Input() typeTab: 'add' | 'edit' = 'add' @Input() typeTab: 'add' | 'edit' = 'add'
@Input() dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] } @Input() dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
dataOriginal: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] } dataOriginal: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
@Output() sendDataList: EventEmitter<DataModel[]> = new EventEmitter<DataModel[]>(); @Output() sendDataList: EventEmitter<DataModel[]> = new EventEmitter<DataModel[]>();
currentTab = 1 currentTab = 1
constructor(private toastr: ToastrService, constructor(private toastr: ToastrService,
private competencyGroupGradeService: CompetencyGroupGradeService, private competencyGroupGradeService: CompetencyGroupGradeService,
private cdr: ChangeDetectorRef) { } private cdr: ChangeDetectorRef) { }
ngOnInit(): void { ngOnInit(): void {
this.dataOriginal = JSON.parse(JSON.stringify(this.dataSelect || { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] })) this.dataOriginal = JSON.parse(JSON.stringify(this.dataSelect || { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }))
} }
clear() { clear() {
if (this.typeTab == 'add') { if (this.typeTab == 'add') {
this.dataSelect = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] } this.dataSelect = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
this.cdr.detectChanges() this.cdr.detectChanges()
} else if (this.typeTab == 'edit') { } else if (this.typeTab == 'edit') {
this.dataSelect = { check: false, code: this.dataOriginal.code, tdesc: '', edesc: '', competencyGrades: [] } this.dataSelect = { check: false, code: this.dataOriginal.code, tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
this.cdr.detectChanges() this.cdr.detectChanges()
} }
} }
...@@ -42,7 +43,7 @@ export class GroupGradeComponent implements OnInit { ...@@ -42,7 +43,7 @@ export class GroupGradeComponent implements OnInit {
this.sendBackTab.emit(); this.sendBackTab.emit();
} }
postCompetencyGroupGrade() { postCompetencyGroupGrade() {
this.competencyGroupGradeService.post(new MyCompetencyGroupGradeModel({ groupGradeId: this.dataSelect.code, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc, competencyGrades: this.dataSelect.competencyGrades })).subscribe({ this.competencyGroupGradeService.post(new MyCompetencyGroupGradeModel({ groupGradeId: this.dataSelect.code, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc, competencyGrades: this.dataSelect.competencyGrades, companyId: this.dataSelect.companyId })).subscribe({
next: response => { next: response => {
if (response.success) { if (response.success) {
this.showAlert(response.message, 'success') this.showAlert(response.message, 'success')
...@@ -58,7 +59,7 @@ export class GroupGradeComponent implements OnInit { ...@@ -58,7 +59,7 @@ export class GroupGradeComponent implements OnInit {
getCompetencyGroupGradeList() { getCompetencyGroupGradeList() {
this.competencyGroupGradeService.getList().subscribe({ this.competencyGroupGradeService.getList().subscribe({
next: response => { next: response => {
this.sendDataList.emit(response.map(x => ({ check: false, code: x.groupGradeId, tdesc: x.tdesc, edesc: x.edesc, competencyGrades: x.competencyGrades }))) this.sendDataList.emit(response.map(x => ({ check: false, code: x.groupGradeId, tdesc: x.tdesc, edesc: x.edesc, competencyGrades: x.competencyGrades, companyId: this.dataSelect.companyId })))
this.cdr.detectChanges() this.cdr.detectChanges()
} }
}) })
......
src/app/components/competency-assessment/grade-registration/grade-management/sub-grade-registration/sub-grade-registration.component.ts
...@@ -10,6 +10,7 @@ export interface DataModel { ...@@ -10,6 +10,7 @@ export interface DataModel {
tdesc: string tdesc: string
edesc: string edesc: string
competencyGrades: CompetencyGradeModel[] competencyGrades: CompetencyGradeModel[]
companyId: string
} }
@Component({ @Component({
...@@ -18,7 +19,7 @@ export interface DataModel { ...@@ -18,7 +19,7 @@ export interface DataModel {
styleUrls: ['./sub-grade-registration.component.scss'], styleUrls: ['./sub-grade-registration.component.scss'],
}) })
export class SubGradeRegistrationComponent { export class SubGradeRegistrationComponent {
@Input() dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [] } @Input() dataSelect: DataModel = { check: false, code: '', tdesc: '', edesc: '', competencyGrades: [], companyId: '' }
@Output() sendDataSelect: EventEmitter<DataModel> = new EventEmitter<DataModel>(); @Output() sendDataSelect: EventEmitter<DataModel> = new EventEmitter<DataModel>();
competencyGrade: { select: CompetencyGradeModel, dataList: { check: boolean, data: CompetencyGradeModel }[] } = { select: new MyCompetencyGradeModel({}), dataList: [] } competencyGrade: { select: CompetencyGradeModel, dataList: { check: boolean, data: CompetencyGradeModel }[] } = { select: new MyCompetencyGradeModel({}), dataList: [] }
currentPage = 1; currentPage = 1;
......
src/app/components/performance-evaluation/supervisor-evaluation/supervisor-evaluation.component.html
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-10 m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-10 m-0 shadow-md">
<i class="ti ti-book fs-l"></i> <i class="ti ti-book fs-l"></i>
Help Help
</button> </button>
</div> </div> -->
</div> </div>
</div> </div>
<div class="w-full min-height-50px justify-between items-center py-2"> <div class="w-full min-height-50px justify-between items-center py-2">
......
src/app/shared/services/bu1.service.ts
...@@ -21,7 +21,7 @@ export class Bu1Service { ...@@ -21,7 +21,7 @@ export class Bu1Service {
post(body: Bu1Model): Observable<AlertModel> { post(body: Bu1Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu1Model): Observable<AlertModel> { delete(body: Bu1Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu2.service.ts
...@@ -21,7 +21,7 @@ export class Bu2Service { ...@@ -21,7 +21,7 @@ export class Bu2Service {
post(body: Bu2Model): Observable<AlertModel> { post(body: Bu2Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu2Model): Observable<AlertModel> { delete(body: Bu2Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu3.service.ts
...@@ -21,7 +21,7 @@ import { AlertModel } from '../model/alert.model'; ...@@ -21,7 +21,7 @@ import { AlertModel } from '../model/alert.model';
post(body: Bu3Model): Observable<AlertModel> { post(body: Bu3Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu3Model): Observable<AlertModel> { delete(body: Bu3Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu4.service.ts
...@@ -21,7 +21,7 @@ export class Bu4Service { ...@@ -21,7 +21,7 @@ export class Bu4Service {
post(body: Bu4Model): Observable<AlertModel> { post(body: Bu4Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu4Model): Observable<AlertModel> { delete(body: Bu4Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu5.service.ts
...@@ -21,7 +21,7 @@ export class Bu5Service { ...@@ -21,7 +21,7 @@ export class Bu5Service {
post(body: Bu5Model): Observable<AlertModel> { post(body: Bu5Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu5Model): Observable<AlertModel> { delete(body: Bu5Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu6.service.ts
...@@ -21,7 +21,7 @@ export class Bu6Service { ...@@ -21,7 +21,7 @@ export class Bu6Service {
post(body: Bu6Model): Observable<AlertModel> { post(body: Bu6Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu6Model): Observable<AlertModel> { delete(body: Bu6Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
src/app/shared/services/bu7.service.ts
...@@ -21,7 +21,7 @@ export class Bu7Service { ...@@ -21,7 +21,7 @@ export class Bu7Service {
post(body: Bu7Model): Observable<AlertModel> { post(body: Bu7Model): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body) return this.http.post<AlertModel>(this.urlApi, body)
} }
delete(body: Bu7Model): Observable<AlertModel> { delete(body: Bu7Model[]): Observable<AlertModel> {
const options = { const options = {
headers: new HttpHeaders({ headers: new HttpHeaders({
"Content-Type": "application/json", "Content-Type": "application/json",
......
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