From 0c91ff7838ab591d50bcf7bfb0c1e68667eed50e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Michal=20Kv=C3=A1=C4=8Dek?= <michal.kvacek@performax.cz>
Date: Mon, 18 Sep 2023 20:03:53 +0200
Subject: [PATCH] Fix vypisu spolecnych letu s kopilotem, uprava zobrazeni
 photo carouselu

---
 src/components/photos/PhotoCarousel.vue       | 20 ++++++++++++++++++-
 src/graphql/queries/copilots.js               |  7 +++----
 src/pages/profile/flight/FlightDetailPage.vue |  6 +++++-
 3 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/src/components/photos/PhotoCarousel.vue b/src/components/photos/PhotoCarousel.vue
index 16c01d6..45264c6 100644
--- a/src/components/photos/PhotoCarousel.vue
+++ b/src/components/photos/PhotoCarousel.vue
@@ -11,6 +11,10 @@ const props = defineProps({
     type: String,
     required: false
   },
+  carouselTitle: {
+    type: String,
+    required: false
+  },
   defaultTitle: {
     type: String,
     required: false
@@ -43,7 +47,21 @@ watch(() => props.photos, (newVal) => {
     v-bind="$attrs"
   >
     <q-carousel-slide style="padding: 0" v-for="(photo, idx) in photos" :key="photo.url" :name="photo.url">
-      <q-img :src="photo.url" @click="openDetail({photo, idx, allPhotos: photos})"/>
+      <q-img :src="photo.url">
+        <span class="absolute-top text-right">
+          <q-btn
+            round
+            icon="zoom_in"
+            class="bg-blue-grey-9 text-white q-ma-md all-pointer-events"
+            @click="openDetail({photo, idx, allPhotos: photos})" />
+        </span>
+         <div class="absolute-bottom custom-caption">
+          <div class="text-h5" v-if="carouselTitle"> {{ carouselTitle }} </div>
+          <div class="text-subtitle1" v-if="photos.length > 0">
+            <q-btn rounded @click.prevent="openDetail({photo: photos[0], idx: 0, allPhotos: photos})">{{photos.length}} fotografií</q-btn>
+          </div>
+        </div>
+      </q-img>
     </q-carousel-slide>
   </q-carousel>
 
diff --git a/src/graphql/queries/copilots.js b/src/graphql/queries/copilots.js
index 1bc2036..16f85c8 100644
--- a/src/graphql/queries/copilots.js
+++ b/src/graphql/queries/copilots.js
@@ -1,5 +1,5 @@
 import gql from "graphql-tag";
-// import {FRAGMENT_FLIGHT_LIST_INFO} from "src/graphql/fragments/flight_list";
+import {FRAGMENT_FLIGHT_LIST_INFO} from "src/graphql/fragments/flight_list";
 import {FRAGMENT_COPILOT_FULL_INFO, FRAGMENT_COPILOT_LIST_INFO} from "src/graphql/fragments/copilot";
 
 export const COPILOTS_LIST = gql`
@@ -18,12 +18,11 @@ query copilot($id: Int!) {
     ...copilotFullInfo
 
     flights {
-    id
-    name
-
+      ...flightListInfo
     }
   }
 }
 
 ${FRAGMENT_COPILOT_FULL_INFO}
+${FRAGMENT_FLIGHT_LIST_INFO}
 `;
diff --git a/src/pages/profile/flight/FlightDetailPage.vue b/src/pages/profile/flight/FlightDetailPage.vue
index de774aa..994361a 100644
--- a/src/pages/profile/flight/FlightDetailPage.vue
+++ b/src/pages/profile/flight/FlightDetailPage.vue
@@ -69,7 +69,11 @@ const copyLinkToClipboard = () => {
   <FlightDetailSkeleton v-if="loading || !flight"/>
 
   <q-card class="flight-detail-card" v-else>
-    <PhotoCarousel :cover-photo-url="flight.coverPhoto?.url" :photos="flight.photos"/>
+    <PhotoCarousel
+      :cover-photo-url="flight.coverPhoto?.url"
+      :carousel-title="flightName(flight)"
+      :photos="flight.photos"
+    />
 
     <q-card-actions class="q-my-md">
       <div class="col-grow">