ย้าย path widgets

angular.json

@@ -44,7 +44,7 @@
           "builder": "@angular-devkit/build-angular:application",
           "options": {
             "allowedCommonJsDependencies": [
-              "dragula","can-use-dom","moment","leaflet","filepond","dropzone","apexcharts","sweetalert"
+              "dragula","can-use-dom","moment","leaflet","filepond","dropzone","apexcharts","sweetalert","ng-drag-drop","quill"
             ],
             "outputPath": "dist",
             "index": "src/index.html",
@@ -71,13 +71,13 @@
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "20mb",
-                  "maximumError": "20mb"
+                  "maximumWarning": "8mb",
+                  "maximumError": "15mb"
                 },
                 {
                   "type": "anyComponentStyle",
-                  "maximumWarning": "20mb",
-                  "maximumError": "20mb"
+                  "maximumWarning": "3mb",
+                  "maximumError": "5mb"
                 }
               ],
               "fileReplacements": [

src/app/app.config.ts

@@ -21,10 +21,11 @@ import { HttpRequestInterceptor } from './shared/services/http-request.intercept
 import { AuthService } from './shared/services/auth.service';
 import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { TranslateHttpLoader } from '@ngx-translate/http-loader';
-import { DashboardDataService } from './shared/services/dashboard-data.service';
 import { provideStore, provideState } from '@ngrx/store';
 import { provideEffects } from '@ngrx/effects';
 import { provideStoreDevtools } from '@ngrx/store-devtools';
+import { DashboardDataService } from './portal-manage/dashboard-management/services/dashboard-data.service';
+import { DatasetService } from './portal-manage/dashboard-management/services/dataset.service';
 
 export function HttpLoaderFactory(http: HttpClient) {
   return new TranslateHttpLoader(http, "./assets/i18n/", ".json");
@@ -76,7 +77,6 @@ export const appConfig: ApplicationConfig = {
       DialogModule
     ),
     httpInterceptorProviders,
-    DashboardDataService,
     provideStore(),
     provideStoreDevtools({ maxAge: 25, logOnly: environment.production })
   ]

src/app/app.routes.ts

@@ -11,7 +11,7 @@ import { LoginComponent } from './authentication/login/login.component';
 import { CoverComponent } from './components/authentication/reset-password/cover/cover.component';
 import { HomeComponent } from './portal-manage/home/home.component';
 import { FramelessLayoutComponent } from './shared/layouts/frameless-layout.component';
-import { DashboardViewerComponent } from './portal-manage/dashboard-viewer/dashboard-viewer.component';
+import { DashboardViewerComponent } from './portal-manage/dashboard-management/dashboard-viewer/dashboard-viewer.component';
 import { UnauthorizedComponent } from './core/components/unauthorized.component';
 
 export const App_Route: Route[] = [

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

@@ -10,31 +10,32 @@ import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { NotificationService } from '../../shared/services/notification.service';
 import { DialogModule, DialogComponent } from '@syncfusion/ej2-angular-popups';
 
-import { DashboardModel, WidgetModel, DatasetModel } from '../models/widgets.model';
-import { MenuItemsWidget } from '../models/m-menuitems-widget.model';
-import { DashboardDataService } from '../services/dashboard-data.service';
-import { MMenuitemsWidgetService } from '../services/m-menuitems-widget.service';
-import { DashboardStateService, SelectedDataset } from '../services/dashboard-state.service';
-import { WidgetStateService } from '../services/widget-state.service'; // Import WidgetStateService
-import { WidgetComponentRegistryService } from '../services/widget-component-registry.service';
+import { DashboardModel, WidgetModel, DatasetModel } from './models/widgets.model';
+import { MenuItemsWidget } from './models/m-menuitems-widget.model';
+import { DashboardDataService } from './services/dashboard-data.service';
+import { MMenuitemsWidgetService } from './services/m-menuitems-widget.service';
+import { DashboardStateService, SelectedDataset } from './services/dashboard-state.service';
+import { WidgetStateService } from './services/widget-state.service'; // Import WidgetStateService
+
 
 import { WidgetConfigComponent } from './widget-config/widget-config.component';
 
 // Import all the widget components
-import { CompanyInfoWidgetComponent } from '../widgets/company-info-widget.component';
-import { HeadcountWidgetComponent } from '../widgets/headcount-widget.component';
-import { AttendanceOverviewWidgetComponent } from '../widgets/attendance-overview-widget.component';
-import { PayrollSummaryWidgetComponent } from '../widgets/payroll-summary-widget.component';
-import { EmployeeDirectoryWidgetComponent } from '../widgets/employee-directory-widget.component';
-import { WelcomeWidgetComponent } from '../widgets/welcome-widget/welcome-widget.component';
-import { QuickLinksWidgetComponent } from '../widgets/quick-links-widget/quick-links-widget.component';
-import { SyncfusionDatagridWidgetComponent } from '../widgets/syncfusion-datagrid-widget/syncfusion-datagrid-widget.component';
-import { SyncfusionPivotWidgetComponent } from '../widgets/syncfusion-pivot-widget/syncfusion-pivot-widget.component';
-import { SyncfusionChartWidgetComponent } from '../widgets/syncfusion-chart-widget/syncfusion-chart-widget.component';
+import { CompanyInfoWidgetComponent } from './widgets/company-info-widget.component';
+import { HeadcountWidgetComponent } from './widgets/headcount-widget.component';
+import { AttendanceOverviewWidgetComponent } from './widgets/attendance-overview-widget.component';
+import { PayrollSummaryWidgetComponent } from './widgets/payroll-summary-widget.component';
+import { EmployeeDirectoryWidgetComponent } from './widgets/employee-directory-widget.component';
+import { WelcomeWidgetComponent } from './widgets/welcome-widget/welcome-widget.component';
+import { QuickLinksWidgetComponent } from './widgets/quick-links-widget/quick-links-widget.component';
+import { SyncfusionDatagridWidgetComponent } from './widgets/syncfusion-datagrid-widget/syncfusion-datagrid-widget.component';
+import { SyncfusionPivotWidgetComponent } from './widgets/syncfusion-pivot-widget/syncfusion-pivot-widget.component';
+import { SyncfusionChartWidgetComponent } from './widgets/syncfusion-chart-widget/syncfusion-chart-widget.component';
 import { DatasetPickerComponent } from './dataset-picker.component';
-import { SimpleKpiWidgetComponent } from '../widgets/simple-kpi-widget/simple-kpi-widget.component';
+import { SimpleKpiWidgetComponent } from './widgets/simple-kpi-widget/simple-kpi-widget.component';
 import { ChartAllModule, AccumulationChartAllModule } from '@syncfusion/ej2-angular-charts';
 import { HttpClientModule } from '@angular/common/http';
+import { WidgetComponentRegistryService } from './services/widget-component-registry.service';
 
 export interface DashboardPanel extends PanelModel {
   componentType: Type<any>;

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

@@ -50,7 +50,7 @@ export interface DashboardPanel extends PanelModel {
   selector: 'app-dashboard-viewer',
   standalone: true,
   imports: [
-    CommonModule, RouterModule, DashboardLayoutModule, NgComponentOutlet, 
+    CommonModule, RouterModule, DashboardLayoutModule, NgComponentOutlet,
     // Add all widget components here to make them available for NgComponentOutlet
     CompanyInfoWidgetComponent, HeadcountWidgetComponent, AttendanceOverviewWidgetComponent, PayrollSummaryWidgetComponent, EmployeeDirectoryWidgetComponent, KpiWidgetComponent, WelcomeWidgetComponent, ChartWidgetComponent, QuickLinksWidgetComponent, SyncfusionDatagridWidgetComponent, SyncfusionPivotWidgetComponent, SyncfusionChartWidgetComponent, DataTableWidgetComponent, AreaChartWidgetComponent, BarChartWidgetComponent, PieChartWidgetComponent, ScatterBubbleChartWidgetComponent, MultiRowCardWidgetComponent, ComboChartWidgetComponent, DoughnutChartWidgetComponent, FunnelChartWidgetComponent, GaugeChartWidgetComponent, SimpleKpiWidgetComponent, FilledMapWidgetComponent, MatrixWidgetComponent, SlicerWidgetComponent, SimpleTableWidgetComponent, WaterfallChartWidgetComponent, TreemapWidgetComponent
   ],

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

@@ -3,8 +3,8 @@ import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 import { Observable } from 'rxjs';
-import { DatasetModel } from '../models/widgets.model';
-import { DatasetService } from '../services/dataset.service';
+import { DatasetModel } from './models/widgets.model';
+import { DatasetService } from './services/dataset.service';
 
 @Component({
   selector: 'app-dataset-picker',

src/app/portal-manage/models/widgets.model.ts → src/app/portal-manage/dashboard-management/models/widgets.model.ts

-import { environment } from "../../../environments/environment";
-import { TagModel } from "./tag.mmodel"
-import { GroupModel } from "./group.mmodel"
 
 export interface IDataset {
   itemId: string;

src/app/portal-manage/services/dashboard-data.service.ts → 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 { ApiService } from '../../../app/core/services/api.service'; // Corrected import path
 import { HttpParams } from '@angular/common/http'; // Keep HttpParams if still used
+import { ApiService } from '../../../core/services/api.service';
 
 @Injectable({
   providedIn: 'root'

src/app/portal-manage/services/m-menuitems-widget.service.ts → src/app/portal-manage/dashboard-management/services/m-menuitems-widget.service.ts

@@ -3,8 +3,9 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Observable, of } from 'rxjs';
 import { map, catchError } from 'rxjs/operators'; // Removed tap
 import { MenuItemsWidget } from '../models/m-menuitems-widget.model';
-import { environment } from '../../../environments/environment';
-import { TokenService } from '../../shared/services/token.service'; // Import TokenService
+import { TokenService } from '../../../shared/services/token.service';
+import { environment } from '../../../../environments/environment';
+ // Import TokenService
 
 @Injectable({
   providedIn: 'root'

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

 import { Injectable } from '@angular/core';
-import { environment } from "../../../environments/environment";
+
 import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Observable, of } from 'rxjs';
 import { map, tap } from 'rxjs/operators';
 import { WidgetModel } from '../models/widgets.model';
-import { DocumentContentModel } from '../models/document-content.model';
-import { TokenService } from '../../shared/services/token.service';
+import { TokenService } from '../../../shared/services/token.service';
+import { environment } from '../../../../environments/environment';
+import { DocumentContentModel } from '../../models/document-content.model';
 
 
 @Injectable({

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

@@ -9,8 +9,8 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { FormsModule } from '@angular/forms';
-import { WidgetConfigGeneratorService } from '../../services/widget-config-generator.service';
-import { WidgetModel } from '../../models/widgets.model';
+import { WidgetConfigGeneratorService } from '../services/widget-config-generator.service';
+import { WidgetModel } from '../models/widgets.model';
 
 export interface WidgetConfigDialogData {
   widget: WidgetModel;

src/app/portal-manage/widget-management/dataset-widget-linker.component.ts → src/app/portal-manage/dashboard-management/widget-management/dataset-widget-linker.component.ts

@@ -9,13 +9,12 @@ import { DialogComponent, DialogModule } from '@syncfusion/ej2-angular-popups';
 import { GridComponent, GridModule, PageService, SelectionService } from '@syncfusion/ej2-angular-grids';
 import { ButtonModule } from '@syncfusion/ej2-angular-buttons';
 
-import { NotificationService } from '../../shared/services/notification.service';
+import { NotificationService } from '../../../shared/services/notification.service';
 import { WidgetService } from '../services/widgets.service';
 import { MMenuitemsWidgetService } from '../services/m-menuitems-widget.service';
 import { DatasetService } from '../services/dataset.service';
 import { WidgetModel, DatasetModel } from '../models/widgets.model';
 import { MenuItemsWidget } from '../models/m-menuitems-widget.model';
-import { WidgetConfigComponent } from '../dashboard-management/widget-config/widget-config.component';
 import { take } from 'rxjs/operators';
 import { DashboardStateService } from '../services/dashboard-state.service';
 
@@ -52,6 +51,7 @@ import { SlicerWidgetComponent } from '../widgets/slicer-widget/slicer-widget.co
 import { SimpleTableWidgetComponent } from '../widgets/simple-table-widget/simple-table-widget.component';
 import { WaterfallChartWidgetComponent } from '../widgets/waterfall-chart-widget/waterfall-chart-widget.component';
 import { TreemapWidgetComponent } from '../widgets/treemap-widget/treemap-widget.component';
+import { WidgetConfigComponent } from '../widget-config/widget-config.component';
 
 // Interface for the panel object used by ngComponentOutlet
 export interface DashboardPanel extends PanelModel {

src/app/portal-manage/widget-management/widget-list.component.ts → src/app/portal-manage/dashboard-management/widget-management/widget-list.component.ts

@@ -29,7 +29,7 @@ import { QuickLinksWidgetComponent } from '../widgets/quick-links-widget/quick-l
 import { SyncfusionDatagridWidgetComponent } from '../widgets/syncfusion-datagrid-widget/syncfusion-datagrid-widget.component';
 import { SyncfusionPivotWidgetComponent } from '../widgets/syncfusion-pivot-widget/syncfusion-pivot-widget.component';
 import { SyncfusionChartWidgetComponent } from '../widgets/syncfusion-chart-widget/syncfusion-chart-widget.component';
-import { NotificationService } from '../../shared/services/notification.service';
+import { NotificationService } from '../../../shared/services/notification.service';
 import { WidgetModel } from '../models/widgets.model';
 import { WidgetService } from '../services/widgets.service';
 import { SimpleKpiWidgetComponent } from '../widgets/simple-kpi-widget/simple-kpi-widget.component';

src/app/portal-manage/widgets/base-widget.component.ts → src/app/portal-manage/dashboard-management/widgets/base-widget.component.ts

@@ -33,7 +33,7 @@ export abstract class BaseWidgetComponent implements OnInit, OnDestroy {
         } else {
           // If no dataset is selected, just keep showing the initial config with a loading state.
           // The initial state is set by applyInitialConfig().
-          this.isLoading = true; 
+          this.isLoading = true;
         }
       },
       error: (err) => {

src/app/portal-manage/widgets/chart-widget/chart-widget.component.ts → src/app/portal-manage/dashboard-management/widgets/chart-widget/chart-widget.component.ts

@@ -13,7 +13,7 @@ declare var ApexCharts: any;
 })
 export class ChartWidgetComponent extends BaseWidgetComponent implements AfterViewInit {
   @ViewChild('chart') chartElement!: ElementRef;
-  
+
   private chartInstance: any;
 
   constructor(protected override dashboardStateService: DashboardStateService) {
@@ -55,7 +55,7 @@ export class ChartWidgetComponent extends BaseWidgetComponent implements AfterVi
       data: [10, 41, 35, 51, 49, 62, 69, 91, 148]
     }];
     const defaultCategories = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep'];
-    
+
     if (this.chartInstance) {
         this.chartInstance.updateOptions(this.getChartOptions(defaultSeries, defaultCategories));
     }

src/app/portal-manage/widgets/payroll-summary-widget.component.ts → src/app/portal-manage/dashboard-management/widgets/payroll-summary-widget.component.ts

 
 import { Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { DashboardStateService } from '../services/dashboard-state.service';
+
 import { BaseWidgetComponent } from './base-widget.component';
+import { DashboardStateService } from '../services/dashboard-state.service';
 
 @Component({
   selector: 'app-payroll-summary-widget',

src/app/portal-manage/widgets/quick-links-widget/quick-links-widget.component.ts → src/app/portal-manage/dashboard-management/widgets/quick-links-widget/quick-links-widget.component.ts

@@ -23,9 +23,9 @@ export class QuickLinksWidgetComponent extends BaseWidgetComponent {
 
   onDataUpdate(data: any[]): void {
     if (this.config.nameField && this.config.urlField) {
-      this.quickLinks = data.map(item => ({ 
-        name: item[this.config.nameField], 
-        url: item[this.config.urlField], 
+      this.quickLinks = data.map(item => ({
+        name: item[this.config.nameField],
+        url: item[this.config.urlField],
         icon: this.config.iconField ? item[this.config.iconField] : 'link-45deg'
       }));
     }

src/app/portal-manage/widgets/treemap-widget/treemap-widget.component.ts → src/app/portal-manage/dashboard-management/widgets/treemap-widget/treemap-widget.component.ts

@@ -23,7 +23,7 @@ export class TreemapWidgetComponent extends BaseWidgetComponent {
   applyInitialConfig(): void {
     this.title = this.config.title || 'Treemap';
     this.weightValuePath = this.config.valueField;
-    this.leafItemSettings = { 
+    this.leafItemSettings = {
       labelPath: this.config.groupField,
       showLabels: true
     };
@@ -45,7 +45,7 @@ export class TreemapWidgetComponent extends BaseWidgetComponent {
       { group: 'North America', country: 'Canada', value: 38 },
     ];
     this.weightValuePath = 'value';
-    this.leafItemSettings = { 
+    this.leafItemSettings = {
       labelPath: 'country',
       showLabels: true
     };

src/app/portal-manage/portal-manage.routes.ts

 import { Routes } from '@angular/router';
 import { DashboardManagementComponent } from './dashboard-management/dashboard-management.component';
-import { DashboardViewerComponent } from './dashboard-viewer/dashboard-viewer.component';
-import { WidgetListComponent } from './widget-management/widget-list.component';
-import { WidgetFormComponent } from './widget-management/widget-form.component';
+import { DashboardViewerComponent } from './dashboard-management/dashboard-viewer/dashboard-viewer.component';
+import { WidgetListComponent } from './dashboard-management/widget-management/widget-list.component';
+import { WidgetFormComponent } from './dashboard-management/widget-management/widget-form.component';
 import { moduleAccessGuard } from '../core/guards/module-access.guard';
-import { DatasetWidgetLinkerComponent } from './widget-management/dataset-widget-linker.component';
+import { DatasetWidgetLinkerComponent } from './dashboard-management/widget-management/dataset-widget-linker.component';
 import { HomeComponent } from './home/home.component';
 import { MeetingBookingComponent } from './meeting-booking/meeting-booking.component';
 import { MenuPermissionManagementComponent } from './menu-permission-management/menu-permission-management.component';
@@ -99,7 +99,7 @@ export const portalManageRoutes: Routes = [
     {
         path: 'widget-management',
         canActivate: [moduleAccessGuard],
-        loadChildren: () => import('./widget-management/widget-management.module').then(m => m.WidgetManagementModule)
+        loadChildren: () => import('./dashboard-management/widget-management/widget-management.module').then(m => m.WidgetManagementModule)
     },
 
     // Dashboard Management

src/app/shared/services/dashboard-data.service.ts

-import { Injectable } from '@angular/core';
-import { Observable, of, throwError } from 'rxjs';
-import { catchError } from 'rxjs/operators';
-import { DashboardModel, WidgetModel, DatasetModel } from '../../portal-manage/models/widgets.model';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class DashboardDataService {
-
-  constructor() { }
-
-  // // Dashboard methods
-  // getDashboards(): Observable<DashboardModel[]> {
-  //   return of(this.mockDashboards).pipe(catchError(this.handleError));
-  // }
-
-  // addDashboard(dashboard: DashboardModel): Observable<DashboardModel> {
-  //   this.mockDashboards.push(dashboard);
-  //   return of(dashboard).pipe(catchError(this.handleError));
-  // }
-
-
-  // Widget methods
-  // getWidgets(): Observable<WidgetModel[]> {
-  //   return of(this.mockWidgets).pipe(catchError(this.handleError));
-  // }
-
-  // // Dataset methods
-  // getDatasets(): Observable<DatasetModel[]> {
-  //   return of(this.mockDatasets).pipe(catchError(this.handleError));
-  // }
-
-  // getDatasetById(id: string): Observable<DatasetModel | undefined> {
-  //   return of(this.mockDatasets.find(ds => ds.id === id)).pipe(catchError(this.handleError));
-  // }
-
-  private handleError(error: any) {
-    console.error(error);
-    return throwError(() => new Error('Something went wrong. Please try again later.'));
-  }
-}