Editace fotek v modalu, lepsi datetime picker

src/components/flights/FlightsList.vue

@@ -2,6 +2,7 @@
 import {formatDatetime, minutesToHumanReadable} from "src/composables/datetimeUtils";
 import {computed} from "vue";
 import {useQuasar} from "quasar";
+import {useFlightsStore} from "stores/Flights";
 
 const props = defineProps({
   items: {
@@ -19,11 +20,10 @@ const deleteFlight = (flightId) => {
     cancel: true,
     persistent: true
   }).onOk(() => {
-    // flightsStore.deleteItem(flightId);
+    useFlightsStore().deleteItem(flightId);
   })
 }
 
-
 const totalFlightTime = computed(() => {
   return props.items.reduce((acc, flight) => acc + flight.flightDurationMinutes, 0);
 })

src/components/flights/PhotoForm.vue

@@ -0,0 +1,35 @@
+<script setup>
+import {computed, onMounted, ref} from "vue";
+import {setDefaultData} from "src/composables/form/formHandling";
+import DialogWrapper from "components/DialogWrapper.vue";
+import FormWrapper from "components/FormWrapper.vue";
+
+const props = defineProps({
+  photo: {
+    type: Object
+  }
+});
+
+const photoId = computed(() => props.photo?.id || null);
+const formData = ref({
+  name: "",
+  description: ""
+});
+
+const setup = (() => {
+  setDefaultData(formData.value, props.photo || {});
+})
+</script>
+
+<template>
+  <DialogWrapper :formData="formData" :object-id="photoId" @show="setup">
+    <q-img :src="photo.thumbnailUrl"/>
+
+    <q-card-section>
+      <FormWrapper :save-button="false">
+        <q-input v-model="formData.name" label="Název"/>
+        <q-input type="textarea" v-model="formData.description" label="Popis"/>
+      </FormWrapper>
+    </q-card-section>
+  </DialogWrapper>
+</template>

src/components/flights/form/FlightFormBasic.vue

@@ -64,12 +64,6 @@ onMounted(() => {
 
 <template>
   <FormWrapper v-model="formData" v-if="isMounted">
-
-    <!--    {{ formData }}-->
-    <!--    <hr>-->
-    <!--    {{ flight }}-->
-    <!--    <hr>-->
-
     <div class="row">
       <div class="col">
         <q-select
@@ -92,35 +86,26 @@ onMounted(() => {
     <template v-if="formData.aircraftId">
       <div class="row">
         <div class="col col-12 col-md-6">
-          <!--          <h3>Vzlet</h3>-->
+          <h3>Vzlet</h3>
           <AnotherDatetimePicker v-model="formData.takeoffDatetime" label="Datum a čas vzletu: "/>
           <AirportLocationInput v-model="formData.takeoffAirportId" :airports="airports" label="Letiště vzletu" takeoff/>
         </div>
         <div class="col col-12 col-md-6" v-if="!!formData.takeoffDatetime && !!formData.takeoffAirportId">
 
-          <!--          <h3>Přistání</h3>-->
+          <h3>Přistání</h3>
           <AnotherDatetimePicker v-model="formData.landingDatetime" label="Datum a čas přistání"/>
           <AirportLocationInput v-model="formData.landingAirportId" :airports="airports" label="Letiště přistání" landing/>
         </div>
       </div>
 
-      <div class="row">
+      <div class="row" v-if="formData.landingAirportId">
         <div class="col">
           <q-checkbox v-model="formData.solo" label="Solo?"/>
         </div>
-      </div>
-
-      <div class="row" v-if="formData.landingAirportId">
         <div class="col">
           <q-input v-model="formData.landings" label="Počet přistání" type="number" min="1"/>
         </div>
-        <div class="col">
-          <q-input v-model="formData.durationTotal" readonly min=0 label="Délka letu (v minutách)" type="number"/>
-        </div>
       </div>
-
-
-      <!--      <TabsStepper v-model="formStep" next-step="track" v-if="formData.landingAirportId"/>-->
     </template>
   </FormWrapper>
 </template>

src/components/flights/form/FlightFormPhotos.vue

@@ -12,39 +12,10 @@ const props = defineProps({
 const formData = reactive({
   photos: []
 });
-
-const deletePhoto = (id) => {
-  console.log(id);
-};
-
-const openEdit = (photo) => {
-
-};
-
 </script>
 
 <template>
   <FormWrapper v-model="formData">
-    <div class="row">
-      <div class="col-12 col-md-4 col-lg-3" v-for="photo in flight.photos" :key="photo.id">
-        <q-card class="q-my-sm q-mx-sm">
-          <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
-            <div class="absolute-bottom">
-              <div class="text-h6">{{ photo.name }} jmeno</div>
-              <div class="text-subtitle2">{{ photo.description }}nejaky popis</div>
-            </div>
-          </q-img>
-
-          <q-card-actions>
-            <q-btn flat icon="edit" color="blue" @click="openEdit(photo)"></q-btn>
-            <q-btn flat icon="delete" color="red" @click="deletePhoto(photo.id)"></q-btn>
-
-          </q-card-actions>
-        </q-card>
-      </div>
-    </div>
-
-
     <q-file multiple v-model="formData.photos" label="Fotky"/>
   </FormWrapper>
 </template>