Skip to content

P
portal-apps-manage
Commit 3f611be4 by sawit
Options

Modal แก้ไข และการแสดงหน้าจอ

parent 52593de8
Showing with 311 additions and 202 deletions
src/app/portal-manage/myjob/user-management/user-setting/user-setting.component.html
...@@ -68,8 +68,8 @@ ...@@ -68,8 +68,8 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@if (filterList.length > 0) { @if (pagedList.length > 0) {
@for(item of filterList;track filterList){ @for(item of pagedList;track pagedList){
<tr class="border border-defaultborder dark:border-defaultborder/10"> <tr class="border border-defaultborder dark:border-defaultborder/10">
<td class="product-checkbox"><input class="form-check-input" type="checkbox" <td class="product-checkbox"><input class="form-check-input" type="checkbox"
...@@ -148,35 +148,25 @@ ...@@ -148,35 +148,25 @@
<div class="flex items-center flex-wrap overflow-auto" *ngIf="filterList.length > 0"> <div class="flex items-center flex-wrap overflow-auto" *ngIf="filterList.length > 0">
<div class="mb-2 sm:mb-0"> <div class="mb-2 sm:mb-0">
<div> <div>
{{'Showing' | translate}} {{filterList.length}} {{'entries' {{'Showing' | translate}} {{ (pageIndex * pageSize) + 1 }} – {{ showingEnd }} {{'entries' | translate}}
| translate}} <i class="bi bi-arrow-right ms-2 font-semibold"></i> <i class="bi bi-arrow-right ms-2 font-semibold"></i>
</div> </div>
</div> </div>
<div class="ms-auto"> <div class="ms-auto">
<nav aria-label="Page navigation"> <nav aria-label="Page navigation" *ngIf="totalPages > 1">
<ul class="ti-pagination mb-0"> <ul class="ti-pagination mb-0">
<li *ngIf="pageIndex>0" class="page-item {{pageIndex==0 ? 'disabled' : ''}}"><a <li class="page-item" [class.disabled]="pageIndex === 0">
class="page-link px-3 py-[0.375rem] cursor-pointer" <a class="page-link px-3 py-[0.375rem] cursor-pointer" (click)="goPrev()">{{'Previous' | translate}}</a>
(click)="pageIndex = pageIndex-1;updatePagedItems()">{{'Previous' | translate}}</a></li> </li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="pageIndex-1>0" (click)="pageIndex = pageIndex-2;updatePagedItems()">{{pageIndex-1}}</a></li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="pageIndex>0 && ((pageIndex-1)*10 < (searchTerm == '' ? itemsList.length : filterList.length))"
(click)="pageIndex = pageIndex-1;updatePagedItems()">{{pageIndex}}</a></li>
<li class="page-item"><a class="page-link active px-3 py-[0.375rem]" <li class="page-item" *ngFor="let p of pages">
href="javascript:void(0);">{{pageIndex +1}}</a> <a class="page-link px-3 py-[0.375rem] cursor-pointer"
[class.active]="p === pageIndex"
(click)="goTo(p)">{{ p + 1 }}</a>
</li> </li>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="(pageIndex+1)*10 < (searchTerm == '' ? itemsList.length : filterList.length)" <li class="page-item" [class.disabled]="pageIndex >= totalPages - 1">
(click)="pageIndex = pageIndex+1;updatePagedItems()">{{pageIndex +2}}</a></li> <a class="page-link px-3 py-[0.375rem] cursor-pointer" (click)="goNext()">{{'Next' | translate}}</a>
<li class="page-item"><a class="page-link px-3 py-[0.375rem]" href="javascript:void(0);"
*ngIf="(pageIndex+2)*10 < (searchTerm == '' ? itemsList.length : filterList.length)"
(click)="pageIndex = pageIndex+2;updatePagedItems()">{{pageIndex +3}}</a></li>
<li *ngIf="(pageIndex+1)*10 < (searchTerm == '' ? itemsList.length : filterList.length)"
class="page-item"><a class="page-link px-3 py-[0.375rem] cursor-pointer"
(click)="pageIndex = pageIndex+1;updatePagedItems()">{{'Next' |
translate}}</a>
</li> </li>
</ul> </ul>
</nav> </nav>
...@@ -225,7 +215,7 @@ ...@@ -225,7 +215,7 @@
<div class="xl:col-span-12 col-span-12" *ngIf="modalStatus=='edit'"> <div class="xl:col-span-12 col-span-12" *ngIf="modalStatus=='edit'">
<label for="deal-title" class="form-label">{{'Candidate ID' | translate}}</label> <label for="deal-title" class="form-label">{{'Candidate ID' | translate}}</label>
<input type="text" class="form-control" [ngClass]="{ '!bg-input-readonly': action === 'edit' }" <input type="text" class="form-control !bg-gray-200 cursor-not-allowed" [ngClass]="{ '!bg-input-readonly': action === 'edit' }"
id="deal-title" placeholder="" [(ngModel)]="selectModel.candidateId" [readonly]="action === 'edit'"> id="deal-title" placeholder="" [(ngModel)]="selectModel.candidateId" [readonly]="action === 'edit'">
<div class="text-danger" *ngIf="!selectModel.candidateId"> <div class="text-danger" *ngIf="!selectModel.candidateId">
{{'Please fill in information' | translate}} {{'Please fill in information' | translate}}
...@@ -252,7 +242,7 @@ ...@@ -252,7 +242,7 @@
</div> </div>
</div> --> </div> -->
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='add'"> <div class="xl:col-span-6 col-span-12">
<label for="deal-title" class="form-label">{{'Name(Thai)' | translate}}</label> <label for="deal-title" class="form-label">{{'Name(Thai)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" <input type="text" class="form-control" id="deal-title" placeholder=""
[(ngModel)]="selectModel.thFirstname"> [(ngModel)]="selectModel.thFirstname">
...@@ -260,14 +250,14 @@ ...@@ -260,14 +250,14 @@
{{'Please fill in information' | translate}} {{'Please fill in information' | translate}}
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='add'"> <div class="xl:col-span-6 col-span-12">
<label for="deal-title" class="form-label">{{'Surname(Thai)' | translate}}</label> <label for="deal-title" class="form-label">{{'Surname(Thai)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" [(ngModel)]="selectModel.thLastname"> <input type="text" class="form-control" id="deal-title" placeholder="" [(ngModel)]="selectModel.thLastname">
<div class="text-danger" *ngIf="!selectModel.thLastname"> <div class="text-danger" *ngIf="!selectModel.thLastname">
{{'Please fill in information' | translate}} {{'Please fill in information' | translate}}
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='add'"> <div class="xl:col-span-6 col-span-12">
<label for="deal-title" class="form-label">{{'Name(Eng)' | translate}}</label> <label for="deal-title" class="form-label">{{'Name(Eng)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" <input type="text" class="form-control" id="deal-title" placeholder=""
[(ngModel)]="selectModel.engFirstname"> [(ngModel)]="selectModel.engFirstname">
...@@ -275,7 +265,7 @@ ...@@ -275,7 +265,7 @@
{{'Please fill in information' | translate}} {{'Please fill in information' | translate}}
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='add'"> <div class="xl:col-span-6 col-span-12">
<label for="deal-title" class="form-label">{{'Surname(Eng)' | translate}}</label> <label for="deal-title" class="form-label">{{'Surname(Eng)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" <input type="text" class="form-control" id="deal-title" placeholder=""
[(ngModel)]="selectModel.engLastname"> [(ngModel)]="selectModel.engLastname">
...@@ -283,28 +273,11 @@ ...@@ -283,28 +273,11 @@
{{'Please fill in information' | translate}} {{'Please fill in information' | translate}}
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='edit'">
<label for="deal-title" class="form-label">{{'Name-Surname(Thai)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" [(ngModel)]="selectModel.thFullName"
[disabled]="action === 'edit'">
<div class="text-danger" *ngIf="!selectModel.thFullName">
{{'Please fill in information' | translate}}
</div>
</div>
<div class="xl:col-span-6 col-span-12" *ngIf="modalStatus=='edit'">
<label for="deal-title" class="form-label">{{'Name-Surname(Eng)' | translate}}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" [disabled]="action === 'edit'"
[(ngModel)]="selectModel.engFullName">
<div class="text-danger" *ngIf="!selectModel.engFullName">
{{'Please fill in information' | translate}}
</div>
</div>
<div class="xl:col-span-12 col-span-12"> <div class="xl:col-span-12 col-span-12">
<label for="deal-title" class="form-label">{{ 'Email' | translate }}</label> <label for="deal-title" class="form-label">{{ 'Email' | translate }}</label>
<input type="text" class="form-control" id="deal-title" placeholder="" [(ngModel)]="selectModel.email" <input type="text" class="form-control" id="deal-title" placeholder="" [(ngModel)]="selectModel.email"
[disabled]="action === 'edit'" (ngModelChange)="onEmailChange($event)" /> (ngModelChange)="onEmailChange($event)" />
<div class="text-danger" *ngIf="!selectModel.email"> <div class="text-danger" *ngIf="!selectModel.email">
{{ 'Please fill in information' | translate }} {{ 'Please fill in information' | translate }}
</div> </div>
...@@ -320,26 +293,59 @@ ...@@ -320,26 +293,59 @@
</div> </div>
</div> </div>
<!-- Change Password Section -->
<div class="xl:col-span-12 col-span-12" *ngIf="action === 'edit'">
<div class="xl:col-span-6 col-span-12" *ngIf="action !== 'edit'"> <div class="flex justify-end">
<label for="password" class="form-label">{{'Password' | translate}}</label> <button type="button" (click)="togglePasswordFields()" class="ti-btn ti-btn-link text-primary !p-0">
<input type="password" class="form-control" id="password" placeholder="" [(ngModel)]="password"> {{ (showPasswordFields ? ('Cancel' | translate) : ('Change Password' | translate)) }}
<div class="text-danger" *ngIf="!password"> </button>
{{ 'Please fill in information' | translate }}
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="action !== 'edit'"> <!-- Unified password form for both add and edit -->
<label for="deal-title" class="form-label">{{'Confirm Password' | translate}}</label> <ng-container *ngIf="action === 'add' || (showPasswordFields && action === 'edit')">
<input type="password" class="form-control" id="deal-title" placeholder="" [(ngModel)]="confirmPassword"> <div class="xl:col-span-6 col-span-12">
<div class="text-danger" *ngIf="!confirmPassword"> <label class="form-label">{{'Password' | translate}}</label>
{{'Please fill in information' | translate}} <div class="relative">
<input *ngIf="action === 'add'" [type]="newPasswordVisible ? 'text' : 'password'" class="form-control" id="password" [placeholder]="'Password' | translate" [(ngModel)]="password" autocomplete="new-password" name="user-new-password">
<input *ngIf="action !== 'add'" [type]="newPasswordVisible ? 'text' : 'password'" class="form-control" id="newPassword" [placeholder]="'Enter new password' | translate" [(ngModel)]="newPassword" autocomplete="new-password" name="user-edit-new-password">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="newPasswordVisible = !newPasswordVisible">
<i class="ri-eye-off-line" *ngIf="!newPasswordVisible"></i>
<i class="ri-eye-line" *ngIf="newPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="action === 'add' && !password">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger" *ngIf="action !== 'add' && !newPassword">
{{ 'Please fill in information' | translate }}
</div>
</div> </div>
<div class="text-danger" *ngIf="confirmPassword && (confirmPassword != password)">
{{'Password Not Match' | translate}} <div class="xl:col-span-6 col-span-12">
<label class="form-label">{{'Confirm Password' | translate}}</label>
<div class="relative">
<input *ngIf="action === 'add'" [type]="confirmNewPasswordVisible ? 'text' : 'password'" class="form-control" id="confirmPassword" [placeholder]="'Confirm Password' | translate" [(ngModel)]="confirmPassword" autocomplete="new-password" name="user-confirm-password">
<input *ngIf="action !== 'add'" [type]="confirmNewPasswordVisible ? 'text' : 'password'" class="form-control" id="confirmNewPassword" [placeholder]="'Confirm new password' | translate" [(ngModel)]="confirmNewPassword" autocomplete="new-password" name="user-edit-confirm-new-password">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="confirmNewPasswordVisible = !confirmNewPasswordVisible">
<i class="ri-eye-off-line" *ngIf="!confirmNewPasswordVisible"></i>
<i class="ri-eye-line" *ngIf="confirmNewPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="action === 'add' && !confirmPassword">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger" *ngIf="action !== 'add' && !confirmNewPassword">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger text-xs mt-1" *ngIf="action === 'add' && confirmPassword && (confirmPassword != password)">
{{'Password Not Match' | translate}}
</div>
<div class="text-danger text-xs mt-1" *ngIf="action !== 'add' && confirmNewPassword && (confirmNewPassword != newPassword)">
{{'Password Not Match' | translate}}
</div>
</div> </div>
</div> </ng-container>
<!-- <div class="xl:col-span-12 col-span-12"> <!-- <div class="xl:col-span-12 col-span-12">
...@@ -353,7 +359,7 @@ ...@@ -353,7 +359,7 @@
<div class="xl:col-span-12 col-span-12"> <div class="xl:col-span-12 col-span-12">
<label class="form-label">{{'Status' | translate}}</label> <label class="form-label">{{'Status' | translate}}</label>
<ng-select name="choices-multiple-remove-button2" id="choices-multiple-remove-button2" placeholder="" <ng-select name="choices-multiple-remove-button2" id="choices-multiple-remove-button2" placeholder=""
[disabled]="action === 'edit'" [(ngModel)]="selectModel.status"> [(ngModel)]="selectModel.status">
<ng-option [value]="0">{{'Unactive' | translate}}</ng-option> <ng-option [value]="0">{{'Unactive' | translate}}</ng-option>
<ng-option [value]="1">{{'Active' | translate}}</ng-option> <ng-option [value]="1">{{'Active' | translate}}</ng-option>
</ng-select> </ng-select>
...@@ -366,25 +372,41 @@ ...@@ -366,25 +372,41 @@
{{'Cancel' | translate}} {{'Cancel' | translate}}
</button> </button>
<button type="button" *ngIf="modalStatus=='add'" (click)="save()" <button type="button" *ngIf="modalStatus=='add'" (click)="save()"
class="ti-btn bg-primary text-white !font-medium" class="ti-btn bg-primary text-white !font-medium"
[class.ti-btn-disabled]=" [class.ti-btn-disabled]="
!selectModel.thFirstname || !selectModel.thFirstname ||
!selectModel.thLastname || !selectModel.thLastname ||
!selectModel.engFirstname || !selectModel.engFirstname ||
!selectModel.engLastname || !selectModel.engLastname ||
(!selectModel.email || isEmailDuplicate || !selectModel.email.includes('@') || !selectModel.email.includes('.')) || (!selectModel.email || isEmailDuplicate || !selectModel.email.includes('@') || !selectModel.email.split('@')[1]?.includes('.')) ||
!password || !confirmPassword || (confirmPassword !== password) !password || !confirmPassword || (confirmPassword !== password)
" [disabled]=" " [disabled]="
!selectModel.thFirstname || !selectModel.thFirstname ||
!selectModel.thLastname || !selectModel.thLastname ||
!selectModel.engFirstname || !selectModel.engFirstname ||
!selectModel.engLastname || !selectModel.engLastname ||
(!selectModel.email || isEmailDuplicate || !selectModel.email.includes('@') || !selectModel.email.includes('.')) || (!selectModel.email || isEmailDuplicate || !selectModel.email.includes('@') || !selectModel.email.split('@')[1]?.includes('.')) ||
!password || !confirmPassword || (confirmPassword !== password)"> !password || !confirmPassword || (confirmPassword !== password)">
{{ 'Save' | translate }} {{ 'Save' | translate }}
</button> </button>
<button type="button" *ngIf="modalStatus=='edit'" (click)="save()"
class="ti-btn bg-primary text-white !font-medium"
[class.ti-btn-disabled]="
!selectModel.thFirstname ||
!selectModel.thLastname ||
!selectModel.engFirstname ||
!selectModel.engLastname ||
(!selectModel.email || !selectModel.email.includes('@') || !selectModel.email.split('@')[1]?.includes('.'))
" [disabled]="
!selectModel.thFirstname ||
!selectModel.thLastname ||
!selectModel.engFirstname ||
!selectModel.engLastname ||
(!selectModel.email || !selectModel.email.includes('@') || !selectModel.email.split('@')[1]?.includes('.'))">
{{ 'Save' | translate }}
</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- End:: Create Contact --> <!-- End:: Create Contact -->
\ No newline at end of file
src/app/portal-manage/myjob/user-management/user-setting/user-setting.component.ts
...@@ -14,6 +14,7 @@ import { TokenService } from "../../../../shared/services/token.service"; ...@@ -14,6 +14,7 @@ import { TokenService } from "../../../../shared/services/token.service";
import { RoleModel } from "../../../models/role.model"; import { RoleModel } from "../../../models/role.model";
import { AuthModel } from "../../../models/auth.model"; import { AuthModel } from "../../../models/auth.model";
import { ProfileModel } from "../../../models/profile.model"; import { ProfileModel } from "../../../models/profile.model";
import { Observable, forkJoin } from "rxjs";
@Component({ @Component({
selector: 'app-user-setting', selector: 'app-user-setting',
...@@ -39,30 +40,42 @@ export class UserSettingComponent { ...@@ -39,30 +40,42 @@ export class UserSettingComponent {
confirmPassword = "" confirmPassword = ""
itemsList: ProfileModel[] = [] itemsList: ProfileModel[] = []
filterList: ProfileModel[] = [] filterList: ProfileModel[] = []
pagedList: ProfileModel[] = [];
selectModel: ProfileModel = new ProfileModel() selectModel: ProfileModel = new ProfileModel()
selectedItems = new Map<string, boolean>(); selectedItems = new Map<string, boolean>();
roleList: RoleModel[] = [] roleList: RoleModel[] = []
empList: ProfileModel[] = [] empList: ProfileModel[] = []
descName = 'engName' descName = 'engName'
pageIndex = 0; pageIndex = 0;
pageSize = 10;
totalCount = 0;
totalPages = 1;
uploaderProfile: FileUploader | undefined; uploaderProfile: FileUploader | undefined;
uploadErrorMsg: string = ""; uploadErrorMsg: string = "";
modalStatus: "add" | "edit" = "add" modalStatus: "add" | "edit" = "add"
existingEmails: ProfileModel[] = [] existingEmails: ProfileModel[] = []
isEmailDuplicate = false; isEmailDuplicate = false;
password: string = ''; password: string = '';
showPasswordFields = false;
newPassword = '';
confirmNewPassword = '';
newPasswordVisible = false;
confirmNewPasswordVisible = false;
get searchTerm(): string { get searchTerm(): string {
return this._searchTerm; return this._searchTerm;
} }
set searchTerm(val: string) { set searchTerm(val: string) {
this.pageIndex = 0; this.pageIndex = 0;
this.allSelected = false this.allSelected = false;
this._searchTerm = val; this._searchTerm = val;
if (val != '') { if (val != '') {
this.filterList = this.filter(val); this.filterList = this.filter(val);
} else { } else {
this.updatePagedItems() this.filterList = this.itemsList.slice();
} }
this.onSearchChange();
} }
_searchTerm = ""; _searchTerm = "";
...@@ -70,6 +83,14 @@ export class UserSettingComponent { ...@@ -70,6 +83,14 @@ export class UserSettingComponent {
this.uploadConfig() this.uploadConfig()
} }
togglePasswordFields() {
this.showPasswordFields = !this.showPasswordFields;
if (!this.showPasswordFields) {
this.newPassword = '';
this.confirmNewPassword = '';
}
}
uploadConfig() { uploadConfig() {
this.uploaderProfile = new FileUploader({ this.uploaderProfile = new FileUploader({
url: environment.baseUrl + "/files/upload-image", url: environment.baseUrl + "/files/upload-image",
...@@ -122,141 +143,205 @@ export class UserSettingComponent { ...@@ -122,141 +143,205 @@ export class UserSettingComponent {
} }
ngOnInit(): void { ngOnInit(): void {
this.userService.getListsProfile().subscribe(result => { this.userService.getListsProfile().subscribe(result => {
this.itemsList = result.map(item => new ProfileModel(item, this.translate)); this.itemsList = result.map(item => new ProfileModel(item, this.translate));
this.filterList = [...this.itemsList]; this.filterList = this.itemsList.slice();
this.existingEmails = result; this.existingEmails = result;
}); this.updatePagedItems();
}
onEmailChange(email: string) {
const lowerEmail = email.trim().toLowerCase();
this.isEmailDuplicate = this.existingEmails.some(
user => user.email && user.email.toLowerCase() === lowerEmail
);
}
filter(v: string): ProfileModel[] {
const search = v.toLowerCase();
return this.itemsList?.filter(x =>
x.candidateId?.toLowerCase().includes(search) ||
x.email?.toLowerCase().includes(search) ||
x.email?.toLowerCase().includes(search) ||
x.phoneCurrent?.toLowerCase().includes(search) ||
x.getStatus()?.toLowerCase().includes(search) ||
x.getName?.()?.toLowerCase().includes(search)
);
}
delete(item: ProfileModel) {
swal({
title: "Are you sure?",
text: "You won't be able to revert this!",
icon: "warning",
dangerMode: true,
buttons: ["Cancel", "Yes,Delete it!"],
})
.then((willDelete: any) => {
if (willDelete) {
this.userService.put(item).subscribe(result => {
swal("Save Success!!", "บันทึกข้อมูลสำเร็จ", "success");
this.ngOnInit()
})
}
}); });
}
}
new() {
this.action = 'add' onEmailChange(email: string) {
this.selectModel = new ProfileModel() const lowerEmail = email.trim().toLowerCase();
this.selectModel.status = 1; this.isEmailDuplicate = this.existingEmails.some(
} user => user.email && user.email.toLowerCase() === lowerEmail
);
view(item: ProfileModel) { }
this.action = 'edit'
this.confirmPassword = '' filter(v: string): ProfileModel[] {
this.selectModel = new ProfileModel(item) const search = v.toLowerCase();
return this.itemsList?.filter(x =>
} x.candidateId?.toLowerCase().includes(search) ||
x.email?.toLowerCase().includes(search) ||
save() { x.email?.toLowerCase().includes(search) ||
swal({ x.phoneCurrent?.toLowerCase().includes(search) ||
title: "Are you sure?", x.getStatus()?.toLowerCase().includes(search) ||
text: "คุณต้องการบันทึกหรือไม่", x.getName?.()?.toLowerCase().includes(search)
icon: "warning", );
dangerMode: false, }
buttons: ["Cancel", "Confirm"],
}).then((willSave: any) => {
if (willSave) { delete(item: ProfileModel) {
if (this.action === 'add') { swal({
title: "Are you sure?",
const body = new AuthModel(); text: "You won't be able to revert this!",
body.username = this.selectModel.email; icon: "warning",
body.password = this.password;
body.role = new RoleModel({ roleId: 'candidate' }); dangerMode: true,
buttons: ["Cancel", "Yes,Delete it!"],
const rawProfile = { ...body.profile }; })
.then((willDelete: any) => {
rawProfile.thFirstname = rawProfile.thFirstname || this.selectModel.thFirstname || ""; if (willDelete) {
rawProfile.thLastname = rawProfile.thLastname || this.selectModel.thLastname || ""; this.userService.put(item).subscribe(result => {
rawProfile.engFirstname = rawProfile.engFirstname || this.selectModel.engFirstname || ""; swal("Save Success!!", "บันทึกข้อมูลสำเร็จ", "success");
rawProfile.engLastname = rawProfile.engLastname || this.selectModel.engLastname || ""; this.ngOnInit()
rawProfile.email = rawProfile.email || this.selectModel.email || ""; })
rawProfile.status = rawProfile.status ?? 1; }
body.profile = new ProfileModel(rawProfile); });
}
this.userService.register(body).subscribe({
next: res => { new() {
if (this.selectModel.status === 1) { this.action = 'add'
swal("Save Success!!", "บันทึกข้อมูลสมาชิก", "success"); this.selectModel = new ProfileModel()
this.ngOnInit(); this.selectModel.status = 1;
this.childModal?.nativeElement.click(); this.showPasswordFields = false;
} else { this.newPassword = '';
swal("Save Failed", res?.message || "ไม่สามารถลงทะเบียนได้", "warning"); this.confirmNewPassword = '';
} }
},
error: err => { view(item: ProfileModel) {
console.error('Error response:', err); this.action = 'edit'
const errorMessage = err?.error?.message || err?.message || 'ไม่ทราบสาเหตุ'; this.confirmPassword = ''
if (errorMessage.includes('email')) { this.selectModel = new ProfileModel(item)
swal("Save Failed", "อีเมลซ้ำหรือไม่ถูกต้อง", "warning"); this.showPasswordFields = false;
} else { this.newPassword = '';
swal("Error", errorMessage, "error"); this.confirmNewPassword = '';
}
save() {
swal({
title: "Are you sure?",
text: "คุณต้องการบันทึกหรือไม่",
icon: "warning",
dangerMode: false,
buttons: ["Cancel", "Confirm"],
}).then((willSave: any) => {
if (willSave) {
if (this.action === 'add') {
const body = new AuthModel();
body.username = this.selectModel.email;
body.password = this.password;
body.role = new RoleModel({ roleId: 'candidate' });
const rawProfile = { ...body.profile };
rawProfile.thFirstname = rawProfile.thFirstname || this.selectModel.thFirstname || "";
rawProfile.thLastname = rawProfile.thLastname || this.selectModel.thLastname || "";
rawProfile.engFirstname = rawProfile.engFirstname || this.selectModel.engFirstname || "";
rawProfile.engLastname = rawProfile.engLastname || this.selectModel.engLastname || "";
rawProfile.email = rawProfile.email || this.selectModel.email || "";
rawProfile.status = rawProfile.status ?? 1;
body.profile = new ProfileModel(rawProfile);
this.userService.register(body).subscribe({
next: res => {
if (this.selectModel.status === 1) {
swal("Save Success!!", "บันทึกข้อมูลสมาชิก", "success");
this.ngOnInit();
this.childModal?.nativeElement.click();
} else {
swal("Save Failed", res?.message || "ไม่สามารถลงทะเบียนได้", "warning");
}
},
error: err => {
console.error('Error response:', err);
const errorMessage = err?.error?.message || err?.message || 'ไม่ทราบสาเหตุ';
if (errorMessage.includes('email')) {
swal("Save Failed", "อีเมลซ้ำหรือไม่ถูกต้อง", "warning");
} else {
swal("Error", errorMessage, "error");
}
} }
});
} else if (this.action === 'edit') {
const observables: Observable<any>[] = [];
observables.push(this.userService.update(this.selectModel));
if (this.showPasswordFields && this.newPassword && this.newPassword === this.confirmNewPassword) {
const authData = new AuthModel();
authData.username = this.selectModel.email;
authData.password = this.newPassword;
authData.profile = new ProfileModel({
candidateId: this.selectModel.candidateId,
profileId: this.selectModel.profileId
});
observables.push(this.userService.editPassword(authData));
} else if (this.showPasswordFields && (this.newPassword || this.confirmNewPassword)) {
swal("Invalid Password", "Please ensure passwords match.", "warning");
return;
} }
});
forkJoin(observables).subscribe({
} else if (this.action === 'edit') { next: results => {
this.userService.update(this.selectModel).subscribe({ swal("Update Success!!", "บันทึกข้อมูลเรียบร้อยแล้ว", "success");
next: result => { this.ngOnInit();
swal("Update Success!!", "บันทึกข้อมูลสมาชิก", "success"); this.childModal?.nativeElement.click();
this.ngOnInit(); },
this.childModal?.nativeElement.click(); error: err => {
}, console.error('Update failed:', err);
error: err => { swal("Error", "เกิดข้อผิดพลาดในการอัปเดตข้อมูล", "error");
swal("Error", "ไม่สามารถอัปเดตได้", "error"); }
} });
}); }
} }
});
}
updatePagedItems() {
this.totalCount = this.filterList.length;
this.totalPages = Math.max(1, Math.ceil(this.totalCount / this.pageSize));
const startIndex = this.pageIndex * this.pageSize;
const endIndex = startIndex + this.pageSize;
this.pagedList = this.filterList.slice(startIndex, endIndex);
}
onSearchChange() {
this.pageIndex = 0;
this.updatePagedItems();
}
get pages(): number[] {
return Array.from({ length: this.totalPages }, (_, i) => i);
}
get showingEnd(): number {
return Math.min((this.pageIndex + 1) * this.pageSize, this.totalCount);
}
goPrev() {
if (this.pageIndex > 0) {
this.pageIndex--;
this.updatePagedItems();
} }
}); }
}
goNext() {
if (this.pageIndex < this.totalPages - 1) {
this.pageIndex++;
this.updatePagedItems();
updatePagedItems() { }
const startIndex = this.pageIndex * 10; }
const endIndex = startIndex + 10;
this.filterList = this.itemsList.slice(startIndex, endIndex); goTo(p: number) {
} if (p >= 0 && p < this.totalPages && p !== this.pageIndex) {
this.pageIndex = p;
this.updatePagedItems();
}
}
toggleAll(event: any) { toggleAll(event: any) {
this.allSelected = event.target.checked; this.allSelected = event.target.checked;
this.selectedItems.clear(); this.selectedItems.clear();
......
src/app/portal-manage/services/user.service.ts
...@@ -109,6 +109,9 @@ export class UserService { ...@@ -109,6 +109,9 @@ export class UserService {
registerCompany(body: AuthModel) { registerCompany(body: AuthModel) {
return this.http.post<ResponseModel>(this.apiAuthComUrl + "/register", body); return this.http.post<ResponseModel>(this.apiAuthComUrl + "/register", body);
} }
editPassword(body: AuthModel) {
return this.http.post<ResponseModel>("/users", body)
}
editPasswordCompany(body: AuthModel) { editPasswordCompany(body: AuthModel) {
return this.http.post<ResponseModel>("/users/company", body) return this.http.post<ResponseModel>("/users/company", body)
} }
......
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