MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Merge branch 'ui-refactoring' of https://gitlab.eudat.eu/dmp/OpenAIRE-EUDAT-DMP-service-pilot into ui-refactoring

This commit is contained in:
Diamantis Tziotzios 2019-03-14 17:44:50 +02:00
parent d19392fde0 8c241fd47f
commit eebe0886c4
13 changed files with 79 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts
View File

@ -1,6 +1,7 @@
import { Component, Input, OnInit } from '@angular/core';
import { FormArray, FormControl, FormGroup } from '@angular/forms';
import { FieldEditorModel } from '../../../admin/field-editor-model';
import { FieldSetEditorModel } from '../../../admin/field-set-editor-model';
@Component({
selector: 'app-dataset-profile-editor-composite-field-component',
@ -35,6 +36,10 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit {
}
(this.form.get('fields') as FormArray).controls.splice(1);
}
if ((<FormArray>this.form.get('fields')).length === 0) {
const field: FieldEditorModel = new FieldEditorModel();
(<FormArray>this.form.get('fields')).push(field.buildForm());
}
}
onIsMultiplicityEnabledChange(isMultiplicityEnabled: boolean) {

2
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html
View File

@ -22,7 +22,7 @@
<input matInput type="number" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.ORDER' | translate}}"
formControlName="ordinal">
</mat-form-field>
<mat-form-field class="col-md-3">
<mat-form-field class="col-md-12">
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.DESCRIPTION' | translate}}"
formControlName="description">
</mat-form-field>

7
dmp-frontend/src/app/ui/dataset-create-wizard/dmp-selector/dataset-dmp-selector.model.ts
View File

@ -1,7 +0,0 @@
import { DmpModel } from "../../../core/model/dmp/dmp";
import { DatasetProfileModel } from "../../../core/model/dataset/dataset-profile";
export class DatasetDmpSelectorModel{
label?: string;
status?: number;
}

10
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.html
View File

@ -18,18 +18,18 @@
</div> -->
</div>
<div *ngIf="this.datasetProfileDefinitionModel || this.datasetWizardModel?.datasetProfileDefinition">
<button mat-raised-button color="primary" *ngIf="!isNew && !viewOnly" style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;"
<button mat-raised-button color="primary" *ngIf="!isNew && !viewOnly" class="deleteButton"
(click)="openConfirm(formGroup.get('label').value, formGroup.get('id').value)" type="button">{{
'DATASET-WIZARD.ACTIONS.DELETE' | translate }}</button>
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status != 1 && !viewOnly"
style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" (click)="save();" type="button">{{
class="saveButton" (click)="save();" type="button">{{
'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status != 1 && !viewOnly" [disabled]="!formGroup.valid"
style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" (click)="saveFinalize();" type="button">{{
class="saveAndFinalizeButton" (click)="saveFinalize();" type="button">{{
'DATASET-WIZARD.ACTIONS.SAVE-AND-FINALISE' | translate }}</button>
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status == 1" style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;"
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status == 1" class="downloadPDF"
(click)="downloadPDF();" type="button">{{ 'DATASET-WIZARD.ACTIONS.DOWNLOAD-PDF' | translate }}</button>
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status == 1" style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;"
<button mat-raised-button color="primary" *ngIf="datasetWizardModel&&datasetWizardModel?.status == 1" class="downloadXML"
(click)="downloadXML();" type="button">{{ 'DATASET-WIZARD.ACTIONS.DOWNLOAD-XML' | translate }}</button>
<div class="fill-space"></div>
</div>

25
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.scss
View File

@ -11,4 +11,29 @@
.description-action-row {
margin-top: 1em;
}
.deleteButton {
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}
.saveButton {
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}
.saveAndFinalizeButton {
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}
.downloadPDF {
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}
.downloadXML {
margin-top: 15px;
margin-bottom: 15px;
margin-right: 15px;
}
}

12
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-field/form-composite-field.component.html
View File

@ -36,10 +36,10 @@
{{form.get('title').value}}</h5>
<mat-icon class="col-auto" *ngIf="this.form.get('additionalInformation').value && !isChild"
matTooltip="{{this.form.get('additionalInformation').value}}">info</mat-icon>
<h5 *ngIf="form.get('description').value && !isChild" class="col-12">{{form.get('description').value}}</h5>
<h5 *ngIf="form.get('extendedDescription').value && !isChild" class="col-12">
<i>{{form.get('extendedDescription').value}}</i></h5>
<h6 *ngIf="form.get('description').value && !isChild" class="col-12">{{form.get('description').value}}</h6>
<h6 *ngIf="form.get('extendedDescription').value && !isChild" class="col-12">
<i>{{form.get('extendedDescription').value}}</i></h6>
<div *ngFor="let fieldFormGroup of form.get('fields')['controls']; let i = index;" class="col-12">
<!-- <div class="row">
<div class="col-12" *ngIf="(fieldFormGroup.get('multiplicity')?.value?.max - 1) > (fieldFormGroup.get('multiplicityItems')?.length)">
@ -56,9 +56,9 @@
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</div>
</div>-->
</div>
</div>
</div>
</div>
</div>

14
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html
View File

@ -14,14 +14,10 @@
<!-- *ngIf="this.visibilityRulesService.checkElementVisibility(compositeFieldFormGroup.get('id').value)" -->
<div class="row" *ngIf="this.visibilityRulesService.checkElementVisibility(compositeFieldFormGroup.get('id').value) && this.visibilityRulesService.scanIfChildsOfCompositeFieldHasVisibleItems(compositeFieldFormGroup)">
<div *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)"
class="col-12">
<button mat-button color="primary" (click)="addMultipleField(i)" [disabled]="compositeFieldFormGroup.disabled">
{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' | translate}}
</button>
</div>
<app-form-composite-field class="align-self-center col-12" [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId"
[isChild]="false"></app-form-composite-field>
<div *ngIf="compositeFieldFormGroup" class="col-12">
<div class="row">
<div class="col-12" *ngFor="let multipleCompositeFieldFormGroup of compositeFieldFormGroup.get('multiplicityItems')['controls']; let j = index">
@ -35,6 +31,12 @@
</div>
</div>
</div>
<div *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)"
class="col-12 addOneFieldButton">
<button mat-icon-button color="primary" (click)="addMultipleField(i)" [disabled]="compositeFieldFormGroup.disabled" matTooltip="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' | translate}}">
<mat-icon>add_circle</mat-icon>
</button>
</div>
<mat-form-field *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="col-12" [formGroup]="compositeFieldFormGroup">
<input matInput formControlName="commentFieldValue" placeholder="comment">
</mat-form-field>

5
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.scss
View File

@ -2,6 +2,10 @@
.expansion-panel {
margin-bottom: 1em;
}
.addOneFieldButton {
margin-top: -15px;
margin-left: -11px;
}
}
.styleBorder{
border: 0.2em solid lightgray;
@ -12,3 +16,4 @@
padding-bottom: 18px;
color: black;
}

6
dmp-frontend/src/app/ui/quick-wizard/dataset-editor/dataset-editor-wizard.component.html
View File

@ -4,10 +4,10 @@
</div>
<div class="col-auto">
<mat-button-toggle-group [ngModel]="_inputValue">
<mat-button-toggle value="list" (change)="onValChange($event.value)">
<mat-button-toggle value="list" (change)="onValChange($event.value)" matTooltip="Dataset List">
<mat-icon>format_align_left</mat-icon>
</mat-button-toggle>
<mat-button-toggle value="add" (change)="onValChange($event.value)">
<mat-button-toggle value="add" (change)="onValChange($event.value)" matTooltip="Add Dataset">
<mat-icon>add</mat-icon>
</mat-button-toggle>
</mat-button-toggle-group>
@ -45,7 +45,7 @@
<mat-form-field class="col-md-12">
<input matInput placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.DATASET-LABEL' | translate}}" type="string" name="datasetLabel" [formControl]="this.formGroup.get('datasets').get('datasetsList')['controls'][lastIndexOfDataset].get('datasetLabel')" required>
</mat-form-field>
<app-dataset-description-form class="col-12" [form]="this.formGroup.get('datasets').get('datasetsList')['controls'][lastIndexOfDataset]" [visibilityRules]="this.datasetProfileDefinition.rules" [datasetProfileId]="datasetProfile.value">
<app-dataset-description-form class="col-12" [form]="this.formGroup.get('datasets').get('datasetsList')['controls'][lastIndexOfDataset]" [visibilityRules]="this.datasetProfileDefinition.rules" [datasetProfileId]="datasetProfile.value.id">
</app-dataset-description-form>
</div>
</div>

8
dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.component.html
View File

@ -59,12 +59,14 @@
<div class="navigation-buttons-container">
<button matStepperPrevious mat-raised-button
color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.BACK' | translate}}</button>
<button style="float:right;" matStepperNext mat-raised-button (click)='formSubmit()'
color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.SAVE' | translate}}</button>
<button class="saveAndFinalizeButton" matStepperNext mat-raised-button (click)='saveFinalize()' [disabled]="!formGroup.valid"
color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.SAVE-AND-FINALIZE' | translate}}</button>
<button class="saveButton" matStepperNext mat-raised-button (click)='formSubmit()'
color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.SAVE' | translate}}</button>
</div>
</ng-container>
</mat-step>
</mat-horizontal-stepper>
</div>
</form>
</div>
</div>

7
dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.component.scss
View File

@ -0,0 +1,7 @@
.saveAndFinalizeButton{
float:right;
}
.saveButton{
float:right;
margin-right: 15px;
}

22
dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.component.ts
View File

@ -15,7 +15,6 @@ import { ProjectEditorWizardModel } from '../project-editor/project-editor-wizar
import { QuickWizardEditorWizardModel } from './quick-wizard-editor.model';
@Component({
selector: 'app-quick-wizard-editor-component',
templateUrl: 'quick-wizard-editor.component.html',
@ -24,15 +23,10 @@ import { QuickWizardEditorWizardModel } from './quick-wizard-editor.model';
export class QuickWizardEditorComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
breadCrumbs: Observable<BreadcrumbItem[]> = Observable.of([]);
@ViewChild('stepper') stepper: MatStepper;
isNew = true;
quickWizard: QuickWizardEditorWizardModel
formGroup: FormGroup = null;
firstStepFormGroup: FormGroup;
secondFormGroup: FormGroup;
constructor(
public snackBar: MatSnackBar,
@ -72,13 +66,18 @@ export class QuickWizardEditorComponent extends BaseComponent implements OnInit,
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) { return; }
if (this.formGroup.get('datasets') && this.formGroup.get('datasets').get('datasetsList') && (this.formGroup.get('datasets').get('datasetsList') as FormArray).length > 0) {
this.onSubmit();
} else {
return;
}
}
}
saveFinalize() {
if (!this.isFormValid()) { return; }
this.formGroup.get('status').setValue('1');
this.onSubmit();
}
public isFormValid() {
return this.formGroup.valid;
@ -100,7 +99,6 @@ export class QuickWizardEditorComponent extends BaseComponent implements OnInit,
}
onSubmit(): void {
if (!this.isFormValid()) { return; }
this.quickWizardService.createQuickWizard(this.formGroup.getRawValue())
.pipe(takeUntil(this._destroyed))
.subscribe(
@ -109,7 +107,6 @@ export class QuickWizardEditorComponent extends BaseComponent implements OnInit,
);
}
onCallbackSuccess(): void {
this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
this.router.navigate(['/home']);
@ -148,9 +145,4 @@ export class QuickWizardEditorComponent extends BaseComponent implements OnInit,
return this.formGroup.get('project').get('label').value;
}
}
}

3
dmp-frontend/src/assets/i18n/en.json
View File

@ -98,7 +98,7 @@
"ADDITIONAL-INFORMATION":"Additional Information",
"MULTIPLICITY-MIN": "Multiplicity Min",
"MULTIPLICITY-MAX": "Multiplicity Max",
"MULTIPLICITY-ADD-ONE-FIELD": "Add one more fieldset +",
"MULTIPLICITY-ADD-ONE-FIELD": "Add one more fieldset",
"ORDER": "Order"
},
"ACTIONS": {
@ -680,6 +680,7 @@
"ACTIONS": {
"DELETE": "Delete",
"SAVE": "Save",
"SAVE-AND-FINALIZE":"Save and Finalize",
"NEXT": "Next",
"BACK": "Back",
"CREATE-NEW":"Create new project",