Bootstrap na planovac

src/pages/profile/flight/PlannerPage.vue

@@ -0,0 +1,34 @@
+<script setup>
+import MapWithMarkers from "components/map/MapWithMarkers.vue";
+import {onMounted, ref, watch} from "vue";
+import {usePointsOfInterestStore} from "stores/PointsOfInterest";
+import ComboboxInput from "components/inputs/ComboboxInput.vue";
+import {storeToRefs} from "pinia";
+import {debounce} from "quasar";
+import {commonProps} from "src/composables/inputs";
+
+const markers = ref([]);
+
+const place = ref("");
+
+const {pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
+// onMounted(() => {
+//   usePointsOfInterestStore().fetch({});
+// })
+
+watch(() => place.value, (newVal) => {
+  usePointsOfInterestStore().fetch({search: newVal});
+})
+
+const searchPosition = () => {
+
+}
+</script>
+
+<template>
+
+  <ComboboxInput :options="pointsOfInterest" v-bind="commonProps" :v-model="place" label="Misto" />
+  <q-btn @click="searchPosition">Najit</q-btn>
+
+  <MapWithMarkers :markers="markers" />
+</template>

src/router/routes.js

@@ -47,6 +47,8 @@ const routes = [
       {path: 'lety/novy', name: "addFlight", component: () => import('pages/profile/flight/NewFlightPage.vue')},
       {path: 'lety/:id', name: "flightDetail", component: () => import('pages/profile/flight/FlightDetailPage.vue')},
       {path: 'lety/:id/edit/:step?', name: "flightEdit", component: () => import('pages/profile/flight/EditFlightPage.vue')},
+      {path: 'planovani', name: "flightPlanner", component: () => import('pages/profile/flight/PlannerPage.vue')},
+
       {path: 'poi', name: "poi", component: () => import('pages/profile/poi/PointsOfInterestPage.vue')},
       {path: 'poi/novy', name: "addPOI", component: () => import('pages/profile/poi/NewPointOfInterestPage.vue')},
       {path: 'poi/:id', name: "poiDetail", component: () => import('pages/profile/poi/PointOfInterestDetailPage.vue')},