Add missing dev dependency ("ng2-completer": "^9.0.1") into the package.json, add missing classes

package-lock.json

@@ -15368,6 +15368,12 @@
         "tslib": "^2.0.0"
       }
     },
+    "ng2-completer": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/ng2-completer/-/ng2-completer-9.0.1.tgz",
+      "integrity": "sha512-zEKehHdCK8E/k4Y0HepprGdYBHr2AOsaq4QpeqoCyUElOOC5M3qi3ZEHV1VF54I7heBQktswwXe5UyWduJ0Xeg==",
+      "dev": true
+    },
     "ng2-smart-table": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/ng2-smart-table/-/ng2-smart-table-1.6.0.tgz",

package.json

@@ -133,6 +133,7 @@
     "karma-coverage-istanbul-reporter": "~3.0.2",
     "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
+    "ng2-completer": "^9.0.1",
     "npm-run-all": "4.0.2",
     "protractor": "~7.0.0",
     "rimraf": "2.6.1",

src/app/model/clone-dashboard.model.ts

+import { CloningOptionType } from "./enumeration/cloning-option-type.model";
+
+export interface ICloneDashboard {
+  id?: number;
+  dashboardName?: string;
+  option?: CloningOptionType | null;
+}
+
+export class CloneDashboard implements ICloneDashboard {
+  constructor(
+    public id?: number,
+    public dashboardName?: string,
+    public option?: CloningOptionType | null
+  ) {
+  }
+}
+
+export function getCloneDashboardIdentifier(cloneDashboard: ICloneDashboard): number | undefined {
+  return cloneDashboard.id;
+}
\ No newline at end of file

src/app/model/dashboard-component.model.ts

+import { IDashboardPage } from "./dashboard-page.model";
+import { ComponentType } from "./enumeration/component-type.model";
+
+export interface IDashboardComponent {
+  id?: number;
+  componentType?: ComponentType;
+  componentName?: string;
+  componentcontent?: string | null;
+  componentPosition?: string | null;
+  //createdDate?: dayjs.Dayjs | null;
+  createdBy?: string | null;
+  dashboardPage?: IDashboardPage | null;
+}
+
+export class DashboardComponent implements IDashboardComponent {
+  constructor(
+    public id?: number,
+    public componentType?: ComponentType,
+    public componentName?: string,
+    public componentcontent?: string | null,
+    public componentPosition?: string | null,
+    //public createdDate?: dayjs.Dayjs | null,
+    public createdBy?: string | null,
+    public dashboardPage?: IDashboardPage | null
+  ) {}
+}
+
+export function getDashboardComponentIdentifier(dashboardComponent: IDashboardComponent): number | undefined {
+  return dashboardComponent.id;
+}

src/app/model/dashboard-page.model.ts

+import { IDashboardComponent } from "./dashboard-component.model";
+import { MenuType } from "./enumeration/menu-type.model";
+import { IMenuItem } from "./menu-item.model";
+import { ITarget } from "./target.model";
+
+export interface IDashboardPage {
+  id?: number;
+  name?: string;
+  description?: string | null;
+  content?: string;
+  note?: string | null;
+  shared?: boolean | null;
+  pageOwner?: boolean | null;
+  type?: MenuType | null,
+  //createdDate?: dayjs.Dayjs | null;
+  createdBy?: string | null;
+  dashboardComponents?: IDashboardComponent[] | null;
+  menuItem?: IMenuItem | null;
+  targets?: ITarget[] | null;
+}
+
+export class DashboardPage implements IDashboardPage {
+  constructor(
+    public id?: number,
+    public name?: string,
+    public description?: string | null,
+    public content?: string,
+    public note?: string | null,
+    public shared?: boolean | null,
+    public pageOwner?: boolean | null,
+    public type?: MenuType | null,
+    //public createdDate?: dayjs.Dayjs | null,
+    public createdBy?: string | null,
+    public dashboardComponents?: IDashboardComponent[] | null,
+    public menuItem?: IMenuItem | null,
+    public targets?: ITarget[] | null
+  ) {
+    this.shared = this.shared ?? false;
+  }
+}
+
+export function getDashboardPageIdentifier(dashboardPage: IDashboardPage): number | undefined {
+  return dashboardPage.id;
+}
\ No newline at end of file

src/app/model/enumeration/cloning-option-type.model.ts

+export enum CloningOptionType {
+    NONE =      'NONE',
+    MENU =      'MENU',
+    TARGETS =   'TARGETS',
+    COMPONENTS ='COMPONENTS',
+    ALL =       'ALL',
+  }
+  
+  export namespace CloningOptionType {
+    export function values() {
+      return Object.keys(CloningOptionType)
+        .filter((type) => isNaN(<any>type) && type !== 'values')
+        .map((x) => {
+          return {
+            enumVal: x,
+            value: x,
+          };
+        });
+    }
+  }
\ No newline at end of file

src/app/model/enumeration/component-type.model.ts

+export enum ComponentType {
+  TEXT = 'TEXT',
+  IMAGE = 'IMAGE',
+  CHART = 'CHART',
+  IFRAME = 'IFRAME',
+  WEATHER = 'WEATHER',
+  MAP = 'MAP',
+  STATISTICS = 'STATISTICS'
+}
+
+
+export namespace ComponentType {
+  export function values() {
+    return Object.keys(ComponentType)
+      .filter((type) => isNaN(<any>type) && type !== 'values')
+      .map((x) => {
+        return {
+          enumVal: x,
+          value: x,
+        };
+      });
+  }
+}

src/app/model/enumeration/menu-type.model.ts

+export enum MenuType {
+  SHARED = 'SHARED',
+  PERSONAL = 'PERSONAL',
+}
+
+export namespace MenuType {
+  export function values() {
+    return Object.keys(MenuType)
+      .filter((type) => isNaN(<any>type) && type !== 'values')
+      .map((x) => {
+        return {
+          enumVal: x,
+          value: x,
+        };
+      });
+  }
+}
\ No newline at end of file

src/app/model/enumeration/target-type.model.ts

+export enum TargetType {
+  PERSON = 'PERSON',
+  GROUP = 'GROUP',
+  ROLE = 'ROLE',
+}
+
+export namespace TargetType {
+  export function values() {
+    return Object.keys(TargetType)
+      .filter((type) => isNaN(<any>type) && type !== 'values')
+      .map((x) => {
+        return {
+          enumVal: x,
+          value: x,
+        };
+      });
+  }
+}
\ No newline at end of file

src/app/model/group-representation.model.ts

+
+export interface IGroupRepresentation {
+    id?: string;
+    name?: string;
+    path?: string;
+    subGroups?: Array<IGroupRepresentation>;
+  }
+  
+  export class GroupRepresentation implements IGroupRepresentation {
+    constructor(
+      public id?: string,
+      public name?: string,
+      public path?: string,
+      public subGroups?:  Array<IGroupRepresentation>
+    ) {}
+  }
+  
+  export function getGroupRepresentationIdentifier(groupRepresentation: IGroupRepresentation): string | undefined {
+    return groupRepresentation.id;
+  }
\ No newline at end of file

src/app/model/menu-block.model.ts

+import { MenuType } from "./enumeration/menu-type.model";
+import { IMenuItem } from "./menu-item.model";
+
+export interface IMenuBlock {
+    id?: number;
+    code?: string;
+    label?: string;
+    order?: number | null;
+    type?: MenuType;
+    icon?: string;
+    //createdDate?: dayjs.Dayjs | null;
+    createdBy?: string | null;
+    linkedItems?: IMenuItem[] | null;
+  }
+  
+  export class MenuBlock implements IMenuBlock {
+    constructor(
+      public id?: number,
+      public code?: string,
+      public label?: string,
+      public order?: number | null,
+      public type?: MenuType,
+      public icon?: string,
+      //public createdDate?: dayjs.Dayjs | null,
+      public createdBy?: string | null,
+      public linkedItems?: IMenuItem[] | null
+    ) {}
+  }
+  
+  export function getMenuBlockIdentifier(menuBlock: IMenuBlock): number | undefined {
+    return menuBlock.id;
+  }
\ No newline at end of file

src/app/model/menu-item.model.ts

+import { IDashboardPage } from "./dashboard-page.model";
+import { MenuType } from "./enumeration/menu-type.model";
+import { IMenuBlock } from "./menu-block.model";
+
+export interface IMenuItem {
+  id?: number;
+  code?: string;
+  label?: string;
+  order?: number | null;
+  type?: MenuType;
+  icon?: string;
+  //createdDate?: dayjs.Dayjs | null;
+  createdBy?: string | null;
+  dashboardPage?: IDashboardPage | null;
+  menuBlock?: IMenuBlock | null;
+}
+
+export class MenuItem implements IMenuItem {
+  constructor(
+    public id?: number,
+    public code?: string,
+    public label?: string,
+    public order?: number | null,
+    public type?: MenuType,
+    public icon?: string,
+    //public createdDate?: dayjs.Dayjs | null,
+    public createdBy?: string | null,
+    public dashboardPage?: IDashboardPage | null,
+    public menuBlock?: IMenuBlock | null
+  ) {}
+}
+
+export function getMenuItemIdentifier(menuItem: IMenuItem): number | undefined {
+  return menuItem.id;
+}

src/app/model/role-representation.model.ts

+
+export interface IRoleRepresentation {
+    id?: string;
+    name?: string;
+    description?: string;
+    composite?: boolean;
+    clientRole?: boolean;
+  }
+  
+  export class RoleRepresentation implements IRoleRepresentation {
+    constructor(
+      public id?: string,
+      public name?: string,
+      public description?: string,
+      public composite?: boolean,
+      public clientRole?: boolean
+    ) {}
+  }
+  
+  export function getRoleRepresentationIdentifier(roleRepresentation: IRoleRepresentation): string | undefined {
+    return roleRepresentation.id;
+  }
\ No newline at end of file

src/app/model/target-available.model.ts

+import { TargetType } from "./enumeration/target-type.model";
+
+export interface ITargetAvailable {
+  id?: number;
+  type?: TargetType;
+  code?: string;
+  value?: string;
+  //createdDate?: dayjs.Dayjs | null;
+  createdBy?: string | null;
+}
+
+export class TargetAvailable implements ITargetAvailable {
+  constructor(
+    public id?: number,
+    public type?: TargetType,
+    public code?: string,
+    public value?: string,
+    //public createdDate?: dayjs.Dayjs | null,
+    public createdBy?: string | null
+  ) {}
+}
+
+export function getTargetAvailableIdentifier(targetAvailable: ITargetAvailable): number | undefined {
+  return targetAvailable.id;
+}
\ No newline at end of file

src/app/model/target.model.ts

+import { IDashboardPage } from "./dashboard-page.model";
+import { TargetType } from "./enumeration/target-type.model";
+
+export interface ITarget {
+  id?: number;
+  type?: TargetType;
+  name?: string;
+  note?: string | null;
+  //createdDate?: dayjs.Dayjs | null;
+  createdBy?: string | null;
+  dashboardPage?: IDashboardPage | null;
+}
+
+export class Target implements ITarget {
+  constructor(
+    public id?: number,
+    public type?: TargetType,
+    public name?: string,
+    public note?: string | null,
+    //public createdDate?: dayjs.Dayjs | null,
+    public createdBy?: string | null,
+    public dashboardPage?: IDashboardPage | null
+  ) {}
+}
+
+export function getTargetIdentifier(target: ITarget): number | undefined {
+  return target.id;
+}
\ No newline at end of file

src/app/model/user.model.ts

+
+export interface IUser {
+  id?: string;
+  username?: string;
+  firstName?: string;
+  lastName?: string;
+  email?: string;
+}
+
+export class User implements IUser {
+  constructor(
+    public id?: string,
+    public username?: string,
+    public firstName?: string,
+    public lastName?: string,
+    public email?: string
+  ) {}
+}
+
+export function getUserIdentifier(user: IUser): string | undefined {
+  return user.id;
+}
\ No newline at end of file

src/app/pages/dashboard-management/chart-view/chart-view.component.html

+
+<div [innerHTML]="chartContent | safeHtml">
+</div>
+
+<!--
+<iframe [src]="chartContent | safeHtml"></iframe>
+-->

src/app/pages/dashboard-management/chart-view/chart-view.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ChartViewComponent } from './chart-view.component';
+
+describe('ChartViewComponent', () => {
+  let component: ChartViewComponent;
+  let fixture: ComponentFixture<ChartViewComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ChartViewComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ChartViewComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/dashboard-management/chart-view/chart-view.component.ts

+import { Component, Input, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'ngx-chart-view',
+  templateUrl: './chart-view.component.html',
+  styleUrls: ['./chart-view.component.scss']
+})
+export class ChartViewComponent implements OnInit {
+  @Input() chartContent: string;
+
+  constructor() { 
+  }
+
+  ngOnInit(): void {
+  }
+
+}