Upstream/harbor
1
0
Fork 0
mirror of https://github.com/goharbor/harbor.git synced 2024-09-29 13:57:33 +02:00
Code Issues Projects Releases Wiki Activity

Add status to charts and versions UI

Browse Source 
Add status to present if the chart or version is deprecated.
This commit is contained in:
Deng, Qian 2018-08-08 14:56:35 +08:00
parent d4b17d4722
commit 8d67330d9a
10 changed files with 61 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/ui_ng/lib/src/helm-chart/chart-detail/chart-detail-summary.component.html
View File

@ -117,7 +117,8 @@
<td class="left">
<span class="content-icon">
<clr-icon shape="shield-check" class="is-success"></clr-icon>
</span>&nbsp;<a (click)="downloadChart()">{{'HELM_CHART.READY' | translate }}</a></td>
</span>&nbsp;<a href="javascript:void(0)" (click)="downloadChart()">{{'HELM_CHART.READY' | translate }}</a>
</td>
</ng-template>
<ng-template #unsignedContent>
<td class="left">

22
src/ui_ng/lib/src/helm-chart/helm-chart.component.html
View File

@ -28,7 +28,8 @@
<clr-icon shape="upload" size="16"></clr-icon>&nbsp;{{'HELM_CHART.UPLOAD' | translate}}
</button>
</clr-dg-action-bar>
<clr-dg-column [clrDgField]="'name'">{{'HELM_CHART.NAME' | translate}}</clr-dg-column>
<clr-dg-column >{{'HELM_CHART.NAME' | translate}}</clr-dg-column>
<clr-dg-column >{{'HELM_CHART.STATUS' | translate}}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.CHARTVERSIONS' | translate}}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.CREATED' | translate}}</clr-dg-column>
<clr-dg-placeholder>{{'HELM_CHART.PLACEHOLDER' | translate }}</clr-dg-placeholder>
@ -39,6 +40,7 @@
</span>
<a href="javascript:void(0)" (click)="onChartClick(chart)">{{ chart.name }}</a>
</clr-dg-cell>
<clr-dg-cell>{{ getStatusString(chart) | translate }}</clr-dg-cell>
<clr-dg-cell>{{ chart.total_versions }}</clr-dg-cell>
<clr-dg-cell>{{ chart.created | date }}</clr-dg-cell>
</clr-dg-row>
@ -51,7 +53,7 @@
</div>
</div>
<div *ngIf="isCardView" class="row card-container">
<div *ngFor="let item of charts;" class="col-lg-2 col-md-5 col-sm-5 col-xs-6">
<div *ngFor="let item of charts;" class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-xs-12">
<a let i=index; class="card clickable" (click)="onChartClick(item)">
<div class="card-header">
<div class="card-icon">
@ -60,10 +62,18 @@
<div class="card-title">{{item.name}}</div>
</div>
<div class="card-footer">
<div class="form-group">
<span class="version-text">{{item.total_versions}}</span>
<label *ngIf="item.total_versions !== 1">{{'HELM_CHART.CHARTVERSIONS' | translate}}</label>
<label *ngIf="item.total_versions === 1">{{'HELM_CHART.VERSION' | translate}}</label>
<div class="row flex-items-xs-between">
<div class="col-xs-6">
<span class="version-text">{{item.total_versions}}</span>
<label *ngIf="item.total_versions !== 1">{{'HELM_CHART.CHARTVERSIONS' | translate}}</label>
<label *ngIf="item.total_versions === 1">{{'HELM_CHART.VERSION' | translate}}</label>
</div>
<div class="col-xs-6">
<span class="label"
[class.label-danger]="item.deprecated"
[class.label-success]="!item.deprecated"
>{{getStatusString(item) | translate}}</span>
</div>
</div>
</div>
</a>

8
src/ui_ng/lib/src/helm-chart/helm-chart.component.ts
View File

@ -178,4 +178,12 @@ export class HelmChartComponent implements OnInit {
getDefaultIcon(chart: HelmChartItem) {
chart.icon = this.chartDefaultIcon;
}
getStatusString(chart: HelmChartItem) {
if (chart.deprecated) {
return "HELM_CHART.DEPRECATED";
} else {
return "HELM_CHART.ACTIVE";
}
}
}

11
src/ui_ng/lib/src/helm-chart/versions/helm-chart-version.component.html
View File

@ -50,8 +50,10 @@
(click)="openVersionDeleteModal(selectedRows)">
<clr-icon shape="times" size="16"></clr-icon>&nbsp;{{'BUTTON.DELETE' | translate}}</button>
</clr-dg-action-bar>
<clr-dg-column [clrDgField]="'name'">{{'HELM_CHART.VERSION' | translate}}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.VERSION' | translate}}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.STATUS' | translate }}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.ENGINE' | translate }}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.MAINTAINERS' | translate }}</clr-dg-column>
<clr-dg-column>{{'HELM_CHART.CREATED' | translate }}</clr-dg-column>
<clr-dg-placeholder>{{'HELM_CHART.NO_VERSION_PLACEHOLDER' | translate }}</clr-dg-placeholder>
@ -62,6 +64,7 @@
</span>
<a href="javascript:void(0)" (click)="onVersionClick(v)">{{ v.version }}</a>
</clr-dg-cell>
<clr-dg-cell>{{ getStatusString(v) | translate }}</clr-dg-cell>
<clr-dg-cell>{{ v.engine }}</clr-dg-cell>
<clr-dg-cell>{{ getMaintainerString(v.maintainers) }}</clr-dg-cell>
<clr-dg-cell>{{ v.created | date}}</clr-dg-cell>
@ -87,6 +90,10 @@
</div>
</div>
<div class="card-block">
<div class="form-group">
<label class="card-label">{{'HELM_CHART.STATUS' | translate}}</label>
<div>{{getStatusString(item) | translate}}</div>
</div>
<div class="form-group">
<label class="card-label">{{'HELM_CHART.ENGINE' | translate}}</label>
<div>{{item.engine}}</div>
@ -103,7 +110,7 @@
<div class="card-footer">
<clr-dropdown [clrCloseMenuOnItemClick]="false">
<button type="button" class="btn btn-link" (click)="versionDownload($event, item)">{{'HELM_CHART.DOWNLOAD' | translate}}</button>
<button type="button" class="btn btn-link" (click)="openVersionDeleteModal([item])">{{'BUTTON.DELETE' | translate}}</button>
<button type="button" class="btn btn-link" (click)="deleteVersionCard($event, item)">{{'BUTTON.DELETE' | translate}}</button>
</clr-dropdown>
</div>
</a>

18
src/ui_ng/lib/src/helm-chart/versions/helm-chart-version.component.ts
View File

@ -172,7 +172,10 @@ export class ChartVersionComponent implements OnInit {
});
}
versionDownload(item?: HelmChartVersion) {
versionDownload(evt: Event, item?: HelmChartVersion) {
if (evt) {
evt.stopPropagation();
}
let selectedVersion: HelmChartVersion;
if (item) {
@ -268,6 +271,10 @@ export class ChartVersionComponent implements OnInit {
}
}
deleteVersionCard(env: Event, version: HelmChartVersion) {
env.stopPropagation();
this.openVersionDeleteModal([version]);
}
openVersionDeleteModal(versions: HelmChartVersion[]) {
let versionNames = versions.map(v => v.name).join(",");
this.translateService.get("HELM_CHART.DELETE_CHART_VERSION").subscribe(key => {
@ -304,8 +311,15 @@ export class ChartVersionComponent implements OnInit {
}
}
getDefaultIcon(v: HelmChartVersion) {
v.icon = this.chartDefaultIcon;
}
getStatusString(chartVersion: HelmChartVersion) {
if (chartVersion.deprecated) {
return "HELM_CHART.DEPRECATED";
} else {
return "HELM_CHART.ACTIVE";
}
}
}

3
src/ui_ng/lib/src/service/interface.ts
View File

@ -307,7 +307,7 @@ export interface HelmChartItem {
status?: string;
pulls?: number;
maintainer?: string;
deprecated?: boolean;
}
export interface HelmChartVersion {
@ -324,6 +324,7 @@ export interface HelmChartVersion {
urls: string[];
created: string;
digest: string;
deprecated?: boolean;
}
export interface HelmChartDetail {

3
src/ui_ng/src/i18n/lang/en-us-lang.json
View File

@ -521,7 +521,8 @@
"COMMAND": "Commands",
"PROV_FILE": "Prov File",
"READY": "Ready",
"NOT_READY": "Not Ready"
"NOT_READY": "Not Ready",
"STATUS": "Status"
},
"ALERT": {
"FORM_CHANGE_CONFIRMATION": "Some changes are not saved yet. Do you want to cancel?"

3
src/ui_ng/src/i18n/lang/es-es-lang.json
View File

@ -520,7 +520,8 @@
"COMMAND": "Commands",
"PROV_FILE": "Prov File",
"READY": "Ready",
"NOT_READY": "Not Ready"
"NOT_READY": "Not Ready",
"STATUS": "Status"
},
"ALERT": {
"FORM_CHANGE_CONFIRMATION": "Algunos cambios no se han guardado aún. ¿Quiere cancelar?"

3
src/ui_ng/src/i18n/lang/fr-fr-lang.json
View File

@ -495,7 +495,8 @@
"COMMAND": "Commands",
"PROV_FILE": "Prov File",
"READY": "Ready",
"NOT_READY": "Not Ready"
"NOT_READY": "Not Ready",
"STATUS": "Status"
},
"ALERT": {
"FORM_CHANGE_CONFIRMATION": "Certaines modifications ne sont pas encore enregistrées. Voulez-vous annuler ?"

3
src/ui_ng/src/i18n/lang/zh-cn-lang.json
View File

@ -520,7 +520,8 @@
"COMMAND": "命令",
"PROV_FILE": "Prov 文件",
"READY": "就绪",
"NOT_READY": "未就绪"
"NOT_READY": "未就绪",
"STATUS": "状态"
},
"ALERT": {
"FORM_CHANGE_CONFIRMATION": "表单内容改变，确认是否取消?"