This is an automated email from the ASF dual-hosted git repository. zjffdu pushed a commit to branch web_angular in repository https://gitbox.apache.org/repos/asf/zeppelin.git
commit f8cc53aaa044c45be4414242b54573beb48a9cee Author: Hsuan Lee <hsua...@gmail.com> AuthorDate: Tue Dec 3 15:18:13 2019 +0800 [ZEPPELIN-4401] Add configuration page ### What is this PR for? Add the configuration page on the reworked with Angular project ### What type of PR is it? [Feature] ### What is the Jira issue? https://issues.apache.org/jira/browse/ZEPPELIN-4401 ### How should this be tested? Not applicable ### Screenshots (if appropriate) ![image](https://user-images.githubusercontent.com/22736418/70121058-cb56c680-16a8-11ea-9ee5-3375a2bc76d6.png) ### Questions: * Does the licenses files need update? No * Is there breaking changes for older versions? No * Does this needs documentation? No Author: Hsuan Lee <hsua...@gmail.com> Closes #3532 from hsuanxyz/feat/configuration and squashes the following commits: 2e2ee0c2b [Hsuan Lee] feat: add configuration page --- .../configuration/configuration-routing.module.ts | 27 ++++++++++++++++ .../configuration/configuration.component.html | 37 ++++++++++++++++++++++ .../configuration/configuration.component.less | 22 +++++++++++++ .../configuration/configuration.component.ts | 36 +++++++++++++++++++++ .../configuration/configuration.module.ts | 24 ++++++++++++++ .../pages/workspace/workspace-routing.module.ts | 5 +++ .../configuration.service.ts} | 29 ++++++++--------- .../src/app/services/public-api.ts | 1 + .../share/page-header/page-header.component.html | 2 +- .../app/share/page-header/page-header.component.ts | 2 +- zeppelin-web-angular/src/app/share/share.module.ts | 2 ++ 11 files changed, 170 insertions(+), 17 deletions(-) diff --git a/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration-routing.module.ts b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration-routing.module.ts new file mode 100644 index 0000000..6d499a0 --- /dev/null +++ b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration-routing.module.ts @@ -0,0 +1,27 @@ +/* + * 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 { NgModule } from '@angular/core'; +import { RouterModule, Routes } from '@angular/router'; +import { ConfigurationComponent } from './configuration.component'; + +const routes: Routes = [ + { + path: '', + component: ConfigurationComponent + } +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule] +}) +export class ConfigurationRoutingModule {} diff --git a/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.html b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.html new file mode 100644 index 0000000..6708f34 --- /dev/null +++ b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.html @@ -0,0 +1,37 @@ +<!-- + ~ 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. + --> + +<zeppelin-page-header [description]="configDesc" title="Configurations"></zeppelin-page-header> +<ng-template #configDesc> + Shows current configurations for Zeppelin Server. + <br> + Note: For security reasons, some key/value pairs including passwords would not be shown. +</ng-template> +<div class="content"> + <nz-table nzSize="small" + [nzData]="configEntries" + [nzFrontPagination]="false" + [nzShowPagination]="false"> + <thead> + <tr> + <th>Name</th> + <th>Value</th> + </tr> + </thead> + <tbody> + <tr *ngFor="let data of configEntries"> + <td>{{data[0]}}</td> + <td>{{data[1]}}</td> + </tr> + </tbody> + </nz-table> +</div> diff --git a/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.less b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.less new file mode 100644 index 0000000..b3c4ee2 --- /dev/null +++ b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.less @@ -0,0 +1,22 @@ +/* + * 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 'theme-mixin'; + +.themeMixin({ + .content { + padding: @card-padding-base / 2; + nz-table { + background: @card-background; + } + } +}); diff --git a/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.ts b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.ts new file mode 100644 index 0000000..fb3b120 --- /dev/null +++ b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.component.ts @@ -0,0 +1,36 @@ +/* + * 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 { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core'; +import { ConfigurationService } from '@zeppelin/services'; + +@Component({ + selector: 'zeppelin-configuration', + templateUrl: './configuration.component.html', + styleUrls: ['./configuration.component.less'], + changeDetection: ChangeDetectionStrategy.OnPush +}) +export class ConfigurationComponent implements OnInit { + configEntries: Array<[string, string]> = []; + + constructor(private configurationService: ConfigurationService, private cdr: ChangeDetectorRef) {} + + ngOnInit() { + this.getAllConfig(); + } + + getAllConfig(): void { + this.configurationService.getAll().subscribe(data => { + this.configEntries = [...Object.entries<string>(data)]; + this.cdr.markForCheck(); + }); + } +} diff --git a/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.module.ts b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.module.ts new file mode 100644 index 0000000..ff64f89 --- /dev/null +++ b/zeppelin-web-angular/src/app/pages/workspace/configuration/configuration.module.ts @@ -0,0 +1,24 @@ +/* + * 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 { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; + +import { ShareModule } from '@zeppelin/share'; +import { NzTableModule } from 'ng-zorro-antd'; +import { ConfigurationRoutingModule } from './configuration-routing.module'; +import { ConfigurationComponent } from './configuration.component'; + +@NgModule({ + declarations: [ConfigurationComponent], + imports: [CommonModule, ShareModule, NzTableModule, ConfigurationRoutingModule] +}) +export class ConfigurationModule {} diff --git a/zeppelin-web-angular/src/app/pages/workspace/workspace-routing.module.ts b/zeppelin-web-angular/src/app/pages/workspace/workspace-routing.module.ts index 9315443..1b6bedf 100644 --- a/zeppelin-web-angular/src/app/pages/workspace/workspace-routing.module.ts +++ b/zeppelin-web-angular/src/app/pages/workspace/workspace-routing.module.ts @@ -43,6 +43,11 @@ const routes: Routes = [ path: 'interpreter', loadChildren: () => import('@zeppelin/pages/workspace/interpreter/interpreter.module').then(m => m.InterpreterModule) + }, + { + path: 'configuration', + loadChildren: () => + import('@zeppelin/pages/workspace/configuration/configuration.module').then(m => m.ConfigurationModule) } ] } diff --git a/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts b/zeppelin-web-angular/src/app/services/configuration.service.ts similarity index 50% copy from zeppelin-web-angular/src/app/share/page-header/page-header.component.ts copy to zeppelin-web-angular/src/app/services/configuration.service.ts index 1c03ee6..b8c392f 100644 --- a/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts +++ b/zeppelin-web-angular/src/app/services/configuration.service.ts @@ -10,22 +10,21 @@ * limitations under the License. */ -import { ChangeDetectionStrategy, Component, Input, OnInit, TemplateRef } from '@angular/core'; -import { InputBoolean } from 'ng-zorro-antd'; +import { HttpClient } from '@angular/common/http'; +import { Injectable } from '@angular/core'; -@Component({ - selector: 'zeppelin-page-header', - templateUrl: './page-header.component.html', - styleUrls: ['./page-header.component.less'], - changeDetection: ChangeDetectionStrategy.OnPush -}) -export class PageHeaderComponent implements OnInit { - @Input() title: string; - @Input() description: string; - @Input() @InputBoolean() divider = false; - @Input() extra: TemplateRef<void>; +import { BaseRest } from './base-rest'; +import { BaseUrlService } from './base-url.service'; - constructor() {} +@Injectable({ + providedIn: 'root' +}) +export class ConfigurationService extends BaseRest { + constructor(baseUrlService: BaseUrlService, private http: HttpClient) { + super(baseUrlService); + } - ngOnInit() {} + getAll() { + return this.http.get<{ [key: string]: string }>(this.restUrl`/configurations/all`); + } } diff --git a/zeppelin-web-angular/src/app/services/public-api.ts b/zeppelin-web-angular/src/app/services/public-api.ts index d6709ac..155a3b2 100644 --- a/zeppelin-web-angular/src/app/services/public-api.ts +++ b/zeppelin-web-angular/src/app/services/public-api.ts @@ -27,3 +27,4 @@ export * from './array-ordering.service'; export * from './note-list.service'; export * from './runtime-compiler.service'; export * from './shortcut.service'; +export * from './configuration.service'; diff --git a/zeppelin-web-angular/src/app/share/page-header/page-header.component.html b/zeppelin-web-angular/src/app/share/page-header/page-header.component.html index 430f7e2..c214ab4 100644 --- a/zeppelin-web-angular/src/app/share/page-header/page-header.component.html +++ b/zeppelin-web-angular/src/app/share/page-header/page-header.component.html @@ -12,7 +12,7 @@ <nz-card class="header"> <h2>{{title}} <span class="header-extra"><ng-container [ngTemplateOutlet]="extra"></ng-container></span></h2> - <p>{{description}}</p> + <p><ng-container *nzStringTemplateOutlet="description">{{description}}</ng-container></p> <nz-divider *ngIf="divider" nzType="horizontal"></nz-divider> <ng-content></ng-content> </nz-card> diff --git a/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts b/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts index 1c03ee6..601726e 100644 --- a/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts +++ b/zeppelin-web-angular/src/app/share/page-header/page-header.component.ts @@ -21,7 +21,7 @@ import { InputBoolean } from 'ng-zorro-antd'; }) export class PageHeaderComponent implements OnInit { @Input() title: string; - @Input() description: string; + @Input() description: string | TemplateRef<void>; @Input() @InputBoolean() divider = false; @Input() extra: TemplateRef<void>; diff --git a/zeppelin-web-angular/src/app/share/share.module.ts b/zeppelin-web-angular/src/app/share/share.module.ts index fcb0375..3f7a003 100644 --- a/zeppelin-web-angular/src/app/share/share.module.ts +++ b/zeppelin-web-angular/src/app/share/share.module.ts @@ -16,6 +16,7 @@ import { FormsModule } from '@angular/forms'; import { RouterModule } from '@angular/router'; import { + NzAddOnModule, NzAlertModule, NzBadgeModule, NzButtonModule, @@ -74,6 +75,7 @@ const PIPES = [HumanizeBytesPipe]; FormsModule, CommonModule, NzMenuModule, + NzAddOnModule, NzIconModule, NzInputModule, NzDropDownModule,