@extends('layouts.app')
@section('title', $transfer->reference)

@section('content')
    <div class="mb-4"><a href="{{ route('transfers.index') }}" class="text-sm text-brand-600 hover:underline">&larr; {{ __('Back') }}</a></div>
    <div class="card">
        <div class="flex items-start justify-between">
            <div>
                <h2 class="text-lg font-bold">{{ $transfer->reference }}</h2>
                <p class="text-sm text-slate-400">{{ $transfer->fromStore?->name }} &rarr; {{ $transfer->toStore?->name }}</p>
            </div>
            <span class="badge {{ $transfer->status === 'validated' ? 'bg-brand-100 text-brand-700' : 'bg-amber-100 text-amber-700' }}">{{ __(ucfirst($transfer->status)) }}</span>
        </div>
        <table class="mt-4 min-w-full divide-y divide-slate-100">
            <thead><tr><th class="th">{{ __('Product') }}</th><th class="th">{{ __('Batch') }}</th><th class="th">{{ __('Quantity') }}</th></tr></thead>
            <tbody class="divide-y divide-slate-100">
                @foreach ($transfer->items as $item)
                    <tr>
                        <td class="td">{{ $item->product?->name }}</td>
                        <td class="td font-mono text-xs">{{ $item->batch?->batch_number }}</td>
                        <td class="td font-semibold">{{ $item->quantity }}</td>
                    </tr>
                @endforeach
            </tbody>
        </table>

        @if (! in_array($transfer->status, ['validated','received']))
            <form method="POST" action="{{ route('transfers.validate', $transfer) }}" class="mt-6 border-t border-slate-100 pt-4">
                @csrf
                <h3 class="mb-3 text-sm font-semibold">{{ __('Signatures') }}</h3>
                <div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
                    <div><label class="label">{{ __('Requester') }}</label><input type="text" value="{{ $transfer->user?->name }}" disabled class="input bg-slate-50"></div>
                    <div><label class="label">{{ __('Approver') }}</label><input type="text" name="approved_signature" value="{{ auth()->user()->name }}" class="input"></div>
                    <div><label class="label">{{ __('Receiver (name)') }}</label><input type="text" name="received_by_name" class="input"></div>
                </div>
                <div class="mt-4 text-right">
                    <button class="btn-primary">{{ __('Validate & update stock') }}</button>
                </div>
            </form>
        @else
            <div class="mt-6 grid grid-cols-1 gap-4 border-t border-slate-100 pt-4 text-sm sm:grid-cols-3">
                <div><p class="text-slate-400">{{ __('Requester') }}</p><p class="font-medium">{{ $transfer->requested_signature ?? $transfer->user?->name }}</p></div>
                <div><p class="text-slate-400">{{ __('Approver') }}</p><p class="font-medium">{{ $transfer->approved_signature ?? $transfer->validator?->name }}</p></div>
                <div><p class="text-slate-400">{{ __('Receiver') }}</p><p class="font-medium">{{ $transfer->received_by_name ?? '—' }}</p></div>
            </div>
            <p class="mt-3 text-xs text-brand-700">{{ __('Validated on :date', ['date' => $transfer->validated_at?->format('d/m/Y H:i')]) }}</p>
        @endif
    </div>
@endsection