Skip to content

M
mySkill-x
Commit 348909e5 by Nattana Chaiyamat
Options

ส่วนย่อย3

parent d64e63f4
Showing with 80 additions and 143 deletions
src/app/components/company-components/company-registration/branch-business-unit/sub-department-three/sub-department-three.component.ts
import { ChangeDetectorRef, Component, EventEmitter, Input, OnInit } from '@angular/core';
import { ColumnModel } from '@syncfusion/ej2-grids';
import { ToastrService } from 'ngx-toastr';
import { Bu5Model, MyBu5Model } from 'src/app/shared/model/bu5.model';
import { Bu6Model, MyBu6Model } from 'src/app/shared/model/bu6.model';
......@@ -18,25 +19,12 @@ interface table {
styleUrls: ['./sub-department-three.component.scss']
})
export class SubDepartmentThreeComponent implements OnInit {
bu6List: { check: boolean, data: Bu6Model }[] = []
bu6ListLoading = false
bu6: Bu6Model = new MyBu6Model()
bu6Table: table = {
currentPage: 1,
page: Array.from({ length: 1 }, (_, i) => i + 1),
search: "",
pageSize: 10
}
bu6: { loading: boolean, select: Bu6Model, dataList: Bu6Model[] } = { loading: false, select: new MyBu6Model(), dataList: [] }
selectedFile: File | null = null;
selectedFileName: string = 'กรุณาเลือกไฟล์';
bu6Modal: table = {
currentPage: 1,
page: Array.from({ length: 1 }, (_, i) => i + 1),
search: "",
pageSize: 10
}
bu5List: Bu5Model[] = []
bu5: Bu5Model = new MyBu5Model()
bu5Modal: table = {
......@@ -47,9 +35,29 @@ export class SubDepartmentThreeComponent implements OnInit {
}
currentModal: 'add' | 'edit' | 'detele' = "add"
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
columns: ColumnModel[] = [{
field: "bu6id",
headerText: "รหัสฝ่าย",
type: "string",
isPrimaryKey: true,
},
{
field: "tdesc",
headerText: "รายละเอียดฝ่าย(ไทย)",
type: "string"
},
{
field: "edesc",
headerText: "รายละเอียดฝ่าย(อังกฤษ)",
type: "string"
}]
searchSettings = {
fields: ['bu6id', 'tdesc', 'edesc'],
operator: 'contains',
ignoreCase: false
};
search = ''
selectedItems: { key: string, count: number, data: Map<string, boolean> } = { key: '', count: 0, data: new Map<string, boolean>() };
constructor(private bu6Service: Bu6Service,
private bu5Service: Bu5Service,
private toastr: ToastrService,
......@@ -73,7 +81,7 @@ export class SubDepartmentThreeComponent implements OnInit {
}
const formData = new FormData();
formData.append('file', this.selectedFile);
this.bu6ListLoading = true
this.bu6.loading = true
this.fileService.uploadExcel(formData, 'mbu6').subscribe({
next: response => {
if (response.success) {
......@@ -81,11 +89,11 @@ export class SubDepartmentThreeComponent implements OnInit {
this.getBu6List()
} else {
this.showAlert(response.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
}, error: error => {
this.showAlert(error.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
})
}
......@@ -110,76 +118,63 @@ export class SubDepartmentThreeComponent implements OnInit {
}
getBu6List() {
this.bu6ListLoading = true
this.bu6.loading = true
this.selectedItems.data.clear()
this.bu6Service.getList().subscribe({
next: response => {
this.bu6List = response.map(x => ({ check: false, data: new MyBu6Model(x) }))
this.bu6ListLoading = false
this.onBu6TableSearchChange()
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.bu6.dataList = response.map(x => {
this.selectedItems.data.set(x.bu6id, false)
return new MyBu6Model(x)
})
this.selectedItems.key = 'bu6id'
this.selectedItems.count = 0
this.bu6.loading = false
this.cdr.detectChanges()
}, error: error => {
this.bu6ListLoading = false
this.bu6.loading = false
this.cdr.detectChanges()
}
})
}
onBu6TableSearchChange() {
this.bu6Table.currentPage = 1
this.bu6Table.page = Array.from({ length: Math.ceil(this.filterBu6Table().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
}
filterBu6Table() {
return this.bu6List.filter(x => {
const data = x.data
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) {
this.bu6 = new MyBu6Model(bu6)
if (bu6) {
this.bu6.select = new MyBu6Model(bu6)
} else if (this.currentModal == 'add') {
this.bu6.select = new MyBu6Model()
} else if (this.currentModal == 'edit') {
this.bu6.select = new MyBu6Model({ bu6id: this.bu6.select.bu6id })
}
this.selectBu5()
if (this.bu6.parent) {
this.bu5Service.getById(this.bu6.parent).subscribe(response => {
if (this.bu6.select.parent) {
this.bu5Service.getById(this.bu6.select.parent).subscribe(response => {
this.bu5 = new MyBu5Model(response)
this.cdr.detectChanges()
})
}
}
onBu6ModalSearchChange() {
this.bu6Modal.currentPage = 1
this.bu6Modal.page = Array.from({ length: Math.ceil(this.filterBu6Modal().length / 10) }, (_, i) => i + 1);
}
filterBu6Modal() {
return this.bu6List.filter(x => {
const data = x.data
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() {
this.bu6ListLoading = true
this.bu6Service.post({ ...this.bu6, parent: this.bu5.bu5id }).subscribe({
this.bu6.loading = true
this.bu6Service.post({ ...this.bu6.select, parent: this.bu5.bu5id }).subscribe({
next: response => {
if (response.success) {
this.showAlert(response.message, 'success')
this.getBu6List()
} else {
this.showAlert(response.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
}, error: error => {
this.showAlert(error.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
})
}
deleteBu6() {
this.bu6ListLoading = true
const body = this.bu6List.filter(x => x.check).map(x => new MyBu6Model(x.data))
this.bu6.loading = true
const selectedKeys = Array.from(this.selectedItems.data.keys());
const body = this.bu6.dataList.filter(x => selectedKeys.includes(x.bu6id) && this.selectedItems.data.get(x.bu6id)).map(x => new MyBu6Model(x))
this.bu6Service.delete(body).subscribe({
next: response => {
if (response.success) {
......@@ -187,11 +182,11 @@ export class SubDepartmentThreeComponent implements OnInit {
this.getBu6List()
} else {
this.showAlert(response.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
}, error: error => {
this.showAlert(error.message, 'error')
this.bu6ListLoading = false
this.bu6.loading = false
}
})
}
......@@ -226,21 +221,18 @@ export class SubDepartmentThreeComponent implements OnInit {
})
}
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.filterBu6Table().forEach(x => x.check = selectAll);
this.dataListCheck();
checkPrimary() {
return this.bu6.dataList.find(x => x.bu6id == this.bu6.select.bu6id)
}
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)
numSelectItem() {
const selectedKeys = Array.from(this.selectedItems.data.keys());
const num = this.bu6.dataList.filter(x => selectedKeys.includes(x.bu6id) && this.selectedItems.data.get(x.bu6id)).length
return num
}
checkPrimary() {
return this.bu6List.find(x => x.data.bu6id == this.bu6.bu6id)
onSelectItemChange(arg: any) {
this.selectedItems = arg
}
}
......
src/app/components/company-components/company-registration/branch-business-unit/sub-department-two/sub-department-two.component.html
......@@ -85,12 +85,6 @@
Clear
</button>
</div>
<!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i>
Help
</button>
</div> -->
</div>
</div>
<div class="ti-modal-body">
......@@ -125,7 +119,7 @@
</span>
</label>
<div class="relative flex rounded-md w-1/2">
<input type="text" class="ti-form-input h-16" [class.!bg-input-readonly]="currentModal=='edit'"
<input type="text" class="ti-form-input" [class.!bg-input-readonly]="currentModal=='edit'"
[readonly]="currentModal=='edit'" [class.!border-red]="currentModal=='add'&&checkPrimary()"
[(ngModel)]="bu5.select.bu5id">
</div>
......@@ -161,14 +155,7 @@
ข้อมูลทะเบียนส่วนย่อย 1
</h3>
<div class="flex justify-end">
<button *ngIf="currentModal=='add'" type="button"
class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-two-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
</button>
<button *ngIf="currentModal=='edit'" type="button"
class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
<button type="button" class="hs-dropdown-toggle ti-modal-clode-btn text-danger"
data-hs-overlay="#sub-department-two-modal">
<span class="sr-only">Close</span>
<i class="ti ti-circle-x fs-xxl"></i>
......@@ -214,66 +201,24 @@
</tr>
</tbody>
<tbody *ngIf="filterBu4Modal().length">
<ng-container *ngIf="currentModal=='add'">
<tr *ngFor="let item of filterBu4Modal() | slice:((bu4Modal.currentPage-1) * bu4Modal.pageSize) : (((bu4Modal.currentPage-1) * bu4Modal.pageSize) + bu4Modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu4(item)"
data-hs-overlay="#sub-department-two-modal">
<td class="flex justify-center">
{{((bu4Modal.currentPage-1) * bu4Modal.pageSize)+(i+1)}}
</td>
<td>{{item.bu4id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</ng-container>
<ng-container *ngIf="currentModal=='edit'">
<tr *ngFor="let item of filterBu4Modal() | slice:((bu4Modal.currentPage-1) * bu4Modal.pageSize) : (((bu4Modal.currentPage-1) * bu4Modal.pageSize) + bu4Modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu4(item)"
data-hs-overlay="#sub-department-two-modal">
<td class="flex justify-center">
{{((bu4Modal.currentPage-1) * bu4Modal.pageSize)+(i+1)}}
</td>
<td>{{item.bu4id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</ng-container>
<tr *ngFor="let item of filterBu4Modal() | slice:((bu4Modal.currentPage-1) * bu4Modal.pageSize) : (((bu4Modal.currentPage-1) * bu4Modal.pageSize) + bu4Modal.pageSize);let i = index"
class="cursor-pointer" (click)="selectBu4(item)"
data-hs-overlay="#sub-department-two-modal">
<td class="flex justify-center">
{{((bu4Modal.currentPage-1) * bu4Modal.pageSize)+(i+1)}}
</td>
<td>{{item.bu4id}}</td>
<td>{{item.tdesc}}</td>
<td>{{item.edesc}}</td>
</tr>
</tbody>
</table>
</div>
<app-pagination [totalItems]="filterBu4Modal().length" [pageSize]="bu4Modal.pageSize"
(pageChange)="bu4Modal.currentPage = $event"
(pageSizeChange)="bu4Modal.pageSize = $event;bu4Modal.currentPage = 1"></app-pagination>
<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" *ngIf="currentModal=='add'"
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">
ย้อนกลับ
</button>
<button type="button" *ngIf="currentModal=='edit'"
<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">
ย้อนกลับ
......
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