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

src/app/portal-manage/myjob/user-management/user-setting/user-setting.component.ts

@@ -14,6 +14,7 @@ import { TokenService } from "../../../../shared/services/token.service";
 import { RoleModel } from "../../../models/role.model";
 import { AuthModel } from "../../../models/auth.model";
 import { ProfileModel } from "../../../models/profile.model";
+import { Observable, forkJoin } from "rxjs";
 
 @Component({
   selector: 'app-user-setting',
@@ -39,30 +40,42 @@ export class UserSettingComponent {
   confirmPassword = ""
   itemsList: ProfileModel[] = []
   filterList: ProfileModel[] = []
+  pagedList: ProfileModel[] = [];
   selectModel: ProfileModel = new ProfileModel()
   selectedItems = new Map<string, boolean>();
   roleList: RoleModel[] = []
   empList: ProfileModel[] = []
   descName = 'engName'
   pageIndex = 0;
+  pageSize = 10;
+  totalCount = 0;
+  totalPages = 1;
   uploaderProfile: FileUploader | undefined;
   uploadErrorMsg: string = "";
   modalStatus: "add" | "edit" = "add"
   existingEmails: ProfileModel[] = []
   isEmailDuplicate = false;
   password: string = '';
+
+  showPasswordFields = false;
+  newPassword = '';
+  confirmNewPassword = '';
+  newPasswordVisible = false;
+  confirmNewPasswordVisible = false;
+
   get searchTerm(): string {
     return this._searchTerm;
   }
   set searchTerm(val: string) {
     this.pageIndex = 0;
-    this.allSelected = false
+    this.allSelected = false;
     this._searchTerm = val;
     if (val != '') {
       this.filterList = this.filter(val);
     } else {
-      this.updatePagedItems()
+      this.filterList = this.itemsList.slice();
     }
+    this.onSearchChange();
   }
 
   _searchTerm = "";
@@ -70,6 +83,14 @@ export class UserSettingComponent {
     this.uploadConfig()
   }
 
+  togglePasswordFields() {
+    this.showPasswordFields = !this.showPasswordFields;
+    if (!this.showPasswordFields) {
+      this.newPassword = '';
+      this.confirmNewPassword = '';
+    }
+  }
+
   uploadConfig() {
     this.uploaderProfile = new FileUploader({
       url: environment.baseUrl + "/files/upload-image",
@@ -125,8 +146,9 @@ export class UserSettingComponent {
     ngOnInit(): void {
       this.userService.getListsProfile().subscribe(result => {
         this.itemsList = result.map(item => new ProfileModel(item, this.translate));
-      this.filterList = [...this.itemsList];
+        this.filterList = this.itemsList.slice();
         this.existingEmails = result;
+        this.updatePagedItems();
       });
   
     }
@@ -175,13 +197,18 @@ export class UserSettingComponent {
       this.action = 'add'
       this.selectModel = new ProfileModel()
       this.selectModel.status = 1;
+      this.showPasswordFields = false;
+      this.newPassword = '';
+      this.confirmNewPassword = '';
     }
   
     view(item: ProfileModel) {
       this.action = 'edit'
       this.confirmPassword = ''
       this.selectModel = new ProfileModel(item)
-
+      this.showPasswordFields = false;
+      this.newPassword = '';
+      this.confirmNewPassword = '';
     }
   
     save() {
@@ -233,14 +260,34 @@ export class UserSettingComponent {
             });
   
           } else if (this.action === 'edit') {
-          this.userService.update(this.selectModel).subscribe({
-            next: result => {
-              swal("Update Success!!", "บันทึกข้อมูลสมาชิก", "success");
+            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({
+                next: results => {
+                    swal("Update Success!!", "บันทึกข้อมูลเรียบร้อยแล้ว", "success");
                     this.ngOnInit();
                     this.childModal?.nativeElement.click();
                 },
                 error: err => {
-              swal("Error", "ไม่สามารถอัปเดตได้", "error");
+                    console.error('Update failed:', err);
+                    swal("Error", "เกิดข้อผิดพลาดในการอัปเดตข้อมูล", "error");
                 }
             });
           }
@@ -252,9 +299,47 @@ export class UserSettingComponent {
   
   
     updatePagedItems() {
-    const startIndex = this.pageIndex * 10;
-    const endIndex = startIndex + 10;
-    this.filterList = this.itemsList.slice(startIndex, endIndex);
+      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();
+      }
+    }
+  
+    goTo(p: number) {
+      if (p >= 0 && p < this.totalPages && p !== this.pageIndex) {
+        this.pageIndex = p;
+        this.updatePagedItems();
+      }
     }
   
   toggleAll(event: any) {

src/app/portal-manage/services/user.service.ts

@@ -109,6 +109,9 @@ export class UserService {
   registerCompany(body: AuthModel) {
     return this.http.post<ResponseModel>(this.apiAuthComUrl + "/register", body);
   }
+  editPassword(body: AuthModel) {
+    return this.http.post<ResponseModel>("/users", body)
+  }
   editPasswordCompany(body: AuthModel) {
     return this.http.post<ResponseModel>("/users/company", body)
   }