@extends('adminlte::page')

@section('title', 'Configuración de Reportes')

@section('plugins.Datatables', true)

@section('content_header')
    <div class="d-flex justify-content-between align-items-center">
        <h1><i class="fas fa-file-pdf text-primary"></i> Configuración de Reportes</h1>
        @can('manage reports')
            <a href="{{ route('report-configs.create') }}" class="btn btn-primary btn-premium" title="Crear Nueva Configuración de Reporte">
                <i class="fas fa-plus"></i> Nueva Configuración
            </a>
        @endcan
    </div>
@stop

@section('content')
    <x-ui.card shadow="shadow-sm">
        <x-slot:header>
            <x-ui.card-header title="Listado de Configuraciones" icon="fas fa-list text-primary" />
        </x-slot:header>

        <div class="table-responsive p-0">
            <table id="report-configs-table" class="table table-hover w-100 mb-0">
                <thead class="bg-light">
                    <tr>
                        <th>ID</th>
                        <th>Nombre</th>
                        <th>Formato</th>
                        <th class="text-center">Default</th>
                        <th class="text-center">Acciones</th>
                    </tr>
                </thead>
            </table>
        </div>
    </x-ui.card>

    @php
        $columns = [
            ['data' => 'id', 'name' => 'id'],
            ['data' => 'name', 'name' => 'name'],
            ['data' => 'print_format', 'name' => 'print_format'],
            ['data' => 'is_default', 'name' => 'is_default', 'orderable' => false, 'searchable' => false, 'className' => 'text-center'],
            ['data' => 'action', 'name' => 'action', 'orderable' => false, 'searchable' => false, 'className' => 'text-center']
        ];
    @endphp

    <x-datatable-script tableId="report-configs-table" route="/api/v1/report-configs" :columns="$columns" :order="[[0, 'desc']]" />
@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('css/premium-ui.css') }}">
@stop