diff options
15 files changed, 72 insertions, 48 deletions
diff --git a/backend/api/api/appsettings.json b/backend/api/api/appsettings.json index 77708086..b502efeb 100644 --- a/backend/api/api/appsettings.json +++ b/backend/api/api/appsettings.json @@ -27,6 +27,9 @@ /* "ConnectionString": "mongodb+srv://si_user:si_user@sidatabase.twtfm.mongodb.net/myFirstDatabase?retryWrites=true&w=majority", + + "ConnectionString": "mongodb+srv://si_user:si_user@sidatabase.twtfm.mongodb.net/myFirstDatabase?retryWrites=true&w=majority", + 529394dd526811e059dfb5f8f76597ffd90b2fea "DatabaseName": "si_db", "CollectionName": "users", "DatasetCollectionName": "Dataset", diff --git a/frontend/src/app/_elements/column-table/column-table.component.css b/frontend/src/app/_elements/column-table/column-table.component.css index f7f07e62..311773f7 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.css +++ b/frontend/src/app/_elements/column-table/column-table.component.css @@ -22,7 +22,7 @@ table.fixed td { table.fixed th { overflow: hidden; - max-width: 120px; + max-width: 250px; min-width: 120px; vertical-align: middle; background-color: var(--ns-primary-50); 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 31c32dfd..bb5914bd 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -35,7 +35,7 @@ </thead> <tbody> <tr *ngFor="let row of tableData; let i = index"> - <th>#{{i}}</th> + <th>#{{((this.begin/10)+1)*10-10+i+1}}</th> <td *ngFor="let col of row; let j = index" [ngClass]="{'text-disabled' : !columnsChecked[j]}"> <div class="text-overflow"> {{col}} @@ -200,7 +200,7 @@ </mat-menu> </div> <div *ngIf="colInfo.numNulls == 0" class="text-left"> - Nema null vrednosti. + Nema nedostajućih vrednosti. </div> </td> </tr> 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 ad78feaf..f40167ad 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -131,6 +131,7 @@ export class ColumnTableComponent implements AfterViewInit { } else { this.dataset = dataset; + this.experimentChanged.emit(); this.columnsChecked = []; this.dataset.columnInfo.forEach(column => { if (this.experiment.inputColumns.find(x => x == column.columnName) != undefined) @@ -157,9 +158,6 @@ export class ColumnTableComponent implements AfterViewInit { this.resetPagging(); this.loadData(); this.loaded = true; - - this.updateCharts(); - this.updatePieChart(); } loadData(){ @@ -336,7 +334,8 @@ export class ColumnTableComponent implements AfterViewInit { } openMissingValuesDialog() { const dialogRef = this.dialog.open(MissingvaluesDialogComponent, { - width: '500px' + width: '500px', + panelClass: 'custom-modalbox' }); dialogRef.afterClosed().subscribe(selectedMissingValuesOption => { if (selectedMissingValuesOption != undefined) diff --git a/frontend/src/app/_elements/folder/folder.component.css b/frontend/src/app/_elements/folder/folder.component.css index 1a1e70ec..9e7644b6 100644 --- a/frontend/src/app/_elements/folder/folder.component.css +++ b/frontend/src/app/_elements/folder/folder.component.css @@ -182,7 +182,7 @@ .file-bottom-buttons { position: absolute; - bottom: 15px; + bottom: 5px; right: 4%; display: flex; flex-direction: row-reverse; diff --git a/frontend/src/app/_modals/alert-dialog/alert-dialog.component.html b/frontend/src/app/_modals/alert-dialog/alert-dialog.component.html index 2d7e4d86..84793260 100644 --- a/frontend/src/app/_modals/alert-dialog/alert-dialog.component.html +++ b/frontend/src/app/_modals/alert-dialog/alert-dialog.component.html @@ -1,9 +1,9 @@ - - - <h2 mat-dialog-title >{{data.title}}</h2> - <div mat-dialog-content class="mt-4 text-offwhite" > - {{data.message}} - </div> - <div mat-dialog-actions class="d-flex justify-content-center mt-4"> +<h2 mat-dialog-title>{{data.title}}</h2> +<div mat-dialog-content class="mt-4 text-offwhite"> + <form (keydown)="withEnterKey($event)"> + {{data.message}} + </form> +</div> +<div mat-dialog-actions class="d-flex justify-content-center mt-4"> <button mat-raised-button cdkFocusInitial (click)="onOkClick()" color="basic">OK</button> - </div>
\ No newline at end of file +</div>
\ No newline at end of file diff --git a/frontend/src/app/_modals/alert-dialog/alert-dialog.component.ts b/frontend/src/app/_modals/alert-dialog/alert-dialog.component.ts index e15f3c6f..7558b527 100644 --- a/frontend/src/app/_modals/alert-dialog/alert-dialog.component.ts +++ b/frontend/src/app/_modals/alert-dialog/alert-dialog.component.ts @@ -20,9 +20,11 @@ export class AlertDialogComponent { //public dialog: MatDialog ) {} + withEnterKey(keyboardEvent: KeyboardEvent) { + if (keyboardEvent.code == "Enter" || keyboardEvent.code == "NumpadEnter") + this.onOkClick(); + } onOkClick(): void { this.dialogRef.close(); } - - } diff --git a/frontend/src/app/_modals/encoding-dialog/encoding-dialog.component.html b/frontend/src/app/_modals/encoding-dialog/encoding-dialog.component.html index 08c1f26b..fed8f8d7 100644 --- a/frontend/src/app/_modals/encoding-dialog/encoding-dialog.component.html +++ b/frontend/src/app/_modals/encoding-dialog/encoding-dialog.component.html @@ -1,15 +1,17 @@ <h2 mat-dialog-title class="text-center">Enkodiranje svih kolona</h2> <div mat-dialog-content class="mt-5 mb-4"> <p>Sve izabrane kolone biće enkodirane metodom:</p> - <form (keydown)="withEnterKey($event)"> - <mat-form-field> - <mat-select matNativeControl [(value)]="selectedEncodingType" cdkFocusInitial> - <mat-option *ngFor="let option of Object.keys(Encoding); let optionName of Object.values(Encoding)" [value]="option"> - {{ optionName }} - </mat-option> - </mat-select> - </mat-form-field> - </form> + <div class="d-flex justify-content-center"> + <form (keydown)="withEnterKey($event)"> + <mat-form-field> + <mat-select matNativeControl [(value)]="selectedEncodingType" cdkFocusInitial> + <mat-option *ngFor="let option of Object.keys(Encoding); let optionName of Object.values(Encoding)" [value]="option"> + {{ optionName }} + </mat-option> + </mat-select> + </mat-form-field> + </form> + </div> </div> <div mat-dialog-actions class="justify-content-center"> <button id="btnYes" mat-stroked-button color="basic" (click)="onYesClick()">Potvrdi</button> diff --git a/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css b/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css index e99a1e1e..64d7bd21 100644 --- a/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css +++ b/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css @@ -5,4 +5,8 @@ #btnNo { color: gray; +} + +::ng-deep.mat-dialog-content { + overflow: visible; }
\ No newline at end of file diff --git a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html index 06e74093..77e7be42 100644 --- a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html +++ b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html @@ -1,8 +1,10 @@ <h2 mat-dialog-title class="text-muted">{{data.title}}</h2> <div mat-dialog-content class="mt-4" style="color: rgb(81, 76, 76);"> - {{data.message}} + <form (keydown)="withEnterKey($event)"> + {{data.message}} + </form> </div> <div mat-dialog-actions class="d-flex justify-content-center mt-4"> - <button mat-button cdkFocusInitial (click)="onYesClick()" style="background-color: lightgray;">Da</button> - <button mat-button cdkFocusInitial (click)="onNoClick()" style="background-color: lightgray;">Ne</button> + <button mat-button cdkFocusInitial (click)="onYesClick()" style="background-color: lightgray;">Da</button> + <button mat-button cdkFocusInitial (click)="onNoClick()" style="background-color: lightgray;">Ne</button> </div>
\ No newline at end of file diff --git a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.ts b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.ts index de1cdd4f..a7db1e7f 100644 --- a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.ts +++ b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.ts @@ -24,10 +24,13 @@ export class YesNoDialogComponent { onNoClick(): void { this.dialogRef.close(); } - onYesClick():void{ + + withEnterKey(keyboardEvent: KeyboardEvent) { + if (keyboardEvent.code == "Enter" || keyboardEvent.code == "NumpadEnter") + this.onYesClick(); + } + onYesClick():void { this.data.yesFunction(); this.dialogRef.close(); } - - } diff --git a/frontend/src/app/_pages/experiment/experiment.component.css b/frontend/src/app/_pages/experiment/experiment.component.css index 2298ae48..a8bc1248 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.css +++ b/frontend/src/app/_pages/experiment/experiment.component.css @@ -48,6 +48,7 @@ mat-stepper { flex-direction: row; justify-content: center; align-items: center; + margin-bottom: 100px; } .step-content-inside { @@ -66,4 +67,11 @@ mat-stepper { .text-overflow { overflow-wrap: break-word; + width: 170px; + display: inline-block; + text-align: left; +} + +.text-overflow-experiment-name { + overflow-wrap: break-word; }
\ No newline at end of file diff --git a/frontend/src/app/_pages/experiment/experiment.component.html b/frontend/src/app/_pages/experiment/experiment.component.html index 8f462f86..e807dd06 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.html +++ b/frontend/src/app/_pages/experiment/experiment.component.html @@ -2,10 +2,10 @@ <div class="d-flex flex-colum align-items-center sidenav"> <div> <div class="ekspName " style="width: 250px;"> - <div class="text-overflow" *ngIf="experiment.name=='exp1'" style="width: 250px;"> + <div class="text-overflow-experiment-name" *ngIf="experiment.name=='exp1'" style="width: 250px;"> Novi Eksperiment </div> - <div class="text-overflow" *ngIf="experiment.name!='exp1'" style="width: 250px;"> + <div class="text-overflow-experiment-name" *ngIf="experiment.name!='exp1'" style="width: 250px;"> {{experiment.name}} </div> @@ -14,37 +14,37 @@ <mat-step [completed]="this.step1"> <!--editable="false"--> <ng-template matStepLabel> - <span class="label" *ngIf="dataset==undefined">Izvor podataka </span> - <span class="label addedElement" *ngIf="dataset!=undefined">{{dataset.name}}</span> + <span class="label text-overflow" *ngIf="dataset==undefined">Izvor podataka </span> + <span class="label addedElement text-overflow" *ngIf="dataset!=undefined">{{dataset.name}}</span> </ng-template> <ng-template matStepContent> - <p class="text-left">Izaberite izvor podataka</p> + <p class="text-left text-overflow">Izaberite izvor podataka</p> </ng-template> </mat-step> <mat-step [completed]="experiment._id!=''"> <ng-template matStepLabel> - <span class="label addedElement" *ngIf="experiment._id!=''">Predvideti:{{experiment.outputColumn}}</span> + <span class="label addedElement text-overflow" *ngIf="experiment._id!=''">Predvideti:{{experiment.outputColumn}}</span> <span *ngIf="!this.step1" class="align-middle"><mat-icon>lock</mat-icon></span> - <span class="label" *ngIf="experiment._id==''">Odabir kolona </span> + <span class="label text-overflow" *ngIf="experiment._id==''">Odabir kolona </span> </ng-template> <ng-template matStepContent> - <p class="text-left">Pripremite podatke i izaberite izlazne kolone</p> + <p class="text-left text-overflow">Pripremite podatke i izaberite izlazne kolone</p> </ng-template> </mat-step> <mat-step [completed]="this.step3"> <ng-template matStepLabel> <span *ngIf="experiment._id==''" class="align-middle"><mat-icon>lock</mat-icon></span> - <span class="label addedElement" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span> - <span class="label" *ngIf="modelToTrain==undefined">Treniranje</span> + <span class="label addedElement text-overflow" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span> + <span class="label text-overflow" *ngIf="modelToTrain==undefined">Treniranje</span> </ng-template> - <p class="text-left">Odaberite parametre i trenirajte model</p> + <p class="text-left text-overflow">Odaberite parametre i trenirajte model</p> </mat-step> <mat-step [completed]="this.step4"> <ng-template matStepLabel> <span *ngIf="!this.step3" class="align-middle"><mat-icon>lock</mat-icon></span> - <span class="label">Pregled rezultata<br> treniranja</span> + <span class="label text-overflow">Pregled rezultata<br> treniranja</span> </ng-template> - <p class="text-left">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p> + <p class="text-left text-overflow">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p> </mat-step> </mat-stepper> </div> diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index 22894131..6c8e96b3 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -57,7 +57,7 @@ export class ExperimentComponent implements AfterViewInit, OnInit { this.dataset = response; this.folderDataset.forExperiment = this.experiment; this.folderDataset.selectFile(this.dataset); //sad 3. i 4. korak da se ucitaju - + //this.predictorsService.getPredictor(predictorId!).subscribe((response) => { let predictor = response; //this.modelsService.getModelById(predictor.modelId).subscribe((response) => { diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 8c60a666..56442842 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -18,7 +18,8 @@ const routes: Routes = [ { path: 'archive', component: ArchiveComponent, data: { title: 'Arhiva' } }, { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService], data: { title: 'Profil' } }, { path: 'playground', component: PlaygroundComponent, data: { title: 'Zabava' } }, - { path: 'test', component: TestComponent, data: { title: 'Test' } } + { path: 'test', component: TestComponent, data: { title: 'Test' } }, + { path: '**', redirectTo: '' } ]; @NgModule({ |