@use(Illuminate\Support\Number)
<div>
    <form wire:submit.prevent="save" class="grid lg:grid-cols-[repeat(4,minmax(0,2fr))_1fr] gap-2 mb-4 items-end">
        <label class="form-control">
            <div class="label">
                <span class="label-text">Tipo Documento</span>
            </div>
            <select class="select select-bordered  " required wire:model="tipo">
                @foreach($this->tipos as $tipo)
                    <option>{{$tipo}}</option>
                @endforeach
            </select>
        </label>
        <label class="form-control">
            <div class="label">
                <span class="label-text">Documento Inicial</span>
            </div>
            <input type="number" class="input  input-bordered" wire:model="ingreso_inicial" min="0"/>
        </label>
        <label class="form-control">
            <div class="label">
                <span class="label-text">Documento Final</span>
            </div>
            <input type="number" class="input  input-bordered" wire:model="ingreso_final" min="0"/>
        </label>
        <label class="form-control">
            <div class="label">
                <span class="label-text">Total</span>
            </div>
            <input type="number" class="input  input-bordered" wire:model="total" min="0"/>
        </label>

        <button class="btn " type="submit">
            @if($this->currentIngreso)
                <x-icons.device-floppy/>
                Guardar
            @else
                <x-icons.plus/>
                Agregar
            @endif
        </button>

        <p class="text-sm font-medium text-red-500">
            @error('tipo'){{$message}}@enderror
        </p>
        <p class="text-sm font-medium text-red-500">
            @error('ingreso_inicial'){{$message}}@enderror
        </p>
        <p class="text-sm font-medium text-red-500">
            @error('ingreso_final'){{$message}}@enderror
        </p>
        <p class="text-sm font-medium text-red-500">
            @error('total'){{$message}}@enderror
        </p>

    </form>

    <div class="overflox-x-auto">
        <table class="table">
            <thead>
            <tr>
                <th>Tipo Documento</th>
                <th>Documento Inicial</th>
                <th>Documento Final</th>
                <th>Total</th>
                <th class="text-end">Acciones</th>
            </tr>
            </thead>
            <tbody>
            @foreach($this->rows as $row)
                <tr>
                    <td>{{$row->tipo_ingreso}}</td>
                    <td>{{Number::format($row->ingreso_inicial)}}</td>
                    <td>{{Number::format($row->ingreso_final)}}</td>
                    <td>{{Number::currency($row->total)}}</td>
                    <td class="w-0 whitespace-nowrap">
                        <button class="btn btn-circle btn-sm" wire:click="edit('{{$row->id}}')">
                            <x-icons.edit class="w-5 h-5"/>
                        </button>
                        <button class="btn btn-circle btn-error btn-sm" wire:click="confirmDelete('{{$row->id}}')">
                            <x-icons.trash class="w-5 h-5"/>
                        </button>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
    </div>

    <div class="mt-4">
        <p class="text-xl">Ingresos Totales: <span class="font-bold">{{$this->totalIngresos}}</span></p>
    </div>
</div>