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

@section('content')
@php($input = 'mt-1 w-full rounded border border-slate-300 px-2 py-1.5 text-sm')
@php($stageIndex = array_search($deal->stage, \App\Models\DealRoom::STAGES))
<div class="flex flex-wrap items-center justify-between gap-2">
    <div>
        <h1 class="text-xl font-bold">Deal room {{ $deal->reference }}</h1>
        <p class="text-sm text-slate-500">✔ {{ $deal->seller->company_name }} → ✔ {{ $deal->buyer->company_name }}</p>
    </div>
    <a href="{{ route('deals.proforma', $deal) }}" target="_blank" class="rounded border border-slate-900 px-3 py-2 text-sm font-semibold">Proforma Invoice</a>
</div>

{{-- Stage tracker --}}
<ol class="mt-4 flex gap-1 overflow-x-auto text-[11px] font-semibold uppercase">
    @foreach (\App\Models\DealRoom::STAGES as $i => $stage)
        <li class="flex-1 whitespace-nowrap rounded px-2 py-2 text-center {{ $stageIndex !== false && $i <= $stageIndex ? 'bg-crimson text-white' : 'bg-slate-200 text-slate-500' }}">
            {{ str_replace('_', ' ', $stage) }}
        </li>
    @endforeach
</ol>
@if (in_array($deal->stage, ['cancelled', 'disputed']))
    <p class="mt-2 rounded border border-red-200 bg-red-50 p-3 text-sm font-semibold text-red-800">This deal is {{ $deal->stage }}.</p>
@endif

<div class="mt-5 grid gap-6 lg:grid-cols-[1fr_380px]">
    {{-- Chat --}}
    <section class="flex flex-col rounded-lg border border-slate-200 bg-white">
        <h2 class="border-b border-slate-200 px-4 py-3 font-semibold">Secure chat <span class="text-xs font-normal text-slate-500">· every line is server-timestamped</span></h2>
        <div class="max-h-[55vh] flex-1 space-y-3 overflow-y-auto p-4 text-sm">
            @foreach ($deal->messages as $m)
                @if ($m->sender_id === null)
                    <p class="text-center text-xs text-slate-500">— {{ $m->body }} · {{ $m->created_at->format('d M Y H:i') }} —</p>
                @else
                    @php($me = $m->sender_id === auth()->id())
                    <div class="{{ $me ? 'ml-auto bg-slate-900 text-white' : 'bg-slate-100' }} max-w-[85%] rounded-lg px-3 py-2">
                        <p class="text-[11px] opacity-70">{{ $m->sender?->company_name ?? $m->sender?->name ?? 'Former user' }} · {{ $m->created_at->format('d M Y H:i') }}</p>
                        <p class="whitespace-pre-line">{{ $m->body }}</p>
                    </div>
                @endif
            @endforeach
        </div>
        @if ($deal->stage !== 'cancelled')
            <form method="POST" action="{{ route('deals.message', $deal) }}" class="flex gap-2 border-t border-slate-200 p-3">
                @csrf
                <input type="text" name="body" maxlength="4000" required placeholder="Write a message" class="flex-1 rounded border border-slate-300 px-3 py-2 text-sm">
                <button class="rounded bg-crimson px-4 py-2 text-sm font-semibold text-white">Send</button>
            </form>
        @endif
    </section>

    <aside class="space-y-4 text-sm">
        {{-- Terms --}}
        <div class="rounded-lg border border-slate-200 bg-white p-4">
            <h2 class="font-semibold">Agreed terms</h2>
            <dl class="mt-2 space-y-1">
                <div class="flex justify-between"><dt class="text-slate-500">Product</dt><dd>{{ $deal->productLabel() }}</dd></div>
                <div class="flex justify-between"><dt class="text-slate-500">Volume</dt><dd>{{ number_format($deal->volume_mt, 2) }} MT</dd></div>
                <div class="flex justify-between"><dt class="text-slate-500">Mill price</dt><dd>USD {{ number_format($deal->price_usd_per_mt, 2) }}/MT {{ $deal->incoterm }}</dd></div>
                <div class="flex justify-between font-semibold"><dt>Total</dt><dd>USD {{ number_format($deal->total_value_usd, 2) }}</dd></div>
            </dl>
            <p class="mt-2 rounded bg-slate-50 p-2 text-xs text-slate-600">Zero-markup: this is the price quoted by the mill. No agent fee is added to it.</p>
        </div>

        {{-- Next step --}}
        @if ($next)
            <form method="POST" action="{{ route('deals.advance', $deal) }}" class="rounded-lg border border-amber-300 bg-amber-50 p-4">
                @csrf
                <h2 class="font-semibold">Next step</h2>
                @if ($next[0] === 'shipped')
                    <div class="mt-2 grid grid-cols-2 gap-2">
                        <label class="col-span-2">BL number <input type="text" name="bl_number" required class="{{ $input }}"></label>
                        <label class="col-span-2">Vessel <input type="text" name="vessel_name" class="{{ $input }}"></label>
                        <label>ETD <input type="date" name="etd" class="{{ $input }}"></label>
                        <label>ETA <input type="date" name="eta" class="{{ $input }}"></label>
                    </div>
                @endif
                <button class="mt-3 w-full rounded bg-crimson px-3 py-2 font-semibold text-white">{{ $next[2] }}</button>
            </form>
        @elseif ($waitingOn && ! in_array($deal->stage, ['cancelled', 'disputed']))
            <p class="rounded-lg border border-slate-200 bg-white p-4 text-slate-600">Waiting on the {{ $waitingOn }} for the next step.</p>
        @endif

        {{-- Payment & financing --}}
        <div class="rounded-lg border border-slate-200 bg-white p-4">
            <h2 class="font-semibold">Payment &amp; trade financing</h2>
            <p class="mt-1">{{ config('drixem.payment_methods.'.$deal->payment_method) }}
                @if ($deal->financing_status !== 'none')
                    · <span class="font-semibold uppercase text-amber-700">{{ $deal->financing_status }}</span>
                    @if ($deal->financing_ref) ({{ $deal->financing_ref }}) @endif
                @endif
            </p>
            @if (! $deal->isClosed())
                <form method="POST" action="{{ route('deals.financing', $deal) }}" class="mt-2 flex flex-wrap gap-2">
                    @csrf
                    @if ($party === 'buyer')
                        <select name="payment_method" class="flex-1 rounded border border-slate-300 px-2 py-1.5">
                            @foreach (config('drixem.payment_methods') as $key => $label)
                                @if ($key !== 'EXIM_FINANCING' || config('drixem.exim_financing_enabled'))
                                    <option value="{{ $key }}" @selected($deal->payment_method === $key)>{{ $label }}</option>
                                @endif
                            @endforeach
                        </select>
                        <button class="rounded bg-slate-900 px-3 py-1.5 font-semibold text-white">Update</button>
                    @elseif ($party === 'admin')
                        <select name="financing_status" class="rounded border border-slate-300 px-2 py-1.5">
                            @foreach (['none', 'requested', 'submitted', 'approved', 'declined'] as $s)<option @selected($deal->financing_status === $s)>{{ $s }}</option>@endforeach
                        </select>
                        <input type="text" name="financing_ref" value="{{ $deal->financing_ref }}" placeholder="Bank ref" class="flex-1 rounded border border-slate-300 px-2 py-1.5">
                        <button class="rounded bg-slate-900 px-3 py-1.5 font-semibold text-white">Save</button>
                    @endif
                </form>
            @endif
        </div>

        {{-- Shipment --}}
        @if ($deal->bl_number)
            <div class="rounded-lg border border-slate-200 bg-white p-4">
                <h2 class="font-semibold">Bill of Lading tracking</h2>
                <p class="mt-1">BL {{ $deal->bl_number }} @if ($deal->vessel_name) · {{ $deal->vessel_name }} @endif</p>
                <p class="text-xs text-slate-500">ETD {{ $deal->etd?->format('d M Y') ?? '—' }} · ETA {{ $deal->eta?->format('d M Y') ?? '—' }}</p>
            </div>
        @endif

        {{-- Vault --}}
        <div class="rounded-lg border border-slate-200 bg-white p-4">
            <h2 class="font-semibold">Document vault</h2>
            <ul class="mt-2 space-y-1 text-xs">
                @forelse ($deal->documents as $doc)
                    <li class="flex justify-between gap-2">
                        <a href="{{ route('deals.download', [$deal, $doc]) }}" class="truncate underline">[{{ $doc->doc_type }}] {{ $doc->original_name }}</a>
                        <span class="shrink-0 text-slate-500">{{ $doc->created_at->format('d M H:i') }}</span>
                    </li>
                @empty
                    <li class="text-slate-500">No documents yet.</li>
                @endforelse
            </ul>
            @if ($deal->stage !== 'cancelled')
                <form method="POST" action="{{ route('deals.upload', $deal) }}" enctype="multipart/form-data" class="mt-3 space-y-2 text-xs">
                    @csrf
                    <select name="doc_type" class="w-full rounded border border-slate-300 px-2 py-1.5">
                        @foreach (['PI' => 'Proforma Invoice', 'SPA' => 'Sales & Purchase Agreement', 'BL' => 'Bill of Lading', 'LC' => 'Letter of Credit', 'SBLC' => 'SBLC', 'COA' => 'Certificate of Analysis', 'INVOICE' => 'Commercial Invoice', 'OTHER' => 'Other'] as $key => $label)
                            <option value="{{ $key }}">{{ $label }}</option>
                        @endforeach
                    </select>
                    <input type="file" name="file" accept=".pdf,.jpg,.jpeg,.png" required class="w-full">
                    <button class="w-full rounded bg-slate-900 px-3 py-2 font-semibold text-white">Add to vault</button>
                </form>
            @endif
        </div>

        @if ($party === 'admin' && ! $deal->isClosed())
            <form method="POST" action="{{ route('deals.advance', $deal) }}" class="flex gap-2">
                @csrf
                <button name="admin_stage" value="disputed" class="flex-1 rounded border border-amber-600 px-3 py-2 font-semibold text-amber-700">Flag dispute</button>
                <button name="admin_stage" value="cancelled" class="flex-1 rounded border border-red-600 px-3 py-2 font-semibold text-red-700">Cancel deal</button>
            </form>
        @endif
    </aside>
</div>
@endsection