@php
    $columns = [
        [
            'label' => 'Evento',
            'width' => 'w-[150px]',
            'render' => fn($item) => $item['name_event'],
        ],
        [
            'label' => 'Tipo evento',
            'width' => 'w-[150px]',
            'render' => fn($item) => $item['name_lead_type'],
        ],
        [
            'label' => 'Estado',
            'width' => 'w-auto',
            'isHtml' => true,
            'render' => fn($item) => $item['status_html'],
        ],
        [
            'label' => 'Presupuesto',
            'width' => 'w-[150px]',
            'render' => fn($item) => $item['estimated_budget'],
        ],
        [
            'label' => 'Valor total',
            'width' => 'w-[150px]',
            'render' => fn($item) => $item['total_cost'],
        ],
    ];
@endphp
<x-layouts.auth-layout>
    <div class="max-w-lg">
        <h2 class="text-size-title text-black mb-4">Reportes</h2>
        <p class="text-accent text-parrafo">Explora el desempeño de los eventos, visualiza métricas y resultados que
            ayudan a fortalecer la operación St. Regis.</p>
    </div>
    <div class="mt-6 md:mt-8">
        <form action="" method="GET" class="flex flex-col md:flex-row gap-4">
            <x-controls.select-model :items="$leadTypes" text="name" value="id" name="type_event"
                placeholder="Tipo de evento" :selected="request('type_event')" />
            <x-controls.select-model :items="$typesPipelines" value="id" text="name_status" name="state_event"
                placeholder="Estado" :selected="request('state_event')" />
            <x-controls.select-model :items="$staftList" value="id" text="fullName" name="staft_name"
                placeholder="Staft" :selected="request('staft_name')" />
            <x-buttons.button type="submit" variant="primary" class="gap-x-2" icon="filter">Filtrar</x-buttons.button>
        </form>
    </div>
    <div class="mt-6 md:mt-8">
        <x-tables.table-crud :columns="$columns" :items="$listReportLeads" />
    </div>
</x-layouts.auth-layout>