2026-02-19 22:05:20 +00:00

87 lines
4.3 KiB
PHP

@extends('layouts.app')
@section('title', 'Service Details')
@section('content')
<div class="mb-6">
<a href="{{ route('services.index') }}" class="text-blue-600 hover:text-blue-800 flex items-center gap-2 mb-4">
<i class="fas fa-arrow-left"></i> Back to Services
</a>
</div>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div class="lg:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="flex items-center justify-between mb-6">
<h2 class="text-xl font-bold text-gray-800">Service #{{ $service->id }}</h2>
<span class="px-3 py-1 rounded-full text-sm font-medium
{{ $service->status == 'completed' ? 'bg-green-100 text-green-700' : 'bg-amber-100 text-amber-700' }}">
{{ ucfirst($service->status) }}
</span>
</div>
<div class="grid grid-cols-2 gap-4 mb-6">
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Car</p>
<p class="font-semibold text-gray-800">{{ $service->car->brand }} {{ $service->car->model }}</p>
<p class="text-gray-500 text-sm">{{ $service->car->license_plate }}</p>
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Service Type</p>
<p class="font-semibold text-gray-800 capitalize">{{ str_replace('_', ' ', $service->type) }}</p>
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Service Date</p>
<p class="font-semibold text-gray-800">{{ $service->service_date->format('M d, Y') }}</p>
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Cost</p>
<p class="font-semibold text-gray-800"> BHD {{ number_format($service->cost, 0) }}</p>
</div>
@if($service->next_service_date)
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Next Service</p>
<p class="font-semibold text-gray-800">{{ $service->next_service_date->format('M d, Y') }}</p>
</div>
@endif
@if($service->mileage_at_service)
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-gray-500 text-sm">Mileage</p>
<p class="font-semibold text-gray-800">{{ number_format($service->mileage_at_service) }} km</p>
</div>
@endif
</div>
<div class="border-t pt-4">
<p class="text-gray-500 text-sm mb-1">Description</p>
<p class="text-gray-700">{{ $service->description }}</p>
</div>
<div class="flex gap-3 mt-6">
<a href="{{ route('services.edit', $service) }}" class="bg-blue-600 text-white px-4 py-2 rounded-lg hover:bg-blue-700 text-sm">Edit Service</a>
<form action="{{ route('services.destroy', $service) }}" method="POST">
@csrf
@method('DELETE')
<button type="submit" class="bg-red-600 text-white px-4 py-2 rounded-lg hover:bg-red-700 text-sm" onclick="return confirm('Delete this service?')">Delete Service</button>
</form>
</div>
</div>
</div>
<div>
<a href="{{ route('cars.show', $service->car) }}" class="block bg-white rounded-xl shadow-sm border border-gray-200 p-4 hover:border-blue-400 transition">
<h3 class="font-semibold text-gray-800 mb-2">Car Details</h3>
<div class="flex items-center gap-3">
<div class="w-12 h-12 rounded-lg bg-blue-100 flex items-center justify-center">
<i class="fas fa-car text-blue-600"></i>
</div>
<div>
<p class="font-medium text-gray-800">{{ $service->car->brand }} {{ $service->car->model }}</p>
<p class="text-sm text-gray-500">{{ $service->car->license_plate }}</p>
</div>
</div>
</a>
</div>
</div>
@endsection