From 9298dd80b69ac553009ffa363878c0f9518ea265 Mon Sep 17 00:00:00 2001 From: sepehr Date: Sun, 29 Mar 2026 16:43:30 +0300 Subject: [PATCH] Upgrade to angular 18, Replace gui-grid with PrimeNG table since gui-grid not developed anymore,Fix typo , Fix minor ui/ux bugs --- angular.json | 2 +- package.json | 33 +- src/app/app.module.ts | 118 +- src/app/containers/default-layout/_nav.ts | 5 +- src/app/providers/mikrowizard/provider.ts | 2 +- src/app/views/acc_log/acc.component.html | 190 ++- src/app/views/acc_log/acc.component.ts | 110 +- src/app/views/acc_log/acc.module.ts | 8 +- src/app/views/auth_log/auth.component.html | 234 +++- src/app/views/auth_log/auth.component.ts | 72 +- src/app/views/auth_log/auth.module.ts | 10 +- src/app/views/backups/backups.component.html | 182 +-- src/app/views/backups/backups.component.ts | 64 +- src/app/views/backups/backups.module.ts | 8 +- src/app/views/cloner/cloner.component.html | 715 +++++++----- src/app/views/cloner/cloner.component.ts | 97 +- src/app/views/cloner/cloner.module.ts | 8 +- .../views/dashboard/dashboard.component.html | 12 +- .../active-users/active-users.component.html | 7 +- .../views/device_detail/device.component.html | 177 +-- .../views/device_detail/device.component.scss | 3 - .../views/device_detail/device.component.ts | 71 +- src/app/views/device_detail/device.module.ts | 8 +- .../dhcp-info/dhcp-info.component.html | 212 ++-- .../dhcp-info/dhcp-info.component.ts | 22 +- .../dhcp-info/dhcp-info.module.ts | 8 +- .../ping-status/ping-status.component.html | 3 +- .../views/device_logs/devlogs.component.html | 267 +++-- .../views/device_logs/devlogs.component.ts | 132 +-- src/app/views/device_logs/devlogs.module.ts | 10 +- src/app/views/devices/devices.component.html | 455 +++++--- src/app/views/devices/devices.component.ts | 69 +- src/app/views/devices/devices.module.ts | 12 +- .../devices_group/devgroup.component.html | 390 ++++--- .../views/devices_group/devgroup.component.ts | 79 +- .../views/devices_group/devgroup.module.ts | 8 +- .../permissions/permissions.component.html | 84 +- .../permissions/permissions.component.ts | 37 +- .../views/permissions/permissions.module.ts | 8 +- .../views/sequences/sequences.component.html | 385 +++--- .../views/sequences/sequences.component.ts | 54 +- src/app/views/sequences/sequences.module.ts | 8 +- .../views/settings/settings.component.html | 1036 +++++++++-------- .../views/settings/settings.component.scss | 74 +- src/app/views/settings/settings.component.ts | 60 +- src/app/views/settings/settings.module.ts | 8 +- .../views/snippets/snippets.component.html | 304 +++-- src/app/views/snippets/snippets.component.ts | 80 +- src/app/views/snippets/snippets.module.ts | 8 +- .../syslog-regex/syslog-regex.component.html | 141 ++- .../syslog-regex/syslog-regex.component.scss | 33 +- .../syslog-regex/syslog-regex.component.ts | 8 +- .../views/syslog-regex/syslog-regex.module.ts | 12 +- src/app/views/syslog/syslog-routing.module.ts | 2 +- src/app/views/syslog/syslog.component.html | 180 ++- src/app/views/syslog/syslog.component.ts | 120 +- src/app/views/syslog/syslog.module.ts | 8 +- .../user_manager/user_manager.component.html | 672 ++++++----- .../user_manager/user_manager.component.ts | 211 ++-- .../views/user_manager/user_manager.module.ts | 8 +- .../user_tasks/user_tasks.component.html | 249 ++-- .../views/user_tasks/user_tasks.component.ts | 68 +- src/app/views/user_tasks/user_tasks.module.ts | 8 +- src/app/views/vault/vault.component.html | 312 +++-- src/app/views/vault/vault.component.ts | 85 +- src/app/views/vault/vault.module.ts | 8 +- src/app/views/vault/vault.scss | 19 - src/app/views/vpn/vpn.component.html | 388 +++--- src/app/views/vpn/vpn.component.ts | 28 +- src/app/views/vpn/vpn.module.ts | 8 +- src/scss/_custom.scss | 227 ++-- src/scss/styles.scss | 3 +- tsconfig.app.json | 3 +- tsconfig.json | 8 +- 74 files changed, 4845 insertions(+), 3913 deletions(-) diff --git a/angular.json b/angular.json index 739942a..817e16e 100644 --- a/angular.json +++ b/angular.json @@ -61,7 +61,7 @@ { "type": "anyComponentStyle", "maximumWarning": "2kb", - "maximumError": "6kb" + "maximumError": "10kb" } ], "outputHashing": "all" diff --git a/package.json b/package.json index 8c63917..37eb562 100644 --- a/package.json +++ b/package.json @@ -19,17 +19,17 @@ }, "private": true, "dependencies": { - "@angular/animations": "^17.3.5", + "@angular/animations": "^18.2.14", "@angular/cdk": "^16.2.9", - "@angular/common": "^17.3.5", - "@angular/compiler": "^17.3.5", - "@angular/core": "^17.3.5", - "@angular/forms": "^17.3.5", - "@angular/language-service": "^17.3.5", + "@angular/common": "^18.2.14", + "@angular/compiler": "^18.2.14", + "@angular/core": "^18.2.14", + "@angular/forms": "^18.2.14", + "@angular/language-service": "^18.2.14", "@angular/material": "^17.3.5", - "@angular/platform-browser": "^17.3.5", - "@angular/platform-browser-dynamic": "^17.3.5", - "@angular/router": "^17.3.5", + "@angular/platform-browser": "^18.2.14", + "@angular/platform-browser-dynamic": "^18.2.14", + "@angular/router": "^18.2.14", "@coreui/angular": "~4.5.27", "@coreui/angular-chartjs": "~4.5.27", "@coreui/chartjs": "^3.1.2", @@ -42,6 +42,7 @@ "@generic-ui/fabric": "^0.19.0", "@generic-ui/hermes": "^0.19.0", "@generic-ui/ngx-grid": "^0.19.0", + "@primeuix/themes": "^2.0.3", "chart.js": "^3.9.1", "date-fns": "^3.6.0", "date-fns-jalali": "^3.6.0-0", @@ -61,17 +62,21 @@ "ngx-material-date-fns-adapter": "^18.0.0", "ngx-scrollbar": "^13.0.3", "ngx-super-select": "^3.17.0", + "primeicons": "^7.0.0", + "primeng": "^18.0.2", "rxjs": "~7.8.1", "tslib": "^2.3.0", "vis-data": "^7.1.9", "vis-network": "^9.1.9", - "zone.js": "~0.14.4" + "vis-util": "^6.0.0", + "zone.js": "~0.14.10" }, "devDependencies": { - "@angular-devkit/build-angular": "^17.3.5", - "@angular/cli": "^17.3.5", - "@angular/compiler-cli": "^17.3.5", - "@angular/localize": "^17.3.5", + "@angular-devkit/build-angular": "^18.2.21", + "@angular/cli": "^18.2.21", + "@angular/compiler-cli": "^18.2.14", + "@angular/localize": "^18.2.14", + "@types/hammerjs": "^2.0.46", "@types/jasmine": "^5.1.1", "@types/lodash-es": "^4.17.10", "@types/node": "^18.19.34", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index bb74798..2384b03 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,10 +2,13 @@ import { NgModule ,APP_INITIALIZER} from '@angular/core'; import { HashLocationStrategy, LocationStrategy, PathLocationStrategy } from '@angular/common'; import { BrowserModule, Title } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { provideAnimationsAsync } from '@angular/platform-browser/animations/async'; +import { providePrimeNG } from 'primeng/config'; +import Aura from '@primeuix/themes/aura'; import { ReactiveFormsModule,FormsModule } from '@angular/forms'; import { NgScrollbarModule } from 'ngx-scrollbar'; -import { HttpClientModule } from '@angular/common/http'; +import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; // Import routing module import { AppRoutingModule } from './app-routing.module'; @@ -54,60 +57,63 @@ const APP_CONTAINERS = [ export function loginStatusProviderFactory(provider: loginChecker) { return () => provider.load(); } -@NgModule({ - declarations: [AppComponent, ...APP_CONTAINERS], - imports: [ - BrowserModule, - BrowserAnimationsModule, - AppRoutingModule, - AvatarModule, - BreadcrumbModule, - FooterModule, - DropdownModule, - GridModule, - HeaderModule, - SidebarModule, - IconModule, - NavModule, - HttpClientModule, - ButtonModule, - FormModule, - UtilitiesModule, - ButtonGroupModule, - ReactiveFormsModule, - FormsModule, - SidebarModule, - SharedModule, - TabsModule, - ListGroupModule, - ProgressModule, - BadgeModule, - ListGroupModule, - CardModule, - NgScrollbarModule, - ModalModule, - FontAwesomeModule, - TableModule - ], - providers: [ - { - provide: LocationStrategy, - useClass: HashLocationStrategy - }, - MikroWizardProvider, - dataProvider, - loginChecker, - IconSetService, - provideDateFnsAdapter(), - { - provide: APP_INITIALIZER, - useFactory: loginStatusProviderFactory, - deps: [loginChecker], - multi: true, - }, - Title - ], - bootstrap: [AppComponent] -}) +@NgModule({ declarations: [AppComponent, ...APP_CONTAINERS], + bootstrap: [AppComponent], imports: [BrowserModule, + BrowserAnimationsModule, + AppRoutingModule, + AvatarModule, + BreadcrumbModule, + FooterModule, + DropdownModule, + GridModule, + HeaderModule, + SidebarModule, + IconModule, + NavModule, + ButtonModule, + FormModule, + UtilitiesModule, + ButtonGroupModule, + ReactiveFormsModule, + FormsModule, + SidebarModule, + SharedModule, + TabsModule, + ListGroupModule, + ProgressModule, + BadgeModule, + ListGroupModule, + CardModule, + NgScrollbarModule, + ModalModule, + FontAwesomeModule, + TableModule], providers: [ + { + provide: LocationStrategy, + useClass: HashLocationStrategy + }, + MikroWizardProvider, + dataProvider, + loginChecker, + IconSetService, + provideDateFnsAdapter(), + provideAnimationsAsync(), + providePrimeNG({ + theme: { + preset: Aura, + options: { + darkModeSelector: 'none' + } + } + }), + { + provide: APP_INITIALIZER, + useFactory: loginStatusProviderFactory, + deps: [loginChecker], + multi: true, + }, + Title, + provideHttpClient(withInterceptorsFromDi()) + ] }) export class AppModule { } diff --git a/src/app/containers/default-layout/_nav.ts b/src/app/containers/default-layout/_nav.ts index 830b492..ef78bee 100644 --- a/src/app/containers/default-layout/_nav.ts +++ b/src/app/containers/default-layout/_nav.ts @@ -18,9 +18,10 @@ export const navItems: INavData[] = [ name: 'Device Managment' }, { - name: 'VPN Server', + name: 'WireGuard Server', url: '/vpn', - icon: 'fa-solid fa-network-wired' + icon: 'fa-solid fa-network-wired', + attributes: { 'pro': true } }, { name: 'Devices', diff --git a/src/app/providers/mikrowizard/provider.ts b/src/app/providers/mikrowizard/provider.ts index ac7deb4..39e39d4 100644 --- a/src/app/providers/mikrowizard/provider.ts +++ b/src/app/providers/mikrowizard/provider.ts @@ -1,6 +1,6 @@ import { Injectable, Inject } from '@angular/core'; -import { HttpClient,HttpResponse } from '@angular/common/http'; +import { HttpClient, HttpResponse } from '@angular/common/http'; class Cookies { // cookies doesn't work with Android default browser / Ionic private session_id: string = ""; diff --git a/src/app/views/acc_log/acc.component.html b/src/app/views/acc_log/acc.component.html index 3b1b9b8..66e97be 100644 --- a/src/app/views/acc_log/acc.component.html +++ b/src/app/views/acc_log/acc.component.html @@ -1,10 +1,10 @@ - + -
Accunting Logs +
Accounting Logs @@ -14,8 +14,10 @@
Filtered Result For Device ID {{devid}} - - Showing last 24 hours logs by default. Use filters to modify the date and time. + + Showing last 24 hours logs by + default. Use filters to modify the date and time. @@ -73,49 +75,143 @@ - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - -
{{value}}
- - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - +
+ + + + +
+ + + + + + +
+ #No + +
+ + +
+ Device Name + + + + +
+ + +
+ Device IP + + + + +
+ + +
+ User Name + + + + +
+ + +
+ Action + + + + +
+ + +
+ Section + + + + +
+ + +
+ Date + + + + +
+ + + + + + + {{item.index}} + {{item.name}} + {{item.devip}} + {{item.username}} + {{item.action}} + {{item.section}} + {{item.created}} + + + + + + No accounting logs found. + + + + + + +
+
Device Info
+
+
{{selectedLog.name}}
+
{{selectedLog.devip}}
+
+ +
Session Details
+
+
User Name:
+
{{selectedLog.username}}
+
+
+
User IP:
+
{{selectedLog.address}}
+
+
+
Section:
+
{{selectedLog.section}}
+
+
+
Action:
+
{{selectedLog.action}}
+
+
+
Exec time:
+
{{selectedLog.created}}
+
+ +
Executed Config
+
+ 
{{selectedLog.config}}
+
+
+ diff --git a/src/app/views/acc_log/acc.component.ts b/src/app/views/acc_log/acc.component.ts index 2fbf5b7..44e4ba1 100644 --- a/src/app/views/acc_log/acc.component.ts +++ b/src/app/views/acc_log/acc.component.ts @@ -1,19 +1,8 @@ -import { Component, OnInit, ViewEncapsulation,Input } from "@angular/core"; +import { Component, OnInit, ViewChild, ViewEncapsulation, Input } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router, ActivatedRoute } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiRowDetail, - GuiSelectedRow, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { formatInTimeZone } from "date-fns-tz"; @@ -26,10 +15,14 @@ import { formatInTimeZone } from "date-fns-tz"; }) export class AccComponent implements OnInit { @Input() component_devid: any=false; - public uid: number; - public uname: string; - public tz: string; - public filterText: string; + public uid!: number; + public uname!: string; + public tz!: string; + public filterText!: string; + public detailsVisible: boolean = false; + public selectedLog: any = null; + + @ViewChild('dt') table!: Table; public reloading: boolean = false; public filters: any = { devid: false, @@ -75,78 +68,20 @@ export class AccComponent implements OnInit { } } public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; - public Selectedrows: any; + public selected_rows: any[] = []; + public Selectedrows: any[] = []; public devid: number = 0; - public sorting = { - enabled: true, - multiSorting: true, - }; - rowDetail: GuiRowDetail = { - enabled: true, - template: (item) => { - return ` -
-

${item.name}

- ${item.devip} - - - - - - - - - - - - - - - - - - - - - -
User Address${item.address}
User Name${item.username}
Connection Type${item.ctype}
Section${item.section}
Exec time${item.created}
-
Executed Config
- - ${item.config} - -
`; - }, - }; - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; + showLogDetails(log: any) { + this.selectedLog = log; + this.detailsVisible = true; + } - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } reinitgrid(field: string, $event: any) { if (field == "start") this.filters["start_time"] = $event.target.value; @@ -170,9 +105,10 @@ export class AccComponent implements OnInit { this.initGridTable(); } OnDestroy(): void {} - onSelectedRows(rows: Array): void { - this.rows = rows; - this.Selectedrows = rows.map((m: GuiSelectedRow) => m.source.id); + onSelectionChange(value: any[]) { + this.selected_rows = value; + this.Selectedrows = value.map(item => item.id); + this.rows = value; } removefilter(filter: any) { diff --git a/src/app/views/acc_log/acc.module.ts b/src/app/views/acc_log/acc.module.ts index 1b24182..44bcd50 100644 --- a/src/app/views/acc_log/acc.module.ts +++ b/src/app/views/acc_log/acc.module.ts @@ -13,7 +13,9 @@ import { import { AccRoutingModule } from "./acc-routing.module"; import { AccComponent } from "./acc.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { DrawerModule } from 'primeng/drawer'; +import { InputTextModule } from 'primeng/inputtext'; import { MatDatepickerModule } from "@angular/material/datepicker"; import { MatInputModule } from "@angular/material/input"; @@ -32,7 +34,9 @@ import { FormsModule } from "@angular/forms"; ButtonModule, FormModule, ButtonModule, - GuiGridModule, + TableModule, + DrawerModule, + InputTextModule, CollapseModule, MatFormFieldModule, MatInputModule, diff --git a/src/app/views/auth_log/auth.component.html b/src/app/views/auth_log/auth.component.html index 0cee1ea..02502b2 100644 --- a/src/app/views/auth_log/auth.component.html +++ b/src/app/views/auth_log/auth.component.html @@ -1,6 +1,6 @@ - + @@ -14,8 +14,10 @@ Filtered Result For Device ID {{devid}} - - Showing last 24 hours logs by default. Use filters to modify the date and time. + + Showing last 24 hours logs by + default. Use filters to modify the date and time. @@ -95,64 +97,180 @@ - - - - {{value}} - - - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - -
{{value}}
- - - - - {{value}} - - +
+ + + + +
- - - {{value}} - {{item.message}} + - - + + + +
+ #No + +
+ + +
+ Device Name + + + + +
+ + +
+ Device IP + + + + +
+ + +
+ Username + + + + +
+ + +
+ With + + + + +
+ + +
+ IP Address + + + + +
+ + +
+ Time/Msg + + + + +
+ + +
+ State + + +
+ + +
+ Date + + +
+ + + - - - Logged In - Logged Out - Failed - - - - - {{value}} - - - + + + {{item.index}} + + + + {{item.name}} + + {{item.devip}} + {{item.username}} + {{item.by}} + {{item.ip}} + + {{item.duration}} + {{item.message}} + + + Logged In + Logged Out + Failed + + {{item.created}} + + + + + + No authentication logs found. + + + + + + +
+
Session Info
+
+
Device:
+
{{selectedLog.name}} ({{selectedLog.devip}})
+
+
+
User:
+
{{selectedLog.username}}
+
+
+
Method:
+
{{selectedLog.by}}
+
+
+
Status:
+
+ Logged In + Logged Out + Failed +
+
+ +
Connection
+
+
IP/MAC:
+
{{selectedLog.ip}}
+
+
+
Duration:
+
{{selectedLog.duration}}
+
+
+
Date:
+
{{selectedLog.created}}
+
+ +
+
System Message
+
+ {{selectedLog.message}} +
+
+
+ diff --git a/src/app/views/auth_log/auth.component.ts b/src/app/views/auth_log/auth.component.ts index 63f06a4..7e59097 100644 --- a/src/app/views/auth_log/auth.component.ts +++ b/src/app/views/auth_log/auth.component.ts @@ -1,18 +1,8 @@ -import { Component, OnInit, ViewEncapsulation,Input } from "@angular/core"; +import { Component, OnInit, ViewChild, ViewEncapsulation, Input } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router, ActivatedRoute } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiSelectedRow, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { formatInTimeZone } from "date-fns-tz"; interface IUser { @@ -37,10 +27,14 @@ interface IUser { }) export class AuthComponent implements OnInit { @Input() component_devid: any=false; - public uid: number; - public uname: string; + public uid!: number; + public uname!: string; public tz: string = "UTC"; - public filterText: string; + public filterText!: string; + public detailsVisible: boolean = false; + public selectedLog: any = null; + + @ViewChild('dt') table!: Table; public devid: number = 0; public reloading: boolean = false; public filters: any = { @@ -87,42 +81,19 @@ export class AuthComponent implements OnInit { } } public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; - public Selectedrows: any; + public selected_rows: any[] = []; // Used by p-table selection + public Selectedrows: any[] = []; // ID array for legacy actions - public sorting = { - enabled: true, - multiSorting: true, - }; + showLogDetails(log: any) { + this.selectedLog = log; + this.detailsVisible = true; + } - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } reinitgrid(field: string, $event: any) { if (field == "start") this.filters["start_time"] = $event.target.value; @@ -179,9 +150,10 @@ export class AuthComponent implements OnInit { } this.initGridTable(); } - onSelectedRows(rows: Array): void { - this.rows = rows; - this.Selectedrows = rows.map((m: GuiSelectedRow) => m.source.id); + onSelectionChange(value: any[]) { + this.selected_rows = value; + this.Selectedrows = value.map(item => item.id); + this.rows = value; } removefilter(filter: any) { diff --git a/src/app/views/auth_log/auth.module.ts b/src/app/views/auth_log/auth.module.ts index 163612e..3b39569 100644 --- a/src/app/views/auth_log/auth.module.ts +++ b/src/app/views/auth_log/auth.module.ts @@ -11,7 +11,10 @@ import { } from '@coreui/angular'; import { AuthRoutingModule } from './auth-routing.module'; import { AuthComponent } from './auth.component'; -import { GuiGridModule } from '@generic-ui/ngx-grid'; +import { TableModule } from 'primeng/table'; +import { DrawerModule } from 'primeng/drawer'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; import { FormsModule } from '@angular/forms'; @@ -27,7 +30,10 @@ import {MatSelectModule} from '@angular/material/select'; GridModule, FormsModule, ButtonModule, - GuiGridModule, + TableModule, + DrawerModule, + InputTextModule, + TooltipModule, CollapseModule, MatFormFieldModule, MatInputModule, diff --git a/src/app/views/backups/backups.component.html b/src/app/views/backups/backups.component.html index cd82daa..a4d4f25 100644 --- a/src/app/views/backups/backups.component.html +++ b/src/app/views/backups/backups.component.html @@ -20,15 +20,14 @@ {{compareitems.length}} Selected
- {{item.devname}} -
- @@ -84,8 +83,8 @@ Config Search - + @@ -93,65 +92,104 @@ - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - -
- - - -
- - - +
+ + + + +
+ + + + + + +
+ #No + +
+ + +
+ Device Name + + + + +
+ + +
+ Device IP + + + + +
+ + +
+ Backup Time + + + + +
+ + +
+ File Size + + + + +
+ + Actions + + + + + + {{item.index}} + {{item.devname}} + {{item.devip}} + {{item.createdC}} + {{item.filesize}} + +
+ + + +
+ + + + + + + No backups found. + + + @@ -166,11 +204,12 @@ -
{{codeForHighlightAuto}}
+
{{codeForHighlightAuto}}
-
@@ -230,7 +269,7 @@
Restore Configuration Backup
- +
Backup Details
@@ -276,7 +315,7 @@

To proceed with this critical action, type CONFIRM in the box below:

-
@@ -290,8 +329,7 @@ - diff --git a/src/app/views/backups/backups.component.ts b/src/app/views/backups/backups.component.ts index 68a0b62..b041ff6 100644 --- a/src/app/views/backups/backups.component.ts +++ b/src/app/views/backups/backups.component.ts @@ -1,18 +1,8 @@ -import { Component, OnInit, QueryList, ViewChildren } from "@angular/core"; +import { Component, OnInit, QueryList, ViewChildren, ViewChild } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router, ActivatedRoute } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiSearching, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { formatInTimeZone } from "date-fns-tz"; import { ToasterComponent } from "@coreui/angular"; import { AppToastComponent } from "../toast-simple/toast.component"; @@ -22,10 +12,10 @@ import { AppToastComponent } from "../toast-simple/toast.component"; styleUrls: ["backups.component.scss"], }) export class BackupsComponent implements OnInit { - public uid: number; - public uname: string; + public uid: number = 0; + public uname: string = ''; public tz: string = "UTC"; - public filterText: string; + public filterText: string = ''; public filters: any = {}; public codeForHighlightAuto: string = ""; public ispro: boolean = false; @@ -69,34 +59,19 @@ export class BackupsComponent implements OnInit { return value !== undefined && value !== null && value !== ""; } } + @ViewChild("dt") table!: Table; @ViewChildren(ToasterComponent) viewChildren!: QueryList; public source: Array = []; - public columns: Array = []; public loading: boolean = true; - public backuploading : boolean=false; + public backuploading: boolean = false; public rows: any = []; public Selectedrows: any; public BakcupModalVisible: boolean = false; public devid: number = 0; public filters_visible: boolean = false; - public currentBackup:any=false; - public hlang:string=''; - public sorting = { - enabled: true, - multiSorting: true, - }; - searching: GuiSearching = { - enabled: true, - placeholder: "Search Devices", - }; - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; + public currentBackup: any = false; + public hlang: string = ''; toasterForm = { autohide: true, @@ -105,25 +80,10 @@ export class BackupsComponent implements OnInit { fade: true, closeButton: true, }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } ngOnInit(): void { this.devid = Number(this.route.snapshot.paramMap.get("devid")); diff --git a/src/app/views/backups/backups.module.ts b/src/app/views/backups/backups.module.ts index b24187a..5185bfb 100644 --- a/src/app/views/backups/backups.module.ts +++ b/src/app/views/backups/backups.module.ts @@ -17,7 +17,9 @@ import { import { BackupsRoutingModule } from "./backups-routing.module"; import { BackupsComponent } from "./backups.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; import { MatDatepickerModule } from "@angular/material/datepicker"; import { MatInputModule } from "@angular/material/input"; import { MatFormFieldModule } from "@angular/material/form-field"; @@ -35,7 +37,9 @@ import { ClipboardModule } from "@angular/cdk/clipboard"; FormModule, FormsModule, ButtonModule, - GuiGridModule, + TableModule, + InputTextModule, + TooltipModule, CollapseModule, BadgeModule, AlertModule, diff --git a/src/app/views/cloner/cloner.component.html b/src/app/views/cloner/cloner.component.html index 67fd369..3a87e0b 100644 --- a/src/app/views/cloner/cloner.component.html +++ b/src/app/views/cloner/cloner.component.html @@ -13,107 +13,170 @@ - - - - {{value}} - - - - - {{value}} - - - - - {{value == 'twoway' ? 'Two Way' : 'Master Mode'}} - - - - - {{value ? 'Active' : 'Inactive'}} - - - - - {{value}} - - - - - - - - - - +
+ + + + +
+ + + + + + +
+ Name + + + + +
+ + +
+ Description + + + + +
+ + +
+ Direction + + + + +
+ + +
+ Live Mode + + + + +
+ + +
+ Schedule + + + + +
+ + Actions + + + + + + {{item.name}} + {{item.description}} + + + {{item.direction == 'twoway' ? 'Two Way' : 'Master Mode'}} + + + + {{item.live_mode ? 'Active' : + 'Inactive'}} + + {{item.desc_cron}} + +
+ + +
+ + + + + + + No cloners found. + + + - - -
Edit Cloner: {{SelectedCloner['name']}}
-
Add New Cloner
- - - - -
-
-
Basic Information
-
- - - - - - - - + + +
Edit Cloner: + {{SelectedCloner['name']}}
+
Add New Cloner
+ + + + +
+
+
Basic Information
+ + + + + + + + +
- -
-
-
Synchronization Settings
-
- - - - - - - - - - - - - - - - - - + +
+
+
Synchronization Settings
+ + + + + + + + + + + + + + + + + + +
- - + - -
-
-
Commands Configuration
-
-
-
-
- {{ tab.name }} -
+ +
+
+
Commands Configuration
+
+
+
+
+ {{ tab.name }}
- - -
-
{{ section.title }}
-
-
-
- {{ command }} -
- - -
+
+ + +
+
{{ section.title }}
+
+
+
+ {{ command }} +
+ +
- - +
+ + +
+
+ + +
+
+
Master Device
+
+
+
+ + {{getMasterDeviceName()}} + Master +
+
+ + No master device selected +
+
+
+ + +
+
+
Device Management
+
+ {{SelectedMembers.length}} device(s)
- -
-
-
Master Device
-
-
-
- - {{getMasterDeviceName()}} - Master +
+
+
+
-
- - No master device selected +
+ No peers added +

Click "Add Members" to start adding peers

-
- -
-
-
Device Management
-
- {{SelectedMembers.length}} device(s) -
-
- -
-
-
- -
-
- No peers added -

Click "Add Members" to start adding peers

-
-
- -
- - - -
- - - {{value}} +
+ + + + +
+ Name +
- - - - - {{value}} - - - - -
- -
- - - -
- -
- -
+ + + + + + No members + added. + + + +
+ +
+
- - - - - - - +
+ + + + + + + - - -
Add Members to Cloner
- - - - -
- - - {{NewMemberRows.length}} {{SelectedCloner['pair_type']}} selected for addition - -
+ + +
Add Members to Cloner
+ + + + +
+ + + {{NewMemberRows.length}} {{SelectedCloner['pair_type']}} selected for addition + +
- - - -
- - Available {{SelectedCloner['pair_type'] | titlecase}} ({{availbleMembers.length}} total) -
- - -
- -
All {{SelectedCloner['pair_type']}} are already added
-

No available {{SelectedCloner['pair_type']}} to add to this cloner

+ + + +
+ + Available {{SelectedCloner['pair_type'] | titlecase}} ({{availbleMembers.length}} total) +
+ + +
+ +
All {{SelectedCloner['pair_type']}} are already added
+

No available {{SelectedCloner['pair_type']}} to add to this cloner

+
+
+
+ + + +
-
- - - -
- - {{value}} + + + + + + + +
+ Name +
- - - - - {{value}} - - - - - {{value}} - - - -
- - - + + +
+ IP Address + +
+ + +
+ MAC Address + +
+ + + - -
- Select {{SelectedCloner['pair_type']}} from the list above to add them to the cloner -
-
- - -
- - + + + + +
+ + {{item.name}} +
+ + + {{item.ip}} + + + {{item.mac}} + + + + + + No available + members. + + + +
+ + + - - -
Confirm delete {{ SelectedCloner['name'] }}
- - - - Are you sure that You want to delete following task ? -
-
- - - - - - - - - - - - - -
Taks name : {{ SelectedCloner['name'] }}
Description : {{ SelectedCloner['description'] }}
Cron exec : {{ SelectedCloner['desc_cron'] }}
- - - - - - +
+ + - \ No newline at end of file + + + +
Confirm delete {{ SelectedCloner['name'] }}
+ + + + Are you sure that You want to delete following task ? +
+
+ + + + + + + + + + + + + +
Taks name : {{ SelectedCloner['name'] }}
Description : {{ SelectedCloner['description'] }}
Cron exec : {{ SelectedCloner['desc_cron'] }}
+ + + + + + + + \ No newline at end of file diff --git a/src/app/views/cloner/cloner.component.ts b/src/app/views/cloner/cloner.component.ts index 7921d85..ce3a526 100644 --- a/src/app/views/cloner/cloner.component.ts +++ b/src/app/views/cloner/cloner.component.ts @@ -1,19 +1,8 @@ -import { Component, OnInit, OnDestroy, ViewChildren ,QueryList } from "@angular/core"; +import { Component, OnInit, OnDestroy, ViewChildren, QueryList, ViewChild } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiSelectedRow, - GuiSearching, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { NgxSuperSelectOptions } from "ngx-super-select"; import { _getFocusedElementPierceShadowDom } from "@angular/cdk/platform"; @@ -27,10 +16,13 @@ import { AppToastComponent } from "../toast-simple/toast.component"; }) export class ClonerComponent implements OnInit { - public uid: number; - public uname: string; + public uid: number = 0; + public uname: string = ''; public ispro: boolean = false; + @ViewChild('dt') table!: Table; + @ViewChild('dtNewMembers') tableNewMembers!: Table; + constructor( private data_provider: dataProvider, private router: Router, @@ -62,7 +54,6 @@ export class ClonerComponent implements OnInit { @ViewChildren(ToasterComponent) viewChildren!: QueryList; public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; public SelectedCloner: any = {}; @@ -74,9 +65,17 @@ export class ClonerComponent implements OnInit { public NewMemberModalVisible: boolean = false; public availbleMembers: any = []; public NewMemberRows: any = []; - public SelectedNewMemberRows: any; + public SelectedNewMemberRows: any[] = []; public master: number = 0; - public active_commands:any=[]; + public active_commands: any = []; + + toasterForm = { + autohide: true, + delay: 3000, + position: "fixed", + fade: true, + closeButton: true, + }; public tabs:any=[ { "name": "Network", @@ -186,59 +185,13 @@ export class ClonerComponent implements OnInit { } ]; - public sorting = { - enabled: true, - multiSorting: true, - }; - searching: GuiSearching = { - enabled: true, - placeholder: "Search Devices", - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } - options: Partial = { - selectionMode: "single", - actionsEnabled: false, - displayExpr: "name", - valueExpr: "id", - placeholder: "Snippet", - searchEnabled: true, - enableDarkMode: false, - }; - - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - toasterForm = { - autohide: true, - delay: 3000, - position: "fixed", - fade: true, - closeButton: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobalNewMembers($event: any, stringVal: string) { + this.tableNewMembers.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } activate_command(command:string){ // add to active_commands if it not added before if(!this.active_commands.includes(command)){ @@ -340,9 +293,9 @@ export class ClonerComponent implements OnInit { } } - onSelectedRowsNewMembers(rows: Array): void { + onSelectedRowsNewMembers(rows: any[]): void { this.NewMemberRows = rows; - this.SelectedNewMemberRows = rows.map((m: GuiSelectedRow) => m.source); + this.SelectedNewMemberRows = rows; } add_new_members() { diff --git a/src/app/views/cloner/cloner.module.ts b/src/app/views/cloner/cloner.module.ts index 6e78441..8c68cc4 100644 --- a/src/app/views/cloner/cloner.module.ts +++ b/src/app/views/cloner/cloner.module.ts @@ -18,7 +18,9 @@ import { } from "@coreui/angular"; import { ClonerRoutingModule } from "./cloner-routing.module"; import { ClonerComponent } from "./cloner.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule as PTableModule } from 'primeng/table'; +import { InputTextModule as PInputTextModule } from 'primeng/inputtext'; +import { TooltipModule as PTooltipModule } from 'primeng/tooltip'; import { NgxSuperSelectModule} from "ngx-super-select"; @@ -31,7 +33,9 @@ import { NgxSuperSelectModule} from "ngx-super-select"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + PTableModule, + PInputTextModule, + PTooltipModule, ModalModule, ReactiveFormsModule, FormsModule, diff --git a/src/app/views/dashboard/dashboard.component.html b/src/app/views/dashboard/dashboard.component.html index 1fa301a..3a84b44 100644 --- a/src/app/views/dashboard/dashboard.component.html +++ b/src/app/views/dashboard/dashboard.component.html @@ -173,7 +173,7 @@ Copy
- Not Registred + Not Registered License Validation failed
@@ -194,7 +194,7 @@ Copy
- Registred + Registered License Type : {{stats['license']}} Manual update Auto update @@ -223,8 +223,12 @@ class="fa-regular fa-hand-pointer fa-beat-fade"> Update availble
-

License User name is not set in settings read more!

-

Serial number not submitedread more!

+

License User name is + not set in settings read more!

+

Serial number not + submitedread more!

+ +
+
+
+
+

{{selectedLog.level}} Alert

+
{{selectedLog.eventtype || 'System Event'}}
+
+
- - - - - {{ value }} - - - - - Fixed - Not - Fixed - - - - -
Event - {{value}} - Fixed - {{item.fixtime}} +
+ +
+
Device Info
+
+
Device Name:
+
{{selectedLog.name}}
-
{{ value }}
- - - - -
- {{ value }} - {{ item.devip }} +
+
IP Address:
+
{{selectedLog.devip}}
- - - +
+
MAC Address:
+
{{selectedLog.mac}}
+
+ +
Event Details +
+
+
Event:
+
{{selectedLog.detail}}
+
+
+
Source:
+
{{selectedLog.src}}
+
+
+
Event Time:
+
{{selectedLog.eventtime}}
+
+
+
Fixed Time:
+
{{selectedLog.fixtime}}
+
+
+
Status:
+
+ + {{selectedLog.status == true ? 'Fixed' : 'Not Fixed'}} + +
+
+ +
Detail Message +
+
+ {{selectedLog.comment || 'No additional details available for this event.'}} +
+
+
+ diff --git a/src/app/views/device_logs/devlogs.component.ts b/src/app/views/device_logs/devlogs.component.ts index 85b22db..7b44a47 100644 --- a/src/app/views/device_logs/devlogs.component.ts +++ b/src/app/views/device_logs/devlogs.component.ts @@ -1,19 +1,9 @@ -import { Component, OnInit, ViewEncapsulation,Input } from "@angular/core"; +import { Component, OnInit, ViewChild, ViewEncapsulation, Input } from "@angular/core"; import { FormControl } from "@angular/forms"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router, ActivatedRoute } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiRowDetail, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { formatInTimeZone } from "date-fns-tz"; import { takeUntil } from "rxjs/operators"; import { Subject } from "rxjs"; @@ -27,10 +17,14 @@ import { Subject } from "rxjs"; }) export class DevLogsComponent implements OnInit { @Input() component_devid: any=false; - public uid: number; - public uname: string; + public uid!: number; + public uname!: string; public tz: string = "UTC" - public filterText: string; + public filterText!: string; + public detailsVisible: boolean = false; + public selectedLog: any = null; + + @ViewChild('dt') table!: Table; public filters: any = { start_time: false, end_time: false, @@ -73,108 +67,28 @@ export class DevLogsComponent implements OnInit { } } public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; - public Selectedrows: any; + public selected_rows: any[] = []; + public Selectedrows: any[] = []; public devid: number = 0; - public sorting = { - enabled: true, - multiSorting: true, - }; public bankMultiFilterCtrl: FormControl = new FormControl(""); protected _onDestroy = new Subject(); - public campaignOnestart: any; - public campaignOneend: any; - rowDetail: GuiRowDetail = { - enabled: true, - template: (item) => { - return ` -
-

Device :

- - - - - - - - - - - - - -
Device Name${item.name}
Device IP${item.devip}
Device MAC${item.mac}
-

Alert Detail : - -

- - - - - - - - - - - - - - - - - - - - - - - - - -
Event${item.detail}
Event Status${ - item.status ? "Fixed" : "Not Fixed" - }
Event Category${item.eventtype}
Exec time${item.eventtime}
Detail${item.comment}
Source${item.src}
-
`; - }, - }; + getSeverityColor(level: string): string { + if (level === "Critical") return "#e55353"; + if (level === "Warning") return "#f9b115"; + return "#3399ff"; + } - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; + showLogDetails(log: any) { + this.selectedLog = log; + this.detailsVisible = true; + } - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } ngOnInit(): void { var _self = this; if (this.component_devid) { diff --git a/src/app/views/device_logs/devlogs.module.ts b/src/app/views/device_logs/devlogs.module.ts index 5b8c49f..315ac5d 100644 --- a/src/app/views/device_logs/devlogs.module.ts +++ b/src/app/views/device_logs/devlogs.module.ts @@ -15,7 +15,10 @@ import { import { NgxMatSelectSearchModule } from "ngx-mat-select-search"; import { DevLogsRoutingModule } from "./devlogs-routing.module"; import { DevLogsComponent } from "./devlogs.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { DrawerModule } from 'primeng/drawer'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; import { MatDatepickerModule } from "@angular/material/datepicker"; import { MatInputModule } from "@angular/material/input"; import { MatFormFieldModule } from "@angular/material/form-field"; @@ -34,7 +37,10 @@ import { MatSelectModule } from "@angular/material/select"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + TableModule, + DrawerModule, + InputTextModule, + TooltipModule, CollapseModule, BadgeModule, MatInputModule, diff --git a/src/app/views/devices/devices.component.html b/src/app/views/devices/devices.component.html index fc93cd8..99e5a11 100644 --- a/src/app/views/devices/devices.component.html +++ b/src/app/views/devices/devices.component.html @@ -8,22 +8,24 @@
- + - +
- + - - @@ -38,116 +40,162 @@ - - - - - - - - {{value}} - - - - - {{value}} - - - - -
{{value}}
- - - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - - - - - -
-
  • Actions Menu
    • - - - - - - - - - +
    + + + + +
    + + + + + + + + + +
    + Name + +
    - -     - - + + +
    + CPU Type + + + + +
    + + +
    + Current Firmware + + + + +
    + + +
    + IP Address + + + + +
    + + +
    + MAC Address + + + + +
    + + + + +
    + Uptime + + + + +
    + + Actions + + + + + + + + + + + + + + {{item.name}} + + {{item.arch}} + +
    {{item.current_firmware}}
    + + + + {{item.ip}} + {{item.mac}} + {{item.uptime}} + + + + +
    +
  • Actions Menu
    • + + + + + + + + + +
    +     + + +     + + + + No devices found. + + +     @@ -292,54 +340,105 @@
    - - - - - - {{getTaskTypeLabel(value)}} - - - - -
    -
    Start: {{item.started}}
    -
    End: {{item.ended}}
    -
    -     -     - - -
    -
    {{item.start_ip}} - {{item.end_ip}}
    -
    User: {{item.username}}
    -
    -
    -
    {{item.device_count}} devices
    -
    {{item.task_id}}
    -
    -     -     - - -
    - ✓ {{item.success_count}} - ✗ {{item.failed_count}} -
    -     -     - - - - - - -     +
    + + + + +
    + + + + + + +
    + #No + +
    + + +
    + Name + + + + +
    + + +
    + Execution Time + + + + +
    + + +
    + User + + + + +
    + + Actions + +     + + + + +
    + + + {{getTaskTypeLabel(item.task_type)}} +
    + + +
    S: {{item.started}}
    +
    E: {{item.ended}}
    + + +
    +
    {{item.start_ip}} - {{item.end_ip}}
    +
    User: {{item.username}}
    +
    +
    +
    {{item.device_count}} devices
    +
    {{item.task_id}}
    +
    + + +
    + ✓ {{item.success_count}} + ✗ {{item.failed_count}} +
    + + + + + + +     + + + + No task history found. + + +     - +
    @@ -587,8 +689,8 @@
    Detailed Results:
    - +
    @@ -620,19 +722,20 @@ + + + + + + + + + + + + + + + + + + @@ -134,30 +171,54 @@

    Click "Add Devices" to start adding devices to this group

    - - - -
    - - {{value}} -
    -     -     - - - {{value}} - - - - - - - -     +
    + + + + +
    + + + +
    + + + + + + + + + + + + + + + @@ -172,7 +233,8 @@ - +
    Add Devices to Group
    @@ -189,7 +251,8 @@ -
    Available Devices ({{availbleMembers.length}} total)
    +
    Available Devices ({{availbleMembers.length}} total) +
    @@ -198,28 +261,45 @@

    No available devices to add to this group

    - - - -
    - - {{value}} -
    -     -     - - - {{value}} - - - - - {{value}} - - -     +
    + + + + +
    + + + +
    + + + + + + + + + + + + + + + @@ -268,7 +348,8 @@ - +
    User Permissions - {{selectedGroup?.name}}
    @@ -283,18 +364,11 @@
    - +
    -
    +
    {{user.username}} ({{user.first_name}} {{user.last_name}})
    @@ -306,28 +380,24 @@
    - +
    -
    {{perm.name}}
    -
    +
    No permissions found
    - @@ -336,7 +406,8 @@ -
    Current Permissions ({{selectedGroup?.assigned_users?.length || 0}} users)
    +
    Current Permissions + ({{selectedGroup?.assigned_users?.length || 0}} users)
    @@ -369,14 +440,12 @@
    + + + + + + + + + + + + + + + + + + + + diff --git a/src/app/views/permissions/permissions.component.ts b/src/app/views/permissions/permissions.component.ts index 1ce6ac0..afa20fb 100644 --- a/src/app/views/permissions/permissions.component.ts +++ b/src/app/views/permissions/permissions.component.ts @@ -1,13 +1,8 @@ -import { Component, OnInit, QueryList, ViewChildren } from "@angular/core"; +import { Component, OnInit, QueryList, ViewChildren, ViewChild } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { ToasterComponent } from "@coreui/angular"; import { AppToastComponent } from "../toast-simple/toast.component"; @@ -30,8 +25,10 @@ interface IUser { templateUrl: "permissions.component.html", }) export class PermissionsComponent implements OnInit { - public uid: number; - public uname: string; + public uid: number = 0; + public uname: string = ''; + + @ViewChild('dt') table!: Table; constructor( private data_provider: dataProvider, @@ -63,7 +60,6 @@ export class PermissionsComponent implements OnInit { @ViewChildren(ToasterComponent) viewChildren!: QueryList; public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; public SelectedPerm: any = {}; @@ -107,24 +103,9 @@ export class PermissionsComponent implements OnInit { closeButton: true, }; - public sorting = { - enabled: true, - multiSorting: true, - }; - - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } show_toast(title: string, body: string, color: string) { const { ...props } = { ...this.toasterForm, color, title, body }; const componentRef = this.viewChildren.first.addToast( diff --git a/src/app/views/permissions/permissions.module.ts b/src/app/views/permissions/permissions.module.ts index 3c1b310..159402a 100644 --- a/src/app/views/permissions/permissions.module.ts +++ b/src/app/views/permissions/permissions.module.ts @@ -18,7 +18,9 @@ import { IconModule } from "@coreui/icons-angular"; import { PermissionsRoutingModule } from "./permissions-routing.module"; import { PermissionsComponent } from "./permissions.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; @NgModule({ imports: [ @@ -33,7 +35,9 @@ import { GuiGridModule } from "@generic-ui/ngx-grid"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + TableModule, + InputTextModule, + TooltipModule, ModalModule, FormsModule, BadgeModule, diff --git a/src/app/views/sequences/sequences.component.html b/src/app/views/sequences/sequences.component.html index 8b29a65..9d1f755 100644 --- a/src/app/views/sequences/sequences.component.html +++ b/src/app/views/sequences/sequences.component.html @@ -4,7 +4,7 @@ - Alert Sequences (Pro) + Sequences
    @@ -18,48 +18,109 @@ - - - - {{value}} - - - - - Snippet #{{value}} - - - - - - - - - - -
    {{value}}
    -     -     - - - - - - - - -     +
    + + + + +
    + + + + +
    + + + + + + + + + + + + + + + + + + + + + + + + - +
    Edit Sequence: {{current_sequence['name']}} @@ -345,60 +406,72 @@
    -
    -
    - - - - - - {{run.created}} - Exec ID: {{run.exec_id | slice:0:8}}... - -
    - - {{run.successCount}}/{{run.totalCount}} Success - +
    +
    + + + + + + {{run.created}} + Exec ID: {{run.exec_id | slice:0:8}}... + +
    + + {{run.successCount}}/{{run.totalCount}} Success + +
    +     +
    + + + +
    + + + + + + + + + + + + + + - -
    - - - - -
    - Device #{{item.device_id}} -
    -     -     - - - - {{item.status | uppercase}} - - - - - - - - -     -     -
    - + + -
    No History Found
    @@ -418,12 +491,14 @@
    - + SSH Output
    - + Evaluation Details
    @@ -441,11 +516,13 @@
    - +
    - 
    {{current_trace.parsedLog.evaluation}}
    + 
    {{current_trace.parsedLog.evaluation}}
    @@ -467,7 +544,7 @@ - Rule [{{rule.type}}]: '{{rule.pattern}}' → + Rule [{{rule.type}}]: '{{rule.pattern}}' → {{rule.matched ? 'MATCHED' : 'NO MATCH'}}
    @@ -477,10 +554,11 @@ ACTION: {{act.action_type}} (Alert ID: {{act.alert_id}}) (Snippet: {{act.snippet_id}}) - +
    - +
    @@ -519,25 +597,34 @@
    Members :
    - - - -   {{value}} - - - - {{value}} - - - - - - - - + + + + + + + + + + + + + + + + + + + + +
    @@ -559,24 +646,56 @@
    Group Members :
    - - - -   {{value}} - - - - {{value}} - - - - - {{value}} - - - +
    + + + + +
    + + + +     + + + + + + + + + + + + + + + + + + + +
    diff --git a/src/app/views/sequences/sequences.component.ts b/src/app/views/sequences/sequences.component.ts index d681883..10fba71 100644 --- a/src/app/views/sequences/sequences.component.ts +++ b/src/app/views/sequences/sequences.component.ts @@ -1,7 +1,8 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import { dataProvider } from "../../providers/mikrowizard/data"; import { ToastComponent } from '@coreui/angular'; import { NgxSuperSelectOptions } from "ngx-super-select"; +import { Table } from 'primeng/table'; @Component({ selector: 'app-sequences', @@ -11,26 +12,23 @@ import { NgxSuperSelectOptions } from "ngx-super-select"; export class SequencesComponent implements OnInit { public sequences: any[] = []; + public source: any[] = []; - // Grid config - source: Array = []; - searching = { - enabled: true, - placeholder: 'Search sequences...' - }; - paging = { - enabled: true, - pageSize: 10, - pageSizes: [10, 25, 50] - }; - columnMenu = { enabled: false }; - sorting = { enabled: true }; - infoPanel = { enabled: true }; - rowSelection: any = { - enabled: true, - type: 'checkbox', - mode: 'multiple', - }; + @ViewChild('dt') table!: Table; + @ViewChild('dtMembers') tableMembers!: Table; + @ViewChild('dtNewMembers') tableNewMembers!: Table; + + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } + + applyFilterMembers($event: any, stringVal: string) { + this.tableMembers.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } + + applyFilterNewMembers($event: any, stringVal: string) { + this.tableNewMembers.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } public EditSequenceModalVisible: boolean = false; public current_sequence: any = { @@ -57,21 +55,7 @@ export class SequencesComponent implements OnInit { public SelectedNewMemberRows: any[] = []; public NewMemberRows: any[] = []; - public searchingMembers = { - enabled: true, - placeholder: 'Search members...' - }; - - // Device History Grid Config - searchingHistory = { - enabled: true, - placeholder: 'Search devices in this run...' - }; - pagingHistory = { - enabled: true, - pageSize: 5, - pageSizes: [5, 10, 25] - }; + public loading: boolean = true; // super select options snippetOptions: Partial = { diff --git a/src/app/views/sequences/sequences.module.ts b/src/app/views/sequences/sequences.module.ts index 83f7ad8..0186b59 100644 --- a/src/app/views/sequences/sequences.module.ts +++ b/src/app/views/sequences/sequences.module.ts @@ -20,7 +20,9 @@ import { import { HighlightJsModule } from 'ngx-highlight-js'; import { SequencesRoutingModule } from "./sequences-routing.module"; import { SequencesComponent } from "./sequences.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; import { NgxSuperSelectModule } from "ngx-super-select"; @NgModule({ @@ -32,7 +34,9 @@ import { NgxSuperSelectModule } from "ngx-super-select"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + TableModule, + InputTextModule, + TooltipModule, ModalModule, ToastModule, FormsModule, diff --git a/src/app/views/settings/settings.component.html b/src/app/views/settings/settings.component.html index 8b66fb9..374dc98 100644 --- a/src/app/views/settings/settings.component.html +++ b/src/app/views/settings/settings.component.html @@ -1,511 +1,565 @@ -
    - - -
    -
    - -

    System Settings

    -
    - Admin Panel -
    -     - -
    - - -
    + + - - - -
    -
    -
    - Firmware Repository - -
    - - {{source.length}} Versions Available - -
    -
    - - Tip: Keep multiple firmware versions for compatibility. Always test updates on non-critical devices first. -
    - - - - - {{value}} - - - - - {{value}} - - - - - {{value.substring(0, 16)}}... - - - - - - - - -
    +
    + + +
    +
    + +
    System Settings
    +
    +
    +     - -
    -
    -
    - - Download New Firmware - -
    -
    - - Internet Required: Downloads from mikrotik.com. Ensure stable connection and access to mikrotik.com domain. -
    - - -
    - - -
    -
    - {{firm}} -
    -
    -
    - No versions found -
    -
    -     - - - -     -
    - - Fetching available versions from MikroTik... -
    -
    -
    - - -
    -
    - Update Configuration - -
    -
    - - Best Practice: Use "Keep v6" for legacy devices. Test new firmware versions in lab environment first. -
    - - - -
    - - - 📋 Keep v6: v6 devices use V6 Firmware Version, v7 devices use Default Firmware Version -
    -     - - -
    - - - 💡 Tip: Choose stable releases for production. LTS versions are only available for v6 firmware -
    -     - - -
    - - - Firmware version for RouterOS v6 devices -
    -     -     - -
    - +
    -
    - - - - -
    -
    - Network Configuration - -
    -
    - - Network Setup: Configure these settings to match your network infrastructure for proper device communication. -
    - - - -
    -
    + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
    + + Download New Firmware + - - - 🔧 Tip: Use static IP outside DHCP range (e.g., 192.168.1.100-200) -
    - - - -
    - - - 🔐 Internal RADIUS: Secret for MikroWizard's built-in RADIUS server (for MikroTik admin authentication) -
    -     - - -
    - -
    - -
    -
    - {{tz.text}} +
    +
    + + Internet Required: Downloads from mikrotik.com. Ensure stable connection and + access + to mikrotik.com domain available in server. +
    + + +
    + + +
    +
    + {{firm}} +
    +
    +
    + No versions found +
    +     + + + +     +
    + + Fetching available versions from MikroTik... +
    +
    +
    + + +
    +
    + Update Configuration + +
    +
    + + Best Practice: Use "Keep v6" for legacy devices. Test new firmware versions in lab + environment first. +
    + + + +
    + + + 📋 Keep v6: v6 devices use V6 Firmware Version, v7 + devices + use Default Firmware Version
    -
    - No timezones found + + + +
    + + + 💡 Tip: Choose stable releases for production. LTS + versions + are only available for v6 firmware +
    +     + + +
    + + + Firmware version for RouterOS v6 devices +
    +     + + +
    + +
    +
    + + + + + +
    +
    + Network Configuration + +
    +
    + + Network Setup: Configure these settings to match your network infrastructure for + proper + device communication. +
    + + + +
    + + + 🌐 Examples: https://mikrowizard.company.com or + 192.168.1.100 +
    +     + + +
    + + + 🔧 Tip: Use static IP outside DHCP range (e.g., + 192.168.1.100-200) +
    +     + + +
    + + + 🔐 Internal RADIUS: Secret for MikroWizard's built-in + RADIUS + server (for MikroTik admin authentication) +
    +     + + +
    + +
    + +
    +
    + {{tz.text}} +
    +
    +
    + No timezones found +
    +
    + Default system timezone +
    +     +     +
    + + +
    +
    + Device Discovery Credentials + +
    +
    + + Security Warning: Change default passwords immediately after device setup. Use + strong, + unique credentials. +
    + + + +
    + + + 🔍 Device Discovery: Username for finding MikroTik + devices + with default credentials in your network +
    +     + + +
    + + + 🔍 Device Discovery: Password for finding MikroTik + devices + with default credentials (often empty on new devices) +
    +     +     +
    + + +
    +
    + License Configuration + +
    + + + +
    + + + 🔑 Same username you use to login to + mikrowizard.com website +
    +     +     +
    + + +
    +
    + System Behavior + +
    + + + +
    + + + 📊 Manual Mode: Updates require confirmation and actions + in + dashboard view +
    +     +     +
    + + +
    +
    + Security & Enforcement + +
    +
    + + Important: These settings will override device configurations. Test in lab + environment + before enabling in production. +
    + +
    +
    +
    +
    +
    Force Permissions + +
    +

    🔄 Sync MikroTik user groups with MikroWizard permissions +
    💡 Ensures consistent user access control across all devices +

    +
    + + + +
    - Default system timezone -
    - - -
    - -
    -
    - Device Discovery Credentials - -
    -
    - - Security Warning: Change default passwords immediately after device setup. Use strong, unique credentials. -
    - - - -
    - - - 🔍 Device Discovery: Username for finding MikroTik devices with default credentials in your network -
    -     - - -
    - - - 🔍 Device Discovery: Password for finding MikroTik devices with default credentials (often empty on new devices) -
    -     -     -
    +
    +
    +
    +
    Force RADIUS + +
    +

    🔐 Configure RADIUS on MikroTik devices for admin user authentication +
    👥 For MikroTik system users authentication (not end users) +

    +
    + + + + +
    +
    - -
    -
    - License Configuration - -
    - - - -
    - - - 🔑 Same username you use to login to mikrowizard.com website -
    -     -     -
    +
    +
    +
    +
    Force Syslog + +
    +

    📊 Automatically configure syslog settings on managed devices +
    ⚠️ Will OVERWRITE existing syslog configurations on + devices +

    +
    + + + + +
    +
    - -
    -
    - System Behavior - -
    - - - -
    - - - 📊 Manual Mode: Updates require confirmation and actions in dashboard view -
    -     -     -
    +
    +
    +
    +
    Safe Updates PRO + +
    +

    🛡️ Install required intermediate firmware versions before target + version +
    ✅ Highly recommended for production environments +

    +
    + + + + +
    +
    - -
    -
    - Security & Enforcement - -
    -
    - - Important: These settings will override device configurations. Test in lab environment before enabling in production. -
    - -
    -
    -
    -
    -
    Force Permissions - -
    -

    🔄 Sync MikroTik user groups with MikroWizard permissions -
    💡 Ensures consistent user access control across all devices -

    +
    +
    +
    +
    Force Device OTP PRO + +
    +

    🔐 Require OTP authentication for all device access +
    ⚠️ Ensure users have OTP configured before enabling +

    +
    + + + + +
    - - - - -
    -
    - -
    -
    -
    -
    Force RADIUS - -
    -

    🔐 Configure RADIUS on MikroTik devices for admin user authentication -
    👥 For MikroTik system users authentication (not end users) -

    -
    - - - - -
    -
    - -
    -
    -
    -
    Force Syslog - -
    -

    📊 Automatically configure syslog settings on managed devices -
    ⚠️ Will OVERWRITE existing syslog configurations on devices -

    -
    - - - - -
    -
    - -
    -
    -
    -
    Safe Updates PRO - -
    -

    🛡️ Install required intermediate firmware versions before target version -
    ✅ Highly recommended for production environments -

    -
    - - - - -
    -
    - -
    -
    -
    -
    Force Device OTP PRO - -
    -

    🔐 Require OTP authentication for all device access -
    ⚠️ Ensure users have OTP configured before enabling -

    -
    - - - - -
    -
    - -
    -
    -
    -
    WebFig Auto Login PRO - -
    -

    🌐 Create temporary OTP for automatic WebFig login -
    🔑 Users don't need to input passwords to access WebFig admin interface -

    -
    - - - - -
    -
    -
    -
    - -
    - -
    - - - - - -
    Loading system configuration...
    -     - -
    +
    +
    +
    +
    WebFig Auto Login PRO + +
    +

    🌐 Create temporary OTP for automatic WebFig login +
    🔑 Users don't need to input passwords to access WebFig admin + interface +

    +
    + + + + +
    +
    +
    +
    + +
    + +
    + + + + + +
    Loading system configuration...
    +     + +
    + +
    Downloading RouterOS ver {{firmtodownload}}
    @@ -539,7 +593,7 @@
    - - - - - - - - {{value}} - - - - - {{value}} - - - - -
    {{value}}
    -     -     - - - - - - - - -     + + +
    + + + + + + + + + + + + + + + @@ -63,7 +88,8 @@
    - +
    @@ -84,30 +110,36 @@
    Members :
    - - - -   {{value}} - - - - {{value}} - - - - - - - - + + +     + + + + + + + + + + + + +
    - + @@ -123,25 +155,48 @@
    Group Members :
    - - - -   {{value}} - - - - {{value}} - - - - - {{value}} - - - +
    + + + + +
    + + +     + + + + + + + + + + + + + + +
    @@ -164,25 +219,44 @@ - - - -   {{value}} - - - - {{value}} - - - - - - - - +
    + + + + +
    + + +     + + + + + + + + + + + + +
    @@ -210,16 +284,19 @@
    - +
    - + -
    Note : In case of multiple IP addresses for the MikroWizard server, use[mikrowizard] instead of the MikroWizard server IP.
    +
    Note : In case of multiple IP addresses for the MikroWizard + server, use[mikrowizard] instead of the MikroWizard server IP. +

    @@ -230,27 +307,28 @@ - + -
    Confirm delete {{ SelectedSnippet['name'] }}
    +
    Confirm delete {{ SelectedSnippet['name'] }}
     Are you sure that You want to delete following Snippet ? -
    -
    +
    +
    +
    + Name + + + +
    - - - - +     		+
    + Member Devices + + + + +
    +     		+
    + Created + + + + +
    +     		+
    + Member Users + + + + +
    +     		Actions
    {{item.name}} + + +
    All Devices
    +     + + + 0 + +
    + {{item.array_agg.length}} +
    +     +     		{{formatCreateTime(item.created)}} +
    + {{item.assigned_users?.length || 0}} +
    +     		+
    + + + +
    +
  • Actions Menu
    • + + + + + +
    +     +
    +
    +
    + Name + +
    +     		+
    + MAC Address + +
    +     		Actions
    +
    + + {{item.name}} +
    +     		{{item.ip}} + +
    Device Name + IP Address MAC Address +
    +
    + + {{item.name}} +
    +     		{{item.ip}}{{item.mac}}
    - -
    @@ -402,7 +471,8 @@
    - +
    @@ -430,7 +500,9 @@
    -

    Are you sure you want to remove {{removingUser?.username}}'s permission from group {{selectedGroup?.name}}?

    +

    Are you sure you want to remove {{removingUser?.username}}'s permission from group + {{selectedGroup?.name}}? +

    This action cannot be undone.

     @@ -451,13 +523,17 @@
    -

    Are you sure you want to {{firmwareAction}} firmware for all devices in group {{selectedGroupForFirmware?.name}}?

    -

    This action will affect all devices in this group and may take some time to complete.

    +

    Are you sure you want to {{firmwareAction}} firmware for all devices in group + {{selectedGroupForFirmware?.name}}? +

    +

    This action will affect all devices in this group and may take some time to complete. +

    - - - - +
    + + + + +
    + + + + +
    +
    + Permission Name + + + + +
    +     		PermsActions
    {{item.name}} +
    + + {{perm.key}} + +
    +     		+
    + + +
    +
    No permissions found.
    +
    + Name + + + + +
    +     		+
    + Source Snippet + + + + +
    +     		+
    + Active + + + + +
    +     		+
    + Created + + + + +
    +     		Actions
    {{item.name}}Snippet #{{item.source_snippet_id}} + + + {{item.created}} +
    + + + + +
    +
    No sequences found.
    Device Status Actions
    +
    + Device + #{{dev.device_id}} +
    +     		+ + {{dev.status | uppercase}} + + + +
    Name MAC Actions
    {{item.name}}{{item.mac}} + +
    + No members added.
    +
    + Member Name + +
    +     		+
    + IP Address + +
    +     		+
    + MAC Address + +
    +
    {{item.name}}{{item.ip}}{{item.mac}}
    No available members found.
    +
    + Version + + + + +
    +     		+
    + Architecture + + + + +
    +     		SHA256Actions
    {{item.version}}{{item.architecture}}{{item.sha256.substring(0, 16)}}... + +
    No firmware versions found in repository.
    +
    + Name + + +
    +     		+
    + Description + + +
    +     		+
    + Created + + +
    +     		Actions
    + + + + {{item.name}} + {{item.description}}{{item.created}} + + + + +
    Name MAC + + Actions
    {{member.name}}{{member.mac}} + +
    + + + Name + + + + IP + + + + MAC + + +
    {{member.name}}{{member.ip}}{{member.mac}}
    + Start time + + + + End time + + + Info
    {{item.started}}{{item.ended}} + +
    - - - - - - - + + + + + + +
    Snippet name : {{ SelectedSnippet['name'] }} -
    -

    Warning: ALL Tasks related to this snippet Will be modifed or deleted and stop working!

    -
    Snippet name : {{ SelectedSnippet['name'] }} +
    +

    Warning: ALL Tasks related to this snippet Will be modifed or deleted and stop working! +

    +
    @@ -263,6 +341,4 @@ - - - + \ No newline at end of file diff --git a/src/app/views/snippets/snippets.component.ts b/src/app/views/snippets/snippets.component.ts index 58d0674..471e666 100644 --- a/src/app/views/snippets/snippets.component.ts +++ b/src/app/views/snippets/snippets.component.ts @@ -12,32 +12,18 @@ import { UntypedFormControl, UntypedFormGroup } from "@angular/forms"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { HttpClient, HttpClientModule, HttpParams } from "@angular/common/http"; -import { - GuiCellView, - GuiSearching, - GuiSelectedRow, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiDataType, - GuiPaging, - GuiPagingDisplay, - GuiRowColoring, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { HttpClient, HttpParams } from "@angular/common/http"; import { formatInTimeZone } from "date-fns-tz"; +import { Table } from 'primeng/table'; @Component({ templateUrl: "snippets.component.html", }) export class SnippetsComponent implements OnInit, OnDestroy { - public uid: number; - public uname: string; - public tz: string; + public uid!: number; + public uname!: string; + public tz!: string; public ispro: boolean = false; constructor( @@ -75,9 +61,9 @@ export class SnippetsComponent implements OnInit, OnDestroy { } } @ViewChild("nameSummaryCell") - nameSummaryCell: TemplateRef; + nameSummaryCell!: TemplateRef; public source: Array = []; - public columns: Array = []; + public columns: Array = []; public loading: boolean = true; public rows: any = []; public Selectedrows: any; @@ -96,6 +82,9 @@ export class SnippetsComponent implements OnInit, OnDestroy { public NewMemberRows: any = []; public SelectedNewMemberRows: any; + @ViewChild('dtNewMember') dtNewMember!: Table; + @ViewChild('dtHistory') dtHistory!: Table; + public current_snippet: any = { content: "", created: "", @@ -112,44 +101,15 @@ export class SnippetsComponent implements OnInit, OnDestroy { name: "", }; - public sorting = { - enabled: true, - multiSorting: true, - }; - public ip_scanner: any; - searching: GuiSearching = { - enabled: true, - placeholder: "Search Devices", - }; + applyFilterNewMember($event: any, stringVal: string) { + this.dtNewMember.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterHistory($event: any, stringVal: string) { + this.dtHistory.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } ngOnInit(): void { this.initGridTable(); @@ -256,9 +216,9 @@ export class SnippetsComponent implements OnInit, OnDestroy { }); } - onSelectedRowsNewMembers(rows: Array): void { + onSelectedRowsNewMembers(rows: Array): void { this.NewMemberRows = rows; - this.SelectedNewMemberRows = rows.map((m: GuiSelectedRow) => m.source); + this.SelectedNewMemberRows = rows.map((m: any) => m.source || m); } add_new_members() { @@ -305,9 +265,9 @@ export class SnippetsComponent implements OnInit, OnDestroy { }); } - onSelectedRows(rows: Array): void { + onSelectedRows(rows: Array): void { this.rows = rows; - this.Selectedrows = rows.map((m: GuiSelectedRow) => m.source.id); + this.Selectedrows = rows.map((m: any) => (m.source ? m.source.id : m.id)); } remove(item: any) { diff --git a/src/app/views/snippets/snippets.module.ts b/src/app/views/snippets/snippets.module.ts index f980206..ab54a28 100644 --- a/src/app/views/snippets/snippets.module.ts +++ b/src/app/views/snippets/snippets.module.ts @@ -13,7 +13,9 @@ import { } from "@coreui/angular"; import { SnippetsRoutingModule } from "./snippets-routing.module"; import { SnippetsComponent } from "./snippets.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule as PTableModule } from 'primeng/table'; +import { InputTextModule as PInputTextModule } from 'primeng/inputtext'; +import { TooltipModule as PTooltipModule } from 'primeng/tooltip'; @NgModule({ imports: [ @@ -24,7 +26,9 @@ import { GuiGridModule } from "@generic-ui/ngx-grid"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + PTableModule, + PInputTextModule, + PTooltipModule, ModalModule, ToastModule, FormsModule, diff --git a/src/app/views/syslog-regex/syslog-regex.component.html b/src/app/views/syslog-regex/syslog-regex.component.html index 1a1edfd..f3c95d1 100644 --- a/src/app/views/syslog-regex/syslog-regex.component.html +++ b/src/app/views/syslog-regex/syslog-regex.component.html @@ -17,62 +17,93 @@     - - - - {{value}} - - - - - {{value}} - - - - -
    - {{ getAlertName(value) }} - {{ - getAlertLevel(value)}} -
    -     -     - - - - - Global - String - Match - - +
    + + + + +
    - - - {{value}} - - - - -
    {{value}}
    -     -     - - - - - - -     + + + + + + Name + + + + + Regex Pattern + + + + Alert / Severity + Alert Enabled/Type + + Match String + + + + Created + Actions + + + + + + {{item.name}} + {{item.regex_pattern}} + +
    + {{ getAlertName(item.alert_id) }} + {{ + getAlertLevel(item.alert_id)}} +
    + + + + + + Global + String + Match + + {{item.match_string}} + {{item.created}} + + + + + +     + + + + No regexes found. + + +     diff --git a/src/app/views/syslog-regex/syslog-regex.component.scss b/src/app/views/syslog-regex/syslog-regex.component.scss index e8c18dd..6a0f8c1 100644 --- a/src/app/views/syslog-regex/syslog-regex.component.scss +++ b/src/app/views/syslog-regex/syslog-regex.component.scss @@ -37,7 +37,8 @@ textarea.form-control { position: relative; z-index: 2; background: transparent !important; - color: transparent !important; /* Hide real text to only show highlights behind it, but keep caret visible */ + color: transparent !important; + /* Hide real text to only show highlights behind it, but keep caret visible */ caret-color: #000; } @@ -48,14 +49,16 @@ textarea.form-control { right: 0; bottom: 0; z-index: 1; - padding: 0.375rem 0.75rem; /* Match textarea padding */ - font-size: 0.8rem; /* Match small text if needed */ + padding: 0.375rem 0.75rem; + /* Match textarea padding */ + font-size: 0.8rem; + /* Match small text if needed */ line-height: 1.5; color: #495057; background-color: #fff; white-space: pre-wrap; word-wrap: break-word; - border: 1px solid transparent; + border: 1px solid transparent; pointer-events: none; border-radius: 0.375rem; overflow-y: auto; @@ -64,19 +67,19 @@ textarea.form-control { .segment-row { transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid #edf2f7 !important; - + &:hover { background-color: #ffffff !important; border-color: #90cdf4 !important; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); transform: translateY(-2px); } - + .btn-link { opacity: 0.3; transition: opacity 0.2s; } - + &:hover .btn-link { opacity: 1; } @@ -87,11 +90,12 @@ textarea.form-control { height: 8px; border-radius: 50%; display: inline-block; - box-shadow: 0 0 5px rgba(0,0,0,0.1); + box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); } .step-card { transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1); + &:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; @@ -105,10 +109,17 @@ textarea.form-control { /* Animations */ @keyframes fadeIn { - from { opacity: 0; transform: translateY(-5px); } - to { opacity: 1; transform: translateY(0); } + from { + opacity: 0; + transform: translateY(-5px); + } + + to { + opacity: 1; + transform: translateY(0); + } } .animate-fade-in { animation: fadeIn 0.4s ease-out forwards; -} +} \ No newline at end of file diff --git a/src/app/views/syslog-regex/syslog-regex.component.ts b/src/app/views/syslog-regex/syslog-regex.component.ts index 93accfd..9f87ee8 100644 --- a/src/app/views/syslog-regex/syslog-regex.component.ts +++ b/src/app/views/syslog-regex/syslog-regex.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { Table } from 'primeng/table'; import { dataProvider } from "../../providers/mikrowizard/data"; import { NgxSuperSelectOptions } from "ngx-super-select"; import { ToastComponent } from '@coreui/angular'; @@ -16,6 +17,7 @@ interface RegexSegment { styleUrls: ['./syslog-regex.component.scss'] }) export class SyslogRegexComponent implements OnInit { + @ViewChild('dt') dt: Table | undefined; public syslogRegexes: any[] = []; @@ -93,6 +95,10 @@ export class SyslogRegexComponent implements OnInit { this.loadAlerts(); } + applyFilterGlobal($event: any, stringVal: string) { + this.dt!.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } + loadRegexes() { this.MikroWizardRPC.get_syslog_regexes().then( (res: any) => { diff --git a/src/app/views/syslog-regex/syslog-regex.module.ts b/src/app/views/syslog-regex/syslog-regex.module.ts index 41dbf14..2995891 100644 --- a/src/app/views/syslog-regex/syslog-regex.module.ts +++ b/src/app/views/syslog-regex/syslog-regex.module.ts @@ -20,8 +20,12 @@ import { import { HighlightJsModule } from 'ngx-highlight-js'; import { SyslogRegexRoutingModule } from "./syslog-regex-routing.module"; import { SyslogRegexComponent } from "./syslog-regex.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; import { NgxSuperSelectModule } from "ngx-super-select"; +import { TableModule } from 'primeng/table'; +import { InputTextModule } from 'primeng/inputtext'; +import { MultiSelectModule } from 'primeng/multiselect'; +import { TooltipModule } from 'primeng/tooltip'; +import { DropdownModule } from 'primeng/dropdown'; @NgModule({ imports: [ @@ -32,7 +36,11 @@ import { NgxSuperSelectModule } from "ngx-super-select"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + TableModule, + InputTextModule, + MultiSelectModule, + TooltipModule, + DropdownModule, ModalModule, ToastModule, FormsModule, diff --git a/src/app/views/syslog/syslog-routing.module.ts b/src/app/views/syslog/syslog-routing.module.ts index dc207f4..9549bcd 100644 --- a/src/app/views/syslog/syslog-routing.module.ts +++ b/src/app/views/syslog/syslog-routing.module.ts @@ -8,7 +8,7 @@ const routes: Routes = [ path: '', component: SyslogComponent, data: { - title: $localize`Mikrowizard System Logs` + title: $localize`System Logs` } } ]; diff --git a/src/app/views/syslog/syslog.component.html b/src/app/views/syslog/syslog.component.html index 0f804b1..d9d07f4 100644 --- a/src/app/views/syslog/syslog.component.html +++ b/src/app/views/syslog/syslog.component.html @@ -4,9 +4,11 @@ -
    Devices
    - - Showing last 24 hours logs by default. Use filters to modify the date and time. +
    System Logs
    + + Showing last 24 hours logs by + default. Use filters to modify the date and time.     @@ -62,44 +64,144 @@
    - - - - {{ value }} - - +
    + + + + +
    - - -
    - {{ value }} - {{ item.first_name }} {{ item.last_name }} + + + + + +
    + #No + +
    + + +
    + Username + + + + +
    + + +
    + Section + + + + +
    + + +
    + Action + + + + +
    + + +
    + IP + + + + +
    + + +
    + Time + + + + +
    + + +     + + + + {{item.index}} + +
    + {{ item.username }} + {{ item.first_name }} {{ + item.last_name }} +
    + + {{item.section}} + {{item.action}} + {{item.ip}} + {{item.created}} + +     + + + + No logs found. + + +     + + + +
    +
    System Log
    +
    +
    Section:
    +
    {{selectedLog.section}}
    +
    +
    +
    Action:
    +
    {{selectedLog.action}}
    +
    +
    +
    Time:
    +
    {{selectedLog.created}}
    +
    + +
    User Detail
    +
    +
    User:
    +
    {{selectedLog.username}}
    +
    +
    +
    Name:
    +
    {{selectedLog.first_name}} {{selectedLog.last_name}}
    +
    +
    +
    IP:
    +
    {{selectedLog.ip}}
    +
    +
    +
    Agent:
    +
    + {{selectedLog.agent}}
    - - - - - {{ value }} - - - - - {{ value }} - - - - - {{ value }} - - - - - {{ value }} - - - +
    + +
    Raw Data
    +
    + {{selectedLog.data}} +
    +
    +     diff --git a/src/app/views/syslog/syslog.component.ts b/src/app/views/syslog/syslog.component.ts index bec8fba..3c51fb6 100644 --- a/src/app/views/syslog/syslog.component.ts +++ b/src/app/views/syslog/syslog.component.ts @@ -1,18 +1,8 @@ -import { Component, OnInit, ViewEncapsulation } from "@angular/core"; +import { Component, OnInit, ViewChild, ViewEncapsulation } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router, ActivatedRoute } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiRowDetail, - GuiInfoPanel, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { formatInTimeZone } from "date-fns-tz"; @@ -22,10 +12,11 @@ import { formatInTimeZone } from "date-fns-tz"; encapsulation: ViewEncapsulation.None, }) export class SyslogComponent implements OnInit { - public uid: number; - public uname: string; + public uid!: number; + public uname!: string; public tz: string= "UTC"; - public filterText: string; + public filterText!: string; + public userid: number = 0; public filters: any = { start_time: false, end_time: false, @@ -36,6 +27,10 @@ export class SyslogComponent implements OnInit { public event_section: any = []; public event_action: any = []; public filters_visible: boolean = false; + public detailsVisible: boolean = false; + public selectedLog: any = null; + + @ViewChild('dt') table!: Table; constructor( private data_provider: dataProvider, private router: Router, @@ -66,95 +61,18 @@ export class SyslogComponent implements OnInit { } } public source: Array = []; - public columns: Array = []; public loading: boolean = true; public rows: any = []; - public Selectedrows: any; - public userid: number = 0; - public sorting = { - enabled: true, - multiSorting: true, - }; - public campaignOnestart: any; - public campaignOneend: any; - rowDetail: GuiRowDetail = { - enabled: true, - template: (item) => { - return ` -
    -

    System Log :

    - - - - - - - - - - - - - -
    Section${item.section}
    Action${item.action}
    Time${item.created}
    -

    User Detail : -

    - - - - - - - - - - - - - - - - - - - - - -
    User${item.username}
    FirstName${item.first_name}
    LastName${item.last_name}
    IP${item.ip}
    Agent
    ${item.agent}
    -
    data
    - - ${item.data} - -
    `; - }, - }; + showLogDetails(log: any) { + this.selectedLog = log; + this.detailsVisible = true; + } + + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - - public infoPanel: GuiInfoPanel = { - enabled: true, - infoDialog: false, - columnsManager: true, - schemaManager: true, - }; - - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + // Removed legacy GuiGrid configs ngOnInit(): void { var _self = this; this.userid = Number(this.route.snapshot.paramMap.get("userid")); diff --git a/src/app/views/syslog/syslog.module.ts b/src/app/views/syslog/syslog.module.ts index af58657..ef0f891 100644 --- a/src/app/views/syslog/syslog.module.ts +++ b/src/app/views/syslog/syslog.module.ts @@ -12,7 +12,9 @@ import { import { NgxMatSelectSearchModule } from "ngx-mat-select-search"; import { SyslogRoutingModule } from "./syslog-routing.module"; import { SyslogComponent } from "./syslog.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { DrawerModule } from 'primeng/drawer'; +import { InputTextModule } from 'primeng/inputtext'; import { MatDatepickerModule } from "@angular/material/datepicker"; import { MatInputModule } from "@angular/material/input"; import { MatFormFieldModule } from "@angular/material/form-field"; @@ -28,7 +30,9 @@ import { MatSelectModule } from "@angular/material/select"; GridModule, FormsModule, ButtonModule, - GuiGridModule, + TableModule, + DrawerModule, + InputTextModule, CollapseModule, DropdownModule, MatInputModule, diff --git a/src/app/views/user_manager/user_manager.component.html b/src/app/views/user_manager/user_manager.component.html index 1365cef..e43c673 100644 --- a/src/app/views/user_manager/user_manager.component.html +++ b/src/app/views/user_manager/user_manager.component.html @@ -4,7 +4,7 @@ - Users + User Managment - + +
    + + + + +
    - - - - + + + + + +
    + User Name + + + + +
    + + +
    + First Name + + + + +
    + + +
    + Last Name + + + + +
    + + +
    + Role + + + + +
    + + Actions + +     + + + + {{item.username}} + {{item.first_name}} + {{item.last_name}} + {{item.role}} + +
    + + + +
    + + +     + + + + No users found. + + +     @@ -54,285 +104,304 @@ - - -
    Edit: {{SelectedUser['username']}}
    -
    Add User
    - -     - - -
    -
    -
    Basic Information
    - Enter the user's personal details and login credentials -
    - - - - - - - - - - - - - - - - - -
    - - -
    -
    -
    System Access Levels
    - Control what system features this user can access and modify -
    -
    - R = Read Only - W = Read & Write - F = Full Control - × = No Access -
    -
    -
    - {{ perm.key.replace('_', ' ') }} -
    - - - - -
    + + +
    Edit: + {{SelectedUser['username']}}
    +
    Add User
    + +     + + +
    +
    +
    Basic Information
    + Enter the user's personal details and login credentials
    -
    -
    - - -
    -
    -
    Device Access Control
    - Grant access to specific device groups with defined permission levels -
    - - -
    -
    - - Add Device Permission -
    - - -
    - - -
    -
    - {{group.name}} -
    -
    -
    - No groups found -
    -
    + + + - -
    - - -
    -
    - {{perm.name}} -
    -
    -
    - No permissions found -
    -
    + + - - - + + + + + + + +
    - -
    -
    -
    Current Device Access
    - {{userperms.length}} permission(s) + +
    +
    +
    System Access Levels
    + Control what system features this user can access and modify
    - -
    -
    -
    {{i + 1}}
    -
    -
    - - {{perm.group_name}} -
    -
    - - {{perm.perm_name}} -
    +
    + R = Read Only + W = Read & Write + F = Full Control + × = No Access +
    +
    +
    + {{ perm.key.replace('_', ' ') }} +
    + + + +
    - -
    -
    - -
    -
    - -
    -
    - No device access granted -

    Add permissions above to grant access to device groups

    -
    - - -
    - - -
    -
    - - - -
    -     - - - -
    Security Restrictions of {{SelectedUser['username']}}
    -     - - - - - - - - - - - - - - -
    TOTP status :
    		 - - - - - -
    Use OTP for device login:
    		 - - - - - - -
    Restrict IP access:
    		 - - - - - -
    - -
    Allowed ips :
    - - - -   {{item}} - - - - - - - -     -
    - - - - -
    - Add new IP - -
    - + +
    +
    +
    Device Access Control
    + Grant access to specific device groups with defined permission levels
    -
    		- -
    -     - - - - -     + + +
    +
    + + Add Device Permission +
    + + +
    + + +
    +
    + {{group.name}} +
    +
    +
    + No groups found +
    +
    +     + +
    + + +
    +
    + {{perm.name}} +
    +
    +
    + No permissions found +
    +
    +     + + + + +     +
    + + +
    +
    +
    Current Device Access
    + {{userperms.length}} permission(s) +
    + +
    +
    +
    {{i + 1}}
    +
    +
    + + {{perm.group_name}} +
    +
    + + {{perm.perm_name}} +
    +
    + +
    +
    + +
    +
    + +
    +
    + No device access granted +

    Add permissions above to grant access to device groups

    +
    +
    +
    +
    + + +
    + + +
    +
    + + + +
    +     + + + + +
    Security Restrictions of {{SelectedUser['username']}}
    +     + + + + + + + + + + + + + + +
    +
    TOTP status :
    +     		+ + + + + +
    +
    Use OTP for device login:
    +     		+ + + + + + +
    +
    Restrict IP access:
    +     		+ + + + + +
    + +
    Allowed ips :
    + + + + IP Address + Action + + + + + {{item}} + + + + + + + + No restricted IPs. + + + +     +
    + + + + +
    + Add new IP + +
    + +
    +     		+ +
    +     + + + + +     @@ -376,7 +445,8 @@ - +
    Confirm delete {{ SelectedUser['name'] }}
    diff --git a/src/app/views/user_manager/user_manager.component.ts b/src/app/views/user_manager/user_manager.component.ts index 60b6595..0c92e9d 100644 --- a/src/app/views/user_manager/user_manager.component.ts +++ b/src/app/views/user_manager/user_manager.component.ts @@ -1,17 +1,8 @@ -import { Component, OnInit, QueryList, ViewChildren } from "@angular/core"; +import { Component, OnInit, QueryList, ViewChildren, ViewChild } from "@angular/core"; import { dataProvider } from "../../providers/mikrowizard/data"; import { Router } from "@angular/router"; import { loginChecker } from "../../providers/login_checker"; -import { - GuiGridComponent, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiRowSelectionMode, - GuiRowSelection, - GuiRowSelectionType, -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { NgxSuperSelectOptions } from "ngx-super-select"; import { AppToastComponent } from "../toast-simple/toast.component"; import { ToasterComponent } from "@coreui/angular"; @@ -21,11 +12,11 @@ import { ToasterComponent } from "@coreui/angular"; styleUrls: ["user_manager.scss"], }) export class UserManagerComponent implements OnInit { - public uid: number; - public uname: string; - public ispro:boolean=false; + public uid: number = 0; + public uname: string = ''; + public ispro: boolean = false; - gridComponent: GuiGridComponent; + @ViewChild('dt') table!: Table; toasterForm = { autohide: true, delay: 10000, @@ -64,7 +55,6 @@ export class UserManagerComponent implements OnInit { } @ViewChildren(ToasterComponent) viewChildren!: QueryList; public source: Array = []; - public columns: Array = []; public loading: boolean = false; public rows: any = []; public SelectedUser: any = {}; @@ -87,8 +77,8 @@ export class UserManagerComponent implements OnInit { public DeletePermConfirmModalVisible: boolean = false; public userperms: any = {}; public userresttrictions: any = false; - public ipaddress:string=""; - public adminperms: { [index: string]: string }; + public ipaddress: string = ""; + public adminperms: { [index: string]: string } = {}; public defadminperms: { [index: string]: string } = { device: "none", device_group: "none", @@ -103,11 +93,6 @@ export class UserManagerComponent implements OnInit { system_backup: "none", }; - public sorting = { - enabled: true, - multiSorting: true, - }; - options: Partial = { actionsEnabled: false, displayExpr: "name", @@ -117,34 +102,20 @@ export class UserManagerComponent implements OnInit { enableDarkMode: false, }; - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - - public columnMenu: GuiColumnMenu = { - enabled: true, - sort: true, - columnsManager: true, - }; - setRadioValue(key: string, value: string): void { this.adminperms[key] = value; } filterDevGroups(event: any): void { const query = event.target.value.toLowerCase(); - this.filteredDevGroups = this.allDevGroups.filter((group: any) => + this.filteredDevGroups = this.allDevGroups.filter((group: any) => group.name.toLowerCase().includes(query) ); } filterPermissions(event: any): void { const query = event.target.value.toLowerCase(); - this.filteredPermissions = this.allPerms.filter((perm: any) => + this.filteredPermissions = this.allPerms.filter((perm: any) => perm.name.toLowerCase().includes(query) ); } @@ -169,11 +140,9 @@ export class UserManagerComponent implements OnInit { setTimeout(() => this.showPermissionDropdown = false, 200); } - public rowSelection: boolean | GuiRowSelection = { - enabled: true, - type: GuiRowSelectionType.CHECKBOX, - mode: GuiRowSelectionMode.MULTIPLE, - }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } ngOnInit(): void { this.initGridTable(); @@ -188,12 +157,12 @@ export class UserManagerComponent implements OnInit { ); componentRef.instance["closeButton"] = props.closeButton; } - totp(item:any){ + totp(item: any) { this.SelectedUser = item; - this.data_provider.totp('enable',this.SelectedUser.id).then((res) => { - if(res.status == "success"){ + this.data_provider.totp('enable', this.SelectedUser.id).then((res) => { + if (res.status == "success") { this.show_toast("Success", "Totp generated successfully", "success"); - }else{ + } else { this.show_toast("Error", res.err, "danger"); } }); @@ -218,15 +187,15 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - if ("id" in res && !("status" in res)) { - _self.initGridTable(); - this.EditTaskModalVisible = false; - } else { - //show error - _self.show_toast("Error", res.err, "danger"); + else { + if ("id" in res && !("status" in res)) { + _self.initGridTable(); + this.EditTaskModalVisible = false; + } else { + //show error + _self.show_toast("Error", res.err, "danger"); + } } - } }); } else { if (_self.userperms.length > 0) { @@ -243,9 +212,9 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - _self.initGridTable(); - _self.EditTaskModalVisible = false; + else { + _self.initGridTable(); + _self.EditTaskModalVisible = false; } }); } @@ -262,27 +231,30 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - _self.allPerms = res.map((x: any) => { - return { id: x["id"], name: x.name }; - }); - _self.filteredPermissions = [..._self.allPerms]; - _self.data_provider.get_devgroup_list().then((res) => { - if ("error" in res && res.error.indexOf("Unauthorized")) { - _self.show_toast( - "Error", - "You are not authorized to perform this action", - "danger" - ); - } - else{ - _self.allDevGroups = res.map((x: any) => { + else if ("err" in res) { + _self.show_toast("Error", res.err, "danger"); + } + else { + _self.allPerms = res.map((x: any) => { return { id: x["id"], name: x.name }; }); - _self.filteredDevGroups = [..._self.allDevGroups]; + _self.filteredPermissions = [..._self.allPerms]; + _self.data_provider.get_devgroup_list().then((res) => { + if ("error" in res && res.error.indexOf("Unauthorized")) { + _self.show_toast( + "Error", + "You are not authorized to perform this action", + "danger" + ); + } + else { + _self.allDevGroups = res.map((x: any) => { + return { id: x["id"], name: x.name }; + }); + _self.filteredDevGroups = [..._self.allDevGroups]; + } + }); } - }); - } }); if (action == "showadd") { this.userperms = []; @@ -303,6 +275,10 @@ export class UserManagerComponent implements OnInit { this.EditTaskModalVisible = true; return; } + if (item.username == "system") { + this.show_toast("Error", "System user cannot be edited", "danger"); + return; + } this.SelectedUser = { ...item }; if (this.SelectedUser["adminperms"].length > 0) { this.adminperms = JSON.parse(this.SelectedUser["adminperms"]); @@ -316,13 +292,13 @@ export class UserManagerComponent implements OnInit { _self.EditTaskModalVisible = true; } - checkIpAddress(ip:string) { + checkIpAddress(ip: string) { const ipv4Pattern = /^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)(\.|\/|)){4}\b(0?[1-9]|1[0-9]|2[0-9]|3[0-2])\b$/; return ipv4Pattern.test(ip) } showrest(item: any) { - var _self=this; + var _self = this; this.SelectedUser = { ...item }; this.data_provider.get_user_restrictions(this.SelectedUser["id"]).then((res) => { @@ -330,33 +306,33 @@ export class UserManagerComponent implements OnInit { _self.RestrictionsTaskModalVisible = true; }); } - delete_ip(item:string){ - - this.userresttrictions['allowed_ips']=this.userresttrictions['allowed_ips'].filter((x:any)=>x!=item); + delete_ip(item: string) { + + this.userresttrictions['allowed_ips'] = this.userresttrictions['allowed_ips'].filter((x: any) => x != item); } - add_ip(){ + add_ip() { //check if ip address is valid cidr and not added before - let ip=this.ipaddress.trim(); - if(ip=="")return; - if(this.userresttrictions['allowed_ips'].includes(ip)){ + let ip = this.ipaddress.trim(); + if (ip == "") return; + if (this.userresttrictions['allowed_ips'].includes(ip)) { this.show_toast("Error", "IP already added", "danger"); return; } //check if ip is valid cidr ip - if(this.checkIpAddress(ip)){ + if (this.checkIpAddress(ip)) { this.userresttrictions['allowed_ips'].push(ip); - this.userresttrictions['allowed_ips']=this.userresttrictions['allowed_ips'].filter((x:any)=>x!=""); - this.ipaddress=""; + this.userresttrictions['allowed_ips'] = this.userresttrictions['allowed_ips'].filter((x: any) => x != ""); + this.ipaddress = ""; } - else{ + else { this.show_toast("Error", "Invalid IP address", "danger"); } } - - save_sec(){ - var _self=this; - this.data_provider.save_user_restrictions(this.SelectedUser.id,this.userresttrictions).then((res) => { + + save_sec() { + var _self = this; + this.data_provider.save_user_restrictions(this.SelectedUser.id, this.userresttrictions).then((res) => { if ("error" in res && res.error.indexOf("Unauthorized")) { _self.show_toast( "Error", @@ -364,17 +340,17 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - if('status' in res && res['status']=='success') + else { + if ('status' in res && res['status'] == 'success') this.RestrictionsTaskModalVisible = false; - else if('status' in res && res['status']=='failed') + else if ('status' in res && res['status'] == 'failed') this.show_toast("Error", res.err, "danger"); - else + else this.show_toast("Error", "Somthing went wrong", "danger"); } }); } - + add_user_perm() { var _self = this; this.data_provider @@ -391,10 +367,10 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - _self.get_user_perms(_self.SelectedUser["id"]); - _self.permission = 0; - _self.devgroup = 0; + else { + _self.get_user_perms(_self.SelectedUser["id"]); + _self.permission = 0; + _self.devgroup = 0; } }); } @@ -425,9 +401,12 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - _self.initGridTable(); - _self.DeleteConfirmModalVisible = false; + else if ("err" in res) { + _self.show_toast("Error", res.err, "danger"); + } + else { + _self.initGridTable(); + _self.DeleteConfirmModalVisible = false; } }); } @@ -451,12 +430,12 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - this.get_user_perms(this.SelectedUser["id"]); + else { + this.get_user_perms(this.SelectedUser["id"]); } }); } - + logger(item: any) { console.dir(item); } @@ -474,13 +453,13 @@ export class UserManagerComponent implements OnInit { "danger" ); } - else{ - _self.source = res.map((x: any) => { - return x; - }); - _self.SelectedUser = {}; - _self.loading = false; - } + else { + _self.source = res.map((x: any) => { + return x; + }); + _self.SelectedUser = {}; + _self.loading = false; + } }); } } diff --git a/src/app/views/user_manager/user_manager.module.ts b/src/app/views/user_manager/user_manager.module.ts index f80c910..519dc6b 100644 --- a/src/app/views/user_manager/user_manager.module.ts +++ b/src/app/views/user_manager/user_manager.module.ts @@ -16,7 +16,9 @@ import { NgxMatSelectSearchModule } from "ngx-mat-select-search"; import { UserManagerRoutingModule } from "./user_manager-routing.module"; import { UserManagerComponent } from "./user_manager.component"; -import { GuiGridModule } from "@generic-ui/ngx-grid"; +import { TableModule } from 'primeng/table'; +import { InputTextModule } from 'primeng/inputtext'; +import { TooltipModule } from 'primeng/tooltip'; @NgModule({ imports: [ @@ -29,7 +31,9 @@ import { GuiGridModule } from "@generic-ui/ngx-grid"; FormModule, ButtonModule, ButtonGroupModule, - GuiGridModule, + TableModule, + InputTextModule, + TooltipModule, ModalModule, FormsModule, ToastModule, diff --git a/src/app/views/user_tasks/user_tasks.component.html b/src/app/views/user_tasks/user_tasks.component.html index e0d5b59..e7068d5 100644 --- a/src/app/views/user_tasks/user_tasks.component.html +++ b/src/app/views/user_tasks/user_tasks.component.html @@ -14,44 +14,90 @@ - - - - - - - -   {{value}} - - - - {{value}} - - - - - {{value}} - - +
    + + + + +
    - - - {{value}} - - + - - - - - - - -     + + + +
    + Name + + + + +
    + + +
    + Description + + + + +
    + + +
    + Members type + + + + +
    + + +
    + Runtime + + +
    + + Actions + +     + + + + + + + + + {{item.name}} + + {{item.description}} + {{item.selection_type}} + {{item.desc_cron}} + +
    + + +
    + + +     + + + + No tasks found. + + +     @@ -299,31 +345,42 @@ select targets for this task

    - - - -
    - - {{value}} -
    -     -     - - - {{value}} - - - - - - - -     + + + + Name + MAC Address + Actions + + + + + +
    + + {{item.name}} +
    + + {{item.mac}} + + + + + +     + + + No + targets selected. + + +
    @@ -404,30 +461,50 @@

    No available {{SelectedTask['selection_type']}} to add to this task

    - - - -
    - - {{value}} -
    -     -     - - - {{value}} - - - - - {{value}} - - -     +
    + + + + +
    + + + + + + Name + IP Address + MAC Address + + + + + + +
    + + {{item.name}} +
    + + {{item.ip}} + + {{item.mac}} + + +     + + + No + available targets found. + + +
    @@ -511,7 +588,7 @@ -
    - +
    Password Vault Configuration
    @@ -54,7 +58,8 @@ - + - + - + + @@ -325,7 +369,8 @@
    - Warning: This will execute the password vault job and change passwords on all configured device groups. + Warning: This will execute the password vault job and change passwords on all configured device + groups.

    Are you sure you want to proceed with the password vault execution?

     @@ -345,25 +390,50 @@

    Select device groups to include in the password vault task:

    - - - - {{value}} - - - - - {{value}} - - - - - {{value}} - - - +
    + + + + +
    + + + + + + + Name + + + + + IP + + + + + MAC + + + + + + + + + +
    + + {{item.name}} +
    + + +     +
    + + - - - - - - - - - - - - - -
    - - - {{ item.name || item.assigned_ip || (item.public_key | slice:0:8) + '...' }} - - Unmanaged -
    -
    - {{ item.assigned_ip || 'No IP' }} -
    -     -     - - - -
    - -
    - {{ item.description }} + + + Status + +
    + Identity & IP + + + +
    + + +
    + Details & Description + + + + +
    + + +
    + Routing + + + + +
    + + Integration + +
    + Last Handshake + +
    + + Transfer Speed + Total Volume + +
    + State + +
    + + Actions + +     - -
    -
    - {{ item.public_key | slice:0:16 }}... + + + + + + + + + + +
    + + + {{ item.name || item.assigned_ip || (item.public_key | slice:0:8) + '...' }} + + Unmanaged +
    +
    + {{ item.assigned_ip || 'No IP' }} +
    + + +
    +
    + {{ item.description }}
    -
    - {{ item.created_at | date:'mediumDate' }} +
    +
    + {{ item.public_key | slice:0:16 }}... +
    +
    + {{ item.created_at | date:'mediumDate' }} +
    -
    -     - - - - -
    - - {{ value | uppercase }} - -
    -
    - Iface: {{ item.custom_interface || 'Auto' }} -
    -     -     - - - -
    - - View Device - -
    - Device - Not Linked - - -
    - Scanning... + + +
    + + {{ item.nat_mode | uppercase }} + +
    +
    + Iface: {{ item.custom_interface || 'Auto' }} +
    + + +
    + + View Device + +
    + Not Linked +
    + Scanning... +
    +
    + Success +
    +
    + Failed +
    -
    - Scan Completed -
    - -
    - Scan Failed -
    - -
    +
    Keepalive: {{ item.persistent_keepalive }}s
    -
    - -
    - - - - - - -
    - + + +
    {{ item.stats.last_handshake * 1000 | date:'shortTime' }}
    {{ item.stats.last_handshake * 1000 | date:'shortDate' }} - - +
    +
    None - -
    - - - - - - - -
    - - {{ formatBytes(item.stats.rx_speed || 0) }}/s - - - {{ formatBytes(item.stats.tx_speed || 0) }}/s - -
    - - -     -     - - - -
    - {{(item.stats.rx_bytes / - 1048576) | number:'1.2-2'}} MB - {{(item.stats.tx_bytes / - 1048576) | number:'1.2-2'}} MB -
    - - -     -     - - - -
    - +
    + + +
    + + {{ formatBytes(item.stats.rx_speed || 0) }}/s + + + {{ formatBytes(item.stats.tx_speed || 0) }}/s + +
    + + +
    + {{(item.stats.rx_bytes / 1048576) | number:'1.2-2'}} MB + {{(item.stats.tx_bytes / 1048576) | number:'1.2-2'}} MB +
    + + + - + [disabled]="item.is_managed === false" [id]="'switch-peer-' + item.public_key" /> -
    -     -     + + + + +
    + + + + + + + +
    +     + + + - - - - - - - - -
    - - - - - - - -
    -     -     -     - - + + + No VPN peers found. + + + diff --git a/src/app/views/vpn/vpn.component.ts b/src/app/views/vpn/vpn.component.ts index c5d7f22..b099519 100644 --- a/src/app/views/vpn/vpn.component.ts +++ b/src/app/views/vpn/vpn.component.ts @@ -4,16 +4,7 @@ import { Router } from '@angular/router'; import { loginChecker } from '../../providers/login_checker'; import { VpnService, VpnStatusResponse, VpnPeer, VpnServerConfig } from '../../providers/mikrowizard/vpn.service'; import { Subscription, delay, of, repeat, switchMap, timer, catchError } from 'rxjs'; -import { - GuiGridComponent, - GuiRowClass, - GuiSearching, - GuiColumn, - GuiColumnMenu, - GuiPaging, - GuiPagingDisplay, - GuiInfoPanel -} from "@generic-ui/ngx-grid"; +import { Table } from 'primeng/table'; import { ToasterComponent, ToasterPlacement } from "@coreui/angular"; import { AppToastComponent } from "../toast-simple/toast.component"; @@ -22,7 +13,7 @@ import { AppToastComponent } from "../toast-simple/toast.component"; styleUrls: ['vpn.component.scss'] }) export class VpnComponent implements OnInit, OnDestroy { - @ViewChild("grid", { static: true }) gridComponent!: GuiGridComponent; + @ViewChild("dt") table!: Table; @ViewChildren(ToasterComponent) viewChildren!: QueryList; toasterForm = { @@ -155,18 +146,9 @@ export class VpnComponent implements OnInit, OnDestroy { public resetServerModalVisible = false; - rowClass: GuiRowClass = { class: "row-highlighted" }; - searching: GuiSearching = { enabled: true, placeholder: "Search Peers" }; - public paging: GuiPaging = { - enabled: true, - page: 1, - pageSize: 10, - pageSizes: [5, 10, 25, 50], - display: GuiPagingDisplay.ADVANCED, - }; - public columnMenu: GuiColumnMenu = { enabled: true, sort: true, columnsManager: true }; - public infoPanel: GuiInfoPanel = { enabled: true, infoDialog: false, columnsManager: true, schemaManager: true }; - public sorting = { enabled: true, multiSorting: true }; + applyFilterGlobal($event: any, stringVal: string) { + this.table.filterGlobal(($event.target as HTMLInputElement).value, stringVal); + } constructor( private login_checker: loginChecker, diff --git a/src/app/views/vpn/vpn.module.ts b/src/app/views/vpn/vpn.module.ts index 5e72d27..d9cf030 100644 --- a/src/app/views/vpn/vpn.module.ts +++ b/src/app/views/vpn/vpn.module.ts @@ -1,7 +1,6 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { GuiGridModule } from '@generic-ui/ngx-grid'; import { ChartjsModule } from '@coreui/angular-chartjs'; import { HighlightJsModule } from 'ngx-highlight-js'; import { ClipboardModule } from '@angular/cdk/clipboard'; @@ -33,6 +32,9 @@ import { IconModule } from '@coreui/icons-angular'; import { VpnRoutingModule } from './vpn-routing.module'; import { VpnComponent } from './vpn.component'; +import { TableModule as PTableModule } from 'primeng/table'; +import { TooltipModule as PTooltipModule } from 'primeng/tooltip'; +import { InputTextModule } from 'primeng/inputtext'; @NgModule({ imports: [ @@ -42,7 +44,9 @@ import { VpnComponent } from './vpn.component'; IconModule, TabsModule, CommonModule, - GuiGridModule, + PTableModule, + PTooltipModule, + InputTextModule, ProgressModule, ReactiveFormsModule, ButtonModule, diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss index 2d620a1..e6dadaa 100644 --- a/src/scss/_custom.scss +++ b/src/scss/_custom.scss @@ -1,116 +1,165 @@ // Here you can add other styles -ngx-super-select.styled>div > span{ - background:var(--cui-input-group-addon-bg, #d8dbe0); - height:100%; - padding:8px; - color:var(--cui-input-group-addon-color, rgba(44, 56, 74, 0.95))!important; +ngx-super-select.styled>div>span { + background: var(--cui-input-group-addon-bg, #d8dbe0); + height: 100%; + padding: 8px; + color: var(--cui-input-group-addon-color, rgba(44, 56, 74, 0.95)) !important; } + ngx-super-select.styled>div { - padding:0!important; - width:100%; + padding: 0 !important; + width: 100%; } -ngx-super-select.styled{ - width:100%; + +ngx-super-select.styled { + width: 100%; } -ngx-super-select.styled.hiden .select-selected-items:before{ - content:"click for select" + +ngx-super-select.styled.hiden .select-selected-items:before { + content: "click for select" } -ngx-super-select.styled.hiden .select-selected-items > *{ - display:none!important; + +ngx-super-select.styled.hiden .select-selected-items>* { + display: none !important; } -ngx-super-select.styled .selection-counter:before{ - content:"Selected Count : " + +ngx-super-select.styled .selection-counter:before { + content: "Selected Count : " } -ngx-super-select.styled .selection-counter{ - color:#000!important; - background:#aaaaaa26!important; - margin:0!important; + +ngx-super-select.styled .selection-counter { + color: #000 !important; + background: #aaaaaa26 !important; + margin: 0 !important; } .cdk-overlay-container { - z-index: 10000; + z-index: 10000; } .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix { - padding-top: 6px; - padding-bottom: 6px; -} -.mat-mdc-form-field-infix { - min-height: 34px; + padding-top: 6px; + padding-bottom: 6px; } -.mdc-text-field--filled:not(.mdc-text-field--disabled){ - background: transparent!important; +.mat-mdc-form-field-infix { + min-height: 34px; +} + +.mdc-text-field--filled:not(.mdc-text-field--disabled) { + background: transparent !important; } /* Add application styles & imports to this file! */ pre { - display: flex!important; - margin-top: 0!important; - margin-bottom: 0!important; - word-wrap: break-word!important; - } - - code { - flex: 1!important; - line-height: 1.8em!important; - font-size: 14px!important; - min-height: 100%!important; - padding: 1em 1.2em!important; - overflow-x: unset!important; - overflow-y: unset!important; - } - - .hljs.hljs-line-numbers { - padding: 0 !important; - } - - pre .hljs { - border: none!important; - transition: border ease 1s!important; - } - - .hljs-ln { - tr { - &:first-child td { - padding-top: 10px !important; - } - - &:last-child td { - padding-bottom: 10px !important; - } + display: flex !important; + margin-top: 0 !important; + margin-bottom: 0 !important; + word-wrap: break-word !important; +} + +code { + flex: 1 !important; + line-height: 1.8em !important; + font-size: 14px !important; + min-height: 100% !important; + padding: 1em 1.2em !important; + overflow-x: unset !important; + overflow-y: unset !important; +} + +.hljs.hljs-line-numbers { + padding: 0 !important; +} + +pre .hljs { + border: none !important; + transition: border ease 1s !important; +} + +.hljs-ln { + tr { + &:first-child td { + padding-top: 10px !important; + } + + &:last-child td { + padding-bottom: 10px !important; } } - .row-highlighted{ - z-index: 0!important; - } - .mat-mdc-menu-panel,.mat-mdc-menu-content{ - background: transparent!important; - padding: 0!important; - } - /* for block of numbers */ - td.hljs-ln-numbers { - position: sticky!important; - left: 0!important; - user-select: none!important; - text-align: center!important; - color: #cccccc6b!important; - border-right: 1px solid #cccccc1c!important; - vertical-align: top!important; - padding-right: 10px !important; - padding-left: 10px !important; - } - - /* for block of code */ - td.hljs-ln-code { - padding-left: 10px !important; - } - +} - .gui-structure, .gui-structure *{ - font-size: inherit!important; - } \ No newline at end of file +.row-highlighted { + z-index: 0 !important; +} + +.mat-mdc-menu-panel, +.mat-mdc-menu-content { + background: transparent !important; + padding: 0 !important; +} + +/* for block of numbers */ +td.hljs-ln-numbers { + position: sticky !important; + left: 0 !important; + user-select: none !important; + text-align: center !important; + color: #cccccc6b !important; + border-right: 1px solid #cccccc1c !important; + vertical-align: top !important; + padding-right: 10px !important; + padding-left: 10px !important; +} + +/* for block of code */ +td.hljs-ln-code { + padding-left: 10px !important; +} + + +.gui-structure, +.gui-structure * { + font-size: inherit !important; +} + +.p-datatable-table-container thead th:first-of-type { + border-top-left-radius: 8px; +} + +.p-datatable-table-container thead th:last-of-type { + border-top-right-radius: 8px; +} + +.p-datatable-table-container thead th { + padding: 0.30rem 1rem !important; + font-size: 0.7rem !important; +} + +.justify-between { + display: flex !important; + justify-content: space-between !important; + align-items: center !important; +} + +.table-search-input input { + border-top: none; + border-left: none !important; + border-right: none !important; + border-bottom: 1px !important solid; + border-radius: 0; + padding: 0 5px !important; +} + +.table-search-input { + padding-top: 15px; + margin: 0 !important; +} + +p-table { + width: 100% +} \ No newline at end of file diff --git a/src/scss/styles.scss b/src/scss/styles.scss index a143075..89772a5 100644 --- a/src/scss/styles.scss +++ b/src/scss/styles.scss @@ -25,4 +25,5 @@ $enable-rtl: true; // animations @import "animations"; -@import "~@angular/material/prebuilt-themes/indigo-pink.css"; \ No newline at end of file +@import "~@angular/material/prebuilt-themes/indigo-pink.css"; +@import "primeicons/primeicons.css"; \ No newline at end of file diff --git a/tsconfig.app.json b/tsconfig.app.json index 40e277b..aa2d267 100644 --- a/tsconfig.app.json +++ b/tsconfig.app.json @@ -4,7 +4,8 @@ "compilerOptions": { "outDir": "./out-tsc/app", "types": [ - "@angular/localize" + "@angular/localize", + "hammerjs" ], "paths": { "@docs-components/*": ["./src/components/*"] diff --git a/tsconfig.json b/tsconfig.json index d6f5c1c..9bbdf50 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -14,7 +14,7 @@ "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, - "moduleResolution": "node", + "moduleResolution": "bundler", "importHelpers": true, "target": "ES2022", "module": "ES2022", @@ -23,7 +23,11 @@ "lib": [ "ES2022", "dom" - ] + ], + "skipLibCheck": true, + "paths": { + "@primeuix/themes/*": ["node_modules/@primeuix/themes/dist/*"] + } }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false,