From 238310180f1b7a5c5b658d06c4b0c7847d296372 Mon Sep 17 00:00:00 2001 From: javier Date: Wed, 17 Jun 2026 12:42:18 +0200 Subject: [PATCH] feat(project-map): edit tab redesign, table cleanup, inspection viewer, base layers 1.1 Edit tab: in fullscreen the content splits into 2 columns (Alpine :class) 1.2 Full-width feature title with progress as a number badge on the left; removed the progress slider and the 'Save progress' button; Responsible now auto-saves on blur (wire:blur) 2. Features table: zebra/pinned-rows styling, progress badge; removed the Responsible and Template columns 3. Inspections table: same styling; wired the eye button to viewInspection() and added the inspection viewer modal (uses existing component state) 6a. Phases/layers collapse button moved into the panel title; a small floating button reopens it when collapsed (saves space) 6b. Base-layer switcher on the map: Streets / OpenStreetMap / Satellite (Esri) Issues tab (point 5) intentionally left untouched. Co-Authored-By: Claude Opus 4.8 (1M context) --- .../livewire/projects/project-map.blade.php | 159 ++++++++++++------ 1 file changed, 108 insertions(+), 51 deletions(-) diff --git a/resources/views/livewire/projects/project-map.blade.php b/resources/views/livewire/projects/project-map.blade.php index 771592a..6866dca 100644 --- a/resources/views/livewire/projects/project-map.blade.php +++ b/resources/views/livewire/projects/project-map.blade.php @@ -4,18 +4,22 @@
- -
-

{{ __('Phases and layers') }}

+ class="absolute top-2 right-2 z-[1000] bg-base-100 rounded-box shadow-xl p-4 w-72 border border-base-300 text-sm max-h-[calc(100vh-4rem)] overflow-y-auto"> +
+

{{ __('Phases and layers') }}

+ +
@foreach($phases as $phase)
@@ -134,30 +138,23 @@
@if($activeTab === 'edit') @if($selectedFeature) - -
-

{{ $selectedFeature->name ?? __('Feature') }}

-

{{ __('Phase') }}: {{ $selectedFeature->layer?->phase?->name ?? '—' }}

-

{{ __('Layer') }}: {{ $selectedFeature->layer?->name ?? '—' }}

-
- - {{-- Progreso --}} -
- - -
- 0%50%100% + {{-- Título a todo el ancho: progreso (solo número) a la izquierda + nombre --}} +
+ {{ $editProgress }}% +
+

{{ $selectedFeature->name ?? __('Feature') }}

+

{{ __('Phase') }}: {{ $selectedFeature->layer?->phase?->name ?? '—' }} · {{ __('Layer') }}: {{ $selectedFeature->layer?->name ?? '—' }}

-
- - -
- - + {{-- En pantalla completa el contenido se reparte en columnas --}} +
+
+ {{-- Responsable (se guarda al salir del campo) --}} +
+ + +
{{-- Gestor de archivos del feature --}}
@@ -171,7 +168,9 @@ ], key('media-feature-' . $selectedFeature->id))
+
+
{{-- Templates / Inspecciones --}} @if($templates->isNotEmpty())
{{ __('Inspection') }}
@@ -249,6 +248,8 @@ {{ __('Create') }}
@endif +
+
@else
@@ -258,30 +259,28 @@ @elseif($activeTab === 'features') @if($allFeatures->isNotEmpty()) -
- +
+
- - - - + + @foreach($allFeatures as $feature) - - + + - - - - + @endforeach @@ -297,26 +296,28 @@ @elseif($activeTab === 'inspections') @if($allInspections->isNotEmpty()) -
-
{{ __('Feature') }} {{ __('Layer') }} {{ __('Phase') }}{{ __('Progress') }}{{ __('Responsible') }}{{ __('Template') }}{{ __('Progress') }}
{{ $feature->name }}
{{ $feature->name }} {{ $feature->layer?->name ?? '—' }} {{ $feature->layer?->phase?->name ?? '—' }}{{ $feature->progress }}%{{ $feature->responsible ?? '-' }}{{ $feature->template?->name ?? '-' }} - + + {{ $feature->progress }}% + +
+
+
- + @foreach($allInspections as $inspection) - - - + + + - @endforeach @@ -334,6 +335,51 @@ @livewire('issue-manager', ['project' => $project], key('issues-tab-' . $project->id)) @endif + + {{-- Visor de inspección --}} + @if($viewingInspection) +
+
+
+

{{ __('Inspection') }} #{{ $viewingInspection['id'] }}

+ +
+ +
+
{{ __('Feature') }}: {{ $viewingInspection['feature_name'] }}
+
{{ __('Template') }}: {{ $viewingInspection['template_name'] }}
+
{{ __('Phase') }}: {{ $viewingInspection['phase_name'] }}
+
{{ __('Layer') }}: {{ $viewingInspection['layer_name'] }}
+
{{ __('User') }}: {{ $viewingInspection['user_name'] }}
+
{{ __('Date') }}: {{ $viewingInspection['date'] }}
+
+ + @if(!empty($viewingInspection['fields'])) +
{{ __('Data') }}
+
+ @foreach($viewingInspection['fields'] as $field) +
+ {{ $field['label'] ?? ($field['name'] ?? '') }} + {{ $viewingInspection['data'][$field['name']] ?? '—' }} +
+ @endforeach +
+ @endif + + @if(!empty($viewingInspection['notes'])) +
{{ __('Notes') }}
+

{{ $viewingInspection['notes'] }}

+ @endif + +
+ +
+
+
+
+ @endif @@ -382,9 +428,20 @@ const center = [{{ $project->lat }}, {{ $project->lng }}]; map = L.map('map').setView(center, 16); - L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png', { - attribution: '© OSM & CartoDB' - }).addTo(map); + // Capas base seleccionables (calles / OSM / satélite) + const baseLayers = { + '{{ __('Streets') }}': L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png', { + attribution: '© OSM & CartoDB' + }), + 'OpenStreetMap': L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: '© OpenStreetMap' + }), + '{{ __('Satellite') }}': L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', { + attribution: 'Tiles © Esri — Source: Esri, Maxar, Earthstar Geographics' + }), + }; + baseLayers['{{ __('Streets') }}'].addTo(map); + L.control.layers(baseLayers, null, { position: 'topleft' }).addTo(map); // Cargar fases y sus features @foreach($phases as $phase)
{{ __('Date') }} {{ __('Feature') }} {{ __('Template') }} {{ __('User') }}
{{ $inspection->created_at?->format('d/m/Y') ?? '—' }}{{ $inspection->feature?->name ?? '—' }}
{{ $inspection->created_at?->format('d/m/Y') ?? '—' }}{{ $inspection->feature?->name ?? '—' }} {{ $inspection->template?->name ?? '—' }} {{ $inspection->user?->name ?? '—' }} - + +