diff options
Diffstat (limited to 'frontend/src/app')
10 files changed, 142 insertions, 6 deletions
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css index e69de29b..b4ac9669 100644 --- a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css +++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.css @@ -0,0 +1,7 @@ +#container { + border-radius: 8px; +} + +#wrapper { + color: #003459; +}
\ No newline at end of file diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html index 01c4af82..37ac67cf 100644 --- a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html +++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html @@ -1 +1,38 @@ -<p>browse-predictors works!</p> + +<div id="wrapper"> + + <div id="container" class="container p-5" style="background-color: white; min-height: 100%;"> + <div class="row mt-3 mb-2 d-flex justify-content-center"> + + <div class="col-sm-6" style="margin-bottom: 10px;"> + <input type="text" class="form-control" placeholder="Pretraga" [(ngModel)]="term"> + </div> + + <div class="row"> + <div class="col-sm-4" style="margin-bottom: 10px;" *ngFor="let predictor of myPredictors | filter:term"> + <div class="card h-100"> + <div class="card-body"> + <h3 class="card-title"><b>{{predictor.name}}</b></h3> + <p class="card-text">{{predictor.description}}</p> + <a class="btn btn-primary" (click)="openPredictor(predictor._id)">Otvori</a> + </div> + <div class="card-footer text-muted"> + Kreirao: {{predictor.username}} <br> + Datum kreiranja: {{predictor.dateCreated |date}} + </div> + </div> + </div> + + + </div> + <div class="text-center"*ngIf="(myPredictors|filter:term).length === 0"> + <h2>Nema rezultata</h2> + </div> + </div> + + </div> + + + + +</div>
\ No newline at end of file diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts index b4fb2a9d..5c085bba 100644 --- a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts +++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts @@ -1,5 +1,7 @@ import { Component, OnInit } from '@angular/core'; - +import { PredictorsService } from 'src/app/_services/predictors.service'; +import Predictor from 'src/app/_data/Predictor'; +import {Router} from '@angular/router' @Component({ selector: 'app-browse-predictors', templateUrl: './browse-predictors.component.html', @@ -7,9 +9,18 @@ import { Component, OnInit } from '@angular/core'; }) export class BrowsePredictorsComponent implements OnInit { - constructor() { } + myPredictors? :Predictor[]; + term: string=""; + constructor(private predictors: PredictorsService,private router:Router) { + this.predictors.getPublicPredictors().subscribe((predictors) => { + this.myPredictors = predictors; + }); + } ngOnInit(): void { } + openPredictor(id:string):void{ + this.router.navigateByUrl('/predict?id='+id); + }; } diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.css b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.css diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.html b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.html new file mode 100644 index 00000000..fecf09a8 --- /dev/null +++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.html @@ -0,0 +1 @@ +<p>filter-datasets works!</p> diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.spec.ts b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.spec.ts new file mode 100644 index 00000000..6ab894fd --- /dev/null +++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FilterDatasetsComponent } from './filter-datasets.component'; + +describe('FilterDatasetsComponent', () => { + let component: FilterDatasetsComponent; + let fixture: ComponentFixture<FilterDatasetsComponent>; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ FilterDatasetsComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(FilterDatasetsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts new file mode 100644 index 00000000..4a143696 --- /dev/null +++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-filter-datasets', + templateUrl: './filter-datasets.component.html', + styleUrls: ['./filter-datasets.component.css'] +}) +export class FilterDatasetsComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/frontend/src/app/_services/predictors.service.spec.ts b/frontend/src/app/_services/predictors.service.spec.ts new file mode 100644 index 00000000..7733780b --- /dev/null +++ b/frontend/src/app/_services/predictors.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { PredictorsService } from './predictors.service'; + +describe('PredictorsService', () => { + let service: PredictorsService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(PredictorsService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/_services/predictors.service.ts b/frontend/src/app/_services/predictors.service.ts new file mode 100644 index 00000000..0cd7f0f6 --- /dev/null +++ b/frontend/src/app/_services/predictors.service.ts @@ -0,0 +1,21 @@ +import { HttpClient } from '@angular/common/http'; +import { Injectable } from '@angular/core'; +import { Observable } from 'rxjs'; +import { API_SETTINGS } from 'src/config'; +import Predictor from '../_data/Predictor'; +import { AuthService } from './auth.service'; + +@Injectable({ + providedIn: 'root' +}) +export class PredictorsService { + + + + constructor(private http: HttpClient, private authService: AuthService) { } + + getPublicPredictors(): Observable<Predictor[]> { + return this.http.get<Predictor[]>(`${API_SETTINGS.apiURL}/Predictor/publicpredictors`, { headers: this.authService.authHeader() }); + } + +} diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 7f076421..9d2bbc26 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -7,7 +7,7 @@ import { MatSliderModule } from '@angular/material/slider'; import { MatIconModule } from '@angular/material/icon'; import {NgChartsModule} from 'ng2-charts'; - +import { Ng2SearchPipe, Ng2SearchPipeModule } from 'ng2-search-filter'; import { AppComponent } from './app.component'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { DatasetLoadComponent } from './_elements/dataset-load/dataset-load.component'; @@ -33,6 +33,7 @@ import { BrowsePredictorsComponent } from './_pages/browse-predictors/browse-pre import { PredictComponent } from './_pages/predict/predict.component'; import { ScatterchartComponent } from './scatterchart/scatterchart.component'; import { BarchartComponent } from './barchart/barchart.component'; +import { FilterDatasetsComponent } from './_pages/filter-datasets/filter-datasets.component'; @NgModule({ declarations: [ @@ -55,7 +56,8 @@ import { BarchartComponent } from './barchart/barchart.component'; BrowsePredictorsComponent, PredictComponent, ScatterchartComponent, - BarchartComponent + BarchartComponent, + FilterDatasetsComponent ], imports: [ BrowserModule, @@ -68,7 +70,8 @@ import { BarchartComponent } from './barchart/barchart.component'; ReactiveFormsModule, MatSliderModule, MatIconModule, - NgChartsModule + NgChartsModule, + Ng2SearchPipeModule ], providers: [], bootstrap: [AppComponent] |