@extends('admin.layouts.app')
@section('title', $order->tracking_code)
@section('heading', __('admin.menu_repair_orders'))
@section('content')
<x-admin.page-header :title="$order->tracking_code" />

<div class="grid gap-4 lg:grid-cols-3">
    <div class="admin-card lg:col-span-2 space-y-4">
        <dl class="grid gap-3 sm:grid-cols-2 text-sm">
            <div><dt class="text-slate-500">{{ __('admin.repair_device') }}</dt><dd class="font-semibold">{{ $order->device_name }}</dd></div>
            <div><dt class="text-slate-500">{{ __('admin.repair_serial') }}</dt><dd dir="ltr">{{ $order->serial ?: '—' }}</dd></div>
            <div><dt class="text-slate-500">{{ __('admin.repair_customer_name') }}</dt><dd>{{ $order->customer_name ?? $order->user?->name }}</dd></div>
            <div><dt class="text-slate-500">{{ __('admin.repair_customer_mobile') }}</dt><dd dir="ltr">{{ $order->customer_mobile ?? $order->user?->mobile }}</dd></div>
            <div><dt class="text-slate-500">{{ __('admin.status') }}</dt><dd><span class="admin-badge">{{ \App\Domain\Repair\RepairOrderStatusPresenter::labelFor($order->status) }}</span></dd></div>
            <div><dt class="text-slate-500">{{ __('admin.repair_received_at') }}</dt><dd><x-admin.relative-date :date="$order->received_at" /></dd></div>
            <div><dt class="text-slate-500">{{ __('admin.repair_progress') }}</dt><dd>{{ \App\Domain\Repair\RepairOrderStatusPresenter::progressFor($order->status) }}%</dd></div>
        </dl>
        @if ($order->issue_body)
            <div>
                <h3 class="mb-2 font-semibold">{{ __('admin.body') }}</h3>
                <p class="whitespace-pre-wrap text-sm">{{ $order->issue_body }}</p>
            </div>
        @endif

        @can(\App\Models\Permission::ORDERS_INVOICE)
        <form method="post" action="{{ route('admin.repair-orders.final-cost', $order) }}" class="flex flex-wrap items-end gap-3 border-t border-slate-100 pt-4">
            @csrf
            @method('PATCH')
            <div>
                <label class="admin-label">{{ __('admin.repair_final_cost') }}</label>
                <input type="number" name="final_cost" step="0.01" min="0" class="admin-input" value="{{ old('final_cost', $order->final_cost) }}" />
            </div>
            <button type="submit" class="admin-btn-primary">{{ __('admin.save') }}</button>
        </form>
        @endcan

        @can(\App\Models\Permission::ORDERS_STATUS)
        <form method="post" action="{{ route('admin.repair-orders.status', $order) }}" class="flex flex-wrap items-end gap-3 border-t border-slate-100 pt-4">
            @csrf
            @method('PATCH')
            <div>
                <label class="admin-label">{{ __('admin.repair_update_status') }}</label>
                <select name="status" class="admin-input">
                    @foreach ($statuses as $status)
                        <option value="{{ $status }}" @selected($order->status === $status)>{{ \App\Domain\Repair\RepairOrderStatusPresenter::labelFor($status) }}</option>
                    @endforeach
                </select>
            </div>
            <div class="min-w-[12rem] flex-1">
                <label class="admin-label">{{ __('admin.repair_status_note') }}</label>
                <input type="text" name="note" class="admin-input" maxlength="1000" value="{{ old('note') }}" />
            </div>
            <button type="submit" class="admin-btn-primary">{{ __('admin.save') }}</button>
        </form>
        @endcan

        @if ($order->statusLogs->isNotEmpty())
            <div class="border-t border-slate-100 pt-4">
                <h3 class="mb-3 font-semibold">{{ __('admin.repair_status_timeline') }}</h3>
                <ol class="space-y-2 text-sm">
                    @foreach ($order->statusLogs as $log)
                        <li class="flex flex-wrap gap-2">
                            <span class="text-slate-500"><x-admin.relative-date :date="$log->created_at" /></span>
                            <span>
                                @if ($log->from_status)
                                    {{ \App\Domain\Repair\RepairOrderStatusPresenter::labelFor($log->from_status) }}
                                    →
                                @endif
                                {{ \App\Domain\Repair\RepairOrderStatusPresenter::labelFor($log->to_status) }}
                            </span>
                            @if ($log->user)
                                <span class="text-slate-400">({{ $log->user->name }})</span>
                            @endif
                            @if ($log->note)
                                <p class="w-full text-slate-600">{{ $log->note }}</p>
                            @endif
                        </li>
                    @endforeach
                </ol>
            </div>
        @endif

        <div class="border-t border-slate-100 pt-4 space-y-4">
            <h3 class="font-semibold">{{ __('admin.repair_photos') }}</h3>

            @can(\App\Models\Permission::MEDIA_UPLOAD)
            <form method="post" action="{{ route('admin.repair-orders.photos.store', $order) }}" enctype="multipart/form-data" class="flex flex-wrap items-end gap-3">
                @csrf
                <div>
                    <label class="admin-label">{{ __('admin.image') }}</label>
                    <input type="file" name="photo" accept="image/*" class="admin-input" required />
                </div>
                <div>
                    <label class="admin-label">{{ __('admin.repair_photo_tag') }}</label>
                    <input type="text" name="tag" class="admin-input" maxlength="64" placeholder="{{ __('admin.optional') }}" />
                </div>
                <button type="submit" class="admin-btn-primary">{{ __('admin.repair_upload_photo') }}</button>
            </form>
            @endcan

            @if ($order->photos->isNotEmpty())
                <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
                    @foreach ($order->photos as $photo)
                        <div class="rounded-lg border border-slate-100 p-2">
                            <img src="{{ $photo->url() }}" alt="" class="h-32 w-full rounded object-cover" />
                            @if ($photo->tag)
                                <p class="mt-1 text-xs text-slate-500">{{ $photo->tag }}</p>
                            @endif
                            @can(\App\Models\Permission::MEDIA_DELETE)
                            <form method="post" action="{{ route('admin.repair-orders.photos.destroy', [$order, $photo]) }}" class="mt-2"
                                onsubmit="return confirm(@js(__('admin.confirm_delete')))">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="text-xs text-red-600">{{ __('admin.delete') }}</button>
                            </form>
                            @endcan
                        </div>
                    @endforeach
                </div>
            @endif
        </div>
    </div>

    <div class="admin-card space-y-4">
        @if ($order->qr_code_path)
            <div class="text-center">
                <img src="{{ asset('storage/'.$order->qr_code_path) }}" alt="" class="mx-auto h-40 w-40" />
            </div>
        @endif
        @if ($order->complaint_id)
            <a href="{{ route('admin.complaints.show', $order->complaint_id) }}" class="admin-btn-muted block text-center">{{ __('admin.complaint_source') }}</a>
        @endif
        @can(\App\Models\Permission::ORDERS_INVOICE)
            <a href="{{ route('admin.repair-orders.invoice', $order) }}" target="_blank" class="admin-btn-muted block text-center">{{ __('admin.repair_invoice') }}</a>
        @endcan
    </div>
</div>
@endsection