From c6bf637c9dea9c325e5a250f6e6367ee31f0d4b9 Mon Sep 17 00:00:00 2001 From: Ekko Chang Date: Tue, 10 Dec 2019 08:03:00 +0000 Subject: Optimize the flow of api callback function Issue-ID: DCAEGEN2-1715 Signed-off-by: Ekko Chang Change-Id: Ic0ecb009db69b095d253687861da6560c200e31a --- .../admin/src/src/app/app.module.ts | 4 +- .../admin/src/src/app/core/models/topic.model.ts | 80 ++- .../src/src/app/core/services/rest-api.service.ts | 322 ++++----- .../app/shared/components/icon/icon.component.css | 0 .../app/shared/components/icon/icon.component.html | 25 + .../shared/components/icon/icon.component.spec.ts | 25 + .../app/shared/components/icon/icon.component.ts | 40 ++ .../app/shared/modules/table/table.component.html | 58 +- .../app/shared/modules/table/table.component.ts | 34 +- .../admin/src/src/app/views/test/test.component.ts | 96 +-- .../new-topic-model/new-topic-model.component.ts | 92 ++- .../topic-detail-modal.component.ts | 4 +- .../topics/topic-list/topic-list.component.html | 142 +--- .../topics/topic-list/topic-list.component.ts | 735 ++++++++++++--------- .../admin/src/src/assets/icons/add.svg | 8 +- .../admin/src/src/assets/icons/druid_able.svg | 26 +- .../admin/src/src/assets/icons/druid_disable.svg | 26 +- .../admin/src/src/assets/icons/hadoop_able.svg | 247 ++++--- .../admin/src/src/assets/icons/hadoop_disable.svg | 247 ++++--- .../admin/src/src/assets/icons/kafka_able.svg | 27 +- .../admin/src/src/assets/icons/kafka_disable.svg | 27 +- .../admin/src/src/assets/icons/kibana_able.svg | 13 +- .../admin/src/src/assets/icons/kibana_disable.svg | 13 +- .../admin/src/src/assets/icons/mongoDB_able.svg | 20 +- .../admin/src/src/assets/icons/mongoDB_disable.svg | 20 +- 25 files changed, 1203 insertions(+), 1128 deletions(-) create mode 100644 components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.css create mode 100644 components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.html create mode 100644 components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.spec.ts create mode 100644 components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.ts (limited to 'components') diff --git a/components/datalake-handler/admin/src/src/app/app.module.ts b/components/datalake-handler/admin/src/src/app/app.module.ts index 927f229a..2f968bfb 100644 --- a/components/datalake-handler/admin/src/src/app/app.module.ts +++ b/components/datalake-handler/admin/src/src/app/app.module.ts @@ -100,6 +100,7 @@ import { ModalDemoComponent } from "./views/test/modal-demo/modal-demo.component import { KafkaComponent } from './views/kafka/kafka.component'; // Angular SVG Icon import { AngularSvgIconModule } from "angular-svg-icon"; +import { IconComponent } from './shared/components/icon/icon.component'; @NgModule({ declarations: [ @@ -144,7 +145,8 @@ import { AngularSvgIconModule } from "angular-svg-icon"; EditKafkaModalComponent, ToolsComponent, ModalToolsComponent, - ToolAddModalComponent + ToolAddModalComponent, + IconComponent ], imports: [ BrowserModule, diff --git a/components/datalake-handler/admin/src/src/app/core/models/topic.model.ts b/components/datalake-handler/admin/src/src/app/core/models/topic.model.ts index d8f7fe70..18faa582 100644 --- a/components/datalake-handler/admin/src/src/app/core/models/topic.model.ts +++ b/components/datalake-handler/admin/src/src/app/core/models/topic.model.ts @@ -23,20 +23,68 @@ * @author Ekko Chang * */ + export class Topic { - enabled: boolean; - name: string; - login: string; - password: string; - enabledSinkdbs: any; - sinkdbs: any; - saveRaw: boolean; - dataFormat: string; - ttl: number; - correlateClearedMessage: boolean; - messageIdPath: string; - // for UI display - type: boolean; // 1: Configure 0: Unconfiure - //id: number; //todo - //kafkas: any; //todo -} \ No newline at end of file + public id: number; + public name: string; + public login: string; + public password: string; + public enabledSinkdbs: Array; // related db which is enabled + public sinkdbs: Array; // related db whatever enabled or disable + public enabled: boolean; + public saveRaw: boolean; + public dataFormat: string; + public ttl: number; + public correlateClearedMessage: boolean; + public messageIdPath: string; + public aggregateArrayPath: string; + public flattenArrayPath: string; + public enbabledKafkas: Array; + public kafkas: Array; + // properties only for UI + public config: boolean; //true: Configure, otherwise false: Unconfiure + public kafkaName: string; + public countCouchbase: number; + public countDruid: number; + public countEs: number; + public countMongo: number; + public countHadoop: number; + + constructor( + id: number, + name: string, + login: string, + password: string, + enabledSinkdbs: Array, + sinkdbs: Array, + enabled: boolean, + saveRaw: boolean, + dataFormat: string, + ttl: number, + correlateClearedMessage: boolean, + messageIdPath: string, + aggregateArrayPath: string, + flattenArrayPath: string, + enbabledKafkas: Array, + kafkas: Array, + config: boolean + ) { + this.id = id; + this.name = name; + this.login = login; + this.password = password; + this.enabledSinkdbs = enabledSinkdbs; + this.sinkdbs = sinkdbs; + this.enabled = enabled; + this.saveRaw = saveRaw; + this.dataFormat = dataFormat; + this.ttl = ttl; + this.correlateClearedMessage = correlateClearedMessage; + this.messageIdPath = messageIdPath; + this.aggregateArrayPath = aggregateArrayPath; + this.flattenArrayPath = flattenArrayPath; + this.enbabledKafkas = enbabledKafkas; + this.kafkas = kafkas; + this.config = config; + } +} diff --git a/components/datalake-handler/admin/src/src/app/core/services/rest-api.service.ts b/components/datalake-handler/admin/src/src/app/core/services/rest-api.service.ts index 8ccbcc91..0c520895 100644 --- a/components/datalake-handler/admin/src/src/app/core/services/rest-api.service.ts +++ b/components/datalake-handler/admin/src/src/app/core/services/rest-api.service.ts @@ -35,7 +35,7 @@ import { Topic } from "src/app/core/models/topic.model"; import { Db } from "src/app/core/models/db.model"; import { Template } from "src/app/core/models/template.model"; import { Dashboard } from "src/app/core/models/dashboard.model"; -import {Kafka} from "../models/kafka.model"; +import { Kafka } from "../models/kafka.model"; const prefix = "/datalake/v1/"; const httpOptions = { @@ -48,7 +48,7 @@ const httpOptions = { providedIn: "root" }) export class RestApiService { - constructor(private http: HttpClient) { } + constructor(private http: HttpClient) {} private extractData(res: Response) { if (res.status < 200 || res.status >= 300) { @@ -79,118 +79,106 @@ export class RestApiService { /* Topic default config */ - getTopicDefaultConfig(): Observable { - return this.http.get(prefix + "topics/_DL_DEFAULT_").pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); - } - - updateTopicDefaultConfig(t: Topic): Observable { + public getTopicDefault(): Observable { return this.http - .put(prefix + "topics/_DL_DEFAULT_", JSON.stringify(t), httpOptions) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); - } + .get(prefix + "topics/default") + .pipe(retry(1), catchError(this.handleError)); + } + + // updateTopicDefaultConfig(t: Topic): Observable { + // return this.http + // .put(prefix + "topics/_DL_DEFAULT_", JSON.stringify(t), httpOptions) + // .pipe( + // retry(1), + // tap(_ => this.extractData), + // catchError(this.handleError) + // ); + // } /* Topics */ - getTopicsFromDmaap(): Observable { - return this.http.get(prefix + "topics/dmaap").pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); - } - - getTopicsFromFeeder(): Observable { - return this.http.get(prefix + "topics").pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); - } - - getTopicDetail(id): Observable { - return this.http.get(prefix + "topics/" + id).pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + public getTopicList(): Observable { + return this.http + .get(prefix + "topics") + .pipe(retry(1), catchError(this.handleError)); } - addNewTopic(t: Topic): Observable { + public getTopicListFromKafka(id: string | number): Observable { return this.http - .post(prefix + "topics", t) - .pipe( - retry(1), - tap(_ => console.log(`add topic name=${t.name}`)), - catchError(this.handleError) - ); + .get(prefix + "topics/dmaap/" + id) + .pipe(retry(1), catchError(this.handleError)); } - addTopic(t: Topic): Observable { + public getTopic(id: string): Observable { return this.http - .post(prefix + "topics", t) - .pipe( - retry(1), - tap(_ => console.log(`add topic name=${t.name}`)), - catchError(this.handleError) - ); + .get(prefix + "topics/" + id) + .pipe(retry(1), catchError(this.handleError)); } - upadteTopic(t: Topic): Observable { + // TODO + getTopicsFromFeeder(): Observable { return this.http - .put(prefix + "topics/" + t.name, t) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + .get(prefix + "topics") + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } - deleteTopic(name: string): Observable { - return this.http.delete(prefix + "topics/" + name).pipe( - retry(1), - tap(_ => console.log(`deleted topic name=${name}`)), - catchError(this.handleError) - ); - } + // addNewTopic(t: Topic): Observable { + // return this.http.post(prefix + "topics", t).pipe( + // retry(1), + // tap(_ => console.log(`add topic name=${t.name}`)), + // catchError(this.handleError) + // ); + // } + + // addTopic(t: Topic): Observable { + // return this.http.post(prefix + "topics", t).pipe( + // retry(1), + // tap(_ => console.log(`add topic name=${t.name}`)), + // catchError(this.handleError) + // ); + // } + + // upadteTopic(t: Topic): Observable { + // return this.http.put(prefix + "topics/" + t.name, t).pipe( + // retry(1), + // tap(_ => this.extractData), + // catchError(this.handleError) + // ); + // } + + // deleteTopic(name: string): Observable { + // return this.http.delete(prefix + "topics/" + name).pipe( + // retry(1), + // tap(_ => console.log(`deleted topic name=${name}`)), + // catchError(this.handleError) + // ); + // } /* Database */ getDbEncryptList(flag): Observable { - return this.http.get(prefix + "dbs/list?isDb="+flag).pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(prefix + "dbs/list?tool=" + flag) + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } getDbList(): Observable { - return this.http.get(prefix + "dbs").pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(prefix + "dbs") + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } getDbDetail(id): Observable { - return this.http.get(prefix + "dbs/" + id).pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(prefix + "dbs/" + id) + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } deleteDb(id): Observable { - return this.http.delete(prefix + "dbs/" + id).pipe( //online + return this.http.delete(prefix + "dbs/" + id).pipe( + //online retry(1), map(this.extractData2), catchError(this.handleError) @@ -198,33 +186,27 @@ export class RestApiService { } updateDb(d: Db): Observable { - return this.http - .put(prefix + "dbs", d) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + return this.http.put(prefix + "dbs", d).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } createDb(d: Db): Observable { - return this.http - .post(prefix + "dbs", d) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); - } - - getDbTypeList(): Observable { - return this.http.get(prefix + "db_type").pipe( + return this.http.post(prefix + "dbs", d).pipe( retry(1), - map(this.extractData), + tap(_ => this.extractData), catchError(this.handleError) ); } + getDbTypeList(): Observable { + return this.http + .get(prefix + "db_type") + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); + } + /* Feeder */ @@ -245,55 +227,46 @@ export class RestApiService { } getFeederstatus() { - return this.http.get(prefix + "feeder/status").pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(prefix + "feeder/status") + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } - /* Dashboard */ getDashboardList(): Observable { let url = prefix + "portals"; //onilne - return this.http.get(url).pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(url) + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } createUpadteDashboard(d: Dashboard): Observable { // let url = prefix +"/dashboard-list/successCreteOrEditDemo.json"; //local - let url = prefix + "portals";//onilne - return this.http - .put(url, d) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + let url = prefix + "portals"; //onilne + return this.http.put(url, d).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } deleteDashboard(d: Dashboard): Observable { let url = prefix + "portals"; //onilne - return this.http - .put(url, d) - .pipe( - retry(1), - tap(_ => console.log(`deleted db name=${d.name}`)), - catchError(this.handleError) - ); + return this.http.put(url, d).pipe( + retry(1), + tap(_ => console.log(`deleted db name=${d.name}`)), + catchError(this.handleError) + ); } - /* Template */ getTemplateAll(): Observable { - return this.http.get(prefix + "designs/").pipe( //onlin + return this.http.get(prefix + "designs/").pipe( + //onlin retry(1), map(this.extractData), catchError(this.handleError) @@ -301,32 +274,26 @@ Dashboard } getTempDbList(id): Observable { - return this.http.get(prefix + "dbs/idAndName/" + id).pipe( - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + return this.http + .get(prefix + "dbs/idAndName/" + id) + .pipe(retry(1), map(this.extractData), catchError(this.handleError)); } createNewTemplate(t: Template): Observable { - return this.http - .post(prefix + "designs", t) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + return this.http.post(prefix + "designs", t).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } updateNewTemplate(t: Template): Observable { let id = t.id; - return this.http - .put(prefix + "designs/" + id, t) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + return this.http.put(prefix + "designs/" + id, t).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } // getTopicName(): Observable { @@ -338,7 +305,8 @@ Dashboard // } getTemplateTypeName(): Observable { - return this.http.get(prefix + "designTypes").pipe( //onlin + return this.http.get(prefix + "designTypes").pipe( + //onlin retry(1), map(this.extractData), catchError(this.handleError) @@ -346,7 +314,8 @@ Dashboard } DeleteTemplate(id): Observable { - return this.http.delete(prefix + "designs/" + id).pipe( //online + return this.http.delete(prefix + "designs/" + id).pipe( + //online retry(1), map(this.extractData2), catchError(this.handleError) @@ -354,7 +323,8 @@ Dashboard } deployTemplateKibana(id, body): Observable { body.submitted = true; - return this.http.post(prefix + "designs/deploy/" + id, body).pipe( //online + return this.http.post(prefix + "designs/deploy/" + id, body).pipe( + //online retry(1), map(this.extractData2), catchError(this.handleError) @@ -364,15 +334,21 @@ Dashboard /* Kafka */ - getAllKafkaList() { - return this.http.get(prefix + "kafkas").pipe( //online - retry(1), - map(this.extractData), - catchError(this.handleError) - ); + public getAllKafkaList(): Observable { + return this.http + .get(prefix + "kafkas") + .pipe(retry(1), catchError(this.handleError)); + } + + public getKafka(id: string | number): Observable { + return this.http + .get(prefix + "kafkas/" + id) + .pipe(retry(1), catchError(this.handleError)); } + deleteKafka(id): Observable { - return this.http.delete(prefix + "kafkas/" + id).pipe( //online + return this.http.delete(prefix + "kafkas/" + id).pipe( + //online retry(1), map(this.extractData2), catchError(this.handleError) @@ -380,25 +356,19 @@ Dashboard } createNewKafka(k: Kafka): Observable { - return this.http - .post(prefix + "kafkas", k) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + return this.http.post(prefix + "kafkas", k).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } updateKafka(k: Kafka): Observable { let id = k.id; - return this.http - .put(prefix + "kafkas/" + id, k) - .pipe( - retry(1), - tap(_ => this.extractData), - catchError(this.handleError) - ); + return this.http.put(prefix + "kafkas/" + id, k).pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); } } - - diff --git a/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.css b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.css new file mode 100644 index 00000000..e69de29b diff --git a/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.html b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.html new file mode 100644 index 00000000..86d8ae26 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.html @@ -0,0 +1,25 @@ + + + + + diff --git a/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.spec.ts b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.spec.ts new file mode 100644 index 00000000..481dc4b8 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { IconComponent } from './icon.component'; + +describe('IconComponent', () => { + let component: IconComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ IconComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(IconComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.ts b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.ts new file mode 100644 index 00000000..12a7e9a5 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/shared/components/icon/icon.component.ts @@ -0,0 +1,40 @@ +/* + * ============LICENSE_START======================================================= + * ONAP : DataLake + * ================================================================================ + * Copyright 2019 QCT + *================================================================================= + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END========================================================= + */ + +/** + * + * @author Ekko Chang + * + */ +import { Component, OnInit, Input, Output, EventEmitter } from "@angular/core"; + +@Component({ + selector: "app-icon", + templateUrl: "./icon.component.html", + styleUrls: ["./icon.component.css"] +}) +export class IconComponent implements OnInit { + @Input() type: string; + @Input() enabled: boolean; + + constructor() {} + + ngOnInit() {} +} diff --git a/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.html b/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.html index cf9be50c..c0e0971c 100644 --- a/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.html +++ b/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.html @@ -23,52 +23,46 @@ limitations under the License. + [messages]="mesgNoData" [limit]="10" (activate)="rowOnActivate($event)"> - + headerClass="d-flex justify-content-center justify-content-start" cellClass="d-flex justify-content-center"> + - {{ column.name | translate}} - - Icon + + + {{ column.headerName | translate}} + + + + + - {{row[column.dataIndex]}} - - - - - + + {{row[column.dataIndex]}} - - - + + + - - - - - + + + - - - - + + + - --> + - \ No newline at end of file + diff --git a/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.ts b/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.ts index 9c69e125..8adb8370 100644 --- a/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.ts +++ b/components/datalake-handler/admin/src/src/app/shared/modules/table/table.component.ts @@ -1,19 +1,19 @@ -import {Component, OnInit, Input, Output, EventEmitter} from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from "@angular/core"; /** * @contributor Chunmeng Guo */ @Component({ - selector: 'app-table', - templateUrl: './table.component.html', - styleUrls: ['./table.component.css'] + selector: "app-table", + templateUrl: "./table.component.html", + styleUrls: ["./table.component.css"] }) export class TableComponent implements OnInit { @Input() columns: Array = []; @Input() data: Array = []; - @Output() btnTableAction = new EventEmitter() - loadingIndicator: boolean = false; + @Output() btnTableAction = new EventEmitter(); + loadingIndicator: boolean = true; template_list: Array = []; mesgNoData = { @@ -26,16 +26,30 @@ export class TableComponent implements OnInit { ` }; - constructor() { } + constructor() {} ngOnInit() { - + setTimeout(() => { + this.loadingIndicator = false; + }, 500); } - tableAction($event, actionId: number) { + tableAction(event: any, actionId: number) { + console.log("action id: " + actionId); + console.log("edit: " + event.row.id); let passValueArr: Array = []; - passValueArr.push($event); + passValueArr.push(event); passValueArr.push(actionId); this.btnTableAction.emit(passValueArr); } + + rowOnActivate(event: any) { + const emitType = event.type; + if (emitType == "dblclick") { + console.log("Activate Event", event); + let name = event.row.id; + // this.openTopicModal(name); + console.log("row name: " + name); + } + } } diff --git a/components/datalake-handler/admin/src/src/app/views/test/test.component.ts b/components/datalake-handler/admin/src/src/app/views/test/test.component.ts index b8a67fb5..ca498054 100644 --- a/components/datalake-handler/admin/src/src/app/views/test/test.component.ts +++ b/components/datalake-handler/admin/src/src/app/views/test/test.component.ts @@ -60,47 +60,52 @@ export class TestComponent implements OnInit { ngOnInit() { this.mockcolumns = [ { - name: "TEMPLATE_NAME", - width: "100", - dataIndex: "name", - sortable: true + headerName: "STATUS", + width: "20", + dataIndex: "enabled", + sortable: true, + icon: "status" }, { - name: "TEMPLATE_TYPE", - width: "180", - dataIndex: "type" + headerName: "2", + width: "100", + dataIndex: "type", + icon: "status" }, { - name: "TOPICS_NAME", - width: "220", + headerName: "3", + width: "200", dataIndex: "topic", - renderText: "3" + renderText: "zzzz" }, { - name: "", - src: "assets/icons/couchbase_able.svg", - width: "220", + headerIcon: "assets/icons/couchbase_able.svg", + width: "200", dataIndex: "cc", + renderText: "zzzzz" }, { - name: "DEPLOY_TO_DASHBOARD", - width: "100", + headerName: "5", + width: "50", dataIndex: "", - icontext: "DEPLOY", + textButton: "DEPLOY1" }, { - name: "", width: "20", - icon: "trash" + iconButton: "cog" }, { - name: "Configured", + headerName: "Configured", width: "100", dataIndex: "configured", - svgicon: "assets/icons/add.svg" - // icontext: "DEPLOY", - //svg: "assets/icons/add.svg", // TODO: icon + icon: "check" }, + { + headerName: "TTL", + width: "100", + dataIndex: "saveRaw", + icon: "check" + } ]; this.mocktabledata = [ { @@ -108,39 +113,45 @@ export class TestComponent implements OnInit { type: "333", topic: "尽快尽快", cc: "123", - configured: true + configured: true, + saveRaw: true, + enabled: true }, { name: "ccccc", type: "666", topic: "2222", cc: "222", - configured: true + configured: true, + saveRaw: true, + enabled: false }, { name: "bbbbb", type: "77777", topic: "555", cc: "5", - configured: false + configured: false, + saveRaw: false, + enabled: false } ]; // Modal example // Data for different components of modal body // Example for topic, not only topic but also db, design or tools - this.topic = new Topic(); - this.topic.name = "topic.name (test)"; - this.topic.login = "123"; - this.topic.password = "123"; - this.topic.sinkdbs = ""; - this.topic.enabled = true; - this.topic.saveRaw = true; - this.topic.dataFormat = ""; - this.topic.ttl = 123; - this.topic.correlateClearedMessage = true; - this.topic.messageIdPath = ""; - this.topic.type = false; + // this.topic = new Topic(); + // this.topic.name = "topic.name (test)"; + // this.topic.login = "123"; + // this.topic.password = "123"; + // this.topic.sinkdbs = ""; + // this.topic.enabled = true; + // this.topic.saveRaw = true; + // this.topic.dataFormat = ""; + // this.topic.ttl = 123; + // this.topic.correlateClearedMessage = true; + // this.topic.messageIdPath = ""; + // this.topic.type = false; // Modal example end // Card example @@ -191,14 +202,13 @@ export class TestComponent implements OnInit { } cardMoreAction($event) { - if($event == "edit"){ - this.openModalDemo() - }else { - console.log($event,"$event") + if ($event == "edit") { + this.openModalDemo(); + } else { + console.log($event, "$event"); } } - cardClick(){ + cardClick() { this.openModalDemo(); } - } diff --git a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/new-topic-model/new-topic-model.component.ts b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/new-topic-model/new-topic-model.component.ts index 04bd331d..b1d782dc 100644 --- a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/new-topic-model/new-topic-model.component.ts +++ b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/new-topic-model/new-topic-model.component.ts @@ -28,9 +28,9 @@ import { AdminService } from "src/app/core/services/admin.service"; import { Topic } from "src/app/core/models/topic.model"; @Component({ - selector: 'app-new-topic-model', - templateUrl: './new-topic-model.component.html', - styleUrls: ['./new-topic-model.component.css'] + selector: "app-new-topic-model", + templateUrl: "./new-topic-model.component.html", + styleUrls: ["./new-topic-model.component.css"] }) export class NewTopicModelComponent implements OnInit { @Input() newTopic: Topic; @@ -57,46 +57,46 @@ export class NewTopicModelComponent implements OnInit { } ngOnInit() { - this.newTopic = { - name: "", - login: "", - password: "", - sinkdbs: [], - enabledSinkdbs: [], - enabled: false, - saveRaw: false, - dataFormat: this.dataFormats[0], - ttl: null, - correlateClearedMessage: false, - messageIdPath: null, - type: null - }; - this.TopicInput = new Topic(); - const feeds = { - name: this.newTopic.name, - login: this.newTopic.login, - password: this.newTopic.password, - sinkdbs: this.newTopic.sinkdbs, - enabledSinkdbs: this.newTopic.sinkdbs, - enabled: this.newTopic.enabled, - saveRaw: this.newTopic.saveRaw, - dataFormat: this.newTopic.dataFormat, - ttl: this.newTopic.ttl, - correlateClearedMessage: this.newTopic.correlateClearedMessage, - messageIdPath: this.newTopic.messageIdPath, - type: null - }; - this.TopicInput = feeds; - this.idExFields = []; - if (this.TopicInput.messageIdPath != null) { - var feed = this.TopicInput.messageIdPath.split(","); - for (var i = 0; i < feed.length; i++) { - var data = { item: feed[i] }; - this.idExFields.push(data); - } - } else { - this.idExFields.push([]); - } + // this.newTopic = { + // name: "", + // login: "", + // password: "", + // sinkdbs: [], + // enabledSinkdbs: [], + // enabled: false, + // saveRaw: false, + // dataFormat: this.dataFormats[0], + // ttl: null, + // correlateClearedMessage: false, + // messageIdPath: null, + // type: null + // }; + // this.TopicInput = new Topic(); + // const feeds = { + // name: this.newTopic.name, + // login: this.newTopic.login, + // password: this.newTopic.password, + // sinkdbs: this.newTopic.sinkdbs, + // enabledSinkdbs: this.newTopic.sinkdbs, + // enabled: this.newTopic.enabled, + // saveRaw: this.newTopic.saveRaw, + // dataFormat: this.newTopic.dataFormat, + // ttl: this.newTopic.ttl, + // correlateClearedMessage: this.newTopic.correlateClearedMessage, + // messageIdPath: this.newTopic.messageIdPath, + // type: null + // }; + // this.TopicInput = feeds; + // this.idExFields = []; + // if (this.TopicInput.messageIdPath != null) { + // var feed = this.TopicInput.messageIdPath.split(","); + // for (var i = 0; i < feed.length; i++) { + // var data = { item: feed[i] }; + // this.idExFields.push(data); + // } + // } else { + // this.idExFields.push([]); + // } } getDbs() { @@ -144,8 +144,7 @@ export class NewTopicModelComponent implements OnInit { if (i == 0) { this.newTopic.messageIdPath = item; } else { - this.newTopic.messageIdPath = - this.newTopic.messageIdPath + "," + item; + this.newTopic.messageIdPath = this.newTopic.messageIdPath + "," + item; } } // Reset to default @@ -155,5 +154,4 @@ export class NewTopicModelComponent implements OnInit { console.log(this.newTopic); this.passEntry.emit(this.newTopic); } - -} \ No newline at end of file +} diff --git a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-detail-modal/topic-detail-modal.component.ts b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-detail-modal/topic-detail-modal.component.ts index e2dd1825..17d0d036 100644 --- a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-detail-modal/topic-detail-modal.component.ts +++ b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-detail-modal/topic-detail-modal.component.ts @@ -143,9 +143,9 @@ export class TopicDetailModalComponent implements OnInit { // Reset to default if (this.topic.sinkdbs.length == 0) { - this.topic.type = false; + this.topic.config = false; } else { - this.topic.type = true; + this.topic.config = true; } this.passEntry.emit(this.topic); } diff --git a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.html b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.html index e4596f68..3fbbc420 100644 --- a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.html +++ b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.html @@ -27,150 +27,24 @@ limitations under the License.
-
- -
+
- - + +
+
+
+
- - - -
- - - - - - - - -
-
- - - - {{ row.name }} - - - - -
- - - - - - -
-
- - - - Icon - - - - - - Icon - - - - - - Icon - - - - - - Icon - - - - - - Icon - - - - - - Icon - - - - - - {{ row.ttl }} - - - - -
- - - - - - - - -
-
- - - - - - - - - - - -
- total: {{ rowCount.toLocaleString() }} -
- - -
-
-
+
- \ No newline at end of file + diff --git a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.ts b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.ts index dbb2706c..d2d983f9 100644 --- a/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.ts +++ b/components/datalake-handler/admin/src/src/app/views/topics/topic-list/topic-list.component.ts @@ -39,7 +39,11 @@ import { ToastrNotificationService } from "src/app/shared/components/toastr-noti // Loading spinner import { NgxSpinnerService } from "ngx-spinner"; -import { AlertComponent } from "../../../shared/components/alert/alert.component"; + +import { AlertComponent } from "src/app/shared/components/alert/alert.component"; +import { map, mergeMap } from "rxjs/operators"; +import { forkJoin, from } from "rxjs"; +import { HttpClient } from "@angular/common/http"; @Component({ selector: "app-topic-list", @@ -47,336 +51,461 @@ import { AlertComponent } from "../../../shared/components/alert/alert.component styleUrls: ["./topic-list.component.css"] }) export class TopicListComponent { - topicListDmaap: any = []; - topicListFeeder: any = []; - topicDefaultConfig: Topic; - - topics: Topic[] = []; - temp: Topic[] = []; // cache for topics - tempTopicDetail: Topic; // temp for a topic - tempNewTopic: Topic; // temp for a newtopic - - loadingIndicator: boolean = true; - mesgNoData = { - emptyMessage: ` -
-
- -
-
- ` - }; - - @ViewChild("searchText") searchText: ElementRef; - @ViewChild("mydatatable") topicTable; + topics: Array = []; // data of table + columns: Array = []; // column of table + t_temp: Array = []; // cache for topics + + //TODO + //tempTopicDetail: Topic; // temp for a topic + //tempNewTopic: Topic; // temp for a newtopic constructor( private restApiService: RestApiService, private modalService: NgbModal, private notificationService: ToastrNotificationService, - private spinner: NgxSpinnerService - ) { - setTimeout(() => { - this.loadingIndicator = false; - }, 5000); - this.init() - - } + private spinner: NgxSpinnerService, + public http: HttpClient + ) {} ngOnInit() { - this.spinner.show(); - } - - init() { - this.initData().then(data => { - this.initTopicList(this.topicListDmaap, this.topicListFeeder).then( - data => { - // for cache of datatable - this.temp = [...data]; - this.topics = data; - setTimeout(() => { - this.spinner.hide(); - }, 500); - } - ); + //this.spinner.show(); + let t_feeder: Array = []; + let t_kafka: Object = {}; + + const get_t_feeder = this.restApiService.getTopicList().pipe( + mergeMap(ids => from(ids)), + mergeMap(id => this.restApiService.getTopic(id)), + map(t => { + t.config = true; + t_feeder.push(t); + }) + ); + + const get_t_kafka = this.restApiService.getAllKafkaList().pipe( + mergeMap(ids => from(ids)), + mergeMap(id => + this.restApiService + .getTopicListFromKafka(id) + .pipe(map(t => (t_kafka[id] = t))) + ) + ); + + const get_t_default = this.restApiService.getTopicDefault(); + + forkJoin(get_t_feeder, get_t_kafka, get_t_default).subscribe(data => { + this.columns = this.initColumn(); + this.topics = this.initRow(t_feeder, t_kafka, data[2]); + this.t_temp = [...this.topics]; + // setTimeout(() => { + // //this.spinner.hide(); + // this.loadingIndicator = false; + // }, 500); }); } - async initData() { - this.topicListFeeder = []; - this.topicListFeeder = await this.getTopicList("feeder"); - - this.topicDefaultConfig = new Topic(); - this.topicDefaultConfig = await this.getTopicDefaultConfig(); - - return true; - } - - getTopicList(type: string) { - var data: any; - - switch (type) { - case "feeder": { - data = this.restApiService.getTopicsFromFeeder().toPromise(); - break; - } - } - return data; - } - - getTopicDefaultConfig() { - return this.restApiService.getTopicDefaultConfig().toPromise(); - } - - async initTopicList(dmaapList: [], feederList: []) { - var t: Topic[] = []; - - // dmaap has no topics, only show topic in db - for (var i = 0; i < feederList.length; i++) { - let data = await this.getTopicDetail(feederList[i]); - let dbinfo = []; - var totalCB = 0; - var totalDRUID = 0; - var totalES = 0; - var totalHDFS = 0; - var totalMONGO = 0; - for (var x = 0; x < data.enabledSinkdbs.length; x++) { - let dbdata = await this.getDbDetail(data.enabledSinkdbs[x]); - dbinfo.push(dbdata); - if (dbinfo!=undefined && dbinfo[x].type=="CB"){ - totalCB = totalCB + 1; - }if (dbinfo!=undefined && dbinfo[x].type=="DRUID"){ - totalDRUID = totalDRUID + 1; - }if (dbinfo!=undefined && dbinfo[x].type=="ES"){ - totalES = totalES + 1; - }if (dbinfo!=undefined && dbinfo[x].type=="HDFS"){ - totalHDFS = totalHDFS + 1; - }if (dbinfo!=undefined && dbinfo[x].type=="MONGO"){ - totalMONGO = totalMONGO + 1; - } - } - - let feed = { - name: data.name, - login: data.login, - password: data.password, - enabledSinkdbs: data.enabledSinkdbs, - sinkdbs: data.sinkdbs, - enabled: data.enabled, - saveRaw: data.saveRaw, - dataFormat: data.dataFormat, - ttl: data.ttl, - correlateClearedMessage: data.correlateClearedMessage, - messageIdPath: data.messageIdPath, - kafkas: data.kafkas.length, - type: data.type, - CB: totalCB, - DRUID: totalDRUID, - ES: totalES, - HDFS: totalHDFS, - MONGO: totalMONGO - }; - t.push(feed); + initColumn() { + let t_columns: Array = []; + + t_columns = [ + { + headerName: "STATUS", + width: "15", + sortable: true, + dataIndex: "enabled", + icon: "status" + }, + { + headerName: "NAME", + width: "420", + sortable: true, + dataIndex: "name" + }, + { + headerName: "SETTING", + width: "30", + sortable: true, + dataIndex: "config", + icon: "check" + }, + { + headerIcon: "assets/icons/kibana_able.svg", + width: "10", + sortable: true, + dataIndex: "kafkas" + }, + { + headerIcon: "assets/icons/couchbase_able.svg", + width: "10", + sortable: true, + dataIndex: "sinkdbs" + }, + { + headerIcon: "assets/icons/druid_able.svg", + width: "10", + sortable: true, + dataIndex: "sinkdbs" + }, + { + headerIcon: "assets/icons/elasticsearch_able.svg", + width: "10", + sortable: true, + dataIndex: "sinkdbs" + }, + { + headerIcon: "assets/icons/mongoDB_able.svg", + width: "10", + sortable: true, + dataIndex: "sinkdbs" + }, + { + headerIcon: "assets/icons/hadoop_able.svg", + width: "10", + sortable: true, + dataIndex: "sinkdbs" + }, + { + headerName: "TTL", + width: "20", + sortable: true, + dataIndex: "ttl" + }, + { + headerName: "SAVE_RAW_DATA", + width: "20", + sortable: true, + dataIndex: "saveRaw", + icon: "check" + }, + { + width: "20", + iconButton: "cog" } - return t; - } - - onActivate(event) { - const emitType = event.type; - if (emitType == "dblclick") { - console.log('Activate Event', event); - let name = event.row.name; - this.openTopicModal(name); - } - - } - - openNewTopicModal() { - const modalRef = this.modalService.open(NewTopicModelComponent, { - size: "lg", - centered: true - }); - modalRef.componentInstance.newTopic = this.tempNewTopic; - modalRef.componentInstance.passEntry.subscribe(receivedEntry => { - console.log(receivedEntry, "newtopic receivedEntry"); - this.tempNewTopic = receivedEntry; - this.restApiService.addNewTopic(this.tempNewTopic).subscribe( - res => { - this.init(); - this.notificationService.success("SUCCESSFULLY_CREARED"); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - } - ); - }) - + ]; + return t_columns; } - openTopicModal(name: string) { - if (name == "config") { - const modalRef = this.modalService.open(TopicConfigModalComponent, { - windowClass: "dl-md-modal", - centered: true - }); - modalRef.componentInstance.title = "Topics Default Configurations"; - modalRef.componentInstance.topic = this.topicDefaultConfig; - modalRef.componentInstance.passEntry.subscribe(receivedEntry => { - this.restApiService - .updateTopicDefaultConfig(this.topicDefaultConfig) - .subscribe( - res => { - this.topicDefaultConfig = receivedEntry; - this.topics.forEach(t => { - if (!t.type) { - // Unconfigure topics - t.login = this.topicDefaultConfig.login; - t.password = this.topicDefaultConfig.password; - t.enabledSinkdbs = this.topicDefaultConfig.enabledSinkdbs; - // t.sinkdbs = this.topicDefaultConfig.sinkdbs; //todo - t.enabled = this.topicDefaultConfig.enabled; - t.saveRaw = this.topicDefaultConfig.saveRaw; - t.dataFormat = this.topicDefaultConfig.dataFormat; - t.ttl = this.topicDefaultConfig.ttl; - t.correlateClearedMessage = this.topicDefaultConfig.correlateClearedMessage; - t.messageIdPath = this.topicDefaultConfig.messageIdPath; - } - }); - this.notificationService.success("Success updated."); - modalRef.close(); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - } - ); - }); - } else { - const index = this.temp.findIndex(t => t.name === name); - const modalRef = this.modalService.open(TopicDetailModalComponent, { - size: "lg", - centered: true - }); - modalRef.componentInstance.topic = this.temp[index]; - modalRef.componentInstance.passEntry.subscribe(receivedEntry => { - this.tempTopicDetail = receivedEntry; - // Configured topic - if (this.tempTopicDetail.type) { - this.restApiService.getTopicsFromFeeder().subscribe( - res => { - if (res.find(name => name === this.tempTopicDetail.name)) { - // Update topic from db - this.restApiService.upadteTopic(this.tempTopicDetail).subscribe( - res => { - this.temp[index] = this.tempTopicDetail; - this.topics = this.temp; - this.notificationService.success("SUCCESSFULLY_UPDATED"); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - } - ); - } else { - // Insert topic from db - this.restApiService.addTopic(this.tempTopicDetail).subscribe( - res => { - this.init(); - this.notificationService.success("SUCCESSFULLY_CREARED"); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - } - ); - } - }, - err => { - this.notificationService.error(err); - modalRef.close(); - } - ); - } else { - // Reset to default and delete topic from db - this.restApiService.deleteTopic(this.tempTopicDetail.name).subscribe( - res => { - this.init(); - this.notificationService.success("SUCCESSFULLY_DELETED"); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - } - ); + initRow(t_feeder: Array, t_kafka: Object, t_default: Topic) { + let t_topics: Array = []; + + // Save topics which are already configured. + t_topics = t_feeder; + + // Save the topic which is unconfigured yet. + Object.keys(t_kafka).forEach(k_id => { + Object.values(t_kafka[k_id]).forEach((k_t_name: string) => { + let found: Topic = t_feeder.find( + t => + t.name == k_t_name && + t.kafkas.map(ids => ids.toString()).includes(k_id) + ); + if (!found) { + let seed: Topic; + seed = JSON.parse(JSON.stringify(t_default)); + seed.id = null; + seed.name = k_t_name; + seed.kafkas = []; + seed.kafkas.push(k_id); + seed.config = false; + t_topics.push(seed); } }); - } - } - - deleteTopicModal(name: string) { - const index = this.temp.findIndex(t => t.name === name); - const modalRef = this.modalService.open(AlertComponent, { - size: "sm", - centered: true }); - modalRef.componentInstance.message = "ARE_YOU_SURE_DELETE"; - console.log(this.temp[index]); - modalRef.componentInstance.passEntry.subscribe(receivedEntry => { - this.restApiService.deleteTopic(this.temp[index].name).subscribe( - res => { - this.init(); - this.notificationService.success("SUCCESSFULLY_DELETED"); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - }, - err => { - this.notificationService.error(err); - modalRef.close(); - this.updateFilter(this.searchText.nativeElement.value); - } - ); - }) + return t_topics; } - getTopicDetail(id) { - return this.restApiService.getTopicDetail(id).toPromise(); - } - - getDbDetail(id) { - return this.restApiService.getDbDetail(id).toPromise(); + buttonAction(string: string = "") { + switch (string) { + case "new": + // Open new topic modal + console.log("new modal"); + break; + case "edit": + // Open edit of topic modal + console.log("edit modal"); + break; + case "default": + // Open default config of topic modal + console.log("default modal"); + break; + default: + this.notificationService.success(string + " action successful!"); + break; + } } - GroupByDbType = (array, key) => { - return array.reduce((result, currentValue) => { - (result[currentValue.type] = result[currentValue.type] || []).push(currentValue); - return result; - }, {}); - }; - updateFilter(searchValue) { const val = searchValue.toLowerCase(); // filter our data - const temp = this.temp.filter(function (d) { - return d.name.toLowerCase().indexOf(val) !== -1 || !val; + const temp = this.t_temp.filter(t => { + return t.name.toLowerCase().indexOf(val) !== -1 || !val; }); // update the rows this.topics = temp; } -} \ No newline at end of file + + // async initData() { + // this.topicListFeeder = []; + // this.topicListFeeder = await this.getTopicList("feeder"); + + // //this.topicDefaultConfig = new Topic(); + // this.topicDefaultConfig = await this.getTopicDefaultConfig(); + + // return true; + // } + + // getTopicList(type: string) { + // var data: any; + + // switch (type) { + // case "feeder": { + // data = this.restApiService.getTopicsFromFeeder().toPromise(); + // break; + // } + // } + // return data; + // } + + // getTopicDefaultConfig() { + // return this.restApiService.getTopicDefaultConfig().toPromise(); + // } + + // async initTopicList(dmaapList: [], feederList: []) { + // // var t: Topic[] = []; + // // // dmaap has no topics, only show topic in db + // // for (var i = 0; i < feederList.length; i++) { + // // let data = await this.getTopicDetail(feederList[i]); + // // let dbinfo = []; + // // var totalCB = 0; + // // var totalDRUID = 0; + // // var totalES = 0; + // // var totalHDFS = 0; + // // var totalMONGO = 0; + // // for (var x = 0; x < data.enabledSinkdbs.length; x++) { + // // let dbdata = await this.getDbDetail(data.enabledSinkdbs[x]); + // // dbinfo.push(dbdata); + // // if (dbinfo != undefined && dbinfo[x].type == "CB") { + // // totalCB = totalCB + 1; + // // } if (dbinfo != undefined && dbinfo[x].type == "DRUID") { + // // totalDRUID = totalDRUID + 1; + // // } if (dbinfo != undefined && dbinfo[x].type == "ES") { + // // totalES = totalES + 1; + // // } if (dbinfo != undefined && dbinfo[x].type == "HDFS") { + // // totalHDFS = totalHDFS + 1; + // // } if (dbinfo != undefined && dbinfo[x].type == "MONGO") { + // // totalMONGO = totalMONGO + 1; + // // } + // // } + // // let feed = { + // // name: data.name, + // // login: data.login, + // // password: data.password, + // // enabledSinkdbs: data.enabledSinkdbs, + // // sinkdbs: data.sinkdbs, + // // enabled: data.enabled, + // // saveRaw: data.saveRaw, + // // dataFormat: data.dataFormat, + // // ttl: data.ttl, + // // correlateClearedMessage: data.correlateClearedMessage, + // // messageIdPath: data.messageIdPath, + // // kafkas: data.kafkas.length, + // // type: data.type, + // // CB: totalCB, + // // DRUID: totalDRUID, + // // ES: totalES, + // // HDFS: totalHDFS, + // // MONGO: totalMONGO + // // }; + // // t.push(feed); + // // } + // // return t; + // } + + // onActivate(event) { + // const emitType = event.type; + // if (emitType == "dblclick") { + // console.log("Activate Event", event); + // let name = event.row.name; + // this.openTopicModal(name); + // } + // } + + // openNewTopicModal() { + // const modalRef = this.modalService.open(NewTopicModelComponent, { + // size: "lg", + // centered: true + // }); + // modalRef.componentInstance.newTopic = this.tempNewTopic; + // modalRef.componentInstance.passEntry.subscribe(receivedEntry => { + // console.log(receivedEntry, "newtopic receivedEntry"); + // this.tempNewTopic = receivedEntry; + // this.restApiService.addNewTopic(this.tempNewTopic).subscribe( + // res => { + // this.init(); + // this.notificationService.success("SUCCESSFULLY_CREARED"); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // } + // ); + // }); + // } + + // openTopicModal(name: string) { + // if (name == "config") { + // const modalRef = this.modalService.open(TopicConfigModalComponent, { + // windowClass: "dl-md-modal", + // centered: true + // }); + // modalRef.componentInstance.title = "Topics Default Configurations"; + // modalRef.componentInstance.topic = this.topicDefaultConfig; + // modalRef.componentInstance.passEntry.subscribe(receivedEntry => { + // this.restApiService + // .updateTopicDefaultConfig(this.topicDefaultConfig) + // .subscribe( + // res => { + // this.topicDefaultConfig = receivedEntry; + // this.topics.forEach(t => { + // if (!t.type) { + // // Unconfigure topics + // t.login = this.topicDefaultConfig.login; + // t.password = this.topicDefaultConfig.password; + // t.enabledSinkdbs = this.topicDefaultConfig.enabledSinkdbs; + // // t.sinkdbs = this.topicDefaultConfig.sinkdbs; //todo + // t.enabled = this.topicDefaultConfig.enabled; + // t.saveRaw = this.topicDefaultConfig.saveRaw; + // t.dataFormat = this.topicDefaultConfig.dataFormat; + // t.ttl = this.topicDefaultConfig.ttl; + // t.correlateClearedMessage = this.topicDefaultConfig.correlateClearedMessage; + // t.messageIdPath = this.topicDefaultConfig.messageIdPath; + // } + // }); + // this.notificationService.success("Success updated."); + // modalRef.close(); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // } + // ); + // }); + // } else { + // const index = this.temp.findIndex(t => t.name === name); + // const modalRef = this.modalService.open(TopicDetailModalComponent, { + // size: "lg", + // centered: true + // }); + // modalRef.componentInstance.topic = this.temp[index]; + // modalRef.componentInstance.passEntry.subscribe(receivedEntry => { + // this.tempTopicDetail = receivedEntry; + // // Configured topic + // if (this.tempTopicDetail.type) { + // this.restApiService.getTopicsFromFeeder().subscribe( + // res => { + // if (res.find(name => name === this.tempTopicDetail.name)) { + // // Update topic from db + // this.restApiService.upadteTopic(this.tempTopicDetail).subscribe( + // res => { + // this.temp[index] = this.tempTopicDetail; + // this.topics = this.temp; + // this.notificationService.success("SUCCESSFULLY_UPDATED"); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // } + // ); + // } else { + // // Insert topic from db + // this.restApiService.addTopic(this.tempTopicDetail).subscribe( + // res => { + // this.init(); + // this.notificationService.success("SUCCESSFULLY_CREARED"); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // } + // ); + // } + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // } + // ); + // } else { + // // Reset to default and delete topic from db + // this.restApiService.deleteTopic(this.tempTopicDetail.name).subscribe( + // res => { + // this.init(); + // this.notificationService.success("SUCCESSFULLY_DELETED"); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // } + // ); + // } + // }); + // } + // } + + // deleteTopicModal(name: string) { + // const index = this.temp.findIndex(t => t.name === name); + // const modalRef = this.modalService.open(AlertComponent, { + // size: "sm", + // centered: true + // }); + // modalRef.componentInstance.message = "ARE_YOU_SURE_DELETE"; + // console.log(this.temp[index]); + // modalRef.componentInstance.passEntry.subscribe(receivedEntry => { + // this.restApiService.deleteTopic(this.temp[index].name).subscribe( + // res => { + // this.init(); + // this.notificationService.success("SUCCESSFULLY_DELETED"); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // }, + // err => { + // this.notificationService.error(err); + // modalRef.close(); + // this.updateFilter(this.searchText.nativeElement.value); + // } + // ); + // }); + // } + + // getTopicDetail(id) { + // return this.restApiService.getTopicDetail(id).toPromise(); + // } + + // getDbDetail(id) { + // return this.restApiService.getDbDetail(id).toPromise(); + // } + + // GroupByDbType = (array, key) => { + // return array.reduce((result, currentValue) => { + // (result[currentValue.type] = result[currentValue.type] || []).push( + // currentValue + // ); + // return result; + // }, {}); + // }; +} diff --git a/components/datalake-handler/admin/src/src/assets/icons/add.svg b/components/datalake-handler/admin/src/src/assets/icons/add.svg index d38e3dc1..408748cb 100644 --- a/components/datalake-handler/admin/src/src/assets/icons/add.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/add.svg @@ -1,15 +1,15 @@ + viewBox="-55.1 170.9 500 500" style="enable-background:new -55.1 170.9 500 500;" xml:space="preserve"> - + diff --git a/components/datalake-handler/admin/src/src/assets/icons/druid_able.svg b/components/datalake-handler/admin/src/src/assets/icons/druid_able.svg index bac3794c..3338767f 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/druid_able.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/druid_able.svg @@ -1,22 +1,22 @@ + viewBox="-275.5 408.9 24.9 25" style="enable-background:new -275.5 408.9 24.9 25;" xml:space="preserve"> - - + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/druid_disable.svg b/components/datalake-handler/admin/src/src/assets/icons/druid_disable.svg index 667d52cb..4387037f 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/druid_disable.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/druid_disable.svg @@ -1,22 +1,22 @@ + viewBox="-275.5 408.9 24.9 25" style="enable-background:new -275.5 408.9 24.9 25;" xml:space="preserve"> - - + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/hadoop_able.svg b/components/datalake-handler/admin/src/src/assets/icons/hadoop_able.svg index e48a60f1..1754666d 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/hadoop_able.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/hadoop_able.svg @@ -1,7 +1,7 @@ + viewBox="2189.5 407.9 24.9 24.9" style="enable-background:new 2189.5 407.9 24.9 24.9;" xml:space="preserve"> - - - - - - - - - - + + + + + + + + + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/hadoop_disable.svg b/components/datalake-handler/admin/src/src/assets/icons/hadoop_disable.svg index 8bfd2664..6ca5ac02 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/hadoop_disable.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/hadoop_disable.svg @@ -1,7 +1,7 @@ + viewBox="2179.6 407.7 24.9 24.9" style="enable-background:new 2179.6 407.7 24.9 24.9;" xml:space="preserve"> - - - - - - - - - - + + + + + + + + + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/kafka_able.svg b/components/datalake-handler/admin/src/src/assets/icons/kafka_able.svg index a4b094de..98a333c9 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/kafka_able.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/kafka_able.svg @@ -1,21 +1,18 @@ + viewBox="1227.5 407.4 24.9 24.9" style="enable-background:new 1227.5 407.4 24.9 24.9;" xml:space="preserve"> - + diff --git a/components/datalake-handler/admin/src/src/assets/icons/kafka_disable.svg b/components/datalake-handler/admin/src/src/assets/icons/kafka_disable.svg index 61b558fa..60173a25 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/kafka_disable.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/kafka_disable.svg @@ -1,21 +1,18 @@ + viewBox="1227.5 407.4 24.9 24.9" style="enable-background:new 1227.5 407.4 24.9 24.9;" xml:space="preserve"> - + diff --git a/components/datalake-handler/admin/src/src/assets/icons/kibana_able.svg b/components/datalake-handler/admin/src/src/assets/icons/kibana_able.svg index 5a483202..0a4d7b74 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/kibana_able.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/kibana_able.svg @@ -1,15 +1,16 @@ + viewBox="398 407.3 24.9 24.9" style="enable-background:new 398 407.3 24.9 24.9;" xml:space="preserve"> - - - - + + + + + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/kibana_disable.svg b/components/datalake-handler/admin/src/src/assets/icons/kibana_disable.svg index 1bd8e585..6ece16d0 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/kibana_disable.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/kibana_disable.svg @@ -1,15 +1,16 @@ + viewBox="398 407.3 24.9 24.9" style="enable-background:new 398 407.3 24.9 24.9;" xml:space="preserve"> - - - - + + + + + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/mongoDB_able.svg b/components/datalake-handler/admin/src/src/assets/icons/mongoDB_able.svg index 1feb0c6f..44165fe5 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/mongoDB_able.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/mongoDB_able.svg @@ -1,22 +1,22 @@ + viewBox="-297.9 408.9 24.9 25" style="enable-background:new -297.9 408.9 24.9 25;" xml:space="preserve"> - - - + c-0.2-0.2-0.2-0.5-0.3-0.8c-0.1-0.3-0.1-0.6-0.1-1c0,0,0-0.1,0-0.2C-211.1,352.8-211.3,338-211.2,337.9z"/> + + diff --git a/components/datalake-handler/admin/src/src/assets/icons/mongoDB_disable.svg b/components/datalake-handler/admin/src/src/assets/icons/mongoDB_disable.svg index 9d1d506d..a75f7ae2 100755 --- a/components/datalake-handler/admin/src/src/assets/icons/mongoDB_disable.svg +++ b/components/datalake-handler/admin/src/src/assets/icons/mongoDB_disable.svg @@ -1,22 +1,22 @@ + viewBox="-297.9 408.9 24.9 25" style="enable-background:new -297.9 408.9 24.9 25;" xml:space="preserve"> - - - + c-0.2-0.2-0.2-0.5-0.3-0.8c-0.1-0.3-0.1-0.6-0.1-1c0,0,0-0.1,0-0.2C-211.1,352.8-211.3,338-211.2,337.9z"/> + + -- cgit 1.2.3-korg