canRemoveItem logic added to multiple auto complete and Teamplates control @ DmpEditor
This commit is contained in:
parent
efe6a9616f
commit
a7c49ca4af
|
@ -4,14 +4,14 @@
|
|||
<div class="col-12">
|
||||
<mat-chip-grid #chipList ngDefaultControl class="chip-list">
|
||||
<ng-container *ngIf="value as values;">
|
||||
<mat-chip-row *ngFor="let value of values" [disabled]="disabled" [selectable]="selectable" [removable]="true" [ngClass]="computeClass(value)" class="chip-row">
|
||||
<mat-chip-row *ngFor="let value of values" [disabled]="disabled" [selectable]="selectable" [removable]="true" [ngClass]="computeClass(value)" class="chip-row" [matTooltip]="_canRemoveItemMessage(getSelectedItem(value)) | translate" >
|
||||
<ng-container *ngIf="getSelectedItem(value) as selectedItem;">
|
||||
<ng-template #cellTemplate *ngIf="_selectedValueTemplate(selectedItem)" [ngTemplateOutlet]="_selectedValueTemplate(selectedItem)" [ngTemplateOutletContext]="{
|
||||
item: selectedItem
|
||||
}" />
|
||||
<span *ngIf="!_selectedValueTemplate(selectedItem)" class="chip-text" [title]="_displayFn(selectedItem)">{{_displayFn(selectedItem)}}</span>
|
||||
</ng-container>
|
||||
<button matChipRemove *ngIf="!disabled" [disabled]="!_canRemoveItem(getSelectedItem(value))"[matTooltipDisabled]="_canRemoveItem(getSelectedItem(value))" [matTooltip]="_canRemoveItemMessage(getSelectedItem(value))" (click)="_removeSelectedItem(getSelectedItem(value), $event)">
|
||||
<button matChipRemove *ngIf="!disabled && _canRemoveItem(getSelectedItem(value))" (click)="_removeSelectedItem(getSelectedItem(value), $event)">
|
||||
<mat-icon>cancel</mat-icon>
|
||||
</button>
|
||||
</mat-chip-row>
|
||||
|
|
|
@ -435,16 +435,16 @@ export class MultipleAutoCompleteComponent extends _CustomComponentMixinBase imp
|
|||
}
|
||||
|
||||
_canRemoveItem(item: any): boolean {
|
||||
if(this.configuration.canRemoveItem != null) {
|
||||
return this.configuration.canRemoveItem(item).canRemove;
|
||||
if(item != null && this.configuration.canRemoveItem != null) {
|
||||
return this.configuration.canRemoveItem(item)?.canRemove;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
_canRemoveItemMessage(item: any): string {
|
||||
if(this.configuration.canRemoveItem != null) {
|
||||
if(item != null && this.configuration.canRemoveItem != null) {
|
||||
const canRemoveResuslt = this.configuration.canRemoveItem(item);
|
||||
if (canRemoveResuslt.canRemove) return canRemoveResuslt.message;
|
||||
if (!canRemoveResuslt?.canRemove) return canRemoveResuslt.message;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
@ -492,3 +492,8 @@ export class MultipleAutoCompleteComponent extends _CustomComponentMixinBase imp
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
export interface MultipleAutoCompleteCanRemoveItem {
|
||||
canRemove: boolean;
|
||||
message: string;
|
||||
}
|
||||
|
|
|
@ -299,8 +299,7 @@
|
|||
<div class="heading">{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES' | translate}}</div>
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}</mat-label>
|
||||
<!-- <app-multiple-auto-complete placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}" [hidePlaceholder]="true" required='true' [formControl]="formGroup.get('descriptionTemplates').get(section.id)" [configuration]="getDescriptionTemplateMultipleAutoCompleteConfiguration(section.id)" (optionActionClicked)="onPreviewDescriptionTemplate($event, section.id)"> -->
|
||||
<app-multiple-auto-complete placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}" [hidePlaceholder]="true" required='true' [formControl]="formGroup.get('descriptionTemplates').get(section.id)" [configuration]="descriptionTemplateService.descriptionTempalteGroupMultipleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, section.id)" (optionRemoved)="onRemoveDescriptionTemplate($event, section.id)">
|
||||
<app-multiple-auto-complete placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}" [hidePlaceholder]="true" required='true' [formControl]="formGroup.get('descriptionTemplates').get(section.id)" [configuration]="getDescriptionTemplateMultipleAutoCompleteConfiguration(section.id)" (optionActionClicked)="onPreviewDescriptionTemplate($event, section.id)" (optionRemoved)="onRemoveDescriptionTemplate($event, section.id)">
|
||||
</app-multiple-auto-complete>
|
||||
<mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('backendError')">{{formGroup.get('descriptionTemplates').get(section.id).getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
|
||||
import { DatePipe } from '@angular/common';
|
||||
import { Component, EventEmitter, OnInit } from '@angular/core';
|
||||
import { FormArray, UntypedFormArray, UntypedFormGroup } from '@angular/forms';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { FormArray, UntypedFormGroup } from '@angular/forms';
|
||||
import { MatDialog } from '@angular/material/dialog';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { DescriptionStatus } from '@app/core/common/enum/description-status';
|
||||
|
@ -17,6 +17,7 @@ import { DmpUserType } from '@app/core/common/enum/dmp-user-type';
|
|||
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
||||
import { LockTargetType } from '@app/core/common/enum/lock-target-type';
|
||||
import { AppPermission } from '@app/core/common/enum/permission.enum';
|
||||
import { DescriptionTemplate } from '@app/core/model/description-template/description-template';
|
||||
import { DescriptionSectionPermissionResolver } from '@app/core/model/description/description';
|
||||
import { DmpBlueprint, DmpBlueprintDefinitionSection } from '@app/core/model/dmp-blueprint/dmp-blueprint';
|
||||
import { Dmp, DmpPersist } from '@app/core/model/dmp/dmp';
|
||||
|
@ -35,9 +36,10 @@ import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/serv
|
|||
import { UserService } from '@app/core/services/user/user.service';
|
||||
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
||||
import { QueryParamsService } from '@app/core/services/utilities/query-params.service';
|
||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||
import { MultipleAutoCompleteCanRemoveItem } from '@app/library/auto-complete/multiple/multiple-auto-complete.component';
|
||||
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
|
||||
import { PopupNotificationDialogComponent } from '@app/library/notification/popup/popup-notification.component';
|
||||
import { isNullOrUndefined } from '@app/utilities/enhancers/utils';
|
||||
import { DescriptionTemplatePreviewDialogComponent } from '@app/ui/admin/description-template/description-template-preview/description-template-preview-dialog.component';
|
||||
import { BaseEditor } from '@common/base/base-editor';
|
||||
import { FormService } from '@common/forms/form-service';
|
||||
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
|
||||
|
@ -45,14 +47,10 @@ import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/
|
|||
import { FilterService } from '@common/modules/text-filter/filter-service';
|
||||
import { Guid } from '@common/types/guid';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { Observable, interval, of } from 'rxjs';
|
||||
import { map, takeUntil } from 'rxjs/operators';
|
||||
import { DmpEditorModel, DmpFieldIndicator } from './dmp-editor.model';
|
||||
import { DmpEditorResolver } from './dmp-editor.resolver';
|
||||
import { DmpEditorService } from './dmp-editor.service';
|
||||
import { DescriptionTemplatePreviewDialogComponent } from '@app/ui/admin/description-template/description-template-preview/description-template-preview-dialog.component';
|
||||
import { DescriptionTemplate } from '@app/core/model/description-template/description-template';
|
||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-editor',
|
||||
|
@ -402,8 +400,8 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
|
|||
if (formControlBySection == null || this.formGroup == null) return false;
|
||||
|
||||
for (let controlName of formControlBySection.fieldControlNames) {
|
||||
if (this.isFormControlValid(controlName) === false ) {
|
||||
return true;
|
||||
if (this.isFormControlValid(controlName) === false) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -413,7 +411,7 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
|
|||
isFormControlValid(controlName: string): boolean {
|
||||
if (!this.formGroup?.get(controlName)) return true;
|
||||
if (!this.formGroup.get(controlName).touched) return true;
|
||||
|
||||
|
||||
return this.formGroup.get(controlName).valid;
|
||||
}
|
||||
|
||||
|
@ -614,43 +612,47 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
|
|||
});
|
||||
}
|
||||
|
||||
onRemoveDescriptionTemplate(event, sectionId: Guid){
|
||||
onRemoveDescriptionTemplate(event, sectionId: Guid) {
|
||||
let foundDescription = false;
|
||||
const descriptionsInSection = this.descriptionsInSection(sectionId);
|
||||
let descriptionTemplatesInSection = this.formGroup.get('descriptionTemplates').get(sectionId.toString()).value as Guid[];
|
||||
|
||||
if (descriptionsInSection && descriptionsInSection.length > 0){
|
||||
if (descriptionsInSection && descriptionsInSection.length > 0) {
|
||||
for (let index = 0; index < descriptionsInSection.length; index++) {
|
||||
const description = descriptionsInSection[index];
|
||||
if(description.dmpDescriptionTemplate?.descriptionTemplateGroupId === event.groupId) {
|
||||
if (description.dmpDescriptionTemplate?.descriptionTemplateGroupId === event.groupId) {
|
||||
foundDescription = true;
|
||||
this.uiNotificationService.snackBarNotification(this.language.instant('DMP-EDITOR.UNSUCCESSFUL-REMOVE-TEMPLATE'), SnackBarNotificationLevel.Error);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(foundDescription) {
|
||||
if (foundDescription) {
|
||||
if (descriptionTemplatesInSection) this.formGroup.get('descriptionTemplates').get(sectionId.toString()).patchValue(descriptionTemplatesInSection);
|
||||
else this.formGroup.get('descriptionTemplates').get(sectionId.toString()).patchValue([]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
canRemoveDescriptionTemplate(item: DescriptionTemplate, sectionId){
|
||||
if(item){
|
||||
canRemoveDescriptionTemplate(item: DescriptionTemplate, sectionId): MultipleAutoCompleteCanRemoveItem {
|
||||
if (item) {
|
||||
const descriptionsInSection = this.descriptionsInSection(sectionId);
|
||||
|
||||
if (descriptionsInSection && descriptionsInSection.length > 0){
|
||||
if (descriptionsInSection && descriptionsInSection.length > 0) {
|
||||
for (let index = 0; index < descriptionsInSection.length; index++) {
|
||||
const description = descriptionsInSection[index];
|
||||
if(description.dmpDescriptionTemplate?.descriptionTemplateGroupId === item.groupId) {
|
||||
return {canRemove: false,
|
||||
if (description.dmpDescriptionTemplate?.descriptionTemplateGroupId === item.groupId) {
|
||||
return {
|
||||
canRemove: false,
|
||||
message: 'DMP-EDITOR.UNSUCCESSFUL-REMOVE-TEMPLATE'
|
||||
} as CanRemoveDescriptionTemplate
|
||||
}
|
||||
} as MultipleAutoCompleteCanRemoveItem
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return {
|
||||
canRemove: true,
|
||||
} as MultipleAutoCompleteCanRemoveItem;
|
||||
}
|
||||
|
||||
//
|
||||
|
@ -666,8 +668,3 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
|
|||
return this.languageInfoService.getLanguageInfoValues();
|
||||
}
|
||||
}
|
||||
|
||||
export interface CanRemoveDescriptionTemplate {
|
||||
canRemove: boolean;
|
||||
message: string;
|
||||
}
|
||||
|
|
|
@ -1453,7 +1453,7 @@
|
|||
"DESCRIPTION": "Description",
|
||||
"NO-TEMPLATE-MESSAGE": "If you can't find a template or if you want to create a personalized template for your institution, research community or training needs, please contact us.",
|
||||
"DESCRIPTION-TEMPLATES-MAX-MULTIPLICITY": "Description Templates has reached the maximun multiplicity",
|
||||
"UNSUCCESSFUL-REMOVE-TEMPLATE": "Failed to remove template, one or more Descriptions of this Plan use this template",
|
||||
"UNSUCCESSFUL-REMOVE-TEMPLATE": "Cannot remove template, because it's already being used by one or more Descriptions.",
|
||||
"FIELDS": {
|
||||
"TITLE": "Title of Plan",
|
||||
"DESCRIPTION": "Description",
|
||||
|
|
Loading…
Reference in New Issue