Optimalizace planovace, ikony pro letiste

src/components/flightPlans/FlightPlanMap.vue

@@ -40,10 +40,6 @@ const handleMarkerClick = (marker) => {
   mapWrap.value.openInfoWindow({marker});
 }
 
-const handlePoiClick = (poi) => {
-  mapWrap.value.openInfoWindow({poi});
-}
-
 const markers = ref([]);
 watch(() => props.flightPlan.track, (newVal) => {
   markers.value = getMarkersFrom(props.flightPlan);
@@ -56,14 +52,17 @@ const addMarker = async (point) => {
   if (!point) return;
 
   const insertAt = Math.min(markers.value.length, props.insertPosition);
-
   markers.value.splice(insertAt, 0, markerObject({...point}));
 
   emits("markers-changed", markers.value);
   emits("change-insert-position", insertAt + 1);
 }
 
-const removeMarker = (idx) => {
+const removeMarker = (infoWindow) => {
+  const idx = markers.value.findIndex(i => i.gpsLatitude === infoWindow.position.lat && i.gpsLongitude === infoWindow.position.lng);
+
+  if (!idx) return;
+
   markers.value.splice(idx, 1);
   emits("markers-changed", markers.value);
 }
@@ -85,6 +84,8 @@ const handleMarkerMove = async (idx, event) => {
     style="width: 100%; height: 100%; min-height: 500px"
     :center="center"
     :zoom="8"
+    :track="{path: track, geodesic: true, strokeColor: '#ff00ff', strokeOpacity: 1, strokeWeight: 3}"
+    :points-of-interest="pointsOfInterest"
     :airspaces-data="airspaceData"
     :airports="airports"
     v-bind="$attrs"
@@ -94,19 +95,7 @@ const handleMarkerMove = async (idx, event) => {
     :allow-add-marker="true"
     @add-to-route="addMarker"
     @remove-from-route="removeMarker"
-
   >
-    <template v-for="poi in pointsOfInterest" :key="poi.name">
-      <CustomMarker
-        v-if="poi.gpsLatitude && poi.gpsLongitude"
-        :options="{position: {lat: poi.gpsLatitude, lng: poi.gpsLongitude}, anchorPoint: 'BOTTOM_CENTER'}"
-        @click.stop="handlePoiClick(poi)"
-      >
-        <q-icon name="place" style="color: orange; font-size: 30px"/>
-      </CustomMarker>
-    </template>
-
-
     <template v-for="(marker, i) in markers" :key="marker.name">
       <Marker
         v-if="editableNameTypes.includes(marker.type)"
@@ -115,6 +104,5 @@ const handleMarkerMove = async (idx, event) => {
         @dragend="handleMarkerMove(i, $event.latLng)"
       />
     </template>
-    <Polyline :options="{path: track, geodesic: true, strokeColor: '#ff00ff', strokeOpacity: 1, strokeWeight: 3}"/>
   </MapWrapper>
 </template>