diff --git a/package.json b/package.json index 712c2f2..a390bf6 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,7 @@ "ngx-cron-editor": "^0.8.1", "ngx-date-fns": "^11.0.0", "ngx-diff": "^9.0.0", + "ngx-highlight-js": "^18.0.0", "ngx-highlightjs": "^12.0.0", "ngx-infinite-scroll": "^18.0.0", "ngx-mat-select-search": "^7.0.6", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1007ae2..3160f40 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -20,7 +20,6 @@ import { MikroWizardProvider } from './providers/mikrowizard/provider'; import { dataProvider } from './providers/mikrowizard/data'; import { loginChecker } from './providers/login_checker'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; -import { provideHighlightOptions, Highlight, HighlightAuto } from 'ngx-highlightjs'; import { AvatarModule, @@ -98,10 +97,6 @@ export function loginStatusProviderFactory(provider: loginChecker) { loginChecker, IconSetService, provideDateFnsAdapter(), - provideHighlightOptions({ - fullLibraryLoader: () => import('highlight.js'), - lineNumbersLoader: () => import('ngx-highlightjs/line-numbers') - }), { provide: APP_INITIALIZER, useFactory: loginStatusProviderFactory, diff --git a/src/app/views/backups/backups.component.html b/src/app/views/backups/backups.component.html index 23691f0..2ccdd5e 100644 --- a/src/app/views/backups/backups.component.html +++ b/src/app/views/backups/backups.component.html @@ -89,9 +89,10 @@ - - + @@ -107,12 +108,13 @@ -
-    
+ +
{{codeForHighlightAuto}}
+
- diff --git a/src/app/views/backups/backups.component.scss b/src/app/views/backups/backups.component.scss index 43d1b21..ef17e02 100644 --- a/src/app/views/backups/backups.component.scss +++ b/src/app/views/backups/backups.component.scss @@ -1,4 +1,7 @@ @import 'ngx-diff/styles/default-theme'; ::ng-deep .modal-xl { --cui-modal-width: 90vw!important; +} +::ng-deep pre { + display: block!important; } \ No newline at end of file diff --git a/src/app/views/backups/backups.component.ts b/src/app/views/backups/backups.component.ts index a603e4f..7c287f6 100644 --- a/src/app/views/backups/backups.component.ts +++ b/src/app/views/backups/backups.component.ts @@ -35,6 +35,7 @@ export class BackupsComponent implements OnInit { public comparecontents:any=[]; public compare_type="unified"; public copy_msg:boolean=false; + constructor( private data_provider: dataProvider, private router: Router, @@ -71,12 +72,14 @@ export class BackupsComponent implements OnInit { public source: Array = []; public columns: Array = []; public loading: boolean = true; + 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, @@ -157,20 +160,27 @@ export class BackupsComponent implements OnInit { ShowBackup(backup: any) { var _self=this; - this.loading = true; + this.backuploading = true; this.currentBackup = backup; + _self.codeForHighlightAuto=''; + _self.BakcupModalVisible = true; this.data_provider.get_backup(backup.id).then((res) => { if('content' in res){ - _self.codeForHighlightAuto = res.content; - _self.loading = false; + console.dir(res.content.length); + if(res.content.length>115000) + _self.hlang='xml'; + else{ + _self.hlang='routeros' + } _self.BakcupModalVisible = true; + _self.codeForHighlightAuto = res.content; + _self.backuploading = false; } else{ this.show_toast('Error', 'Error loading backup file', 'danger') } }); } - toggleCollapse(): void { this.filters_visible = !this.filters_visible; } @@ -205,6 +215,11 @@ export class BackupsComponent implements OnInit { this.compareitems.forEach((element:any) => { _self.data_provider.get_backup(element.id).then((res) => { if('content' in res){ + if(res.content.length>300000){ + this.comparecontents=[]; + this.show_toast('Error', 'The file is too big for comparing, Try accessing and comparing locally', 'danger') + return; + } _self.comparecontents.push(res.content); } if(_self.comparecontents.length==_self.compareitems.length) diff --git a/src/app/views/backups/backups.module.ts b/src/app/views/backups/backups.module.ts index e1eb887..9d6d18c 100644 --- a/src/app/views/backups/backups.module.ts +++ b/src/app/views/backups/backups.module.ts @@ -2,7 +2,7 @@ import { NgModule } from "@angular/core"; import { CommonModule } from "@angular/common"; import { Highlight, HighlightAuto } from "ngx-highlightjs"; import { HighlightLineNumbers } from "ngx-highlightjs/line-numbers"; - +import { HighlightJsModule } from 'ngx-highlight-js'; import { ButtonModule, CardModule, @@ -13,6 +13,7 @@ import { FormModule, ToastModule, } from "@coreui/angular"; + import { BackupsRoutingModule } from "./backups-routing.module"; import { BackupsComponent } from "./backups.component"; import { GuiGridModule } from "@generic-ui/ngx-grid"; @@ -48,6 +49,7 @@ import { ClipboardModule } from "@angular/cdk/clipboard"; UnifiedDiffComponent, SideBySideDiffComponent, ToastModule, + HighlightJsModule, ClipboardModule ], declarations: [BackupsComponent],