diff options
Diffstat (limited to 'frontend/src/app/_pages')
4 files changed, 91 insertions, 10 deletions
diff --git a/frontend/src/app/_pages/add-model/add-model.component.css b/frontend/src/app/_pages/add-model/add-model.component.css index 004b9cac..5184733d 100644 --- a/frontend/src/app/_pages/add-model/add-model.component.css +++ b/frontend/src/app/_pages/add-model/add-model.component.css @@ -9,9 +9,6 @@ color: white; } -#wrapper { - background-image: url('/assets/images/add_model_background.jpg'); -} #container { border-radius: 8px; }
\ No newline at end of file diff --git a/frontend/src/app/_pages/add-model/add-model.component.html b/frontend/src/app/_pages/add-model/add-model.component.html index 19d69148..f5270127 100644 --- a/frontend/src/app/_pages/add-model/add-model.component.html +++ b/frontend/src/app/_pages/add-model/add-model.component.html @@ -30,8 +30,39 @@ <div class="my-5 justify-content-center"> <h2>Izvor podataka:</h2> - <app-dataset-load id="dataset"></app-dataset-load> + <app-dataset-load id="dataset" (loaded)="datasetLoaded = true"></app-dataset-load> </div> + + <div *ngIf="datasetLoaded" class="mt-2"> + <div *ngIf="datasetLoadComponent" class="row"> + <div class="col d-flex justify-content-center"> + <h3>Izaberite ulazne kolone:</h3> + <div id="divInputs" class="form-check"> + <br> + <div *ngFor="let item of datasetLoadComponent.dataset.header; let i = index"> + <input *ngIf="i == 0" class="form-check-input" type="checkbox" value="{{item}}" id="cb_{{item}}" name="cbs" checked> + <input *ngIf="i != 0" class="form-check-input" type="checkbox" value="{{item}}" id="cb_{{item}}" name="cbs"> + <label class="form-check-label" for="cb_{{item}}"> + {{item}} + </label> + </div> + </div> + </div> + <div class="col d-flex justify-content-left"> + <h3>Izaberite izlaznu kolonu:</h3> + <div id="divOutputs" class="form-check"> + <br> + <div *ngFor="let item of datasetLoadComponent.dataset.header; let i = index"> + <input *ngIf="i == 0" class="form-check-input" type="radio" value="{{item}}" id="rb_{{item}}" name="rbs" checked> + <input *ngIf="i != 0" class="form-check-input" type="radio" value="{{item}}" id="rb_{{item}}" name="rbs"> + <label class="form-check-label" for="rb_{{item}}"> + {{item}} + </label> + </div> + </div> + </div> + </div> + </div> <h2>Parametri treniranja:</h2> @@ -109,7 +140,7 @@ <div class="row mt-5"> <div class="col-2"> - <label for="inputNeurons" class="col-form-label">Broj ulaznih neurona: </label> + <label for="inputNeurons" class="col-form-label">Broj ulaznih neurona: </label> <!--UMESTO OVOGA IDE NASUMICAN REDOSLED? YES/NO--> <input type="number" min="1" class="form-control" name="inputNeurons" [(ngModel)]="newModel.inputNeurons"> </div> <div class="col-2"> diff --git a/frontend/src/app/_pages/add-model/add-model.component.ts b/frontend/src/app/_pages/add-model/add-model.component.ts index 3cb47d61..c18ad324 100644 --- a/frontend/src/app/_pages/add-model/add-model.component.ts +++ b/frontend/src/app/_pages/add-model/add-model.component.ts @@ -1,6 +1,9 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; import Model from 'src/app/_data/Model'; import { ANNType, Encoding, ActivationFunction, LossFunction, Optimizer } from 'src/app/_data/Model'; +import { DatasetLoadComponent } from 'src/app/_elements/dataset-load/dataset-load.component'; +import { ModelsService } from 'src/app/_services/models.service'; + @Component({ selector: 'app-add-model', @@ -9,7 +12,10 @@ import { ANNType, Encoding, ActivationFunction, LossFunction, Optimizer } from ' }) export class AddModelComponent implements OnInit { - newModel: Model + @ViewChild(DatasetLoadComponent) datasetLoadComponent?: DatasetLoadComponent; + datasetLoaded: boolean = false; + + newModel: Model; ANNType = ANNType; Encoding = Encoding; @@ -18,7 +24,7 @@ export class AddModelComponent implements OnInit { Optimizer = Optimizer; Object = Object; - constructor() { + constructor(private models: ModelsService) { this.newModel = new Model(); } @@ -26,7 +32,54 @@ export class AddModelComponent implements OnInit { } addModel() { - //TODO + if (this.datasetLoadComponent) + this.models.addDataset(this.datasetLoadComponent?.dataset); + + this.getCheckedInputCols(); + this.getCheckedOutputCol(); + if (this.validationInputsOutput()) + this.models.addModel(this.newModel).subscribe((response) => { + console.log(response); + }); + } + + getCheckedInputCols() { + this.newModel.inputColumns = []; + let checkboxes = document.getElementsByName("cbs"); + + for (let i = 0; i < checkboxes.length; i++) { + let thatCb = <HTMLInputElement>checkboxes[i]; + if (thatCb.checked) + this.newModel.inputColumns.push(thatCb.value); + } + //console.log(this.checkedInputCols); + } + getCheckedOutputCol() { + this.newModel.columnToPredict = ''; + let radiobuttons = document.getElementsByName("rbs"); + + for (let i = 0; i < radiobuttons.length; i++) { + let thatRb = <HTMLInputElement>radiobuttons[i]; + if (thatRb.checked) { + this.newModel.columnToPredict = thatRb.value; + break; + } + } + //console.log(this.checkedOutputCol); + } + validationInputsOutput() : boolean { + if (this.newModel.inputColumns.length == 0) { + alert("Molimo Vas da izaberete ulaznu kolonu/kolone za mrežu.") + return false; + } + for (let i = 0; i < this.newModel.inputColumns.length; i++) { + if (this.newModel.inputColumns[i] == this.newModel.columnToPredict) { + let colName = this.newModel.columnToPredict; + alert("Izabrali ste istu kolonu (" + colName + ") kao ulaznu i izlaznu iz mreže. Korigujte izbor."); + return false; + } + } + return true; } } diff --git a/frontend/src/app/_pages/home/home.component.html b/frontend/src/app/_pages/home/home.component.html index 374cb324..7245f602 100644 --- a/frontend/src/app/_pages/home/home.component.html +++ b/frontend/src/app/_pages/home/home.component.html @@ -1,4 +1,4 @@ -<div class="d-flex flex-column align-items-center"> +<div class="d-flex flex-column align-items-center bg-light"> <img src="../../../assets/svg/logo.svg" class="bi me-2" width="256" height="256" role="img"> <div *ngIf="shared.loggedIn" class="d-flex flex-column align-items-center"> <h2 class="my-4">Započnite sa treniranjem!</h2> |