@extends('admin.admin_dashboard_hipotecario')
@section('content')

<section class="pc-container">
  <div class="pc-content">

    {{-- Breadcrumb --}}
    <div class="page-header">
      <div class="page-block">
        <div class="row align-items-center">
          <div class="col-md-12">
            <div class="page-header-title">
              <h2 class="mb-0">Reporte de Control de Riesgos</h2>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="col-sm-12">
      <div class="card">
        <div class="card-body">

          {{-- ── Filtro de fechas (GET a la misma ruta) ────────────────── --}}
          <form method="GET" action="{{ route('reporte_control_riesgos') }}" class="mb-4">
            <div class="row align-items-end g-3">

              <div class="col-md-4">
                <label class="form-label">Fecha Inicio</label>
                <input type="date" name="fecha_inicio" class="form-control"
                       value="{{ $fechaInicio ?? '' }}">
              </div>

              <div class="col-md-4">
                <label class="form-label">Fecha Fin</label>
                <input type="date" name="fecha_fin" class="form-control"
                       value="{{ $fechaFin ?? '' }}">
              </div>

              <div class="col-md-4 d-flex gap-2">
                <button type="submit" class="btn btn-primary w-100">
                  <i class="ti ti-search"></i> Filtrar
                </button>
                <a href="{{ route('reporte_control_riesgos') }}" class="btn btn-outline-secondary w-100">
                  <i class="ti ti-x"></i> Limpiar
                </a>
              </div>

            </div>

            {{-- Indicador del rango activo --}}
            @if($fechaInicio && $fechaFin)
              <div class="mt-2">
                <span class="badge bg-light-primary f-12">
                  Mostrando aprobaciones de Control de Riesgos del
                  {{ \Carbon\Carbon::parse($fechaInicio)->format('d/m/Y') }}
                  al
                  {{ \Carbon\Carbon::parse($fechaFin)->format('d/m/Y') }}
                </span>
              </div>
            @endif
          </form>
          {{-- ── Fin filtro ──────────────────────────────────────────────── --}}

          {{-- ── Tabla ──────────────────────────────────────────────────── --}}
          {{-- ======================================================= --}}
          {{-- FILTROS EXTERNOS                                        --}}
          {{-- ======================================================= --}}
          <div class="row g-2 mb-3 align-items-end">
            <div class="col-sm-6 col-md-4">
              <label class="form-label fw-semibold mb-1" for="ext-filter-exp">No. de Expediente</label>
              <input type="text" id="ext-filter-exp" class="form-control form-control-sm" placeholder="Buscar expediente..." />
            </div>
            <div class="col-sm-6 col-md-4">
              <label class="form-label fw-semibold mb-1" for="ext-filter-estado">Estado</label>
              <select id="ext-filter-estado" class="form-select form-select-sm">
                <option value="">Todos</option>
                <option value="Autorización">Autorización</option>
                <option value="Avalúo">Avalúo</option>
                <option value="Instrucción">Instrucción</option>
                <option value="Firma">Firma</option>
                <option value="Formalizado">Formalizado</option>
                <option value="Verificación">Verificación</option>
              </select>
            </div>
            <div class="col-sm-6 col-md-4">
              <label class="form-label fw-semibold mb-1" for="ext-filter-prevencion">Estado Prevención</label>
              <select id="ext-filter-prevencion" class="form-select form-select-sm">
                <option value="">Todos</option>
                <option value="Verificado">Verificado</option>
                <option value="Rechazado">Rechazado</option>
                <option value="Documentación incompleta">Documentación incompleta</option>
              </select>
            </div>
          </div>
          {{-- ======================================================= --}}

          <div class="table-responsive dt-responsive">
            <table id="table-inventory-cat" class="table table-striped table-bordered">
              <thead>
                <tr>
                  <th>No. Exp</th>
                  <th>Modificación</th>
                  <th>Asociado</th>
                  <th>Sucursal</th>
                  <th>Inst. Financiera</th>
                  <th>Cliente</th>
                  <th>Coordinador</th>
                  <th>Estado</th>
                  <th>Estado Prevención</th>
                </tr>
              </thead>
              <tbody>

                @foreach($expedientes as $expediente)

                  @php
                    // Resaltar expedientes sin aprobación de prevención
                    $bgFila = ($expediente->estado_prevencion != 1) ? 'background-color:#FED8B1;' : '';
                  @endphp

                  <tr style="{{ $bgFila }}">

                    {{-- No. Expediente --}}
                    <td style="color:blue">{{ $expediente->id_expediente }}</td>

                    {{-- Última modificación --}}
                    <td>{{ $expediente->updated_at }}</td>

                    {{-- Asociado --}}
                    <td>{{ $expediente->user_name_v }}</td>

                    {{-- Sucursal --}}
                    <td>{{ $expediente->sucursales_name }}</td>

                    {{-- Institución Financiera --}}
                    <td style="color:darkred">{{ $expediente->banco_name }}</td>

                    {{-- Cliente --}}
                    <td style="color:blue">
                      @if($expediente->tipo_cliente == 1)
                        {{ $expediente->razon_social_moral }}
                      @else
                        {{ $expediente->cliente }} {{ $expediente->apellido_paterno }} {{ $expediente->apellido_materno }}
                      @endif
                    </td>

                    {{-- Coordinador --}}
                    <td>{{ $expediente->user_name }}</td>

                    {{-- Estado con colores y enlaces --}}
                    @if($expediente->id_cancelar > 0)
                      <td style="color:red">{{ $expediente->estado }}</td>

                    @else

                      @if($expediente->estado1 == 1)
                        @if($expediente->exp_verificacion > 0)
                          <td>
                            <a href="../expedientes_verificacion/edit/{{ $expediente->id }}">
                              {{ $expediente->estado }}
                            </a>
                          </td>
                        @else
                          <td style="background-color:#31b2e4;">
                            <a href="../expediente_precalif/edit/{{ $expediente->id }}" style="color:white">
                              {{ $expediente->estado }}
                            </a>
                          </td>
                        @endif

                      @elseif($expediente->estado1 == 2)
                        <td style="background-color:#ff8c00;">
                          <a href="../expediente_avaluo/edit/{{ $expediente->id }}" style="color:white">
                            {{ $expediente->estado }}
                          </a>
                        </td>

                      @elseif($expediente->estado1 == 3)
                        <td style="background-color:#800080;">
                          <a href="../expediente_instruccion/edit/{{ $expediente->id }}" style="color:white">
                            {{ $expediente->estado }}
                          </a>
                        </td>

                      @elseif($expediente->estado1 == 4)
                        <td style="background-color:#228b22;">
                          <a href="../expediente_firma/edit/{{ $expediente->id }}" style="color:white">
                            {{ $expediente->estado }}
                          </a>
                        </td>

                      @elseif($expediente->estado1 == 5)
                        @if($expediente->exp_verificacion > 0)
                          <td style="background-color:white;">
                            <a href="../expediente_formalizado/edit/{{ $expediente->id }}" style="color:blue">
                              {{ $expediente->estado }}
                            </a>
                          </td>
                        @else
                          <td style="background-color:darkblue;">
                            <a href="../expediente_formalizado/edit/{{ $expediente->id }}" style="color:white">
                              {{ $expediente->estado }}
                            </a>
                          </td>
                        @endif

                      @else
                        <td></td>
                      @endif

                    @endif

                    @if($expediente->estado_prevencion == 0)
                        <td></td>
                    @elseif($expediente->estado_prevencion == 1)
                    <td style="background-color:darkgreen;">
                            <label style="color:white">Verificado</label>
                          </td>
                    @elseif($expediente->estado_prevencion == 2)
                    <td style="background-color:darkred;">
                            <label style="color:white">Rechazado</label>
                          </td>
                    @elseif($expediente->estado_prevencion == 3)
                    <td style="background-color:darkblue;">
                            <label style="color:white">Documentación incompleta</label>
                          </td>

                    @endif

                  </tr>

                @endforeach

              </tbody>
            </table>
          </div>
          {{-- ── Fin tabla ────────────────────────────────────────────────── --}}

        </div>
      </div>
    </div>

  </div>
</section>

{{-- ── Scripts ──────────────────────────────────────────────────────────── --}}
<style type="text/css">
  #table-inventory-cat {
      table-layout: fixed;
      width: 100% !important;
  }
  #table-inventory-cat th,
  #table-inventory-cat td {
      white-space: normal !important;
      word-break: break-word;
      overflow-wrap: break-word;
      font-size: 12px;
      padding: 5px;
  }
  #table-inventory-cat th:nth-child(1),
  #table-inventory-cat td:nth-child(1) { width: 50px;  }  /* No.Exp */
  #table-inventory-cat th:nth-child(2),
  #table-inventory-cat td:nth-child(2) { width: 110px; }  /* Modificación */
  #table-inventory-cat th:nth-child(3),
  #table-inventory-cat td:nth-child(3) { width: 110px; }  /* Asociado */
  #table-inventory-cat th:nth-child(4),
  #table-inventory-cat td:nth-child(4) { width: 100px; }  /* Sucursal */
  #table-inventory-cat th:nth-child(5),
  #table-inventory-cat td:nth-child(5) { width: 120px; }  /* Inst. Financiera */
  #table-inventory-cat th:nth-child(6),
  #table-inventory-cat td:nth-child(6) { width: 130px; }  /* Cliente */
  #table-inventory-cat th:nth-child(7),
  #table-inventory-cat td:nth-child(7) { width: 110px; }  /* Coordinador */
  #table-inventory-cat th:nth-child(8),
  #table-inventory-cat td:nth-child(8) { width: 90px;  }  /* Estado */
  #table-inventory-cat th:nth-child(9),
  #table-inventory-cat td:nth-child(9) { width: 70px;  }  /* Estado */
  .dataTables_wrapper { overflow-x: hidden !important; }
  .dataTables_wrapper .dataTables_filter { text-align: left !important; }
  .pc-container { padding-top: 50px; }
</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="{{ URL::asset('js/plugins/jquery.dataTables.min.js') }}"></script>
<script src="{{ URL::asset('js/plugins/dataTables.bootstrap5.min.js') }}"></script>
<script src="{{ URL::asset('js/plugins/dataTables.responsive.min.js') }}"></script>
<script src="{{ URL::asset('js/plugins/responsive.bootstrap5.min.js') }}"></script>
{{-- DataTables Buttons 1.x (compatible con DataTables 1.x) --}}
<link  rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datatables-buttons/1.7.1/css/buttons.bootstrap5.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables-buttons/1.7.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables-buttons/1.7.1/js/buttons.bootstrap5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables-buttons/1.7.1/js/buttons.html5.min.js"></script>

<script>
$(document).ready(function () {

  var table = $('#table-inventory-cat').DataTable({
      fixedHeader:  true,
      order:        [[1, 'desc']],
      lengthChange: false,
      paging:       true,
      autoWidth:    false,
      responsive:   false,
      dom: '<"row"<"col-6 mb-2"f><"col-6 mb-2 text-end"B>>' +
           '<"row"<"col-12"tr>>' +
           '<"row"<"col-sm-12 col-md-5"i><"col-sm-12 col-md-7"p>>',
      buttons: [
          {
              extend:    'excelHtml5',
              text:      '<i class="ti ti-file-spreadsheet me-1"></i> Exportar Excel',
              className: 'btn btn-success btn-sm',
              title:     'Reporte Control de Riesgos',
              filename:  function () {
                  var hoy = new Date();
                  return 'control_riesgos_' + hoy.toISOString().slice(0, 10);
              },
              // Exporta solo las filas visibles (respeta todos los filtros)
              exportOptions: {
                  modifier: { search: 'applied', order: 'applied' }
              },
              // Columnas a exportar (todas)
              exportOptions: {
                  columns: ':visible',
                  modifier: { search: 'applied', order: 'applied' }
              }
          }
      ],
      language: {
          search:            'Buscar:',
          searchPlaceholder: 'Buscar...',
          info:              'Mostrando _START_ a _END_ de _TOTAL_ registros',
          infoEmpty:         'Mostrando 0 a 0 de 0 registros',
          infoFiltered:      '(filtrado de _MAX_ registros totales)',
          zeroRecords:       'No se encontraron expedientes',
          emptyTable:        'No se encontraron expedientes en el rango seleccionado',
          paginate: {
              first:    'Primero',
              last:     'Último',
              next:     'Siguiente',
              previous: 'Anterior'
          },
          lengthMenu: 'Mostrar _MENU_ registros'
      }
  });

  // No. de Expediente → columna 0
  $('#ext-filter-exp').on('keyup change', function () {
      table.column(0).search(this.value).draw();
  });

  // Estado → columna 7
  $('#ext-filter-estado').on('change', function () {
      table.column(7).search(this.value).draw();
  });

  // Estado Prevención → columna 8
  $('#ext-filter-prevencion').on('change', function () {
      table.column(8).search(this.value).draw();
  });

});
</script>

@stop