From cb54cafd5c47c802457674a1c26998496c9fe291 Mon Sep 17 00:00:00 2001 From: sagIoTPower Date: Fri, 24 Nov 2023 17:13:12 +0100 Subject: [PATCH] added dialog to name extension --- .../src/analytics-extension.module.ts | 10 ++-- .../src/sample/list/sample.component.html | 1 + .../src/sample/list/sample.component.ts | 49 ++++++++++++++- analytics-ui/src/shared/analytics.service.ts | 8 +++ ...t.ts => add-extension-wizard.component.ts} | 2 +- .../wizard/name-extension-modal.component.ts | 60 +++++++++++++++++++ 6 files changed, 122 insertions(+), 8 deletions(-) rename analytics-ui/src/wizard/{analytics-extension-wizard.component.ts => add-extension-wizard.component.ts} (95%) create mode 100644 analytics-ui/src/wizard/name-extension-modal.component.ts diff --git a/analytics-ui/src/analytics-extension.module.ts b/analytics-ui/src/analytics-extension.module.ts index c1d08c3..c8d9200 100644 --- a/analytics-ui/src/analytics-extension.module.ts +++ b/analytics-ui/src/analytics-extension.module.ts @@ -12,7 +12,7 @@ import { import { BinaryFileDownloadModule } from "@c8y/ngx-components/binary-file-download"; import { DefaultSubscriptionsModule } from "@c8y/ngx-components/default-subscriptions"; import { BsDropdownModule } from "ngx-bootstrap/dropdown"; -import { AnalyticsExtensionWizardComponent } from "./wizard/analytics-extension-wizard.component"; +import { AddExtensionWizardComponent } from "./wizard/add-extension-wizard.component"; import { AnalyticsExtensionCardComponent } from "./analytics/manage/extension-card.component"; import { AnalyticsExtensionComponent } from "./analytics/manage/extension.component"; import { AnalyticsService } from "./shared/analytics.service"; @@ -22,6 +22,7 @@ import { BlockGridComponent } from "./analytics/list/block.component"; import { AnalyticsAddExtensionComponent } from "./analytics/manage/extension-add.component"; import { SampleGridComponent } from "./sample/list/sample.component"; import { HttpClientModule } from "@angular/common/http"; +import { NameExtensionComponent } from "./wizard/name-extension-modal.component"; const routes: Route[] = [ { @@ -54,7 +55,8 @@ const routes: Route[] = [ AnalyticsExtensionComponent, AnalyticsExtensionCardComponent, AnalyticsAddExtensionComponent, - AnalyticsExtensionWizardComponent, + AddExtensionWizardComponent, + NameExtensionComponent, BlockGridComponent, SampleGridComponent, ], @@ -62,7 +64,7 @@ const routes: Route[] = [ AnalyticsExtensionComponent, AnalyticsExtensionCardComponent, AnalyticsAddExtensionComponent, - AnalyticsExtensionWizardComponent, + AnalyticsExtensionCardComponent, BlockGridComponent, SampleGridComponent, ], @@ -71,7 +73,7 @@ const routes: Route[] = [ hookNavigator(AnalyticsNavigationFactory), hookWizard({ wizardId: "uploadAnalyticsExtention", - component: AnalyticsExtensionWizardComponent, + component: AnalyticsExtensionCardComponent, name: "Upload analytics extension", c8yIcon: "upload", }), diff --git a/analytics-ui/src/sample/list/sample.component.html b/analytics-ui/src/sample/list/sample.component.html index 989a640..83fdf0f 100644 --- a/analytics-ui/src/sample/list/sample.component.html +++ b/analytics-ui/src/sample/list/sample.component.html @@ -41,6 +41,7 @@ [pagination]="pagination" [selectable]="'true'" [actionControls]="actionControls" + [bulkActionControls]="bulkActionControls" > diff --git a/analytics-ui/src/sample/list/sample.component.ts b/analytics-ui/src/sample/list/sample.component.ts index 4464dc8..6758183 100644 --- a/analytics-ui/src/sample/list/sample.component.ts +++ b/analytics-ui/src/sample/list/sample.component.ts @@ -27,12 +27,16 @@ import { import { ActionControl, AlertService, + BulkActionControl, Column, ColumnDataType, Pagination, + gettext, } from "@c8y/ngx-components"; import { AnalyticsService } from "../../shared/analytics.service"; import { CEP_Block } from "../../shared/analytics.model"; +import { BsModalService } from "ngx-bootstrap/modal"; +import { NameExtensionComponent } from "../../wizard/name-extension-modal.component"; @Component({ selector: "c8y-sample-grid", @@ -44,8 +48,9 @@ export class SampleGridComponent implements OnInit { showConfigSample: boolean = false; refresh: EventEmitter = new EventEmitter(); - samples: Partial[] = []; + samples: any[] = []; actionControls: ActionControl[] = []; + bulkActionControls: BulkActionControl[] = []; titleSample: string = "AnalyticsBuilder Community Samples"; @@ -54,7 +59,13 @@ export class SampleGridComponent implements OnInit { name: "name", header: "Name", path: "name", - filterable: false, + dataType: ColumnDataType.TextLong, + visible: true, + }, + { + name: "url", + header: "URL", + path: "url", dataType: ColumnDataType.TextLong, visible: true, }, @@ -67,7 +78,8 @@ export class SampleGridComponent implements OnInit { constructor( public analyticsService: AnalyticsService, - public alertService: AlertService + public alertService: AlertService, + private bsModalService: BsModalService, ) {} async ngOnInit() { @@ -75,6 +87,37 @@ export class SampleGridComponent implements OnInit { this.refresh.subscribe(() => { this.loadSamples(); }); + + this.bulkActionControls.push( + { + type: "CREATE", + text: "Create Extension", + icon: "export", + callback: this.createExtension.bind(this), + }, + ); + } + + public async createExtension(ids: string[]) { + + const initialState = {}; + const modalRef = this.bsModalService.show(NameExtensionComponent, { + initialState, + }); + modalRef.content.closeSubject.subscribe(async (conf) => { + console.log("Configuration after edit:", conf); + if (conf) { + const response = + await this.analyticsService.createExtensionsZIP(conf.name, ids); + if (response) { + this.alertService.success(gettext(`Created extension ${conf.name}.zip successfully‚`)); + } else { + this.alertService.danger( + gettext("Failed to create extension") + ); + } + } + }); } async loadSamples() { diff --git a/analytics-ui/src/shared/analytics.service.ts b/analytics-ui/src/shared/analytics.service.ts index f063d59..316f594 100644 --- a/analytics-ui/src/shared/analytics.service.ts +++ b/analytics-ui/src/shared/analytics.service.ts @@ -78,6 +78,13 @@ export class AnalyticsService { } return result; } + + + async createExtensionsZIP(name: string, monitors: string[]): Promise { + const result = {}; + return result; + } + async getWebExtensions(customFilter: any = {}): Promise { return (await this.getExtensions(customFilter)).data; } @@ -138,6 +145,7 @@ export class AnalyticsService { .pipe( map((data) => { const name = _.values(data); + name.forEach( b => b.id = b.sha) return name ; }), ).toPromise(); diff --git a/analytics-ui/src/wizard/analytics-extension-wizard.component.ts b/analytics-ui/src/wizard/add-extension-wizard.component.ts similarity index 95% rename from analytics-ui/src/wizard/analytics-extension-wizard.component.ts rename to analytics-ui/src/wizard/add-extension-wizard.component.ts index 9276cb6..dc08df0 100644 --- a/analytics-ui/src/wizard/analytics-extension-wizard.component.ts +++ b/analytics-ui/src/wizard/add-extension-wizard.component.ts @@ -13,7 +13,7 @@ import { AnalyticsService } from '../shared/analytics.service'; [canGoBack]="true" >` }) - export class AnalyticsExtensionWizardComponent { + export class AddExtensionWizardComponent { headerText: string = gettext('Upload analytics extension'); successText: string = gettext('Extension created'); diff --git a/analytics-ui/src/wizard/name-extension-modal.component.ts b/analytics-ui/src/wizard/name-extension-modal.component.ts new file mode 100644 index 0000000..f135767 --- /dev/null +++ b/analytics-ui/src/wizard/name-extension-modal.component.ts @@ -0,0 +1,60 @@ +import { Component, Input, OnInit, Output } from "@angular/core"; +import { ModalLabels } from "@c8y/ngx-components"; +import { Subject } from "rxjs"; +import { FormlyFieldConfig } from "@ngx-formly/core"; +import { FormGroup } from "@angular/forms"; + +@Component({ + selector: "name-extension-modal", + template: ` +
+
+ +
+
+ `, +}) +export class NameExtensionComponent implements OnInit { + @Output() closeSubject: Subject = new Subject(); + configuration: any = {}; + + configFormlyFields: FormlyFieldConfig[] = []; + configFormly: FormGroup = new FormGroup({}); + labels: ModalLabels = { ok: "Save", cancel: "Dismiss" }; + + ngOnInit(): void { + this.configFormlyFields = [ + { + className: "col-lg-12", + key: "name", + type: "input", + wrappers: ["c8y-form-field"], + templateOptions: { + label: "Name Extension", + required: true, + }, + }, + ]; + } + + onDismiss(event) { + console.log("Dismiss"); + this.closeSubject.next(undefined); + } + + onSave(event) { + console.log("Save"); + this.closeSubject.next(this.configuration); + } + +}