Files
app/src/pages/public/pilotProfile/FlightsListPage.vue
T

55 lines
1.9 KiB
Vue

<script setup>
import FlightsListSkeleton from "components/flights/skeletons/FlightsListSkeleton.vue";
import FlightsList from "components/flights/FlightsList.vue";
import PublicFlightEventSwitcher from "components/navigation/PublicFlightEventSwitcher.vue";
import {useAppStore} from "stores/App";
import {useFlightsStore} from "stores/Flights";
import {storeToRefs} from "pinia";
import {commonKeywords, metaData} from "src/composables/meta";
import {useMeta} from "quasar";
import {usePagination} from "src/composables/pagination";
import {publicProfileBreadcrumbs} from "src/composables/breadcrumbs";
import {onMounted} from "vue";
const props = defineProps({
pilot: {
type: Object,
required: true
}
});
useMeta(() => metaData({
title: `${props.pilot.publicUsername} - Lety`,
keywords: [...commonKeywords, "pilot", props.pilot.publicUsername, props.pilot.name],
description: `Výlety publikované pilotem ${props.pilot.name}. ${props.pilot.publicUsername}: ${props.pilot.description}`,
image: props.pilot.socialImageUrl
}));
useAppStore().setPageTitle(props.pilot.publicUsername);
useAppStore().setBreadcrumbs(publicProfileBreadcrumbs(props.pilot, false))
const {loadPage, handleFiltersChanged} = usePagination({fetchFunction: useFlightsStore().fetchPublic});
onMounted(() => {
handleFiltersChanged({username: props.pilot.publicUsername})
});
const {flights, isQueryRunning: areFlightsLoading} = storeToRefs(useFlightsStore());
</script>
<template>
<PublicFlightEventSwitcher :username="pilot?.publicUsername"/>
<FlightsListSkeleton v-if="areFlightsLoading && flights?.length === 0"/>
<q-banner class="bg-primary text-white" v-else-if="!areFlightsLoading && flights.length === 0">
Tento pilot zatím nepublikoval žádný let.
</q-banner>
<FlightsList
v-else
:items="flights"
:public="true"
@load-more="loadPage(true)"
/>
</template>