Aktualizace balicku, strnakovani, uprava hlavni stranky

src/pages/profile/ProfilePage.vue

@@ -1,5 +1,5 @@
 <script setup>
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import ProfileImagesForm from "components/profile/ProfileForm.vue";
 import {useAppStore} from "stores/App";
 import {storeToRefs} from "pinia";
@@ -10,14 +10,14 @@ import ChangePasswordForm from "components/profile/ChangePasswordForm.vue";
 import PublicProfileInfo from "components/profile/PublicProfileInfo.vue";
 
 useAppStore().setPageTitle("Profil");
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 
 const $q = useQuasar();
 const handleSave = async (formData) => {
-  await useUserStore().update(formData);
+  await useLoggedUserStore().update(formData);
   $q.notify(successObject("Úspěšně uloženo"));
 };
-const isRequestPending = storeToRefs(useUserStore()).isMutationRunning;
+const isRequestPending = storeToRefs(useLoggedUserStore()).isMutationRunning;
 const openedTab = ref("profile");
 </script>
 

src/pages/profile/ProfileRefreshPage.vue

@@ -0,0 +1,24 @@
+<script setup>
+
+import {useRoute, useRouter} from "vue-router";
+import {computed, onMounted} from "vue";
+import {useLoggedUserStore} from "stores/LoggedUser";
+import {useAuthStore} from "stores/Auth";
+
+const $route = useRoute();
+const $router = useRouter();
+
+const url = computed(() => $route.query.url);
+
+onMounted(() => {
+  useAuthStore().refreshAccessToken().then(() => {
+    console.log("refreshnuto", $route.query.url);
+    $router.push($route.query.url)
+  });
+});
+
+</script>
+
+<template>
+  {{ url }}
+</template>

src/pages/profile/aircraft/AircraftDetailPage.vue

@@ -14,7 +14,7 @@ import PhotoGallery from "components/photos/PhotoGallery.vue";
 import TitlePhotoWithGallery from "components/photos/TitlePhotoWithGallery.vue";
 import ContentCard from "components/ContentCard.vue";
 import AircraftInfo from "components/aircrafts/AircraftInfo.vue";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import {useFlightsStore} from "stores/Flights";
 import {toggleVisibility} from "src/composables/form/formHandling";
 import ContentCardEditButton from "components/ContentCardEditButton.vue";
@@ -24,7 +24,7 @@ const $router = useRouter();
 
 const aircraftId = parseInt(useRoute().params.id);
 useAircraftsStore().fetchDetail(aircraftId);
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 const {aircraft, isQueryRunning} = storeToRefs(useAircraftsStore());
 watch(() => aircraft.value, (newVal) => {
   if (!newVal) return;

src/pages/profile/aircraft/AircraftsPage.vue

@@ -6,18 +6,27 @@ import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import {useAircraftsStore} from "stores/Aircrafts";
 import {storeToRefs} from "pinia";
 import {useAppStore} from "stores/App";
+import FlightsList from "components/flights/FlightsList.vue";
+import {ref} from "vue";
+import {useFlightsStore} from "stores/Flights";
+import {loadPage, paginationLimit} from "src/composables/pagination";
 
-useAircraftsStore().fetch();
-const {aircrafts, isQueryRunning} = storeToRefs(useAircraftsStore());
 useAppStore().setPageTitle("Letadla");
 
+const loadNextAircraftsPage = (appendItems) => loadPage({
+  fetchFunc: useAircraftsStore().fetch,
+  appendItems
+});
+loadNextAircraftsPage(false);
+
+const {aircrafts, totalItemsCount, isQueryRunning} = storeToRefs(useAircraftsStore());
 </script>
 
 <template>
-  <BasicListSkeleton v-if="isQueryRunning || !aircrafts.length"/>
+  <BasicListSkeleton :items="paginationLimit" v-if="isQueryRunning && !totalItemsCount"/>
 
   <BasicInfoBanner
-    v-if="!isQueryRunning && aircrafts.length === 0"
+    v-if="!isQueryRunning && totalItemsCount === 0"
     :route-add="{name: 'addAircraft'}"
     label-add="Vytvořit letadlo"
   >
@@ -29,6 +38,12 @@ useAppStore().setPageTitle("Letadla");
   <AircraftsList
     v-else
     :items="aircrafts"
+    :total-items-count="totalItemsCount"
+    :is-query-running="isQueryRunning"
+    :items-per-page="paginationLimit"
+    :public="true"
+    class="q-mb-xl"
+    @load-more="loadNextAircraftsPage(true)"
   />
 
   <FAB mode="add" :router-link="{name: 'addAircraft'}"/>

src/pages/profile/aircraft/EditAircraftPage.vue

@@ -9,7 +9,7 @@ import {successObject} from "src/composables/dialog";
 import {useAppStore} from "stores/App";
 import AccessDeniedBanner from "components/banners/AccessDeniedBanner.vue";
 import {storeToRefs} from "pinia";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import PhotosEditorList from "components/photos/PhotosEditorList.vue";
 import CommonEditSwitcher from "components/navigation/CommonEditSwitcher.vue";
 import PhotoGallerySkeleton from "components/photos/skeletons/PhotoGallerySkeleton.vue";
@@ -17,7 +17,7 @@ import PhotoGallerySkeleton from "components/photos/skeletons/PhotoGallerySkelet
 const $router = useRouter();
 const $q = useQuasar();
 const aircraftId = parseInt(useRoute().params.id);
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 
 const {aircraft, isMutationRunning, isQueryRunning} = storeToRefs(useAircraftsStore());
 

src/pages/profile/flight/EditFlightPage.vue

@@ -42,11 +42,11 @@ watch(() => $route.params.step, (val) => formStep.value = val);
 onMounted(() => {
   formStep.value = $route.params.step || "basic";
 
-  useAircraftsStore().fetch();
-  usePointsOfInterestStore().fetch();
+  useAircraftsStore().fetch({});
+  usePointsOfInterestStore().fetch({});
   useAirportsStore().fetch();
   useCopilotsStore().fetch();
-  useEventsStore().fetch();
+  useEventsStore().fetch({});
 
   useFlightsStore().fetchDetail(flightId).then((f) => {
     const flightNameFormatted = flightName(f);
@@ -133,7 +133,7 @@ const updateSinglePhoto = (id, formData) => {
   return usePhotosStore().update(id, formData).then((data) => {
     const idx = _findPhotoIndex(data.id);
     flight.value.photos[idx] = data;
-    usePointsOfInterestStore().fetch();
+    usePointsOfInterestStore().fetch({});
   });
 }
 

src/pages/profile/flight/FlightDetailPage.vue

@@ -9,7 +9,7 @@ import {copyToClipboard, useQuasar} from "quasar";
 import {confirmObject, successObject} from "src/composables/dialog";
 import {useFlightsStore} from "stores/Flights";
 import FlightTrackMap from "components/flights/FlightTrackMap.vue";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import {storeToRefs} from "pinia";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import PhotoGallery from "components/photos/PhotoGallery.vue";
@@ -21,7 +21,7 @@ import {toggleVisibility} from "src/composables/form/formHandling";
 const $q = useQuasar();
 const $router = useRouter();
 const flightId = parseInt(useRoute().params.id);
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 
 useFlightsStore().fetchDetail(flightId);
 const {isQueryRunning, flight} = storeToRefs(useFlightsStore());
@@ -52,7 +52,7 @@ const togglePublicVisibility = () => toggleVisibility({
 });
 
 const copyLinkToClipboard = () => {
-  const loggedUser = useUserStore().user;
+  const loggedUser = useLoggedUserStore().user;
   const url = $router.resolve({
     name: "publicFlightDetail",
     params: {id: flightId, username: loggedUser.publicUsername}

src/pages/profile/flight/FlightsPage.vue

@@ -6,24 +6,48 @@ import {useAppStore} from "stores/App";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import {useFlightsStore} from "stores/Flights";
 import {storeToRefs} from "pinia";
+import {ref} from "vue";
 
 useAppStore().setPageTitle("Moje lety");
-useFlightsStore().fetch({});
-const {flights, isQueryRunning} = storeToRefs(useFlightsStore());
+
+const paginationLimit = ref(10);
+const paginationOffset = ref(0);
+
+const loadNextPage = (appendItems) => {
+  return useFlightsStore().fetch({
+    limit: paginationLimit.value,
+    offset: paginationOffset.value,
+    appendItems
+  }).then(() => {
+    paginationOffset.value += paginationLimit.value;
+  })
+}
+
+loadNextPage(false);
+const {flights, totalItemsCount, isQueryRunning} = storeToRefs(useFlightsStore());
 </script>
 
 <template>
   <FlightsListSkeleton v-if="isQueryRunning"/>
 
   <BasicInfoBanner
-    v-else-if="!isQueryRunning && flights.length === 0"
+    v-else-if="!isQueryRunning && totalItemsCount === 0"
     :route-add="{name: 'addFlight'}"
     label-add="Přidat let"
   >
     Nemáš zaznamenaný žádný let.
   </BasicInfoBanner>
 
-  <FlightsList v-else :items="flights" :public="false" />
+  <FlightsList
+    v-else
+    :items="flights"
+    :public="false"
+    :is-query-running="isQueryRunning"
+    :items-per-page="paginationLimit"
+    :total-items-count="totalItemsCount"
+    @load-more="loadNextPage(true)"
+
+  />
 
   <FAB mode="add" :router-link="{name: 'addFlight'}"/>
 </template>

src/pages/profile/flight/NewFlightPage.vue

@@ -12,9 +12,9 @@ import FlightFormBasic from "components/flights/form/FlightFormBasic.vue";
 import FlightEditSkeleton from "components/flights/skeletons/FlightEditSkeleton.vue";
 
 onMounted(() => {
-  useAircraftsStore().fetch()
-  usePointsOfInterestStore().fetch()
-  useFlightsStore().fetch()
+  useAircraftsStore().fetch({})
+  usePointsOfInterestStore().fetch({})
+  useFlightsStore().fetch({})
   useAirportsStore().fetch()
 
   useAppStore().setPageTitle("Nový let");

src/pages/profile/organization/OrganizationDetailPage.vue

@@ -4,7 +4,7 @@ import {computed, onMounted} from "vue";
 import {useAppStore} from "stores/App";
 import FAB from "components/FAB.vue";
 import {storeToRefs} from "pinia";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
 import AircraftsList from "components/aircrafts/AircraftsList.vue";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
@@ -13,7 +13,7 @@ import AvatarFromPhoto from "components/avatars/AvatarFromPhoto.vue";
 import {useOrganizationsStore} from "stores/Organizations";
 
 const organizationId = parseInt(useRoute().params.id);
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 const $q = useQuasar();
 
 onMounted(() => {

src/pages/profile/organization/OrganizationsPage.vue

@@ -7,12 +7,12 @@ import OrganizationsList from "components/organizations/OrganizationsList.vue";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import {useOrganizationsStore} from "stores/Organizations";
 import {storeToRefs} from "pinia";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 
 useOrganizationsStore().fetch();
 useAppStore().setPageTitle("Organizace");
 
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 const myOrganizationIds = computed(() => (loggedUser.value && loggedUser.value.organizations?.map(o => o.id)) || []);
 
 const {isQueryRunning, organizations} = storeToRefs(useOrganizationsStore());

src/pages/profile/poi/EditPointOfInterestPage.vue

@@ -9,7 +9,7 @@ import {successObject} from "src/composables/dialog";
 import {usePointsOfInterestTypeStore} from "stores/PointOfInterestType";
 import {storeToRefs} from "pinia";
 import POIForm from "components/poi/POIForm.vue";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import AccessDeniedBanner from "components/banners/AccessDeniedBanner.vue";
 import PhotoEditorSkeleton from "components/photos/skeletons/PhotoEditorSkeleton.vue";
 import PhotosEditorList from "components/photos/PhotosEditorList.vue";
@@ -32,7 +32,7 @@ usePointsOfInterestStore().fetchDetail(poiId).then((p) => {
 usePointsOfInterestTypeStore().fetch();
 
 const poiTypes = storeToRefs(usePointsOfInterestTypeStore()).types;
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 const {isQueryRunning, pointOfInterest, isMutationRunning} = storeToRefs(usePointsOfInterestStore());
 
 const $q = useQuasar();

src/pages/profile/poi/PointOfInterestDetailPage.vue

@@ -3,7 +3,7 @@ import {useRoute, useRouter} from "vue-router";
 import POIDetailSkeleton from "components/poi/skeletons/POIDetailSkeleton.vue";
 import {useAppStore} from "stores/App";
 import EmbeddedMap from "components/map/EmbeddedMap.vue";
-import {useUserStore} from "stores/User";
+import {useLoggedUserStore} from "stores/LoggedUser";
 import {storeToRefs} from "pinia";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import FlightsList from "components/flights/FlightsList.vue";
@@ -17,7 +17,7 @@ import ContentCardEditButton from "components/ContentCardEditButton.vue";
 import {useFlightsStore} from "stores/Flights";
 import FlightsListSkeleton from "components/flights/skeletons/FlightsListSkeleton.vue";
 
-const loggedUser = storeToRefs(useUserStore()).user;
+const loggedUser = storeToRefs(useLoggedUserStore()).user;
 const poiId = parseInt(useRoute().params.id);
 
 usePointsOfInterestStore().fetchDetail(poiId).then((p) => {

src/pages/profile/poi/PointsOfInterestPage.vue

@@ -6,28 +6,38 @@ import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
 import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
 import {usePointsOfInterestStore} from "stores/PointsOfInterest";
 import {storeToRefs} from "pinia";
+import {loadPage, paginationLimit} from "src/composables/pagination";
 
-usePointsOfInterestStore().fetch();
 useAppStore().setPageTitle("Zajímavá místa");
 
-const {isQueryRunning, pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
+const loadNextPage = (appendItems) => loadPage({
+  fetchFunc: usePointsOfInterestStore().fetch,
+  appendItems
+});
+loadNextPage(false);
+
+const {isQueryRunning, totalItemsCount, pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
 </script>
 
 <template>
   <BasicListSkeleton :items="10" v-if="isQueryRunning && !pointsOfInterest.length"/>
   <BasicInfoBanner
-      v-else-if="!isQueryRunning && pointsOfInterest.length === 0"
-      :route-add="{name: 'addPoi'}"
-      label-add="Přidat"
+    v-else-if="!isQueryRunning && pointsOfInterest.length === 0"
+    :route-add="{name: 'addPoi'}"
+    label-add="Přidat"
   >
     Nemáš tu uložené žádné zajímavé místo. Přidej si let, nastav si tam ručně trasu a jednotlivé body se zobrazí
     i v tomto seznamu.
   </BasicInfoBanner>
 
   <POIList
-      v-else
-      :public="false"
-      :items="pointsOfInterest"
+    v-else
+    :public="false"
+    :items="pointsOfInterest"
+    :total-items-count="totalItemsCount"
+    :is-query-running="isQueryRunning"
+    :items-per-page="paginationLimit"
+    @load-more="loadNextPage(true)"
   />
 
   <FAB :router-link="{name: 'addPOI'}" mode="add"/>