From 3b552e38b263cff042578ee866063dc19c1c3ea7 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Wed, 25 May 2022 00:33:30 +0200 Subject: Opcije Update i Save As za experiment. Napravljena dijalog komponenta. --- .../column-table/column-table.component.ts | 17 ++++-- .../update-experiment-dialog.component.css | 21 +++++++ .../update-experiment-dialog.component.html | 24 ++++++++ .../update-experiment-dialog.component.spec.ts | 25 ++++++++ .../update-experiment-dialog.component.ts | 68 ++++++++++++++++++++++ frontend/src/app/app.module.ts | 4 +- 6 files changed, 154 insertions(+), 5 deletions(-) create mode 100644 frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css create mode 100644 frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html create mode 100644 frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts create mode 100644 frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts (limited to 'frontend/src') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 4b10401d..41153353 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -15,6 +15,7 @@ import Shared from 'src/app/Shared'; import { PieChartComponent } from '../_charts/pie-chart/pie-chart.component'; import { BoxPlotComponent } from '../_charts/box-plot/box-plot.component'; import { ActivatedRoute } from '@angular/router'; +import { UpdateExperimentDialogComponent } from 'src/app/_modals/update-experiment-dialog/update-experiment-dialog.component'; @Component({ selector: 'app-column-table', @@ -365,11 +366,19 @@ export class ColumnTableComponent implements AfterViewInit { } openUpdateExperimentDialog() { - this.experimentService.updateExperiment(this.experiment).subscribe((response) => { - Object.assign(this.experiment, response); - this.experiment._columnsSelected = true; + const dialogRef = this.dialog.open(UpdateExperimentDialogComponent, { + width: '350px', + data: { experiment: this.experiment } + }); + dialogRef.afterClosed().subscribe(experiment => { + if (experiment == undefined) + return; + if (this.experiment._id != experiment._id) + Shared.openDialog("Novi eksperiment", "Uspešno ste sačuvali novi eksperiment. Nastavite rad na njemu."); + else + Shared.openDialog("Izmena eksperimenta", "Uspešno ste izmenili podatke o eksperimentu."); + Object.assign(this.experiment, experiment); this.experimentChanged.emit(); - Shared.openDialog("Izmena eksperimenta", "Uspešno ste izmenili podatke o eksperimentu."); }); } diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css new file mode 100644 index 00000000..551a4e21 --- /dev/null +++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.css @@ -0,0 +1,21 @@ +#btnYes { + background-color: var(--offwhite); + color: var(--ns-bg-dark-100); +} + +#btnNo { + color: gray; +} + +.wrongInput { + color: var(--ns-warn); + font-size: 11px; +} + +::ng-deep.mat-dialog-content { + overflow: visible; +} + +.hidden-class { + opacity: 0; +} \ No newline at end of file diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html new file mode 100644 index 00000000..db44dfe1 --- /dev/null +++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.html @@ -0,0 +1,24 @@ +

Sačuvaj izmene

+
+
+ + + Izmeni postojeći eksperiment + + Sačuvaj kao novi eksperiment + +
+ + + +
+
+

Eskperiment sa unetim nazivom već postoji u kolekciji.
Izaberite drugi naziv.

+

Unesite naziv eksperimenta.

+
+
+
+
+ + +
\ No newline at end of file diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts new file mode 100644 index 00000000..e0f26b2c --- /dev/null +++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UpdateExperimentDialogComponent } from './update-experiment-dialog.component'; + +describe('UpdateExperimentDialogComponent', () => { + let component: UpdateExperimentDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ UpdateExperimentDialogComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(UpdateExperimentDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts new file mode 100644 index 00000000..068aa2ef --- /dev/null +++ b/frontend/src/app/_modals/update-experiment-dialog/update-experiment-dialog.component.ts @@ -0,0 +1,68 @@ +import { Component, Inject, OnInit } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import Experiment from 'src/app/_data/Experiment'; +import { ExperimentsService } from 'src/app/_services/experiments.service'; + +interface DialogData { + experiment: Experiment; + selectedOption: number; +} + +@Component({ + selector: 'app-update-experiment-dialog', + templateUrl: './update-experiment-dialog.component.html', + styleUrls: ['./update-experiment-dialog.component.css'] +}) +export class UpdateExperimentDialogComponent implements OnInit { + + selectedOption: number = 1; + selectedName: string = ''; + wrongAlreadyExists: boolean = false; + wrongEmptyName: boolean = false; + + constructor(public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data: DialogData, private experimentService: ExperimentsService) { + this.wrongAlreadyExists = false; + this.wrongEmptyName = false; + } + + ngOnInit(): void { + } + + onNoClick() { + this.dialogRef.close(); + } + + saveWithEnterKey(keyboardEvent: KeyboardEvent) { + if (keyboardEvent.code == "Enter" || keyboardEvent.code == "NumpadEnter") + this.onYesClick(); + } + + onYesClick() { + if (this.selectedOption == 1) { //update + this.experimentService.updateExperiment(this.data.experiment).subscribe((response) => { + this.data.experiment = response; + this.dialogRef.close(this.data.experiment); + }); + } + else { //save new + if (this.selectedName == "") { + this.wrongEmptyName = true; + return; + } + this.wrongEmptyName = false; + + const newExperiment = new Experiment(); + Object.assign(newExperiment, this.data.experiment); + newExperiment.name = this.selectedName; + newExperiment._id = ''; + this.experimentService.addExperiment(newExperiment!).subscribe((response) => { + this.wrongAlreadyExists = false; + this.dialogRef.close(response); + }, (error) => { + if (error.error == "Experiment with this name exists") { + this.wrongAlreadyExists = true; + } + }); + } + } +} diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 89d53115..e2823761 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -22,6 +22,7 @@ import { YesNoDialogComponent } from './_modals/yes-no-dialog/yes-no-dialog.comp import { EncodingDialogComponent } from './_modals/encoding-dialog/encoding-dialog.component'; import { MissingvaluesDialogComponent } from './_modals/missingvalues-dialog/missingvalues-dialog.component'; import { SaveExperimentDialogComponent } from './_modals/save-experiment-dialog/save-experiment-dialog.component'; +import { UpdateExperimentDialogComponent } from './_modals/update-experiment-dialog/update-experiment-dialog.component'; // Pages import { HomeComponent } from './_pages/home/home.component'; import { ProfileComponent } from './_pages/profile/profile.component'; @@ -93,7 +94,8 @@ export function initializeApp(appConfig: Configuration) { MetricViewComponent, LineChartComponent, SaveExperimentDialogComponent, - SpinnerComponent + SpinnerComponent, + UpdateExperimentDialogComponent ], imports: [ BrowserModule, -- cgit v1.2.3 From 7f587b3feeeb3f59666176ec1cbcd8f450fe590d Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Wed, 25 May 2022 00:36:57 +0200 Subject: Dodata linija this.experiment._columnsSelected = true --- frontend/src/app/_elements/column-table/column-table.component.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'frontend/src') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 41153353..8398f7ef 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -378,6 +378,7 @@ export class ColumnTableComponent implements AfterViewInit { else Shared.openDialog("Izmena eksperimenta", "Uspešno ste izmenili podatke o eksperimentu."); Object.assign(this.experiment, experiment); + this.experiment._columnsSelected = true; this.experimentChanged.emit(); }); } -- cgit v1.2.3