@extends('tema.plantilla')

{{-- {} Título --}}
@section('titulo', 'Procesos de Depósitos Bancarios')

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

{{-- ! --}}
@parent

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

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

@endsection

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

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

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

@endsection

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

<form
  class="form"
  id="formularioDepositosBancarios"
  autocomplete="off"
  data-campo-prevenir="#id_cuenta_banco, #tasa"
  data-tabla-limpiar-fila-activa="#tablaRegistros"
>

  @csrf

	<input type="text" id="id_documento" name="id_documento" hidden>

  <div class="row">

    <div class="col-8 col-sm-9 col-md-8 col-lg-6 col-xl-6 col-xxl-6">
      @component('aplicacion.elementos.campo.etiqueta', [
        'tipo' => 'select',
        'id' => 'id_cuenta_banco',
        'atributos' => '
          data-peticion-procedimiento=p_traer_filtros
          data-peticion-parametros="renglon: BANCOS; tipo_filtro: CUENTAS"
        ',
        'titulo' => 'Cuenta de Banco'
      ])
      @endcomponent
    </div>

    <div class="col-8 col-sm-9 col-md-8 col-lg-3 col-xl-3 col-xxl-3">
      @component('aplicacion.elementos.campo.etiqueta', [
        'tipo' => 'select',
        'id' => 'id_tipo_documento',
        'atributos' => '
          data-peticion-procedimiento=p_traer_filtros
          data-peticion-parametros="
            renglon: TIPOS_DOCUMENTOS;
            tipo_filtro: BANCOS_DEPOSITOS
          "
        ',
        'titulo' => 'Tipo de Documento'
      ])
      @endcomponent
    </div>

    <div class="col-4 col-sm-9 col-md-8 col-lg-1 col-xl-1 col-xxl-1">
      @component('aplicacion.elementos.campo.etiqueta', [
        'id' => 'documento',
        'mascara' => ['tipo' => 'entero'],
        'atributos' => 'disabled',
        'titulo' => 'Documento'
      ])
      @endcomponent
    </div>

    <div class="col-4 col-sm-9 col-md-8 col-lg-2 col-xl-2 col-xxl-2">
      @component('aplicacion.elementos.campo.etiqueta', [
        'id' => 'referencia',
        'titulo' => 'Referencia'
      ])
      @endcomponent
    </div>

    <div class="col-4 col-sm-9 col-md-8 col-lg-2 col-xl-2 col-xxl-2">
      @component('aplicacion.elementos.campo.etiqueta', [
        'tipo' => 'date',
        'id' => 'fecha',
				'valor' => $fecha->valor,
				'atributos' => '
					min=' . $fecha->minima . '
					max=' . $fecha->maxima,
        'titulo' => 'Fecha'
      ])
      @endcomponent
    </div>

    <div class="col-4 col-sm-9 col-md-8 col-lg-2 col-xl-2 col-xxl-2">
      @component('aplicacion.elementos.campo.etiqueta', [
        'id' => 'monto',
        'mascara' => ['tipo' => 'numerico'],
        'titulo' => 'Monto'
      ])
      @endcomponent
    </div>

    <div class="col-4 col-sm-9 col-md-8 col-lg-2 col-xl-2 col-xxl-2">
      @component('aplicacion.elementos.campo.etiqueta', [
        'id' => 'tasa',
        'mascara' => [
          'tipo' => 'numerico',
          'valor' => ['maximo' => '1000']
        ],
        'titulo' => 'Tasa'
      ])
      @endcomponent
    </div>

    <div class="col-12 col-sm-9 col-md-8 col-lg-6 col-xl-6 col-xxl-6">
      @component('aplicacion.elementos.campo.etiqueta', [
				'tipo' => 'select',
				'id' => 'id_sucursal',
				'atributos' => '
					data-peticion-procedimiento="p_traer_filtros"
					data-peticion-parametros="renglon: SUCURSALES"
				',
				'titulo' => 'Sucursal'
      ])
      @endcomponent
    </div>

    <div class="col-12 col-sm-8 col-md-8 col-lg-12 col-xl-12 col-xxl-12">
      @component('aplicacion.elementos.campo.etiqueta', [
        'id' => 'concepto',
        'titulo' => 'Concepto'
      ])
      @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', ['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/procesos/depositosBancarios.js') }}"></script>

@endsection
