From 23635b69665d44af34fce1899fd136f4e09ff570 Mon Sep 17 00:00:00 2001 From: Steven Zou Date: Wed, 14 Jun 2017 00:00:22 +0800 Subject: [PATCH] add placeholders to the datagird --- src/ui_ng/lib/README.md | 70 +++++++++++++++---- .../src/endpoint/endpoint.component.html.ts | 1 + .../list-replication-rule.component.html.ts | 1 + .../list-repository.component.html.ts | 1 + .../replication/replication.component.html.ts | 1 + .../repository-stackview.component.html.ts | 2 +- .../repository-stackview.component.ts | 17 ++++- src/ui_ng/lib/src/tag/tag.component.html.ts | 1 + 8 files changed, 79 insertions(+), 15 deletions(-) diff --git a/src/ui_ng/lib/README.md b/src/ui_ng/lib/README.md index 6fa8c0ec0..b42a7e74c 100644 --- a/src/ui_ng/lib/README.md +++ b/src/ui_ng/lib/README.md @@ -52,10 +52,9 @@ If no parameters are passed to **'forRoot'**, the module will be initialized wit * **Registry log view** +Use **withTitle** to set whether self-contained a header with title or not. Default is **false**, that means no header is existing. ``` -//No @Input properties - - + ``` * **Replication Management View** @@ -85,8 +84,18 @@ If **projectId** is set to the id of specified project, then only show the repli **hasProjectAdminRole** is a user session related property to determined whether the current user has project administrator role. Some action menus might be disabled based on this property. +**tagClickEvent** is an @output event emitter for you to catch the tag click events. + ``` - + + +... + +watchTagClickEvent(tag: Tag): void { + //Process tag + ... +} + ``` ## Configurations @@ -96,7 +105,7 @@ All the related configurations are defined in the **HarborModuleConfig** interfa The base configuration for the module. Mainly used to define the relevant endpoints of services which are in charge of retrieving data from backend APIs. It's a 'OpaqueToken' and defined by 'IServiceConfig' interface. If **config** is not set, the default value will be used. ``` export const DefaultServiceConfig: IServiceConfig = { - systemInfoEndpoint: "/api/system", + systemInfoEndpoint: "/api/systeminfo", repositoryBaseEndpoint: "/api/repositories", logBaseEndpoint: "/api/logs", targetBaseEndpoint: "/api/targets", @@ -126,6 +135,8 @@ HarborLibraryModule.forRoot({ ``` It supports partially overriding. For the items not overridden, default values will be adopted. The items contained in **config** are: +* **systemInfoEndpoint:** The base endpoint of the service used to get the related system configurations. Default value is "/api/systeminfo". + * **repositoryBaseEndpoint:** The base endpoint of the service used to handle the repositories of registry and/or tags of repository. Default value is "/api/repositories". * **logBaseEndpoint:** The base endpoint of the service used to handle the recent access logs. Default is "/api/logs". @@ -578,32 +589,39 @@ HarborLibraryModule.forRoot({ * **ScanningResultService:** Get the vulnerabilities scanning results for the specified tag. ``` @Injectable() +/** + * Get the vulnerabilities scanning results for the specified tag. + * + * @export + * @abstract + * @class ScanningResultService + */ export class MyScanningResultService extends ScanningResultService { /** * Get the summary of vulnerability scanning result. * * @abstract * @param {string} tagId - * @returns {(Observable | Promise | ScanningResultSummary)} + * @returns {(Observable | Promise | VulnerabilitySummary)} * * @memberOf ScanningResultService */ - getScanningResultSummary(tagId: string): Observable | Promise | ScanningResultSummary { - ... - } + getVulnerabilityScanningSummary(tagId: string): Observable | Promise | VulnerabilitySummary{ + ... + } /** * Get the detailed vulnerabilities scanning results. * * @abstract * @param {string} tagId - * @returns {(Observable | Promise | ScanningDetailResult[])} + * @returns {(Observable | Promise | VulnerabilityItem[])} * * @memberOf ScanningResultService */ - getScanningResults(tagId: string): Observable | Promise | ScanningDetailResult[] { - ... - } + getVulnerabilityScanningResults(tagId: string): Observable | Promise | VulnerabilityItem[]{ + ... + } } ... @@ -612,4 +630,30 @@ HarborLibraryModule.forRoot({ }) ... +``` + +* **SystemInfoService:** Get related system configurations. +``` +/** + * Get System information about current backend server. + * @abstract + * @class + */ +export class MySystemInfoService extends SystemInfoService { + /** + * Get global system information. + * @abstract + * @returns + */ + getSystemInfo(): Observable | Promise | SystemInfo { + ... + } +} + +... +HarborLibraryModule.forRoot({ + systemInfoService: { provide: SystemInfoService, useClass: MySystemInfoService } +}) +... + ``` \ No newline at end of file diff --git a/src/ui_ng/lib/src/endpoint/endpoint.component.html.ts b/src/ui_ng/lib/src/endpoint/endpoint.component.html.ts index ebd4ce84d..1a15723a1 100644 --- a/src/ui_ng/lib/src/endpoint/endpoint.component.html.ts +++ b/src/ui_ng/lib/src/endpoint/endpoint.component.html.ts @@ -20,6 +20,7 @@ export const ENDPOINT_TEMPLATE: string = ` {{'DESTINATION.NAME' | translate}} {{'DESTINATION.URL' | translate}} {{'DESTINATION.CREATION_TIME' | translate}} + {{'DESTINATION.PLACEHOLDER' | translate }} diff --git a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts index 3292a7f42..f19268eee 100644 --- a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts +++ b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts @@ -7,6 +7,7 @@ export const LIST_REPLICATION_RULE_TEMPLATE: string = ` {{'REPLICATION.DESTINATION_NAME' | translate}} {{'REPLICATION.LAST_START_TIME' | translate}} {{'REPLICATION.ACTIVATION' | translate}} + {{'REPLICATION.PLACEHOLDER' | translate }} diff --git a/src/ui_ng/lib/src/list-repository/list-repository.component.html.ts b/src/ui_ng/lib/src/list-repository/list-repository.component.html.ts index 1a5e65037..158fac220 100644 --- a/src/ui_ng/lib/src/list-repository/list-repository.component.html.ts +++ b/src/ui_ng/lib/src/list-repository/list-repository.component.html.ts @@ -3,6 +3,7 @@ export const LIST_REPOSITORY_TEMPLATE = ` {{'REPOSITORY.NAME' | translate}} {{'REPOSITORY.TAGS_COUNT' | translate}} {{'REPOSITORY.PULL_COUNT' | translate}} + {{'REPOSITORY.PLACEHOLDER' | translate }} diff --git a/src/ui_ng/lib/src/replication/replication.component.html.ts b/src/ui_ng/lib/src/replication/replication.component.html.ts index 283a45e3c..5e89a2843 100644 --- a/src/ui_ng/lib/src/replication/replication.component.html.ts +++ b/src/ui_ng/lib/src/replication/replication.component.html.ts @@ -53,6 +53,7 @@ export const REPLICATION_TEMPLATE: string = ` {{'REPLICATION.CREATION_TIME' | translate}} {{'REPLICATION.END_TIME' | translate}} {{'REPLICATION.LOGS' | translate}} + {{'REPLICATION.JOB_PLACEHOLDER' | translate }} {{j.repository}} {{j.status}} diff --git a/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.html.ts b/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.html.ts index b9d935914..8ab942517 100644 --- a/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.html.ts +++ b/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.html.ts @@ -21,7 +21,7 @@ export const REPOSITORY_STACKVIEW_TEMPLATE: string = ` {{r.name}} {{r.tags_count}} {{r.pull_count}} - + {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}} {{'REPOSITORY.OF' | translate}} diff --git a/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.ts b/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.ts index c6d1a5ce3..7321a1134 100644 --- a/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.ts +++ b/src/ui_ng/lib/src/repository-stackview/repository-stackview.component.ts @@ -1,4 +1,13 @@ -import { Component, Input, OnInit, ViewChild, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; +import { + Component, + Input, + Output, + OnInit, + ViewChild, + ChangeDetectionStrategy, + ChangeDetectorRef, + EventEmitter +} from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; import { Comparator } from 'clarity-angular'; @@ -21,6 +30,7 @@ import { ConfirmationDialogComponent } from '../confirmation-dialog/confirmation import { ConfirmationMessage } from '../confirmation-dialog/confirmation-message'; import { ConfirmationAcknowledgement } from '../confirmation-dialog/confirmation-state-message'; import { Subscription } from 'rxjs/Subscription'; +import { Tag } from '../service/interface'; @Component({ selector: 'hbr-repository-stackview', @@ -34,6 +44,7 @@ export class RepositoryStackviewComponent implements OnInit { @Input() hasSignedIn: boolean; @Input() hasProjectAdminRole: boolean; + @Output() tagClickEvent = new EventEmitter(); lastFilteredRepoName: string; repositories: Repository[]; @@ -120,4 +131,8 @@ export class RepositoryStackviewComponent implements OnInit { refresh() { this.retrieve(); } + + watchTagClickEvt(tag: Tag): void { + this.tagClickEvent.emit(tag); + } } \ No newline at end of file diff --git a/src/ui_ng/lib/src/tag/tag.component.html.ts b/src/ui_ng/lib/src/tag/tag.component.html.ts index dcf1a4f7d..1fb6ba5f0 100644 --- a/src/ui_ng/lib/src/tag/tag.component.html.ts +++ b/src/ui_ng/lib/src/tag/tag.component.html.ts @@ -22,6 +22,7 @@ export const TAG_TEMPLATE = ` {{'REPOSITORY.DOCKER_VERSION' | translate}} {{'REPOSITORY.ARCHITECTURE' | translate}} {{'REPOSITORY.OS' | translate}} + {{'TGA.PLACEHOLDER' | translate }}