fixed popup style

This commit is contained in:
Diamantis Tziotzios 2018-11-29 16:19:08 +02:00
parent 89e4babf9d
commit 68559314f3
8 changed files with 109 additions and 125 deletions

View File

@ -1,23 +1,22 @@
<form *ngIf="formGroup" [formGroup]="formGroup"> <form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.TITLE' | translate}}</h1> <h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.TITLE' | translate}}</h1>
<div mat-dialog-content> <div mat-dialog-content class="row">
<mat-form-field class="full-width"> <mat-form-field class="col-4">
<input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.LABEL' | translate}}" required> <input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.LABEL' | translate}}" required>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-4">
<input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.ABBREVIATION' | translate}}" required> <input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.ABBREVIATION' | translate}}" required>
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-4">
<input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.URI' | translate}}" required> <input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.DATA-REPOSITORY.URI' | translate}}" required>
<mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div mat-dialog-actions> <div mat-dialog-actions class="row">
<div layout="row" class="full-width text-right" align="end"> <div class="col-auto"><button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button></div>
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button> <div class="col"></div>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button> <div class="col-auto"><button mat-raised-button color="primary" (click)="send()" type="button">Save</button></div>
</div> </div>
</div>
</form> </form>

View File

@ -1,20 +1,18 @@
<form *ngIf="formGroup" [formGroup]="formGroup"> <form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.TITLE' | translate}}</h1> <h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.TITLE' | translate}}</h1>
<div mat-dialog-content> <div mat-dialog-content class="row">
<mat-form-field class="full-width"> <mat-form-field class="col-md-6">
<input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.LABEL' | translate}}" required> <input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.LABEL' | translate}}" required>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-md-6">
<input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.ABBREVIATION' | translate}}" required> <input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.EXTERNAL-DATASET.ABBREVIATION' | translate}}" required>
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div>
</div> <div mat-dialog-actions class="row">
<div mat-dialog-actions> <div class="col-auto"><button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button></div>
<div layout="row" class="full-width text-right" align="end"> <div class="col"></div>
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button> <div class="col-auto"><button mat-raised-button color="primary" (click)="send()" type="button">Save</button></div>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button> </div>
</div>
</div>
</form> </form>

View File

@ -1,23 +1,22 @@
<form *ngIf="formGroup" [formGroup]="formGroup"> <form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.REGISTRY.TITLE' | translate}}</h1> <h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.REGISTRY.TITLE' | translate}}</h1>
<div mat-dialog-content> <div mat-dialog-content class="row">
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.LABEL' | translate}}" required> <input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.LABEL' | translate}}" required>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.ABBREVIATION' | translate}}" required> <input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.ABBREVIATION' | translate}}" required>
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.URI' | translate}}" required> <input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.REGISTRY.URI' | translate}}" required>
<mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div mat-dialog-actions> <div mat-dialog-actions class="row">
<div layout="row" class="full-width text-right" align="end"> <div class="col-auto"><button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button></div>
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button> <div class="col"></div>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button> <div class="col-auto"><button mat-raised-button color="primary" (click)="send()" type="button">Save</button></div>
</div> </div>
</div>
</form> </form>

View File

@ -1,24 +1,22 @@
<form *ngIf="formGroup" [formGroup]="formGroup"> <form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.SERVICES.TITLE' | translate}}</h1> <h1 mat-dialog-title>{{'DATASET-REFERENCED-MODELS.SERVICES.TITLE' | translate}}</h1>
<div mat-dialog-content> <div mat-dialog-content class="row">
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.LABEL' | translate}}" required> <input matInput formControlName="label" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.LABEL' | translate}}" required>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.ABBREVIATION' | translate}}" required> <input matInput formControlName="abbreviation" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.ABBREVIATION' | translate}}" required>
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-md-4">
<input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.URI' | translate}}" required> <input matInput formControlName="uri" placeholder="{{'DATASET-REFERENCED-MODELS.SERVICES.URI' | translate}}" required>
<mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('uri').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div>
</div> <div mat-dialog-actions class="row">
<div mat-dialog-actions> <div class="col-auto"><button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button></div>
<div layout="row" class="full-width text-right" align="end"> <div class="col"></div>
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button> <div class="col-auto"><button mat-raised-button color="primary" (click)="send()" type="button">Save</button></div>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button> </div>
</div>
</div>
</form> </form>

View File

@ -1,5 +1,5 @@
import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'; import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core';
import { FormArray, FormBuilder, FormGroup } from '@angular/forms'; import { FormArray, FormGroup } from '@angular/forms';
import { MatDialog, MatSnackBar, MatStepper } from '@angular/material'; import { MatDialog, MatSnackBar, MatStepper } from '@angular/material';
import { ActivatedRoute, Params, Router } from '@angular/router'; import { ActivatedRoute, Params, Router } from '@angular/router';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
@ -29,7 +29,6 @@ import { ServiceModel } from '../../models/services/ServiceModel';
import { TagModel } from '../../models/tags/TagModel'; import { TagModel } from '../../models/tags/TagModel';
import { DataManagementPlanService } from '../../services/data-management-plan/data-management-plan.service'; import { DataManagementPlanService } from '../../services/data-management-plan/data-management-plan.service';
import { DatasetWizardService } from '../../services/dataset-wizard/dataset-wizard.service'; import { DatasetWizardService } from '../../services/dataset-wizard/dataset-wizard.service';
import { DatasetService } from '../../services/dataset/dataset.service';
import { ExternalSourcesConfigurationService } from '../../services/external-sources/external-sources-configuration.service'; import { ExternalSourcesConfigurationService } from '../../services/external-sources/external-sources-configuration.service';
import { ExternalSourcesService } from '../../services/external-sources/external-sources.service'; import { ExternalSourcesService } from '../../services/external-sources/external-sources.service';
import { AutoCompleteConfiguration } from '../../shared/components/auto-complete/AutoCompleteConfiguration'; import { AutoCompleteConfiguration } from '../../shared/components/auto-complete/AutoCompleteConfiguration';
@ -90,8 +89,6 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
constructor( constructor(
private datasetWizardService: DatasetWizardService, private datasetWizardService: DatasetWizardService,
private formBuilder: FormBuilder,
private datasetService: DatasetService,
private route: ActivatedRoute, private route: ActivatedRoute,
public snackBar: MatSnackBar, public snackBar: MatSnackBar,
public router: Router, public router: Router,
@ -433,8 +430,6 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
addDataRepository() { addDataRepository() {
const dialogRef = this.dialog.open(DataRepositoryReferencedModelHelperComponent, { const dialogRef = this.dialog.open(DataRepositoryReferencedModelHelperComponent, {
height: '255px',
width: '700px',
data: { data: {
} }
@ -450,8 +445,6 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
addRegistry() { addRegistry() {
const dialogRef = this.dialog.open(RegistryReferencedModelHelperComponent, { const dialogRef = this.dialog.open(RegistryReferencedModelHelperComponent, {
height: '255px',
width: '700px',
data: { data: {
} }
@ -467,8 +460,6 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
addExternalDataset() { addExternalDataset() {
const dialogRef = this.dialog.open(ExternalDatasetReferencedModelHelperComponent, { const dialogRef = this.dialog.open(ExternalDatasetReferencedModelHelperComponent, {
height: '255px',
width: '700px',
data: { data: {
} }
@ -484,8 +475,6 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
addService() { addService() {
const dialogRef = this.dialog.open(ServicesReferencedModelHelperComponent, { const dialogRef = this.dialog.open(ServicesReferencedModelHelperComponent, {
height: '255px',
width: '700px',
data: { data: {
} }

View File

@ -264,8 +264,6 @@ export class DataManagementPlanEditorComponent extends BaseComponent implements
addResearcher(rowId: any, rowName: any) { addResearcher(rowId: any, rowName: any) {
const dialogRef = this.dialog.open(AddResearchersComponent, { const dialogRef = this.dialog.open(AddResearchersComponent, {
height: '255px',
width: '700px',
data: { data: {
dmpId: rowId, dmpId: rowId,
dmpName: rowName dmpName: rowName
@ -276,8 +274,8 @@ export class DataManagementPlanEditorComponent extends BaseComponent implements
availableProfiles() { availableProfiles() {
const dialogRef = this.dialog.open(AvailableProfilesComponent, { const dialogRef = this.dialog.open(AvailableProfilesComponent, {
height: '355px', // height: '355px',
width: '700px', // width: '700px',
data: { data: {
profiles: this.formGroup.get('profiles') profiles: this.formGroup.get('profiles')
} }

View File

@ -1,19 +1,20 @@
<form *ngIf="formGroup" [formGroup]="formGroup"> <form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'ADDRESEARCHERS-EDITOR.TITLE' | translate}}</h1> <h1 mat-dialog-title>{{'ADDRESEARCHERS-EDITOR.TITLE' | translate}}</h1>
<div mat-dialog-content> <div mat-dialog-content class="row">
<mat-form-field class="full-width"> <mat-form-field class="col-6">
<input matInput formControlName="firstName" placeholder="{{'ADDRESEARCHERS-EDITOR.FIRST_NAME' | translate}}" required> <input matInput formControlName="firstName" placeholder="{{'ADDRESEARCHERS-EDITOR.FIRST_NAME' | translate}}" required>
<mat-error *ngIf="formGroup.get('firstName').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('firstName').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="full-width"> <mat-form-field class="col-6">
<input matInput formControlName="lastName" placeholder="{{'ADDRESEARCHERS-EDITOR.LAST_NAME' | translate}}" required> <input matInput formControlName="lastName" placeholder="{{'ADDRESEARCHERS-EDITOR.LAST_NAME' | translate}}" required>
<mat-error *ngIf="formGroup.get('lastName').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('lastName').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> <div class="col-12">
<div mat-dialog-actions> <div class="row">
<div layout="row" class="full-width text-right" align="end"> <div class="col-auto"><button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button></div>
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button> <div class="col"></div>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button> <div class="col-auto"><button mat-raised-button color="primary" (click)="send()" type="button">Save</button></div>
</div> </div>
</div> </div>
</div>
</form> </form>

View File

@ -1,10 +1,12 @@
<mat-selection-list #datasetsprofiles [ngModel]="selectedOptions"> <h4 mat-dialog-title>Available Dataset profiles</h4>
<mat-list-option *ngFor="let profile of profiles" [value]="profile" [selected]='isOptionSelected(profile)'> <div mat-dialog-content>
{{profile.label}} <mat-selection-list #datasetsprofiles [ngModel]="selectedOptions">
</mat-list-option> <mat-list-option *ngFor="let profile of profiles" [value]="profile" [selected]='isOptionSelected(profile)'>
</mat-selection-list> {{profile.label}}
</mat-list-option>
<p> </mat-selection-list>
Dataset Profiles selected: {{datasetsprofiles.selectedOptions.selected.length}} <p>
</p> Dataset Profiles selected: {{datasetsprofiles.selectedOptions.selected.length}}
<button mat-raised-button color="primary" (click)="addProfiles(datasetsprofiles)">OK</button> </p>
<button mat-raised-button color="primary" (click)="addProfiles(datasetsprofiles)">OK</button>
</div>