Prusunuti nacitani detailu do prefetche (neverejna cast), zruseni resetu breadcrumbs a title pred zmenou routy

This commit is contained in:
Michal Kváček
2024-03-13 07:31:53 +01:00
parent 48f57cde0d
commit 9379d3bfd6
6 changed files with 61 additions and 46 deletions
@@ -2,7 +2,7 @@
import {useAircraftsStore} from "stores/Aircrafts";
export default {
serverPrefetch({currentRoute}) {
preFetch({currentRoute}) {
return useAircraftsStore().fetchDetail(currentRoute.params.id);
}
}
@@ -16,7 +16,6 @@ import {confirmObject, successObject} from "src/composables/dialog";
import {useAppStore} from "stores/App";
import FlightsList from "components/flights/FlightsList.vue";
import {storeToRefs} from "pinia";
import {watch} from "vue";
import {metaData} from "src/composables/meta";
import PhotoGallery from "components/photos/PhotoGallery.vue";
import ContentCard from "components/ContentCard.vue";
@@ -30,20 +29,19 @@ import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
import FlightsListSkeleton from "components/flights/skeletons/FlightsListSkeleton.vue";
import CopyLinkButton from "components/inputs/CopyLinkButton.vue";
import PublishButton from "components/inputs/PublishButton.vue";
import {onMounted} from "vue";
const aircraftId = parseInt(useRoute().params.id);
const loggedUser = storeToRefs(useLoggedUserStore()).user;
const {aircraft, isQueryRunning} = storeToRefs(useAircraftsStore());
watch(() => aircraft.value, (newVal) => {
if (!newVal) return;
useAppStore().setPageTitle(newVal.callSign);
useMeta(() => metaData({title: newVal.callSign}));
useAppStore().setBreadcrumbs([
{label: "Letadla", to: {name: "aircrafts"}},
{label: newVal.callSign}
])
});
useAppStore().setPageTitle(aircraft.value.callSign);
useMeta(() => metaData({title: aircraft.value.callSign}));
useAppStore().setBreadcrumbs([
{label: "Letadla", to: {name: "aircrafts"}},
{label: aircraft.value.callSign}
])
const $q = useQuasar();
const $router = useRouter();
@@ -61,13 +59,12 @@ const togglePublicVisibility = (variables) => toggleVisibility({
$q, store: useAircraftsStore(), object: aircraft.value, variables
});
const {isQueryRunning: areFlightsLoading, totalItemsCount, flights} = storeToRefs(useFlightsStore());
const {filters, loadPage, paginationLimit} = usePagination({fetchFunction: useFlightsStore().fetch});
filters.value = {aircraftId: aircraftId};
loadPage(false);
const {isQueryRunning: areFlightsLoading, totalItemsCount, flights} = storeToRefs(useFlightsStore());
const loggedUser = storeToRefs(useLoggedUserStore()).user;
onMounted(() => {
loadPage(false);
})
</script>
<template>
+4 -3
View File
@@ -10,10 +10,11 @@ import {usePagination} from "src/composables/pagination";
useAppStore().setPageTitle("Letadla");
const {filters, loadPage, paginationLimit} = usePagination({fetchFunction: useAircraftsStore().fetch});
loadPage(false);
const {aircrafts, totalItemsCount, isQueryRunning} = storeToRefs(useAircraftsStore());
const {filters, loadPage, paginationLimit} = usePagination({fetchFunction: useAircraftsStore().fetch});
onMounted(() => {
loadPage(false);
})
</script>
<template>
+16 -11
View File
@@ -1,6 +1,15 @@
<script>
import {useAircraftsStore} from "stores/Aircrafts";
export default {
preFetch({currentRoute}) {
return useAircraftsStore().fetchDetail(currentRoute.params.id);
}
}
</script>
<script setup>
import AircraftForm from "components/aircrafts/AircraftForm.vue";
import {useAircraftsStore} from "stores/Aircrafts";
import {useRoute, useRouter} from "vue-router";
import {useQuasar} from "quasar";
import {computed, onMounted} from "vue";
@@ -22,16 +31,12 @@ const loggedUser = storeToRefs(useLoggedUserStore()).user;
const {aircraft, isMutationRunning, isQueryRunning} = storeToRefs(useAircraftsStore());
onMounted(() => {
useAircraftsStore().fetchDetail(aircraftId).then(() => {
useAppStore().setPageTitle(`${aircraft.value.callSign} - editace`);
useAppStore().setBreadcrumbs([
{to: {name: "aircrafts"}, label: "Letadla"},
{to: {name: "aircraftDetail", params: {id: aircraftId}}, label: aircraft.value.callSign},
{label: "Editace"}
])
});
});
useAppStore().setPageTitle(`${aircraft.value.callSign} - editace`);
useAppStore().setBreadcrumbs([
{to: {name: "aircrafts"}, label: "Letadla"},
{to: {name: "aircraftDetail", params: {id: aircraftId}}, label: aircraft.value.callSign},
{label: "Editace"}
])
const handleSave = (formData) => {
useAircraftsStore().update(aircraftId, formData).then(() => {
+21 -10
View File
@@ -1,9 +1,18 @@
<script>
import {useCopilotsStore} from "stores/Copilots";
export default {
preFetch({currentRoute}) {
return useCopilotsStore().fetchDetail(currentRoute.params.id);
}
}
</script>
<script setup>
import {useRoute} from "vue-router";
import CopilotDetailSkeleton from "components/copilots/skeletons/CopilotDetailSkeleton.vue";
import {useAppStore} from "stores/App";
import FlightsList from "components/flights/FlightsList.vue";
import {useCopilotsStore} from "stores/Copilots";
import {storeToRefs} from "pinia";
import PhotoGallery from "components/photos/PhotoGallery.vue";
import ContentCard from "components/ContentCard.vue";
@@ -15,15 +24,16 @@ import {useLoggedUserStore} from "stores/LoggedUser";
import PublishButton from "components/inputs/PublishButton.vue";
import CopyLinkButton from "components/inputs/CopyLinkButton.vue";
import {toggleVisibility} from "src/composables/form/formHandling";
import {onMounted} from "vue";
const {isQueryRunning, copilot} = storeToRefs(useCopilotsStore());
const copilotId = parseInt(useRoute().params.id);
useCopilotsStore().fetchDetail(copilotId).then(() => {
useAppStore().setPageTitle(copilot.value.name);
useAppStore().setBreadcrumbs([
{to: {name: "copilots"}, label: "Kopiloti"},
{label: copilot.value.name}
])
});
useAppStore().setPageTitle(copilot.value.name);
useAppStore().setBreadcrumbs([
{to: {name: "copilots"}, label: "Kopiloti"},
{label: copilot.value.name}
])
const $q = useQuasar();
const togglePublicVisibility = (variables) => toggleVisibility({
@@ -32,10 +42,11 @@ const togglePublicVisibility = (variables) => toggleVisibility({
const {filters, loadPage, paginationLimit} = usePagination({fetchFunction: useFlightsStore().fetch});
filters.value = {copilotId: copilotId};
loadPage(false);
onMounted(() => {
loadPage(false);
});
const {isQueryRunning: areFlightsLoading, totalItemsCount, flights} = storeToRefs(useFlightsStore());
const {isQueryRunning, copilot} = storeToRefs(useCopilotsStore());
const loggedUser = storeToRefs(useLoggedUserStore()).user;
</script>
@@ -8,15 +8,16 @@ import {usePointsOfInterestStore} from "stores/PointsOfInterest";
import {storeToRefs} from "pinia";
import {usePagination} from "src/composables/pagination";
import ListFilters from "components/ListFilters.vue";
import {onMounted} from "vue";
useAppStore().setPageTitle("Zajímavá místa");
const {filters, loadPage, paginationLimit, paginationOffset} = usePagination({
fetchFunction: usePointsOfInterestStore().fetch,
itemsPerPage: 1 // nefunguje
fetchFunction: usePointsOfInterestStore().fetch
});
loadPage(false);
onMounted(() => {
loadPage(false);
})
const handleFiltersChanged = (newFilters) => {
paginationOffset.value = 0;
filters.value = newFilters;
+2 -2
View File
@@ -7,9 +7,9 @@ export const useAppStore = defineStore('App', () => {
const appStatus = ref(200);
const resetBeforeRouteChange = () => {
pageTitle.value = null;
// pageTitle.value = null;
// appStatus.value = 200; // tohle dela problem pri renderu 404 na serveru
breadcrumbs.value = null;
// breadcrumbs.value = null;
};
const setPageTitle = (value) => {