poletani.cz/app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Bugfixing, dotazeni uprav s uvodni fotkou

Browse Source
This commit is contained in:
Michal Kváček
2023-12-05 12:15:12 +01:00
parent 3bd4d7ba52
commit 68659ca924
18 changed files with 281 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Dockerfile
+2
View File
@@ -11,6 +11,8 @@ COPY . .
# build stage
FROM develop-stage as build-stage
ENV NODE_ENV production
RUN quasar build -m ssr
FROM node:20-alpine as production-stage
src/boot/apollo.js
+1 -1
View File
@@ -12,7 +12,7 @@ const handleRefreshToken = (store, forward, operation) => {
return fromPromise(useUserStore(store).refreshAccessToken()
.catch((error) => {
Notify.create(warningObject("Tvoje přihlášení vypřešlo. Přihlaš se prosím znovu."));
window.location = "/login";
if (window) window.location = "/login";
}))
.filter((value) => Boolean(value))
.flatMap((accessToken) => {
src/components/ContentCard.vue
+7 -5
View File
@@ -17,16 +17,18 @@ const props = defineProps({
<template>
<q-card class="flight-detail-card q-mb-lg">
<TitlePhotoWithGallery
v-if="titlePhoto"
:photo="titlePhoto"
:title="title"
v-if="titlePhoto"
:photo="titlePhoto"
:title="title"
/>
<q-card-section v-else-if="title && title !== ''">
<h3>{{ title }}</h3>
</q-card-section>
<q-card-actions>
<slot name="actions" />
<slot name="actions"/>
</q-card-actions>
<slot name="content"/>
</q-card>
</template>
src/components/ContentCardEditButton.vue
+22
View File
@@ -0,0 +1,22 @@
<script setup>
const props = defineProps({
to: {
type: Object,
required: true
},
label: {
type: String,
required: false,
default: null
}
});
</script>
<template>
<div class="text-right">
<q-btn flat class="q-my-sm" :to="props.to" icon="edit" color="primary">
{{ props.label }}
</q-btn>
</div>
</template>
src/components/aircrafts/AircraftsList.vue
+1 -1
View File
@@ -22,7 +22,7 @@ useAppStore().setPageTitle("Letadla");
>
<q-item-section avatar>
<q-avatar v-if="aircraft.titlePhoto">
<img :src="aircraft.titlePhoto.url" alt=""/>
<img :src="aircraft.titlePhoto.thumbnailUrl" alt=""/>
</q-avatar>
<q-avatar color="teal" text-color="white" icon="flight" v-else/>
</q-item-section>
src/components/poi/POIList.vue
+4 -1
View File
@@ -10,7 +10,10 @@ const props = defineProps({
<q-list bordered separator>
<q-item clickable v-ripple v-for="poi of items" :key="poi" :to="{name: 'poiDetail', params: {id: poi.id}}">
<q-item-section avatar>
<q-avatar :icon="poi.type?.icon || 'place'" color="primary" text-color="white"/>
<q-avatar v-if="poi.titlePhoto">
<img :src="poi.titlePhoto.thumbnailUrl" alt=""/>
</q-avatar>
<q-avatar v-else :icon="poi.type?.icon || 'place'" color="primary" text-color="white"/>
</q-item-section>
<q-item-section>
{{ poi.name }}
src/composables/form/formHandling.js
+11
View File
@@ -1,3 +1,5 @@
import {successObject} from "src/composables/dialog";
export const setDefaultData = (formData, defaultData) => {
const ignoredFields = ['__typename'];
@@ -10,3 +12,12 @@ export const setDefaultData = (formData, defaultData) => {
formData[key] = defaultData[key];
}
}
export const toggleVisibility = ({store, $q, object}) => {
console.log(object);
const newVisibility = !object.isPublic;
store.update(object.id, {isPublic: newVisibility})
.then(() => {
$q.notify(successObject(newVisibility ? "Úspěšně publikováno" : "Úspěšně skryto"));
});
}
src/graphql/fragments/aircraft.js
+19 -1
View File
@@ -2,6 +2,24 @@ import gql from "graphql-tag";
import {FRAGMENT_PHOTO_FULL_INFO} from "src/graphql/fragments/photo";
import {FRAGMENT_FLIGHT_LIST_INFO} from "src/graphql/fragments/flight_list";
export const FRAGMENT_AIRCRAFT_LIST_INFO = gql`
fragment aircraftListInfo on Aircraft {
id
callSign
model
manufacturer
isPublic
titlePhoto {
thumbnailUrl
}
organization {
name
}
}
`;
export const FRAGMENT_AIRCRAFT_FULL_INFO = gql`
fragment aircraftFullInfo on Aircraft {
id
@@ -10,7 +28,6 @@ fragment aircraftFullInfo on Aircraft {
description
manufacturer
seats
createdById
isPublic
@@ -29,6 +46,7 @@ fragment aircraftFullInfo on Aircraft {
export const FRAGMENT_AIRCRAFT_FULL_PRIVATE_INFO = gql`
fragment aircraftFullPrivateInfo on Aircraft {
...aircraftFullInfo
photos {
...photoFullInfo
src/graphql/fragments/poi.js
+3
View File
@@ -8,6 +8,9 @@ fragment pointOfInterestListInfo on PointOfInterest {
id
name
isPublic
titlePhoto {
thumbnailUrl
}
type {
id
name
src/graphql/queries/aircrafts.js
+3 -3
View File
@@ -1,14 +1,14 @@
import gql from "graphql-tag";
import {FRAGMENT_AIRCRAFT_FULL_INFO, FRAGMENT_AIRCRAFT_FULL_PRIVATE_INFO} from "src/graphql/fragments/aircraft";
import {FRAGMENT_AIRCRAFT_FULL_INFO, FRAGMENT_AIRCRAFT_FULL_PRIVATE_INFO, FRAGMENT_AIRCRAFT_LIST_INFO} from "src/graphql/fragments/aircraft";
export const AIRCRAFTS_LIST = gql`
query AircraftsList {
aircrafts {
...aircraftFullInfo
...aircraftListInfo
}
}
${FRAGMENT_AIRCRAFT_FULL_INFO}
${FRAGMENT_AIRCRAFT_LIST_INFO}
`;
src/graphql/queries/poi.js
+1 -1
View File
@@ -32,7 +32,7 @@ ${FRAGMENT_POI_FULL_PRIVATE_INFO}
`;
export const POI_PUBLIC_DETAIL = gql`
query poiDetail($id: Int!) {
query publicPOIDetail($id: Int!) {
pointOfInterest(id: $id, public: true) {
...pointOfInterestFullInfo
}
src/pages/profile/aircraft/AircraftDetailPage.vue
+45 -14
View File
@@ -1,6 +1,6 @@
<script setup>
import {useRoute, useRouter} from "vue-router";
import {useMeta, useQuasar} from "quasar";
import {copyToClipboard, useMeta, useQuasar} from "quasar";
import AircraftDetailSkeleton from "components/aircrafts/AircraftDetailSkeleton.vue";
import {confirmObject, successObject} from "src/composables/dialog";
import {useAppStore} from "stores/App";
@@ -15,6 +15,9 @@ 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 {useFlightsStore} from "stores/Flights";
import {toggleVisibility} from "src/composables/form/formHandling";
import ContentCardEditButton from "components/ContentCardEditButton.vue";
const $q = useQuasar();
const $router = useRouter();
@@ -36,12 +39,28 @@ watch(() => aircraft.value, (newVal) => {
const deleteAircraft = (id) => {
$q.dialog(confirmObject('Opravdu chceš smazat toto letadlo?'))
.onOk(() => {
useAircraftsStore().destroy(id).then(() => {
$router.push({name: "aircrafts"});
$q.notify(successObject("Letadlo úspěšně odstraněno"));
.onOk(() => {
useAircraftsStore().destroy(id).then(() => {
$router.push({name: "aircrafts"});
$q.notify(successObject("Letadlo úspěšně odstraněno"));
});
});
});
};
const togglePublicVisibility = () => toggleVisibility({
$q,
store: useAircraftsStore(),
object: aircraft.value
});
const copyLinkToClipboard = () => {
const url = $router.resolve({
name: "publicAircraftDetail",
params: {id: aircraftId}
});
copyToClipboard(window.location.origin + url.href).then(() => {
$q.notify(successObject("Odkaz zkopírován"))
});
};
</script>
@@ -53,19 +72,34 @@ const deleteAircraft = (id) => {
<template #actions v-if="aircraft.createdById === loggedUser?.id">
<div class="col-grow">
<q-btn
flat
:to='{name: "aircraftEdit", params: {id: aircraft.id}}'
icon="edit"
text-color="primary"
label="Upravit"
@click="togglePublicVisibility"
:icon="aircraft.isPublic ? 'visibility_off' : 'visibility'"
flat
:label="aircraft.isPublic ? 'Skrýt' : 'Zveřejnit'"
/>
<q-btn
icon="link"
@click="copyLinkToClipboard()"
flat
v-if="aircraft.isPublic"
label="Získat odkaz"
/>
</div>
<q-btn @click="deleteAircraft(aircraft.id)" icon="delete" flat text-color="red" label="Smazat"/>
</template>
<template #content>
<q-card-section>
<ContentCardEditButton
:to='{name: "aircraftEdit", params: {id: aircraft.id, step: "info"}}'
label="Upravit informace"
/>
<AircraftInfo :aircraft="aircraft"/>
<ContentCardEditButton
:to='{name: "aircraftEdit", params: {id: aircraft.id, step: "photo"}}'
label="Titulní fotografie"
/>
<PhotoGallery :photos="aircraft.photos"/>
<h3>Lety</h3>
<q-banner v-if="aircraft.flights.length === 0" class="bg-light-blue text-white">
@@ -75,8 +109,5 @@ const deleteAircraft = (id) => {
</q-card-section>
</template>
</ContentCard>
</template>
</template>
src/pages/profile/aircraft/EditAircraftPage.vue
+9 -9
View File
@@ -76,15 +76,15 @@ const formStep = computed(() => useRoute().params.step || "basic");
<template v-if="formStep === 'basic'">
<q-card class="q-mx-md">
<q-card-section>
<AircraftForm
@save="handleSave"
:default-values="aircraft"
:organizations="loggedUser.organizations"
:is-request-pending="isMutationRunning"
/>
</q-card-section>
</q-card>
<q-card-section>
<AircraftForm
@save="handleSave"
:default-values="aircraft"
:organizations="loggedUser.organizations"
:is-request-pending="isMutationRunning"
/>
</q-card-section>
</q-card>
</template>
<template v-else-if="formStep === 'photo'">
src/pages/profile/flight/FlightDetailPage.vue
+61 -58
View File
@@ -15,41 +15,40 @@ import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
import PhotoGallery from "components/photos/PhotoGallery.vue";
import TitlePhotoWithGallery from "components/photos/TitlePhotoWithGallery.vue";
import ContentCard from "components/ContentCard.vue";
import ContentCardEditButton from "components/ContentCardEditButton.vue";
import {toggleVisibility} from "src/composables/form/formHandling";
const $q = useQuasar();
const $router = useRouter();
const flightId = parseInt(useRoute().params.id);
const loggedUser = storeToRefs(useUserStore()).user;
onMounted(() => {
useFlightsStore().fetchDetail(flightId).then(f => {
const flightNameFormatted = flightName(f);
useAppStore().setPageTitle(flightNameFormatted);
useAppStore().setBreadcrumbs([
{to: {name: "myFlights"}, label: "Moje lety"},
{label: flightNameFormatted}
]);
})
})
useFlightsStore().fetchDetail(flightId).then(f => {
if (!f) return;
const flightNameFormatted = flightName(f);
useAppStore().setPageTitle(flightNameFormatted);
useAppStore().setBreadcrumbs([
{to: {name: "myFlights"}, label: "Moje lety"},
{label: flightNameFormatted}
]);
});
const handleDeleteAndRedirect = () => {
$q.dialog(confirmObject("Opravdu chceš smazat tento let?"))
.onOk(() => {
useFlightsStore().destroy(flightId).then(() => {
$router.push({name: "myFlights"});
$q.notify(successObject(`Úspěšně smazáno`));
.onOk(() => {
useFlightsStore().destroy(flightId).then(() => {
$router.push({name: "myFlights"});
$q.notify(successObject(`Úspěšně smazáno`));
});
});
});
}
const togglePublicVisibility = () => {
const newVisibility = !flight.value.isPublic;
useFlightsStore()
.update(flightId, {isPublic: newVisibility})
.then(() => {
$q.notify(successObject(newVisibility ? "Úspěšně publikováno" : "Úspěšně skryto"));
});
};
const togglePublicVisibility = () => toggleVisibility({
$q,
store: useFlightsStore(),
object: flight.value
});
const copyLinkToClipboard = () => {
const loggedUser = useUserStore().user;
@@ -73,19 +72,19 @@ const {isQueryRunning, flight} = storeToRefs(useFlightsStore());
<template #actions>
<div class="col-grow">
<q-btn
@click="togglePublicVisibility"
:icon="flight.isPublic ? 'visibility_off' : 'visibility'"
:disable="!loggedUser?.publicUsername"
flat
:label="flight.isPublic ? 'Skrýt' : 'Zveřejnit'"
@click="togglePublicVisibility"
:icon="flight.isPublic ? 'visibility_off' : 'visibility'"
:disable="!loggedUser?.publicUsername"
flat
:label="flight.isPublic ? 'Skrýt' : 'Zveřejnit'"
/>
<q-btn
icon="link"
@click="copyLinkToClipboard()"
flat
v-if="flight.isPublic"
label="Získat odkaz"
icon="link"
@click="copyLinkToClipboard()"
flat
v-if="flight.isPublic"
label="Získat odkaz"
/>
</div>
<q-btn @click="handleDeleteAndRedirect" icon="delete" flat text-color="red" label="Smazat"/>
@@ -93,54 +92,58 @@ const {isQueryRunning, flight} = storeToRefs(useFlightsStore());
<template #content>
<q-card-section>
<div class="text-right">
<q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'basic'}}" icon="edit" color="primary">Upravit informace</q-btn>
</div>
<ContentCardEditButton
:to="{name: 'flightEdit', params: {id: flightId, step: 'basic'}}"
label="Upravit informace"
/>
<FlightBasicInfo
:flight="flight"
:aircraft-detail-route="{name: 'aircraftDetail'}"
:copilot-detail-route="{name: 'copilotDetail'}"
:flight="flight"
:aircraft-detail-route="{name: 'aircraftDetail'}"
:copilot-detail-route="{name: 'copilotDetail'}"
/>
<div class="text-right">
<q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'notes'}}" icon="edit" color="primary">Upravit text</q-btn>
</div>
<ContentCardEditButton
:to="{name: 'flightEdit', params: {id: flightId, step: 'notes'}}"
label="Upravit text"
/>
<article class="q-my-lg" v-html="flight.description"/>
<BasicInfoBanner v-if="flight.description === ''">Popiš, jaký byl let.</BasicInfoBanner>
<q-separator/>
<div class="text-right">
<q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}" icon="edit" color="primary">Upravit fotky</q-btn>
</div>
<ContentCardEditButton
:to="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}"
label="Upravit fotografie"
/>
<BasicInfoBanner
v-if="flight.photos.length === 0"
:route-add="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}"
v-if="flight.photos.length === 0"
:route-add="{name: 'flightEdit', params: {id: flightId, step: 'photos'}}"
>
U tohoto letu nemáš nahrané žádné fotografie.
</BasicInfoBanner>
<PhotoGallery
v-else
:photos="flight.photos"
v-else
:photos="flight.photos"
/>
<q-separator/>
<div class="text-right">
<q-btn flat class="q-my-sm" :to="{name: 'flightEdit', params: {id: flightId, step: 'track'}}" icon="edit" color="primary">Upravit trasu</q-btn>
</div>
<ContentCardEditButton
:to="{name: 'flightEdit', params: {id: flightId, step: 'track'}}"
label="Upravit trasu"
/>
<BasicInfoBanner
v-if="flight.track.length === 0 && !flight.gpxTrack"
:route-add="{name: 'flightEdit', params: {id: flightId, step: 'track'}}"
v-if="flight.track.length === 0 && !flight.gpxTrack"
:route-add="{name: 'flightEdit', params: {id: flightId, step: 'track'}}"
>
Nemáš nastavenou žádnou trasu.
</BasicInfoBanner>
<FlightTrackMap
v-else
:flight="flight"
:photos="flight.photos"
v-else
:flight="flight"
:photos="flight.photos"
/>
</q-card-section>
</template>
</ContentCard>
</template>
src/pages/profile/poi/PointOfInterestDetailPage.vue
+58 -30
View File
@@ -1,8 +1,6 @@
<script setup>
import {computed, onMounted} from "vue";
import {useRoute} from "vue-router";
import POIDetailSkeleton from "components/poi/POIDetailSkeleton.vue";
import FAB from "components/FAB.vue";
import {useAppStore} from "stores/App";
import EmbeddedMap from "components/map/EmbeddedMap.vue";
import {useUserStore} from "stores/User";
@@ -11,28 +9,40 @@ import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
import FlightsList from "components/flights/FlightsList.vue";
import {usePointsOfInterestStore} from "stores/PointsOfInterest";
import PhotoGallery from "components/photos/PhotoGallery.vue";
import TitlePhotoWithGallery from "components/photos/TitlePhotoWithGallery.vue";
import ContentCard from "components/ContentCard.vue";
import {toggleVisibility} from "src/composables/form/formHandling";
import {copyToClipboard, useQuasar} from "quasar";
import {successObject} from "src/composables/dialog";
import ContentCardEditButton from "components/ContentCardEditButton.vue";
const loggedUser = storeToRefs(useUserStore()).user;
onMounted(() => {
usePointsOfInterestStore().fetchDetail(useRoute().params.id).then((p) => {
useAppStore().setPageTitle(`${p.name}`);
useAppStore().setBreadcrumbs([
{to: {name: "poi"}, label: "Zajímavá místa"},
{label: p.name},
])
});
usePointsOfInterestStore().fetchDetail(useRoute().params.id).then((p) => {
useAppStore().setPageTitle(`${p.name}`);
useAppStore().setBreadcrumbs([
{to: {name: "poi"}, label: "Zajímavá místa"},
{label: p.name},
])
});
const {isQueryRunning, pointOfInterest} = storeToRefs(usePointsOfInterestStore());
const titlePhoto = computed(() => {
if (!pointOfInterest.value || pointOfInterest.value.photos.length === 0) return null;
return pointOfInterest.value.titlePhoto || pointOfInterest.value.photos[0];
const $q = useQuasar();
const togglePublicVisibility = () => toggleVisibility({
$q,
store: usePointsOfInterestStore(),
object: pointOfInterest.value
});
const copyLinkToClipboard = () => {
const url = $router.resolve({
name: "publicPOIDetail",
params: {id: pointOfInterest.value.id}
});
copyToClipboard(window.location.origin + url.href).then(() => {
$q.notify(successObject("Odkaz zkopírován"))
});
};
</script>
<template>
@@ -40,45 +50,63 @@ const titlePhoto = computed(() => {
<template v-else>
<ContentCard :title-photo="titlePhoto" :title="pointOfInterest.name">
<ContentCard :title-photo="pointOfInterest.titlePhoto" :title="pointOfInterest.name">
<template #actions v-if="pointOfInterest.createdById === loggedUser.id">
<div class="col-grow">
<q-btn
flat
:to="{name: 'poiEdit', params:{id: pointOfInterest.id}}"
icon="edit"
text-color="primary"
label="Upravit"
@click="togglePublicVisibility"
:icon="pointOfInterest.isPublic ? 'visibility_off' : 'visibility'"
flat
:label="pointOfInterest.isPublic ? 'Skrýt' : 'Zveřejnit'"
/>
<q-btn
icon="link"
@click="copyLinkToClipboard()"
flat
v-if="pointOfInterest.isPublic"
label="Získat odkaz"
/>
</div>
</template>
<template #content>
<q-card-section>
<ContentCardEditButton
:to="{name: 'poiEdit', params:{id: pointOfInterest.id, step: 'info'}}"
label="Upravit informace"
/>
<article v-html="pointOfInterest.description" class="q-my-lg"/>
<EmbeddedMap
v-if="pointOfInterest.gpsLatitude && pointOfInterest.gpsLongitude"
:gps-latitude="pointOfInterest.gpsLatitude"
:gps-longitude="pointOfInterest.gpsLongitude"
:zoom="13"
v-if="pointOfInterest.gpsLatitude && pointOfInterest.gpsLongitude"
:gps-latitude="pointOfInterest.gpsLatitude"
:gps-longitude="pointOfInterest.gpsLongitude"
:zoom="13"
/>
<BasicInfoBanner v-else>
Tento bod nemá nastavenou polohu. Po nastavení polohy tu bude zobrazena mapa.
</BasicInfoBanner>
<ContentCardEditButton
:to="{name: 'poiEdit', params:{id: pointOfInterest.id, step: 'photo'}}"
label="Úvodní fotografie"
/>
<PhotoGallery
:photos="pointOfInterest.photos"
v-if="pointOfInterest.photos.length > 0"
:photos="pointOfInterest.photos"
v-if="pointOfInterest.photos.length > 0"
/>
<BasicInfoBanner v-else>
Pokud přidáš toto místo k nějaké fotce, zobrazí se tu.
</BasicInfoBanner>
<h3>Tvoje lety do místa {{ pointOfInterest.name }}</h3>
<FlightsList
:items="pointOfInterest.flights"
:public="false"
v-if="pointOfInterest.flights.length > 0 && loggedUser.id === pointOfInterest.createdById"
:items="pointOfInterest.flights"
:public="false"
v-if="pointOfInterest.flights.length > 0 && loggedUser.id === pointOfInterest.createdById"
/>
</q-card-section>
</template>
src/pages/public/AircraftDetailPage.vue
+16 -3
View File
@@ -24,6 +24,8 @@ import AircraftInfo from "components/aircrafts/AircraftInfo.vue";
import {useUserStore} from "stores/User";
import {usePhotosStore} from "stores/Photos";
import {useFlightsStore} from "stores/Flights";
import FlightsListSkeleton from "components/flights/FlightsListSkeleton.vue";
import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
const $q = useQuasar();
const $router = useRouter();
@@ -39,13 +41,20 @@ useFlightsStore().fetchPublic({aircraftId: aircraft.value.id})
useAppStore().setPageTitle(aircraft.value.callSign);
useMeta(() => metaData({
title: aircraft.value.callSign,
image: aircraft.value.titleImage?.url
image: aircraft.value.titleImage?.url,
keywords: [
"letadlo",
aircraft.value.callSign,
aircraft.value.model,
aircraft.value.organization?.name,
aircraft.value.manufacturer
],
description: aircraft.value.description
}));
useAppStore().setBreadcrumbs([
{label: "Polétání.cz", to: {name: "homepage"}},
{label: aircraft.value.callSign}
]);
</script>
<template>
@@ -61,7 +70,11 @@ useAppStore().setBreadcrumbs([
<h3>Lety</h3>
<FlightsList :items="flights" :public="true" />
<FlightsListSkeleton v-if="areFlightsLoading && flights.length"/>
<BasicInfoBanner v-else-if="!areFlightsLoading && flights.length === 0">
U tohoto letadla nejsou publikované žádné lety.
</BasicInfoBanner>
<FlightsList v-else :items="flights" :public="true"/>
</q-card-section>
</template>
</ContentCard>
src/pages/public/PointOfInterestDetailPage.vue
+17 -11
View File
@@ -19,6 +19,8 @@ import FlightsList from "components/flights/FlightsList.vue";
import {useAppStore} from "stores/App";
import {useMeta} from "quasar";
import {metaData} from "src/composables/meta";
import FlightsListSkeleton from "components/flights/FlightsListSkeleton.vue";
import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
const {pointOfInterest, isQueryRunning} = storeToRefs(usePointsOfInterestStore());
const {photos, isQueryRunning: arePhotosLoading} = storeToRefs(usePhotosStore());
@@ -30,34 +32,38 @@ useFlightsStore().fetchPublic({pointOfInterestId: pointOfInterest.value.id});
useAppStore().setPageTitle(pointOfInterest.value.name);
useMeta(() => metaData({
title: pointOfInterest.value.name,
image: pointOfInterest.value.titlePhoto.url,
image: pointOfInterest.value.titlePhoto?.url,
description: pointOfInterest.value.description,
}))
}));
useAppStore().setBreadcrumbs([
{to: {name: 'homepage'}, label: "Polétání.cz"},
{label: pointOfInterest.value.name}
]);
</script>
<template>
<q-spinner v-if="isQueryRunning || !pointOfInterest"/>
<ContentCard :title-photo="pointOfInterest.titlePhoto" :title="pointOfInterest.name" v-else>
<template #content>
<q-card-section>
<article v-html="pointOfInterest.description"/>
<article v-html="pointOfInterest.description" class="q-my-lg"/>
<EmbeddedMap
v-if="pointOfInterest.gpsLatitude && pointOfInterest.gpsLongitude"
:gps-latitude="pointOfInterest.gpsLatitude"
:gps-longitude="pointOfInterest.gpsLongitude"
:zoom="13"
/>
/>
<PhotoGallery :photos="photos"/>
<PhotoGallery :photos="photos" class="q-my-lg"/>
<h3>Lety na místo {{ pointOfInterest.name }}</h3>
<h3>Lety</h3>
<FlightsList :public="true" :items="flights" />
<FlightsListSkeleton v-if="areFlightsLoading && flights.length"/>
<BasicInfoBanner v-else-if="!areFlightsLoading && flights.length === 0">
Zdá se, že na toto místo ještě nikdo neletěl. Zatím tu nejsou ještě žádné lety.
</BasicInfoBanner>
<FlightsList v-else :items="flights" :public="true"/>
</q-card-section>
</template>
</ContentCard>
src/stores/Photos.js
+1 -2
View File
@@ -87,7 +87,6 @@ export const usePhotosStore = defineStore('Photos', () => {
return {
photo, photos, isMutationRunning, isQueryRunning, fetchDetail, fetchPublic, upload, update,
changeOrientation, adjust, destroy,
openedPhoto, setOpenedPhoto
changeOrientation, adjust, destroy, openedPhoto, setOpenedPhoto
}
});