mrKamooandClaude Sonnet 5
01233928cc
- Coordonnées GPS sur les sites (formulaire + carte Leaflet en direct sur la fiche et sur la liste des sites d'une organisation). - Duplication d'un actif depuis la liste. - Intégration GLPI en lecture seule : panneau "Tickets" sur le tableau de bord de l'organisation (tickets non clos, priorité, catégorie, extrait), organisations liées à leur entité GLPI via glpi_entity_id. - Corrige la mise en cache des permissions Spatie lors du seed (silencée par WithoutModelEvents) et rend le seeder admin idempotent. - Ajoute busy_timeout/WAL à la config SQLite pour éviter les erreurs de verrou sous écritures concurrentes. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
243 lines
11 KiB
PHP
243 lines
11 KiB
PHP
<?php
|
|
|
|
use App\Models\Location;
|
|
use App\Models\Organization;
|
|
use Livewire\Component;
|
|
|
|
new class extends Component
|
|
{
|
|
public Organization $organization;
|
|
public ?Location $location = null;
|
|
|
|
public string $name = '';
|
|
public string $address_line_1 = '';
|
|
public string $address_line_2 = '';
|
|
public string $city = '';
|
|
public string $region = '';
|
|
public string $postal_code = '';
|
|
public string $country = '';
|
|
public string $phone = '';
|
|
public bool $is_primary = false;
|
|
public ?float $latitude = null;
|
|
public ?float $longitude = null;
|
|
|
|
public function mount(Organization $organization, ?Location $location = null): void
|
|
{
|
|
$this->organization = $organization;
|
|
|
|
if ($location?->exists) {
|
|
$this->location = $location;
|
|
$this->name = $location->name;
|
|
$this->address_line_1 = $location->address_line_1 ?? '';
|
|
$this->address_line_2 = $location->address_line_2 ?? '';
|
|
$this->city = $location->city ?? '';
|
|
$this->region = $location->region ?? '';
|
|
$this->postal_code = $location->postal_code ?? '';
|
|
$this->country = $location->country ?? '';
|
|
$this->phone = $location->phone ?? '';
|
|
$this->is_primary = $location->is_primary;
|
|
$this->latitude = $location->latitude;
|
|
$this->longitude = $location->longitude;
|
|
}
|
|
}
|
|
|
|
public function save(): void
|
|
{
|
|
$validated = $this->validate([
|
|
'name' => 'required|string|max:255',
|
|
'address_line_1' => 'nullable|string|max:255',
|
|
'address_line_2' => 'nullable|string|max:255',
|
|
'city' => 'nullable|string|max:255',
|
|
'region' => 'nullable|string|max:255',
|
|
'postal_code' => 'nullable|string|max:255',
|
|
'country' => 'nullable|string|max:255',
|
|
'phone' => 'nullable|string|max:255',
|
|
'is_primary' => 'boolean',
|
|
'latitude' => 'nullable|numeric|between:-90,90',
|
|
'longitude' => 'nullable|numeric|between:-180,180',
|
|
]);
|
|
|
|
if ($validated['is_primary']) {
|
|
$this->organization->locations()
|
|
->when($this->location?->exists, fn ($query) => $query->whereKeyNot($this->location->id))
|
|
->update(['is_primary' => false]);
|
|
}
|
|
|
|
if ($this->location?->exists) {
|
|
$this->location->update($validated);
|
|
session()->flash('status', "Site \"{$this->location->name}\" mis à jour.");
|
|
} else {
|
|
$this->organization->locations()->create($validated);
|
|
session()->flash('status', "Site \"{$this->name}\" créé.");
|
|
}
|
|
|
|
$this->redirectRoute('organizations.locations.index', $this->organization, navigate: true);
|
|
}
|
|
};
|
|
?>
|
|
|
|
<div class="max-w-2xl">
|
|
<p class="text-sm text-slate-500">{{ $organization->name }}</p>
|
|
<h1 class="mb-6 text-2xl font-semibold text-slate-900">
|
|
{{ $location?->exists ? 'Modifier le site' : 'Nouveau site' }}
|
|
</h1>
|
|
|
|
<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>
|
|
<label class="block text-sm font-medium text-slate-700">Adresse ligne 1</label>
|
|
<input type="text" wire:model="address_line_1"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Adresse ligne 2</label>
|
|
<input type="text" wire:model="address_line_2"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
|
|
<div class="grid grid-cols-3 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Ville</label>
|
|
<input type="text" wire:model="city"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Région</label>
|
|
<input type="text" wire:model="region"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Code postal</label>
|
|
<input type="text" wire:model="postal_code"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Pays</label>
|
|
<input type="text" wire:model="country"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Téléphone</label>
|
|
<input type="text" wire:model="phone"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
</div>
|
|
</div>
|
|
|
|
<div x-data="locationMap({{ $latitude ?? 'null' }}, {{ $longitude ?? 'null' }})">
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Latitude</label>
|
|
<input type="number" step="any" min="-90" max="90" wire:model="latitude"
|
|
x-ref="latInput" x-on:input="onFieldInput()"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
@error('latitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-slate-700">Longitude</label>
|
|
<input type="number" step="any" min="-180" max="180" wire:model="longitude"
|
|
x-ref="lngInput" x-on:input="onFieldInput()"
|
|
class="mt-1 w-full rounded border-slate-300 text-sm shadow-sm focus:border-slate-500 focus:ring-slate-500">
|
|
@error('longitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-3 h-64 w-full overflow-hidden rounded border border-slate-200" x-ref="mapEl" wire:ignore></div>
|
|
<p class="mt-1 text-xs text-slate-500">Renseignez la latitude et la longitude pour positionner le site sur la carte.</p>
|
|
</div>
|
|
|
|
<label class="flex items-center gap-2 text-sm text-slate-700">
|
|
<input type="checkbox" wire:model="is_primary" class="rounded border-slate-300">
|
|
Site principal
|
|
</label>
|
|
|
|
<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>
|
|
<a href="{{ route('organizations.locations.index', $organization) }}" class="text-sm text-slate-500 hover:text-slate-900">Annuler</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
@once
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
|
|
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
|
<script>
|
|
(function () {
|
|
const link = document.createElement('link');
|
|
link.rel = 'stylesheet';
|
|
link.href = 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';
|
|
link.integrity = 'sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=';
|
|
link.crossOrigin = '';
|
|
document.head.appendChild(link);
|
|
|
|
// Leaflet normally auto-detects its marker image path by scanning
|
|
// <link> tags already in the document when leaflet.js runs — but
|
|
// that link is injected above, after leaflet.js has loaded, so
|
|
// detection fails. Point the icons at the CDN explicitly instead.
|
|
delete L.Icon.Default.prototype._getIconUrl;
|
|
L.Icon.Default.mergeOptions({
|
|
iconRetinaUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-icon-2x.png',
|
|
iconUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-icon.png',
|
|
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
|
|
});
|
|
})();
|
|
|
|
function locationMap(initialLat, initialLng) {
|
|
return {
|
|
map: null,
|
|
marker: null,
|
|
|
|
init() {
|
|
const hasCoords = initialLat !== null && initialLng !== null;
|
|
|
|
this.map = L.map(this.$refs.mapEl).setView(
|
|
hasCoords ? [initialLat, initialLng] : [46.6, 2.4], // France, vue d'ensemble par défaut
|
|
hasCoords ? 14 : 5
|
|
);
|
|
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
|
|
maxZoom: 19,
|
|
}).addTo(this.map);
|
|
|
|
if (hasCoords) {
|
|
this.marker = L.marker([initialLat, initialLng]).addTo(this.map);
|
|
}
|
|
},
|
|
|
|
onFieldInput() {
|
|
const lat = parseFloat(this.$refs.latInput.value);
|
|
const lng = parseFloat(this.$refs.lngInput.value);
|
|
|
|
if (isNaN(lat) || isNaN(lng)) {
|
|
if (this.marker) {
|
|
this.map.removeLayer(this.marker);
|
|
this.marker = null;
|
|
}
|
|
return;
|
|
}
|
|
|
|
if (this.marker) {
|
|
this.marker.setLatLng([lat, lng]);
|
|
} else {
|
|
this.marker = L.marker([lat, lng]).addTo(this.map);
|
|
}
|
|
this.map.setView([lat, lng], Math.max(this.map.getZoom(), 14));
|
|
},
|
|
};
|
|
}
|
|
</script>
|
|
@endonce
|