<?php
    if (!isset($_SESSION))
    {
        session_start();
        if (!isset($_SESSION['codusuario']))
        {
            $_SESSION['inicio']=0;
            session_destroy();
            $colapsar=" sidebar-left-collapsed";
        }
        else
        {
            $_SESSION['inicio']=1;
            $colapsar="";
        }
    }	
?>
<!doctype html>
<html class="fixed sidebar-left-collapsed" lang="es">
	<head><meta charset="gb18030">
	    
		<meta name="keywords" content="HTML5 Admin Template" />
		<meta name="description" content="Porto Admin - Responsive HTML5 Template">
		<meta name="author" content="okler.net">

		<!-- Mobile Metas -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

		<!-- Web Fonts  -->
		<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Shadows+Into+Light" rel="stylesheet" type="text/css">

		<!-- Vendor CSS -->
   		<link rel="stylesheet" href="assets/vendor/pnotify/pnotify.custom.css" />
		<link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap.css" />
		<link rel="stylesheet" href="assets/vendor/font-awesome/css/font-awesome.css" />
		<link rel="stylesheet" href="assets/vendor/magnific-popup/magnific-popup.css" />
		<link rel="stylesheet" href="assets/vendor/bootstrap-datepicker/css/datepicker3.css" />
		<link rel="stylesheet" href="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.css" />
		<link rel="stylesheet" href="assets/vendor/select2/select2.css" />

		<!-- Theme CSS -->
		<link rel="stylesheet" href="assets/stylesheets/theme.css" />

		<!-- Skin CSS -->
		<link rel="stylesheet" href="assets/stylesheets/skins/default.css" />

		<!-- Theme Custom CSS -->
		<link rel="stylesheet" href="assets/stylesheets/theme-custom.css">

		<!-- Head Libs -->
		<script src="assets/vendor/modernizr/modernizr.js"></script>
		<script src="assets/javascripts/funcionesjrsa.js"></script>	
		
		<style>
			body {font-family: Arial, Helvetica, sans-serif;}

			/* The Modal (background) */
			.modal {
			  display: none; /* Hidden by default */
			  position: fixed; /* Stay in place */
			  z-index: 1; /* Sit on top */
			  padding-top: 120px; /* Location of the box */
			  left: 0;
			  top: 0;
			  width: 100%; /* Full width */
			  height: 100%; /* Full height */
			  overflow: auto; /* Enable scroll if needed */
			  background-color: rgb(0,0,0); /* Fallback color */
			  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
			}

			/* Modal Content */
			.modal-content {
			  position: relative;
			  float: right;
			  background-color: #fefefe;
			  margin: auto;
			  padding: 0;
			  border: 1px solid #888;
			  width: 50%;
			  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
			  -webkit-animation-name: animatetop;
			  -webkit-animation-duration: 0.4s;
			  animation-name: animatetop;
			  animation-duration: 0.4s
			}

			/* Add Animation */
			@-webkit-keyframes animatetop {
			  from {top:-300px; opacity:0} 
			  to {top:0; opacity:1}
			}

			@keyframes animatetop {
			  from {top:-300px; opacity:0}
			  to {top:0; opacity:1}
			}

			/* The Close Button */
			.close {
			  color: white;
			  float: right;
			  font-size: 28px;
			  font-weight: bold;
			}

			.close:hover,
			.close:focus {
			  color: #000;
			  text-decoration: none;
			  cursor: pointer;
			}

			.modal-header {
			  padding: 2px 16px;
			  background-color: #036;
			  color: white;
			}

			.modal-body {padding: 2px 16px;}

			.modal-footer {
			  padding: 2px 16px;
			  background-color: #036;
			  color: white;
			}
		</style>
	</head>
	<body>
		<section class="body">
			<!-- start: header -->
			<header class="header">
				<div class="logo-container">
					<a href="../" class="logo">
						<img src="assets/images/logo.png" height="35" alt="Porto Admin" />
					</a>
					<div class="visible-xs toggle-sidebar-left" data-toggle-class="sidebar-left-opened" data-target="html" data-fire-event="sidebar-left-opened">
						<i class="fa fa-bars" aria-label="Toggle sidebar"></i>
					</div>
				</div>
			
				<!-- start: search & user box -->
				<?php include ("userbox.php");?>
				<!-- end: search & user box -->
			</header>
			<!-- end: header -->
			<div class="inner-wrapper">
				<!-- start: sidebar -->
				<?php include ("menu.php"); ?>
				<!-- end: sidebar -->
				<section role="main" class="content-body">
					<header class="page-header">
						<h2>Reconexi&oacute;n</h2>					
						<div class="right-wrapper pull-right">
							<ol class="breadcrumbs">
								<li>
									<a href="index.html">
										<i class="fa fa-home"></i>
									</a>
								</li>
								<li><span>Gesti&oacute;n</span></li>
								<li><span>Reconexi&oacute;n</span></li>
							</ol>
						</div>
					</header>
                <!--     <a class="simple-ajax-modal btn btn-default fa fa-search" href="busqueda.php?tabla=tramite"></a>
					start: page -->
					<div class="row">												
						<div class="col-md-12">
							<section class="panel">
								<header class="panel-heading">
									<div class="panel-actions">
										<a href="#" class="fa fa-caret-down"></a>
										<!--<a href="#" class="fa fa-times"></a> para cerrar-->
									</div>

									<h2 class="panel-title">Requisitos</h2>

									<p class="panel-subtitle">
										Ingrese los datos que se solicita por favor..
									</p>
								</header>
								<form id="dsolicitud" name="dsolicitud" method="post" enctype="multipart/form-data">
								<div class="panel-body">
									<div class="row">
									    <div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">C&eacute;dula solicitante</label>
												<input id="cedulas" name="cedulas" title="C&eacute;dula del solicitante" type="text" class="form-control" required>
											</div>
										</div>
										<div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">Nombres solicitante</label>
												<input id="nombres" name="nombres" title="Nombres del solicitante" type="text" class="form-control" required>
											</div>
										</div>
										<div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">Apellidos solicitante</label>
												<input id="apellidos" name="apellidos" title="Apellidos del solicitante" type="text" class="form-control" required>
											</div>
										</div>
										<div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">e-mail solicitante</label>
												<input id="mails" name="mails" title="e-mail del solicitante" type="email" class="form-control" required>
											</div>
										</div>										
									</div>									
									<div class="row">
									    <div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">Tel&eacute;fono solicitante</label>
												<input id="telefonos" name="telefonos" title="Tel&eacute;fono del solicitante" type="number" min="1111" max="9999999999" maxlength="10" class="form-control" required>
											</div>
										</div>										
										<div class="col-sm-4">
											<div class="form-group">
												<label class="control-label">Copia de c&eacute;dula solicitante</label>												
												<div class="form-group">
    												<div class="fileupload fileupload-new" data-provides="fileupload">
    													<div class="input-append">
    														<div class="uneditable-input">
    															<span class="fileupload-preview"></span>
    														</div>
    															<span class="btn btn-default btn-file">
    																<span class="fileupload-exists">Cambiar</span>
    																<span class="fileupload-new">Buscar</span>
    																<input type="file" id="acedulas" name="acedulas" title="Copia de c&eacute;dula del solicitante" accept="image/jpeg,image/png,application/pdf" onchange="valiatamano(this)" required>																
    															</span>
    															<a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>															
    													</div>    											    
													</div>												
												</div>
											</div>
										</div>
										<div class="col-sm-3">
											<div class="form-group">
											    <label class="control-label">Relaci&oacute;n con la cuenta</label>
												<div class="input-group mb-md">
													<select id="relacion" name="relacion" title="Relaci&oacute;n con la cuenta" class="form-control" required>
														<option value>Seleccione uno</option>
														<option value="Propietario ">Propietario</option> 
                                                        <option value="Arrendatario del titular ">Arrendatario</option>
                                                        <option value="Familiar  del titular ">Familiar</option>
                                                        <option value="Otro del titular ">Otro</option>																																		
													</select>
												</div>
											</div>
										</div>
									</div>
									<div class="row">
										<header class="panel-heading">
											<div class="panel-actions">
												<!--<a href="#" class="fa fa-caret-down"></a>
												<a href="#" class="fa fa-times"></a> para cerrar-->
											</div>										
											<p class="panel-subtitle">
												Ingrese el n&uacute;mero de c&eacute;dula del titular o directamente el n&uacute;mero de cuenta por favor..
											</p>
										</header>
									    <div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">cédula del titular</label>
												<input id="cedula" name="cedula" type="text" class="form-control" onchange="verifica(this.id);" onkeyup="verifica(this.id);">
											</div>
										</div>
										<div class="col-sm-3">
											<div class="form-group">
												<label class="control-label">n&uacute;mero de cuenta</label>
												<input id="ncuenta" name="ncuenta" type="text" class="form-control" onchange="verifica(this.id);" onkeyup="verifica(this.id);">
											</div>
										</div>
										<div class="col-sm-3" id="gpdf">
											<div class="form-group">
											    <br/>
												<button id="cargadatos" type="button" class="btn btn-primary" onclick="carga_cuenta();" disabled="true">Cargar Datos</button>
											</div>
										</div>
									</div>
									<div class="row">
									    <div class="col-sm-12">
											<div class="form-group">
												<header class="panel-heading">
                									<div class="panel-actions">
                										<!--<a href="#" class="fa fa-caret-down"></a>
                										<a href="#" class="fa fa-times"></a> para cerrar-->
                									</div>
                
                									<h2 class="panel-title">Cuentas</h2>
                
                									<p class="panel-subtitle">
                										El valor de los intereses es referencial, son calculados diariamente.
                									</p>
                								</header>   
												<table class='table table-no-more table-bordered table-striped mb-none' id='datatable-tabletools' data-swf-path='assets/vendor/jquery-datatables/extras/TableTools/swf/copy_csv_xls_pdf.swf'>	
                                                	<thead>
                                                		<tr>
                                                			<th>Cuenta</th>
                                                			<th>C&eacute;dula</th>
                                                			<th>Abonado</th>
                                                			<th>Ubicación</th>
                                                			<th>Meses deuda</th>
                                                			<th>Valor</th>
                                                			<th>Interes</th>
                                                			<th>Generar</th>
                                                		</tr>
                                                	</thead>
                                                	<tbody id="ltpreguntas">
                                				    </tbody>
                                				</table>
											</div>
										</div>
										<div class="col-sm-12">
											<div class="form-group"><br>
											    <header class="panel-heading">
                									<p class="panel-subtitle">
                										A continuaci&oacute;n, deber&aacute; ingresar el documento firmado que descarg&oacute; en el paso anterior.
                									</p>
                								</header>
												<label class="control-label">Documento firmado</label>												
												<div class="form-group">
    												<div class="fileupload fileupload-new" data-provides="fileupload">
    													<div class="input-append">
    														<div class="uneditable-input">
    															<span class="fileupload-preview"></span>
    														</div>
    														<span class="btn btn-default btn-file">
																<span class="fileupload-exists">Cambiar</span>
																<span class="fileupload-new">Buscar</span>
																<input type="file" id="arsolicitud" name="arsolicitud" accept="image/jpeg,image/png,application/pdf" disabled="true" required>																
    														</span>
    														<a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remover</a>															
    													</div>
    											    </div>
    											</div>												
											</div>
										</div>
									</div>
								</div>
							</section>
						</div>						
					</div>										
					<footer class="panel-footer">
					    			<input type="hidden" id="cedulabo2" name="cedulabo2">
					                <input type="hidden" id="cuenta2" name="cuenta2">
					                <input type="hidden" id="abonado2" name="abonado2">
					                <input type="hidden" id="ubicacion2" name="ubicacion2">
					                <input type="hidden" id="medidor2" name="medidor2">
					                <input type="hidden" id="mesesdeuda2" name="mesesdeuda2">
					                <input type="hidden" id="valordeuda2" name="valordeuda2">
					                <input type="hidden" id="interes2" name="interes2">
					    <button type="submit" id="enviar" class="btn btn-primary" disabled="true">Enviar</button>
					</footer>
					            </form>
					            <form id="datospdf" action="pdf/solicitud.php" target="_blank" method="post">
					                <input type="hidden" id="nombresol" name="nombresol" value="">
					                <input type="hidden" id="apellidosol" name="apellidosol" value="">
					                <input type="hidden" id="relacionsol" name="relacionsol" value="">
					                <input type="hidden" id="cedulasol" name="cedulasol" value="">
					                <input type="hidden" id="cedulabo" name="cedulabo" value="">
					                <input type="hidden" id="cuenta" name="cuenta" value="">
					                <input type="hidden" id="abonado" name="abonado" value="">
					                <input type="hidden" id="ubicacion" name="ubicacion" value="">
					                <input type="hidden" id="medidor" name="medidor" value="">
					                <input type="hidden" id="telefonosol" name="telefonosol" value="">
					                <input type="hidden" id="mesesdeuda" name="mesesdeuda" value="">
					                <input type="hidden" id="valordeuda" name="valordeuda" value="">
					                <input type="hidden" id="interes" name="interes" value="">
					            </form>
				</section>
			</div>
		</section>
	<!-- end: page -->
	
	<script src="assets/vendor/jquery/jquery.js"></script>
		<script src="assets/vendor/jquery-browser-mobile/jquery.browser.mobile.js"></script>
		<script src="assets/vendor/bootstrap/js/bootstrap.js"></script>
		<script src="assets/vendor/nanoscroller/nanoscroller.js"></script>
		<script src="assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
		<script src="assets/vendor/magnific-popup/magnific-popup.js"></script>
		<script src="assets/vendor/select2/select2.js"></script>
		<script src="assets/vendor/jquery-placeholder/jquery.placeholder.js"></script>
		<script src="assets/vendor/bootstrap-fileupload/bootstrap-fileupload.min.js"></script>

		<!-- Specific Page Vendor -->
		<script src="assets/vendor/pnotify/pnotify.custom.js"></script>
        		
		<!-- Theme Base, Components and Settings -->
		<script src="assets/javascripts/theme.js"></script>
		
		<!-- Theme Custom -->
		<script src="assets/javascripts/theme.custom.js"></script>
		<script src="assets/javascripts/ui-elements/examples.modals.js"></script>

		
		<!-- Theme Initialization Files -->
		<script src="assets/javascripts/theme.init.js"></script>
        <!-- Examples -->
		<script src="assets/javascripts/ui-elements/examples.notifications.js"></script>
		
	</body>
</html>