Fixes warning "using the disabled attribute with a reactive form directive" on /dataset-profiles

This commit is contained in:
apapachristou 2019-10-16 17:45:08 +03:00
parent 3e02a39c52
commit 52cfc6cde6
5 changed files with 12 additions and 3 deletions

View File

@ -4,7 +4,7 @@
<mat-checkbox class="col-auto" [(ngModel)]="isComposite" (ngModelChange)="onIsCompositeChange(isComposite)" [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMPOSITE-CHECKBOX' | translate}}</mat-checkbox> <mat-checkbox class="col-auto" [(ngModel)]="isComposite" (ngModelChange)="onIsCompositeChange(isComposite)" [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMPOSITE-CHECKBOX' | translate}}</mat-checkbox>
<mat-checkbox class="col-auto" [(ngModel)]="isMultiplicityEnabled" (ngModelChange)="onIsMultiplicityEnabledChange(isMultiplicityEnabled)" <mat-checkbox class="col-auto" [(ngModel)]="isMultiplicityEnabled" (ngModelChange)="onIsMultiplicityEnabledChange(isMultiplicityEnabled)"
[disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-CHECKBOX' | translate}}</mat-checkbox> [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-CHECKBOX' | translate}}</mat-checkbox>
<mat-checkbox class="col" [formControl]="this.form.get('hasCommentField')" [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-CHECKBOX' | translate}}</mat-checkbox> <mat-checkbox class="col" [formControl]="this.form.get('hasCommentField')">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-CHECKBOX' | translate}}</mat-checkbox>
</div> </div>
<div class="row"> <div class="row">
<mat-form-field *ngIf="isComposite" class="col"> <mat-form-field *ngIf="isComposite" class="col">

View File

@ -26,6 +26,10 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit {
} }
} }
this.isComposite = (this.form.get('fields') as FormArray).length > 1; this.isComposite = (this.form.get('fields') as FormArray).length > 1;
if (this.viewOnly) {
this.form.get('hasCommentField').disable();
}
} }
onIsCompositeChange(isComposite: boolean) { onIsCompositeChange(isComposite: boolean) {

View File

@ -9,17 +9,20 @@
<span *ngIf="isNewVersion">{{'DATASET-PROFILE-EDITOR.TITLE.NEW-PROFILE-VERSION' | translate}}</span> <span *ngIf="isNewVersion">{{'DATASET-PROFILE-EDITOR.TITLE.NEW-PROFILE-VERSION' | translate}}</span>
{{form.get('label').value}} {{form.get('label').value}}
</h3> </h3>
<h3 *ngIf="!isNew">{{form.get('label').value}}</h3> <h3 *ngIf="!isNew">{{form.get('label').value}}</h3>
<mat-form-field class="full-width"> <mat-form-field class="full-width">
<input matInput formControlName="label" [disabled]="newVersionId" placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-TITLE' | translate}}" required> <input matInput formControlName="label" placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-TITLE' | translate}}" required>
<mat-error *ngIf="form.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}} <mat-error *ngIf="form.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error> </mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="full-width">
<input matInput formControlName="description" [disabled]="newVersionId" placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-DESCRIPTION' | translate}}" required> <input matInput formControlName="description" placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-DESCRIPTION' | translate}}" required>
<mat-error *ngIf="form.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}} <mat-error *ngIf="form.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error> </mat-error>
</mat-form-field> </mat-form-field>
<div class="d-flex justify-content-end pb-3" *ngIf="form.get('status').value==1"> <div class="d-flex justify-content-end pb-3" *ngIf="form.get('status').value==1">
<button mat-raised-button color="primary" (click)="downloadXML();" type="button">{{ 'DATASET-WIZARD.ACTIONS.DOWNLOAD-XML' | translate }}</button> <button mat-raised-button color="primary" (click)="downloadXML();" type="button">{{ 'DATASET-WIZARD.ACTIONS.DOWNLOAD-XML' | translate }}</button>
</div> </div>

View File

@ -126,6 +126,7 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
this.form = this.dataModel.buildForm(); this.form = this.dataModel.buildForm();
this.form.get('version').setValue(this.form.get('version').value + 1); this.form.get('version').setValue(this.form.get('version').value + 1);
this.form.controls['label'].disable(); this.form.controls['label'].disable();
this.form.controls['description'].disable();
this.prepareForm(); this.prepareForm();
} catch { } catch {
this.logger.error('Could not parse MasterItem: ' + data); this.logger.error('Could not parse MasterItem: ' + data);

View File

@ -33,6 +33,7 @@
<app-single-auto-complete [required]='true' [formControl]="formGroup.get('datasetProfile')" <app-single-auto-complete [required]='true' [formControl]="formGroup.get('datasetProfile')"
placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE' | translate}}" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE' | translate}}"
[configuration]="profilesAutoCompleteConfiguration" [disabled]="datasetIsEmpty()"> [configuration]="profilesAutoCompleteConfiguration" [disabled]="datasetIsEmpty()">
<!--Warning disabled attribute with a reactive form directive -->
</app-single-auto-complete> </app-single-auto-complete>
<mat-hint> <mat-hint>
{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE-HINT' | translate}} {{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE-HINT' | translate}}