Files
LauckCycles/resources/views/components/taller-card.blade.php
T

83 lines
6.3 KiB
PHP

@props(['job', 'color'])
@php
$borderColor = match($color) {
'red' => 'border-l-red-500 dark:border-l-red-500',
'yellow' => 'border-l-yellow-500 dark:border-l-yellow-500',
'neon' => 'border-l-neon-lime dark:border-l-neon-lime',
default => 'border-l-gray-500 dark:border-l-gray-500'
};
@endphp
<div class="bg-white dark:bg-panel-bg p-4 rounded-lg border border-gray-300 dark:border-neutral-700 border-l-4 {{ $borderColor }} shadow-lg group hover:bg-gray-50 dark:hover:bg-neutral-800 transition-colors">
<!-- Encabezado Tarjeta -->
<div class="flex justify-between items-start mb-2">
<span class="text-xs font-bold text-gray-800 dark:text-gray-300">{{ $job->client->name }}</span>
<span class="text-xs font-mono text-gray-600 dark:text-gray-400">{{ $job->scheduled_at->format('d/m H:i') }}</span>
</div>
<h4 class="text-gray-900 dark:text-white font-black text-sm mb-1">{{ $job->bike_model }}</h4>
<p class="text-gray-700 dark:text-gray-300 text-xs line-clamp-2 mb-3">{{ $job->problem_description }}</p>
<div class="flex justify-between items-center mb-3">
@if($job->estimated_cost)
<div>
<span class="text-xs text-gray-600 dark:text-gray-400">Presupuesto:</span>
<span class="text-sm font-mono text-gray-900 dark:text-white font-black">${{ number_format($job->estimated_cost, 0) }}</span>
</div>
@else
<div></div>
@endif
<a href="{{ route('appointments.show', $job) }}" class="text-xs font-bold text-neon-lime dark:text-neutral-900 bg-neutral-950 dark:bg-neon-lime rounded px-2.5 py-1 hover:bg-neutral-900/80 hover:dark:bg-[#b3e600] transition-colors flex items-center gap-1">
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
</svg>
Ver
</a>
</div>
<!-- Controles de Estado -->
<div class="flex justify-between items-center pt-2 border-t border-gray-200 dark:border-neutral-700 mt-2 opacity-100 md:opacity-50 group-hover:opacity-100 transition-opacity">
<!-- Botón Mover Atrás -->
@if($job->status !== 'pending')
<form action="{{ route('taller.updateStatus', $job) }}" method="POST">
@csrf @method('PATCH')
<input type="hidden" name="status" value="{{ $job->status === 'ready' ? 'in_progress' : 'pending' }}">
<button class="text-gray-500 hover:text-gray-900 dark:hover:text-white p-1" title="Volver al estado anterior">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
</button>
</form>
@else
<div></div> <!-- Espaciador -->
@endif
<!-- Enlace a WhatsApp -->
<a href="https://wa.me/{{ $job->contact_phone }}?text=Hola {{ $job->client->name }}, te escribimos de Lauck para avisarte sobre tu {{ $job->bike_model }}..." target="_blank" class="flex flex-col items-center justify-center text-green-600 dark:text-green-400 hover:text-green-700 dark:hover:text-green-300 transition-colors group/wa">
<svg class="w-5 h-5 mb-0.5 group-hover/wa:scale-110 transition-transform" fill="currentColor" viewBox="0 0 24 24"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.008-.57-.008-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z"/></svg> <!-- (Usa el mismo SVG de whatsapp de antes) -->
<span class="text-[10px] font-bold tracking-wider uppercase">Avisar</span>
</a>
<!-- Botón Mover Adelante -->
@if($job->status !== 'ready')
<form action="{{ route('taller.updateStatus', $job) }}" method="POST">
@csrf @method('PATCH')
<input type="hidden" name="status" value="{{ $job->status === 'pending' ? 'in_progress' : 'ready' }}">
<button class="text-green-600 dark:text-neon-lime hover:text-gray-900 dark:hover:text-white p-1" title="Avanzar estado">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
</button>
</form>
@elseif($job->status === 'ready')
<!-- Botón Entregar (Archivar) -->
<form action="{{ route('taller.updateStatus', $job) }}" method="POST">
@csrf @method('PATCH')
<input type="hidden" name="status" value="delivered">
<button class="text-xs bg-green-600 dark:bg-neon-lime text-white dark:text-black px-3 py-1.5 rounded-lg font-bold hover:bg-green-700 dark:hover:bg-white transition-colors" title="Marcar como entregado">
Entregar
</button>
</form>
@endif
</div>
</div>