api widget by module

src/app/core/services/api.service.ts

@@ -48,8 +48,12 @@ export class ApiService {
       .pipe(catchError(this.formatErrors));
   }
 
-  delete<T>(path: string): Observable<T> {
-    return this.http.delete<T>(`${this.apiUrl}${path}`, { headers: this.getHeaders() })
+  delete<T>(path: string, options?: { body?: any }): Observable<T> {
+    const requestOptions = {
+      headers: this.getHeaders(),
+      body: options?.body
+    };
+    return this.http.delete<T>(`${this.apiUrl}${path}`, requestOptions)
       .pipe(catchError(this.formatErrors));
   }
 }

src/app/portal-manage/dashboard-management/dashboard-management.component.ts

@@ -3,7 +3,7 @@ import { ActivatedRoute, RouterModule } from '@angular/router';
 import { CommonModule, TitleCasePipe } from '@angular/common';
 import { NgComponentOutlet } from '@angular/common';
 import { FormsModule } from '@angular/forms';
-import { throwError } from 'rxjs';
+import { throwError, Observable } from 'rxjs';
 import { map, switchMap, catchError, take } from 'rxjs/operators';
 import { DashboardLayoutComponent, DashboardLayoutModule, PanelModel } from '@syncfusion/ej2-angular-layouts';
 import { MatDialog, MatDialogModule } from '@angular/material/dialog';
@@ -110,7 +110,7 @@ export class DashboardManagementComponent implements OnInit, OnDestroy {
       this.setResponsiveColumns();
     });
 
-    this.dashboardDataService.getDashboards().pipe(
+    this.getFilteredDashboards().pipe(
       catchError(error => {
         this.notificationService.error('Error', 'Failed to load user dashboards.');
         return throwError(() => error);
@@ -127,6 +127,28 @@ export class DashboardManagementComponent implements OnInit, OnDestroy {
     });
   }
 
+  private getDashboardQueryParams(): any {
+    const module = sessionStorage.getItem('module');
+    let queryParams = {};
+    if (module) {
+      queryParams = { application: module };
+    }
+    return queryParams;
+  }
+
+  private getFilteredDashboards(): Observable<DashboardModel[]> {
+    const queryParams = this.getDashboardQueryParams();
+    return this.dashboardDataService.getDashboards().pipe(
+      map(dashboards => {
+        // Show all dashboards if the module is 'dashboard-management', otherwise filter by application.
+        if (queryParams.application && queryParams.application !== 'dashboard-management') {
+          return dashboards.filter(dashboard => dashboard.application === queryParams.application);
+        }
+        return dashboards;
+      })
+    );
+  }
+
   private setResponsiveColumns(): void {
     const width = window.innerWidth;
     if (width <= 480) {
@@ -219,7 +241,7 @@ export class DashboardManagementComponent implements OnInit, OnDestroy {
       });
       this.dashboardDataService.saveDashboard(newDashboard).pipe(
         switchMap(addedDashboard => {
-          return this.dashboardDataService.getDashboards().pipe(
+          return this.getFilteredDashboards().pipe(
             map(dashboards => ({ addedDashboard, dashboards }))
           );
         }),
@@ -258,7 +280,7 @@ export class DashboardManagementComponent implements OnInit, OnDestroy {
       this.dashboardDataService.deleteDashboard(this.selectedDashboardId).pipe(
         switchMap(() => {
           // Refresh the list of dashboards after deletion
-          return this.dashboardDataService.getDashboards();
+          return this.getFilteredDashboards();
         }),
         catchError(error => {
           this.notificationService.error('Error', 'Failed to delete dashboard.');

src/app/portal-manage/dashboard-management/services/dashboard-data.service.ts

 import { Injectable } from '@angular/core';
 import { Observable, of } from 'rxjs';
 import { DashboardModel, WidgetModel } from '../models/widgets.model';
-import { HttpParams } from '@angular/common/http'; // Keep HttpParams if still used
+import { HttpParams, HttpHeaders } from '@angular/common/http'; // Keep HttpParams if still used
 import { ApiService } from '../../../core/services/api.service';
 
 @Injectable({
@@ -28,10 +28,16 @@ export class DashboardDataService {
     return this.apiService.post<DashboardModel>('dashboard', dashboard);
   }
 
-  deleteDashboard(dashboard: DashboardModel): Observable<void> {
-    // Assuming the backend expects the ID in the URL for DELETE
-    // If the backend expects the full object in the body for DELETE,
-    // you might need to adjust ApiService.delete or use apiService.post to a specific delete endpoint.
-    return this.apiService.delete<void>(`dashboard/${dashboard.dashboardId}`);
+  deleteDashboard(dashboard: DashboardModel): Observable<any> {
+    const body = {
+      dashboardId: dashboard.dashboardId
+    };
+    const options = {
+      headers: new HttpHeaders({
+        'Content-Type': 'application/json',
+      }),
+      body: body
+    };
+    return this.apiService.delete<any>('dashboard', options);
   }
 }

src/app/portal-manage/home/home.component.ts

@@ -362,6 +362,7 @@ export class HomeComponent implements OnInit {
   navigateToApp(app: AppModule) {
     // เนื่องจากทุก path ตอนนี้เริ่มด้วย /portal-manage แล้ว
     this.router.navigate([app.path]);
+    window.sessionStorage.setItem("module", app.name);
   }
 
   getAppCardClass(app: AppModule): string {

src/app/shared/components/header/header.component.html

@@ -385,7 +385,8 @@
 
                 <!-- Meeting Booking -->
                 <div class="">
-                  <a routerLink="/portal-manage/meeting-booking"
+                  <!-- <a routerLink="/portal-manage/meeting-booking" -->
+                  <a (click)="routerApp('meeting-booking')"
                     class="p-3 items-center related-app block text-center rounded-sm hover:bg-gray-50 dark:hover:bg-black/20">
                     <img src="./assets/images/logoallHR/booking.png" alt="Meeting Booking"
                       class="leading-[1.5] text-2xl !h-[1.5rem] align-middle flex justify-center mx-auto">
@@ -395,7 +396,8 @@
 
                 <!-- my-Portal -->
                 <div class="">
-                  <a routerLink="/portal-manage/my-portal"
+                  <!-- <a routerLink="/portal-manage/my-portal" -->
+                  <a (click)="routerApp('my-portal')"
                     class="p-3 items-center related-app block text-center rounded-sm hover:bg-gray-50 dark:hover:bg-black/20">
                     <img src="./assets/images/logoallHR/portal.webp" alt="my-Portal"
                       class="leading-[1.5] text-2xl !h-[1.5rem] align-middle flex justify-center mx-auto">
@@ -405,7 +407,8 @@
 
                 <!-- Permission Management -->
                 <div class="">
-                  <a routerLink="/portal-manage/permission-management"
+                  <!-- <a routerLink="/portal-manage/permission-management" -->
+                  <a (click)="routerApp('permission-management')"
                     class="p-3 items-center related-app block text-center rounded-sm hover:bg-gray-50 dark:hover:bg-black/20">
                     <img src="./assets/images/logoallHR/permission.png" alt="Permission Management"
                       class="leading-[1.5] text-2xl !h-[1.5rem] align-middle flex justify-center mx-auto">
@@ -415,7 +418,8 @@
 
                 <!-- Dashboard Management -->
                 <div class="">
-                  <a routerLink="/portal-manage/dashboard-management"
+                  <!-- <a routerLink="/portal-manage/dashboard-management" -->
+                  <a (click)="routerApp('dashboard-management')"
                     class="p-3 items-center related-app block text-center rounded-sm hover:bg-gray-50 dark:hover:bg-black/20">
                     <img src="./assets/images/logoallHR/widget.webp" alt="Dashboard Management"
                       class="leading-[1.5] text-2xl !h-[1.5rem] align-middle flex justify-center mx-auto">

src/app/shared/components/header/header.component.ts

@@ -260,6 +260,11 @@ export class HeaderComponent {
     this.router.navigate(['/portal-manage/'+appmodule])
   }
 
+  routerApp(appmodule:string){
+    this.router.navigate(['/portal-manage/'+appmodule])
+    window.sessionStorage.setItem("module", appmodule);
+  }
+
   goToHome() {
     this.router.navigate(['/home'])
   }