argos/dmp-frontend/src/app/ui/quick-wizard/dmp-editor/dmp-editor-wizard.component.html

<div class="dmp-editor">
	<div>
		<mat-card-title *ngIf="isNew">
			{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.NEW-TITLE' | translate}}</mat-card-title>
		<mat-card-title *ngIf="!isNew">
			<h3>{{formGroup?.get('label')?.value}} </h3>
		</mat-card-title>
	</div>
	<form *ngIf="formGroup" (ngSubmit)="formSubmit()" [formGroup]="formGroup">
		<mat-card>
			<mat-card-content>
				<div class="row">
					<p class="col-md-12">
						<b>{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.ABOUT' | translate}}</b></p>
					<mat-form-field class="col-md-12 mt-3">
						<input matInput
							placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.NAME' | translate}}"
							type="text" name="label" formControlName="label" required>
						<mat-error *ngIf="formGroup.get('label').hasError('backendError')">
							{{formGroup.get('label').getError('backendError').message}}</mat-error>
						<mat-error *ngIf="formGroup.get('label').hasError('required')">
							{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
					</mat-form-field>
					<mat-form-field class="col-md-12">
						<textarea matInput class="description-area"
							placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.DESCRIPTION' | translate}}"
							formControlName="description"></textarea>
						<mat-hint>
							{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.DESCRIPTION-HINT' | translate}}
						</mat-hint>
					</mat-form-field>
					<mat-form-field class="col-12 mt-3">
						<app-single-auto-complete [required]='true' [formControl]="formGroup.get('datasetProfile')"
							placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE' | translate}}"
							[configuration]="profilesAutoCompleteConfiguration" [disabled]="datasetIsEmpty()">
							<!--Warning disabled attribute with a reactive form directive -->
						</app-single-auto-complete>
						<mat-hint>
							{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.PROFILE-HINT' | translate}}
						</mat-hint>
						<mat-error *ngIf="formGroup.get('datasetProfile').hasError('backendError')">
							{{formGroup.get('datasetProfile').getError('backendError').message}}</mat-error>
						<mat-error *ngIf="formGroup.get('datasetProfile').hasError('required')">
							{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
					</mat-form-field>
					<div class="col-md-12 help">
						{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.HELP' | translate}}
					</div>
					<!-- <mat-form-field class="col-md-6">
                        <app-single-auto-complete [required]='false' [formControl]="formGroup.get('profile')"
                            placeholder="{{'DMP-EDITOR.FIELDS.PROFILE' | translate}}"
                            [configuration]="dmpProfileAutoCompleteConfiguration">
                        </app-single-auto-complete>
                    </mat-form-field>
                     <div class="col-md-12">
                        <div class="row">
                            <div class="col-auto"><button mat-raised-button color="primary" (click)="cancel()"
                                    type="button">{{'DMP-EDITOR.ACTIONS.CANCEL'
                                        | translate}}</button></div>
                            <div class="col"></div>
                            <div class="col-auto" *ngIf="!isNew && this.formGroup.enabled"><button mat-raised-button
                                    color="primary" type="button"
                                    (click)="delete()">{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}</button></div>
                            <div class="col-auto" *ngIf="this.formGroup.enabled"><button mat-raised-button
                                    color="primary" type="submit">{{'DMP-EDITOR.ACTIONS.SAVE'
                                        | translate}}</button></div>
                            <div class="col-auto" *ngIf="dmp.lockable && this.formGroup.enabled"><button type="button"
                                    mat-raised-button color="primary"
                                    (click)="saveAndFinalize()">{{'DMP-EDITOR.ACTIONS.FINALISE' | translate}}</button>
                            </div>
                        </div>
                    </div> -->
				</div>
				<!-- <div class="row">

				</div> -->
			</mat-card-content>
		</mat-card>
	</form>
</div>