
<meta      name='viewport' 
     content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' 
/>

<meta name="viewport" content="width=device-width">
<meta name="mobile-web-app-capable" content="yes">



<link rel="stylesheet" type="text/css" href="https://cdn.usebootstrap.com/bootstrap/4.3.1/css/bootstrap.min.css">



<script src="src/jquery.js"></script>
<script src="https://cdn.usebootstrap.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="src/moment1.js"></script>
<script src="src/datatables.js"></script>
<script src="https://cdn.usebootstrap.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>






<body style="background:gray">
 



<div class="container">
<div class="row">

<div class="col-md-12">
   
<div class="form">
		<div class="form-group">
     	            <label>Id</label>
					<input placeholder="0" type="text" id="id" class="form-control" readonly="readonly" size="7" style="width: 85px;">
		</div>

			
			    <div>
				     <label>Nombre</label>
					<input  placeholder="Nombre del cliente" type="text" id="nombre" class="form-control">
			</div>
			
			<div class="form-group">
				 <label>Cedula</label>
					
					<input type="text" placeholder="Cedula del cliente" id="cedula" class="form-control">
			</div>


			<div class="form-group">
				 <label>Telefono</label>
			
					<input type="text" placeholder="Telefono del cliente" id="telefono" class="form-control">
				</div>


			  	<div class="form-group">
				 <label>Correo</label>
		
					<input type="text" placeholder="Direccion de correo electronico" id="direccion" class="form-control">
				</div>

			 	<div class="form-group sm">
				 <label>Ocupacion</label>
					<input type="text" placeholder="Ocupacion del cliente" id="ocupacion" class="form-control">
				</div>

					
			 	<div class="form-group">
				 <label>Direccion</label>
			
					<input placeholder="Ejmp: C/ .., # 0, Sector, Ciudad, Pais" type="text" id="direccion" class="form-control">
				</div>

					<div class="form-group">
				 <label>Ruta</label>
				
					<span id="ruta"></span>
				</div>

		 	<div class="form-group">
				 <label>Cobrador</label>
				
					<span id="cobrador"></span>
				</div>
				



		
		
</div>
</div>

</div>

</div>
</body>
 <script type="text/javascript">
        $(document).ready(function () {
            $('#sidebarCollapse').on('click', function () {
                $('#sidebar').toggleClass('active');
            });
        });
    </script>
	
				









<script>
var id = "<?php echo $_GET['id']?>";
jQuery('document').ready(function(){
	var id = "<?php echo $_GET['id']?>";
	
	llenar_cobradores();
llenar_ruta();



});

/*Seleccionar cliente*/
function get_cliente(id){
try{	
	    limpiar();
		var accion = "get_cliente";
		var url="src/f_clientes.php?id="+id+"&accion="+accion;
		$.get(url,function(data,st){
			if(st=="success"){
				var datos = JSON.parse(data);
				$("#nombre").val(datos.nombre);
				$("#cedula").val(datos.cedula);
				$("#telefono").val(datos.telefono);
				$("#direccion").val(datos.direccion);
				$("#ocupacion").val(datos.ocupacion);
				$("#email").val(datos.email);
				$("#id").val(datos.id_cliente);
				var co = datos.cobrador;
				var ru = datos.ruta;
				
				$("#cobrador0 option[value='"+co+"']").prop('selected', true);
				$("#ruta0 option[value='"+ru+"']").prop('selected', true);
				
				
				
			}
		});
	}catch(e){
		alert(e.message+"\n"+e.description+"\n"+e.stractrace);
	}
}


/*Grabar cliente*/
function grabar_cliente(){
	var id_cliente=	$("#id").val();
	var nombre=	$("#nombre").val();
	var cedula=	$("#cedula").val();
	var telefono=$("#telefono").val();
	var direccion=$("#direccion").val();
	var ocupacion=$("#ocupacion").val();
	var cobrador=$("#cobrador0").val();
	var ruta=$("#ruta0").val();
	var email=$("#email").val();

	
	var parametros = "id_cliente="+id_cliente+"&nombre="+nombre+"&cedula="+cedula+"&telefono="+telefono+"&direccion="+direccion+"&ocupacion="+ocupacion+"&email="+email+"&cobrador="+cobrador+"&ruta="+ruta+"&accion=grabar";
	if(nombre=="" || cedula==""){
		alert("Datos incompletos");
		return; 
	}
	
activo("no");	
var url="src/f_clientes.php?"+parametros;
$.get(url,function(data,st){
	
	if(st=="success"){
	if(data==1){
		alert("registro grabado");
		activo("si");
		limpiar();
			
		}else{
			alert(data);
			activo("si");
	}
		
	}

});
		
}










/*Llenar select rutas*/
function llenar_ruta(){
	
	var accion = "rutas";
	$.get("src/combos.php?accion="+accion,function(data,st){
		
		if(st=="success"){
			$("#ruta").html(data);
			
		}
	});
}


/*Llenar select cobradores*/
function llenar_cobradores(){
	activo("no");
	var accion = "cobradores";
	$.get("src/combos.php?accion="+accion,function(data,st){
		
		if(st=="success"){
			$("#cobrador").html(data);
			get_cliente(id);
			activo("si");
			
		}
	});
}




/*Limpiar campos*/
function limpiar(){

				$("#nombre").val("");
				$("#cedula").val("");
				$("#telefono").val("");
				$("#direccion").val("");
				$("#ocupacion").val("");
				$("#email").val("");
				$("#id").val("");
				var co = "";
				var ru = "";
				
				$("#cobrador0 option[value='"+co+"']").prop('selected', true);
				$("#ruta0 option[value='"+ru+"']").prop('selected', true);
}






/*Eliminar cliente*/
function eliminar(){
	var id = parseInt($("#id").val());
	if(isNaN(id) || id<=0 || id==""){
		alert("*****|  Debe seleccionar un registro |*****");
		return;
	}

	if(confirm("**** SEGURO QUE DESEA ELIMINAR ESTE REGISTRO? ****")){/**/}else{return;}
    	activo("no");
	var accion = "eliminar";
	$.get("src/f_clientes.php?id="+id+"&accion="+accion,function(data,st){
		if(st=="success"){
			if(data==1){
				alert("!Resgistro eliminado");
				activo("si");
				limpiar();
		    }else{
		    	alert(data);
				activo("si");
		    }
			
		}
	});


}







/*Activar y desactivar botones*/
function activo(valor){
	if(valor=="si"){
		$(".btn").prop("disabled",false);
	}else{
		$(".btn").prop("disabled",true);
	}
}



</script>



