matthieu
5b9c4ca09d
Rework CSS theme (app.css), navbar layout, dashboard page, machine detail, catalog pages, and various form/display components for better consistency and mobile responsiveness. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
120 lines
3.4 KiB
Vue
120 lines
3.4 KiB
Vue
<template>
|
|
<main class="container mx-auto px-6 py-8">
|
|
<DocumentPreviewModal
|
|
:document="previewDocument"
|
|
:visible="previewVisible"
|
|
:documents="siteDocuments"
|
|
@close="closePreview"
|
|
/>
|
|
|
|
<div class="my-8">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h2 class="text-2xl font-bold">
|
|
Sites
|
|
</h2>
|
|
<button v-if="canEdit" class="btn btn-primary" @click="openCreateSiteModal">
|
|
<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" />
|
|
</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-base-content/30 mb-4" aria-hidden="true" />
|
|
<h3 class="text-lg font-medium text-base-content mb-2">
|
|
Aucun site trouvé
|
|
</h3>
|
|
<p class="text-base-content/50 mb-4">
|
|
Commencez par ajouter votre premier site.
|
|
</p>
|
|
<button v-if="canEdit" class="btn btn-primary" @click="openCreateSiteModal">
|
|
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"
|
|
:disabled="!canEdit"
|
|
@close="closeCreateModal"
|
|
@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"
|
|
:disabled="!canEdit"
|
|
@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 { canEdit } = usePermissions()
|
|
|
|
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,
|
|
openCreateSiteModal,
|
|
closeCreateModal
|
|
} = useSiteManagement()
|
|
</script>
|