aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app/_elements/column-table/column-table.component.html
blob: 4418d21bd6f686af75acea03bc360f589ad20905 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<table *ngIf="dataset && experiment" class="table text-offwhite">
    <thead>
        <tr>
            <th>Naziv</th>
            <th *ngFor="let colInfo of dataset.columnInfo; let i = index">
                #{{i + 1}}&nbsp;&nbsp;{{colInfo.columnName}}
                <input type="checkbox" class="btn-primary" checked (click)="changeInputColumns($event, colInfo.columnName)">
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>Tip</th>
            <td *ngFor="let colInfo of dataset.columnInfo; let i = index">
                <mat-form-field>
                    <select matNativeControl class="form-control btn-primary" (change)="changeColumnType($event, i)">
                        <option [selected]="!colInfo.isNumber" value="Kategorijski">Kategorijski</option>
                        <option [selected]="colInfo.isNumber" value="Numerički">Numerički</option>
                    </select>
                </mat-form-field>
            </td>
        </tr>
        <tr>
            <th>Grafik</th>
            <td *ngFor="let colInfo of dataset.columnInfo; let i = index">
                <!-- <app-box-plot *ngIf="colInfo.isNumber"></app-box-plot>
                TODO: dodati [data]
                <app-pie-chart *ngIf="!colInfo.isNumber"></app-pie-chart> -->
            </td>
        </tr>
        <tr>
            <th>Statistika</th>
            <td *ngFor="let colInfo of dataset.columnInfo; let i = index">
                <span *ngIf="colInfo.isNumber">
                    Mean: {{colInfo.mean}}<br>
                    Median: {{colInfo.median}}<br>
                    Min: {{colInfo.min}}<br>
                    Max: {{colInfo.max}}<br>
                    <!-- TODO na ML-u: Q1 i Q3 u statistici 
                    Q1: {{colInfo.q1}}<br>
                    Q3: {{colInfo.q3}}<br>
                    -->
                </span>
                <span *ngIf="!colInfo.isNumber">
                    <span *ngFor="let uniqueValue of colInfo.uniqueValues | slice:0:5; let i = index">
                        {{uniqueValue}}<br><!-- TODO na ML-u: broj ponavljanja unique values-a u zagradi nek pise -->
                    </span>
                </span>
            </td>
        </tr>
        <tr>
            <th (click)="openEncodingDialog()">Enkoding&nbsp;
                <span class="material-icons-round">settings</span>
            </th>
            <td *ngFor="let colInfo of dataset.columnInfo; let i = index">
                <mat-form-field>
                    <select matNativeControl class="form-control btn-primary" [(ngModel)]="experiment.encodings[i].encoding">
                        <option
                            *ngFor="let option of Object.keys(Encoding); let optionName of Object.values(Encoding)"
                            [value]="option">
                            {{ optionName }}
                        </option>
                    </select>
                </mat-form-field>
            </td>
        </tr>
        <tr>
            <th (click)="openMissingValuesDialog()">Regulisanje nedostajućih vrednosti&nbsp;
                <span class="material-icons-round">settings</span>
            </th>
            <td *ngFor="let colInfo of dataset.columnInfo; let i = index">
                <!--
                <mat-form-field appearance="fill">
                    <mat-select matNativeControl>
                        <mat-option [value]="NullValueOptions.DeleteColumns">Obriši kolonu</mat-option>
                        <mat-option [value]="NullValueOptions.DeleteRows">Obriši redove</mat-option>
                        <mat-option>Popuni sa _____
                            <mat-select matNativeControl>
                                <mat-option>a</mat-option>
                                <mat-option>b</mat-option>
                                <mat-option>c</mat-option>
                            </mat-select>
                        </mat-option>
                    </mat-select>
                </mat-form-field>
            -->
                <button mat-button [matMenuTriggerFor]="animals">Izabrana opcija</button>
                <mat-menu #animals="matMenu">
                    <button mat-menu-item>Obriši kolonu</button>
                    <button mat-menu-item>Obriši redove</button>
                    <button mat-menu-item [matMenuTriggerFor]="fillWith">Popuni sa ____</button>
                </mat-menu>

                <mat-menu #fillWith="matMenu">
                    <button mat-menu-item [matMenuTriggerFor]="replaceWith">Unesi vrednost...</button>
                </mat-menu>

                <mat-menu #replaceWith="matMenu">
                    <input type="text" mat-menu-item placeholder="Unesi vrednost...">
                </mat-menu>
            </td>
        </tr>
    </tbody>
</table>

<div class="container text-offwhite belowColumn">
    <div class="row " >
        <div class="col-sm slider rounded">
            <div class="text-center">Trening<mat-slider thumbLabel min="10" max="90" step="10" [(ngModel)]="testSetDistribution"></mat-slider>Test</div>
            <div class="text-center">Trening:<b>{{testSetDistribution}}%</b> : Test:<b>{{100-testSetDistribution}}%</b></div>
        </div>
        
        <div class="col-sm-3 d-flex pt-3">
            <mat-form-field appearance="fill" style="width: 270px;">
                <mat-label>Tip problema</mat-label>
                <mat-select value="ToDo1">
                    <mat-option value="ToDo1">Regresioni</mat-option>
                    <mat-option value="ToDo2">Binarni-Klasifikacioni</mat-option>
                    <mat-option value="ToDo3">Multi-Klasifikacioni</mat-option>
                </mat-select>
            </mat-form-field>
        </div>
        <div class="col-sm-3 d-flex pt-3">
            <mat-form-field appearance="fill" >
                <mat-label>Izlazna kolona</mat-label>
                <mat-select>
                    <mat-option *ngFor="let item of dataset?.columnInfo" [value]="item.columnName">{{item.columnName}}</mat-option>
                </mat-select>
            </mat-form-field>
        </div>

    </div>

</div>