Ne uplne otestovany prepis storu

src/pages/profile/flight/FlightDetailPage.vue

@@ -2,11 +2,11 @@
 import {useRoute, useRouter} from "vue-router";
 import {computed, onMounted, ref, watch} from "vue";
 import FlightDetailSkeleton from "components/flights/FlightDetailSkeleton.vue";
-import {fetchFlight, flight, flightName, handleDeleteFlight, loading} from "src/composables/objects/flight";
+import {flightName} from "src/composables/objects/flight";
 import {useAppStore} from "stores/App";
 import FlightBasicInfo from "components/flights/FlightBasicInfo.vue";
 import {copyToClipboard, useQuasar} from "quasar";
-import {successObject} from "src/composables/dialog";
+import {confirmObject, successObject} from "src/composables/dialog";
 import {useFlightsStore} from "stores/Flights";
 import FlightTrackMap from "components/flights/FlightTrackMap.vue";
 import {useUserStore} from "stores/User";
@@ -19,37 +19,35 @@ const $router = useRouter();
 const flightId = parseInt(useRoute().params.id);
 const loggedUser = storeToRefs(useUserStore()).user;
 
-onMounted(() => {
-  fetchFlight(flightId);
+onMounted(() => {flight.value
+  useFlightsStore().fetchDetail(flightId).then(f => {
+    const flightNameFormatted = flightName(f);
+    useAppStore().setPageTitle(flightNameFormatted);
+    useAppStore().setBreadcrumbs([
+      {to: {name: "myFlights"}, label: "Moje lety"},
+      {label: flightNameFormatted}
+    ]);
+  })
 })
 
-watch(flight, (newVal) => {
-  const flightNameFormatted = flightName(newVal);
-  useAppStore().setPageTitle(flightNameFormatted);
-  useAppStore().setBreadcrumbs([
-    {to: {name: "myFlights"}, label: "Moje lety"},
-    {label: flightNameFormatted}
-  ]);
-});
-
 const handleDeleteAndRedirect = () => {
-  const flightId = flight.value.id;
-
-  handleDeleteFlight($q, flightId, (flight) => {
-    $router.push({name: "myFlights"});
-    $q.notify(successObject(`Úspěšně smazáno`));
-  })
+  $q.dialog(confirmObject("Opravdu chceš smazat tento let?"))
+    .onOk(() => {
+      useFlightsStore().destroy(flightId).then(() => {
+        $router.push({name: "myFlights"});
+        $q.notify(successObject(`Úspěšně smazáno`));
+      });
+    });
 }
 
 
 const togglePublicVisibility = () => {
   const newVisibility = !flight.value.isPublic;
   useFlightsStore()
-      .update(flightId, {isPublic: newVisibility})
-      .then((updatedFlight) => {
-        flight.value = updatedFlight;
-        $q.notify(successObject(newVisibility ? "Úspěšně publikováno" : "Úspěšně skryto"));
-      });
+    .update(flightId, {isPublic: newVisibility})
+    .then(() => {
+      $q.notify(successObject(newVisibility ? "Úspěšně publikováno" : "Úspěšně skryto"));
+    });
 };
 
 const copyLinkToClipboard = () => {
@@ -62,43 +60,36 @@ const copyLinkToClipboard = () => {
     $q.notify(successObject("Odkaz zkopírován"))
   });
 };
+
+const {isQueryRunning, flight} = storeToRefs(useFlightsStore());
 </script>
 
-
 <template>
-  <FlightDetailSkeleton v-if="loading || !flight"/>
+  <FlightDetailSkeleton v-if="isQueryRunning || !flight"/>
 
   <q-card class="flight-detail-card" v-else>
     <q-img :src="flight.coverPhoto.url" v-if="flight.coverPhoto">
-       <div class="absolute-bottom custom-caption">
-          <div class="text-h5"> {{ flightName(flight) }} </div>
-        </div>
+      <div class="absolute-bottom custom-caption">
+        <div class="text-h5"> {{ flightName(flight) }}</div>
+      </div>
     </q-img>
 
     <q-card-actions class="q-my-md">
       <div class="col-grow">
-<!--        <q-btn-->
-<!--            flat-->
-<!--            :to="{name: 'flightEdit', params:{id: flight.id}}"-->
-<!--            icon="edit"-->
-<!--            text-color="primary"-->
-<!--            label="Upravit"-->
-<!--        />-->
-
         <q-btn
-            @click="togglePublicVisibility"
-            :icon="flight.isPublic ? 'visibility_off' : 'visibility'"
-            :disable="!loggedUser.publicUsername"
-            flat
-            :label="flight.isPublic ? 'Skrýt' : 'Zveřejnit'"
+          @click="togglePublicVisibility"
+          :icon="flight.isPublic ? 'visibility_off' : 'visibility'"
+          :disable="!loggedUser.publicUsername"
+          flat
+          :label="flight.isPublic ? 'Skrýt' : 'Zveřejnit'"
         />
 
         <q-btn
-            icon="link"
-            @click="copyLinkToClipboard()"
-            flat
-            v-if="flight.isPublic"
-            label="Získat odkaz"
+          icon="link"
+          @click="copyLinkToClipboard()"
+          flat
+          v-if="flight.isPublic"
+          label="Získat odkaz"
         />
       </div>
       <q-btn @click="handleDeleteAndRedirect" icon="delete" flat text-color="red" label="Smazat"/>
@@ -124,30 +115,30 @@ const copyLinkToClipboard = () => {
         <q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}" icon="edit" color="primary">Upravit fotky</q-btn>
       </div>
       <BasicInfoBanner
-          v-if="flight.photos.length === 0"
-          :route-add="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}"
+        v-if="flight.photos.length === 0"
+        :route-add="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}"
       >
         U tohoto letu nemáš nahrané žádné fotografie.
       </BasicInfoBanner>
       <PhotoGallery
-          v-else
-          :photos="flight.photos"
+        v-else
+        :photos="flight.photos"
       />
 
       <q-separator/>
 
       <div class="text-right">
-        <q-btn class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'track'}}" icon="edit" color="primary">Upravit trasu</q-btn>
+        <q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'track'}}" icon="edit" color="primary">Upravit trasu</q-btn>
       </div>
       <BasicInfoBanner
-          v-if="flight.track.length === 0 && !flight.gpxTrack"
-          :route-add="{name: 'flightEdit', params: {id: flightId, step: 'track'}}"
+        v-if="flight.track.length === 0 && !flight.gpxTrack"
+        :route-add="{name: 'flightEdit', params: {id: flightId, step: 'track'}}"
       >
         Nemáš nastavenou žádnou trasu.
       </BasicInfoBanner>
       <FlightTrackMap
-          v-else
-          :flight="flight"
+        v-else
+        :flight="flight"
       />
     </q-card-section>
   </q-card>