@extends('tema.plantilla')

{{-- {} Título --}}
@section('titulo', 'Registros de Nóminas')

{{-- {} Ajustes, propiedades y estilos --}}
@section('cabeza')

{{-- ! --}}
@parent

{{-- ! Select 2 v4.1.0 --}}
<link rel="stylesheet" href="{{ asset('archivos/librerias/select2/v4.1.0/css/select2.min.css') }}">

{{-- ! Data Tables v1.13.2 --}}
@include('librerias.datatables.css')

{{-- ! --}}
<link
  rel="stylesheet"
  href="{{ asset('archivos/css/aplicacion/seccion/proyectos/registros/nominas.css') }}"
>

@endsection

{{-- {} Encabezado de la sección --}}
@section('encabezado')
@endsection

{{-- {} Contenido de la sección --}}
@section('seccion')

{{-- ! --}}
<div class="row">
  <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 pt-2">

    <table class="table table-hover table-responsive table-striped" id="tablaRegistros">

      <thead>
        <tr>
          <th data-columna-nombre="id_nomina">ID</th>
          <th data-columna-nombre="proyecto">Proyecto</th>
          <th data-columna-nombre="tipo_nomina">Tipo</th>
          <th data-columna-nombre="fecha_inicial">Fecha Inicial</th>
          <th data-columna-nombre="fecha_final">Fecha Final</th>
        </tr>
      </thead>

      <tbody>
      </tbody>

      <tfoot>
        <tr>
          <th>&nbsp;</th>
          <th>&nbsp;</th>
          <th>&nbsp;</th>
          <th>&nbsp;</th>
          <th>&nbsp;</th>
        </tr>
      </tfoot>

    </table>

  </div>
</div>

{{-- ! --}}
<div class="row">
  <div
    class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
    <div class="row">

      <div class="col-auto">

        <button
          type="submit"
          class="btn btn-success"
          id="botonCrear"
          data-bs-toggle="modal"
          data-bs-target="#ventanaEmergente"
        >
          Crear
        </button>

      </div>

    </div>

  </div>
</div>

{{-- ! --}}
@component('aplicacion.elementos.VentanaEmergente', [
  'titulo' => 'Creación de Nómina',
  'clasesContenedorTitulo' => 'bg-success',
  'clasesBoton1' => 'btn btn-success',
  'atributosBoton1' => '',
  'textoBoton1' => 'Crear'
])

<form method="POST" action="{{ route('ejecutar') }}?procedimiento=p_registrar_nominas" class="row" id="formularioVentanaEmergente">

  @csrf

  <input
    class="form-control idRegistro d-none"
    id="id_nomina"
    name="id_nomina"
  />

  <div
    class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-12"
  >

    @component('aplicacion.elementos.grupo.campos')

      @component('aplicacion.elementos.campo.etiqueta', [
        'tipo' => 'select',
        'titulo' => 'Proyecto',
        'id' => 'id_proyecto',
        'atributos' => '
          data-peticion-tabla=proyectos
        '
      ])

        <option value="crearRegistro" disabled></option>

      @endcomponent

      @component('aplicacion.elementos.boton', [
        'clases' => 'btn btn-primary botonActualizar'
      ])
        <i class="fa-solid fa-rotate"></i>
      @endcomponent

    @endcomponent

  </div>

  <div
    class="col-12 col-sm-12 col-md-4 col-lg-4 col-xl-4 col-xxl-4"
  >

    @component('aplicacion.elementos.campo.etiqueta', [
      'tipo' => 'select',
      'titulo' => 'Tipo de Nómina',
      'id' => 'id_tipo_nomina',
      'atributos' => '
        data-peticion-tabla=tipos_nominas
      '
    ])
    @endcomponent

  </div>

  <div
    class="col-12 col-sm-12 col-md-4 col-lg-4 col-xl-4 col-xxl-4"
  >

    @component('aplicacion.elementos.campo.etiqueta', [
      'tipo' => 'date',
      'id' => 'fecha_inicial',
      'valor' => date("Y-m-d"),
      'titulo' => 'Fecha Inicial'
    ])
    @endcomponent

  </div>

  <div
    class="col-12 col-sm-12 col-md-4 col-lg-4 col-xl-4 col-xxl-4"
  >

    @component('aplicacion.elementos.campo.etiqueta', [
      'tipo' => 'date',
      'id' => 'fecha_final',
      'valor' => date("Y-m-d"),
      'titulo' => 'Fecha Final'
    ])
    @endcomponent

  </div>

</form>

@endcomponent

@endsection

{{-- {} Programación de la sección --}}
@section('programacion')

{{-- ! --}}
@parent

{{-- ! Select 2 v4.1.0 --}}
<script src="{{ asset('archivos/librerias/select2/v4.1.0/js/select2.min.js') }}"></script>

{{-- ! Data Tables v1.13.2 --}}
@include('librerias.datatables.js')

{{-- ! --}}
<script type="module" src="{{ asset('archivos/js/aplicacion/seccion/proyectos/registros/nominas.js') }}"></script>

@endsection