Merge branch 'dmp-refactoring' of https://code-repo.d4science.org/MaDgiK-CITE/argos into dmp-refactoring

dmp-frontend/src/app/ui/admin/description-template/editor/components/composite-field/description-template-editor-composite-field.component.html

@@ -83,9 +83,15 @@
 
 		<!-- PREVIEW -->
 
-		<div class="col-12 previewer">
+		<div class="col-12">
-			<div *ngIf="hasFocus" class="d-flex mb-3" style="justify-content: space-between;">
+			<div class="container-fluid previewer">
+				<div class="row">
+					<div class="col-12">
+						<div *ngIf="hasFocus" class="row justify-content-between mb-3">
+							<div class="col-auto">
 								<span class="previewer-text">{{'DESCRIPTION-TEMPLATE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
+							</div>
+							<div class="col-auto">
 								<span [@fadeElement]="updatedClass" *ngIf="firstField?.get('data')?.get('fieldType')?.value">
 									<ng-container *ngIf="!previewDirty">
 										{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.STATUS.PREVIEW-UPDATED' | translate}}
@@ -95,13 +101,16 @@
 									</ng-container>
 								</span>
 							</div>
-			<div [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;">
+						</div>
-				<div *ngIf="previewFieldSet && showPreview && firstField?.get('data')?.get('fieldType')?.value" class="row" [@fade-in-fast]>
+						<div [id]="'preview_container'+ form.get('id').value" class="row">
-					<div class="col">
+							<div *ngIf="previewFieldSet && showPreview && firstField?.get('data')?.get('fieldType')?.value" class="col-12" [@fade-in-fast]>
 								<app-description-form-field-set class="w-100" [propertiesFormGroup]="previewPropertiesFormGroup" [fieldSet]="previewFieldSet" [visibilityRulesService]="visibilityRulesService"></app-description-form-field-set>
 							</div>
 						</div>
 					</div>
+				</div>
+			</div>
+			
 
 			<div class="w-100" *ngIf="!firstField?.get('data')?.get('fieldType')?.value">
 				<em>

dmp-frontend/src/app/ui/admin/description-template/editor/components/field/description-template-editor-field.component.html

@@ -132,9 +132,10 @@
 			<mat-error *ngIf="form.get('schematics').hasError('backendError')">{{form.get('schematics').getError('backendError').message}}</mat-error>
 		</mat-form-field>
 
-		<mat-checkbox [formControl]="this.form.get('includeInExport')" class="col-6" [disabled]="viewOnly">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.EXPORT' | translate}}
+		<div class="col-6">
+			<mat-checkbox [formControl]="this.form.get('includeInExport')" [disabled]="viewOnly">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.EXPORT' | translate}}</mat-checkbox>
 			<mat-error *ngIf="form.get('includeInExport').hasError('backendError')">{{form.get('includeInExport').getError('backendError').message}}</mat-error>
-		</mat-checkbox>
+		</div>
 
 		<!-- Default Value -->
 		<app-description-template-editor-default-value-component *ngIf="form.get('data')?.get('fieldType')?.value" class="col-6" [fieldType]="form.get('data').get('fieldType').value" [form]="this.form.get('defaultValue')" [formArrayOptions]="form.get('data')?.get('options')" [comboBoxType]="this.form.get('data')?.get('type')?.value" [internalDmpEntitiesType]="this.form.get('data')?.get('type')?.value" [validationErrorModel]="validationErrorModel" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.DEFAULT-VALUE' | translate}}">

dmp-frontend/src/app/ui/admin/description-template/editor/components/field/description-template-editor-field.component.scss

@@ -64,3 +64,7 @@ li.list-inline-item{
     font-size: 0.8em;
   }
 }
+
+::ng-deep .mdc-label {
+  margin: 0;
+}

dmp-frontend/src/app/ui/admin/description-template/editor/components/visibility-rule/description-template-editor-visibility-rule.component.html

@@ -1,12 +1,19 @@
-<div class="row" *ngFor="let ruleFormGroup of form['controls'] let i=index;" [formGroup]="ruleFormGroup">
+<div class="row align-items-center" *ngFor="let ruleFormGroup of form['controls'] let i=index;" [formGroup]="ruleFormGroup">
-	<span class="col-auto align-self-center">{{i + 1}}</span>
+	<div class="col-auto mb-3"><span>{{i + 1}}</span></div>
 
-	<app-description-template-editor-default-value-component *ngIf="isTextType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
+	<div class="col" *ngIf="isTextType(fieldTypeForCheck)" >
-	<app-description-template-editor-default-value-component *ngIf="isDateType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('dateValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
+		<app-description-template-editor-default-value-component [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
-	<app-description-template-editor-default-value-component *ngIf="isTextListType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textListValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
+	</div>
+	<div class="col" *ngIf="isDateType(fieldTypeForCheck)">
+		<app-description-template-editor-default-value-component [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('dateValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
+	</div>
+	<div class="col"  *ngIf="isTextListType(fieldTypeForCheck)">
+		<app-description-template-editor-default-value-component [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textListValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
+	</div>
 
 	<!-- SELECTION -->
-	<mat-form-field class="col align-self-center">
+	<div class="col">
+		<mat-form-field class="w-100">
 			<mat-label>{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-THEN'| translate}}</mat-label>
 			<mat-select formControlName="target" (openedChange)="computeOptions($event)">
 				<!-- SHOW FIELDSETS -->
@@ -35,8 +42,9 @@
 			<mat-error *ngIf="ruleFormGroup.get('target').hasError('backendError')">{{ruleFormGroup.get('target').getError('backendError').message}}</mat-error>
 			<mat-error *ngIf="ruleFormGroup.get('target').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 		</mat-form-field>
+	</div>
 
-	<div class="col-auto align-self-center"><button mat-icon-button type="button" (click)="deleteRule(i);" [disabled]="viewOnly">
+	<div class="col-auto mb-4"><button mat-icon-button type="button" (click)="deleteRule(i);" [disabled]="viewOnly">
 			<mat-icon>delete</mat-icon>
 		</button>
 	</div>

dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html

@@ -1,3 +1,4 @@
+<div class="container p-0">
 	<div *ngIf="fieldSet" class="dynamic-form-composite-field row">
 		<div *ngIf="showTitle" class="col-12">
 			<div class="row">
@@ -15,12 +16,12 @@
 			<div class="row" *ngFor="let fieldSetItemPropertiesControl of propertiesFormGroup?.get('items')?.controls">
 				<div class="col" *ngIf="visibilityRulesService && visibilityRulesService.isVisibleMap[fieldSet.id + '_' + fieldSetItemPropertiesControl.get('ordinal').value] ?? true">
 					<div class="row">
-					<div *ngFor="let field of fieldSet.fields; let i = index;" class="col-12 compositeField">
+						<div *ngFor="let field of fieldSet.fields; let i = index;" class="col-12">
 							<ng-container  *ngIf="visibilityRulesService && visibilityRulesService.isVisibleMap[field.id + '_' + fieldSetItemPropertiesControl.get('ordinal').value] ?? true">
 								<div class="row">
 									<h5 *ngIf="placeholderTitle" class="col-auto font-weight-bold">{{field.label}}</h5>
 								</div>
-							<app-description-form-field class="col-12 compositeField" [propertiesFormGroup]="fieldSetItemPropertiesControl.get('fields')" [field]="field" [fieldSet]="fieldSet" [visibilityRulesService]="visibilityRulesService" [datasetProfileId]="datasetProfileId" [isChild]="true"></app-description-form-field>
+								<app-description-form-field class="col-12" [propertiesFormGroup]="fieldSetItemPropertiesControl.get('fields')" [field]="field" [fieldSet]="fieldSet" [visibilityRulesService]="visibilityRulesService" [datasetProfileId]="datasetProfileId" [isChild]="true"></app-description-form-field>
 							</ng-container>
 						</div>
 					</div>
@@ -85,3 +86,4 @@
 			<rich-text-editor-component [form]="propertiesFormGroup?.get('items')?.at(0)?.get('comment')" [id]="'editor1'" [placeholder]="'DESCRIPTION-EDITOR.FIELDS.COMMENT-PLACEHOLDER' | translate" [wrapperClasses]="'mb-2'" [editable]="!propertiesFormGroup?.get('items')?.at(0)?.get('comment').disabled"></rich-text-editor-component>
 		</div>
 	</div>
+</div>