@extends('layout')
@section('title', 'Facturación Especial')
@section('content')
<div class="col-sm-12 col-md-10 col-lg-10 col-xl-10">
	<h3 class="text-center titulo">Facturación Especial</h3>
	<div class="borde-forma">
		<form id="form" action="{{ route('RegistrarPagoEspecial') }}" target="_blank" method="post" accept-charset="utf-8">
			<p class="parrafo-forma">
                Los campos marcados con <strong class="requerido">*</strong> son obligatorios.
            </p>
            {{ csrf_field() }}
            <div class="form-group row">
                <label for="txtMetodo" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right test">
                    <strong class="requerido">*</strong>Forma de pago:
                </label>
                <div class="col-sm-12 col-md-5 col-lg-5 col-xl-5 validar">
                    <input class="form-control" type="txtMetodo" name="txtMetodo" id="txtMetodo" placeholder="Método de pago" title="Método de pago" readonly="" value="Anual" required="">
                </div>
            </div>
            <div class="form-group row">
                <label for="txtPredio" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right test">
                    <strong class="requerido">*</strong>Predio:
                </label>
                <div class="col-sm-12 col-md-5 col-lg-5 col-xl-5 validar">
                    <input class="form-control" type="text" name="txtPredio" id="txtPredio" placeholder="Predio" title="Predio" required="" style="height: 34px">
                </div>
                <input type="hidden" name="txtidpredio" id="txtidpredio" value="">
            </div>
            <div class="form-group row">
                <label for="sltAnnoPagar" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right">
                    <strong class="requerido">*</strong>Último año a pagar:
                </label>
                <div class="col-sm-12 col-md-5 col-lg-5 col-xl-5 validar">
                   <select name="txtAnno" id="sltAnno" class="form-control select">
                   </select>
                </div>
            </div>
            <div class="form-group row">
                <label for="optValPago" class="col-form-label col-sm-5 col-md-5 col-lg-5 col-xl-5 text-right">
                    <strong class="requerido">*</strong>Solo paga este perido:
                </label>
                <div class="col-sm-6 col-md-6 col-lg-6 col-xl-6">
                    <div class="form-check form-check-inline">
                        <label for="optV1" class="form-check-label label-forma text-right">
                            <input class="form-check-input" type="radio" name="optValPago" id="optV1" value="1" required=""> SI
                        </label>
                    </div>
                    <div class="form-check form-check-inline">
                        <label for="optP2" class="form-check-label label-forma text-right">
                            <input class="form-check-input" type="radio" name="optValPago" id="optV2" value="2" checked=""> NO
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group row">
                <label for="btnGuardar" class="col-form-label col-md-5 col-lg-5 col-xl-5"></label>
                <div class="col-sm-2 col-md-1 col-lg-1 col-xl-1">
                    <button type="submit" class="btn btn-primary fa fa-save sombra"></button>
                </div>
            </div>
        </form>
	</div>
</div>
@stop
@section('script')
<script type="text/javascript">
	$("#txtPredio").autocomplete({
        source:"/predial/predio/buscar",
        minLength: 5,
        select: function(event, ui){
            $("#txtPredio").val(ui.item.value);
            $("#txtidpredio").val(ui.item.id);

            $.get("/predial/AnnosDebe",{"predio": ui.item.id}, function(data){
                $.each(data, function(i, obj){
                    $("#sltAnno").append('<option value="'+obj.anno+'">'+obj.anno+'</option>');
                });
                $("#sltAnno").trigger("chosen:updated");
            });
        }
    });
</script>
@stop