Makes the "Add new Dataset" button on Quick Wizard to not be seen when in edit mode.

This commit is contained in:
Diamantis Tziotzios 2019-03-26 17:52:21 +02:00
parent b76d7dd5b8
commit 0432aed3cb
2 changed files with 86 additions and 88 deletions

View File

@ -4,12 +4,12 @@
</div> </div>
<div class="col-auto"> <div class="col-auto">
<mat-button-toggle-group [ngModel]="_inputValue"> <mat-button-toggle-group [ngModel]="_inputValue">
<mat-button-toggle value="list" (change)="onValChange($event.value)" matTooltip="Dataset List"> <mat-button-toggle value="add" *ngIf="listingMode()" (change)="onValChange($event.value)" matTooltip="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.ADD-BUTTON-TOOLTIP' | translate}}">
<mat-icon>format_align_left</mat-icon>
</mat-button-toggle>
<mat-button-toggle value="add" (change)="onValChange($event.value)" matTooltip="Add Dataset">
<mat-icon>add</mat-icon> <mat-icon>add</mat-icon>
</mat-button-toggle> </mat-button-toggle>
<mat-button-toggle value="list" (change)="onValChange($event.value)" matTooltip="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.LIST-BUTTON-TOOLTIP' | translate}}">
<mat-icon>format_align_left</mat-icon>
</mat-button-toggle>
</mat-button-toggle-group> </mat-button-toggle-group>
</div> </div>
<div class="col-12"> <div class="col-12">
@ -43,9 +43,12 @@
<div *ngIf="toggleButton === 2 && editedDataset" class="col-12"> <div *ngIf="toggleButton === 2 && editedDataset" class="col-12">
<div class="row"> <div class="row">
<mat-form-field class="col-md-12"> <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> <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> </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.id"> <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> </app-dataset-description-form>
</div> </div>
</div> </div>

View File

@ -13,97 +13,92 @@ import { QuickWizardDatasetDescriptionModel } from "./quick-wizard-dataset-descr
import { IfStmt } from "@angular/compiler"; import { IfStmt } from "@angular/compiler";
import { TranslateService } from "@ngx-translate/core"; import { TranslateService } from "@ngx-translate/core";
@Component({ @Component({
selector: 'app-dataset-editor-wizard-component', selector: 'app-dataset-editor-wizard-component',
templateUrl: 'dataset-editor-wizard.component.html', templateUrl: 'dataset-editor-wizard.component.html',
styleUrls: ['./dataset-editor-wizard.component.scss'] styleUrls: ['./dataset-editor-wizard.component.scss']
}) })
export class DatasetEditorWizardComponent extends BaseComponent implements OnInit, IBreadCrumbComponent { export class DatasetEditorWizardComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
breadCrumbs: Observable<BreadcrumbItem[]>; breadCrumbs: Observable<BreadcrumbItem[]>;
@Input() formGroup: FormGroup; @Input() formGroup: FormGroup;
@Input() datasetProfile: FormGroup;// DatasetProfileModel; @Input() datasetProfile: FormGroup;// DatasetProfileModel;
@Input() datasetLabel: string; @Input() datasetLabel: string;
editedDataset: boolean = false; editedDataset: boolean = false;
dataset: DatasetDescriptionFormEditorModel; dataset: DatasetDescriptionFormEditorModel;
public datasetProfileDefinition: DatasetDescriptionFormEditorModel; public datasetProfileDefinition: DatasetDescriptionFormEditorModel;
public lastIndexOfDataset = 0; public lastIndexOfDataset = 0;
public toggleButton = 0; public toggleButton = 0;
public _inputValue: string; public _inputValue: string;
constructor( constructor(
private datasetWizardService: DatasetWizardService, private datasetWizardService: DatasetWizardService,
public language: TranslateService, public language: TranslateService,
) { ) {
super(); super();
} }
ngOnInit(): void {
this.datasetWizardService.getDefinition(this.datasetProfile.value["id"])
.pipe(takeUntil(this._destroyed))
.subscribe(item => {
this.datasetProfileDefinition = new DatasetDescriptionFormEditorModel().fromModel(item);
this.onValChange("list");
const length = (this.formGroup.get('datasets').get('datasetsList') as FormArray).length;
if (length == 0) {
this.lastIndexOfDataset = length;
this.addDataset();
this.onValChange("dataset");
}
});
}
ngOnInit(): void { onValChange(event: any) {
this.datasetWizardService.getDefinition(this.datasetProfile.value["id"]) if (event == "list") {
.pipe(takeUntil(this._destroyed)) this.toggleButton = 0;
.subscribe(item => { this.editedDataset = false;
this.datasetProfileDefinition = new DatasetDescriptionFormEditorModel().fromModel(item); this._inputValue = "list";
this.onValChange("list"); } else if (event == "add") {
const length = (this.formGroup.get('datasets').get('datasetsList') as FormArray).length; this.addDataset();
if (length == 0) { this.toggleButton = 2;
this.lastIndexOfDataset = length; this._inputValue = "dataset";
this.addDataset(); } else if (event == "dataset") {
this.onValChange("dataset"); this.toggleButton = 2;
} this._inputValue = "dataset";
}); }
} }
onValChange(event: any) { editDataset(index: number) {
if (event == "list") { this.lastIndexOfDataset = index;
this.toggleButton = 0; this.toggleButton = 2;
this.editedDataset = false; this.editedDataset = true;
this._inputValue = "list"; this._inputValue = "dataset"
} else if (event == "add") { }
this.addDataset();
this.toggleButton = 2;
this._inputValue = "dataset";
} else if (event == "dataset") {
this.toggleButton = 2;
this._inputValue = "dataset";
}
} deleteDataset(index: number) {//TODO: delete Dataset From List
editDataset(index: number) { this.lastIndexOfDataset = index;
this.lastIndexOfDataset = index; this.toggleButton = 0;
this.toggleButton = 2; this.editedDataset = false;
this.editedDataset = true; this._inputValue = "list";
this._inputValue = "dataset" (this.formGroup.get('datasets').get('datasetsList') as FormArray).removeAt(index);
} }
deleteDataset(index: number) {//TODO: delete Dataset From List addDataset() {
this.lastIndexOfDataset = index; const formArray: FormArray = (this.formGroup.get('datasets').get('datasetsList') as FormArray);
this.toggleButton = 0; let dataset = new QuickWizardDatasetDescriptionModel().fromModel(this.datasetProfileDefinition);
this.editedDataset = false; let formGroup = dataset.buildForm();
this._inputValue = "list";
(this.formGroup.get('datasets').get('datasetsList') as FormArray).removeAt(index);
}
addDataset() { formGroup.get('datasetLabel').setValue(
const formArray: FormArray = (this.formGroup.get('datasets').get('datasetsList') as FormArray); this.language.instant('QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.DATASET-NAME') +
let dataset = new QuickWizardDatasetDescriptionModel().fromModel(this.datasetProfileDefinition); this.datasetProfile.value["label"] +
let formGroup = dataset.buildForm(); this.language.instant('QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.DATASET-NAME-FOR') +
this.datasetLabel);
formArray.push(formGroup);
this.lastIndexOfDataset = formArray.length - 1;
this.editedDataset = true;
}
formGroup.get('datasetLabel').setValue( listingMode() {
this.language.instant('QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.DATASET-NAME') + if (this.toggleButton === 0) return true;
this.datasetProfile.value["label"] + }
this.language.instant('QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.DATASET-NAME-FOR') + }
this.datasetLabel);
formArray.push(formGroup);
this.lastIndexOfDataset = formArray.length - 1;
this.editedDataset = true;
}
}