fix: 🐛 fixed issue in both back and frontend that would prevent geojson data from beeing loaded

app.py

@@ -7,7 +7,7 @@ from sqlalchemy.orm import sessionmaker, Session
 from modules.driverHandler import DriverHandler
 from modules.gpxInterpreter import GPXHandler
 from modules.vehicleHandler import VehicleHandler
-from modules.geoObjects import create_table, db_connect
+from modules.geoObjects import Waypoint, create_table, db_connect, Driver, Vehicle
 from flask_cors import CORS, cross_origin
 
 root = logging.getLogger()
@@ -52,7 +52,9 @@ def serve_vue_app():
 @cross_origin()
 def getTrack():
 
-    if "start" in request.args and "end" in request.args or "track" in request.args:
+    app.logger.debug(f"found arguments {request.args}")
+    
+    if ("start" in request.args and "end" in request.args) or ("id" in request.args):
         if "start" in request.args and "end" in request.args:
             # get tracks by filter
             start = request.args["start"]
@@ -60,21 +62,23 @@ def getTrack():
             try:
                 return gpxHandler.getTracksInTime(start, request.args["end"]), 200
             except Exception as e:
-                app.logger.debug(f"failed to search tracks error {
-                                 e} values: start={start}, end={end}")
+                app.logger.debug(f"failed to search tracks error {e} values: start={start}, end={end}")
                 return f"error {e}", 500
 
-        elif "track" in request.args:
+        elif "id" in request.args:
             # get track by id
-            track = int(request.args["track"])
+            trackID = int(request.args["id"])
             try:
-                return gpxHandler.getTrack(track), 200
-            except Exception as e:
-                app.logger.debug(f"fetching track {
-                                 track} failed with error {e}")
-                return f"error {e}", 500
+                app.logger.debug(f"Request args: {request.args}")
+                app.logger.debug(f"track id {trackID}")
+                track = gpxHandler.getTrack(trackID)
                                 
-        pass
+                app.logger.debug(f"returned track {track}")
+                                
+                return jsonify(track), 200
+            except Exception as e:
+                app.logger.debug(f"fetching track failed with error {e}")
+                return f"error {e}", 500
     else:
         try:
             # gets all tracks as list
@@ -181,18 +185,32 @@ def uploadFile():
         app.logger.debug("no file was found in clients request")
         return "no file provided", 400
 
-    if request.args["routeName"] == '':
-        app.logger.debug("client did not provide any name for uploaded route")
-        return "no route name provided", 400
-
     file = request.files['file']
     if file.filename == '':
         app.logger.debug("filename was found empty")
         return "no file selected", 400
 
     try:
-        app.logger.debug(f"attempting to parse file: {file.name}")
-        gpxHandler.parse(file, request.args["routeName"])
+
+        app.logger.debug(f"Received file: {file.filename}, size: {len(file.read())} bytes")
+        file.seek(0)  # Setzt den Datei-Zeiger zurück, nachdem die Größe abgerufen wurde.
+        
+        file_path = f'./uploads/{file.filename}'
+        with open(file_path, 'wb') as f:
+            f.write(file.read())
+                
+        driver = driverHandler.getDriver(1)
+        vehicle = vehicleHandler.getVehicle(1)
+        
+        app.logger.debug(f"driver {driver.id}")
+        app.logger.debug(f"vehicle {vehicle.id}")
+        
+        if not driver or not vehicle:
+            raise ValueError("Driver or vehicle not found")
+        
+        app.logger.debug(f"attempting to parse file: {file.filename}")
+        gpxHandler.parse(file.filename, driver, vehicle)
+        
         return "file stored succesfull", 200
     except Exception as e:
         app.logger.debug(f"storing gpx file failed with error {e}")

modules/driverHandler.py

@@ -1,5 +1,6 @@
 from sqlalchemy.orm import Session
 
+from errors.NotFoundException import NotFoundError
 from modules.geoObjects import Driver
 
 
@@ -27,14 +28,13 @@ class DriverHandler:
             raise RuntimeError(f"failed to create driver with errors{e}")
         
     # handles getting a driver by its id from the database
-    def getDriver(self, driverID: int):
+    def getDriver(self, driverID: int) -> Driver:
         try:
             driver = self.dbSession.query(Driver).filter_by(id=driverID).first()
-            
-            return {
-                "id": driver.id,
-                "name": driver.name
-            }
+            if driver:
+                return driver
+            else:
+                raise NotFoundError(f"Driver with ID {driverID} not found", errors=[])
         except Exception as e:
             raise RuntimeError(f"failed to get driver with errors{e}")
         

modules/geoObjects.py

@@ -1,4 +1,4 @@
-from sqlalchemy                 import create_engine, Column, Table, ForeignKey, Index, UniqueConstraint, MetaData, SmallInteger, Integer, String, Date, DateTime, Float, Boolean, Text, Numeric, DateTime
+from sqlalchemy import create_engine, Column, ForeignKey, Integer, String, Date, Float, DateTime
 from sqlalchemy.orm import relationship, sessionmaker
 from sqlalchemy.ext.declarative import declarative_base
 from sqlalchemy.pool import NullPool
@@ -38,14 +38,10 @@ class Track(Base):
     date = Column(Date, nullable=True)
     distance = Column(Float, nullable=False, default=0)
     speed = Column(Float, nullable=False, default=0)
-    start = Column(DateTime, nullable=False)
-    end = Column(DateTime, nullable=False)
     
-    # Beziehungen zu anderen Tabellen
+    driver = relationship("Driver", backref="vehicle_tracks")  # 'vehicle_tracks' als backref
+    vehicle = relationship("Vehicle", backref="driver_tracks")  # 'driver_tracks' als backref
     waypoints = relationship('Waypoint', backref='track', lazy=True)
-    driver = relationship('Driver', back_populates='tracks')
-    vehicle = relationship('Vehicle', back_populates='tracks')
-
 
 class Waypoint(Base):
     __tablename__ = 'waypoint'
@@ -57,20 +53,16 @@ class Waypoint(Base):
     time = Column(DateTime, nullable=True)
     track_id = Column(Integer, ForeignKey('track.id'), nullable=False)
 
-
 class Driver(Base):
     __tablename__ = 'driver'
-    id = Column(Integer, primary_key=True, autoincrement=True)
+
+    id = Column(Integer, primary_key=True)
     name = Column(String, nullable=False)
-    
-    # Beziehung zu Track, zurück über 'tracks' auf Track-Seite
-    tracks = relationship("Track", back_populates='driver')
-
+    tracks = relationship("Track", back_populates="driver")  # Beziehung von Track -> Driver
 
 class Vehicle(Base):
     __tablename__ = 'vehicle'
-    id = Column(Integer, primary_key=True, autoincrement=True)
-    name = Column(String, nullable=False)
 
-    # Beziehung zu Track, zurück über 'tracks' auf Track-Seite
-    tracks = relationship('Track', back_populates='vehicle')
+    id = Column(Integer, primary_key=True)
+    name = Column(String, nullable=False)
+    tracks = relationship("Track", back_populates="vehicle")  # Beziehung von Track -> Vehicle

modules/gpxInterpreter.py

@@ -6,7 +6,7 @@ from geojson import Feature, LineString
 from geopy.distance import geodesic
 
 from errors.NotFoundException import NotFoundError
-from modules.geoObjects import Track, Waypoint
+from modules.geoObjects import Driver, Track, Vehicle, Waypoint
 
 class GPXHandler:
     __dbSession: Session
@@ -16,8 +16,9 @@ class GPXHandler:
         pass
     
     # handles converting a gpx file into usable data
-    def parse(self, file, driver, vehicle):
-        self.__gpx = gpxpy.parse(file)
+    def parse(self, file, driver:Driver, vehicle:Vehicle):
+        print(f"filename: {file}")
+        self.__gpx = gpxpy.parse(open(f"./uploads/{file}"))
 
         if not driver:
             raise ValueError("no driver found")
@@ -34,47 +35,45 @@ class GPXHandler:
             trackName = track.name or f"Track-{datetime.now().isoformat()}" # todo using time.now might end up being misleading and to be reworked
             
             # initializes track values
-            self.__startTime, 
-            self.__endTime, 
-            self.__trackDistance, 
-            self.__waypoints = None, None, 0, []
+            self.startTime = None 
+            self.endTime = None
+            self.trackDistance = 0
+            self.waypoints = []
 
             # grab all waypoints from a track
             for segment in track.segments:
                 for point in segment.points:
-                    self.__waypoints.append(point)
-                    if start_time is None or point.time < start_time:
-                        start_time = point.time
-                    if end_time is None or point.time > end_time:
-                        end_time = point.time
+                    self.waypoints.append(point)
+                    if self.startTime is None or point.time < self.startTime:
+                        self.startTime = point.time
+                    if self.endTime is None or point.time > self.endTime:
+                        self.endTime = point.time
                         
             # calculate distance between 2 waypoints
-            for i in range(1, len(self.__waypoints)):
-                total_distance += self.__waypoints[i - 1].distance_3d(self.__waypoints[i])
+            for i in range(1, len(self.waypoints)):
+                self.trackDistance += self.waypoints[i - 1].distance_3d(self.waypoints[i])
         
             # push values to the database
             track = Track(
                 trackName=trackName,
-                vehicle=vehicle.id,
-                driver=driver.id,
-                date=start_time.date() if start_time else None,
-                distance=total_distance,
+                vehicle=vehicle,
+                driver=driver,
+                date=self.startTime.date() if self.startTime else None,
+                distance=self.trackDistance,
                 speed=0,
-                start=start_time,
-                end=end_time
             )
                     
             self.__dbSession.add(track)
             self.__dbSession.commit()
         
-            for point in self.__waypoints:
+            for point in self.waypoints:
                 waypoint = Waypoint(
                     lat=point.latitude,
                     lon=point.longitude,
                     ele=point.elevation,
                     speed=None,
                     time=point.time,
-                    track=track.id
+                    track=track
                 )
                 self.__dbSession.add(waypoint)
 
@@ -84,10 +83,11 @@ class GPXHandler:
     def getTrack(self, trackID):
         track = self.__dbSession.query(Track).filter_by(id=trackID).first()
         if not track:
-            raise NotFoundError(f"track with id {trackID} not found")
+            raise NotFoundError(f"track with id {trackID} not found", errors=[])
 
         # fetches waypoints for a given track and converts them into geoJSON
-        waypoints = self.__dbSession.query(Waypoint).filter_by(track=track.id).all()
+        waypoints = track.waypoints
+
         coordinates = [(wp.lon, wp.lat) for wp in waypoints]
         feature = Feature(geometry=LineString(coordinates))
         return feature
@@ -109,8 +109,8 @@ class GPXHandler:
                 #     "name": track.vehicle.name
                 # } if track.vehicle else None,
                 # "distance": track.distance,
-                # "start_time": track.start.isoformat() if track.start else None,
-                # "end_time": track.end.isoformat() if track.end else None,
+                # "startTime": track.start.isoformat() if track.start else None,
+                # "endTime": track.end.isoformat() if track.end else None,
             }
             for track in tracks # iterates all tracks and appends them to the list
         ]
@@ -134,7 +134,7 @@ class GPXHandler:
                     "name": track.vehicle.name
                 } if track.vehicle else None,
                 "distance": track.distance,
-                "start_time": track.start.isoformat() if track.start else None,
+                "startTime": track.start.isoformat() if track.start else None,
                 "end_time": track.end.isoformat() if track.end else None,
             }
             for track in tracks # iterates all tracks and appends them to the list

modules/vehicleHandler.py

@@ -22,13 +22,10 @@ class VehicleHandler:
         return vehicle
     
     # handles getting a vehicle identified with its id from the database
-    def getVehicle(self, vehicleID:int):
+    def getVehicle(self, vehicleID:int) -> Vehicle:
         vehicle = self.dbSession.query(Vehicle).filter_by(id=vehicleID).first()
         
-        return {
-            "id": vehicle.id,
-            "name": vehicle.name
-        }
+        return vehicle
     
     # handles getting all vehicles from database
     def getVehicles(self):

web/src/classes/settings.ts

@@ -1,36 +0,0 @@
-enum SettingNodes {
-    allowDateCollect,
-    theme,
-    language,
-}
-
-/**
- * class which handles reading and writing settings
- */
-var SettingsHandler = class SettingsHandler implements ISettings{
-
-    settings:Map<SettingNodes, any>
-    constructor() {
-        this.settings = new Map<SettingNodes, any>();
-        // TODO: load settings from localstorage if any present
-    }
-
-    /**
-     * writes settings to the localstorage and handles errors
-     * @param name the settings name
-     * @param value
-     */
-    WriteSetting(name:SettingNodes, value:any):boolean {
-        return false
-    }
-
-    /**
-     * fetches settings from the localstorage and handles errors
-     * @param name the requested setting
-     */
-    FetchSetting(name:SettingNodes):any {
-        return ""
-    }
-}
-
-export {SettingsHandler, SettingNodes};

web/src/components/fileUpload.vue

@@ -33,6 +33,7 @@ export default defineComponent({
       const target = $event.target as HTMLInputElement;
       if (target && target.files) {
         file.value = target.files[0];
+        console.log(`selected file: ${file.value}`);
       }
     }
 
@@ -48,7 +49,10 @@ export default defineComponent({
       formData.append("driverId", selectedDriver.value.toString());    
 
       try {
-        const response = await fetch('http://localhost:5000/track', {
+
+        console.log('Request Body:', formData);
+
+        const response = await fetch('http://localhost:5000/upload', {
           method: 'POST',
           body: formData,
         });

web/src/components/map.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, onMounted, ref } from 'vue';
+import { defineComponent, onMounted, PropType, ref, watch } from 'vue';
 import "leaflet/dist/leaflet.css";
 import L from "leaflet";
 
@@ -7,28 +7,45 @@ export default defineComponent({
   name: 'Map',
   props: {
     geoJsonData: {
-      type: Object,
-      required: false,
-      default: null,
-    },
+      type: Object as PropType<any>,
+      required: true
+    }
   },
   setup(props) {
     const mapDiv = ref<HTMLElement | null>(null); // ref to map container element
+    const mapInstance = ref<any>(null); // reference for the Leaflet map
 
-    onMounted(() => {
+    const initializeMap = () => {
       if (mapDiv.value) {
-        const map = L.map(mapDiv.value, {
-          center: [51.4819, 7.2162], // Beispielkoordinaten, setze deine eigenen
+        mapInstance.value = L.map(mapDiv.value, {
+          center: [51.4819, 7.2162], // Beispielkoordinaten
           zoom: 13,
         });
 
-        // Hinzufügen der GeoJSON-Daten zur Karte
-        if (props.geoJsonData) {
-          L.geoJSON(props.geoJsonData).addTo(map);
-        }
-
         // Hinzufügen von OpenStreetMap-Kacheln
-        L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {}).addTo(map);
+        L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {}).addTo(mapInstance.value);
+      }
+    };
+
+    onMounted(() => {
+      console.log(props.geoJsonData)
+      initializeMap();
+    });
+
+    // Beobachte geoJsonData und füge sie der Karte hinzu, wenn sie sich ändert
+    watch(() => props.geoJsonData, (newData) => {
+      if (newData) {
+        console.log("Neue GeoJSON-Daten erhalten:", newData);
+
+        // Stelle sicher, dass die Karte initialisiert wurde
+        if (mapInstance.value) {
+            const geoJsonLayer = L.geoJSON(newData).addTo(mapInstance.value);
+
+            const bounds = geoJsonLayer.getBounds();
+            mapInstance.value.fitBounds(bounds);
+        } else {
+          console.error("Die Karte oder GeoJSON-Daten sind nicht verfügbar.");
+        }
       }
     });
 

web/src/interfaces/ISettings.ts

@@ -1,4 +0,0 @@
-interface ISettings {
-    WriteSetting: (name:SettingNodes, value:any) => boolean;
-    FetchSetting: (name:SettingNodes) => any;
-}

web/src/views/route.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import {defineComponent, ref, Ref, SetupContext} from 'vue';
+import { defineComponent, ref, Ref, SetupContext } from 'vue';
 import PointCloud from '../components/pointcloud.vue';
 import VueDatePicker from '@vuepic/vue-datepicker';
 import '@vuepic/vue-datepicker/dist/main.css'
@@ -7,105 +7,131 @@ import Map from '../components/map.vue';
 import FileUpload from '../components/fileUpload.vue';
 
 type DriverType = {
-  id:number
-  name:string
+  id: number
+  name: string
 }
 
 type track = {
-  id:number
-  name:string
+  id: number
+  name: string
   driver: DriverType
 }
 
+type GeoJSONFeature = {
+  type: "Feature";
+  geometry: {
+    type: "LineString";
+    coordinates: number[][];
+  };
+  properties: {
+    name: string;
+    driver: string;
+  };
+};
+
+type GeoJSON = {
+  type: "FeatureCollection";
+  features: GeoJSONFeature[];
+};
+
 export default defineComponent({
   name: 'map',
-  components: {PointCloud, VueDatePicker, Map, FileUpload},
+  components: { PointCloud, VueDatePicker, Map, FileUpload },
   setup(_, { emit }: SetupContext) {
-    const showMap:Ref<boolean> = ref(false);
-    const showCloud:Ref<boolean> = ref(false);
-    const search:Ref<boolean> = ref(false);
-    const showUpload:Ref<boolean> = ref(false);
-    const tracks:Ref<track[]> = ref([])
+    const showMap: Ref<boolean> = ref(false);
+    const showCloud: Ref<boolean> = ref(false);
+    const search: Ref<boolean> = ref(false);
+    const showUpload: Ref<boolean> = ref(false);
+    const tracks: Ref<track[]> = ref([])
     const startSearchDate = ref();
     const endSearchDate = ref();
-    const mapData = ref(null);
+    const mapData: Ref<GeoJSON | null> = ref(null);
 
-    const loadTrack = async (id:number) => {
+    const loadTrack = async (id: number) => {
       showMap.value = true;
       showCloud.value = false;
       search.value = false;
       showUpload.value = false;
 
-      const headers: Headers = new Headers()
-      headers.set('Content-Type', 'application/json')
-      headers.set('Accept', 'application/json')
+      const headers: Headers = new Headers();
+      headers.set('Content-Type', 'application/json');
+      headers.set('Accept', 'application/json');
 
       const request: RequestInfo = new Request("http://localhost:5000/track?id=" + id, {
-        method:"GET", 
-        headers:headers
-      })
+        method: "GET",
+        headers: headers
+      });
 
-      var response = await fetch(request)
+      try {
+        var response = await fetch(request);
 
-      // make sure the request was successfull
-      if (response.ok){
-        // convert vehicles from json response to processable data
-        mapData.value = await response.json()
+        if (response.ok) {
+          // Wenn die Antwort OK ist, die Daten verarbeiten
+          mapData.value = await response.json();
+
+          // Überprüfe, ob die Antwort die richtigen Daten enthält
+          if (mapData.value && mapData.value.features && mapData.value.features.length > 0) {
+            console.log("GeoJSON-Daten erfolgreich geladen", mapData.value);
           } else {
-        console.log(await response.text())
+            console.log("Keine GeoJSON-Daten in der Antwort.");
           }
-
+        } else {
+          console.log(await response.text());
         }
+      } catch (error) {
+        console.error("Fehler beim Laden der Track-Daten:", error);
+      }
+    };
 
-    const getTracks  = async() => {
+
+    const getTracks = async () => {
       const headers: Headers = new Headers()
       headers.set('Content-Type', 'application/json')
       headers.set('Accept', 'application/json')
 
       const request: RequestInfo = new Request("http://localhost:5000/track", {
-        method:"GET", 
-        headers:headers
+        method: "GET",
+        headers: headers
       })
 
       var response = await fetch(request)
       // make sure the request was successfull
-      if (response.ok){
+      if (response.ok) {
         var jsonBody = await response.json()
 
         // convert vehicles from json response to processable data
-        for(let i = 0; i < jsonBody.length; i++) {
-          tracks.value.push({id: jsonBody[i]["id"], name: jsonBody[i]["name"], driver: {
-            id: jsonBody[i]["driver"]["id"], name: jsonBody[i]["driver"]["name"]
-          }})
+        for (let i = 0; i < jsonBody.length; i++) {
+          tracks.value.push({ id: jsonBody[i]["id"], name: jsonBody[i]["name"], driver: { name: "", id: 0 } })
         }
       } else {
         console.log(await response.text())
       }
     }
 
-    const searchTracks = async() => {
+    const searchTracks = async () => {
       const headers: Headers = new Headers()
       headers.set('Content-Type', 'application/json')
       headers.set('Accept', 'application/json')
 
-      const request: RequestInfo = new Request("http://localhost:5000/track?start="+startSearchDate.value+"&end="+endSearchDate.value, {
-        method:"GET", 
-        headers:headers
+      const request: RequestInfo = new Request("http://localhost:5000/track?start=" + startSearchDate.value + "&end=" + endSearchDate.value, {
+        method: "GET",
+        headers: headers
       })
 
       var response = await fetch(request)
       // make sure the request was successfull
-      if (response.ok){
+      if (response.ok) {
         var jsonBody = await response.json()
+        console.log(jsonBody)
 
         // convert vehicles from json response to processable data
-        for(let i = 0; i < jsonBody.length; i++) {
+        for (let i = 0; i < jsonBody.length; i++) {
           tracks.value.push({
             id: jsonBody[i]["id"],
             name: jsonBody[i]["name"],
-            driver:{
-              name:jsonBody[i]["driver"]["name"], 
-              id:jsonBody[i]["driver"]["id"]
+            driver: {
+              name: jsonBody[i]["driver"]["name"],
+              id: jsonBody[i]["driver"]["id"]
             }
           })
         }
@@ -114,6 +140,8 @@ export default defineComponent({
       }
     }
 
+    getTracks()
+
     return {
       showMap,
       showCloud,
@@ -133,13 +161,18 @@ export default defineComponent({
 
 
 <template>
-  <FileUpload v-if="showUpload" @close="showUpload=false;" :drivers="[]" style="position:absolute; top: 30VH; width: 80%;"></FileUpload>
+  <FileUpload v-if="showUpload" @close="showUpload = false;" :drivers="[]"
+    style="position:absolute; top: 30VH; width: 80%;"></FileUpload>
   <div class="grid grid-flow-col auto-cols-max gap-4">
     <div>
       <ul class="menu menu-xs bg-base-200 rounded-lg w-full max-w-xs overscroll-auto">
-        <li> <a v-on:click="showUpload=true; showMap=false;showCloud=false;search=false;"> upload file </a> </li>
-        <li> <a v-on:click="search=true;showMap=false;showCloud=false;showUpload=false;"> filter track </a> </li>
-        <li><div class="divider"></div></li>
+        <li> <a v-on:click="showUpload = true; showMap = false; showCloud = false; search = false;"> upload file </a>
+        </li>
+        <li> <a v-on:click="search = true; showMap = false; showCloud = false; showUpload = false;"> filter track </a>
+        </li>
+        <li>
+          <div class="divider"></div>
+        </li>
         <li v-for="track in tracks"> <a v-on:click="loadTrack(track.id)"> {{ track.name }} </a> </li>
       </ul>
     </div>
@@ -158,10 +191,10 @@ export default defineComponent({
       <button class="btn btn-success" v-on:click="" style="margin-left: 5%; height:60px; width:120px;">Search</button>
     </div>
     <div v-if="showMap && !search && !showCloud">
-      <Map style="width: 68VW; margin-left: 10%; border-radius: 10px; border: 1px solid #95a5a6;"></Map>
+      <Map :geoJsonData="mapData"
+        style="width: 68vw; margin-left: 10%; border-radius: 10px; border: 1px solid #95a5a6;"></Map>
     </div>
   </div>
 </template>
 
-<style scoped>
-</style>
+<style scoped></style>

web/tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["./theme-manager.config.ts","./vite.config.ts","./src/app.vue","./src/leatflet.d.ts","./src/main.ts","./src/vite-env.d.ts","./src/classes/debugger.ts","./src/classes/language.ts","./src/components/settings.vue","./src/components/cookieprompt.vue","./src/components/fileupload.vue","./src/components/map.vue","./src/components/navbar.vue","./src/components/pointcloud.vue","./src/views/driver.vue","./src/views/home.vue","./src/views/login.vue","./src/views/register.vue","./src/views/route.vue","./src/views/settings.vue","./src/views/vehicle.vue"],"version":"5.6.2"}