@extends('layouts.admin')
@section('title', 'Compare Measurements - ' . $customer->full_name)
@section('page-title', 'Compare Measurements')
@section('content')
<div class="space-y-6">
    <div class="flex flex-wrap items-center justify-between gap-4">
        <a href="{{ route('customers.show', $customer) }}" class="text-sm text-slate-600 hover:text-slate-900">&larr; {{ $customer->full_name }}</a>
    </div>
    @if($profiles->isEmpty() || $profiles->count() < 2)
    <div class="rounded-xl border border-slate-200 bg-white p-6 shadow-sm">
        <p class="text-slate-600">Select at least two measurement profiles to compare. Add them as query params: <code class="text-sm bg-slate-100 px-1 rounded">?profiles[]=1&profiles[]=2</code></p>
        <p class="mt-3 text-sm text-slate-500">Or pick from the list:</p>
        @if(isset($allProfiles) && $allProfiles->count() >= 2)
        <form method="GET" action="{{ route('customers.measurement-profiles.compare', $customer) }}" class="mt-3 flex flex-wrap gap-2 items-end">
            <label class="block text-sm text-slate-600">Profile 1</label>
            <select name="profiles[]" class="rounded border border-slate-300 text-sm">
                @foreach($allProfiles as $p)<option value="{{ $p->id }}">{{ $p->measurementTemplate->template_name }} v{{ $p->version }} ({{ $p->date_taken->format('d M Y') }})</option>@endforeach
            </select>
            <label class="block text-sm text-slate-600 ml-2">Profile 2</label>
            <select name="profiles[]" class="rounded border border-slate-300 text-sm">
                @foreach($allProfiles as $p)<option value="{{ $p->id }}">{{ $p->measurementTemplate->template_name }} v{{ $p->version }} ({{ $p->date_taken->format('d M Y') }})</option>@endforeach
            </select>
            <button type="submit" class="ml-2 rounded-lg bg-slate-800 px-3 py-1.5 text-sm text-white">Compare</button>
        </form>
        @else
        <p class="mt-2 text-slate-500">This customer has fewer than 2 measurement profiles. Add more to compare.</p>
        @endif
    </div>
    @else
    <div class="overflow-x-auto rounded-xl border border-slate-200 bg-white shadow-sm">
        <table class="min-w-full divide-y divide-slate-200">
            <thead class="bg-slate-50">
                <tr>
                    <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-600">Field</th>
                    @foreach($profiles as $profile)
                    <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-600">{{ $profile->measurementTemplate->template_name }} v{{ $profile->version }}<br><span class="font-normal text-slate-500">{{ $profile->date_taken->format('d M Y') }}</span></th>
                    @endforeach
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-200 bg-white">
                @php $fields = $profiles->first()->measurementTemplate->fields; @endphp
                @foreach($fields as $field)
                <tr>
                    <td class="px-4 py-2 text-sm font-medium text-slate-800">{{ $field->label }} @if($field->unit)<span class="text-slate-500">({{ $field->unit }})</span>@endif</td>
                    @foreach($profiles as $profile)
                    <td class="px-4 py-2 text-sm text-slate-700">{{ $profile->getValueByFieldId($field->id) ?? '-' }}</td>
                    @endforeach
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @endif
</div>
@endsection