diff options
Diffstat (limited to 'components')
44 files changed, 1866 insertions, 12 deletions
diff --git a/components/datalake-handler/admin/src/src/app/app-routing.module.ts b/components/datalake-handler/admin/src/src/app/app-routing.module.ts index 37436156..37ed0401 100644 --- a/components/datalake-handler/admin/src/src/app/app-routing.module.ts +++ b/components/datalake-handler/admin/src/src/app/app-routing.module.ts @@ -31,13 +31,18 @@ import { FeederComponent } from "./feeder/feeder.component"; import { TopicsComponent } from "./topics/topics.component"; import { DatabaseComponent } from "./database/database.component"; import { AboutComponent } from "./about/about.component"; +import { DashboardSettingComponent } from './dashboard-setting/dashboard-setting.component'; +import { DashboardListComponent } from './dashboard-setting/dashboard-list/dashboard-list.component'; +import { TemplateComponent } from './dashboard-setting/template/template.component'; const routes: Routes = [ { path: "", redirectTo: "/feeder", pathMatch: "full" }, { path: "feeder", component: FeederComponent }, { path: "topics", component: TopicsComponent }, { path: "database", component: DatabaseComponent }, - { path: "about", component: AboutComponent } + { path: "about", component: AboutComponent }, + { path: 'dashboard-setting/dashboard-list', component: DashboardListComponent}, + { path: 'dashboard-setting/template', component: TemplateComponent}, ]; @NgModule({ 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 a299c734..575e9b78 100644 --- a/components/datalake-handler/admin/src/src/app/app.module.ts +++ b/components/datalake-handler/admin/src/src/app/app.module.ts @@ -75,6 +75,13 @@ import { AboutComponent } from "./about/about.component"; // Loading spinner import { NgxSpinnerModule } from "ngx-spinner"; +import { DashboardSettingComponent } from './dashboard-setting/dashboard-setting.component'; +import { DashboardListComponent } from './dashboard-setting/dashboard-list/dashboard-list.component'; +import { TemplateComponent } from './dashboard-setting/template/template.component'; +import { CreateDashboardComponent } from './dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component'; +import { TemplateListComponent } from './dashboard-setting/template/template-list/template-list.component'; +import { NewTemplateModalComponent } from './dashboard-setting/template/template-list/new-template-modal/new-template-modal.component'; +import { EditTemplateModalComponent } from './dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component'; @NgModule({ declarations: [ @@ -96,7 +103,15 @@ import { NgxSpinnerModule } from "ngx-spinner"; TopicConfigModalComponent, ToastrNotificationComponent, AlertComponent, - AboutComponent + AboutComponent, + DashboardSettingComponent, + DashboardListComponent, + CreateDashboardComponent, + TemplateComponent, + TemplateListComponent, + NewTemplateModalComponent, + EditTemplateModalComponent, + ], imports: [ BrowserModule, @@ -125,7 +140,10 @@ import { NgxSpinnerModule } from "ngx-spinner"; MongodbComponent, HdfsComponent, TopicDetailModalComponent, - TopicConfigModalComponent + TopicConfigModalComponent, + CreateDashboardComponent, + NewTemplateModalComponent, + EditTemplateModalComponent ] }) export class AppModule {} diff --git a/components/datalake-handler/admin/src/src/app/core/alert/alert.component.html b/components/datalake-handler/admin/src/src/app/core/alert/alert.component.html index 4819abb0..48d74721 100644 --- a/components/datalake-handler/admin/src/src/app/core/alert/alert.component.html +++ b/components/datalake-handler/admin/src/src/app/core/alert/alert.component.html @@ -18,12 +18,12 @@ limitations under the License. ============LICENSE_END========================================================= --> -<div class="p-1"> +<div class="p-1" [ngClass]="{'alert-delete-model':this.dashboardDeteleModelShow == true}"> <div class="modal-header border-0 p-2"> </div> - <div class="modal-body border-0 p-1"> + <div class="modal-body border-0 p-1 " [ngClass]="{'alert-delete-title':this.dashboardDeteleModelShow == true}"> <div class="container"> @@ -41,13 +41,13 @@ limitations under the License. </div> </div> - <div class="modal-footer border-0 p-1"> + <div class="modal-footer border-0 p-1 " [ngClass]="{'alert-delete-content':this.dashboardDeteleModelShow == true}"> <div class="container align-content-center"> <div class="row"> <div class="col-md-6 p-1"> <span> <button type="button" class="btn dl-btn-dark btn-block" (click)="this.passBack()"> - OK + {{"OK" | translate}} </button> </span> </div> @@ -55,7 +55,7 @@ limitations under the License. <span> <button type="button" ngbAutofocus class="btn dl-btn-light btn-block" (click)="activeModal.close('Close click')"> - Cancel + {{"Cancel" | translate}} </button> </span> </div> diff --git a/components/datalake-handler/admin/src/src/app/core/alert/alert.component.ts b/components/datalake-handler/admin/src/src/app/core/alert/alert.component.ts index e4b4699f..6514ae80 100644 --- a/components/datalake-handler/admin/src/src/app/core/alert/alert.component.ts +++ b/components/datalake-handler/admin/src/src/app/core/alert/alert.component.ts @@ -35,11 +35,13 @@ import { NgbActiveModal } from "@ng-bootstrap/ng-bootstrap"; }) export class AlertComponent { @Input() message: string; + @Input() dashboardDeteleModelShow; @Output() passEntry: EventEmitter<any> = new EventEmitter(); constructor(public activeModal: NgbActiveModal) {} passBack() { + console.log(this.dashboardDeteleModelShow,"dashboardDeteleModelShow"); this.passEntry.emit(true); } } diff --git a/components/datalake-handler/admin/src/src/app/core/models/dashboard.model.ts b/components/datalake-handler/admin/src/src/app/core/models/dashboard.model.ts new file mode 100644 index 00000000..33998b28 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/core/models/dashboard.model.ts @@ -0,0 +1,24 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ + +export class Dashboard { + name: string; + host: string; + port: number; + login: string; + pass: string; + enabled: boolean; +} diff --git a/components/datalake-handler/admin/src/src/app/core/models/template.model.ts b/components/datalake-handler/admin/src/src/app/core/models/template.model.ts new file mode 100644 index 00000000..5df69721 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/core/models/template.model.ts @@ -0,0 +1,51 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +// export class TemplateList { +// id:number; +// name:string; +// submitted:true; +// body: string; +// note:string; +// portalDesignConfig:{ +// id:number; +// name:string; +// submitted:true; +// body: string; +// note:string; +// topic: string; +// designType: string; +// } +// +// } + +export class Template { + id:number; + name:string; + submitted:true; + body: string; + note:string; + topic: string; + designType: string; + } + +export class newTemplate { + name:string; + submitted:true; + body: string; + note:string; + topic: string; + designType: string; +} diff --git a/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.spec.ts b/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.spec.ts new file mode 100644 index 00000000..ee5bd913 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.spec.ts @@ -0,0 +1,27 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { TestBed } from '@angular/core/testing'; + +import { DashboardApiService } from './dashboard-api.service'; + +describe('DashboardApiService', () => { + beforeEach(() => TestBed.configureTestingModule({})); + + it('should be created', () => { + const service: DashboardApiService = TestBed.get(DashboardApiService); + expect(service).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.ts b/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.ts new file mode 100644 index 00000000..d20f71ac --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/core/services/dashboard-api.service.ts @@ -0,0 +1,186 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import {Injectable} from "@angular/core"; +import {HttpClient, HttpHeaders} from "@angular/common/http"; +import {Observable, of} from "rxjs"; +import {map, catchError, tap, retry} from "rxjs/operators"; +import {throwError} from "rxjs"; + +import {Template,newTemplate} from "src/app/core/models/template.model"; +import { Dashboard } from "src/app/core/models/dashboard.model"; + +const prefix = "/datalake/v1/"; + +@Injectable({ + providedIn: 'root' +}) +export class DashboardApiService { + + constructor(private http: HttpClient) { + } + + private extractData(res: Response) { + if (res.status < 200 || res.status >= 300) { + throw new Error("Bad response status: " + res.status); + } + let body = res; + return body || {}; + } + + private handleError(error) { + let errorMessage = ""; + if (error.error instanceof ErrorEvent) { + // Get client-side error + errorMessage = error.error.message; + } else { + // Get server-side error + errorMessage = `Error Code: ${error.status}\nMessage: ${error.message}`; + console.log(errorMessage); + } + return throwError(errorMessage); + } + + private extractData2(res: Response) { + console.log(res,"detele/deploy template"); + let body = res; + return body || {}; + } + + + /* + Dashboard +*/ + getDashboardList(): Observable<any> { + let url = prefix + "portals/true"; //onilne + return this.http.get(url).pipe( + retry(1), + map(this.extractData), + catchError(this.handleError) + ); + } + + addDashboard(d: Dashboard): Observable<any> { + console.log(d,"add dashboard body"); + let url = prefix + "portals"; //onilne + return this.http + .put<any>(url, d) + .pipe( + retry(1), + tap(_ => console.log(`add db name=${d.name}`)), + catchError(this.handleError) + ); + } + + upadteDashboard(d: Dashboard): Observable<any> { + console.log(d,"add dashboard body"); + let url = prefix + "portals";//onilne + return this.http + .put(url, d) + .pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); + } + + deleteDashboard(d: Dashboard): Observable<any> { + console.log(d,"add dashboard body"); + 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) + ); + } + + getDashboardName(): Observable<any> { + let url = prefix + "portals/getNames/false"; //onilne + return this.http.get(url).pipe( + retry(1), + map(this.extractData), + catchError(this.handleError) + ); + } + + /* + Template + */ + getTemplateAll(): Observable<any> { + return this.http.get(prefix + "portalDesigns/").pipe( //onlin + retry(1), + map(this.extractData), + catchError(this.handleError) + ); + } + + createNewTemplate(t: newTemplate): Observable<any> { + console.log(t,"createNewTemplate"); + return this.http + .post(prefix + "portalDesigns", t) + .pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); + } + + updateNewTemplate(t: Template): Observable<any> { + let id = t.id; + console.log(id,t,"updateNewTemplate"); + return this.http + .put(prefix + "portalDesigns/"+id, t) + .pipe( + retry(1), + tap(_ => this.extractData), + catchError(this.handleError) + ); + } + + getTopicName(): Observable<any> { + return this.http.get(prefix + "topics").pipe( //onlin + retry(1), + map(this.extractData), + catchError(this.handleError) + ); + } + + getTemplateTypeName(): Observable<any> { + return this.http.get(prefix + "designTypes").pipe( //onlin + retry(1), + map(this.extractData), + catchError(this.handleError) + ); + } + + DeleteTemplate(id): Observable<any> { + return this.http.delete(prefix + "portalDesigns/" + id ).pipe( //online + retry(1), + map(this.extractData2), + catchError(this.handleError) + ); + } + deployTemplateKibana(id, body): Observable<any> { + body.submitted = true; + console.log(id,body,'this.deployTemplateKibana()'); + return this.http.post(prefix+"portalDesigns/" + id, body).pipe( //online + retry(1), + map(this.extractData2), + catchError(this.handleError) + ); + } +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.css new file mode 100644 index 00000000..7af4051a --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.css @@ -0,0 +1,18 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +input::-webkit-input-placeholder{ + color: #A8A9AC; +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.html new file mode 100644 index 00000000..eb355d19 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.html @@ -0,0 +1,115 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> + +<div class="p-1"> + <div class="modal-header pb-0 border-0"> + <div class="container"> + <div class="row"> + <div class="col-md-12"> + <label class="dl-h3" *ngIf="this.tempDb.name==undefined">{{ "NewDashboard" | translate}}</label> + <label class="dl-h3" style="letter-spacing: 0" *ngIf="this.tempDb.name!=undefined">{{this.tempDb.name}} | {{tempDbNameTitle}}</label> + </div> + </div> + + <div class="row"> + <div class="col-md-12"> + <hr> + </div> + </div> + </div> + </div> + + <div class="modal-body border-0 ml-4 mr-4"> + <div class="container"> + + <div class="form-group"> + <div class="row"> + <div class="col-md-3"><label class="dl-emphasis1" for="inputBucket">{{ "DestinationType" | translate}}</label></div> + <div class="col-md-4"> + <select #t_dataDashboardName class="custom-select dl-input-text" id="inputBucket" *ngIf="this.tempDb.name ==undefined" > + <option *ngFor="let item of nameArr" [selected]="item==this.tempDb.name"> + {{ item }}</option> + </select> + <select #t_dataDashboardName class="custom-select dl-input-text select-disabled" *ngIf="this.tempDb.name !=undefined" disabled > + <option [selected]="this.tempDb.name==this.tempDb.name"> + {{ this.tempDb.name }}</option> + </select> + </div> + </div> + </div> + + <div class="form-group"> + <div class="row"> + <div class="col-md-3"><label class="dl-emphasis1" for="inputHost">{{ "HOST" | translate}}</label></div> + <div class="col-md-4"> + <input [(ngModel)]="this.tempDb.host" class="form-control dl-input-text" id="inputHost" type="text" + placeholder="{{ 'InputValue' | translate}}"> + </div> + </div> + </div> + + <div class="form-group"> + <div class="row"> + <div class="col-md-3"><label class="dl-emphasis1" for="inputPort">{{ "PORT" | translate}}</label></div> + <div class="col-md-3"> + <input [(ngModel)]="this.tempDb.port" class="form-control dl-input-text" id="inputPort" type="text" + placeholder="{{ 'InputValue' | translate}}" (input)="this.adminService.onKeyPressNumber($event)"> + </div> + </div> + </div> + + <div class="form-group"> + <div class="row"> + <div class="col-md-3"><label class="dl-emphasis1" + for="inputUserName">{{ "AUTHENTICATION" | translate}}</label></div> + <div class="col-sm-4"> + <input [(ngModel)]="this.tempDb.login" class="form-control dl-input-text" id="inputUserName" type="text" + placeholder="{{ 'Username' | translate}}"> + </div> + <div class="col-sm-4"> + <input [(ngModel)]="this.tempDb.pass" class="form-control dl-input-text" id="inputPass" type="password" + placeholder=" {{ 'Password' | translate}}"> + </div> + </div> + </div> + </div> + </div> + + + <div class="modal-footer border-0 pt-0 pb-2"> + <div class="container"> + <div class="row"> + <div class="col-md-6 p-0"> + + </div> + <div class="col-md-3 p-1"> + <span> + <button type="button" class="btn dl-btn-dark btn-block" (click)="this.passBack()"> + {{ "Save" | translate}} + </button> + </span> + </div> + <div class="col-md-3 p-1"> + <span> + <button type="button" class="btn dl-btn-light btn-block" (click)="activeModal.close('Close click')"> + {{ "Cancel" | translate}} + </button> + </span> + </div> + </div> + </div> + </div> +</div> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.spec.ts new file mode 100644 index 00000000..6fa809d5 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CreateDashboardComponent } from './create-dashboard.component'; + +describe('CreateDashboardComponent', () => { + let component: CreateDashboardComponent; + let fixture: ComponentFixture<CreateDashboardComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CreateDashboardComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CreateDashboardComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.ts new file mode 100644 index 00000000..4a865f21 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/create-dashboard/create-dashboard.component.ts @@ -0,0 +1,77 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import {Component, OnInit, Input, Output, ViewChild, EventEmitter, ElementRef} from '@angular/core'; +import { NgbActiveModal } from "@ng-bootstrap/ng-bootstrap"; +import { Dashboard } from "src/app/core/models/dashboard.model"; +import { AdminService } from "src/app/core/services/admin.service"; +import { RestApiService } from "src/app/core/services/rest-api.service"; +@Component({ + selector: 'app-create-dashboard', + templateUrl: './create-dashboard.component.html', + styleUrls: ['./create-dashboard.component.css'] +}) +export class CreateDashboardComponent implements OnInit { + + constructor( + public activeModal: NgbActiveModal, + public adminService: AdminService, + public restApiService: RestApiService, + ) {} + + @Output() passEntry: EventEmitter<any> = new EventEmitter(); + @Input() dashboard: Dashboard; + @Input() nameArr; + tempDb: Dashboard; + + selectshow = false; + tempDbNameTitle = null; + + @ViewChild("t_dataDashboardName") t_dataDashboardName: ElementRef; + + ngOnInit() { + // cache for display + + console.log(this.dashboard); + this.tempDb = new Dashboard(); + if(this.dashboard.enabled==undefined){ + this.dashboard.enabled = true; + } + const feeds = { + name: this.dashboard.name, + host: this.dashboard.host, + port: this.dashboard.port, + login: this.dashboard.login, + pass: this.dashboard.pass, + enabled: this.dashboard.enabled, + }; + console.log(feeds); + this.tempDb = feeds; + this.tempDbNameTitle = this.dashboard.host + } + + + + passBack() { + if(this.tempDb.host == '' || this.tempDb.host == undefined){ + return false; + } + this.dashboard = this.tempDb; + this.dashboard.name = this.t_dataDashboardName.nativeElement.value; + console.log(this.dashboard,"this.dashboard output"); + this.passEntry.emit(this.dashboard); + } + +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.css new file mode 100644 index 00000000..5dab0c0c --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.css @@ -0,0 +1,64 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +.db-block { + min-width: 180px; + min-height: 180px; + padding: 10px; +} +.db-panel { + background: #FFFFFF; + box-shadow: 3px 3px 11px 0 #D2D3D5; + border-radius: 20px; + position: relative; + font-family: "Open Sans", sans-serif; + font-weight: 600; + font-size: 18px; + color: #313032; + text-align: center; + padding: 10px; +} +.db-dropdown { + background-color: #ffffff; +} + +.db-dropdown:hover { + background-color: #ffffff; +} + +.db-config-icon { + color: #5DBEBB; + background-color: #ffffff; +} + +.db-config-icon:hover { + background-color: #D2D3D5; +} + +.dropdown-item { + font-family: "Open Sans", sans-serif; + font-weight: 400; + font-size: 14px; +} +.dropdown-menu.action-btn{ + min-width: 2rem!important; + left: -70px!important; +} +.truecheck{ + color:#5DBEBB +} +.falsecheck{ + color:#BDBEC0 +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.html new file mode 100644 index 00000000..8205158e --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.html @@ -0,0 +1,242 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> +<div class="row"> + <div class="col-md-12 path"> + {{"HOME" | translate}} > {{"ConfigDashboard" | translate}} > {{"SIDEBAR.DASHBOARDLIST" | translate}} + </div> +</div> + +<div class="d-flex flex-wrap"> + + <!-- Database list --> + <div *ngFor="let db of this.dbs;let thisIndex=index" class="col-sm-2 db-block"> + <div class="db-panel" style="height: 100%"> + <div class="d-flex flex-column align-content-center"> + <div class="ml-auto dropdown db-dropdown mr-2" data-boundary="window"> + <a class="badge badge-light db-dropdown" data-toggle="dropdown" style="cursor: pointer"> + <i class="fas fa-ellipsis-h fa-2x db-config-icon"></i> + </a> + <div class="dropdown-menu action-btn"> + <button class="dropdown-item" type="button" (click)="this.openDashboardModal(thisIndex)"> + {{ 'EDIT' | translate }} + </button> + <button class="dropdown-item" type="button" (click)="this.deleteDashboard(thisIndex)"> + {{ 'DELETE' | translate }} + </button> + </div> + </div> + + <div> + <div class="align-self-center" style="height: 130px;"> + <!-- Kibana --> + <div class="p-0" *ngIf="db.name == 'Kibana'"> + <span data-toggle="tooltip" title="Kibana"> + <svg version="1.1" id="kibana_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" + width="45%" height="20%" viewBox="0 0 612 750" enable-background="new 0 0 612 792" xml:space="preserve"> +<image overflow="visible" width="85%" height="100%" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGYAAACECAIAAADtMcm8AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJ +bWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdp +bj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6 +eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0 +NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJo +dHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlw +dGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAv +IiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RS +ZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpD +cmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNl +SUQ9InhtcC5paWQ6RTRFRTFCRTE4MUJCMTFFOUI2RTlCMEM4NDRDMkQwRDEiIHhtcE1NOkRvY3Vt +ZW50SUQ9InhtcC5kaWQ6RTRFRTFCRTI4MUJCMTFFOUI2RTlCMEM4NDRDMkQwRDEiPiA8eG1wTU06 +RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpFNEVFMUJERjgxQkIxMUU5QjZF +OUIwQzg0NEMyRDBEMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFNEVFMUJFMDgxQkIxMUU5 +QjZFOUIwQzg0NEMyRDBEMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1w +bWV0YT4gPD94cGFja2V0IGVuZD0iciI/Plz7FhIAAAe9SURBVHja7JxfTFNXHMfL7f8W0KpjMhRQ +By3OBxMzHIvOPbrpsy4YtsQ9zBcX/+Bk6gZE3dwUlYJ7cQOJcy/iROeYOEVqAkwLmIBIMidTrDba +lraAFCkt+0EnqdDeP+25t7fn3m9Ic9velttPzjmf87v3tAkOh6O3t1cihl4MBoPs5s2be/fsE1nQ +SV7eOxWVFYQIgmbS09MPHzlMQEQWdJKUlHTih0qNRgPbIjLqyGSycuPxtLS0wF0RGXWKS4qXL18+ +dVdERpFNm/LXrfsw+BERGYUit+/YPu1BERm1IkVkjBUpImOsSBEZY0WKyBgrUkTGWJEiMsaKFJEx +VqSIjLEiRWSMFSkiY6xIERljRYrIGCtSRMZYkSIyxooUkTFWpIiMsSKFjiwCRQoaWWSKFC6yiBUp +UGTRKFKgyKJRpBCR5UenSMEhA0XuiE6RwkKGRJECQoZKkUJBhlCRQkGGUJGCQIZWkfgjQ65IzJGx +oUickbGkSGyRsadIbJGxp0g8kbGqSAyRsa1I3JBxoEiskHGjSHyQcaZIfJBxpkhMkHGpyOmt2+fz +ZS7KnIAHI+j4xEPj4+P+cd+4XzLm8w1Dnj8fHR3lmSLzCgt3xmxAcLsHrl69RrlfSkpKcnLyrFnJ +MOIq5AqA6HK5hoaGuD/iRYsyv/v+UCzHUGhTdPZ7NplpD+p0ugULFmi1Wq931G5zQAOVy+WsHm5i +UqKxwpiYmBhLZNG82DmZwLZUKtXrs1NTU2Hb8sgC/Z2Nwz127Cj3ikSJLDjA6O7dHviDbYVCsWzZ +W/PmznO6nM5+J6p/sf/A/hUrVsR+csPGm8JI19Fx++XQA8n0DA8/e2ZLSEiIR0VygSw4/04GNqBD +6bOzPZ5hm83O8yoyxsim8ngysLF48WJoeI8tlrGxMZqK5LiK5AuyqfRORq1W5+bmjng8DoeDvIoE +RXJcRfIOWSAej8dkMsFGbu7bGo3a8ugxf6pIniKbyq1bZrgFw6akvN738CEfqsj4qDHv3OlubGxU +qVUL0xfyTZHTW1k04mcDHNwuXZqzMndlDKtIilZGs2DiMi6X+9Lvl1avfu/GjRt8RMa3A9LpZvt8 +Y9D2rVbr5s2fbtiwYWZtKyJ7RZFajTa44UMVsWrV6tLSUv70Bn4hy8zIHPVOPzfn9/tPn/4ZwLW3 +t4vIXonBoB8YdId79unTpxs3flRYWBjz5sYXZNnZ2eRlQCB1dRfy8t69/899oSNLS3vD6eynOd2x +2+3r1q+vrT0nXGRarRbqc0bTQ9i/qKjo44JPXrx4IThkoMg5c3SRDU8trS1r1rxvsViEhQwUGU1L +gU66du0HZrNZKMj0ejJF0szIyEh+/qbyciP+yECR/f0OJG8F/frkyR/r6//AGRkjRdIZEBVy+b69 ++4zlRg5mbTFAFoEiyT4AQahV6sD2qVM1335ziOb58bhBBqQiVmTId9OoNcH0a2trdxV+weqKCK6R +LVmyBOFkCnjNvIxiMpm2bv3c4/HggGyiihxwo3o36I9SqTTkU+Zb5i2fbRkcHIxvZNC+6FSRNKNQ +KMnXf3R13dm2bTsb5QFHyECRg4MDCBWpUiopd7vdcbtw5y7kNuACWUCRyI44SJGUaW5uhsmH3++P +J2RsK5IyV678efDAQYTUWEfGgSIpc/58XWVFZXwg40yRlIFZ7pkzv/AdGVpFyuWKKJdIHi07amoy +8RdZSspr3CuSsnrfvbsosJ6Bd8hAkRH3oHCKREIfCqnSktIop7jokQUUiWqtbASKJI/Vav36q2J+ +IcvKehOhItVqNfLFeFCERqMCxEeTk5PjcrkQKlImZWU5V/nx8u7u7tgjA0Xa7Tb+KJIkUI18WbQn +srMdyJDxUJHksVgsMO2IGTLeKpI858792tLSGgNkPFckeUqKS2w2G9fI+K9IktjtdqDGKTKDwRAX +iiRJa+tfzc0tHCGbrCLtqA6dVUWSp+xIGf0rLJEjQ6tIsAfbiiTJgwcPqqqq2UWmVCrRKpLLIT9k +qquqA9+1YgUZfLbU1NQ4VWS4eL3eI4fL2EIGihwefh6niiT1QGtbWxt6ZGgVqVKquFckSSorTiBG +hlyREAmf0tnZ2XC5ARkynBRJEqOxgnxmThcZfooMF6vVSr52mS4y/BRJkpqaGpJr1bSQ6fV6LBUZ +tvC02evr6yNHBop0OvtxVWS4VP1UHe4KPwWyjIwMvBUZLn19fU1NTYyRgSJHRjzYKzJcwl1SIcgV +iWr5CZFA8HzIn5mO9g7rEysDZGgVqdao44tXIGfPnqWLDLkipYRUEoepq7sA5To1MtSKVMaFIkMG +qunGa40UyFArEhyplMRzLl78jQyZTjcbtSJVkjiP2WyetuSLCFYkSE3IigwZqJyuN14PjQwU6R3z +ClyRIXO5oSEEMlGR5BO04L5JBBSJ6nt+8a7IsA0t6Lwj4Xa7QZGoOhEGigyZ4GsChNX6RFQkZdrb +2qeuDSM7b4WNIkNmaGios7MTMTKcFBkyLS/XbRBIPie0L5wUGRpZ6/8r0RD8ftmEImUyCe659/e9 +wE81R9sxZTI8FTkz0LYCv80cFTJQpFqlkggmXV1dUSHDW5GhkXVGhwx7Rc5MT0+P3++XFRQUZGVl +M33x3Llz5s+fLxFeCIL4T4ABAKZ9PUaesuDFAAAAAElFTkSuQmCC" transform="matrix(1 0 0 1 70 0)"> +</image> +</svg> + + </span> + </div> + <!-- Couchbase --> + <div class="p-0" *ngIf="db.name == 'Couchbase'"> + <span data-toggle="tooltip" title="Couchbase"> + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" + x="0px" y="0px" width="100" height="100" viewBox="-408 285.3 25 25" + style="enable-background:new -408 285.3 25 25;" xml:space="preserve"> + <path style="fill: #313032" + d="M-395.5,285.3c-6.9,0-12.5,5.6-12.5,12.5s5.6,12.5,12.5,12.5s12.5-5.6,12.5-12.5S-388.6,285.3-395.5,285.3z + M-387.1,300c0,0.8-0.4,1.4-1.3,1.6c-1.5,0.3-4.6,0.4-7.2,0.4s-5.7-0.2-7.2-0.4c-0.8-0.2-1.3-0.8-1.3-1.6v-4.9 + c0-0.8,0.6-1.5,1.3-1.6c0.4-0.1,1.5-0.2,2.2-0.2c0.3,0,0.5,0.2,0.5,0.6v3.4l4.4-0.1l4.4,0.1v-3.4c0-0.4,0.2-0.6,0.5-0.6 + c0.8,0,1.8,0.1,2.2,0.2c0.7,0.1,1.3,0.8,1.3,1.6C-387.1,296.7-387.1,298.3-387.1,300L-387.1,300z" /> + </svg> + </span> + </div> + <!-- Druid --> + <div class="p-0" *ngIf="db.name == 'Druid'"> + <span class="pr-1" data-toggle="tooltip" title="Druid"> + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" + x="0px" y="0px" width="100" height="100" viewBox="-403 285.3 34 25" + style="enable-background:new -403 285.3 34 25;" xml:space="preserve"> + <g> + <path style="fill: #313032" + d="M-385.5,285.3c2.2,0,4.3,0,6.5,0c4.2,0,8,2.7,9.4,6.6c0.6,1.7,0.8,3.4,0.6,5.2c-0.3,2.6-1,5-2.5,7.2 + c-2.3,3.4-5.5,5.2-9.5,5.8c-1.4,0.2-2.7,0.2-4.1,0.2c-0.6,0-0.9-0.3-0.9-0.7c0-0.5,0.3-0.9,0.8-0.9c0.6,0,1.2,0,1.9,0 + c3.7-0.1,7-1.4,9.6-4.2c1.8-1.9,2.7-4.3,3-6.9c0.2-1.8,0.2-3.6-0.5-5.3c-1.1-2.6-3.1-4.2-5.8-5c-1.1-0.3-2.1-0.3-3.2-0.4 + c-4,0-8.1,0-12.1,0c-0.2,0-0.3,0-0.5,0c-0.4,0-0.7-0.4-0.7-0.8s0.3-0.7,0.6-0.8c0.2,0,0.4,0,0.6,0L-385.5,285.3L-385.5,285.3z" /> + <path style="fill: #313032" d="M-389.7,304.6h-7.2c-0.2,0-0.3,0-0.5,0c-0.4-0.1-0.7-0.3-0.7-0.7c0-0.4,0.2-0.7,0.6-0.9 + c0.2-0.1,0.5-0.1,0.8-0.1c4.7,0,9.5,0,14.2,0c1.7,0,3.1-0.6,4.2-1.8c1-1,1.5-2.3,1.6-3.7c0.1-1.1,0-2.1-0.7-3.1 + c-0.8-1-1.8-1.5-3.1-1.5c-4.5,0-9,0-13.5,0c-0.5,0-1,0-1.4-0.1c-0.4,0-0.6-0.3-0.7-0.7c0-0.5,0.2-0.8,0.6-0.9c0.1,0,0.3,0,0.4,0 + h14.4c2.4,0,4.5,1.5,5.3,3.8c0.5,1.6,0.4,3.3-0.3,4.8c-1.2,3-3.9,4.9-7.2,4.9C-385,304.6-387.3,304.6-389.7,304.6L-389.7,304.6z + M-400.4,292.6c-0.6,0-1.1,0-1.7,0c-0.5,0-0.8-0.3-0.9-0.7s0.2-0.8,0.7-0.9c0.3,0,0.5-0.1,0.8-0.1c0.8,0,1.5,0,2.3,0 + c0.2,0,0.5,0,0.7,0.1c0.4,0.1,0.6,0.5,0.6,0.9s-0.3,0.7-0.7,0.7C-399.2,292.7-399.8,292.6-400.4,292.6L-400.4,292.6z M-390.3,310.3 + c-0.5,0-1,0-1.6,0c-0.5,0-0.8-0.3-0.9-0.7c0-0.5,0.3-0.9,0.7-0.9c1.1-0.1,2.2-0.1,3.4,0c0.4,0,0.8,0.4,0.7,0.8l0,0 + c0,0.5-0.4,0.7-0.9,0.8L-390.3,310.3L-390.3,310.3z" /> + </g> + </svg> + </span> + </div> + + <!-- Elasticsearch --> + <div class="p-0" *ngIf="db.name == 'Elasticsearch'"> + <span class="pr-1" data-toggle="tooltip" title="Elasticsearch"> + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" + x="0px" y="0px" width="100" height="100" viewBox="2066.4 284.8 25.1 25" + style="enable-background:new 2066.4 284.8 25.1 25;" xml:space="preserve"> + <g> + <path style="fill: #FFFFFF" d="M2091.6,297.9c0-2.1-1.3-3.9-3.3-4.7c0.1-0.4,0.1-0.9,0.1-1.4c0-3.9-3.2-7.1-7.1-7.1c-2.3,0-4.4,1.1-5.7,3 + c-0.7-0.5-1.5-0.8-2.3-0.8c-2.1,0-3.8,1.7-3.8,3.8c0,0.5,0.1,0.9,0.2,1.3c-2,0.7-3.3,2.6-3.3,4.7c0,2.1,1.3,4,3.3,4.7 + c-0.1,0.4-0.1,0.9-0.1,1.4c0,3.9,3.2,7.1,7.1,7.1c2.3,0,4.4-1.1,5.7-3c0.7,0.5,1.5,0.8,2.3,0.8c2.1,0,3.8-1.7,3.8-3.8 + c0-0.5-0.1-0.9-0.2-1.3C2090.2,301.8,2091.6,300,2091.6,297.9L2091.6,297.9z" /> + <path style="fill: #313032" d="M2076.3,295.5l5.6,2.6l5.7-5c0.1-0.4,0.1-0.8,0.1-1.3c0-3.5-2.8-6.3-6.3-6.3c-2.1,0-4,1-5.2,2.7l-0.9,4.9 + L2076.3,295.5L2076.3,295.5z" /> + <path style="fill: #313032" d="M2070.5,301.4c-0.1,0.4-0.1,0.8-0.1,1.3c0,3.5,2.8,6.3,6.3,6.3c2.1,0,4.1-1,5.2-2.8l0.9-4.9l-1.3-2.4l-5.6-2.6 + L2070.5,301.4L2070.5,301.4z" /> + <path style="fill: #313032" d="M2070.4,291.7l3.8,0.9l0.9-4.4c-0.5-0.4-1.2-0.6-1.8-0.6c-1.7,0-3,1.4-3,3 + C2070.2,291.1,2070.3,291.4,2070.4,291.7L2070.4,291.7z" /> + <path style="fill: #313032" + d="M2070.1,292.7c-1.7,0.6-2.9,2.2-2.9,4c0,1.8,1.1,3.3,2.7,4l5.4-4.9l-1-2.1L2070.1,292.7L2070.1,292.7z" /> + <path style="fill: #313032" d="M2082.9,306.3c0.5,0.4,1.2,0.6,1.8,0.6c1.7,0,3-1.4,3-3c0-0.4-0.1-0.7-0.2-1l-3.8-0.9L2082.9,306.3 + L2082.9,306.3z" /> + <path style="fill: #313032" + d="M2083.7,300.9l4.2,1c1.7-0.6,2.9-2.2,2.9-4c0-1.8-1.1-3.3-2.7-4l-5.5,4.8L2083.7,300.9L2083.7,300.9z" /> + </g> + </svg> + </span> + </div> + + <!-- MongoDB --> + <div class="p-0" *ngIf="db.name == 'MongoDB'"> + <span class="pr-1" data-toggle="tooltip" title="MongoDB"> + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" + x="0px" y="0px" width="100" height="100" viewBox="-397.2 285.8 11.2 25" + style="enable-background:new -397.2 285.8 11.2 25;" xml:space="preserve"> + <g transform="matrix(1.2754196 0 0 1.2754196 -16.030009 -21.83192)"> + <path style="fill: #313032" + d="M-294.5,241.2c0.2,0.3,0.4,0.7,0.5,1c0.1,0.2,0.2,0.4,0.4,0.5c0.4,0.4,0.9,0.9,1.2,1.4 + c0.9,1.2,1.5,2.5,1.9,3.9c0.3,0.9,0.4,1.7,0.4,2.6c0,2.7-0.9,4.9-2.7,6.8c-0.3,0.3-0.6,0.6-1,0.8c-0.2,0-0.3-0.2-0.4-0.3 + 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-294.4,256.1-294.6,241.3-294.5,241.2z" /> + <path style="fill: #313032" + d="M-294.5,241.2C-294.5,241.2-294.5,241.2-294.5,241.2c-0.1,0.2-0.2,0.4-0.3,0.6c-0.1,0.2-0.3,0.3-0.5,0.5 + c-0.9,0.8-1.7,1.8-2.3,2.9c-0.8,1.5-1.2,3.1-1.3,4.8c0,0.6,0.2,2.8,0.4,3.4c0.5,1.6,1.4,3,2.7,4.2c0.3,0.3,0.6,0.5,0.9,0.8 + c0.1,0,0.1-0.1,0.1-0.2c0-0.2,0.1-0.3,0.1-0.4c0.1-0.5,0.2-1.1,0.2-1.6C-294.4,256.2-294.4,241.3-294.5,241.2L-294.5,241.2z" /> + <path style="fill: #313032" d="M-294,258.9c0-0.2,0.2-0.4,0.3-0.7c-0.1,0-0.2-0.2-0.3-0.3c-0.1-0.1-0.1-0.2-0.2-0.4c-0.2-0.4-0.2-0.9-0.2-1.4 + c0,0,0-0.1,0-0.2s0-0.1,0-0.2c0,0-0.1,0.4-0.1,0.5c0,0.5-0.1,1-0.2,1.4c0,0.2,0,0.4-0.2,0.5c0,0,0,0,0,0.1c0.2,0.5,0.2,1.1,0.3,1.7 + v0.2c0,0.3,0,0.2,0.2,0.3c0.1,0,0.2,0,0.3,0.1c0.1,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.4c0-0.3,0-0.7,0-1 + C-294,259.3-294,259.1-294,258.9z" /> + </g> + </svg> + </span> + </div> + </div> + + <div class="mt-auto"> + <i class="fa fa-check-circle" aria-hidden="true" + [ngClass]="{'truecheck':db.enabled == true,'falsecheck':db.enabled == false}"></i> + {{ db.host }} + </div> + </div> + + </div> + </div> + </div> + + <!-- Add --> + <div class="col-sm-2 db-block"> + <div class="db-panel"> + <div class="d-flex flex-column align-content-center"> + <div class="ml-auto dropdown db-dropdown mr-2" style="visibility: hidden;" data-boundary="window"> + <a class="badge badge-light db-dropdown" data-toggle="dropdown"> + <i class="fas fa-ellipsis-h fa-2x db-config-icon"></i> + </a> + <div class="dropdown-menu"> + <button class="dropdown-item" type="button"> + <i class="fas fa-times db-config-icon"></i> Delete + </button> + </div> + </div> + + <div> + <button type="button" class="btn" (click)="this.openCreateModal()"> + <div class="align-self-center" style="height: 130px;"> + <div style="width:100px; height:100px;"> + <i class="fas fa-plus fa-3x pt-4 dl-icon-enable"></i> + </div> + </div> + + <div class="mt-auto" style="visibility: hidden;"> + add + </div> + </button> + </div> + + </div> + </div> + </div> + +</div> + diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.spec.ts new file mode 100644 index 00000000..d0e59ce4 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DashboardListComponent } from './dashboard-list.component'; + +describe('DashboardListComponent', () => { + let component: DashboardListComponent; + let fixture: ComponentFixture<DashboardListComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DashboardListComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DashboardListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.ts new file mode 100644 index 00000000..a2966a4e --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-list/dashboard-list.component.ts @@ -0,0 +1,283 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import {Component, EventEmitter, OnInit, Output} from '@angular/core'; +import {Dashboard} from "../../core/models/dashboard.model"; +import {NgbModal} from "@ng-bootstrap/ng-bootstrap"; +import {CreateDashboardComponent} from "./create-dashboard/create-dashboard.component"; + +import {AdminService} from "../../core/services/admin.service"; + +// DB modal components +import {DashboardApiService} from "src/app/core/services/dashboard-api.service"; + +import {AlertComponent} from "src/app/core/alert/alert.component"; + +// Notify +import {ToastrNotificationService} from "src/app/core/services/toastr-notification.service"; +// Loading spinner +import {NgxSpinnerService} from "ngx-spinner"; + +@Component({ + selector: 'app-dashboard-list', + templateUrl: './dashboard-list.component.html', + styleUrls: ['./dashboard-list.component.css'] +}) +export class DashboardListComponent implements OnInit { + @Output() passEntry: EventEmitter<any> = new EventEmitter(); + dbList: any = []; + dbs: Dashboard[] = []; + + loading: Boolean = true; + + tempDbDetail: Dashboard; + selectedLangs = sessionStorage.getItem("selectedLang"); + dashboardDeteleModelShow = true; + nameArr = []; + + constructor( + private adminService: AdminService, + private dashboardApiService: DashboardApiService, + private notificationService: ToastrNotificationService, + private modalService: NgbModal, + private spinner: NgxSpinnerService + ) { + // Set page title + this.adminService.setTitle("SIDEBAR.DASHBOARDLIST"); + this.getName(); + this.initData().then(data => { + this.initDbsList(this.dbList).then(data => { + this.dbs = data; + console.log(this.dbs, "dasboard-dbs[]") + }); + }); + } + + ngOnInit() { + this.spinner.show(); + } + + + async initData() { + this.dbList = []; + this.dbList = await this.getDbList(); + setTimeout(() => { + this.spinner.hide(); + }, 500); + } + + getDbList() { + var data: any; + data = this.dashboardApiService.getDashboardList().toPromise(); + + return data; + } + + async initDbsList(dbList: []) { + var d: Dashboard[] = []; + + if (dbList.length > 0) { + for (var i = 0; i < dbList.length; i++) { + let data = dbList[i]; + let feed = { + name: data["name"], + host: data["host"], + port: data["port"], + login: data["login"], + pass: data["pass"], + enabled: data["enabled"] + }; + d.push(feed); + } + } + return d; + } + + + openCreateModal() { + let thisIndex = -1; + this.openDashboardModal(thisIndex); + } + + openDashboardModal(thisIndex: number) { + var modalRef, index; + this.selectedLangs = sessionStorage.getItem("selectedLang"); + let tips = ""; + + + index = thisIndex; + console.log(index, "index,add or edit"); + this.tempDbDetail = new Dashboard(); + if (index != -1) { + modalRef = this.modalService.open(CreateDashboardComponent, { + size: "lg", + centered: true + }); + modalRef.componentInstance.dashboard = this.dbs[index]; + } else { + if(this.nameArr.length == 0 && this.dbs.length>0){ + console.log("All types have been created, you cannot create existing types again."); + return false; + }else { + modalRef = this.modalService.open(CreateDashboardComponent, { + size: "lg", + centered: true + }); + modalRef.componentInstance.dashboard = this.tempDbDetail; + } + + } + modalRef.componentInstance.nameArr = this.nameArr; + modalRef.componentInstance.passEntry.subscribe(receiveEntry => { + this.tempDbDetail = receiveEntry; + let host = this.tempDbDetail.host; + console.log(receiveEntry); + if (index != -1) { + // Db name found, to update db + this.dashboardApiService.upadteDashboard(this.tempDbDetail).subscribe( + res => { + console.log(res); + if (res.statusCode == 200) { + this.dbs[index] = this.tempDbDetail; + if (this.selectedLangs == "en-us") { + tips = "Success updated." + } else if (this.selectedLangs == "zh-hans") { + tips = "更新成功。" + } else if (this.selectedLangs == "zh-hant") { + tips = "更新成功。" + } + this.notificationService.success('"' + host + '"' + tips); + } else { + if (this.selectedLangs == "en-us") { + tips = "Fail updated." + } else if (this.selectedLangs == "zh-hans") { + tips = "更新失败。" + } else if (this.selectedLangs == "zh-hant") { + tips = "更新失敗。" + } + this.notificationService.error('"' + host + '"' + tips); + } + modalRef.close(); + }, + err => { + this.notificationService.error(err); + modalRef.close(); + } + ); + } else { + // Db name not found, to insert db + this.dashboardApiService.addDashboard(this.tempDbDetail).subscribe( + res => { + console.log(res); + let tips = ""; + if (res.statusCode == 200) { + this.dbs.push(this.tempDbDetail); + this.dbs = [...this.dbs]; + this.getName(); + if (this.selectedLangs == "en-us") { + tips = "Success inserted." + } else if (this.selectedLangs == "zh-hans") { + tips = "新增成功。" + } else if (this.selectedLangs == "zh-hant") { + tips = "新增成功。" + } + this.notificationService.success('"' + host + '"' + tips); + }else { + if (this.selectedLangs == "en-us") { + tips = "Fail inserted." + } else if (this.selectedLangs == "zh-hans") { + tips = "新增失败。" + } else if (this.selectedLangs == "zh-hant") { + tips = "新增失敗。" + } + this.notificationService.error('"' + host + '"' + tips); + } + modalRef.close(); + }, + err => { + this.notificationService.error(err); + modalRef.close(); + } + ); + } + }); + } + + deleteDashboard(thisIndex: number) { + this.selectedLangs = sessionStorage.getItem("selectedLang"); + const index = thisIndex, host = this.dbs[thisIndex]["host"]; + let tips = ""; + if (this.selectedLangs == "en-us") { + tips = "Are you sure you want to delete "; + } else if (this.selectedLangs == "zh-hans") { + tips = "您确定您要删除"; + } else if (this.selectedLangs == "zh-hant") { + tips = "您確定您要刪除"; + } + const modalRef = this.modalService.open(AlertComponent, { + // size: "sm", + centered: true + }); + modalRef.componentInstance.dashboardDeteleModelShow = this.dashboardDeteleModelShow; + modalRef.componentInstance.message = + tips + '"'+host + '"' + ' ?'; + modalRef.componentInstance.passEntry.subscribe(receivedEntry => { + // Delete database + this.dbs[thisIndex].enabled = false; + this.dashboardApiService.deleteDashboard(this.dbs[thisIndex]).subscribe( + res => { + console.log(res); + if (res.statusCode == 200) { + // this.dbs[index].enabled = false; + this.dbs.splice(index, 1); + this.getName(); + if (this.selectedLangs == "en-us") { + tips = "Success deleted." + } else if (this.selectedLangs == "zh-hans") { + tips = "删除成功。" + } else if (this.selectedLangs == "zh-hant") { + tips = "刪除成功。" + } + this.notificationService.success('"' + host + '"' + tips); + } else { + this.dbs[thisIndex].enabled = true; + if (this.selectedLangs == "en-us") { + tips = "Fail deleted." + } else if (this.selectedLangs == "zh-hans") { + tips = "删除失败。" + } else if (this.selectedLangs == "zh-hant") { + tips = "刪除失敗。" + } + this.notificationService.error('"' + host + '"' + tips); + } + modalRef.close(); + }, + err => { + this.notificationService.error(err); + modalRef.close(); + } + ); + }); + } + + getName(){ + this.dashboardApiService.getDashboardName().subscribe(data => { + this.nameArr = data; + console.log(this.nameArr,"this.nameArr111"); + }); + console.log(this.nameArr,"this.nameArr222"); + } + +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.css new file mode 100644 index 00000000..424c839b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.css @@ -0,0 +1,15 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.html new file mode 100644 index 00000000..134e2fc1 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.html @@ -0,0 +1,24 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> + + +<div class="row"> + <div class="col-md-12 path"> + Home > Dashboard List + </div> +</div> + +<app-dashboard-list></app-dashboard-list> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.spec.ts new file mode 100644 index 00000000..10886c12 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DashboardSettingComponent } from './dashboard-setting.component'; + +describe('DashboardSettingComponent', () => { + let component: DashboardSettingComponent; + let fixture: ComponentFixture<DashboardSettingComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DashboardSettingComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DashboardSettingComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.ts new file mode 100644 index 00000000..26efe645 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/dashboard-setting.component.ts @@ -0,0 +1,29 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { Component, OnInit } from '@angular/core'; +@Component({ + selector: 'app-dashboard-setting', + templateUrl: './dashboard-setting.component.html', + styleUrls: ['./dashboard-setting.component.css'] +}) +export class DashboardSettingComponent implements OnInit { + + constructor() {} + + ngOnInit() { + } + +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.css new file mode 100644 index 00000000..424c839b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.css @@ -0,0 +1,15 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html new file mode 100644 index 00000000..7c75b6b7 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html @@ -0,0 +1,15 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.spec.ts new file mode 100644 index 00000000..de3dc540 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EditTemplateModalComponent } from './edit-template-modal.component'; + +describe('EditTemplateModalComponent', () => { + let component: EditTemplateModalComponent; + let fixture: ComponentFixture<EditTemplateModalComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ EditTemplateModalComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(EditTemplateModalComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts new file mode 100644 index 00000000..3c37c58b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts @@ -0,0 +1,43 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { + Component, + OnInit, + Input, + Output, + EventEmitter, + ViewChild, + ElementRef +} from "@angular/core"; + + +@Component({ + selector: 'app-edit-template-modal', + templateUrl: './edit-template-modal.component.html', + styleUrls: ['./edit-template-modal.component.css'] +}) +export class EditTemplateModalComponent implements OnInit { + + + constructor() { + } + + + ngOnInit() { + + + } +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.css new file mode 100644 index 00000000..424c839b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.css @@ -0,0 +1,15 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html new file mode 100644 index 00000000..7c75b6b7 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html @@ -0,0 +1,15 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.spec.ts new file mode 100644 index 00000000..29df2b1a --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { NewTemplateModalComponent } from './new-template-modal.component'; + +describe('NewTemplateModalComponent', () => { + let component: NewTemplateModalComponent; + let fixture: ComponentFixture<NewTemplateModalComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ NewTemplateModalComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(NewTemplateModalComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts new file mode 100644 index 00000000..398560bd --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts @@ -0,0 +1,44 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { + Component, + OnInit, + Input, + Output, + EventEmitter, + ViewChild, + ElementRef +} from "@angular/core"; + + +@Component({ + selector: 'app-new-template-modal', + templateUrl: './new-template-modal.component.html', + styleUrls: ['./new-template-modal.component.css'] +}) +export class NewTemplateModalComponent implements OnInit { + + + constructor( + + + ) { } + + + ngOnInit() { + + } +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.css new file mode 100644 index 00000000..424c839b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.css @@ -0,0 +1,15 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html new file mode 100644 index 00000000..7c75b6b7 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html @@ -0,0 +1,15 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.spec.ts new file mode 100644 index 00000000..10a43a46 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TemplateListComponent } from './template-list.component'; + +describe('TemplateListComponent', () => { + let component: TemplateListComponent; + let fixture: ComponentFixture<TemplateListComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ TemplateListComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(TemplateListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts new file mode 100644 index 00000000..acfe4d37 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts @@ -0,0 +1,27 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import {Component, OnInit, ViewChild, ElementRef} from '@angular/core'; + +@Component({ + selector: 'app-template-list', + templateUrl: './template-list.component.html', + styleUrls: ['./template-list.component.css'] +}) +export class TemplateListComponent { + ngOnInit() { + } + +} diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.css b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.css new file mode 100644 index 00000000..424c839b --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.css @@ -0,0 +1,15 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.html new file mode 100644 index 00000000..2aede51d --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.html @@ -0,0 +1,23 @@ +<!-- + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +--> +<div class="row"> + <div class="col-md-12 path"> + {{"HOME" | translate}} > {{"ConfigDashboard" | translate}} > {{"SIDEBAR.TEMPLATE" | translate}} + </div> + <div class="col-md-12"> + <app-template-list></app-template-list> + </div> +</div> diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.spec.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.spec.ts new file mode 100644 index 00000000..21428a84 --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.spec.ts @@ -0,0 +1,40 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TemplateComponent } from './template.component'; + +describe('TemplateComponent', () => { + let component: TemplateComponent; + let fixture: ComponentFixture<TemplateComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ TemplateComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(TemplateComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.ts new file mode 100644 index 00000000..cb761deb --- /dev/null +++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template.component.ts @@ -0,0 +1,34 @@ +/* + Copyright (C) 2019 CMCC, Inc. and others. All rights reserved. + + 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. +*/ +import { Component, OnInit } from '@angular/core'; +import {AdminService} from "../../core/services/admin.service"; + +@Component({ + selector: 'app-template', + templateUrl: './template.component.html', + styleUrls: ['./template.component.css'] +}) +export class TemplateComponent implements OnInit { + + constructor(private adminService: AdminService) { + // Set page title + this.adminService.setTitle("SIDEBAR.TEMPLATE"); + } + + ngOnInit() { + } + +} diff --git a/components/datalake-handler/admin/src/src/app/header/header.component.ts b/components/datalake-handler/admin/src/src/app/header/header.component.ts index 629c19e5..7551157d 100644 --- a/components/datalake-handler/admin/src/src/app/header/header.component.ts +++ b/components/datalake-handler/admin/src/src/app/header/header.component.ts @@ -56,6 +56,7 @@ export class HeaderComponent { private translateService: TranslateService ) { this.translateService.setDefaultLang("en-us"); + sessionStorage.setItem("selectedLang","en-us"); } ngOnInit() { @@ -74,6 +75,7 @@ export class HeaderComponent { changeLanguage(lang: string) { this.translateService.use(lang); + sessionStorage.setItem("selectedLang",lang); } changeFeederStatus() { diff --git a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.css b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.css index d6d32ca4..21d4bf74 100644 --- a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.css +++ b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.css @@ -17,3 +17,9 @@ * limitations under the License. * ============LICENSE_END========================================================= */ +.navbar-nav-nohover:hover{ + background: transparent!important; +} +.navbar-nav-nohover:hover li{ + background: transparent!important; +} diff --git a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.html b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.html index 238437a0..c8c72b03 100644 --- a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.html +++ b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.html @@ -34,7 +34,7 @@ limitations under the License. </a> </li> - <li class="nav-item"> + <li class="nav-item "> <a class="nav-link" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" routerLink="/topics"> <i class="fas fa-cube"> </i> @@ -50,6 +50,32 @@ limitations under the License. </a> </li> + <li class="nav-item " > + <a (click)="this.dashboard = !this.dashboard" + class="nav-link" + style="color: #ffffff!important;background: transparent!important;cursor: pointer" + [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" + routerLink="{{dashboard==true?'/dashboard-setting/dashboard-list':'javascript:void(0)'}}" + > + <i class="fas fa-chart-line" aria-hidden="true"> </i> + {{"SIDEBAR.DASHBOARD" | translate}} + </a> + <ul class="navbar-nav flex-column navbar-nav-nohover" [ngbCollapse]="this.dashboard"> + <li class="nav-item"> + <a class="nav-link" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" + routerLink="/dashboard-setting/dashboard-list"> + {{"SIDEBAR.DASHBOARDLIST" | translate}} + </a> + </li> + <li class="nav-item"> + <a class="nav-link" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" + routerLink="dashboard-setting/template"> + {{"SIDEBAR.TEMPLATE" | translate}} + </a> + </li> + </ul> + </li> + <li class="nav-item"> <a class="nav-link" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" routerLink="/about"> diff --git a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.ts b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.ts index f8b68a63..11065d3d 100644 --- a/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.ts +++ b/components/datalake-handler/admin/src/src/app/sidebar/sidebar.component.ts @@ -35,4 +35,6 @@ export class SidebarComponent implements OnInit { constructor() {} ngOnInit() {} + + dashboard = true; } diff --git a/components/datalake-handler/admin/src/src/assets/i18n/en-us.json b/components/datalake-handler/admin/src/src/assets/i18n/en-us.json index e928ccc2..b9a26f6a 100644 --- a/components/datalake-handler/admin/src/src/assets/i18n/en-us.json +++ b/components/datalake-handler/admin/src/src/assets/i18n/en-us.json @@ -3,6 +3,9 @@ "FEDDFER": "DataLake Feeder", "TOPICS": "Topics", "DATABASE": "Database", + "DASHBOARD":"Dashboard Setting", + "DASHBOARDLIST":"Dashboard List", + "TEMPLATE":"Template", "ABOUT": "About" }, @@ -33,5 +36,27 @@ "DELETE": "Delete", "ERROR_CODE": "Error Code", "SUCCESS_UPDATED": "Success updated", - "TOPIC_DEFAULT_CONF_NOTICE": "Notice: This topic uses the default topics settings." + "TOPIC_DEFAULT_CONF_NOTICE": "Notice: This topic uses the default topics settings.", + + "HOME":"Home", + "ConfigDashboard":"Config Dashboard", + "EDIT":"Edit", + "OK":"OK", + "Save":"Save", + "Cancel":"Cancel", + "NewDashboard":"New dashboard", + "DestinationType":"Destination type", + "InputValue":"input value", + "Username":"Username", + "Password":"Password", + + + "No":"No", + "TEMPLATE_NAME":"Template name", + "TEMPLATE_TYPE":"Template type", + "TOPICS_NAME":"Topics name", + "DEPLOY_TO_DASHBOARD":"Deploy to dashboard", + "DEPLOY":"Deploy", + "NEW_TEMPLATE":"New template", + "TEMPLATE_BODY":"Template Body" } diff --git a/components/datalake-handler/admin/src/src/assets/i18n/zh-hans.json b/components/datalake-handler/admin/src/src/assets/i18n/zh-hans.json index 964e028d..0319443b 100644 --- a/components/datalake-handler/admin/src/src/assets/i18n/zh-hans.json +++ b/components/datalake-handler/admin/src/src/assets/i18n/zh-hans.json @@ -3,6 +3,9 @@ "FEDDFER": "DataLake Feeder", "TOPICS": "Topics", "DATABASE": "Database", + "DASHBOARD":"仪表板设置", + "DASHBOARDLIST":"仪表板列表", + "TEMPLATE":"模板", "ABOUT": "About" }, @@ -33,5 +36,26 @@ "DELETE": "删除", "ERROR_CODE": "错误代码", "SUCCESS_UPDATED": "更新成功", - "TOPIC_DEFAULT_CONF_NOTICE": "注意: 本Topic使用默认Topic设置。" + "TOPIC_DEFAULT_CONF_NOTICE": "注意: 本Topic使用默认Topic设置。", + + "HOME":"首页", + "ConfigDashboard":"配置仪表板", + "EDIT":"编辑", + "OK":"确认", + "Save":"保存", + "Cancel":"取消", + "NewDashboard":"新建仪表板", + "DestinationType":"目标类型", + "InputValue":"输入值", + "Username":"用户名", + "Password":"密码", + + "No":"No", + "TEMPLATE_NAME":"模板名称", + "TEMPLATE_TYPE":"模板类型", + "TOPICS_NAME":"Topics名称", + "DEPLOY_TO_DASHBOARD":"部署到仪表盘", + "DEPLOY":"部署", + "NEW_TEMPLATE":"新建模板", + "TEMPLATE_BODY":"模板体" } diff --git a/components/datalake-handler/admin/src/src/assets/i18n/zh-hant.json b/components/datalake-handler/admin/src/src/assets/i18n/zh-hant.json index f91ba785..a52739ff 100644 --- a/components/datalake-handler/admin/src/src/assets/i18n/zh-hant.json +++ b/components/datalake-handler/admin/src/src/assets/i18n/zh-hant.json @@ -3,6 +3,9 @@ "FEDDFER": "DataLake Feeder", "TOPICS": "Topics", "DATABASE": "Database", + "DASHBOARD":"儀表板設置", + "DASHBOARDLIST":"儀表板列表", + "TEMPLATE":"模板", "ABOUT": "About" }, @@ -34,5 +37,26 @@ "DELETE": "刪除", "ERROR_CODE": "錯誤代碼", "SUCCESS_UPDATED": "更新成功", - "TOPIC_DEFAULT_CONF_NOTICE": "注意：此Topic目前使用預設配置。" + "TOPIC_DEFAULT_CONF_NOTICE": "注意：此Topic目前使用預設配置。", + + "HOME":"首頁", + "ConfigDashboard":"配置儀表板", + "EDIT":"編輯", + "OK":"確認", + "Save":"保存", + "Cancel":"取消", + "NewDashboard":"新建儀表板", + "DestinationType":"目標類型", + "InputValue":"輸入值", + "Username":"用戶名", + "Password":"密碼", + + "No":"No", + "TEMPLATE_NAME":"模板名稱", + "TEMPLATE_TYPE":"模板類型", + "TOPICS_NAME":"Topics名稱", + "DEPLOY_TO_DASHBOARD":"部署到儀表板", + "DEPLOY":"部署", + "NEW_TEMPLATE":"新建模板", + "TEMPLATE_BODY":"模板體" } diff --git a/components/datalake-handler/admin/src/src/styles.css b/components/datalake-handler/admin/src/src/styles.css index 889e89a0..ef3295b3 100644 --- a/components/datalake-handler/admin/src/src/styles.css +++ b/components/datalake-handler/admin/src/src/styles.css @@ -589,3 +589,12 @@ input#switch:checked+.dl-slider:before { border-radius: 6px; padding: 4px 4px 4px 10px; } +.p-1.alert-delete-model{ + padding: 0.25rem 0.5rem; +} +.p-1 .alert-delete-title{ + padding: 1.25rem 1.5rem!important; +} +.p-1 .alert-delete-content{ + padding: 1.25rem 4.5rem!important; +} |