@extends('layouts.panel')

@section('title', 'Ingreso ' . $income->income_code)

@section('content')

    <div class="page-header d-flex align-items-center justify-content-between flex-wrap gap-3">
        <div class="page-header-title">
            <h1>Ingreso {{ $income->income_code }}</h1>
            <p class="page-header-subtitle">Detalle de recepción</p>
        </div>
        <a href="{{ route('income.edit', $income) }}" class="btn btn-outline-primary">
            <i class="bi bi-pencil me-1"></i> Editar
        </a>
    </div>

  

    <div class="card mb-4">
        <div class="card-body">
            <div class="row g-4">
                <div class="col-md-3">
                    <span class="text-muted small">Cliente</span>
                    <p class="fw-semibold mb-0">{{ $income->client->business_name ?: $income->client->contact_name }}</p>
                </div>
                <div class="col-md-3">
                    <span class="text-muted small">Recepción</span>
                    <p class="fw-semibold mb-0">{{ $income->received_at->format('d-m-Y H:i') }}</p>
                </div>
                <div class="col-md-3">
                    <span class="text-muted small">Referencia</span>
                    <p class="fw-semibold mb-0">{{ $income->reference_number ?? '—' }}</p>
                </div>
                <div class="col-md-3">
                    <span class="text-muted small">Kilos recepcionados</span>
                    <p class="fw-semibold mb-0">{{ $income->weight_kg ? number_format($income->weight_kg, 2) . ' kg' : '—' }}</p>
                </div>
                <div class="col-12">
                    <span class="text-muted small">Observaciones</span>
                    <p class="fw-semibold mb-0">{{ $income->observations ?? '—' }}</p>
                </div>
            </div>
        </div>
    </div>

    <div class="card mb-4">
        <div class="card-body">
            <h5 class="card-title mb-3">Estado</h5>
            <form method="POST" action="{{ route('income.update-status', $income) }}" class="row g-2 align-items-center">
                @csrf
                @method('PATCH')
                <div class="col-md-3">
                    <select name="status" class="form-select">
                        @foreach (\App\Models\Income::STATUSES as $value => $label)
                            <option value="{{ $value }}" {{ $income->status === $value ? 'selected' : '' }}>{{ $label }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-6">
                    <input type="text" name="notes" placeholder="Nota (opcional)" class="form-control">
                </div>
                <div class="col-md-3">
                    <button type="submit" class="btn btn-secondary w-100">
                        <i class="bi bi-arrow-repeat me-1"></i> Actualizar Estado
                    </button>
                </div>
            </form>
        </div>
    </div>

    <div class="card mb-4">
        <div class="card-body">
            <div class="d-flex justify-content-between align-items-center mb-3">
                <h5 class="card-title mb-0">Pedidos asociados</h5>
                <a href="{{ route('orders.create', ['income_id' => $income->id]) }}" class="btn btn-sm btn-outline-primary">
                    <i class="bi bi-plus-lg me-1"></i> Crear pedido desde este ingreso
                </a>
            </div>

            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead>
                        <tr>
                            <th>Código</th>
                            <th>Línea</th>
                            <th>Kilos</th>
                            <th>Estado</th>
                            <th class="text-end">Acción</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($income->orders as $order)
                            <tr>
                                <td>
                                    <a href="{{ route('orders.show', $order) }}" class="fw-semibold text-decoration-none">
                                        {{ $order->order_code }}
                                    </a>
                                </td>
                                <td>{{ $order->serviceLineLabel() }}</td>
                                <td>{{ $order->weight_kg ? number_format($order->weight_kg, 2) . ' kg' : '—' }}</td>
                                <td>{{ $order->statusLabel() }}</td>
                                <td class="text-end">
                                    <form method="POST" action="{{ route('income.unlink-order', [$income, $order]) }}"
                                          onsubmit="return confirm('¿Desvincular este pedido del ingreso?');" class="d-inline">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn btn-sm btn-outline-danger">
                                            <i class="bi bi-x-lg"></i> Desvincular
                                        </button>
                                    </form>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="5" class="text-center text-muted py-4">
                                    Sin pedidos asociados todavía.
                                </td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            <form method="POST" action="{{ route('income.link-order', $income) }}" class="row g-2 mt-3">
                @csrf
                <div class="col-md-9">
                    <select name="order_id" id="available-orders" class="form-select">
                        <option value="">Cargando pedidos disponibles...</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <button type="submit" class="btn btn-secondary w-100">
                        <i class="bi bi-link-45deg me-1"></i> Vincular pedido existente
                    </button>
                </div>
            </form>
        </div>
    </div>

    <div class="card">
        <div class="card-body">
            <h5 class="card-title mb-3">Historial</h5>
            <ul class="list-group list-group-flush">
                @foreach ($income->statusHistories as $history)
                    <li class="list-group-item d-flex justify-content-between align-items-center px-0">
                        <span>{{ \App\Models\Income::STATUSES[$history->status] ?? $history->status }} — {{ $history->notes }}</span>
                        <span class="text-muted small">{{ $history->changedBy?->name }} · {{ $history->created_at->format('d-m-Y H:i') }}</span>
                    </li>
                @endforeach
            </ul>
        </div>
    </div>

    <script>
        fetch("{{ route('income.available-orders', $income) }}")
            .then(r => r.json())
            .then(orders => {
                const select = document.getElementById('available-orders');
                if (!orders.length) {
                    select.innerHTML = '<option value="">Sin pedidos disponibles para vincular</option>';
                    return;
                }
                select.innerHTML = '<option value="">Seleccione un pedido</option>' +
                    orders.map(o => `<option value="${o.id}">${o.order_code} — ${o.service_line} (${o.weight_kg ?? '—'} kg)</option>`).join('');
            });
    </script>

@endsection