Initial commit: CABM-IT (ItGlue-style MSP documentation platform)
Laravel 13 + Livewire/Volt app for managing client organizations, documents, passwords, flexible assets, virtual machines, contacts, domains, todos, shortcuts, and role-based user administration.
This commit is contained in:
@@ -0,0 +1,153 @@
|
||||
<?php
|
||||
|
||||
use App\Models\Document;
|
||||
use App\Models\Organization;
|
||||
use Livewire\Attributes\Url;
|
||||
use Livewire\Component;
|
||||
|
||||
new class extends Component
|
||||
{
|
||||
public Organization $organization;
|
||||
public Document $document;
|
||||
|
||||
#[Url]
|
||||
public bool $edit = false;
|
||||
|
||||
public string $name = '';
|
||||
public string $content = '';
|
||||
public bool $showPreview = false;
|
||||
|
||||
public function mount(Organization $organization, Document $document): void
|
||||
{
|
||||
abort_unless($document->isMarkdown(), 404);
|
||||
|
||||
$this->organization = $organization;
|
||||
$this->document = $document;
|
||||
$this->name = $document->name;
|
||||
$this->content = $document->content ?? '';
|
||||
}
|
||||
|
||||
public function save(): void
|
||||
{
|
||||
$validated = $this->validate([
|
||||
'name' => 'required|string|max:255',
|
||||
'content' => 'nullable|string',
|
||||
]);
|
||||
|
||||
$contentChanged = $this->document->content !== $this->content;
|
||||
|
||||
$this->document->update($validated);
|
||||
|
||||
if ($contentChanged) {
|
||||
$this->document->increment('current_version');
|
||||
$this->document->versions()->create([
|
||||
'version' => $this->document->current_version,
|
||||
'content' => $this->content,
|
||||
'created_by' => auth()->id(),
|
||||
]);
|
||||
}
|
||||
|
||||
session()->flash('status', "\"{$this->document->name}\" mis à jour.");
|
||||
$this->edit = false;
|
||||
}
|
||||
|
||||
public function renderedPreview(): string
|
||||
{
|
||||
return (new League\CommonMark\CommonMarkConverter())->convert($this->content ?? '')->getContent();
|
||||
}
|
||||
};
|
||||
?>
|
||||
|
||||
<div class="max-w-5xl">
|
||||
<p class="text-sm text-slate-500">{{ $organization->name }}</p>
|
||||
|
||||
<div class="mb-6 flex items-center justify-between">
|
||||
<h1 class="text-2xl font-semibold text-slate-900">{{ $document->name }}</h1>
|
||||
|
||||
<div class="flex items-center gap-4">
|
||||
@unless ($edit)
|
||||
<button type="button" wire:click="$set('edit', true)"
|
||||
class="rounded bg-slate-900 px-4 py-2 text-sm font-medium text-white hover:bg-slate-700">
|
||||
Modifier
|
||||
</button>
|
||||
@endunless
|
||||
<a href="{{ route('organizations.documents.index', [$organization, 'folder' => $document->folder_id]) }}"
|
||||
class="text-sm text-slate-500 hover:text-slate-900">Retour</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (! $edit)
|
||||
<div class="prose prose-sm max-w-none rounded border border-slate-200 bg-white p-6">
|
||||
@if (trim($document->content ?? '') === '')
|
||||
<p class="text-sm text-slate-400 italic">Ce document est vide.</p>
|
||||
@else
|
||||
{!! $this->renderedPreview() !!}
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
<form wire:submit="save" class="space-y-4 rounded border border-slate-200 bg-white p-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Nom</label>
|
||||
<input type="text" wire:model="name"
|
||||
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
||||
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="mb-1 flex items-center justify-between">
|
||||
<label class="block text-sm font-medium text-slate-700">Contenu (Markdown)</label>
|
||||
<button type="button" wire:click="$toggle('showPreview')" class="text-sm text-slate-500 hover:text-slate-900">
|
||||
{{ $showPreview ? 'Masquer l\'aperçu' : 'Afficher l\'aperçu' }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<details class="mb-3 rounded border border-slate-200 bg-slate-50 text-sm">
|
||||
<summary class="cursor-pointer select-none px-3 py-2 font-medium text-slate-600 hover:text-slate-900">
|
||||
Aide-mémoire syntaxe Markdown
|
||||
</summary>
|
||||
<div class="grid grid-cols-1 gap-x-6 gap-y-1 border-t border-slate-200 px-3 py-3 font-mono text-xs text-slate-600 sm:grid-cols-2">
|
||||
<div># Titre 1</div>
|
||||
<div>## Titre 2</div>
|
||||
<div>**gras**</div>
|
||||
<div>*italique*</div>
|
||||
<div>~~barré~~</div>
|
||||
<div>`code`</div>
|
||||
<div>[texte](https://exemple.com)</div>
|
||||
<div></div>
|
||||
<div>- élément de liste</div>
|
||||
<div>1. élément numéroté</div>
|
||||
<div>> citation</div>
|
||||
<div>--- (ligne horizontale)</div>
|
||||
<div>```<br>bloc de code<br>```</div>
|
||||
<div>| A | B |<br>|---|---|<br>| 1 | 2 |</div>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<div class="grid gap-4 {{ $showPreview ? 'grid-cols-2' : 'grid-cols-1' }}">
|
||||
<textarea wire:model.live.debounce.500ms="content" rows="20"
|
||||
class="w-full rounded border-slate-300 font-mono text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500"></textarea>
|
||||
|
||||
@if ($showPreview)
|
||||
<div class="prose prose-sm max-w-none rounded border border-slate-200 bg-slate-50 p-4">
|
||||
{!! $this->renderedPreview() !!}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3 pt-2">
|
||||
<button type="submit"
|
||||
class="rounded bg-slate-900 px-4 py-2 text-sm font-medium text-white hover:bg-slate-700">
|
||||
Enregistrer
|
||||
</button>
|
||||
<button type="button" wire:click="$set('edit', false)" class="text-sm text-slate-500 hover:text-slate-900">Annuler</button>
|
||||
</div>
|
||||
</form>
|
||||
@endif
|
||||
|
||||
<x-documents.version-history :document="$document" />
|
||||
|
||||
<div class="mt-8">
|
||||
<livewire:related-items.panel :organization="$organization" :item="$document" :key="'related-'.$document->id" />
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user