Upstream/harbor
1
0
Fork 0
mirror of https://github.com/goharbor/harbor.git synced 2024-11-23 10:45:45 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #4115 from pengpengshui/batchDelection

Browse Source 
Set replication list as single selection about #4107
This commit is contained in:
pengpengshui 2018-01-24 16:05:37 +08:00 committed by GitHub
commit e649575419
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 49 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts
View File

@ -1,12 +1,12 @@
export const LIST_REPLICATION_RULE_TEMPLATE: string = ` export const LIST_REPLICATION_RULE_TEMPLATE: string = `
<div style="padding-bottom: 15px;"> <div style="padding-bottom: 15px;">
<clr-datagrid [clrDgLoading]="loading" [(clrDgSelected)]="selectedRow" (clrDgSelectedChange)="selectedChange()"> <clr-datagrid [clrDgLoading]="loading" [(clrDgSingleSelected)]="selectedRow" [clDgRowSelection]="true">
<clr-dg-action-bar style="height:24px;"> <clr-dg-action-bar style="height:24px;">
<div class="btn-group" *ngIf="opereateAvailable || isSystemAdmin"> <div class="btn-group" *ngIf="opereateAvailable || isSystemAdmin">
<button type="button" class="btn btn-sm btn-secondary" (click)="openModal()">{{'REPLICATION.NEW_REPLICATION_RULE' | translate}}</button> <button type="button" class="btn btn-sm btn-secondary" (click)="openModal()">{{'REPLICATION.NEW_REPLICATION_RULE' | translate}}</button>
<button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length !== 1" (click)="editRule(selectedRow)">{{'REPLICATION.EDIT_POLICY' | translate}}</button> <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="editRule(selectedRow)">{{'REPLICATION.EDIT_POLICY' | translate}}</button>
<button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length == 0" (click)="deleteRule(selectedRow)">{{'REPLICATION.DELETE_POLICY' | translate}}</button> <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="deleteRule(selectedRow)">{{'REPLICATION.DELETE_POLICY' | translate}}</button>
<button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length == 0" (click)="replicateRule(selectedRow)">{{'REPLICATION.REPLICATE' | translate}}</button> <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="replicateRule(selectedRow)">{{'REPLICATION.REPLICATE' | translate}}</button>
</div> </div>
</clr-dg-action-bar> </clr-dg-action-bar>
<clr-dg-column [clrDgField]="'name'">{{'REPLICATION.NAME' | translate}}</clr-dg-column> <clr-dg-column [clrDgField]="'name'">{{'REPLICATION.NAME' | translate}}</clr-dg-column>

59
src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
View File

@ -69,14 +69,13 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
@Output() redirect = new EventEmitter<ReplicationRule>(); @Output() redirect = new EventEmitter<ReplicationRule>();
@Output() openNewRule = new EventEmitter<any>(); @Output() openNewRule = new EventEmitter<any>();
@Output() replicateManual = new EventEmitter<ReplicationRule[]>(); @Output() replicateManual = new EventEmitter<ReplicationRule[]>();
@Output() hasJobs = new EventEmitter<boolean>();
projectScope: boolean = false; projectScope: boolean = false;
rules: ReplicationRule[]; rules: ReplicationRule[];
changedRules: ReplicationRule[]; changedRules: ReplicationRule[];
ruleName: string; ruleName: string;
canDeleteRuleList: boolean[] = []; canDeleteRule: boolean;
selectedRow: ReplicationRule[] = []; selectedRow: ReplicationRule[] = [];
batchDelectionInfos: BatchInfo[] = []; batchDelectionInfos: BatchInfo[] = [];
@ -125,7 +124,7 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
retrieveRules(ruleName: string = ''): void { retrieveRules(ruleName: string = ''): void {
this.loading = true; this.loading = true;
this.selectedRow = []; this.selectedRow = null;
toPromise<ReplicationRule[]>(this.replicationService toPromise<ReplicationRule[]>(this.replicationService
.getReplicationRules(this.projectId, ruleName)) .getReplicationRules(this.projectId, ruleName))
.then(rules => { .then(rules => {
@ -185,19 +184,11 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
} }
} }
selectedChange(): void {
if (this.selectedRow.length !== 0) {
this.hasJobs.emit(false);
}
let hnd = setInterval(() => this.ref.markForCheck(), 200);
setTimeout(() => clearInterval(hnd), 2000);
}
selectRule(rule: ReplicationRule): void { selectRule(rule: ReplicationRule): void {
this.selectedId = rule.id || ''; this.selectedId = rule.id || '';
this.selectedRow = []; this.selectedRow = null;
this.selectOne.emit(rule); this.selectOne.emit(rule);
this.hasJobs.emit(true);
} }
redirectTo(rule: ReplicationRule): void { redirectTo(rule: ReplicationRule): void {
@ -208,8 +199,8 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
this.openNewRule.emit(); this.openNewRule.emit();
} }
editRule(rules: ReplicationRule[]) { editRule(rule: ReplicationRule) {
this.editOne.emit(rules[0]); this.editOne.emit(rule);
} }
toggleRule(rule: ReplicationRule) { toggleRule(rule: ReplicationRule) {
@ -225,7 +216,7 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
jobList(id: string | number): Promise<void> { jobList(id: string | number): Promise<void> {
let ruleData: ReplicationJobItem[]; let ruleData: ReplicationJobItem[];
this.canDeleteRuleList = []; this.canDeleteRule = true;
let count: number = 0; let count: number = 0;
return toPromise<ReplicationJob>(this.replicationService return toPromise<ReplicationJob>(this.replicationService
.getJobs(id)) .getJobs(id))
@ -238,55 +229,43 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
} }
}); });
} }
let canDeleteRule: boolean = count > 0 ? false : true; this.canDeleteRule = count > 0 ? false : true;
this.canDeleteRuleList.push(canDeleteRule);
}) })
.catch(error => this.errorHandler.error(error)); .catch(error => this.errorHandler.error(error));
} }
deleteRule(rules: ReplicationRule[]) { deleteRule(rule: ReplicationRule) {
if (rules && rules.length) { if (rule) {
let nameArr: string[] = [];
this.batchDelectionInfos = []; this.batchDelectionInfos = [];
rules.forEach(data => {
nameArr.push(data.name);
let initBatchMessage = new BatchInfo(); let initBatchMessage = new BatchInfo();
initBatchMessage.name = data.name; initBatchMessage.name = rule.name;
this.batchDelectionInfos.push(initBatchMessage); this.batchDelectionInfos.push(initBatchMessage);
});
let deletionMessage = new ConfirmationMessage( let deletionMessage = new ConfirmationMessage(
'REPLICATION.DELETION_TITLE', 'REPLICATION.DELETION_TITLE',
'REPLICATION.DELETION_SUMMARY', 'REPLICATION.DELETION_SUMMARY',
nameArr.join(',') || '', rule.name,
rules, rule,
ConfirmationTargets.POLICY, ConfirmationTargets.POLICY,
ConfirmationButtons.DELETE_CANCEL); ConfirmationButtons.DELETE_CANCEL);
this.deletionConfirmDialog.open(deletionMessage); this.deletionConfirmDialog.open(deletionMessage);
} }
} }
deleteOpe(rules: ReplicationRule[]) { deleteOpe(rule: ReplicationRule) {
if (rules && rules.length) { if (rule) {
let promiseLists: any[] = []; let promiseLists: any[] = [];
let promiseJobLists: any[] = []; Promise.all([this.jobList(rule.id)]).then(items => {
rules.forEach(rule => { if (!this.canDeleteRule) {
promiseJobLists.push(this.jobList(rule.id)); let findedList = this.batchDelectionInfos.find(data => data.name === rule.name);
})
Promise.all(promiseJobLists).then(items => {
this.canDeleteRuleList.forEach((item, index) => {
if (!item) {
let findedList = this.batchDelectionInfos.find(data => data.name === rules[index].name);
Observable.forkJoin(this.translateService.get('BATCH.DELETED_FAILURE'), Observable.forkJoin(this.translateService.get('BATCH.DELETED_FAILURE'),
this.translateService.get('REPLICATION.DELETION_SUMMARY_FAILURE')).subscribe(res => { this.translateService.get('REPLICATION.DELETION_SUMMARY_FAILURE')).subscribe(res => {
findedList = BathInfoChanges(findedList, res[0], false, true, res[1]); findedList = BathInfoChanges(findedList, res[0], false, true, res[1]);
}); });
} else { } else {
promiseLists.push(this.delOperate(+rules[index].id, rules[index].name)); promiseLists.push(this.delOperate(+rule.id, rule.name));
} }
});
Promise.all(promiseLists).then(item => { Promise.all(promiseLists).then(item => {
this.selectedRow = []; this.selectedRow = null;
this.reload.emit(true); this.reload.emit(true);
let hnd = setInterval(() => this.ref.markForCheck(), 200); let hnd = setInterval(() => this.ref.markForCheck(), 200);
setTimeout(() => clearInterval(hnd), 2000); setTimeout(() => clearInterval(hnd), 2000);

4
src/ui_ng/lib/src/replication/replication.component.html.ts
View File

@ -11,9 +11,9 @@ export const REPLICATION_TEMPLATE: string = `
</div> </div>
</div> </div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<hbr-list-replication-rule #listReplicationRule [readonly]="readonly" [projectId]="projectId" [isSystemAdmin]="isSystemAdmin" (replicateManual)=replicateManualRule($event) (hasJobs)="hasJobList($event)" (selectOne)="selectOneRule($event)" (openNewRule)="openModal()" (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" [isSystemAdmin]="isSystemAdmin" (replicateManual)=replicateManualRule($event) (selectOne)="selectOneRule($event)" (openNewRule)="openModal()" (editOne)="openEditRule($event)" (reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
</div> </div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" [hidden]="!hasJobs" style="padding-left:0px;"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="padding-left:0px;">
<div *ngIf="withReplicationJob" class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <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;"> <div class="row flex-items-xs-between" style="height:60px;">
<h5 class="flex-items-xs-bottom option-left-down" style="margin-left: 14px;">{{'REPLICATION.REPLICATION_JOBS' | translate}}</h5> <h5 class="flex-items-xs-bottom option-left-down" style="margin-left: 14px;">{{'REPLICATION.REPLICATION_JOBS' | translate}}</h5>

33
src/ui_ng/lib/src/replication/replication.component.ts
View File

@ -107,7 +107,6 @@ export class ReplicationComponent implements OnInit, OnDestroy {
changedRules: ReplicationRule[]; changedRules: ReplicationRule[];
initSelectedId: number | string; initSelectedId: number | string;
hasJobs: boolean;
rules: ReplicationRule[]; rules: ReplicationRule[];
loading: boolean; loading: boolean;
@ -271,21 +270,17 @@ export class ReplicationComponent implements OnInit, OnDestroy {
} }
} }
replicateManualRule(rules: ReplicationRule[]) { replicateManualRule(rule: ReplicationRule) {
if (rules && rules.length) { if (rule) {
let nameArr: string[] = [];
this.batchDelectionInfos = []; this.batchDelectionInfos = [];
rules.forEach(rule => {
nameArr.push(rule.name);
let initBatchMessage = new BatchInfo (); let initBatchMessage = new BatchInfo ();
initBatchMessage.name = rule.name; initBatchMessage.name = rule.name;
this.batchDelectionInfos.push(initBatchMessage); this.batchDelectionInfos.push(initBatchMessage);
});
let replicationMessage = new ConfirmationMessage( let replicationMessage = new ConfirmationMessage(
'REPLICATION.REPLICATION_TITLE', 'REPLICATION.REPLICATION_TITLE',
'REPLICATION.REPLICATION_SUMMARY', 'REPLICATION.REPLICATION_SUMMARY',
nameArr.join(', ') || '', rule.name,
rules, rule,
ConfirmationTargets.TARGET, ConfirmationTargets.TARGET,
ConfirmationButtons.REPLICATE_CANCEL); ConfirmationButtons.REPLICATE_CANCEL);
this.replicationConfirmDialog.open(replicationMessage); this.replicationConfirmDialog.open(replicationMessage);
@ -296,15 +291,11 @@ export class ReplicationComponent implements OnInit, OnDestroy {
if (message && if (message &&
message.source === ConfirmationTargets.TARGET && message.source === ConfirmationTargets.TARGET &&
message.state === ConfirmationState.CONFIRMED) { message.state === ConfirmationState.CONFIRMED) {
let rules: Endpoint[] = message.data; let rule: ReplicationRule = message.data;
if (rules && rules.length) {
let promiseLists: any[] = []; if (rule) {
rules.forEach(rule => { Promise.all([this.replicationOperate(+rule.id, rule.name)]).then((item) => {
this.replicationOperate(+rule.id, rule.name); this.selectOneRule(rule);
})
Promise.all(promiseLists).then((item) => {
this.listReplicationRule.retrieveRules();
this.refreshJobs();
}); });
} }
} }
@ -384,12 +375,6 @@ export class ReplicationComponent implements OnInit, OnDestroy {
this.listReplicationRule.retrieveRules(); this.listReplicationRule.retrieveRules();
} }
hasJobList(hasJob: boolean): void {
this.hasJobs = hasJob;
if (this.hasJobs) {
this.refreshJobs();
}
}
refreshJobs() { refreshJobs() {
this.search.repoName = ""; this.search.repoName = "";

2
src/ui_ng/package.json
View File

@ -31,7 +31,7 @@
"clarity-icons": "^0.10.17", "clarity-icons": "^0.10.17",
"clarity-ui": "^0.10.17", "clarity-ui": "^0.10.17",
"core-js": "^2.4.1", "core-js": "^2.4.1",
"harbor-ui": "0.6.28", "harbor-ui": "0.6.29",
"intl": "^1.2.5", "intl": "^1.2.5",
"mutationobserver-shim": "^0.3.2", "mutationobserver-shim": "^0.3.2",
"ngx-cookie": "^1.0.0", "ngx-cookie": "^1.0.0",