@extends('tema.plantilla')

{{-- {} Título --}}
@section('titulo', 'Conceptos')

{{-- {} 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/registros/conceptos.css') }}"
>

@endsection

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

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

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

@endsection

{{-- {} Contenido de la sección --}}
@section('seccion')
<form
	class="form"
	id="formularioConceptos"
	autocomplete="off"
	data-tabla-limpiar-fila-activa="#tablaRegistros"
>

	@csrf

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

	<div class="row">

		<div class="col-12 col-sm-6 col-md-6 col-lg-6 col-xl-6 col-xxl-6">
			@component('aplicacion.elementos.campo.etiqueta', [
				'titulo' => 'Concepto',
				'id' => 'concepto',
				'atributos' => 'maxlength=100'
			])
			@endcomponent
		</div>

		<div class="col-12 col-sm-6 col-md-6 col-lg-6 col-xl-6 col-xxl-6">
			@component('aplicacion.elementos.campo.etiqueta', [
				'titulo' => 'Referencia',
				'id' => 'referencia',
				'atributos' => 'maxlength=30'
			])
			@endcomponent
		</div>

		<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-6">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'accion',
				'titulo' => 'Acción',
				'atributos' => '
					data-peticion-procedimiento=p_traer_filtros
					data-peticion-parametros="renglon: NOMINAS; tipo_filtro: CONCEPTOS"
				'
			])
			@endcomponent
		</div>

		<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 col-xxl-6">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'titulo' => 'Cuenta Contable',
				'id' => 'id_cuenta_contable',
				'atributos' => 'data-peticion-tabla=cuentas_contables'
			])
			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'calcula_tss',
				'titulo' => 'Calcula TSS',
			])

				<option value="1">SI</option>
				<option value="0">NO</option>

			@endcomponent
		</div>


		<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'calcula_isr',
				'titulo' => 'Calcula ISR',
			])

				<option value="1">SI</option>
				<option value="0">NO</option>

			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'calcula_salario_navidad',
				'titulo' => 'Calcula Salario Navidad',
			])

				<option value="1">SI</option>
				<option value="0">NO</option>

			@endcomponent
		</div>

		<div class="col-6 col-sm-6 col-md-6 col-lg-6 col-xl-2 col-xxl-2">
			@component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'genera_entrada_sucursales',
				'titulo' => 'Genera Entrada a Sucursal',
			])

				<option value="1">SI</option>
				<option value="0">NO</option>

			@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'
		])

			<thead>
				<tr>

					<th
						class="id"
						data-columna-nombre="id_concepto"
						data-columna-tipo="num"
						data-columna-ordenable
						data-columna-buscable
					># Concepto</th>

					<th
						data-columna-nombre="concepto"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>Concepto</th>

					<th
						data-columna-nombre="accion"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>Acción</th>

					<th
						data-columna-nombre="cuenta_contable"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>Cuenta Contable</th>

					<th
						data-columna-nombre="calcula_tss"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>TSS</th>

					<th
						data-columna-nombre="calcula_isr"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>ISR</th>

					<th
						data-columna-nombre="calcula_salario_navidad"
						data-columna-tipo="string"
						data-columna-ordenable
						data-columna-buscable
					>Salario Navidad</th>

					<th
						class="d-none id_concepto"
						data-columna-nombre="id_concepto"
						data-columna-tipo="input"
					></th>

				</tr>
			</thead>

			<tbody>
				<tr>
					<td class="text-center" colspan="100%">Cargando ...</td>
				</tr>
			</tbody>

			<tfoot>
				<tr>
					<th colspan="100%">&nbsp;</th>
				</tr>
			</tfoot>

		@endcomponent

	</div>

</form>

@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')

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

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

@endsection
