Commit 5eb9fdd9 by Nattana Chaiyamat

การจัดการข้อมูลองค์กร

ทะเบียนประเภทวัน
ข้อมูลประเภทวัน
parent b68096c3
......@@ -111,7 +111,7 @@
</ng-container>
</tr>
</thead>
<tbody *ngIf="dataLoading">
<tbody *ngIf="eventgrp.loading">
<tr>
<td class="text-center" colspan="100%">
<div *ngFor="let item of [1,2,3]" class="ti-spinner w-8 h-8 text-secondary mx-1"
......@@ -121,25 +121,25 @@
</td>
</tr>
</tbody>
<tbody *ngIf="!dataLoading&&!positionListFilter().length">
<tbody *ngIf="!eventgrp.loading&&!eventgrpListFilter().length">
<tr>
<td class="text-center" colspan="100%">
ไม่พบข้อมูล
</td>
</tr>
</tbody>
<tbody *ngIf="!dataLoading&&positionListFilter().length">
<tbody *ngIf="!eventgrp.loading&&eventgrpListFilter().length">
<tr
*ngFor="let item of positionListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
*ngFor="let item of eventgrpListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index">
<td class="text-center">
<input type="checkbox" class="ti-form-checkbox cursor-pointer"
id="checkbox-{{item.data.positionId}}" [(ngModel)]="item.check"
id="checkbox-{{item.data.eventgrpId}}" [(ngModel)]="item.check"
(ngModelChange)="dataListCheck()">
</td>
<td class="text-center">
<label
for="checkbox-{{item.data.positionId}}">&nbsp;{{item.data.positionId}}</label>
for="checkbox-{{item.data.eventgrpId}}">&nbsp;{{item.data.eventgrpId}}</label>
</td>
<td>{{item.data.tdesc}}</td>
<td>{{item.data.edesc}}</td>
......@@ -190,10 +190,10 @@
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * 10)+1}} to {{positionListFilter().length<10
?positionListFilter().length: (currentPage==page.length ? ((currentPage * 10) -
((currentPage * 10) - positionListFilter().length) ) :(currentPage * 10) ) }} of
{{positionListFilter().length}} items</span>
<span>Show {{((currentPage-1) * 10)+1}} to {{eventgrpListFilter().length<10
?eventgrpListFilter().length: (currentPage==page.length ? ((currentPage * 10) -
((currentPage * 10) - eventgrpListFilter().length) ) :(currentPage * 10) ) }} of
{{eventgrpListFilter().length}} items</span>
</ul>
</nav>
</div>
......@@ -223,7 +223,7 @@
<div class="absolute flex">
<div class="px-1">
<button type="button" class="ti-btn ti-btn-soft-indigo h-45px m-0 shadow-md"
(click)="clearPosition(modalStatus)">
(click)="clearEventgrp(modalStatus)">
<svg class="svg-indigo" width="16" height="16" viewBox="0 0 64.00 64.00"
xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#595BEA" stroke-width="3.84"
transform="rotate(45)matrix(-1, 0, 0, 1, 0, 0)">
......@@ -250,13 +250,42 @@
<div class="ti-modal-body padding-16px pt-0 overflow-y-0">
<label class="ti-form-label mt-2rem">รหัสประเภทวัน<span class="text-danger">*</span></label>
<input type="text" class="ti-form-input w-1/2" [ngClass]="{'bg-input-readonly':modalStatus=='edit'}"
[readonly]="modalStatus=='edit'" [(ngModel)]="dataSelect.positionId" [maxLength]="5">
[readonly]="modalStatus=='edit'" [(ngModel)]="eventgrp.select.eventgrpId" [maxLength]="5">
<label class="ti-form-label mt-2rem">รายละเอียด (ไทย)<span class="text-danger">*</span></label>
<input type="text" class="ti-form-input h-16" [(ngModel)]="dataSelect.tdesc">
<input type="text" class="ti-form-input h-16" [(ngModel)]="eventgrp.select.tdesc">
<label class="ti-form-label mt-2rem">รายละเอียด (อังกฤษ)</label>
<input type="text" class="ti-form-input h-16" [(ngModel)]="dataSelect.edesc">
<input type="text" class="ti-form-input h-16" [(ngModel)]="eventgrp.select.edesc">
<label class="ti-form-label mt-2rem">ประเภทวัน<span class="text-danger">*</span></label>
<input type="text" class="ti-form-input h-16" [(ngModel)]="dataSelect.edesc">
<div class="grid grid-cols-3 gap-2">
<div class="grid col-span-1 grid-cols-6 gap-2">
<div class="col-span-1">
<input type="checkbox" class="ti-form-checkbox" id="settingGroupAssessment-0"
[class.pointer-events-none]="eventgrp.select.event_status==0"
name="settingGroupAssessment" (change)="eventgrp.select.event_status=0"
[checked]="eventgrp.select.event_status==0">
</div>
<div class="col-span-5">
<label for="settingGroupAssessment-0" class="text-sm text-gray-500"
[class.pointer-events-none]="eventgrp.select.event_status==0">
ไม่ใช้งาน
</label>
</div>
</div>
<div class="grid col-span-1 grid-cols-6 gap-2">
<div class="col-span-1">
<input type="checkbox" class="ti-form-checkbox" id="settingGroupAssessment-1"
[class.pointer-events-none]="eventgrp.select.event_status ==1"
name="settingGroupAssessment" (change)="eventgrp.select.event_status=1"
[checked]="eventgrp.select.event_status ==1">
</div>
<div class="col-span-5">
<label for="settingGroupAssessment-1" class="text-sm text-gray-500"
[class.pointer-events-none]="eventgrp.select.event_status ==1">
ใช้งาน
</label>
</div>
</div>
</div>
<div class="flex justify-end mt-2rem mb-1rem">
<button type="button"
class="hs-dropdown-toggle ti-btn ti-border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:ring-offset-white focus:ring-primary dark:bg-bgdark dark:hover:bg-black/20 dark:border-white/10 dark:text-white/70 dark:hover:text-white dark:focus:ring-offset-white/10"
......@@ -264,8 +293,8 @@
ย้อนกลับ
</button>
<button type="button" class="ti-btn ti-btn-success" data-hs-overlay="#day-type-registry-alert-modal"
[class.ti-btn-disabled]="!dataSelect.positionId||!dataSelect.tdesc"
[disabled]="!dataSelect.positionId||!dataSelect.tdesc">
[class.ti-btn-disabled]="!eventgrp.select.eventgrpId||!eventgrp.select.tdesc"
[disabled]="!eventgrp.select.eventgrpId||!eventgrp.select.tdesc">
บันทึกข้อมูล
</button>
</div>
......@@ -316,7 +345,7 @@
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-success" href="javascript:void(0);"
data-hs-overlay="#day-type-registry-alert-modal" (click)="addPosition()">
data-hs-overlay="#day-type-registry-alert-modal" (click)="addEventgrp()">
บันทึกข้อมูล
</a>
</ng-container>
......@@ -327,7 +356,7 @@
ย้อนกลับ
</button>
<a class="ti-btn ti-btn-danger" href="javascript:void(0);"
data-hs-overlay="#day-type-registry-alert-modal" (click)="deletePosition()">
data-hs-overlay="#day-type-registry-alert-modal" (click)="deleteEventgrp()">
ลบข้อมูล
</a>
</ng-container>
......
import { ChangeDetectorRef, Component } from '@angular/core';
import { ToastrService } from 'ngx-toastr';
import { PositionModel, MyPositionModel } from 'src/app/shared/model/position.model';
import { EventgrpModel, MyEventgrpModel } from 'src/app/shared/model/eventgrp.model';
import { EventgrpService } from 'src/app/shared/services/eventgrp.service';
import { FileService } from 'src/app/shared/services/file.service';
import { PositionService } from 'src/app/shared/services/position.service';
export interface DataModel {
positionId: string
tdesc: string
edesc: string
consolidate: string
shortName: string
companyId: string
}
@Component({
selector: 'app-day-type-registry',
templateUrl: './day-type-registry.component.html',
......@@ -23,23 +15,22 @@ export class DayTypeRegistryComponent {
search = ""
selectedFile: File | null = null;
selectedFileName: string = 'กรุณาเลือกไฟล์';
modalStatus = 'add'
modalStatus: 'add' | 'edit' | 'delete' | 'deleteGroup' = 'add'
page = Array.from({ length: 1 }, (_, i) => i + 1);
positionList: { check: boolean, data: DataModel }[] = []
position: PositionModel = new MyPositionModel({})
dataLoading = false
dataSelect: DataModel = { positionId: "", tdesc: "", edesc: "", consolidate: "", shortName: "", companyId: "" }
numDataListChecked = 0
isDataListChecked = false
isDataListCheckedAll = false
eventgrp: { loading: boolean, select: EventgrpModel, dataList: { check: boolean, data: EventgrpModel }[] } = { loading: false, select: new MyEventgrpModel(), dataList: [] }
constructor(
private toastr: ToastrService,
private cdr: ChangeDetectorRef,
private fileService: FileService
private fileService: FileService,
private eventgrpService: EventgrpService
) { }
ngOnInit(): void {
this.getPositionList()
this.getEventgrpList()
}
onFileSelected(event: any) {
......@@ -54,27 +45,27 @@ export class DayTypeRegistryComponent {
}
const formData = new FormData();
formData.append('file', this.selectedFile);
this.dataLoading = true
this.fileService.uploadExcel(formData, 'mposition').subscribe({
this.eventgrp.loading = true
this.fileService.uploadExcel(formData, 'MEVENTGRP').subscribe({
next: response => {
if (response.success) {
this.showAlert(response.message, 'success')
this.getPositionList()
this.getEventgrpList()
} else {
this.showAlert(response.message, 'error')
this.dataLoading = false
this.eventgrp.loading = false
this.cdr.detectChanges();
}
}, error: error => {
this.showAlert(error.message, 'error')
this.dataLoading = false
this.eventgrp.loading = false
this.cdr.detectChanges();
}
})
}
downloadFile() {
const fileName = 'IMPORT_MPOSITION.xlsx'
const fileName = 'IMPORT_EVENTGRP.xlsx'
this.fileService.downloadTemplate(fileName).subscribe({
next: response => {
const url = window.URL.createObjectURL(response);
......@@ -91,86 +82,82 @@ export class DayTypeRegistryComponent {
})
}
getPositionList() {
this.dataLoading = false
// this.dataLoading = true
// this.positionService.getList().subscribe({
// next: response => {
// this.positionList = response.map(x => new MyPositionModel(x)).map(x => ({ check: false, data: { positionId: x.positionId, tdesc: x.tdesc, edesc: x.edesc, consolidate: x.consolidate, shortName: x.shortName, companyId: x.companyId } }))
// this.dataLoading = false
// this.isDataListCheckedAll = false
// this.dataListCheckAll()
// this.searchChange()
// this.cdr.detectChanges();
// }, error: error => {
// this.dataLoading = false
// console.error('Error fetching employee types:', error);
// this.cdr.detectChanges()
// }
// })
getEventgrpList() {
this.eventgrp.loading = true
this.eventgrpService.getList().subscribe({
next: response => {
this.eventgrp.dataList = response.map(x => ({ check: false, data: new MyEventgrpModel(x) }))
this.eventgrp.loading = false
this.isDataListCheckedAll = false
this.dataListCheckAll()
this.searchChange()
this.cdr.detectChanges();
}, error: error => {
this.eventgrp.loading = false
this.cdr.detectChanges()
}
})
}
searchChange() {
this.currentPage = 1
this.page = Array.from({ length: Math.ceil(this.positionListFilter().length / 10) }, (_, i) => i + 1);
this.page = Array.from({ length: Math.ceil(this.eventgrpListFilter().length / 10) }, (_, i) => i + 1);
this.dataListCheck()
}
positionListFilter() {
return this.positionList.filter(x => {
eventgrpListFilter() {
return this.eventgrp.dataList.filter(x => {
const data = x.data
const match = data.positionId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase()) || data.edesc.toLowerCase().includes(this.search.toLowerCase());
const match = data.eventgrpId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase()) || data.edesc.toLowerCase().includes(this.search.toLowerCase());
return match;
});
}
setData(data?: DataModel) {
this.dataSelect = JSON.parse(JSON.stringify(data || { positionId: "", tdesc: "", edesc: "", consolidate: "", shortName: "", companyId: "" }));
setData(data?: EventgrpModel) {
this.eventgrp.select = new MyEventgrpModel(data)
}
addPosition() {
const body = new MyPositionModel({ positionId: this.dataSelect.positionId, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc, consolidate: this.dataSelect.consolidate, shortName: this.dataSelect.shortName, companyId: this.dataSelect.companyId })
this.dataLoading = true
// this.positionService.post(body).subscribe({
// next: response => {
// if (response.success) {
// this.showAlert(response.message, 'success')
// this.getPositionList()
// } else {
// this.showAlert(response.message, 'error')
// this.dataLoading = false
// this.cdr.detectChanges()
// }
// }, error: error => {
// this.showAlert(error.message, 'error')
// this.dataLoading = false
// this.cdr.detectChanges()
// }
// })
}
deletePosition() {
let body: PositionModel | PositionModel[] = []
if (this.dataSelect.positionId) {
body = new MyPositionModel({ positionId: this.dataSelect.positionId, tdesc: this.dataSelect.tdesc, edesc: this.dataSelect.edesc, consolidate: this.dataSelect.consolidate, shortName: this.dataSelect.shortName, companyId: this.dataSelect.companyId })
addEventgrp() {
this.eventgrp.loading = true
this.eventgrpService.post(new MyEventgrpModel(this.eventgrp.select)).subscribe({
next: response => {
if (response.success) {
this.showAlert(response.message, 'success')
this.getEventgrpList()
} else {
this.showAlert(response.message, 'error')
this.eventgrp.loading = false
this.cdr.detectChanges()
}
}, error: error => {
this.showAlert(error.message, 'error')
this.eventgrp.loading = false
this.cdr.detectChanges()
}
})
}
deleteEventgrp() {
let body: EventgrpModel[] = []
if (this.eventgrp.select.eventgrpId) {
body = [new MyEventgrpModel(this.eventgrp.select)]
} else {
body = this.positionList.filter(x => x.check).map(x => new MyPositionModel({ positionId: x.data.positionId, tdesc: x.data.tdesc, edesc: x.data.edesc, consolidate: x.data.consolidate, shortName: x.data.shortName, companyId: x.data.companyId }))
}
this.dataLoading = true
// this.positionService.delete(body).subscribe({
// next: response => {
// if (response.success) {
// this.showAlert(response.message, 'success')
// this.getPositionList()
// } else {
// this.showAlert(response.message, 'error')
// this.dataLoading = false
// this.cdr.detectChanges()
// }
// }, error: error => {
// this.showAlert(error.message, 'error')
// this.dataLoading = false
// this.cdr.detectChanges()
// }
// })
body = this.eventgrp.dataList.filter(x => x.check).map(x => new MyEventgrpModel(x.data))
}
this.eventgrp.loading = true
this.eventgrpService.delete(body).subscribe({
next: response => {
if (response.success) {
this.showAlert(response.message, 'success')
this.getEventgrpList()
} else {
this.showAlert(response.message, 'error')
this.eventgrp.loading = false
this.cdr.detectChanges()
}
}, error: error => {
this.showAlert(error.message, 'error')
this.eventgrp.loading = false
this.cdr.detectChanges()
}
})
}
showAlert(text: string, type: 'success' | 'error') {
this.toastr[type](text, 'แจ้งเตือน', {
......@@ -181,29 +168,22 @@ export class DayTypeRegistryComponent {
dataListCheckAll() {
const selectAll = this.isDataListCheckedAll;
this.positionList.filter(x => {
const data = x.data
const match = data.positionId.toLowerCase().includes(this.search.toLowerCase()) || data.tdesc.toLowerCase().includes(this.search.toLowerCase()) || data.edesc.toLowerCase().includes(this.search.toLowerCase());
return match;
}).forEach(x => x.check = selectAll);
this.eventgrpListFilter().forEach(x => x.check = selectAll);
this.dataListCheck();
}
dataListCheck() {
const dataCheck = this.positionListFilter();
const dataCheck = this.eventgrpListFilter();
this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
this.numDataListChecked = this.positionList.filter(x => x.check).length;
this.numDataListChecked = this.eventgrp.dataList.filter(x => x.check).length;
this.isDataListChecked = Boolean(this.numDataListChecked)
}
clearPosition(modalStatus: string) {
clearEventgrp(modalStatus: string) {
if (modalStatus == 'add') {
this.dataSelect.positionId = ''
this.dataSelect.tdesc = ''
this.dataSelect.edesc = ''
this.eventgrp.select = new MyEventgrpModel()
} else if (modalStatus == 'edit') {
this.dataSelect.tdesc = ''
this.dataSelect.edesc = ''
this.eventgrp.select = new MyEventgrpModel({ eventgrpId: this.eventgrp.select.eventgrpId })
}
}
}
......
......@@ -22,7 +22,8 @@
<div class="page">
<div class="grid grid-cols-3 gap-6">
<div class="col-span-1">
<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>
</div>
<div class="grid grid-cols-3 gap-6">
......@@ -33,7 +34,8 @@
</div>
<div class="grid grid-cols-3 gap-6 mt-10">
<div class="col-span-1">
<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>
</div>
<div class="grid grid-cols-3 gap-6">
......@@ -42,7 +44,8 @@
oninput="this.value = this.value.replace(/\D/g, '')" [(ngModel)]="setting.data.expectationLevel">
</div>
</div>
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label mt-10">จัดการสมรรถนะกับกลุ่ม <span class="text-danger">*</span></label>
<label for="hs-trailing-button-add-on-with-icon" class="ti-form-label mt-10">จัดการสมรรถนะกับกลุ่ม <span
class="text-danger">*</span></label>
<div class="box-body">
<div class="grid grid-cols-6 gap-2">
<div class="grid col-span-1 grid-cols-6 gap-2">
......@@ -50,7 +53,7 @@
<input type="checkbox" class="ti-form-checkbox" id="settingGroupAssessment-0"
[class.pointer-events-none]="setting.data.settingGroupAssessment=='0'"
name="settingGroupAssessment" (change)="setting.data.settingGroupAssessment='0'"
[value]="'0'" [checked]="setting.data.settingGroupAssessment=='0'">
[checked]="setting.data.settingGroupAssessment=='0'">
</div>
<div class="col-span-5">
<label for="settingGroupAssessment-0" class="text-sm text-gray-500"
......
......@@ -152,6 +152,7 @@ import { PmsGroupGradeComponent } from '../performance-management-evaluation/pms
import { EvaluationAssessmentService } from 'src/app/shared/services/evaluation-assessment.service';
import { AppraisalService } from 'src/app/shared/services/appraisal.service';
import { DayTypeRegistryComponent } from '../company-components/day-type-registry/day-type-registry.component';
import { EventgrpService } from 'src/app/shared/services/eventgrp.service';
export const MY_DATE_FORMATS = {
parse: {
......@@ -334,6 +335,7 @@ export class CustomDateAdapter extends NativeDateAdapter {
PmsSettingAssessmentService,
EvaluationAssessmentService,
AppraisalService,
EventgrpService,
{
provide: HTTP_INTERCEPTORS,
useClass: HttpRequestInterceptor,
......
export interface EventgrpModel {
eventgrpId: string
companyId: string
tdesc: string
edesc: string
event_status: number
}
export class MyEventgrpModel implements EventgrpModel {
eventgrpId: string
companyId: string
tdesc: string
edesc: string
event_status: number
constructor(data?: Partial<EventgrpModel>) {
this.eventgrpId = data?.eventgrpId || ""
this.tdesc = data?.tdesc || ""
this.edesc = data?.edesc || ""
this.companyId = data?.companyId || ""
this.event_status = data?.event_status ?? 0
}
}
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { environment } from 'src/environments/environment';
import { AlertModel } from '../model/alert.model';
import { EventgrpModel } from '../model/eventgrp.model';
@Injectable({
providedIn: 'root'
})
export class EventgrpService {
api = "/eventgrp"
urlApi = environment.baseUrl + this.api
constructor(private http: HttpClient) {
}
getById(eventgrpId: string): Observable<EventgrpModel> {
return this.http.get<EventgrpModel>(this.urlApi + "/mini/" + eventgrpId)
}
getList(): Observable<EventgrpModel[]> {
return this.http.get<EventgrpModel[]>(this.urlApi + "/mini/lists")
}
getOpenList(): Observable<EventgrpModel[]> {
return this.http.get<EventgrpModel[]>(this.urlApi + "/mini/lists?status=1")
}
getCloseList(): Observable<EventgrpModel[]> {
return this.http.get<EventgrpModel[]>(this.urlApi + "/mini/lists?status=0")
}
post(body: EventgrpModel): Observable<AlertModel> {
return this.http.post<AlertModel>(this.urlApi, body)
}
delete(body: EventgrpModel[]): Observable<AlertModel> {
const options = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
};
return this.http.delete<AlertModel>(this.urlApi, options)
}
}
\ No newline at end of file
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