diff options
Diffstat (limited to 'frontend/src')
6 files changed, 81 insertions, 29 deletions
diff --git a/frontend/src/app/_elements/item-predictor/item-predictor.component.ts b/frontend/src/app/_elements/item-predictor/item-predictor.component.ts index d864480a..b6b5c9db 100644 --- a/frontend/src/app/_elements/item-predictor/item-predictor.component.ts +++ b/frontend/src/app/_elements/item-predictor/item-predictor.component.ts @@ -1,4 +1,5 @@ import { Component, Input, OnInit } from '@angular/core'; +import { Router } from '@angular/router'; import Predictor from 'src/app/_data/Predictor'; @Component({ @@ -10,13 +11,14 @@ export class ItemPredictorComponent implements OnInit { @Input() predictor: Predictor = new Predictor(); - constructor() { } + constructor(private router: Router) { } ngOnInit(): void { } openPredictor() { - console.log("iskoristi") + this.router.navigate(['predict/'+ '6244958a26cf2385bc29ba2c']); + //this.router.navigate(['predict'+this.predictor._id]); } } 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 d1f15ffe..de024904 100644 --- a/frontend/src/app/_pages/add-model/add-model.component.html +++ b/frontend/src/app/_pages/add-model/add-model.component.html @@ -124,9 +124,9 @@ <span class="input-group-text col-2 text-center"> {{column}} <span class="small" style="color:gray;">({{calculateSumOfNullValuesInCol(column)}} null)</span> </span> - <label *ngIf="calculateSumOfNullValuesInCol(column)==0" class="form-control col-2">Ova kolona nema nedostajućih vrednosti.</label> - <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="text" class="form-control col-1" [id]="'fillText_'+column" (keyup)="checkFillColRadio(column)"> - <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio" [id]="'fillCol_'+column" class="col-1" + <label *ngIf="calculateSumOfNullValuesInCol(column)==0" class="form-control col-10">Ova kolona nema nedostajućih vrednosti.</label> + + <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio" [id]="'fillCol_'+column" class="col-1 mt-2" [name]="'delOp_'+column"> <!--OVDE SREDI IZGLED--> <select [id]="'replaceOptions'+i" class="form-control col-2" *ngIf="isNumber(datasetFile[1][i]) && calculateSumOfNullValuesInCol(column)!=0" (change)="replaceWithSelectedNumber($event);"> @@ -143,7 +143,10 @@ {{ option }} </option> </select> - <label *ngIf="calculateSumOfNullValuesInCol(column)!=0" class="form-control col-2" [for]="'delCol_'+column">Izbriši kolonu + <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="text" class="form-control col-1" [id]="'fillText_'+column" + (keyup)="checkFillColRadio(column)" placeholder="Unesi vrednost..."> + + <label *ngIf="calculateSumOfNullValuesInCol(column)!=0" class="form-control" [for]="'delCol_'+column">Izbriši kolonu <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio" [id]="'delCol_'+column" [name]="'delOp_'+column" (change)="emptyFillTextInput(column)"></label> <label *ngIf="calculateSumOfNullValuesInCol(column)!=0" class="form-control col-2" [for]="'delRows_'+column">Izbriši redove @@ -158,8 +161,8 @@ {{column}} <span class="small" style="color:gray;">({{calculateSumOfNullValuesInCol(column)}} null)</span> </span> <label *ngIf="calculateSumOfNullValuesInCol(column)==0" class="form-control">Ova kolona nema nedostajućih vrednosti.</label> - <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="text" class="form-control col-1" [id]="'fillText_'+column" (keyup)="checkFillColRadio(column)"> - <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio" [id]="'fillCol_'+column" class="col-1" + + <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="radio" [id]="'fillCol_'+column" class="col-1 mt-2" [name]="'delOp_'+column"> <!--OVDE SREDI IZGLED--> <select [id]="'replaceOptions'+i" class="form-control col-2" *ngIf="isNumber(datasetFile[1][i]) && calculateSumOfNullValuesInCol(column)!=0" (change)="replaceWithSelectedNumber($event);"> @@ -176,6 +179,9 @@ {{ option }} </option> </select> + <input *ngIf="calculateSumOfNullValuesInCol(column)!=0" type="text" class="form-control col-1" [id]="'fillText_'+column" + (keyup)="checkFillColRadio(column)" placeholder="Unesi vrednost..."> + <label *ngIf="calculateSumOfNullValuesInCol(column)!=0" class="form-control col-2" [for]="'delCol_'+column">Izbriši kolonu <input type="radio" [id]="'delCol_'+column" [name]="'delOp_'+column" (change)="emptyFillTextInput(column)"></label> diff --git a/frontend/src/app/_pages/predict/predict.component.html b/frontend/src/app/_pages/predict/predict.component.html index 67d047b7..fe17c96d 100644 --- a/frontend/src/app/_pages/predict/predict.component.html +++ b/frontend/src/app/_pages/predict/predict.component.html @@ -9,52 +9,72 @@ <br> - <div class="form-group row mt-3 mb-2 d-flex justify-content-center"> + <div class="form-group row mt-3 mb-2 d-flex justify-content-left"> <!--justify-content-center--> <h2> Izabrani prediktor: </h2> - <div class="col-3"> - <label for="name" class="col-form-label">Naziv prediktora:</label> - <input type="text" class="form-control" name="name" [(ngModel)]="predictor.name"> + <div class="col-10"> + <label for="output" class="col-sm-5 col-form-label">Naziv prediktora: <b>{{predictor.name}}</b></label> </div> - <div class="col-5"> - <label for="desc" class="col-sm-2 col-form-label">Opis:</label> - <div> - <textarea class="form-control" name="desc" rows="3" [(ngModel)]="predictor.description"></textarea> - </div> + <div> + <label for="output" class="col-sm-5 col-form-label">Opis prediktora: <b>{{predictor.description}}</b></label> </div> </div> - + <br> + <div > + <!--input --> + <h3>Popunite ulazne kolone:</h3> + <div id="divInputs" class="form-check mt-2"> + <div *ngIf="predictor" class="form-group row mt-3 mb-2 d-flex justify-content-left"> + <div *ngFor="let input of predictor.inputs; let i = index"> + <label for="{{input}}" class="col-sm-2 col-form-label"><b>{{input}}</b></label> + <input name="{{input}}" type="text" [(ngModel)]="inputs[i]" > + + </div> + + </div> + </div> + + - <div class="col-3 mt-2"> + </div> + <div> + <label for="output" class="col-sm-2 col-form-label">Izlaz: <b>{{predictor.output}}</b></label> + </div> + <br> + <br> + <br> + <br> + <br> + + <div class="col-5 mt-2"> <label for="type" class="form-check-label">Da li je prediktor javan?</label> <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="predictor.isPublic" type="checkbox" value="" > </div> - <div class="col-3 mt-2"> + <div class="col-5 mt-2"> <label for="type" class="form-check-label">Da li je dostupan za deljenje?</label> <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="predictor.accessibleByLink" type="checkbox" value="" > </div> + <br> <div class="col-2"> - <label for="dateCreated" class="col-form-label">Datum:</label> + <label for="dateCreated" class="col-form-label">Datum:</label> <input type="text" class="form-control-plaintext" id="dateCreated" placeholder="--/--/--" value="{{predictor.dateCreated | date: 'dd/MM/yyyy'}}" readonly> </div> - <!-- + <br><br> <div class="form-group row mt-5 mb-3"> <div class="col"></div> <button class="btn btn-lg col-4" style="background-color:#003459; color:white;" - (click)="addModel();">Sačuvaj model</button> - <div class="col"></div> - <button class="btn btn-lg col-4" style="background-color:#003459; color:white;" - (click)="trainModel();">Treniraj model</button> + (click)="usePredictor();">Iskoristi prediktor</button> <div class="col"></div> + </div> - --> + </div> </div>
\ No newline at end of file diff --git a/frontend/src/app/_pages/predict/predict.component.ts b/frontend/src/app/_pages/predict/predict.component.ts index d5cb22bd..3f431fff 100644 --- a/frontend/src/app/_pages/predict/predict.component.ts +++ b/frontend/src/app/_pages/predict/predict.component.ts @@ -1,5 +1,7 @@ import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; import Predictor from 'src/app/_data/Predictor'; +import { PredictorsService } from 'src/app/_services/predictors.service'; @Component({ selector: 'app-predict', @@ -8,12 +10,28 @@ import Predictor from 'src/app/_data/Predictor'; }) export class PredictComponent implements OnInit { + inputs : String[] = []; + predictor:Predictor; - constructor() { + constructor(private predictS : PredictorsService, private route: ActivatedRoute) { this.predictor = new Predictor(); } ngOnInit(): void { + this.route.params.subscribe(url => { + this.predictS.getPredictor(url["id"]).subscribe(p => { + + this.predictor = p; + console.log(this.predictor); + }) + }); } + usePredictor(): void{ + this.predictS.usePredictor(this.predictor, this.inputs).subscribe(p => { + + alert("Uspesno ste poslali preditor!"); + }) + console.log(this.inputs); + } } diff --git a/frontend/src/app/_services/predictors.service.ts b/frontend/src/app/_services/predictors.service.ts index a2dc012f..54ae5694 100644 --- a/frontend/src/app/_services/predictors.service.ts +++ b/frontend/src/app/_services/predictors.service.ts @@ -17,5 +17,11 @@ export class PredictorsService { getPublicPredictors(): Observable<Predictor[]> { return this.http.get<Predictor[]>(`${API_SETTINGS.apiURL}/predictor/publicpredictors`, { headers: this.authService.authHeader() }); } + getPredictor(id : String): Observable<Predictor> { + return this.http.get<Predictor>(`${API_SETTINGS.apiURL}/predictor/getpredictor/`+ id, { headers: this.authService.authHeader() }); + } + usePredictor(predictor: Predictor, inputs : String[]) { + return this.http.post(`${API_SETTINGS.apiURL}/predictor/usepredictor/` + predictor._id, inputs, { headers: this.authService.authHeader() }); + } } diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 1c368318..fd827ac9 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -24,7 +24,7 @@ const routes: Routes = [ { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService], data: { title: 'Profil' } }, { path: 'browse-datasets', component: FilterDatasetsComponent, data: { title: 'Javni izvori podataka' } }, { path: 'browse-predictors', component: BrowsePredictorsComponent, data: { title: 'Javni trenirani modeli' } }, - { path: 'predict', component: PredictComponent, data: { title: 'Predvidi vrednosti' } } + { path: 'predict/:id', component: PredictComponent, data: { title: 'Predvidi vrednosti' } } ]; @NgModule({ |