Skip to content

Commit a84de0a

Browse files
Lauest-IteratorLauest-Iterator
committed
pr fixes
1 parent fcb3925 commit a84de0a

19 files changed

+293
-98
lines changed

‎src/app/applications/application-detail/application-detail.component.ts‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { AfterViewInit, Component, EventEmitter, OnDestroy, OnInit, Output } from "@angular/core";
1+
import { AfterViewInit, ChangeDetectorRef, Component, EventEmitter, OnDestroy, OnInit, Output } from "@angular/core";
22
import { MatDialog } from "@angular/material/dialog";
33
import { Title } from "@angular/platform-browser";
44
import { ActivatedRoute, Router } from "@angular/router";
@@ -71,11 +71,13 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
7171
private restService: RestService,
7272
private sharedVariableService: SharedVariableService,
7373
private chirpstackGatewayService: ChirpstackGatewayService,
74-
private changeOrganizationDialog: MatDialog
74+
private changeOrganizationDialog: MatDialog,
75+
private cdr: ChangeDetectorRef
7576
) {}
7677

7778
ngOnInit(): void {
7879
this.id = +this.route.snapshot.paramMap.get("id");
80+
7981
if (this.id) {
8082
this.bindApplication(this.id);
8183
this.dropdownButton = {
@@ -213,6 +215,7 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
213215
bindApplication(id: number): void {
214216
this.applicationsSubscription = this.applicationService.getApplication(id).subscribe(application => {
215217
this.application = application;
218+
this.cdr.detectChanges();
216219
});
217220
}
218221

‎src/app/applications/applications-list/application-filter/application-filter.component.html‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,10 @@
3838
<div class="spacer"></div>
3939
<button class="filter-button" mat-flat-button (click)="onButtonClick()">
4040
<div class="filter-icon-container">
41-
<img class="filter-icon" ngSrc="../../../../assets/images/filter.png" width="25" height="25" priority />
42-
{{ "APPLICATION-FILTER.RESET-FILTER" | translate }}
41+
<img ngSrc="../../../../assets/images/sliders.svg" width="18" height="16" priority />
42+
<div class="filter-label">
43+
{{ "APPLICATION-FILTER.RESET-FILTER" | translate }}
44+
</div>
4345
</div>
4446
</button>
4547
</div>

‎src/app/applications/applications-list/application-filter/application-filter.component.scss‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,23 @@
44
display: flex;
55
flex-direction: row;
66
flex: 1;
7-
height: 65px;
7+
min-height: 65px;
88
margin-bottom: 25px;
9+
flex-wrap: wrap;
10+
}
11+
12+
@media (max-width: 768px) {
13+
.filter-container {
14+
flex-direction: column;
15+
}
916
}
1017

1118
.filter-selector-container {
1219
width: 200px;
1320
margin-right: 30px;
1421
display: flex;
1522
flex-direction: column;
23+
margin-bottom: 30px;
1624
}
1725

1826
.filter-title {
@@ -41,12 +49,15 @@
4149
justify-content: center;
4250
gap: 10px;
4351
width: 150px;
52+
}
53+
54+
.filter-label {
4455
font-size: 16px;
56+
font-weight: 500;
4557
}
4658

4759
:host .mat-mdc-select {
48-
height: 20px;
49-
line-height: 35px;
60+
height: 24px;
5061
display: flex;
5162
align-items: center;
5263
font-size: 16px !important;
@@ -64,6 +75,7 @@
6475
height: 40px !important;
6576
display: flex !important;
6677
align-items: center !important;
78+
font-size: 16px !important;
6779
}
6880

6981
:host .mat-mdc-select-arrow {

‎src/app/applications/applications-list/application-filter/application-filter.component.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { MatIconModule } from "@angular/material/icon";
77
import { MatSelectModule } from "@angular/material/select";
88
import { ApplicationService } from "@applications/application.service";
99
import { ApplicationStatus, ApplicationStatusCheck } from "@applications/enums/status.enum";
10+
import { ChirpstackGatewayService } from "./../../../shared/services/chirpstack-gateway.service";
1011

1112
import { TranslateModule, TranslateService } from "@ngx-translate/core";
1213
import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
@@ -34,10 +35,12 @@ export class ApplicationFilterComponent implements OnInit {
3435
private applicationService: ApplicationService,
3536
private filterService: ApplicationsFilterService,
3637
private sharedVariableService: SharedVariableService,
37-
public translate: TranslateService
38+
public translate: TranslateService,
39+
public ChirpstackGatewayService: ChirpstackGatewayService
3840
) {}
3941
ngOnInit(): void {
4042
this.loadOwnerOptions();
43+
this.ChirpstackGatewayService.getMultiple().subscribe(data => data);
4144
}
4245

4346
stateOptions: { label: string; value: ApplicationStatus | "All" }[] = [

‎src/app/applications/applications-list/applications-table/applications-table.component.html‎

Lines changed: 22 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -17,20 +17,20 @@
1717
matSortDirection="asc"
1818
(matSortChange)="announceSortChange($event)"
1919
>
20-
<ng-container matColumnDef="status">
21-
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="">
20+
<ng-container matColumnDef="statusCheck">
21+
<th mat-header-cell *matHeaderCellDef mat-sort-header>
2222
{{ "APPLICATION-TABLE.STATUS" | translate }}
23-
<app-table-sort-icon [sortDirection]="getSortDirection('status')" />
23+
<app-table-sort-icon [sortDirection]="getSortDirection('statusCheck')" />
2424
</th>
25-
<td mat-cell *matCellDef="let application" class="status-container">
25+
<td mat-cell *matCellDef="let application">
2626
<app-status-icon [iconType]="application.statusCheck" />
2727
</td>
2828
</ng-container>
2929

30-
<ng-container matColumnDef="state">
30+
<ng-container matColumnDef="status">
3131
<th mat-header-cell *matHeaderCellDef mat-sort-header>
3232
{{ "APPLICATION-TABLE.STATE" | translate }}
33-
<app-table-sort-icon [sortDirection]="getSortDirection('state')" />
33+
<app-table-sort-icon [sortDirection]="getSortDirection('status')" />
3434
</th>
3535
<td mat-cell *matCellDef="let application">
3636
<app-option-field
@@ -45,7 +45,7 @@
4545
{{ "APPLICATION-TABLE.NAME" | translate }}
4646
<app-table-sort-icon [sortDirection]="getSortDirection('name')" />
4747
</th>
48-
<td mat-cell *matCellDef="let element">
48+
<td mat-cell *matCellDef="let element" class="name-and-description">
4949
<div class="name-and-description">
5050
<div class="application-name">
5151
{{ element.name }}
@@ -59,16 +59,15 @@
5959

6060
<ng-container matColumnDef="data">
6161
<th mat-header-cell *matHeaderCellDef mat-sort-header>
62-
{{ "APPLICATION-TABLE.DATA" | translate }}
62+
{{ "APPLICATION-TABLE.CONTROLLED-PROPERTIES" | translate }}
6363
<app-table-sort-icon [sortDirection]="getSortDirection('data')" />
6464
</th>
6565
<td mat-cell *matCellDef="let application">
6666
<!-- TODO:: add @for when data is found -->
6767
<div class="options-container">
68-
<app-option-field [title]="'APPLICATION.STATUS.' + application.status | translate" />
69-
<app-option-field [title]="'APPLICATION.STATUS.' + application.status | translate" />
70-
<app-option-field [title]="'APPLICATION.STATUS.' + application.status | translate" />
71-
<app-option-field [title]="'APPLICATION.STATUS.' + application.status | translate" />
68+
@for (property of application.controlledProperties; track $index) {
69+
<app-option-field [title]="property.type" />
70+
}
7271
</div>
7372
</td>
7473
</ng-container>
@@ -93,15 +92,12 @@
9392
</td>
9493
</ng-container>
9594

96-
<ng-container matColumnDef="action">
97-
<th mat-header-cell *matHeaderCellDef></th>
98-
</ng-container>
99-
100-
<!-- No used
95+
<!-- Not default columns -->
10196

10297
<ng-container matColumnDef="contactPerson">
10398
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
10499
{{ "APPLICATION-TABLE.CONTACT-PERSON" | translate }}
100+
<app-table-sort-icon [sortDirection]="getSortDirection('contactPerson')" />
105101
</th>
106102
<td mat-cell *matCellDef="let application">
107103
{{ application.contactPerson ?? "-" }}
@@ -111,6 +107,7 @@
111107
<ng-container matColumnDef="dataTargets">
112108
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
113109
{{ "APPLICATION-TABLE.DATA-TARGETS" | translate }}
110+
<app-table-sort-icon [sortDirection]="getSortDirection('dataTargets')" />
114111
</th>
115112
<td mat-cell *matCellDef="let application">
116113
{{ application?.dataTargets?.length ?? 0 }}
@@ -120,6 +117,7 @@
120117
<ng-container matColumnDef="openDataDkEnabled">
121118
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
122119
{{ "APPLICATION-TABLE.OPEN-DATA-DK" | translate }}
120+
<app-table-sort-icon [sortDirection]="getSortDirection('openDataDkEnabled')" />
123121
</th>
124122
<td mat-cell *matCellDef="let application">
125123
{{ isOpenDataDK(application.dataTargets) | yesNo }}
@@ -129,6 +127,7 @@
129127
<ng-container matColumnDef="personalData">
130128
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
131129
{{ "APPLICATION-TABLE.PERSONAL-DATA" | translate }}
130+
<app-table-sort-icon [sortDirection]="getSortDirection('personalData')" />
132131
</th>
133132
<td mat-cell *matCellDef="let application">
134133
<fa-icon *ngIf="application.personalData" [icon]="faFlagIcon" class="flag-icon"></fa-icon>
@@ -139,6 +138,7 @@
139138
<ng-container matColumnDef="startDate">
140139
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
141140
{{ "APPLICATION-TABLE.START-DATE" | translate }}
141+
<app-table-sort-icon [sortDirection]="getSortDirection('startDate')" />
142142
</th>
143143
<td mat-cell *matCellDef="let application">
144144
{{ (application.startDate | dateOnly) ?? "-" }}
@@ -148,6 +148,7 @@
148148
<ng-container matColumnDef="endDate">
149149
<th mat-header-cell *matHeaderCellDef mat-sort-header class="col-1">
150150
{{ "APPLICATION-TABLE.END-DATE" | translate }}
151+
<app-table-sort-icon [sortDirection]="getSortDirection('endDate')" />
151152
</th>
152153
<td mat-cell *matCellDef="let application">
153154
{{ (application.endDate | dateOnly) ?? "-" }}
@@ -157,32 +158,26 @@
157158
<ng-container matColumnDef="category">
158159
<th mat-header-cell *matHeaderCellDef class="col-1">
159160
{{ "APPLICATION-TABLE.CATEGORY" | translate }}
161+
<app-table-sort-icon [sortDirection]="getSortDirection('category')" />
160162
</th>
161163
<td mat-cell *matCellDef="let application">
162164
{{ application.category ?? "-" }}
163165
</td>
164166
</ng-container>
165167

166-
<ng-container matColumnDef="controlledProperties">
167-
<th mat-header-cell *matHeaderCellDef class="col-1">
168-
{{ "APPLICATION-TABLE.CONTROLLED-PROPERTIES" | translate }}
169-
</th>
170-
<td mat-cell *matCellDef="let application">
171-
{{ mapControlledProperties(application.controlledProperties) ?? "-" }}
172-
</td>
173-
</ng-container>
174-
175168
<ng-container matColumnDef="deviceTypes">
176169
<th mat-header-cell *matHeaderCellDef class="col-1">
177170
{{ "APPLICATION-TABLE.DEVICE-TYPES" | translate }}
171+
<app-table-sort-icon [sortDirection]="getSortDirection('deviceTypes')" />
178172
</th>
179173
<td mat-cell *matCellDef="let application">
180174
{{ mapDeviceTypes(application.deviceTypes) ?? "-" }}
181175
</td>
182-
</ng-container> -->
176+
</ng-container>
183177

184178
<ng-container matColumnDef="menu">
185179
<th mat-header-cell *matHeaderCellDef class="col-1"></th>
180+
½
186181
<td mat-cell *matCellDef="let element">
187182
<div class="dropdown" *ngIf="element?.id | canEditApplication">
188183
<a

‎src/app/applications/applications-list/applications-table/applications-table.component.scss‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
.flag-icon {
2-
color: red;
3-
}
4-
51
.name-and-description {
62
max-width: 300px;
73
}
@@ -29,6 +25,7 @@
2925
gap: 5px;
3026
align-items: center;
3127
flex-wrap: wrap;
28+
margin-top: 5px;
3229
}
3330

3431
.status-container {
@@ -54,3 +51,7 @@
5451
.paginator {
5552
display: none !important;
5653
}
54+
55+
.mat-sort-header-arrow {
56+
display: none !important;
57+
}

0 commit comments

Comments
 (0)