72 lines
2.6 KiB
Vue
72 lines
2.6 KiB
Vue
<script setup>
|
|
import {onMounted, watch} from "vue";
|
|
import {fetchFlight, flight, flightName, loading} from "src/composables/objects/flight";
|
|
import {useRoute} from "vue-router";
|
|
import PhotoCarousel from "components/photos/PhotoCarousel.vue";
|
|
import FlightTrackMap from "components/flights/FlightTrackMap.vue";
|
|
import FlightBasicInfo from "components/flights/FlightBasicInfo.vue";
|
|
import {useAppStore} from "stores/App";
|
|
import FlightDetailSkeleton from "components/flights/FlightDetailSkeleton.vue";
|
|
import {fetchUser, loading as pilotLoading, user as pilot} from "src/composables/objects/user";
|
|
import PublicProfileSkeleton from "components/profile/PublicProfileSkeleton.vue";
|
|
import PilotProfileCard from "components/profile/PilotProfileCard.vue";
|
|
import PhotosList from "components/photos/PhotosList.vue";
|
|
import PhotoDetail from "components/photos/PhotoDetail.vue";
|
|
import {openDetail, openPhotoDetail, openPhotoFromList, photoData} from "src/composables/photos/photo";
|
|
|
|
const routeParams = useRoute().params;
|
|
onMounted(() => {
|
|
fetchFlight(routeParams.id, routeParams.username);
|
|
fetchUser(routeParams.username)
|
|
})
|
|
|
|
watch(flight, (newVal) => {
|
|
const flightNameFormatted = flightName(newVal);
|
|
useAppStore().setPageTitle(flightNameFormatted);
|
|
useAppStore().setBreadcrumbs([
|
|
{to: {name: 'homepage'}, label: "Polétání.cz"},
|
|
{to: {name: "publicProfileDetail", params: {username: routeParams.username}}, label: `@${routeParams.username}`},
|
|
{label: flightNameFormatted}
|
|
]);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<FlightDetailSkeleton v-if="loading || !flight"/>
|
|
|
|
<template v-else>
|
|
<q-banner class="bg-warning text-white q-mx-md q-my-md" v-if="!flight.isPublic">
|
|
Pozor! Tento let není publikován a nebude tak dostupný pro ostatní!
|
|
</q-banner>
|
|
|
|
<q-card class="q-mx-md q-my-md flight-detail-card">
|
|
<PhotoCarousel
|
|
:default-title="flightName(flight)"
|
|
:cover-photo-url="flight.coverPhoto?.url"
|
|
:photos="flight.photos"
|
|
@open-detail="openDetail"
|
|
/>
|
|
<q-card-section>
|
|
<FlightBasicInfo :flight="flight" :show-copilots="false"/>
|
|
|
|
<article class="q-my-lg" v-html="flight.description"/>
|
|
|
|
<PhotosList :photos="flight.photos" :show-actions="false" @photo-click="openPhotoFromList"/>
|
|
|
|
<FlightTrackMap :flight="flight"/>
|
|
</q-card-section>
|
|
</q-card>
|
|
|
|
<PhotoDetail
|
|
v-if="photoData"
|
|
v-model="openPhotoDetail"
|
|
:default-title="flightName(flight)"
|
|
:photo="photoData.photo"
|
|
:photos="photoData.allPhotos"
|
|
:opened-index="photoData.idx"
|
|
/>
|
|
</template>
|
|
</div>
|
|
</template>
|