|  |  |  | @ -5,8 +5,10 @@ import Create from '@/Pages/Photo/Partials/Create.vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import Show from'@/Pages/Photo/Partials/Show.vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import Modal from '@/Pages/Photo/Partials/Modal.vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import { onMounted, reactive, ref } from 'vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import Edit from './Partials/Edit.vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import Panel from '../Photo/Partials/Panel.vue'; | 
			
		
	
		
			
				
					|  |  |  |  | import Platform from '@/platform'; | 
			
		
	
		
			
				
					|  |  |  |  | import Utils from '@/utils'; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const props = defineProps({ | 
			
		
	
		
			
				
					|  |  |  |  |     album: { | 
			
		
	
	
		
			
				
					|  |  |  | @ -25,6 +27,7 @@ const props = defineProps({ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const form = useForm({ uuids: [] }); | 
			
		
	
		
			
				
					|  |  |  |  | const create = reactive({ active: false }); | 
			
		
	
		
			
				
					|  |  |  |  | const edit = ref(false); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const fullScreenState = reactive({ photo: {}, active: false , prev: { square: true, list: false, } }); | 
			
		
	
		
			
				
					|  |  |  |  | const photoState = reactive({ square: true, list: false, pageCount: 1, photos: props.photos }); | 
			
		
	
	
		
			
				
					|  |  |  | @ -124,10 +127,20 @@ onMounted(() => { | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                 </div> | 
			
		
	
		
			
				
					|  |  |  |  |                 <div class="relative flex items-center"> | 
			
		
	
		
			
				
					|  |  |  |  |                     <button @click="create.active = !create.active" class="flex items-center hover:bg-black/10 rounded-md px-2 py-1"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <p class="font-medium laptop:mr-4 mr-1 laptop:text-lg text-sm">Ajouter une photo</p> | 
			
		
	
		
			
				
					|  |  |  |  |                         <img src="/icons/add.svg" class="h-8"> | 
			
		
	
		
			
				
					|  |  |  |  |                     </button> | 
			
		
	
		
			
				
					|  |  |  |  |                     <div id="affichage" class="static flex items-center bg-white rounded-md shadow-sm shadow-gray-300 overflow-hidden mx-2"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <button @click="edit = !edit" class="flex items-center h-full border-r border-gray-400 p-1 | 
			
		
	
		
			
				
					|  |  |  |  |                         hover:bg-black/5"> | 
			
		
	
		
			
				
					|  |  |  |  |                             <img src="/icons/modify.svg" class="h-7"> | 
			
		
	
		
			
				
					|  |  |  |  |                         </button> | 
			
		
	
		
			
				
					|  |  |  |  |                         <button @click="create.active = !create.active"  | 
			
		
	
		
			
				
					|  |  |  |  |                         class="flex items-center h-full p-1 | 
			
		
	
		
			
				
					|  |  |  |  |                         hover:bg-black/5"> | 
			
		
	
		
			
				
					|  |  |  |  |                             <img src="/icons/add.svg" class="h-7"> | 
			
		
	
		
			
				
					|  |  |  |  |                         </button> | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     <div class="absolute top-full right-0 mt-3 z-10"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <Edit v-if="edit" :album="album" @close="edit = false"/> | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     <Panel @data="(uuids) => addPhotos(uuids)" @close="create.active = !create.active" v-if="create.active" :album="props.album" | 
			
		
	
		
			
				
					|  |  |  |  |                     class="absolute right-0 top-[110%] z-10 mt-4 " /> | 
			
		
	
		
			
				
					|  |  |  |  |                 </div> | 
			
		
	
	
		
			
				
					|  |  |  | @ -136,7 +149,7 @@ onMounted(() => { | 
			
		
	
		
			
				
					|  |  |  |  |         <template #content> | 
			
		
	
		
			
				
					|  |  |  |  |             <div class="w-full desktop:px-[17.5%] laptop:px-[12.5%] h-full"> | 
			
		
	
		
			
				
					|  |  |  |  |                 <div v-if="!fullScreenState.active" class="w-full laptop:h-96 flex laptop:flex-row flex-col items-stretch justify-stretch overflow-hidden"> | 
			
		
	
		
			
				
					|  |  |  |  |                     <img :src="album.image"> | 
			
		
	
		
			
				
					|  |  |  |  |                     <img :src="Utils.DownloadUrl(album.image)"> | 
			
		
	
		
			
				
					|  |  |  |  |                     <div class="w-full h-full laptop:px-10 px-3 py-6"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <p class="text-7xl font-extrabold text-black/90">{{ album.name }}</p> | 
			
		
	
		
			
				
					|  |  |  |  |                         <p class="pt-1 pl-2 text-2xl font-extrabold text-black/90">publiée le {{ album.created_at }}</p> | 
			
		
	
	
		
			
				
					|  |  |  | 
 |