Prace s mapou, refresh tokenu (tak nejak), uprava vypisu POI, pridani breadcrumbs

src/components/flights/FlightBasicInfo.vue

@@ -13,21 +13,38 @@ const props = defineProps({
 <template>
   <q-list bordered separator>
     <q-item>
-      <q-item-section avatar>
-        <q-icon name="flight_takeoff"/>
-      </q-item-section>
-      <q-item-section>
-        {{ flight.takeoffAirport.name }}
-      </q-item-section>
-    </q-item>
-    <q-item>
-      <q-item-section avatar>
-        <q-icon name="flight_land"/>
-      </q-item-section>
-      <q-item-section>
-        {{ flight.landingAirport.name }}
-      </q-item-section>
+
+      <q-list>
+        <q-item>
+          <q-item-section avatar>
+            <q-icon name="flight_takeoff"/>
+          </q-item-section>
+          <q-item-section>
+            {{ flight.takeoffAirport.name }}
+          </q-item-section>
+        </q-item>
+
+        <q-item v-for="poi in flight.track" :key="poi.id">
+          <q-item-section avatar>
+            <q-icon name="place"/>
+          </q-item-section>
+          <q-item-section>
+            {{ poi.pointOfInterest.name }}
+          </q-item-section>
+        </q-item>
+
+        <q-item>
+          <q-item-section avatar>
+            <q-icon name="flight_land"/>
+          </q-item-section>
+          <q-item-section>
+            {{ flight.landingAirport.name }}
+          </q-item-section>
+        </q-item>
+      </q-list>
     </q-item>
+
+
     <q-item>
       <q-item-section avatar>
         <q-icon name="event"/>
@@ -36,14 +53,6 @@ const props = defineProps({
         {{ formatDatetime(flight.takeoffDatetime) }}
       </q-item-section>
     </q-item>
-    <q-item>
-      <q-item-section avatar>
-        <q-icon name="thermostat"/>
-      </q-item-section>
-      <q-item-section>
-        Clouds: few, Wind: 220/12kt, Temp: 12°C
-      </q-item-section>
-    </q-item>
     <q-item>
       <q-item-section avatar>
         <q-icon name="schedule"/>
@@ -52,12 +61,22 @@ const props = defineProps({
         {{ minutesToHumanReadable(flight.durationMinCalculated) }}
       </q-item-section>
     </q-item>
+    <q-item>
+      <q-item-section avatar>
+        <q-icon name="thermostat"/>
+      </q-item-section>
+      <q-item-section>
+        Clouds: few, Wind: 220/12kt, Temp: 12°C
+      </q-item-section>
+    </q-item>
     <q-item v-if="!flight.solo">
       <q-item-section avatar>
         <q-icon name="people"/>
       </q-item-section>
       <q-item-section>
-        {{ flight.copilot.name }}
+        <router-link :to="{name: 'pilotDetail', params: {id: flight.copilot.id}}">
+          {{ flight.copilot.name }}
+        </router-link>
       </q-item-section>
     </q-item>
   </q-list>

src/components/flights/FlightsList.vue

@@ -12,21 +12,13 @@ const props = defineProps({
   }
 });
 
-const totalFlightTime = computed(() => {
-  return props.items.reduce((acc, flight) => acc + flight.flightDurationMinutes, 0);
-})
-
-const emit = defineEmits(["delete"]);
-const deleteFlight = (flightId) => {
-  emit("delete", flightId);
-}
 </script>
 
 <template>
   <div class="row">
-    <div class="col-12 col-md-4 col-lg-3" v-for="flight of items" :key="flight">
+    <div class="col-12 col-md-6 col-lg-4" v-for="flight of items" :key="flight">
 
-      <q-card class="q-my-sm q-mx-sm">
+      <q-card class="q-my-sm q-mx-sm" >
         <q-img :src="flight.coverPhoto.thumbnailUrl" v-if="flight.coverPhoto">
           <div class="absolute-bottom text-center text-h6">
             <router-link :to="{name: 'flightDetail', params:{id: flight.id}}" class="text-white">
@@ -50,16 +42,7 @@ const deleteFlight = (flightId) => {
             {{ flight.aircraft.callSign }}
           </div>
         </q-card-section>
-
-        <q-separator/>
-
-        <q-card-actions align="right">
-          <q-btn flat icon="edit" :to="{name: 'flightEdit', params:{id: flight.id}}"></q-btn>
-          <q-btn flat icon="delete" color="red" @click="deleteFlight(flight.id)"></q-btn>
-        </q-card-actions>
       </q-card>
     </div>
-
-    Total: {{ minutesToHumanReadable(totalFlightTime) }}
   </div>
 </template>

src/components/flights/form/FlightFormPhotos.vue

@@ -1,6 +1,7 @@
 <script setup>
 import FormWrapper from "components/FormWrapper.vue";
 import {reactive} from "vue";
+import ComboboxInput from "components/inputs/ComboboxInput.vue";
 
 const props = defineProps({
     flight: {
@@ -15,7 +16,18 @@ const formData = reactive({
 </script>
 
 <template>
-  <FormWrapper v-model="formData">
-    <q-file multiple v-model="formData.photos" label="Fotky"/>
+  <FormWrapper v-model="formData" :save-button='{
+      label: "Nahrát",
+      icon: "upload",
+      align: "left"
+    }'>
+    <q-file
+      class="q-my-lg"
+      outlined
+      standout
+      multiple
+      v-model="formData.photos"
+      label="Vybert fotky k nahrání"
+    />
   </FormWrapper>
 </template>