mrKamooandClaude Sonnet 5
c1c6d56d1e
- Navigation par dossiers dans la section Infrastructure (créer, parcourir, fil d'ariane), isolée du navigateur Documents comme les schémas eux-mêmes. - Un schéma peut être associé à un site de l'organisation, avec filtre par site dans la liste. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
241 lines
10 KiB
PHP
241 lines
10 KiB
PHP
<?php
|
|
|
|
use App\Models\Document;
|
|
use App\Models\Organization;
|
|
use Livewire\Attributes\Url;
|
|
use Livewire\Component;
|
|
|
|
new class extends Component
|
|
{
|
|
public Organization $organization;
|
|
|
|
#[Url]
|
|
public ?int $folderId = null;
|
|
|
|
#[Url]
|
|
public ?int $locationId = null;
|
|
|
|
public string $newDiagramName = '';
|
|
public bool $showNewDiagram = false;
|
|
|
|
public string $newFolderName = '';
|
|
public bool $showNewFolder = false;
|
|
|
|
public function createFolder(): void
|
|
{
|
|
$this->validate(['newFolderName' => 'required|string|max:255']);
|
|
|
|
$this->organization->documents()->create([
|
|
'folder_id' => $this->folderId,
|
|
'name' => $this->newFolderName,
|
|
'type' => 'diagram',
|
|
'is_folder' => true,
|
|
'created_by' => auth()->id(),
|
|
]);
|
|
|
|
$this->newFolderName = '';
|
|
$this->showNewFolder = false;
|
|
}
|
|
|
|
public function createDiagram(): void
|
|
{
|
|
$this->validate(['newDiagramName' => 'required|string|max:255']);
|
|
|
|
$emptyDiagram = <<<'XML'
|
|
<mxfile host="app.diagrams.net">
|
|
<diagram name="Page-1">
|
|
<mxGraphModel dx="800" dy="600" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
|
|
<root>
|
|
<mxCell id="0" />
|
|
<mxCell id="1" parent="0" />
|
|
</root>
|
|
</mxGraphModel>
|
|
</diagram>
|
|
</mxfile>
|
|
XML;
|
|
|
|
$document = $this->organization->documents()->create([
|
|
'folder_id' => $this->folderId,
|
|
'name' => $this->newDiagramName,
|
|
'type' => 'diagram',
|
|
'content' => $emptyDiagram,
|
|
'current_version' => 1,
|
|
'created_by' => auth()->id(),
|
|
]);
|
|
|
|
$document->versions()->create([
|
|
'version' => 1,
|
|
'content' => $emptyDiagram,
|
|
'created_by' => auth()->id(),
|
|
]);
|
|
|
|
$this->redirectRoute('organizations.infrastructure.edit', [$this->organization, $document, 'folderId' => $this->folderId], navigate: true);
|
|
}
|
|
|
|
public function delete(int $documentId): void
|
|
{
|
|
$document = $this->organization->documents()->where('type', 'diagram')->findOrFail($documentId);
|
|
$document->delete();
|
|
|
|
session()->flash('status', "« {$document->name} » supprimé.");
|
|
}
|
|
|
|
private function folderTree(\Illuminate\Support\Collection $allFolders): \Illuminate\Support\Collection
|
|
{
|
|
$byParent = $allFolders->groupBy('folder_id');
|
|
|
|
$walk = function ($parentId, $depth) use (&$walk, $byParent) {
|
|
return ($byParent->get($parentId) ?? collect())
|
|
->sortBy('name')
|
|
->flatMap(fn ($folder) => collect([['folder' => $folder, 'depth' => $depth]])
|
|
->concat($walk($folder->id, $depth + 1)));
|
|
};
|
|
|
|
return $walk(null, 0);
|
|
}
|
|
|
|
public function with(): array
|
|
{
|
|
$currentFolder = $this->folderId
|
|
? $this->organization->documents()->where('type', 'diagram')->find($this->folderId)
|
|
: null;
|
|
|
|
$breadcrumbs = collect();
|
|
$walk = $currentFolder;
|
|
while ($walk) {
|
|
$breadcrumbs->prepend($walk);
|
|
$walk = $walk->folder;
|
|
}
|
|
|
|
$allFolders = $this->organization->documents()->where('type', 'diagram')->where('is_folder', true)->get();
|
|
|
|
return [
|
|
'currentFolder' => $currentFolder,
|
|
'breadcrumbs' => $breadcrumbs,
|
|
'folderTree' => $this->folderTree($allFolders),
|
|
'locations' => $this->organization->locations()->orderBy('name')->get(),
|
|
'items' => $this->organization->documents()
|
|
->where('type', 'diagram')
|
|
->where('folder_id', $this->folderId)
|
|
->when($this->locationId, fn ($query) => $query->where('location_id', $this->locationId))
|
|
->with('location')
|
|
->orderByDesc('is_folder')
|
|
->orderBy('name')
|
|
->get(),
|
|
];
|
|
}
|
|
};
|
|
?>
|
|
|
|
<div>
|
|
<div class="mb-6 flex items-center justify-between">
|
|
<h1 class="text-2xl font-semibold text-slate-900">Infrastructure</h1>
|
|
<div class="flex gap-2">
|
|
<button type="button" wire:click="$set('showNewFolder', true)" title="Nouveau dossier"
|
|
class="flex h-10 w-10 cursor-pointer items-center justify-center rounded border border-slate-300 text-lg hover:bg-slate-50">
|
|
📁
|
|
</button>
|
|
<button type="button" wire:click="$set('showNewDiagram', true)"
|
|
class="cursor-pointer rounded bg-slate-900 px-4 py-2 text-sm font-medium text-white hover:bg-slate-700">
|
|
+ Nouveau schéma
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
@if (session('status'))
|
|
<div class="mb-4 rounded border border-emerald-200 bg-emerald-50 px-3 py-2 text-sm text-emerald-700">
|
|
{{ session('status') }}
|
|
</div>
|
|
@endif
|
|
|
|
<div class="mb-4 flex items-center justify-between gap-4">
|
|
<div class="flex items-center gap-1 text-sm text-slate-500">
|
|
<a wire:click="$set('folderId', null)" href="#" class="hover:text-slate-900">Infrastructure</a>
|
|
@foreach ($breadcrumbs as $crumb)
|
|
<span>/</span>
|
|
<a wire:click="$set('folderId', {{ $crumb->id }})" href="#" class="hover:text-slate-900">{{ $crumb->name }}</a>
|
|
@endforeach
|
|
</div>
|
|
|
|
@if ($locations->isNotEmpty())
|
|
<select wire:model.live="locationId" class="rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
<option value="">Tous les sites</option>
|
|
@foreach ($locations as $location)
|
|
<option value="{{ $location->id }}">{{ $location->name }}</option>
|
|
@endforeach
|
|
</select>
|
|
@endif
|
|
</div>
|
|
|
|
@if ($showNewFolder)
|
|
<form wire:submit="createFolder" class="mb-4 flex items-center gap-2 rounded border border-slate-200 bg-white p-3">
|
|
<input type="text" wire:model="newFolderName" placeholder="Nom du dossier" autofocus
|
|
class="flex-1 rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
<button type="submit" class="cursor-pointer rounded bg-slate-900 px-3 py-1.5 text-sm text-white hover:bg-slate-700">Créer</button>
|
|
<button type="button" wire:click="$set('showNewFolder', false)" class="cursor-pointer text-sm text-slate-500 hover:text-slate-900">Annuler</button>
|
|
@error('newFolderName') <p class="text-sm text-red-600">{{ $message }}</p> @enderror
|
|
</form>
|
|
@endif
|
|
|
|
@if ($showNewDiagram)
|
|
<form wire:submit="createDiagram" class="mb-4 flex items-start gap-2 rounded border border-slate-200 bg-white p-3">
|
|
<div class="flex-1">
|
|
<input type="text" wire:model="newDiagramName" placeholder="Ex: Schéma réseau - Mairie, Schéma fonctionnel - SI RH"
|
|
class="w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
@error('newDiagramName') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
|
|
</div>
|
|
<button type="submit" class="cursor-pointer rounded bg-slate-900 px-3 py-1.5 text-sm text-white hover:bg-slate-700">
|
|
Créer
|
|
</button>
|
|
</form>
|
|
@endif
|
|
|
|
<div class="overflow-hidden rounded border border-slate-200 bg-white">
|
|
<table class="min-w-full divide-y divide-slate-200 text-sm">
|
|
<thead class="bg-slate-50 text-left text-xs uppercase tracking-wide text-slate-500">
|
|
<tr>
|
|
<th class="px-4 py-3">Nom</th>
|
|
<th class="px-4 py-3">Site</th>
|
|
<th class="px-4 py-3">Mis à jour</th>
|
|
<th class="px-4 py-3"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-slate-100">
|
|
@forelse ($items as $item)
|
|
@php $isFolder = $item->isFolder(); @endphp
|
|
<tr wire:key="diagram-{{ $item->id }}">
|
|
<td class="px-4 py-3">
|
|
@if ($isFolder)
|
|
<a wire:click="$set('folderId', {{ $item->id }})" href="#" class="font-medium text-slate-900 hover:underline">
|
|
📁 {{ $item->name }}
|
|
</a>
|
|
@else
|
|
<a href="{{ route('organizations.infrastructure.edit', [$organization, $item, 'folderId' => $this->folderId]) }}" class="font-medium text-slate-900 hover:underline">
|
|
🗺️ {{ $item->name }}
|
|
</a>
|
|
@endif
|
|
</td>
|
|
<td class="px-4 py-3 text-slate-600">{{ $isFolder ? '—' : ($item->location?->name ?? '—') }}</td>
|
|
<td class="px-4 py-3 text-slate-600">{{ $item->updated_at->diffForHumans() }}</td>
|
|
<td class="px-4 py-3 text-right">
|
|
@unless ($isFolder)
|
|
<a href="{{ route('organizations.infrastructure.edit', [$organization, $item, 'folderId' => $this->folderId]) }}" class="text-slate-500 hover:text-slate-900">Ouvrir</a>
|
|
@endunless
|
|
<button type="button"
|
|
wire:click="delete({{ $item->id }})"
|
|
wire:confirm="Supprimer ce {{ $isFolder ? 'dossier' : 'schéma' }} ? Cette action est irréversible."
|
|
class="ml-3 cursor-pointer text-red-500 hover:text-red-700">
|
|
Supprimer
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="4" class="px-4 py-6 text-center text-slate-400">Dossier vide.</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|