@extends('tema.plantilla')

{{-- {} Título --}}
@section('titulo', 'Registros de Comprobantes Fiscales')

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

{{-- ! --}}
@parent

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

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

@endsection

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

@component('aplicacion.elementos.boton', [
  'tipo' => 'submit',
  'id' => 'botonGuardar',
  'atributos' => '
    form=formularioComprobantes
    formmethod=POST
    formaction=' . route('ejecutar') . '?0=0&procedimiento=p_registrar_comprobantes
  '
])
  Guardar
@endcomponent

@component('aplicacion.elementos.boton', [
  'id' => 'botonLimpiar',
  'clases' => 'btn btn-warning',
  'atributos' => '
    form=formularioComprobantes
    data-accion=limpiar
  '
])
  Limpiar
@endcomponent

@endsection

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

<form
	class="form"
	id="formularioComprobantes"
	autocomplete="off"
	data-tabla-limpiar-fila-activa="#tablaRegistros"
>

	@csrf

	<input id="id_comprobante" name="id_comprobante" hidden />

	<div class="row">

		<div class="col-5 col-sm-4 col-md-3 col-lg-3 col-xl-3 col-xxl-3">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'id_tipo_comprobante',
				'atributos' => '
					data-peticion-procedimiento=p_traer_filtros
					data-peticion-parametros="renglon: TIPOS_COMPROBANTES"
				',
				'titulo' => 'Tipo de NCF'
			])
			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-2 col-lg-3 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta',[
				'id' => 'cantidad',
				'mascara' => ['tipo' => 'entero'],
				'titulo' => 'Cantidad'
			])
			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-2 col-lg-3 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta',[
				'id' => 'numero_inicial',
				// 'mascara' => ['tipo' => 'entero'],
				'atributos' => 'maxlength=9',
				'titulo' => 'Numero Inicial'
			])
			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-2 col-lg-3 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta',[
				'id' => 'numero_final',
				'atributos' => 'maxlength=9 disabled',
				'titulo' => 'Numero Final'
			])
			@endcomponent
		</div>

		<div class="col-3 col-sm-3 col-md-2 col-lg-3 col-xl-2 col-xxl-3">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'date',
				'id' => 'fecha',
				'titulo' => 'Fecha Adquirido',
				'valor' => date('Y-m-d'),
				'atributos' => '
					max='. date('Y-m-d') . '
				'
			])
			@endcomponent
		</div>

		<div class="col-3 col-sm-3 col-md-2 col-lg-3 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'date',
				'id' => 'fecha_vencimiento',
				'titulo' => 'Vencimiento'
			])
			@endcomponent
		</div>

		<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-12">
			<div class="p-1 rounded-1 bg-tertiary fs-6 text-white"></div>
		</div>

		@component('aplicacion.elementos.tabla-vieja', [
			'id' => 'tablaRegistros',
			'atributos' => 'data-tabla-seleccionable=doble'
		])
		@endcomponent

	</div>

</form>

{{-- ! --}}
@include('aplicacion.elementos.VentanaEmergenteConsulta')

@endsection

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

{{-- ! --}}
@parent

{{-- ! iMask v6.4.3 --}}
<script src="{{ asset('archivos/librerias/imask/v6.4.3/imask.js') }}"></script>

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

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

@endsection
