Ne uplne otestovany prepis storu

src/pages/profile/aircraft/AircraftDetailPage.vue

@@ -5,43 +5,46 @@ import {useRoute, useRouter} from "vue-router";
 import {useQuasar} from "quasar";
 import AircraftDetailSkeleton from "components/aircrafts/AircraftDetailSkeleton.vue";
 import {successObject} from "src/composables/dialog";
-import {loading, aircraft, fetchAircraft} from "src/composables/objects/aircraft";
 import {useAppStore} from "stores/App";
 import FlightsList from "components/flights/FlightsList.vue";
 import AircraftDetailCard from "components/aircrafts/AircraftDetailCard.vue";
-import {poi} from "src/composables/objects/poi";
-import AccessDeniedBanner from "components/banners/AccessDeniedBanner.vue";
 import {storeToRefs} from "pinia";
-import {useUserStore} from "stores/User";
 
 const $q = useQuasar();
 const $router = useRouter();
 
 const aircraftId = parseInt(useRoute().params.id);
 onMounted(() => {
-  fetchAircraft(aircraftId);
+  useAircraftsStore().fetchDetail(aircraftId);
 })
 
-const deleteAircraft = (id) => {
-  useAircraftsStore().delete(id).then(() => {
-    $router.push({name: "aircrafts"});
-    $q.notify(successObject("Letadlo úspěšně odstraněno"));
-  });
-}
+const {aircraft, isQueryRunning} = storeToRefs(useAircraftsStore());
+watch(() => aircraft.value, (newVal) => {
+  if (!newVal) return;
 
-watch(aircraft, (newVal) => {
   useAppStore().setPageTitle(newVal.callSign);
   useAppStore().setBreadcrumbs([
     {label: "Letadla", to: {name: "aircrafts"}},
     {label: newVal.callSign}
   ])
 });
+
+const deleteAircraft = (id) => {
+  useAircraftsStore().destroy(id).then(() => {
+    $router.push({name: "aircrafts"});
+    $q.notify(successObject("Letadlo úspěšně odstraněno"));
+  });
+}
 </script>
 
 <template>
-  <AircraftDetailSkeleton v-if="loading || !aircraft"/>
+  <AircraftDetailSkeleton v-if="isQueryRunning || !aircraft"/>
+
   <template v-else>
-    <AircraftDetailCard :aircraft="aircraft" @delete="deleteAircraft" />
+    <AircraftDetailCard
+      :aircraft="aircraft"
+      @delete="deleteAircraft"
+    />
 
     <q-card class="flight-detail-card" flat>
       <h3>Lety</h3>

src/pages/profile/aircraft/AircraftsPage.vue

@@ -1,21 +1,25 @@
 <script setup>
 import {onMounted} from "vue";
 import AircraftsList from "components/aircrafts/AircraftsList.vue";
-import {aircrafts, fetchAircrafts, loading} from "src/composables/objects/aircraft";
 import FAB from "components/FAB.vue";
 import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
+import {useAircraftsStore} from "stores/Aircrafts";
+import {storeToRefs} from "pinia";
 
+const store = useAircraftsStore();
 onMounted(() => {
-  fetchAircrafts();
+  store.fetch();
 })
+
+const {aircrafts, isQueryRunning} = storeToRefs(store);
 </script>
 
 <template>
-  <BasicListSkeleton v-if="loading"/>
+  <BasicListSkeleton v-if="isQueryRunning"/>
 
   <BasicInfoBanner
-    v-if="!loading && aircrafts.length === 0"
+    v-if="!isQueryRunning && aircrafts.length === 0"
     :route-add="{name: 'addAircraft'}"
     label-add="Vytvořit letadlo"
   >

src/pages/profile/aircraft/EditAircraftPage.vue

@@ -6,9 +6,7 @@ import {useQuasar} from "quasar";
 import {onMounted} from "vue";
 import AircraftEditSkeleton from "components/aircrafts/AircraftEditSkeleton.vue";
 import {successObject} from "src/composables/dialog";
-import {aircraft, fetchAircraft, loading, isRequestPending} from "src/composables/objects/aircraft";
 import {useAppStore} from "stores/App";
-import {fetchOrganizations, organizations} from "src/composables/objects/organization";
 import AccessDeniedBanner from "components/banners/AccessDeniedBanner.vue";
 import {storeToRefs} from "pinia";
 import {useUserStore} from "stores/User";
@@ -25,9 +23,10 @@ const handleSave = (formData) => {
     $router.push({name: "aircraftDetail", params: {id: aircraftId}});
   })
 }
+const {aircraft, isMutationRunning, isQueryRunning} = storeToRefs(useAircraftsStore());
 
 onMounted(() => {
-  fetchAircraft(aircraftId).then(() => {
+  useAircraftsStore().fetchDetail(aircraftId).then(() => {
     useAppStore().setPageTitle(`${aircraft.value.callSign} - editace`);
     useAppStore().setBreadcrumbs([
       {to: {name: "aircraft"}, label: "Letadla"},
@@ -36,10 +35,11 @@ onMounted(() => {
     ])
   });
 });
+
 </script>
 
 <template>
-  <AircraftEditSkeleton v-if="loading"/>
+  <AircraftEditSkeleton v-if="isQueryRunning || !aircraft"/>
 
   <AccessDeniedBanner
     v-else-if="aircraft.createdById !== loggedUser.id"
@@ -52,7 +52,7 @@ onMounted(() => {
         @save="handleSave"
         :default-values="aircraft"
         :organizations="loggedUser.organizations"
-        :is-request-pending="isRequestPending"
+        :is-request-pending="isMutationRunning"
       />
     </q-card-section>
   </q-card>

src/pages/profile/aircraft/NewAircraftsPage.vue

@@ -5,8 +5,7 @@ import {useRouter} from "vue-router";
 import {useQuasar} from "quasar";
 import {useAppStore} from "stores/App";
 import {successObject} from "src/composables/dialog";
-import {isRequestPending} from "src/composables/objects/aircraft";
-import {fetchOrganizations, organizations} from "src/composables/objects/organization";
+import {fetchOrganizations} from "src/composables/objects/organization";
 import {onMounted} from "vue";
 import {storeToRefs} from "pinia";
 import {useUserStore} from "stores/User";
@@ -30,13 +29,16 @@ onMounted(() => {
     {label: "Nové"}
   ]);
 });
+
+const {isMutationRunning} = storeToRefs(useAircraftsStore());
+
 </script>
 
 <template>
   <q-card class="q-mx-md q-my-md">
     <q-card-section>
       <AircraftForm
-        :is-request-pending="isRequestPending"
+        :is-request-pending="isMutationRunning"
         :organizations="loggedUser.organizations"
         @save="handleSave"
       />