From 220e70953087b779ff14de25b6ae01c092771a54 Mon Sep 17 00:00:00 2001
From: Steven Zou <loneghost1982@gmail.com>
Date: Fri, 28 Jul 2017 18:49:17 +0800
Subject: [PATCH] support read-ony mode for replication list view (#2915)
---
src/ui_ng/lib/README.md | 4 +++-
.../list-replication-rule.component.html.ts | 2 +-
.../list-replication-rule/list-replication-rule.component.ts | 1 +
src/ui_ng/lib/src/replication/replication.component.html.ts | 4 ++--
src/ui_ng/lib/src/replication/replication.component.ts | 5 +++++
src/ui_ng/package.json | 2 +-
6 files changed, 13 insertions(+), 5 deletions(-)
diff --git a/src/ui_ng/lib/README.md b/src/ui_ng/lib/README.md
index ce4796cd0..00adee80b 100644
--- a/src/ui_ng/lib/README.md
+++ b/src/ui_ng/lib/README.md
@@ -74,8 +74,10 @@ If **projectId** is set to the id of specified project, then only show the repli
**withReplicationJob** is used to determine whether or not show the replication jobs which are relevant with the selected replication rule.
+**readonly** is to disable all the create/edit/delete actions.
+
```
-<hbr-replication [projectId]="..." [withReplicationJob]='...'></hbr-replication>
+<hbr-replication [projectId]="..." [withReplicationJob]='...' [readonly]="..."></hbr-replication>
```
* **Endpoint Management View**
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 60357b30f..047a61c2f 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
@@ -9,7 +9,7 @@ export const LIST_REPLICATION_RULE_TEMPLATE: string = `
<clr-dg-column [clrDgSortBy]="enabledComparator">{{'REPLICATION.ACTIVATION' | translate}}</clr-dg-column>
<clr-dg-placeholder>{{'REPLICATION.PLACEHOLDER' | translate }}</clr-dg-placeholder>
<clr-dg-row *clrDgItems="let p of changedRules" [clrDgItem]="p" (click)="selectRule(p)" [style.backgroundColor]="(!projectScope && withReplicationJob && selectedId === p.id) ? '#eee' : ''">
- <clr-dg-action-overflow>
+ <clr-dg-action-overflow *ngIf="!readonly">
<button class="action-item" (click)="editRule(p)">{{'REPLICATION.EDIT_POLICY' | translate}}</button>
<button class="action-item" (click)="toggleRule(p)">{{ (p.enabled === 0 ? 'REPLICATION.ENABLE' : 'REPLICATION.DISABLE') | translate}}</button>
<button class="action-item" (click)="deleteRule(p)">{{'REPLICATION.DELETE_POLICY' | translate}}</button>
diff --git a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
index b543a0556..bad464f98 100644
--- a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
+++ b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
@@ -43,6 +43,7 @@ export class ListReplicationRuleComponent implements OnInit {
@Input() projectId: number;
@Input() selectedId: number | string;
@Input() withReplicationJob: boolean;
+ @Input() readonly: boolean;
@Input() loading: boolean = false;
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 0bab97d7d..d71f47378 100644
--- a/src/ui_ng/lib/src/replication/replication.component.html.ts
+++ b/src/ui_ng/lib/src/replication/replication.component.html.ts
@@ -3,7 +3,7 @@ export const REPLICATION_TEMPLATE: string = `
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="row flex-items-xs-between" style="height:32px;">
<div class="flex-xs-middle option-left">
- <button *ngIf="projectId" class="btn btn-link" (click)="openModal()"><clr-icon shape="add"></clr-icon> {{'REPLICATION.REPLICATION_RULE' | translate}}</button>
+ <button *ngIf="creationAvailable" class="btn btn-link" (click)="openModal()"><clr-icon shape="add"></clr-icon> {{'REPLICATION.REPLICATION_RULE' | translate}}</button>
<create-edit-rule [projectId]="projectId" (reload)="reloadRules($event)"></create-edit-rule>
</div>
<div class="flex-xs-middle option-right">
@@ -20,7 +20,7 @@ export const REPLICATION_TEMPLATE: string = `
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
- <hbr-list-replication-rule #listReplicationRule [projectId]="projectId" (selectOne)="selectOneRule($event)" (editOne)="openEditRule($event)" (reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
+ <hbr-list-replication-rule #listReplicationRule [readonly]="readonly" [projectId]="projectId" (selectOne)="selectOneRule($event)" (editOne)="openEditRule($event)" (reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
</div>
<div *ngIf="withReplicationJob" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="row flex-items-xs-between" style="height:60px;">
diff --git a/src/ui_ng/lib/src/replication/replication.component.ts b/src/ui_ng/lib/src/replication/replication.component.ts
index 59007c770..c5768985f 100644
--- a/src/ui_ng/lib/src/replication/replication.component.ts
+++ b/src/ui_ng/lib/src/replication/replication.component.ts
@@ -75,6 +75,7 @@ export class ReplicationComponent implements OnInit {
@Input() projectId: number | string;
@Input() withReplicationJob: boolean;
+ @Input() readonly: boolean;
@Output() redirect = new EventEmitter<ReplicationRule>();
@@ -118,6 +119,10 @@ export class ReplicationComponent implements OnInit {
private translateService: TranslateService) {
}
+ public get creationAvailable(): boolean {
+ return !this.readonly && this.projectId ? true : false;
+ }
+
ngOnInit() {
this.currentRuleStatus = this.ruleStatus[0];
this.currentJobStatus = this.jobStatus[0];
diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json
index 5c6bdf1fd..520987a56 100644
--- a/src/ui_ng/package.json
+++ b/src/ui_ng/package.json
@@ -31,7 +31,7 @@
"clarity-icons": "^0.9.8",
"clarity-ui": "^0.9.8",
"core-js": "^2.4.1",
- "harbor-ui": "0.3.64",
+ "harbor-ui": "0.3.66",
"intl": "^1.2.5",
"mutationobserver-shim": "^0.3.2",
"ngx-cookie": "^1.0.0",