From 3e0243ee1512d4e9bf390ecf4b39eba832caf4da Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Tue, 3 May 2022 22:27:56 +0200 Subject: Povezivanje koraka 1 i 2 (cuvanje izvora i cuvanje eskperimenta). Napravljen dijalog za cuvanje eksperimenta. --- .../column-table/column-table.component.html | 390 +++++++++++---------- .../column-table/column-table.component.ts | 82 +++-- .../src/app/_elements/folder/folder.component.ts | 24 +- .../_elements/form-model/form-model.component.html | 11 +- 4 files changed, 273 insertions(+), 234 deletions(-) (limited to 'frontend/src/app/_elements') diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index 53372574..543a0018 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -1,125 +1,126 @@ -
-
- +
+ -
- -
+
+
+ +
-
- - - - - - - - - - - - - - - - - -
# -
- #{{i + 1}}  {{colInfo.columnName}} - -
-
#{{i}} -
- {{col}} -
-
-
+
+ + + + + + + + + + + + + + + + + +
# +
+ #{{i + 1}}  {{colInfo.columnName}} + +
+
#{{i}} +
+ {{col}} +
+
+
-
- - - - - - - - - - - - - - - - - -
Kolona -
- #{{i + 1}}  {{colInfo.columnName}} - -
-
-
- {{colInfo.columnName}} -
- 		-
- 0.1 -
-
-
+
+ + + + + + + + + + + + + + + + + +
Kolona +
+ #{{i + 1}}  {{colInfo.columnName}} + +
+
+
+ {{colInfo.columnName}} +
+ 		+
+ 0.1 +
+
+
-
- - - - - - - - - - - - - - - - - - - - - - - + + +
Naziv -
- #{{i + 1}}  {{colInfo.columnName}} - -
-
Tip -

Kategorijski

- - - Kategorijski - Numerički - - -
Grafik - - -
Statistika - +
+ + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - + + + + + + + + - - -
Naziv +
+ #{{i + 1}}  {{colInfo.columnName}} + +
+
Tip +

Kategorijski

+ + + Kategorijski + Numerički + + +
Grafik + + +
Statistika + Mean: {{colInfo.mean}}
Median: {{colInfo.median}}
Min: {{colInfo.min}}
@@ -127,104 +128,104 @@ Q1: {{colInfo.q1}}
Q3: {{colInfo.q3}}
 -
- - ({{colInfo.uniqueValuesPercent[i].toFixed(4)}}%) {{uniqueValue}}
+
+ + ({{(colInfo.uniqueValuesPercent[i] * 100).toFixed(2)}}%) {{uniqueValue}}
 -
-
- Enkodiranje  - settings - - - - - {{ optionName }} - - - -
-
Nedostajuće
vrednosti
- settings - 		+ +
+ Enkodiranje  + settings + + + + + {{ optionName }} + + + +
+
Nedostajuće
vrednosti
+ settings + 		-
- - - - - - + + + + + - - - - - + + + + + - + - - + + - - - + + + - - - - -
-
- Nema nedostajućih vrednosti. -
-
+ + + + +
+
+ Nema nedostajućih vrednosti. +
+
+
-
-
-
-
+
+
+
-
- - Tip problema - - Regresioni - Binarni-klasifikacioni - Multi-klasifikacioni - - -
-
- - Izlazna kolona - - {{inputColumn}} - - -
-
-
- +
\ No newline at end of file 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 01e4e564..c3d4f206 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -8,6 +8,8 @@ import { MissingvaluesDialogComponent } from 'src/app/_modals/missingvalues-dial import { MatCheckboxChange } from '@angular/material/checkbox'; import { CsvParseService } from 'src/app/_services/csv-parse.service'; import { ProblemType } from 'src/app/_data/Model'; +import { ExperimentsService } from 'src/app/_services/experiments.service'; +import { SaveExperimentDialogComponent } from 'src/app/_modals/save-experiment-dialog/save-experiment-dialog.component'; @Component({ selector: 'app-column-table', @@ -17,7 +19,7 @@ import { ProblemType } from 'src/app/_data/Model'; export class ColumnTableComponent implements AfterViewInit { @Input() dataset?: Dataset; - @Input() experiment?: Experiment; + @Input() experiment!: Experiment; @ViewChildren("nullValMenu") nullValMenus!: ElementRef[]; @Output() okPressed: EventEmitter = new EventEmitter(); @Output() columnTableChanged = new EventEmitter(); @@ -31,37 +33,44 @@ export class ColumnTableComponent implements AfterViewInit { nullValOption: string[] = []; columnsChecked: boolean[] = []; //niz svih kolona + loaded: boolean = false; - constructor(private datasetService: DatasetsService, public csvParseService: CsvParseService, public dialog: MatDialog) { + constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog) { //ovo mi nece trebati jer primam dataset iz druge komponente } - ngAfterViewInit(): void { - this.datasetService.getMyDatasets().subscribe((datasets) => { - this.dataset = datasets[2]; + loadDataset(dataset: Dataset) { + this.dataset = dataset; - this.setColumnTypeInitial(); - this.experiment = new Experiment(); - this.dataset.columnInfo.forEach(column => { - this.columnsChecked.push(true); - }); - console.log(datasets); - for (let i = 0; i < this.dataset?.columnInfo.length; i++) { - this.experiment?.inputColumns.push(this.dataset.columnInfo[i].columnName); - } - this.experiment.outputColumn = this.experiment.inputColumns[0]; - this.resetColumnEncodings(Encoding.Label); - this.setDeleteRowsForMissingValTreatment(); + this.setColumnTypeInitial(); + + this.dataset.columnInfo.forEach(column => { + this.columnsChecked.push(true); + }); + + for (let i = 0; i < this.dataset?.columnInfo.length; i++) { + this.experiment.inputColumns.push(this.dataset.columnInfo[i].columnName); + } + this.experiment.outputColumn = this.experiment.inputColumns[0]; + this.resetColumnEncodings(Encoding.Label); + this.setDeleteRowsForMissingValTreatment(); - this.nullValOption = [].constructor(this.dataset.columnInfo.length).fill('Obriši redove'); + this.nullValOption = []; + this.dataset.columnInfo.forEach(colInfo => { + this.nullValOption.push(`Obriši redove (${colInfo.numNulls})`); + }); - this.datasetService.getDatasetFilePartial(this.dataset.fileId, 0, 10).subscribe((response: string | undefined) => { - if (response && this.dataset != undefined) { - this.tableData = this.csvParseService.csvToArray(response, (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter.toString() == "") ? "," : this.dataset.delimiter); - } - }); + this.datasetService.getDatasetFilePartial(this.dataset.fileId, 0, 10).subscribe((response: string | undefined) => { + if (response && this.dataset != undefined) { + this.tableData = this.csvParseService.csvToArray(response, (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter.toString() == "") ? "," : this.dataset.delimiter); + } }); + this.loaded = true; + } + + ngAfterViewInit(): void { + } setColumnTypeInitial() { @@ -90,6 +99,13 @@ export class ColumnTableComponent implements AfterViewInit { this.columnTableChanged.emit(); } + columnTypeChanged(columnName: string) { + if (this.experiment.outputColumn == columnName) + this.changeOutputColumn(columnName); + else + this.columnTableChangeDetected(); + } + changeInputColumns(targetMatCheckbox: MatCheckboxChange, columnName: string) { if (this.experiment != undefined) { @@ -111,7 +127,7 @@ export class ColumnTableComponent implements AfterViewInit { } } - changeOutputColumn() { + changeOutputColumn(columnName: string) { if (this.experiment != undefined && this.dataset != undefined) { let column = this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.outputColumn)[0]; if (column.columnType == ColumnType.numerical) { @@ -187,6 +203,20 @@ export class ColumnTableComponent implements AfterViewInit { this.resetMissingValuesTreatment(selectedMissingValuesOption); }); } + + openSaveExperimentDialog() { + const dialogRef = this.dialog.open(SaveExperimentDialogComponent, { + width: '400px' + }); + dialogRef.afterClosed().subscribe(selectedName => { + this.experiment.name = selectedName; + //napravi odvojene dugmice za save i update -> za update nece da se otvara dijalog za ime + this.experimentService.addExperiment(this.experiment).subscribe((response) => { + console.log(response); + this.okPressed.emit(); + }); + }); + } @@ -239,8 +269,8 @@ export class ColumnTableComponent implements AfterViewInit { return (document.getElementById(columnName)).value; return '0'; } - ok() { - this.okPressed.emit(); + saveExperiment() { + this.openSaveExperimentDialog(); } diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts index e0336ded..39412826 100644 --- a/frontend/src/app/_elements/folder/folder.component.ts +++ b/frontend/src/app/_elements/folder/folder.component.ts @@ -9,6 +9,7 @@ import { FormDatasetComponent } from '../form-dataset/form-dataset.component'; import Experiment from 'src/app/_data/Experiment'; import { ExperimentsService } from 'src/app/_services/experiments.service'; import { PredictorsService } from 'src/app/_services/predictors.service'; +import { SignalRService } from 'src/app/_services/signal-r.service'; @Component({ selector: 'app-folder', @@ -19,9 +20,6 @@ export class FolderComponent implements AfterViewInit { @ViewChild(FormDatasetComponent) formDataset?: FormDatasetComponent; - - - @Input() folderName: string = 'Moji podaci'; @Input() files!: FolderFile[] @@ -44,18 +42,26 @@ export class FolderComponent implements AfterViewInit { searchTerm: string = ''; - constructor(private datasetsService: DatasetsService, private experimentsService: ExperimentsService, private modelsService: ModelsService, private predictorsService: PredictorsService) { + constructor(private datasetsService: DatasetsService, private experimentsService: ExperimentsService, private modelsService: ModelsService, private predictorsService: PredictorsService, private signalRService: SignalRService) { //PLACEHOLDER this.forExperiment = new Experiment(); this.forExperiment.inputColumns = ['kolona1', 'kol2', '???', 'test']; this.folders[TabType.File] = []; this.folders[TabType.NewFile] = []; - } ngAfterViewInit(): void { - this.refreshFiles(); + this.refreshFiles(null); + + if (this.signalRService.hubConnection) { + this.signalRService.hubConnection.on("NotifyDataset", (dName: string, dId: string) => { + this.refreshFiles(dId); + + }); + } else { + console.warn("Dataset-Load: No connection!"); + } } _initialized = false; @@ -86,7 +92,6 @@ export class FolderComponent implements AfterViewInit { this.fileToDisplay = this.newFile; this.newFileSelected = true; this.listView = false; - this.selectedFileChanged.emit(this.newFile); this.displayFile(); } @@ -112,13 +117,16 @@ export class FolderComponent implements AfterViewInit { this.okPressed.emit(); } - refreshFiles() { + refreshFiles(selectedDatasetId: string | null) { this.tabsToShow.forEach(tab => { this.folders[tab] = []; }) this.datasetsService.getMyDatasets().subscribe((datasets) => { this.folders[TabType.MyDatasets] = datasets; + if (selectedDatasetId) { + this.selectFile(datasets.filter(x => x._id == selectedDatasetId)[0]); + } }); this.experimentsService.getMyExperiments().subscribe((experiments) => { diff --git a/frontend/src/app/_elements/form-model/form-model.component.html b/frontend/src/app/_elements/form-model/form-model.component.html index e51c2cac..dd23bb09 100644 --- a/frontend/src/app/_elements/form-model/form-model.component.html +++ b/frontend/src/app/_elements/form-model/form-model.component.html @@ -77,7 +77,7 @@ Broj uzoraka po iteraciji - + {{option}} @@ -93,12 +93,12 @@
Trening Test
- +
- Nasumični redosled podataka + Nasumični redosled podataka
- +
@@ -215,5 +215,4 @@
- - + \ No newline at end of file -- cgit v1.2.3