<div class="row">
    <div class="col-md-12">
        <h2 class="page-header">
            GENERAR COTIZACIÓN
            <small class="pull-right">Fecha: <small id="fechaHoy" style="font-size: 12px;"></small></small>
        </h2>
    </div>
</div>

<div class="panel panel-default">
<div class="panel-body">
<div class="col-md-12 row invoice-info">
    <div class="col-md-4" style="text-align: center;">
        <div class="col-md-12" style="font-weight: bold;">
            Datos de la empresa:
        </div>
        <div class="col-md-12">    
            <address>
                <strong>CAMARA DE COMERCIO DE SANTA MARTA PARA EL MAGDALENA</strong><br>
                 891780160 -9<br>
                Av Libertador # 13-94
            </address>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <label for="tipoDocumento">Seleccione un Tipo de Documento:</label>
                <select id="tipoDocumento" name="tipoDocumento" class="form-control" onchange="activarBoton()" required style="height: 35px !important;">
                    <option value="0">Seleccione...</option> 
                    {% for TiposIdentificacion in TiposIdentificacion %}
                    <option value="{{ TiposIdentificacion.tipoIdentificacionID }}" >{{ TiposIdentificacion.tipoIdentificacionTITULO }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group">
                <div class="input-group">
                    <input type="number" class="form-control" name="cedulaCliente" id="cedulaCliente" placeholder="Documento del cliente" required style="height: 35px !important;">
                    <span class="input-group-btn">
                        <button class="btn btn-default" id="btnCedulaCliente" type="button" style="height: 35px !important;" disabled="true"><i class="fa fa-search" aria-hidden="true"></i></button>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4" style="text-align: center; font-weight: bold;" >
        <address>
            Datos del cliente:
        </address>
        <div class="col-md-12">
            <div class="form-group">
                <input type="text" class="form-control" id="nombreCliente" name="nombreCliente" placeholder="Nombre del Cliente" required style="height: 35px !important;">
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input type="text" class="form-control" id="direccionCliente" name="direccionCliente" placeholder="Dirección del Cliente" required style="height: 35px !important;">
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input type="text" class="form-control" id="ciudadCliente" name="ciudadCliente" placeholder="Ciudad de Residencia del Cliente" required style="height: 35px !important;">
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input type="number" class="form-control" id="telefonoCliente" name="telefonoCliente" placeholder="Teléfono del Cliente"  style="height: 35px !important;">
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input type="email" class="form-control" id="correoCliente" name="correoCliente" placeholder="Correo del Cliente"  style="height: 35px !important;">
            </div>
        </div>  
    </div>
    <div class="col-md-4" style="text-align: center;">
        <b>Datos de factura:</b><br>
        <br>
        <b>Cotización de venta N°</b><br><h5 class="consecutivonNUM">{{Cotizacion.cotizacionCONSECUTIVO}}</h5>
        <input type="hidden" name="consecutivo" id="consecutivoNUMERO" value="{{Cotizacion.cotizacionCONSECUTIVO}}"/>
        <b>Fecha de factura</b><h5 id="fechaFactura"></h5>
    </div>
</div>
</div>
</div>
<script type="text/javascript">
 $(document).ready(function(){
    var f = new Date();
    var fecha = f.getDate() + "/" + (f.getMonth() +1) + "/" + f.getFullYear();
    $("#fechaHoy").text(fecha);
    $("#fechaFactura").text(fecha);
    $("#tipoDocumento").val({{CotizacionEditar['0'].tipoIdentificacionID}});
    
        {% if CotizacionEditar is defined %}
            {% for CotizacionEditar in CotizacionEditar %}
                $("#tipoDocumento").val({{CotizacionEditar.tipoIdentificacionID}});
                $("#cedulaCliente").val({{CotizacionEditar.personaIDENTIFICACION}});
                $("#nombreCliente").val("{{CotizacionEditar.personaNOMBRES}} {{CotizacionEditar.personaAPELLIDOS}}");
                $("#direccionCliente").val("{{CotizacionEditar.personaDIRECCION}}");
                $("#ciudadCliente").val({{CotizacionEditar.ciudadRESIDENCIA}});
                $("#telefonoCliente").val({{CotizacionEditar.personaTELEFONO}});
                $("#correoCliente").val("{{CotizacionEditar.personaCORREO}}");
                $(".consecutivonNUM").text("{{CotizacionEditar.cotizacionCONSECUTIVO}}");
                $("#consecutivoNUMERO").val("{{CotizacionEditar.cotizacionCONSECUTIVO}}");
                $("#fechaFactura").text("{{CotizacionEditar.cotizacionFCHCREADO}}");
            {% endfor %}   
        {% endif %}   
 });
</script>