diff --git a/src/app/applications/application-detail/application-detail.component.ts b/src/app/applications/application-detail/application-detail.component.ts index 6bee80ae..537c12a7 100644 --- a/src/app/applications/application-detail/application-detail.component.ts +++ b/src/app/applications/application-detail/application-detail.component.ts @@ -19,6 +19,7 @@ import { SharedVariableService } from "@shared/shared-variable/shared-variable.s import { Observable, Subscription } from "rxjs"; import { map } from "rxjs/operators"; import { ApplicationChangeOrganizationDialogComponent } from "../application-change-organization-dialog/application-change-organization-dialog.component"; +import moment from "moment/moment"; @Component({ selector: "app-application", @@ -53,12 +54,12 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI public canEdit = false; public devices: IotDevicesApplicationMapResponse[]; public coordinateList = []; - private deviceSubscription: Subscription; - private gatewaysSubscription: Subscription; public gateways: Gateway[]; public redMarker = "/assets/images/red-marker.png"; public greenMarker = "/assets/images/green-marker.png"; public greyMarker = "/assets/images/grey-marker.png"; + private deviceSubscription: Subscription; + private gatewaysSubscription: Subscription; constructor( private applicationService: ApplicationService, @@ -125,6 +126,57 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI }); } + onDeleteApplication() { + this.deleteDialogService.showApplicationDialog(this.application).subscribe(response => { + if (response) { + this.applicationService.deleteApplication(this.application.id).subscribe(response => { + if (response.ok && response.body.affected > 0) { + console.log("delete application with id:" + this.application.id.toString()); + this.router.navigate(["applications"]); + } else { + this.errorMessage = response?.error?.message; + } + }); + } else { + console.log(response); + } + }); + } + + onOpenChangeOrganizationDialog() { + this.changeOrganizationDialog.open(ApplicationChangeOrganizationDialogComponent, { + data: { + applicationId: this.id, + organizationId: this.application.belongsTo.id, + } as ApplicationDialogModel, + }); + } + + bindApplication(id: number): void { + this.applicationsSubscription = this.applicationService.getApplication(id).subscribe(application => { + this.application = application; + this.cdr.detectChanges(); + }); + } + + getDevices(): Observable { + return this.restService.get(`application/${this.id}/iot-devices-map`).pipe( + map((data: IotDevicesApplicationMapResponse[]) => { + // For some reason, the backend is not capable to sort MQTT_EXTERNAL_BROKER and MQTT_INTERNAL_BROKER. + // Therefore we do it manually in the frontend. + return data; + }) + ); + } + + ngOnDestroy() { + this.gatewaysSubscription.unsubscribe(); + this.deviceSubscription?.unsubscribe(); + if (this.applicationsSubscription) { + this.applicationsSubscription.unsubscribe(); + } + } + private getGateways(): void { this.gatewaysSubscription = this.chirpstackGatewayService .getForMaps() @@ -140,6 +192,10 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI if (!dev.location) { return; } + const isActive = dev.latestSentMessage + ? moment(dev.latestSentMessage).unix() > moment(new Date()).subtract(1, "day").unix() + : false; + tempCoordinateList.push({ longitude: dev.location.coordinates[0], latitude: dev.location.coordinates[1], @@ -148,9 +204,10 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI useGeolocation: false, markerInfo: { name: dev.name, - active: dev.type, + active: isActive, id: dev.id, isDevice: true, + isGateway: false, internalOrganizationId: this.sharedVariableService.getSelectedOrganisationId(), networkTechnology: dev.type, lastActive: dev.latestSentMessage, @@ -174,6 +231,8 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI name: gateway.name, active: this.getGatewayStatus(gateway), id: gateway.gatewayId, + isDevice: false, + isGateway: true, internalOrganizationId: gateway.organizationId, internalOrganizationName: gateway.organizationName, }, @@ -185,55 +244,4 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI private getGatewayStatus(gateway: Gateway): boolean { return this.chirpstackGatewayService.isGatewayActive(gateway); } - - onDeleteApplication() { - this.deleteDialogService.showApplicationDialog(this.application).subscribe(response => { - if (response) { - this.applicationService.deleteApplication(this.application.id).subscribe(response => { - if (response.ok && response.body.affected > 0) { - console.log("delete application with id:" + this.application.id.toString()); - this.router.navigate(["applications"]); - } else { - this.errorMessage = response?.error?.message; - } - }); - } else { - console.log(response); - } - }); - } - - onOpenChangeOrganizationDialog() { - this.changeOrganizationDialog.open(ApplicationChangeOrganizationDialogComponent, { - data: { - applicationId: this.id, - organizationId: this.application.belongsTo.id, - } as ApplicationDialogModel, - }); - } - - bindApplication(id: number): void { - this.applicationsSubscription = this.applicationService.getApplication(id).subscribe(application => { - this.application = application; - this.cdr.detectChanges(); - }); - } - - getDevices(): Observable { - return this.restService.get(`application/${this.id}/iot-devices-map`).pipe( - map((data: IotDevicesApplicationMapResponse[]) => { - // For some reason, the backend is not capable to sort MQTT_EXTERNAL_BROKER and MQTT_INTERNAL_BROKER. - // Therefore we do it manually in the frontend. - return data; - }) - ); - } - - ngOnDestroy() { - this.gatewaysSubscription.unsubscribe(); - this.deviceSubscription?.unsubscribe(); - if (this.applicationsSubscription) { - this.applicationsSubscription.unsubscribe(); - } - } } diff --git a/src/app/applications/applications-list/application-map/application-map.component.html b/src/app/applications/applications-list/application-map/application-map.component.html index ac32fa94..2a28e8d3 100644 --- a/src/app/applications/applications-list/application-map/application-map.component.html +++ b/src/app/applications/applications-list/application-map/application-map.component.html @@ -1,5 +1,11 @@
- @if(coordinateList){ - + @if (coordinateList) { + } + + Devices + + + Gateways +
diff --git a/src/app/applications/applications-list/application-map/application-map.component.scss b/src/app/applications/applications-list/application-map/application-map.component.scss index 3ce8b2c0..a92246ad 100644 --- a/src/app/applications/applications-list/application-map/application-map.component.scss +++ b/src/app/applications/applications-list/application-map/application-map.component.scss @@ -3,6 +3,7 @@ :host .map-page { background-color: #ffffff; padding: 20px; + padding-bottom: 40px; height: 600px; position: relative; } diff --git a/src/app/applications/applications-list/application-map/application-map.component.ts b/src/app/applications/applications-list/application-map/application-map.component.ts index f4a8c5de..a5b1a274 100644 --- a/src/app/applications/applications-list/application-map/application-map.component.ts +++ b/src/app/applications/applications-list/application-map/application-map.component.ts @@ -9,22 +9,24 @@ import { MapCoordinates } from "@shared/components/map/map-coordinates.model"; import { ChirpstackGatewayService } from "@shared/services/chirpstack-gateway.service"; import { SharedVariableService } from "@shared/shared-variable/shared-variable.service"; import { forkJoin, Subscription } from "rxjs"; -import { SharedModule } from "../../../shared/shared.module"; +import { SharedModule } from "@shared/shared.module"; import { ApplicationsFilterService } from "../application-filter/applications-filter.service"; import moment from "moment"; +import { FormsModule } from "@angular/forms"; @Component({ selector: "app-application-map", standalone: true, - imports: [MatCheckboxModule, SharedModule], + imports: [MatCheckboxModule, SharedModule, FormsModule], templateUrl: "./application-map.component.html", styleUrls: ["./application-map.component.scss"], }) export class ApplicationMapComponent implements OnInit, OnDestroy { public devices: IotDevice[] = []; public gateways: Gateway[] = []; - public device: boolean = true; - public gateway: boolean = true; + public displayDevices: boolean = true; + public displayGateways: boolean = true; + filterValues: { status: ApplicationStatus | "All"; statusCheck: ApplicationStatusCheck | "All"; @@ -55,22 +57,10 @@ export class ApplicationMapComponent implements OnInit, OnDestroy { } } - private loadMapData(): void { - forkJoin({ - devices: this.applicationService.getApplicationDevices(this.sharedVariableService.getSelectedOrganisationId()), - gateways: this.gatewayService.getForMaps(), - }).subscribe(({ devices, gateways }) => { - this.devices = devices; - this.gateways = gateways.resultList; - - this.mapToCoordinateList(); - }); - } - - private mapToCoordinateList() { + public mapToCoordinateList() { const tempCoordinateList: MapCoordinates[] = []; - if (Array.isArray(this.devices)) { + if (Array.isArray(this.devices) && this.displayDevices) { this.devices.forEach(dev => { const [longitude, latitude] = dev.location.coordinates; @@ -99,7 +89,7 @@ export class ApplicationMapComponent implements OnInit, OnDestroy { }); } - if (Array.isArray(this.gateways)) { + if (Array.isArray(this.gateways) && this.displayGateways) { this.gateways.forEach(gw => { tempCoordinateList.push({ longitude: gw.location.longitude, @@ -124,4 +114,16 @@ export class ApplicationMapComponent implements OnInit, OnDestroy { this.coordinateList = tempCoordinateList; } + + private loadMapData(): void { + forkJoin({ + devices: this.applicationService.getApplicationDevices(this.sharedVariableService.getSelectedOrganisationId()), + gateways: this.gatewayService.getForMaps(), + }).subscribe(({ devices, gateways }) => { + this.devices = devices; + this.gateways = gateways.resultList; + + this.mapToCoordinateList(); + }); + } } diff --git a/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.html b/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.html index 416b2f04..f7eef1b9 100644 --- a/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.html +++ b/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.html @@ -1,36 +1,36 @@
diff --git a/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.scss b/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.scss index e22fc819..1c186dd9 100644 --- a/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.scss +++ b/src/app/applications/applications-list/applications-list-dashboard/applications-list-dashboard.component.scss @@ -4,4 +4,5 @@ gap: 30px; margin-bottom: 30px; height: fit-content; + flex-wrap: wrap; } diff --git a/src/app/applications/applications-list/applications-table/applications-table.component.html b/src/app/applications/applications-list/applications-table/applications-table.component.html index 1d1fc639..a3a0a8e0 100644 --- a/src/app/applications/applications-list/applications-table/applications-table.component.html +++ b/src/app/applications/applications-list/applications-table/applications-table.component.html @@ -1,42 +1,42 @@ -
+
{{ errorMessage | translate }}
-
+
- - - - - - - - - - @@ -108,142 +108,144 @@ - - - - - - - - - - - - - - - - - - + - - + +
+
{{ "APPLICATION-TABLE.STATUS" | translate }}
- +
- + + +
{{ "APPLICATION-TABLE.STATE" | translate }}
- +
+
-
+
{{ "APPLICATION-TABLE.NAME" | translate }}
- +
+
{{ element.name }} @@ -66,41 +66,41 @@ -
+
{{ "APPLICATION-TABLE.CONTROLLED-PROPERTIES" | translate }}
- +
+
@for (property of application.controlledProperties; track $index) { - + }
+
{{ "APPLICATION-TABLE.IOT-DEVICES" | translate }}
- +
+ {{ element?.iotDevices?.length ?? 0 }} +
{{ "APPLICATION-TABLE.OWNER" | translate }}
- +
+ {{ application.owner ?? "-" }} +
{{ "APPLICATION-TABLE.CONTACT-PERSON" | translate }}
- +
+ {{ application.contactPerson ?? "-" }} +
{{ "APPLICATION-TABLE.DATA-TARGETS" | translate }}
- +
+ {{ application?.dataTargets?.length ?? 0 }} +
{{ "APPLICATION-TABLE.OPEN-DATA-DK" | translate }}
- +
+ {{ isOpenDataDK(application.dataTargets) | yesNo }} +
{{ "APPLICATION-TABLE.PERSONAL-DATA" | translate }}
- +
+ {{ !application.personalData ? "-" : "" }} +
{{ "APPLICATION-TABLE.START-DATE" | translate }}
- +
+ {{ (application.startDate | dateOnly) ?? "-" }} +
{{ "APPLICATION-TABLE.END-DATE" | translate }}
- +
+ {{ (application.endDate | dateOnly) ?? "-" }} +
{{ "APPLICATION-TABLE.CATEGORY" | translate }}
- +
+ {{ application.category ?? "-" }} +
{{ "APPLICATION-TABLE.DEVICE-TYPES" | translate }}
- +
+ {{ mapDeviceTypes(application.deviceTypes) ?? "-" }} - +
- +
- +
diff --git a/src/app/applications/applications-list/applications-table/applications-table.component.scss b/src/app/applications/applications-list/applications-table/applications-table.component.scss index 3c1d07ea..44b42a8f 100644 --- a/src/app/applications/applications-list/applications-table/applications-table.component.scss +++ b/src/app/applications/applications-list/applications-table/applications-table.component.scss @@ -55,7 +55,7 @@ } .mat-sort-header-arrow { - display: none !important; + display: none; } .column-title-color { @@ -66,3 +66,13 @@ .column-title-color-inactive { color: $default-icon-color; } + +.table-row-pointer { + cursor: pointer; +} + +.applications-table { + .mat-sort-header-arrow { + display: none; + } +} diff --git a/src/app/applications/applications-list/applications-table/applications-table.component.ts b/src/app/applications/applications-list/applications-table/applications-table.component.ts index 4e0890f0..0af1bd66 100644 --- a/src/app/applications/applications-list/applications-table/applications-table.component.ts +++ b/src/app/applications/applications-list/applications-table/applications-table.component.ts @@ -146,6 +146,7 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit { applicationSavedColumns = "applicationSavedColumns"; @ViewChild(MatPaginator) paginator: MatPaginator; @ViewChild(MatSort) sort: MatSort; + protected columnDefinitions = columnDefinitions; constructor( public translate: TranslateService, @@ -163,9 +164,6 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit { this.translate.use("da"); } - announceSortChange(event: { active: string; direction: string }) { - this.columnDefinitions.find(column => column.id === event.active).sort = event.direction as "asc" | "desc"; - } ngAfterViewInit() { // If the user changes the sort order, reset back to the first page. this.sort.sortChange.subscribe(() => (this.paginator.pageIndex = 0)); @@ -306,9 +304,12 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit { } as ApplicationDialogModel, }); } + + announceSortChange(event: { active: string; direction: string }) { + this.columnDefinitions.find(column => column.id === event.active).sort = event.direction as "asc" | "desc"; + } + getSortDirection(id: string) { return columnDefinitions.find(c => c.id === id).sort; } - - protected columnDefinitions = columnDefinitions; } diff --git a/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.html b/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.html index 9a7dc8d3..c334c688 100644 --- a/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.html +++ b/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.html @@ -6,10 +6,17 @@ >
-
+
- +
{{ "IOTDEVICE-TABLE-ROW.NOT-SUPPORTED-SHORT" | translate }} @@ -19,86 +26,86 @@ - - - - + - - - - + - - + - - + - - + @@ -107,9 +114,9 @@
{{ "IOT-TABLE.RSSI" | translate }}
- + - - + @@ -150,7 +157,7 @@ - - + - - + - - + +
+
{{ "APPLICATION-TABLE.NAME" | translate }}
- +
- {{ - iotDevice.name - }} + + {{ + iotDevice.name + }} +
{{ "IOT-TABLE.NETWORK-TECHNOLOGY" | translate }}
- +
{{ "IOT-DEVICE-TYPES." + iotDevice.type | translate }}{{ "IOT-DEVICE-TYPES." + iotDevice.type | translate }} +
{{ "GATEWAY.PLACEMENT-LABEL" | translate }}
- +
+ {{ iotDevice.commentOnLocation ? truncateText(iotDevice.commentOnLocation) : "-" }} +
{{ "IOTDEVICE.DEVICEMODEL" | translate }}
- +
{{ iotDevice.deviceModel?.body?.name ?? "-" }}{{ iotDevice.deviceModel?.body?.name ?? "-" }} +
{{ "IOTDEVICE.LORA.DEVICEPROFILE" | translate }}
- +
{{ iotDevice.deviceProfileName ?? "-" }}{{ iotDevice.deviceProfileName ?? "-" }} +
{{ "IOT-TABLE.DEV-EUI" | translate }}
- +
{{ iotDevice.deviceEUI ?? "-" }}{{ iotDevice.deviceEUI ?? "-" }} +
{{ "IOT-TABLE.APP-KEY" | translate }}
- +
{{ iotDevice.OTAAapplicationKey ?? "-" }}{{ iotDevice.OTAAapplicationKey ?? "-" }} +
{{ iotDevice.latestReceivedMessage.rssi }} @@ -124,9 +131,9 @@
{{ "IOT-TABLE.SNR" | translate }}
- + -
+
{{ iotDevice.latestReceivedMessage?.snr }} @@ -136,13 +143,13 @@ -
+
{{ "APPLICATION-TABLE.DATA-TARGETS" | translate }}
- +
{{ iotDevice.connections?.length ?? 0 }}{{ iotDevice.connections?.length ?? 0 }} {{ "IOT-TABLE.BATTERY" | translate }} +
@@ -165,38 +172,38 @@ -
+
{{ "IOT-TABLE.ACTIVE" | translate }}
- +
{{ lastActive(iotDevice) }}{{ lastActive(iotDevice) }} - +
diff --git a/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.ts b/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.ts index 0db2e3ee..c27b8d5f 100644 --- a/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.ts +++ b/src/app/applications/iot-devices/iot-devices-table/iot-devices-table.component.ts @@ -263,6 +263,10 @@ export class IotDevicesTableComponent implements AfterViewInit, OnInit { }); } + announceSortChange(event: { active: string; direction: string }) { + this.columnDefinitions.find(column => column.id === event.active).sort = event.direction as "asc" | "desc"; + } + getSortDirection(id: string) { return columnDefinitions.find(c => c.id === id).sort; } diff --git a/src/app/gateway/gateway-table/gateway-table.component.html b/src/app/gateway/gateway-table/gateway-table.component.html index b18b37b1..b4670574 100644 --- a/src/app/gateway/gateway-table/gateway-table.component.html +++ b/src/app/gateway/gateway-table/gateway-table.component.html @@ -8,13 +8,22 @@
- +
{{ "LORA-GATEWAY-TABLE.NAME" | translate }}
- +
- {{ "LORA-GATEWAY-TABLE.GATEWAYID" | translate }} + {{ "LORA-GATEWAY-TABLE.ID" | translate }}
- +
{{ gateway.gatewayId }} @@ -44,7 +53,7 @@
{{ "LORA-GATEWAY-TABLE.ORGANIZATION" | translate }}
- +
{{ gateway.organizationName }} @@ -58,7 +67,7 @@ > {{ "LORA-GATEWAY-TABLE.PACKETS-RECEIVED" | translate }} - + {{ gateway.rxPacketsReceived }} @@ -70,7 +79,7 @@
{{ "LORA-GATEWAY-TABLE.PACKETS-SENT" | translate }}
- +
{{ gateway.txPacketsEmitted }} @@ -80,11 +89,9 @@
- ' - {{ "LORA-GATEWAY-TABLE.PLACEMENT" | translate }}
- +
{{ gateway.placement ? ("GATEWAY.PLACEMENT." + gateway.placement | translate) : "" }} @@ -96,7 +103,7 @@
{{ "LORA-GATEWAY-TABLE.MODEL-NAME" | translate }}
- +
{{ gateway.modelName }} @@ -108,7 +115,7 @@
{{ "LORA-GATEWAY-TABLE.ANTENNA-TYPE" | translate }}
- +
{{ gateway.antennaType }} @@ -120,7 +127,7 @@
{{ "LORA-GATEWAY-TABLE.STATUS" | translate }}
- +
{{ gateway.status ? ("GATEWAY.STATUS." + gateway.status | translate) : "" }} @@ -136,7 +143,7 @@ > {{ "LORA-GATEWAY-TABLE.RESPONSIBLE-NAME" | translate }} - + {{ gateway.gatewayResponsibleName }} @@ -152,7 +159,7 @@ > {{ "LORA-GATEWAY-TABLE.RESPONSIBLE-EMAIL" | translate }} - + {{ gateway.gatewayResponsibleEmail }} @@ -168,7 +175,7 @@ > {{ "LORA-GATEWAY-TABLE.RESPONSIBLE-PHONE-NUMBER" | translate }} - + {{ gateway.gatewayResponsiblePhoneNumber }} @@ -184,7 +191,7 @@ > {{ "LORA-GATEWAY-TABLE.OPERATIONAL-NAME" | translate }} - + {{ gateway.operationalResponsibleName }} @@ -200,7 +207,7 @@ > {{ "LORA-GATEWAY-TABLE.OPERATIONAL-EMAIL" | translate }} - + {{ gateway.operationalResponsibleEmail }} @@ -212,7 +219,7 @@
{{ "LORA-GATEWAY-TABLE.TAGS" | translate }}
- +
{{ gateway.tagsString }} @@ -224,7 +231,7 @@
{{ "LORA-GATEWAY-TABLE.LOCATION" | translate }}
- +
{{ gateway.location.latitude | number : "2.1-6" }}, @@ -237,7 +244,7 @@
{{ "LORA-GATEWAY-TABLE.CREATED-AT" | translate }}
- +
{{ gateway.createdAt | dateOnly }} @@ -249,7 +256,7 @@
{{ "LORA-GATEWAY-TABLE.LAST-SEEN-AT" | translate }}
- +
{{ lastActive(gateway) }} diff --git a/src/app/gateway/gateway-table/gateway-table.component.ts b/src/app/gateway/gateway-table/gateway-table.component.ts index 17a82cd0..bb625e36 100644 --- a/src/app/gateway/gateway-table/gateway-table.component.ts +++ b/src/app/gateway/gateway-table/gateway-table.component.ts @@ -36,7 +36,7 @@ const columnDefinitions: TableColumn[] = [ }, { id: "gatewayId", - display: "LORA-GATEWAY-TABLE.GATEWAYID", + display: "LORA-GATEWAY-TABLE.ID", toggleable: true, default: true, }, @@ -250,8 +250,12 @@ export class GatewayTableComponent implements AfterViewInit, OnDestroy, OnInit { }); } + announceSortChange(event: { active: string; direction: string }) { + this.columnDefinitions.find(column => column.id === event.active).sort = event.direction as "asc" | "desc"; + } + getSortDirection(id: string) { - return columnDefinitions.find(c => c.id === id)?.sort ?? "asc"; + return columnDefinitions.find(c => c.id === id).sort; } private refresh() { diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html index 3867eabd..a9e46eda 100644 --- a/src/app/navbar/navbar.component.html +++ b/src/app/navbar/navbar.component.html @@ -1,7 +1,7 @@ -
+
diff --git a/src/app/navbar/navbar.component.scss b/src/app/navbar/navbar.component.scss index d2e77a86..cb894e94 100644 --- a/src/app/navbar/navbar.component.scss +++ b/src/app/navbar/navbar.component.scss @@ -83,6 +83,7 @@ button:focus, height: 33px; line-height: 14px; margin: 2px 10px; + font-size: 14px; &:hover, &.link-hover, @@ -116,6 +117,23 @@ button:focus, } } +.no-shadow { + box-shadow: none; + z-index: 100; +} + +::ng-deep .mdc-notched-outline__leading { + border-color: $light-border-color !important; +} + +::ng-deep .mdc-notched-outline__notch { + border-color: $light-border-color !important; +} + +::ng-deep .mdc-notched-outline__trailing { + border-color: $light-border-color !important; +} + .toggle-button { top: 50%; position: absolute; @@ -129,6 +147,7 @@ button:focus, padding: 0 2px 0 0; border-radius: 0 5px 5px 0; transition: left 0.3s ease-in-out, border-radius 0.3s ease-in-out; + z-index: 101; &:hover { background-color: $color-link-active-bg; @@ -142,6 +161,7 @@ button:focus, border-radius: 5px 0 0 5px; left: 248px; padding: 0 0 0 2px; + .icon-arrow-nav { transform: rotate(0deg); } diff --git a/src/app/navbar/navbar.component.ts b/src/app/navbar/navbar.component.ts index 8f9451dd..0a6c197d 100644 --- a/src/app/navbar/navbar.component.ts +++ b/src/app/navbar/navbar.component.ts @@ -7,9 +7,7 @@ import { PermissionType } from "@app/admin/permission/permission.model"; import { AuthService, CurrentUserInfoResponse } from "@app/auth/auth.service"; import { faSignInAlt } from "@fortawesome/free-solid-svg-icons"; import { TranslateService } from "@ngx-translate/core"; -import { User } from "@shared/components/forms/form-body-application/form-body-application.component"; import { OrganizationAccessScope } from "@shared/enums/access-scopes"; -import { LoggedInService } from "@shared/services/loggedin.service"; import { MeService } from "@shared/services/me.service"; import { SharedVariableService } from "@shared/shared-variable/shared-variable.service"; import { UserResponse } from "./../admin/users/user.model"; @@ -28,7 +26,6 @@ export class NavbarComponent implements OnInit { public isOnlyGatewayAdmin = false; isCollapsed = false; - user: User; isVisible = true; @@ -39,9 +36,7 @@ export class NavbarComponent implements OnInit { constructor( private authService: AuthService, public translate: TranslateService, - private router: Router, private sharedVariableService: SharedVariableService, - private loggedInService: LoggedInService, private meService: MeService, private route: Router, private matIconRegistry: MatIconRegistry, @@ -94,6 +89,7 @@ export class NavbarComponent implements OnInit { public onChange(organizationId: string) { this.sharedVariableService.setValue(+organizationId); this.setLocalPermissionCheck(+organizationId); + this.selected = +organizationId; if (this.route.url === "/" || this.route.url === "/applications") { window.location.reload(); @@ -116,9 +112,7 @@ export class NavbarComponent implements OnInit { OrganizationAccessScope.UserAdministrationWrite, orgId ); - this.isGlobalAdmin = this.userResponse?.permissions?.some(({ type: pmTypes }) => - pmTypes.some(pmType => pmType.type === PermissionType.GlobalAdmin) - ); + this.isGlobalAdmin = this.meService.hasGlobalAdmin(); this.isOnlyGatewayAdmin = this.userResponse.permissions.every(({ type: pmTypes }) => pmTypes.some(pmType => pmType.type === PermissionType.OrganizationGatewayAdmin) ); diff --git a/src/app/shared/components/basic-tab-switch/basic-tab-switch.component.scss b/src/app/shared/components/basic-tab-switch/basic-tab-switch.component.scss index bf219076..016caf8a 100644 --- a/src/app/shared/components/basic-tab-switch/basic-tab-switch.component.scss +++ b/src/app/shared/components/basic-tab-switch/basic-tab-switch.component.scss @@ -14,10 +14,15 @@ justify-content: center; font-size: 16px; padding: 0 20px; + cursor: pointer; +} + +.tab-base:hover { + background-color: $white; } .active-tab { - background-color: $white !important; + background-color: $white; color: $default-icon-color; fill: $default-icon-color; } @@ -25,7 +30,7 @@ .inactive-tab { fill: $color-link !important; color: $color-link; - background-color: transparent !important; + background-color: transparent; } .active-tab-icon { diff --git a/src/app/shared/components/map/map.component.ts b/src/app/shared/components/map/map.component.ts index 271d079b..65c65309 100644 --- a/src/app/shared/components/map/map.component.ts +++ b/src/app/shared/components/map/map.component.ts @@ -42,6 +42,7 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy private map: leaflet.Map; private marker: leaflet.Marker; private markers: any; + private gatewayMarkers: any; private zoomLevel = 13; private redMarker = "/assets/images/red-marker.png"; private greenMarker = "/assets/images/green-marker.png"; @@ -169,6 +170,9 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy if (this.markers) { this.markers.clearLayers(); } + if (this.gatewayMarkers) { + this.gatewayMarkers.clearLayers(); + } if (this.coordinateList) this.placeMarkers(); } @@ -216,7 +220,7 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy if (this.isFromApplication) { if (!coord.markerInfo.isDevice) { gatewayLayerGroup.push(this.addMarker(coord.latitude, coord.longitude, coord.draggable, coord.markerInfo)); - this.markers = leaflet.layerGroup(gatewayLayerGroup).addTo(this.map); + this.gatewayMarkers = leaflet.layerGroup(gatewayLayerGroup).addTo(this.map); } else { clusterGroup.addLayer(this.addMarker(coord.latitude, coord.longitude, coord.draggable, coord.markerInfo)); } diff --git a/src/app/shared/components/top-bar/top-bar.component.html b/src/app/shared/components/top-bar/top-bar.component.html index 8483dd47..b321a9d0 100644 --- a/src/app/shared/components/top-bar/top-bar.component.html +++ b/src/app/shared/components/top-bar/top-bar.component.html @@ -1,6 +1,6 @@ @@ -9,43 +9,45 @@
+
- - - {{ "USER_PAGE.USER_PAGE" | translate }} {{ "NAV.LOGOUT" | translate }} + >{{ "NAV.LOGOUT" | translate }}
@@ -55,11 +57,11 @@