107 lines
3.1 KiB
Vue
107 lines
3.1 KiB
Vue
<template>
|
|
<main class="container mx-auto px-6 py-8">
|
|
<DocumentPreviewModal
|
|
:document="previewDocument"
|
|
:visible="previewVisible"
|
|
@close="closePreview"
|
|
/>
|
|
|
|
<div class="my-8">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h2 class="text-2xl font-bold">Sites</h2>
|
|
<button @click="showAddSiteModal = true" class="btn btn-primary">
|
|
<IconLucidePlus class="w-5 h-5 mr-2" aria-hidden="true" />
|
|
Ajouter un site
|
|
</button>
|
|
</div>
|
|
|
|
<div v-if="loading" class="flex justify-center items-center py-12">
|
|
<span class="loading loading-spinner loading-lg"></span>
|
|
</div>
|
|
|
|
<div v-else-if="sites.length === 0" class="text-center py-12">
|
|
<div class="max-w-md mx-auto">
|
|
<IconLucideMapPin class="w-16 h-16 mx-auto text-gray-400 mb-4" aria-hidden="true" />
|
|
<h3 class="text-lg font-medium text-gray-900 mb-2">Aucun site trouvé</h3>
|
|
<p class="text-gray-500 mb-4">Commencez par ajouter votre premier site.</p>
|
|
<button @click="showAddSiteModal = true" class="btn btn-primary">
|
|
Ajouter un site
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<SiteCard
|
|
v-for="site in sites"
|
|
:key="site.id"
|
|
:site="site"
|
|
@edit="editSite"
|
|
@delete="confirmDeleteSite"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<SiteCreateModal
|
|
:visible="showAddSiteModal"
|
|
:site="newSite"
|
|
@close="showAddSiteModal = false"
|
|
@submit="handleCreateSite"
|
|
/>
|
|
|
|
<SiteEditModal
|
|
:visible="showEditSiteModal"
|
|
:site-name="siteBeingEdited?.name || ''"
|
|
:form="editSiteForm"
|
|
:documents="siteDocuments"
|
|
:selected-files="selectedFiles"
|
|
:uploading-documents="uploadingDocuments"
|
|
:can-preview-document="canPreviewDocument"
|
|
:document-icon="documentIcon"
|
|
:format-size="formatSize"
|
|
@close="closeEditModal"
|
|
@submit="handleUpdateSite"
|
|
@remove-document="handleRemoveSiteDocument"
|
|
@download-document="downloadDocument"
|
|
@preview-document="openPreview"
|
|
@update:selected-files="(files) => (selectedFiles.value = files)"
|
|
/>
|
|
</main>
|
|
</template>
|
|
|
|
<script setup>
|
|
import IconLucideMapPin from '~icons/lucide/map-pin'
|
|
import IconLucidePlus from '~icons/lucide/plus'
|
|
import DocumentPreviewModal from '~/components/DocumentPreviewModal.vue'
|
|
import SiteCard from '~/components/sites/SiteCard.vue'
|
|
import SiteCreateModal from '~/components/sites/SiteCreateModal.vue'
|
|
import SiteEditModal from '~/components/sites/SiteEditModal.vue'
|
|
import { useSiteManagement } from '~/composables/useSiteManagement'
|
|
|
|
const {
|
|
sites,
|
|
loading,
|
|
showAddSiteModal,
|
|
showEditSiteModal,
|
|
siteBeingEdited,
|
|
newSite,
|
|
editSiteForm,
|
|
selectedFiles,
|
|
uploadingDocuments,
|
|
previewDocument,
|
|
previewVisible,
|
|
siteDocuments,
|
|
documentIcon,
|
|
handleCreateSite,
|
|
editSite,
|
|
handleUpdateSite,
|
|
closeEditModal,
|
|
handleRemoveSiteDocument,
|
|
downloadDocument,
|
|
openPreview,
|
|
closePreview,
|
|
formatSize,
|
|
confirmDeleteSite,
|
|
canPreviewDocument
|
|
} = useSiteManagement()
|
|
</script>
|