mirror of
https://github.com/goharbor/harbor.git
synced 2024-11-23 10:45:45 +01:00
Supplement group ui
Signed-off-by: Yogi_Wang <yawang@vmware.com>
This commit is contained in:
parent
6dd2ae90a0
commit
069f884a7c
@ -4,50 +4,31 @@
|
|||||||
<h3 class="modal-title" *ngIf="mode !== 'create'">{{'GROUP.EDIT' | translate}}</h3>
|
<h3 class="modal-title" *ngIf="mode !== 'create'">{{'GROUP.EDIT' | translate}}</h3>
|
||||||
|
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<form class="form" #groupForm="ngForm">
|
<form class="clr-form clr-form-horizontal" #groupForm="ngForm">
|
||||||
<section class="form-block">
|
<section>
|
||||||
<div class="form-group" *ngIf="isLdapMode">
|
<clr-input-container *ngIf="isLdapMode">
|
||||||
<label for="ldap_group_dn" class="required">{{ 'GROUP.GROUP_DN' | translate}}</label>
|
<label for="ldap_group_dn" class="required">{{ 'GROUP.GROUP_DN' | translate}}</label>
|
||||||
<label for="ldap_group_dn"
|
<input clrInput type="text" id="ldap_group_dn" name="ldap_group_dn" required
|
||||||
aria-haspopup="true"
|
[disabled]="mode !== 'create'" [(ngModel)]="group.ldap_group_dn" #groupDN="ngModel" />
|
||||||
role="tooltip"
|
<clr-control-error>{{dnTooltip | translate}}</clr-control-error>
|
||||||
class="tooltip tooltip-validation tooltip-sm tooltip-right"
|
</clr-input-container>
|
||||||
[class.invalid]="isDNInvalid">
|
<div class="clr-form-control" *ngIf="isLdapMode">
|
||||||
<input type="text" id="ldap_group_dn" name="ldap_group_dn"
|
<label class="clr-control-label" for="type">{{'GROUP.TYPE' | translate}}</label>
|
||||||
required
|
<label class="padding-left-6" id="type">{{'GROUP.LDAP_TYPE' | translate}}</label>
|
||||||
[disabled]="mode !== 'create'"
|
|
||||||
[(ngModel)]="group.ldap_group_dn"
|
|
||||||
#groupDN="ngModel">
|
|
||||||
<span class="tooltip-content">
|
|
||||||
{{dnTooltip | translate}}
|
|
||||||
</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="form-group" *ngIf="isLdapMode">
|
|
||||||
<label for="type">{{'GROUP.TYPE' | translate}}</label>
|
|
||||||
<label id="type">LDAP</label>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="group_name" class="required">{{'GROUP.NAME' | translate}}</label>
|
|
||||||
<label for="group_name"
|
|
||||||
aria-haspopup="true"
|
|
||||||
role="tooltip"
|
|
||||||
class="tooltip tooltip-validation tooltip-sm tooltip-right"
|
|
||||||
[class.invalid]="isNameInvalid">
|
|
||||||
<input type="text" id="group_name" name="group_name"
|
|
||||||
required
|
|
||||||
[(ngModel)]="group.group_name"
|
|
||||||
#groupName="ngModel">
|
|
||||||
<span class="tooltip-content">
|
|
||||||
{{dnTooltip | translate}}
|
|
||||||
</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
</div>
|
||||||
|
<clr-input-container *ngIf="isLdapMode">
|
||||||
|
<label for="group_name" class="required">{{ 'GROUP.NAME' | translate}}</label>
|
||||||
|
<input clrInput type="text" id="group_name" name="group_name" required
|
||||||
|
[(ngModel)]="group.group_name" #groupName="ngModel" />
|
||||||
|
<clr-control-error>{{dnTooltip | translate}}</clr-control-error>
|
||||||
|
</clr-input-container>
|
||||||
</section>
|
</section>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-outline" (click)="close()">{{'BUTTON.CANCEL' | translate | translate}}</button>
|
<button type="button" class="btn btn-outline"
|
||||||
<button type="button" class="btn btn-primary" [disabled]="!isFormValid" (click)="save()">{{'BUTTON.SAVE' | translate | translate}}</button>
|
(click)="close()">{{'BUTTON.CANCEL' | translate | translate}}</button>
|
||||||
|
<button type="button" class="btn btn-primary" [disabled]="!isFormValid"
|
||||||
|
(click)="save()">{{'BUTTON.SAVE' | translate | translate}}</button>
|
||||||
</div>
|
</div>
|
||||||
</clr-modal>
|
</clr-modal>
|
@ -0,0 +1,3 @@
|
|||||||
|
.padding-left-6 {
|
||||||
|
padding-left: 6px;
|
||||||
|
}
|
@ -25,7 +25,7 @@ export class AddGroupModalComponent implements OnInit, OnDestroy {
|
|||||||
|
|
||||||
formChangeSubscription: Subscription;
|
formChangeSubscription: Subscription;
|
||||||
|
|
||||||
@ViewChild('groupForm', {static: false})
|
@ViewChild('groupForm', { static: true })
|
||||||
groupForm: NgForm;
|
groupForm: NgForm;
|
||||||
|
|
||||||
submitted = false;
|
submitted = false;
|
||||||
@ -55,15 +55,6 @@ export class AddGroupModalComponent implements OnInit, OnDestroy {
|
|||||||
|
|
||||||
ngOnDestroy() { }
|
ngOnDestroy() { }
|
||||||
|
|
||||||
public get isDNInvalid(): boolean {
|
|
||||||
let dnControl = this.groupForm.controls['ldap_group_dn'];
|
|
||||||
return dnControl && dnControl.invalid && (dnControl.dirty || dnControl.touched);
|
|
||||||
}
|
|
||||||
public get isNameInvalid(): boolean {
|
|
||||||
let dnControl = this.groupForm.controls['group_name'];
|
|
||||||
return dnControl && dnControl.invalid && (dnControl.dirty || dnControl.touched);
|
|
||||||
}
|
|
||||||
|
|
||||||
public get isFormValid(): boolean {
|
public get isFormValid(): boolean {
|
||||||
return this.groupForm.valid;
|
return this.groupForm.valid;
|
||||||
}
|
}
|
||||||
|
@ -41,7 +41,7 @@ export class AddGroupComponent implements OnInit {
|
|||||||
@Input() memberList: Member[] = [];
|
@Input() memberList: Member[] = [];
|
||||||
@Output() added = new EventEmitter<boolean>();
|
@Output() added = new EventEmitter<boolean>();
|
||||||
|
|
||||||
@ViewChild('groupForm', {static: false})
|
@ViewChild('groupForm', { static: false })
|
||||||
groupForm: NgForm;
|
groupForm: NgForm;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
|
Loading…
Reference in New Issue
Block a user