Skip to content

Commit 1e268bb

Browse files
style matching
1 parent bbcbd3d commit 1e268bb

File tree

51 files changed

+795
-279
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+795
-279
lines changed

src/app/app-routing.module.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import { NgModule } from "@angular/core";
2-
import { Routes, RouterModule, PreloadAllModules } from "@angular/router";
2+
import { PreloadAllModules, RouterModule, Routes } from "@angular/router";
3+
import { NewUserComponent } from "./admin/users/new-kombit-user-page/new-user.component";
4+
import { UserPageComponent } from "./admin/users/user-page/user-page.component";
5+
import { AuthGuardService as AuthGuard } from "./auth/auth-guard.service";
36
import { AuthComponent } from "./auth/auth.component";
47
import { ErrorPageComponent } from "./error-page/error-page.component";
58
import { SearchComponent } from "./search/search.component";
6-
import { AuthGuardService as AuthGuard } from "./auth/auth-guard.service";
7-
import { NewUserComponent } from "./admin/users/new-kombit-user-page/new-user.component";
8-
import { UserPageComponent } from "./admin/users/user-page/user-page.component";
99

1010
const routes: Routes = [
1111
{

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

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,24 @@
11
import { AfterViewInit, Component, EventEmitter, OnDestroy, OnInit, Output } from "@angular/core";
2+
import { MatDialog } from "@angular/material/dialog";
23
import { Title } from "@angular/platform-browser";
34
import { ActivatedRoute, Router } from "@angular/router";
5+
import { Gateway, GatewayResponseMany } from "@app/gateway/gateway.model";
46
import { Application } from "@applications/application.model";
57
import { ApplicationService } from "@applications/application.service";
8+
import { IotDevicesApplicationMapResponse } from "@applications/iot-devices/iot-device.model";
69
import { TranslateService } from "@ngx-translate/core";
710
import { DeleteDialogService } from "@shared/components/delete-dialog/delete-dialog.service";
11+
import { OrganizationAccessScope } from "@shared/enums/access-scopes";
812
import { BackButton } from "@shared/models/back-button.model";
13+
import { ApplicationDialogModel } from "@shared/models/dialog.model";
914
import { DropdownButton } from "@shared/models/dropdown-button.model";
15+
import { ChirpstackGatewayService } from "@shared/services/chirpstack-gateway.service";
1016
import { MeService } from "@shared/services/me.service";
11-
import { Subscription } from "rxjs";
12-
import { OrganizationAccessScope } from "@shared/enums/access-scopes";
13-
import { IotDevicesApplicationMapResponse } from "@applications/iot-devices/iot-device.model";
1417
import { RestService } from "@shared/services/rest.service";
15-
import { Observable } from "rxjs";
16-
import { map } from "rxjs/operators";
1718
import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
18-
import { ChirpstackGatewayService } from "@shared/services/chirpstack-gateway.service";
19-
import { Gateway, GatewayResponseMany } from "@app/gateway/gateway.model";
20-
import { MatDialog } from "@angular/material/dialog";
19+
import { Observable, Subscription } from "rxjs";
20+
import { map } from "rxjs/operators";
2121
import { ApplicationChangeOrganizationDialogComponent } from "../application-change-organization-dialog/application-change-organization-dialog.component";
22-
import { ApplicationDialogModel } from "@shared/models/dialog.model";
2322

2423
@Component({
2524
selector: "app-application",
@@ -147,9 +146,9 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
147146
useGeolocation: false,
148147
markerInfo: {
149148
name: dev.name,
150-
active: false,
149+
active: dev.type,
151150
id: dev.id,
152-
isDevice: true,
151+
isDevice: false,
153152
internalOrganizationId: this.sharedVariableService.getSelectedOrganisationId(),
154153
networkTechnology: dev.type,
155154
lastActive: dev.latestSentMessage,

src/app/applications/application.model.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1+
import { PermissionResponse } from "@app/admin/permission/permission.model";
12
import { ControlledPropertyTypes } from "@app/device-model/Enums/controlled-propperty.enum";
3+
import { Datatarget } from "@applications/datatarget/datatarget.model";
24
import { ApplicationDeviceTypeUnion } from "@shared/enums/device-type";
35
import { ControlledProperty } from "@shared/models/controlled-property.model";
46
import { Organisation } from "../admin/organisation/organisation.model";
5-
import { ApplicationStatus } from "./enums/status.enum";
7+
import { ApplicationState } from "./enums/status.enum";
68
import { IotDevice } from "./iot-devices/iot-device.model";
79
import { ApplicationDeviceType } from "./models/application-device-type.model";
8-
import { PermissionResponse } from "@app/admin/permission/permission.model";
9-
import { Datatarget } from "@applications/datatarget/datatarget.model";
1010

1111
export class Application {
1212
public id: number;
@@ -20,7 +20,7 @@ export class Application {
2020
public updatedBy: number;
2121
public createdByName: string;
2222
public updatedByName: string;
23-
public status?: ApplicationStatus;
23+
public status?: ApplicationState;
2424
public startDate?: Date;
2525
public endDate?: Date;
2626
public category?: string;
@@ -41,7 +41,7 @@ export class ApplicationRequest {
4141
public name: string;
4242
public description: string;
4343
public organizationId: number;
44-
public status?: ApplicationStatus;
44+
public status?: ApplicationState;
4545
public startDate?: Date;
4646
public endDate?: Date;
4747
public category?: string;

src/app/applications/application.service.ts

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import { Injectable } from "@angular/core";
22
import { UserMinimalService } from "@app/admin/users/user-minimal.service";
33
import { Application, ApplicationData, UpdateApplicationOrganization } from "@applications/application.model";
4-
import { Observable } from "rxjs";
4+
import { forkJoin, Observable } from "rxjs";
55
import { map } from "rxjs/operators";
66
import { RestService } from "../shared/services/rest.service";
7+
import { IotDevicesApplicationMapResponse } from "./iot-devices/iot-device.model";
78

89
interface GetApplicationParameters {
910
limit: number;
@@ -41,6 +42,21 @@ export class ApplicationService {
4142
})
4243
);
4344
}
45+
getApplicationDevicesForMap(applicationIds: number[]): Observable<IotDevicesApplicationMapResponse[]> {
46+
const requests = applicationIds.map(applicationId =>
47+
this.restService.get(`application/${applicationId}/iot-devices-map`).pipe(
48+
map((data: IotDevicesApplicationMapResponse[]) => {
49+
return data;
50+
})
51+
)
52+
);
53+
54+
return forkJoin(requests).pipe(
55+
map((responses: IotDevicesApplicationMapResponse[][]) => {
56+
return responses.reduce((acc, val) => acc.concat(val), []);
57+
})
58+
);
59+
}
4460

4561
getApplications(
4662
limit: number,
Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<div class="filter-container">
2+
<div class="filter-selector-container">
3+
<div class="filter-title">Status</div>
4+
<mat-form-field appearance="outline">
5+
<mat-select class="withoutArrow" [(value)]="state" placeholder="test" (selectionChange)="onStatus($event)">
6+
<mat-option *ngFor="let option of statusOptions" [value]="option.value">
7+
{{ option.label }}
8+
</mat-option>
9+
</mat-select>
10+
</mat-form-field>
11+
</div>
12+
13+
<div class="filter-selector-container">
14+
<div class="filter-title">Tilstand</div>
15+
<mat-form-field appearance="outline">
16+
<mat-select class="withoutArrow" [(value)]="status" (selectionChange)="onState($event)">
17+
<mat-option *ngFor="let option of stateOptions" [value]="option.value">
18+
{{ option.label }}
19+
</mat-option>
20+
</mat-select>
21+
</mat-form-field>
22+
</div>
23+
24+
<div class="filter-selector-container">
25+
<div class="filter-title">Ejer</div>
26+
<mat-form-field appearance="outline">
27+
<mat-select class="withoutArrow" [(value)]="owner" (selectionChange)="onOwner($event)">
28+
<mat-option *ngFor="let option of ownerOptions" [value]="option.value">
29+
{{ option.label }}
30+
</mat-option>
31+
</mat-select>
32+
</mat-form-field>
33+
</div>
34+
35+
<div class="spacer"></div>
36+
<button class="filter-button" mat-flat-button (click)="onButtonClick()">
37+
<div class="filter-icon-container">
38+
<img class="filter-icon" ngSrc="../../../../assets/images/filter.png" width="25" height="25" priority />
39+
Reset filtre
40+
</div>
41+
</button>
42+
</div>
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
.filter-container {
2+
display: flex;
3+
flex-direction: row;
4+
flex: 1;
5+
height: 65px;
6+
margin-bottom: 25px;
7+
}
8+
9+
.filter-selector-container {
10+
width: 200;
11+
margin-right: 30px;
12+
display: flex;
13+
flex-direction: column;
14+
}
15+
16+
.filter-title {
17+
font-size: 14px;
18+
}
19+
20+
.spacer {
21+
display: flex;
22+
flex: 1;
23+
}
24+
25+
.filter-button {
26+
align-self: flex-end;
27+
height: 35px !important;
28+
width: 170px !important;
29+
min-width: 170px !important;
30+
display: flex !important;
31+
align-items: center;
32+
justify-content: center;
33+
margin-bottom: 3px;
34+
border: 1px solid black !important;
35+
}
36+
37+
.filter-icon-container {
38+
display: flex !important;
39+
align-items: center;
40+
justify-content: center;
41+
gap: 10px;
42+
width: 150px;
43+
font-size: 16px;
44+
}
45+
46+
.mat-mdc-select {
47+
height: 20px;
48+
line-height: 35px;
49+
display: flex;
50+
align-items: center;
51+
font-size: 16px !important;
52+
color: rgb(186, 183, 183) !important;
53+
}
54+
55+
.mat-mdc-form-field {
56+
height: 20px !important;
57+
display: flex;
58+
align-items: center;
59+
}
60+
61+
.mat-mdc-text-field-wrapper {
62+
background-color: #ffff !important;
63+
height: 35px !important;
64+
display: flex !important;
65+
align-items: center !important;
66+
}
67+
68+
.mat-mdc-select-arrow {
69+
display: none;
70+
}
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
import { NgFor, NgOptimizedImage } from "@angular/common";
2+
import { Component, OnInit, ViewEncapsulation } from "@angular/core";
3+
import { MatButtonModule } from "@angular/material/button";
4+
import { MatOptionModule } from "@angular/material/core";
5+
import { MatFormFieldModule } from "@angular/material/form-field";
6+
import { MatIconModule } from "@angular/material/icon";
7+
import { MatSelectModule } from "@angular/material/select";
8+
import { ApplicationService } from "@applications/application.service";
9+
import { ApplicationState, ApplicationStatus } from "@applications/enums/status.enum";
10+
import { ApplicationsFilterService } from "../applications-filter.service";
11+
12+
@Component({
13+
selector: "app-application-filter",
14+
standalone: true,
15+
imports: [
16+
NgFor,
17+
NgOptimizedImage,
18+
MatIconModule,
19+
MatFormFieldModule,
20+
MatSelectModule,
21+
MatOptionModule,
22+
MatButtonModule,
23+
],
24+
templateUrl: "./application-filter.component.html",
25+
styleUrl: "./application-filter.component.scss",
26+
encapsulation: ViewEncapsulation.ShadowDom,
27+
})
28+
export class ApplicationFilterComponent implements OnInit {
29+
constructor(private applicationService: ApplicationService, private filterService: ApplicationsFilterService) {}
30+
ngOnInit(): void {
31+
this.loadOwnerOptions();
32+
}
33+
34+
statusOptions: { label: string; value: ApplicationState | "All" }[] = [
35+
{ label: "Alle", value: "All" },
36+
{ label: "Ingen", value: ApplicationState["NONE"] },
37+
{ label: "In operation", value: ApplicationState["IN-OPERATION"] },
38+
{ label: "Project", value: ApplicationState["PROJECT"] },
39+
{ label: "Prototype", value: ApplicationState["PROTOTYPE"] },
40+
{ label: "other", value: ApplicationState["OTHER"] },
41+
];
42+
43+
stateOptions: { label: string; value: ApplicationStatus | "All" }[] = [
44+
{ label: "Alle", value: "All" },
45+
{ label: "Warning", value: ApplicationStatus.WARNING },
46+
{ label: "Alert", value: ApplicationStatus.WARNING },
47+
{ label: "Stable", value: ApplicationStatus.STABLE },
48+
];
49+
50+
ownerOptions: { label: string; value: string | "All" }[] = [];
51+
52+
loadOwnerOptions(): void {
53+
this.filterService.getOwnerOptions().subscribe(options => {
54+
options.push({ label: "Alle", value: "All" });
55+
this.ownerOptions = options;
56+
});
57+
}
58+
59+
state: string = "All";
60+
status: string = "All";
61+
owner: string = "All";
62+
63+
onState(event: any): void {
64+
console.log("Tilstand changed:", event.value);
65+
this.filterService.updateState(event.value);
66+
}
67+
68+
onStatus(event: any): void {
69+
console.log("Status changed:", event.value);
70+
this.filterService.updateStatus(event.value);
71+
}
72+
73+
onOwner(event: any): void {
74+
console.log("Ejer changed:", event.value);
75+
this.filterService.updateOwner(event.value);
76+
}
77+
78+
onButtonClick() {
79+
this.state = "All";
80+
this.status = "All";
81+
this.owner = "All";
82+
this.filterService.resetFilter();
83+
}
84+
}
Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
11
<div class="map-page thirty-height">
2-
<app-map [coordinateList]="coordinateList" [isFromApplication]="true" [applicationId]="222"></app-map>
2+
@if(coordinateList){
3+
4+
<app-map [coordinateList]="coordinateList" [isFromApplication]="true" [applicationId]="22"></app-map>
5+
6+
}
37
</div>

0 commit comments

Comments
 (0)