added toggle discriptions mechanism on dmp-clone and dmp-new-version dialogs
This commit is contained in:
parent
16fcd26c04
commit
1df3e3cd2b
|
@ -36,6 +36,9 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12" *ngIf="hasDescriptions()">
|
<div class="col-12" *ngIf="hasDescriptions()">
|
||||||
<mat-card class="mat-card">
|
<mat-card class="mat-card">
|
||||||
|
<mat-card-header>
|
||||||
|
<mat-checkbox [checked]="allDescriptionsCompleted" [indeterminate]="someDescriptionsCompleted" (change)="toggleAllDescriptions($event.checked)">{{ 'DMP-CLONE-DIALOG.ACTIONS.TOGGLE-DESCRIPTIONS' | translate }}</mat-checkbox>
|
||||||
|
</mat-card-header>
|
||||||
<mat-selection-list #selectedItems [formControl]="formGroup.get('descriptions')">
|
<mat-selection-list #selectedItems [formControl]="formGroup.get('descriptions')">
|
||||||
<mat-list-option *ngFor="let description of dmp.descriptions;" [value]="description.id">
|
<mat-list-option *ngFor="let description of dmp.descriptions;" [value]="description.id">
|
||||||
<span class="text-truncate" [matTooltip]="description.label">{{description.label}}</span>
|
<span class="text-truncate" [matTooltip]="description.label">{{description.label}}</span>
|
||||||
|
|
|
@ -57,4 +57,8 @@
|
||||||
background-color: var(--primary-color);
|
background-color: var(--primary-color);
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -32,6 +32,23 @@ export class CloneDmpDialogComponent extends BaseComponent {
|
||||||
this.dmp = data.dmp;
|
this.dmp = data.dmp;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
get allDescriptionsNo(): number{
|
||||||
|
return this.dmp.descriptions?.length ?? 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
get checkedDescrionsNo(): number {
|
||||||
|
return this.formGroup.get('descriptions')?.value?.length ?? 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
get allDescriptionsCompleted(): boolean {
|
||||||
|
return this.allDescriptionsNo === this.checkedDescrionsNo;
|
||||||
|
}
|
||||||
|
|
||||||
|
get someDescriptionsCompleted(): boolean {
|
||||||
|
return this.checkedDescrionsNo > 0 && this.checkedDescrionsNo < this.allDescriptionsNo;
|
||||||
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.editorModel = new DmpCloneDialogEditorModel().fromModel(this.data.dmp);
|
this.editorModel = new DmpCloneDialogEditorModel().fromModel(this.data.dmp);
|
||||||
this.formGroup = this.editorModel.buildForm();
|
this.formGroup = this.editorModel.buildForm();
|
||||||
|
@ -56,7 +73,14 @@ export class CloneDmpDialogComponent extends BaseComponent {
|
||||||
dmp => this.dialogRef.close(dmp),
|
dmp => this.dialogRef.close(dmp),
|
||||||
error => this.onCallbackError(error)
|
error => this.onCallbackError(error)
|
||||||
);
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleAllDescriptions(event: any) {
|
||||||
|
if (event === true) {
|
||||||
|
this.formGroup.get('descriptions')?.setValue(this.dmp.descriptions?.map(d=> d.id));
|
||||||
|
} else {
|
||||||
|
this.formGroup.get('descriptions')?.setValue([]);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
onCallbackError(error: any) {
|
onCallbackError(error: any) {
|
||||||
|
|
|
@ -48,6 +48,9 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12" *ngIf="hasDescriptions()">
|
<div class="col-12" *ngIf="hasDescriptions()">
|
||||||
<mat-card class="mat-card">
|
<mat-card class="mat-card">
|
||||||
|
<mat-card-header>
|
||||||
|
<mat-checkbox [checked]="allDescriptionsCompleted" [indeterminate]="someDescriptionsCompleted" (change)="toggleAllDescriptions($event.checked)">{{ 'DMP-NEW-VERSION-DIALOG.ACTIONS.TOGGLE-DESCRIPTIONS' | translate }}</mat-checkbox>
|
||||||
|
</mat-card-header>
|
||||||
<mat-selection-list #selectedItems [formControl]="formGroup.get('descriptions')">
|
<mat-selection-list #selectedItems [formControl]="formGroup.get('descriptions')">
|
||||||
<mat-list-option *ngFor="let description of dmp.descriptions;" [value]="description.id">
|
<mat-list-option *ngFor="let description of dmp.descriptions;" [value]="description.id">
|
||||||
<span class="text-truncate" [matTooltip]="description.label">{{description.label}}</span>
|
<span class="text-truncate" [matTooltip]="description.label">{{description.label}}</span>
|
||||||
|
|
|
@ -57,4 +57,8 @@
|
||||||
background-color: var(--primary-color);
|
background-color: var(--primary-color);
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -47,6 +47,23 @@ export class NewVersionDmpDialogComponent extends BaseComponent {
|
||||||
this.dmp = data.dmp;
|
this.dmp = data.dmp;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get allDescriptionsNo(): number{
|
||||||
|
return this.dmp.descriptions?.length ?? 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
get checkedDescrionsNo(): number {
|
||||||
|
return this.formGroup.get('descriptions')?.value?.length ?? 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
get allDescriptionsCompleted(): boolean {
|
||||||
|
return this.allDescriptionsNo === this.checkedDescrionsNo;
|
||||||
|
}
|
||||||
|
|
||||||
|
get someDescriptionsCompleted(): boolean {
|
||||||
|
return this.checkedDescrionsNo > 0 && this.checkedDescrionsNo < this.allDescriptionsNo;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.editorModel = new DmpNewVersionDialogEditorModel().fromModel(this.data.dmp);
|
this.editorModel = new DmpNewVersionDialogEditorModel().fromModel(this.data.dmp);
|
||||||
this.formGroup = this.editorModel.buildForm();
|
this.formGroup = this.editorModel.buildForm();
|
||||||
|
@ -74,6 +91,14 @@ export class NewVersionDmpDialogComponent extends BaseComponent {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleAllDescriptions(event: any) {
|
||||||
|
if (event === true) {
|
||||||
|
this.formGroup.get('descriptions')?.setValue(this.dmp.descriptions?.map(d=> d.id));
|
||||||
|
} else {
|
||||||
|
this.formGroup.get('descriptions')?.setValue([]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onCallbackError(error: any) {
|
onCallbackError(error: any) {
|
||||||
this.uiNotificationService.snackBarNotification(
|
this.uiNotificationService.snackBarNotification(
|
||||||
error.error.message ? error.error.message :
|
error.error.message ? error.error.message :
|
||||||
|
|
|
@ -1606,7 +1606,8 @@
|
||||||
"NO-DESCRIPTIONS": "Not available Descriptions for this Plan.",
|
"NO-DESCRIPTIONS": "Not available Descriptions for this Plan.",
|
||||||
"ACTIONS": {
|
"ACTIONS": {
|
||||||
"CANCEL": "Cancel",
|
"CANCEL": "Cancel",
|
||||||
"CLONE": "Clone"
|
"CLONE": "Clone",
|
||||||
|
"TOGGLE-DESCRIPTIONS": "Check/Uncheck"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"DMP-NEW-VERSION-DIALOG": {
|
"DMP-NEW-VERSION-DIALOG": {
|
||||||
|
@ -1624,7 +1625,8 @@
|
||||||
"NO-DESCRIPTIONS": "Not available Descriptions for this Plan.",
|
"NO-DESCRIPTIONS": "Not available Descriptions for this Plan.",
|
||||||
"ACTIONS": {
|
"ACTIONS": {
|
||||||
"CANCEL": "Cancel",
|
"CANCEL": "Cancel",
|
||||||
"NEW-VERSION": "Create New Version"
|
"NEW-VERSION": "Create New Version",
|
||||||
|
"TOGGLE-DESCRIPTIONS": "Check/Uncheck"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"DMP-USER-INVITATION-DIALOG": {
|
"DMP-USER-INVITATION-DIALOG": {
|
||||||
|
|
Loading…
Reference in New Issue