Map ortofoto and custom dashboard

src/app/dashboard/components/dashboard.component.html

@@ -5,11 +5,14 @@
     <p-tabPanel header="Dashboard">
       <unit-list [user]="loggedUser" [units]="units"></unit-list>
     </p-tabPanel>
-    <p-tabPanel header="Map view">
+    <p-tabPanel header="Map">
       <ng-template pTemplate="content">
         <app-map [units]="units"></app-map>
       </ng-template>
     </p-tabPanel>
+    <p-tabPanel header="Custom dashboard">
+        <unit-list [user]="loggedUser" [units]="cstmUnits"></unit-list>
+    </p-tabPanel>
   </p-tabView>
 </div>
 

src/app/dashboard/components/dashboard.component.ts

@@ -12,12 +12,13 @@ import {ConfirmationService, MenuItem, MessageService} from 'primeng/api';
 import {ManagementService} from '../../shared/api/endpoints/services/management.service';
 import {ToastService} from '../../shared/services/toast.service';
 import {map} from 'rxjs/operators';
-import {HttpResponse} from '@angular/common/http';
+import {HttpClient, HttpResponse} from '@angular/common/http';
 import {AuthService} from '../../auth/services/auth.service';
 import {User} from '../../auth/models/user';
 import {SensorType} from '../../shared/api/endpoints/models/sensor-type';
-import {Subscription} from 'rxjs';
+import {forkJoin, Subscription} from 'rxjs';
 import {ActivatedRoute} from '@angular/router';
+import {Config} from '../../shared/api/endpoints/models/config';
 
 @Component({
   selector: 'app-dashboard',
@@ -30,6 +31,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
   position: 'bottom';
   groups: Group[];
   units: Array<{ drivers?: Drivers; generalInfo?: GeneralInfo; holder?: any; lastpos?: Lastpos; sensors?: Array<Sensor>; unit?: Unit }>;
+  cstmUnits: Array<{ drivers?: Drivers; generalInfo?: GeneralInfo; holder?: any; lastpos?: Lastpos; sensors?: Array<Sensor>; unit?: Unit }>;
   editedUnit: Unit;
   showEditUnitPopup = false;
   showInsertSensorPopup = false;
@@ -49,7 +51,8 @@ export class DashboardComponent implements OnInit, OnDestroy {
     // private managementService: ManagementService,
     private toastService: ToastService,
     private authService: AuthService,
-    private route: ActivatedRoute
+    private route: ActivatedRoute,
+    private http: HttpClient
   ) {
     this.initData();
   }
@@ -97,10 +100,70 @@ export class DashboardComponent implements OnInit, OnDestroy {
    * Get all units and theirs sensors from backend
    */
   getUnits() {
+    forkJoin({
+      masterData: this.dataService.getData(),
+      config: this.http.get<Config>('assets/example.json')
+    }).subscribe({
+      next: ({ masterData, config }) => {
+        console.log(masterData);
+
+        // 1. Store and sort the raw master data
+        this.units = masterData;
+        this.units.forEach(u => u.sensors?.sort((a, b) => (a.sensorId ?? 0) - (b.sensorId ?? 0)));
+
+        // 2. Extract configuration selections
+        const { units: unitSelections, globalSensors } = config.preferences.selections;
+
+        // 3. Perform the filtering logic
+        this.cstmUnits = this.units.map(masterUnit => {
+
+          // Find specific config for this unit
+          const selection = unitSelections.find(u => u.unitId === masterUnit.unit?.unitId);
+
+          const filteredSensors = (masterUnit.sensors || []).filter(sensor => {
+            const sId = sensor.sensorId;
+            if (sId === undefined) return false;
+
+            const isGlobal = globalSensors.includes(sId);
+            let isLocallySelected = false;
+
+            if (selection) {
+              isLocallySelected = selection.sensors === 'ALL' ||
+                  (Array.isArray(selection.sensors) && selection.sensors.includes(sId));
+            }
+
+            return isGlobal || isLocallySelected;
+          });
+
+          // Return the unit structure with the new filtered sensor array
+          return {
+            ...masterUnit,
+            sensors: filteredSensors
+          };
+        })
+            // 4. Final step: Only keep units that have at least one valid sensor
+            .filter(u => u.sensors.length > 0);
+
+        console.log('Filtered cstmUnits:', this.cstmUnits);
+      },
+      error: (err) => {
+        this.toastService.showError(err.error?.message || 'Error loading data');
+      }
+    });
+
+    /*
     this.dataService.getData().subscribe(data => {
       this.units = data;
       this.units.forEach(unit => unit.sensors.sort((a, b) => a.sensorId - b.sensorId));
+
+      // according to the config file filter through units
+      this.cstmUnits = [this.units[0]];
+
+      console.log(this.units);
+      console.log(this.units[0].unit);
+      console.log(this.units[0].sensors);
     }, err => this.toastService.showError(err.error.message));
+     */
   }
 
   /**

src/app/dashboard/components/map/map.component.ts

@@ -2,7 +2,7 @@ import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@
 import { ConfirmationService, MenuItem, MessageService } from 'primeng/api';
 import { Extent } from 'ol/extent';
 import { Group, Tile, Vector as VectorLayer } from 'ol/layer';
-import { OSM, TileArcGISRest, Vector as VectorSource } from 'ol/source';
+import {OSM, TileArcGISRest, TileWMS, Vector as VectorSource} from 'ol/source';
 import GeoJSON from 'ol/format/GeoJSON';
 import { transform, transformExtent } from 'ol/proj';
 import { Circle as CircleStyle, Fill, Stroke, Style } from 'ol/style';
@@ -67,21 +67,27 @@ export class MapComponent implements OnInit, OnDestroy, OnChanges {
               }
             }),
             new Tile({
-              // extent: [-13884991, 2870341, -7455066, 6338219],
-              source: new TileArcGISRest({
-                url: 'https://ags.cuzk.gov.cz/arcgis1/rest/services/ORTOFOTO_WM/MapServer',
-                // zkusit: https://ags.cuzk.gov.cz/arcgis1/rest/services/ORTOFOTO_WM/MapServer/WMTS
-                // nebo obyč: https://ags.cuzk.gov.cz/arcgis1/services/ORTOFOTO/MapServer/WMSServer
-              }),
               visible: false,
+              source: new TileWMS({
+                url: 'https://ags.cuzk.gov.cz/arcgis1/services/ORTOFOTO_WM/MapServer/WMSServer',
+                crossOrigin: 'anonymous',
+                params: {
+                  LAYERS: '0',
+                  TILED: true,
+                  FORMAT: 'image/jpeg',
+                  VERSION: '1.3.0' // Explicit version helps handshake
+                },
+                attributions: '&copy; <a href="https://geoportal.cuzk.cz" target="_blank">ČÚZK</a>'
+              }),
+              // HSLayers-specific properties
               properties: {
                 title: 'Ortofoto ČÚZK',
                 base: true,
                 removable: false,
+                path: 'Base layer',
                 thumbnail: 'hslayers-ng/assets/img/orto.png'
               }
-
-            }),
+            })
           ]
         })
       ],
@@ -130,7 +136,7 @@ export class MapComponent implements OnInit, OnDestroy, OnChanges {
         const mapObj = this.HsMapService.getMap();
 
         const unitsExtent: Extent = this.unitsLayer.getSource().getExtent();
-        mapObj.getView().fit(unitsExtent, { size: mapObj.getSize() });
+        mapObj.getView().fit(unitsExtent, { padding: [50, 50, 50, 50], size: mapObj.getSize() });
 
         mapObj.on('pointermove', function (evt) {
           const hit = this.forEachFeatureAtPixel(evt.pixel, function (feature, layer) {
@@ -193,7 +199,7 @@ export class MapComponent implements OnInit, OnDestroy, OnChanges {
       features: new GeoJSON().readFeatures(geoJsonUnits),
     });
     vectorSource.on('addfeature', function () {
-      map.getView().fit(vectorSource.getExtent());
+      map.getView().fit(vectorSource.getExtent(), { padding: [50, 50, 50, 50]});
     });
 
     const vectorLayer = new VectorLayer({

src/app/shared/api/endpoints/models/config.ts

@@ -0,0 +1,8 @@
+export interface Config {
+    preferences: {
+        selections: {
+            units: { unitId: number; sensors: number[] | 'ALL' }[];
+            globalSensors: number[];
+        };
+    };
+}

src/assets/example.json

@@ -0,0 +1,19 @@
+{
+  "userId": "zcu",
+  "preferences": {
+    "displayMode": "dashboard",
+    "selections": {
+      "units": [
+        {
+          "unitId": 1305167562258386,
+          "sensors": "ALL"
+        },
+        {
+          "unitId": 1305167562287501,
+          "sensors": [460080000]
+        }
+      ],
+      "globalSensors": [480080000]
+    }
+  }
+}