@extends('layouts.app')
@section('title', 'Deposit — '.$account->customer?->display_name)

@section('content')
    <div class="page-head">
        <div>
            <h1>{{ $account->customer?->display_name ?: 'Deposit account' }}</h1>
            <p>{{ $account->customer?->customer_number }} · opened {{ $account->created_at?->format('d M Y') }}</p>
        </div>
        <div class="page-actions">
            <a href="{{ route('customers.show', $account->customer) }}" class="btn secondary">Customer</a>
            <a href="{{ route('deposits.index') }}" class="btn secondary">All deposits</a>
            @if ((float) $account->balance <= 0)
                <form method="POST" action="{{ route('deposits.destroy', $account) }}"
                      data-confirm="Close this deposit account?">
                    @csrf @method('DELETE')
                    <button class="btn danger" type="submit">Close account</button>
                </form>
            @endif
        </div>
    </div>

    <div class="grid grid-3 mb-2">
        @include('components.kpi', ['label' => 'Held now', 'value' => money($account->balance),
            'variant' => (float) $account->balance > 0 ? 'warn' : ''])
        @include('components.kpi', ['label' => 'Total deposited', 'value' => money($account->total_deposited), 'variant' => 'info'])
        @include('components.kpi', ['label' => 'Total refunded', 'value' => money($account->total_refunded), 'variant' => 'good'])
    </div>

    <div class="grid grid-2 mb-2">
        <div class="card">
            <div class="card-head"><h3>Take a deposit</h3></div>
            <form method="POST" action="{{ route('deposits.deposit', $account) }}">
                @csrf
                <div class="card-body">
                    <div class="grid grid-2">
                        <div class="field">
                            <label>Amount <span class="req">*</span></label>
                            <input type="number" name="amount" step="0.01" min="0.01" required value="{{ old('amount') }}">
                            @error('amount')<span class="err">{{ $message }}</span>@enderror
                        </div>
                        <div class="field">
                            <label>Note</label>
                            <input type="text" name="description" maxlength="255" placeholder="Additional ONT deposit">
                        </div>
                    </div>
                </div>
                <div class="card-foot"><button class="btn" type="submit">Add deposit</button></div>
            </form>
        </div>

        <div class="card">
            <div class="card-head"><h3>Refund</h3></div>
            <form method="POST" action="{{ route('deposits.refund', $account) }}">
                @csrf
                <div class="card-body">
                    <div class="grid grid-2">
                        <div class="field">
                            <label>Amount <span class="req">*</span></label>
                            <input type="number" name="amount" step="0.01" min="0.01" required
                                   max="{{ $account->balance }}" value="{{ old('amount') }}">
                            <span class="hint">At most {{ money($account->balance) }} is held.</span>
                            @error('amount')<span class="err">{{ $message }}</span>@enderror
                        </div>
                        <div class="field">
                            <label>Reason</label>
                            <input type="text" name="description" maxlength="255" placeholder="CPE returned in good condition">
                        </div>
                    </div>
                </div>
                <div class="card-foot"><button class="btn secondary" type="submit">Refund</button></div>
            </form>
        </div>
    </div>

    <div class="card">
        <div class="card-head"><h3>Movements</h3></div>
        <div class="card-body" style="padding:0;">
            @if ($account->transactions->isEmpty())
                @include('components.empty-state', [
                    'icon' => '&#128179;',
                    'title' => 'No movements yet',
                    'message' => 'Deposits and refunds will be listed here in order.',
                ])
            @else
                <table class="data">
                    <thead>
                    <tr>
                        <th>When</th><th>Type</th><th>Description</th>
                        <th class="num">Amount</th><th>By</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach ($account->transactions as $tx)
                        <tr>
                            <td class="small nowrap">{{ $tx->created_at?->format('d M Y H:i') }}</td>
                            <td><span class="badge {{ $tx->type === 'deposit' ? 'success' : 'warning' }}">
                                <span class="dot"></span>{{ title_case_words($tx->type) }}</span></td>
                            <td class="small">{{ $tx->description ?: '—' }}</td>
                            <td class="num strong">{{ $tx->type === 'deposit' ? '+' : '−' }}{{ money($tx->amount) }}</td>
                            <td class="small">{{ $tx->user?->name ?: '—' }}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            @endif
        </div>
    </div>
@endsection