@extends('fragments.fullTemplate')

@section('titulo')
Reportes bancos maqueta
@endsection

@section('estilos')
@include('Bancos.Maqueta.partials._styles')
@endsection

@section('contenido')
@php
    $activePage = 'reportes';
@endphp

<div class="bancos-maqueta">
    <div class="ui big breadcrumb">
        <div class="section">Administración</div>
        <i class="right chevron icon divider"></i>
        <div class="section">Bancos</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Reportes maqueta</div>
    </div>

    <div class="ui divider"></div>

    <div data-module-notifications-anchor></div>
    @include('Bancos.Maqueta.partials._toolbar')

    <div class="ui segment">
        <h4 class="ui dividing header">Filtros</h4>
        <form class="ui form" action="#" method="get">
            <div class="form-row">
                <div class="form-group col-md-2"><label>Anio</label><input type="number" class="form-control" value="2026"></div>
                <div class="form-group col-md-2"><label>Mes</label><select class="custom-select"><option>Abril</option><option>Mayo</option><option>Marzo</option></select></div>
                <div class="form-group col-md-2"><label>Dia</label><input type="number" class="form-control" placeholder="Dia"></div>
                <div class="form-group col-md-3"><label>Fecha inicio</label><input type="text" class="form-control" value="01/04/2026 00:00:00"></div>
                <div class="form-group col-md-3"><label>Fecha fin</label><input type="text" class="form-control" value="30/04/2026 23:59:59"></div>
            </div>
            <div class="form-row">
                <div class="form-group col-md-3">
                    <label>Cuenta</label>
                    <select class="custom-select">
                        <option>Todas</option>
                        @foreach($cuentas as $cuentaFiltro)
                            <option>{{ $cuentaFiltro['banco'] }} - {{ $cuentaFiltro['nombre_cuenta'] }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group col-md-2"><label>Cliente</label><input type="text" class="form-control" placeholder="Cliente"></div>
                <div class="form-group col-md-2"><label>Norma</label><input type="text" class="form-control" placeholder="Norma"></div>
                <div class="form-group col-md-2"><label>Tipo movimiento</label><select class="custom-select"><option>Todos</option><option>Abono</option><option>Cargo</option><option>Cargo internacional</option><option>Ajuste negativo</option><option>Traspaso</option><option>Pago programado</option></select></div>
                <div class="form-group col-md-2"><label>Estatus</label><select class="custom-select"><option>Todos</option><option>Aplicado</option><option>Pendiente</option><option>Cancelado</option></select></div>
                <div class="form-group col-md-1"><label>Moneda</label><select class="custom-select"><option>Todas</option><option>MXN</option><option>USD</option></select></div>
            </div>
        </form>

        <div class="row mt-2">
            <div class="col-md-4 mb-2"><button type="button" class="ui button fluid primary"><i class="eye icon"></i>Ver reporte</button></div>
            <div class="col-md-4 mb-2"><button type="button" class="ui button fluid teal abrir-codigo-seguridad-maqueta" data-accion="Exportar estado de cuenta"><i class="download icon"></i>Exportar estado de cuenta</button></div>
            <div class="col-md-4 mb-2"><button type="button" class="ui button fluid orange abrir-codigo-seguridad-maqueta" data-accion="Exportar bitacora"><i class="clipboard list icon"></i>Exportar bitácora</button></div>
        </div>
    </div>

    <div class="sx-autorender">
        <div class="sx-scroll-x">
            <div class="dt-responsive table-responsive">
                <table id="lang-dt" class="ui celled table unstackable structured">
                    <thead>
                        <tr>
                            <th>Reporte</th>
                            <th>Cuenta</th>
                            <th>Período</th>
                            <th>Moneda</th>
                            <th>Tipo cambio utilizado</th>
                            <th>Monto original</th>
                            <th>Monto convertido</th>
                            <th>Origen tipo cambio</th>
                            <th>Fecha tipo cambio</th>
                            <th>Estatus</th>
                            <th>Descarga sensible</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($reportes as $reporte)
                            <tr>
                                <td>{{ $reporte['nombre'] }}</td>
                                <td>{{ $reporte['cuenta'] }}</td>
                                <td>{{ $reporte['periodo'] }}</td>
                                <td>{{ $reporte['moneda'] }}</td>
                                <td>{{ isset($reporte['tipo_cambio_utilizado']) ? $reporte['tipo_cambio_utilizado'] : '-' }}</td>
                                <td>{{ isset($reporte['monto_original']) ? $reporte['monto_original'] : '-' }}</td>
                                <td>{{ isset($reporte['monto_convertido']) ? $reporte['monto_convertido'] : '-' }}</td>
                                <td>{{ isset($reporte['origen_tipo_cambio']) ? $reporte['origen_tipo_cambio'] : '-' }}</td>
                                <td>{{ isset($reporte['fecha_tipo_cambio']) ? $reporte['fecha_tipo_cambio'] : '-' }}</td>
                                <td>
                                    @if($reporte['estatus'] === 'Requiere codigo')
                                        <span class="status-pill status-warn">{{ $reporte['estatus'] }}</span>
                                    @else
                                        <span class="status-pill status-ok">{{ $reporte['estatus'] }}</span>
                                    @endif
                                </td>
                                <td>
                                    <button type="button" class="ui button tiny teal abrir-codigo-seguridad-maqueta" data-accion="{{ $reporte['nombre'] }}">
                                        <i class="shield alternate icon"></i>Validar codigo
                                    </button>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    @include('Bancos.Maqueta.partials._modal_codigo_seguridad')
    @include('Bancos.Maqueta.partials._security_gate')
</div>
@endsection