var _RUTA = "/pago/"; //servidor
//var _RUTA = "/2020_itz/pago/";
var _TOKEN = $('meta[name="csrf-token"]').attr('content');

function mp(){ $('#loading').fadeIn( 400, "linear"); } //funcion para mostar
function op(){ $('#loading').fadeOut( 10, "linear"); } // funcion para ocultar
function tel(id){$('#'+id).mask('(999) 999-9999');}
function mn(mensaje) { $("#modal_mensaje_contenido").html(mensaje); $('#modal_mensaje').modal('show'); }

function me(json){ //mostrar errores
		for (var key in json) { mn( json[key]); }
}

function seleccion(){
	mp();
	$.ajax({
		url: _RUTA+'seleccion', headers: { 'X-CSRF-TOKEN': _TOKEN },
		type: 'POST', dataType: 'html', data: {'bandera': 'aspirante'},
	})
	.done(function(vista) { $("#vaucher").html(vista); })
	.fail(function() { console.log("error"); })
	.always(function() { console.log("complete"); op(); });
}

function carga_formulario(){
	mp();
	$nc=$("#numero").val();
	if ($nc!="") {
		$.ajax({
			url: _RUTA+'vaucher', headers: { 'X-CSRF-TOKEN': _TOKEN },
			type: 'POST', dataType: 'json', data: {'numero':$nc},
		})
		.done(function(json) { 
			if (json['estado']=='vista') {
				$("#vaucher").html(json['vista']); 
				tel('celular'); 
				$('[data-toggle="popover"]').popover();
				chk_validar_total();
			} else {
				mn(json['mensaje']);
				$("#numero").val("");
			}
		})
		.fail(function() { console.log("error"); })
		.always(function() { op(); });
	}else{mn("Ingresa tu número de solicitud o número de control.");op();}
}

function checks(table){
	var filtro = table.column(0).nodes().filter(function(value, index){ //funcion de datatables para obtener los datos
		var chk = value.childNodes[0];
				chk.addEventListener('change',chk_validar_total);
	});
}

function chk_validar_total(){
	$(".ocultar").hide();
	var table = $('#dtBasicExample').DataTable();
	var t = 0; //Suma de todos los costos
	var filtro = table.column(0).nodes().filter(function(value, index){ //funcion de datatables para obtener los datos
		var chk = value.childNodes[0];
		if (chk.checked) { 
			t=parseInt(t)+parseInt(chk.dataset.costo); 

			if (chk.dataset.extra!="") { //Mostrar campo extra
				var x = chk.dataset.extra.split(",");
				for (var i=0; i<x.length; i++) { $("#"+x[i]).show('slow'); }
			}
		}
		$(".chk_total").html(t.toFixed(2));
	});
}

function total_vauchers(){
	var inputs = document.getElementsByName('importe');
	var t = 0;
	for (var i = inputs.length - 1; i >= 0; i--) {
		var importe = inputs[i].value*1;
		if (importe!="" && importe>0) {
			t+=importe;
		}
	}
	$("#t_vaucher").html(t.toFixed(2));
}

/*Colocar en la vista el nombre del archivo seleccionado*/
function nombre_archivo(id_div){
	var $files = $("#"+id_div).find("#imagen")[0].files;
	if ($files.length>0) {
		$("#"+id_div).find('#lbl_imagen').html($files[0].name);
	} else {
		$("#"+id_div).find('#lbl_imagen').html("Selecciona Archivo");
	}
}

/*Agrega otro formulario para subir comprobante*/
function add_form_vaucher(){
	$("#paginacion_vauchers").show();
	$("#btn_x").show();

	$(".div_img").hide();
	$(".btn_n").each(function(index, el) { $(this).removeClass('btn-primary'); $(this).addClass('btn-outline-light');  });
	

	var n = $("#cont_div_img").val(); //contador
	var $nuevo = $("#vaucher_1").clone(); //div que tiene los campos para subir img
			$nuevo[0].id="vaucher_"+n;
			$nuevo.show();
			$nuevo.find('#metodo').val("");
			$nuevo.find('#imagen').val("");
			$nuevo.find('#referencia').val("");
			$nuevo.find('#importe').val("");
			$nuevo.find('#fecha_pago').val("");
			$nuevo.find('#imagen').removeAttr('oninput');
			$nuevo.find('#imagen').attr('oninput', "nombre_archivo('vaucher_"+n+"');");
			$nuevo.find('#lbl_imagen').val("Selecciona Archivo");


			$(".lbl_img").hide(); //Ocultar la imagen de ejemplo y mostrar la de por defecto, asi como la etiqueta
			$("#label_").show();
			$(".div_img_ejemplo").hide();
			$("#div_metodo_").show();
	
	var $boton = $(".btn_pag_img").first().clone(); //boton de paginacion nuevo
			$boton[0].id="btn_vaucher_"+n;

			//al boton, le agregamos el id del div q mostrara cuando se haga click
			$boton[0].dataset.id="vaucher_"+n;
			$('#btn_x')[0].dataset.id="vaucher_"+n;

			$boton[0].classList.add("btn-primary");
			$boton[0].classList.remove("btn-outline-light");
			$boton.show();
	$("#form_img_vauchers").append($nuevo);
	$("#div_pag_vaucher").append($boton);
	$("#div_pag_vaucher").show();

	//Reordenar los numeros
	$(".btn_n").each(function(index, el) { $(this).text(index);  });


	//Incremento del contador
	$("#cont_div_img").val(parseInt(n)+1);
}

/*Cuando se hace clic en la paginaion de los formularios*/
function mostrar_div_vaucher(element){
	var id = element.dataset.id;
	var options = {};

	$(".lbl_img").hide(); //Ocultar la imagen de ejemplo y mostrar la de por defecto, asi como la etiqueta
	$("#label_").show();

	$(".div_img_ejemplo").hide();
	$("#div_metodo_").show();

	$(".btn_n.btn-primary").addClass('btn-outline-light').removeClass('btn-primary'); 
	
	$("#btn_"+id).addClass("btn-primary");
	$("#btn_"+id).removeClass("btn-outline-light");

	if (id!='vaucher_1' && $("#btn_mas").css('display')!="none") { $("#btn_x").show(); } else { $("#btn_x").hide(); }
	$('#btn_x')[0].dataset.id=id;
	
	$(".div_img:not(#"+id+")").hide(0, function(){
		setTimeout(function(){ $("#"+id).show('blind', options, 'slow'); }, 100); 	
	});

	var idSelect = $("#"+id).find('#metodo').val();
	imagen_vaucher(idSelect);
	
}

function eliminar_div_vaucher(element){
	$('#btn_x').hide();
	$(".btn_n").each(function(index, el) { $(this).removeClass('btn-primary'); $(this).addClass('btn-outline-light');  });
	$("#btn_vaucher_1").addClass('btn-primary');
	$("#btn_vaucher_1").removeClass('btn-outline-light');
	var id = element.dataset.id;
	if (id!="vaucher_1") {
		$("#"+id).remove();
		$("#btn_"+id).remove();
	}
	
	$(".div_img").hide();
	$("#vaucher_1").show();
	$("#btn_x").hide();

	//Reordenar los numeros
	$(".btn_n").each(function(index, el) { $(this).text(index);  });

	if ($(".btn_n").length==2) { $("#paginacion_vauchers").hide(); $("#div_pag_vaucher").hide(); }

	total_vauchers();
}

function datos(bandera, id){
	mp();
	$.ajax({
		url: _RUTA+'vaucher/datos', headers: { 'X-CSRF-TOKEN': _TOKEN },
		type: 'POST', dataType: 'json', data: {'bandera': bandera, 'numero':id},
	})
	.done(function(json) { 
		var table = $('#dtBasicExample').DataTable(); //tabla de servicios
		var met = ""; //ultimo metodo de pago para actualizar la imagen 
		
		var alumno; // obtener los datos del alumno o aspirante
		var datos;
		if (json.hasOwnProperty('alumno_historico_pagos')) {
			datos = json.alumno_historico_pagos;
		} else {
			datos = json.aspirante_historico_pagos;
		}

		if (datos[0].hasOwnProperty('alumno')) {
			alumno = datos[0].alumno;
		} else {
			alumno = datos[0].aspirante;
		}

		var v = datos.length; //total de comprobantes que subieron anteriormente
		var s = json.servicios_pagados.length;
		
		//servicios pagados
		for (var i = 0; i < s; i++) {
			var filtro = table.column(0).nodes().filter(function(value, index){ //funcion de datatables para obtener los datos
				var chk = value.childNodes[0];

				if ( chk.dataset.id==json.servicios_pagados[i].fk_idServicio ){ 
					chk.checked=true; 

					if (chk.dataset.extra!="") { //Mostrar campo extra
						var x = chk.dataset.extra.split(",");	//Corta los id de los divs guardados en la bd separados por ,
						for (var j=0; j<x.length; j++) { 			//Itera para mostrar los divs cuando es mas de 1
							$("#"+x[j]).show('slow'); 

							var elem = x[j].split("_");					//Separa el nombre del elemento en la vista para cargar los datos ['div_presentacion', 'div_observacion']
							switch (elem[1]) {
								case 'presentacion': //checks
									var p = document.getElementsByName("presentacion");
									for (var k = 0; k < p.length; k++ ){
										if (p[k].id==json.servicios_pagados[i].presentacion) { p[k].checked=true; } else { p[k].checked=false; }
									}
									break;
								
								case 'observacion': //textarea
									$("#observacion").val(json.servicios_pagados[i].observacion);
									break;
								
								case 'semestre': 		//select
									$("#semestre").val( json.alumno_historico_pagos[0].alumno.semestre );
									break;
								
							}
						}
					}
				}
			});
		}

		//cargando celular y correo
		$("#celular").val(alumno.celular);
		$("#correo" ).val(alumno.correo);
			
		$("#motivo").html(json.observaciones[0].observacion);
		$(".chk_total").html(json.total);
		$("#t_vaucher").html(json.total);

		//quitar paneles si agregaron antes de consultar el vaucher rechazado
		$.each($(".div_img"), function(index, elem) {			
      if (index>0) {
        $("#btn_"+elem.id).remove();
        elem.remove();
			} else { elem.style.display='block'; }
		});
		$("#paginacion_vauchers").hide();
		$("#btn_mas").hide();
		
		//agregar los paneles si es mas de un vaucher rechazado
		for (var i=1; i<v; i++){ add_form_vaucher(); }
		$("#btn_x").hide(); 
		
		//cargando datos de cada vaucher
		$(".div_img").each(function(index, element) {

			var opt = $(this).find("#metodo option");
			for (var i = 0; i < opt.length; i++) {
				if (opt[i].value==datos[index].fk_idFormaPago) {
					opt[i].selected = true;
					met = opt[i].value;
				}
			}
			$(this).data('id', datos[index].id);
			$(this).find("#referencia").val(datos[index].referencia);
			$(this).find("#importe"   ).val(datos[index].importe);
			$(this).find("#fecha_pago").val(datos[index].fecha_pago.split('T')[0]);
		});
		imagen_vaucher(met);

		//cambiando funcion de cuando actualicen
		var $btn = $("#btn-aceptar");
		$btn.attr('onclick', "update_vaucher('"+bandera+"', '"+id+"')");
		$btn.html('Actualizar');

	})
	.fail(function() { console.log("error"); })
	.always(function() { op(); });
}

function validar_vaucher(){
	
	var total = $('.chk_total').first().text()*1;
	if ($("#celular").val()=="") {mn('Ingresa tu número de celular. Será un medio de comunicación.'); op(); return false;}
	if ($("#correo").val()=="") {mn('Ingresa tu correo electrónico. Será un medio de comunicación.'); op(); return false;}
	if( total==0 ){mn('Por favor, selecciona el concepto que pagaste.'); op(); return false;}
	if( total != ( $('#t_vaucher').text()*1 ) ){mn('El importe o suma de los importes, tiene que ser igual a la cuota de los servicios que deseas comprobar.'); op(); return false;}

	var metod = document.getElementsByName('metodo');
	var vauch = document.getElementsByName('imagen');
	var refer = document.getElementsByName('referencia');
	var impor = document.getElementsByName('importe');
	var fecha = document.getElementsByName('fecha_pago');

	for (var i = 0; i < metod.length; i++) {
		if (metod[i].value=="") {mn('Comprobante #'+(i+1)+'. Selecciona una forma de pago.'); op(); return false;}
	}

	for (var i = 0; i < vauch.length; i++) {
		if (vauch[i].files.length==0) {mn('Comprobante #'+(i+1)+'. Selecciona una imagen de tu comprobante.'); op(); return false;}
		if (vauch[i].files.length>1) {mn('Comprobante #'+(i+1)+'. Selecciona solo una imagen.'); op(); return false;}
		if (vauch[i].files[0]==undefined) {mn('Comprobante #'+(i+1)+'. Selecciona la imagen de tu vaucher.'); op(); return false;}
		if (vauch[i].files[0].size>=2097152) {mn('Comprobante #'+(i+1)+'. El tamaño máximo de subida es 2MB.'); op(); return false;}
	}//1MB = 1 048 576 bytes

	for (var i = 0; i < refer.length; i++) {
		if (refer[i].value=="") {mn('Comprobante #'+(i+1)+'. Ingresa el numero de '+refer[i].dataset.numero+' de tu pago.'); op(); return false;}
		if (isNaN(refer[i].value)) {mn('Comprobante #'+(i+1)+'. Ingresa solo números en el numero de '+refer[i].dataset.numero+'.'); op(); return false;}
	}

	for (var i = 0; i < refer.length; i++) {
		for (var j = i+1; j < refer.length; j++) {
			if (refer[i].value==refer[j].value) {
				var n1 = refer[i].dataset.numero;
				var n2 = refer[j].dataset.numero;
				mn('Tu '+n1+' en tu comprobante #'+(i+1)+' no puede ser igual a tu '+n2+' en tu comprobante #'+(j+1)); op(); return false;
			}	
		}
	}

	for (var i = 0; i < impor.length; i++) {
		if (impor[i].value=="") {mn('Comprobante #'+(i+1)+'. Ingresa el importe de pago.'); op(); return false;}
		if ((impor[i].value*1)<0) {mn('Comprobante #'+(i+1)+'. El importe debe de ser un número positivo.'); op(); return false;}
		if (isNaN(impor[i].value)) {mn('Comprobante #'+(i+1)+'. Ingresa solo números en el importe.'); op(); return false;}
	}

	for (var i = 0; i < fecha.length; i++) {
		if (fecha[i].value=="") {mn('Comprobante #'+(i+1)+'. Selecciona la fecha de pago'); op(); return false;}
	}	
	return true;
}

function add_vaucher(bandera){
	mp();
	if (!validar_vaucher()) { return; }

	var formData = new FormData();
			formData.append('bandera',bandera);
			formData.append('celular', 		$("#celular"		).val() );
			formData.append('correo', 		$("#correo"			).val() );
			formData.append('total',   		$("#t_vaucher"	).text());
			formData.append('no_control', $("#no_control"	).val() );

	$.each( $(".ocultar"), function(index, val) {
	 	if ( $(this).css('display')!='none' ) {
	 		var ide = this.id.split('_');			//id del elem a buscar
	 		var elem = $("[name='"+ide[1]+"']");			//elementos con name
        
        if(elem.length>1){ //obtiene el seleccionado del radio
        	for (var i = 0; i < elem.length; i++) {
        		if(elem[i].checked){ formData.append(ide[1], elem[i].value); }
        	}
        } else { //caja de texto
        	formData.append(ide[1], elem[0].value);
        }
	 	}
	});
		
	var comprobantes = [];
	var conceptos = [];
	//comprobantes
	$(".div_img").each(function(index, el) {
				formData.append('imagen_'+index, $(this).find('#imagen')[0].files[0]);
		var metod = $(this).find('#metodo'    ).val();
		var refer = $(this).find('#referencia').val();
		var impor = $(this).find('#importe'   ).val();
		var fecha = $(this).find('#fecha_pago').val();
				comprobantes.push({"metodo":metod, "referencia":refer, "importe":impor, "fecha":fecha });
	});
	//conceptos
	var table = $('#dtBasicExample').DataTable();
	var filtro = table.column(0).nodes().filter(function(value, index){ //funcion de datatables para obtener los datos
		var chk = value.childNodes[0];
		if (chk.checked) { conceptos.push({"id":chk.dataset.id}); }
	});
	
	conceptos = JSON.stringify(conceptos);
	comprobantes = JSON.stringify(comprobantes);
	
	formData.append('conceptos', conceptos);
	formData.append('comprobantes', comprobantes);
	
	$.ajax({
		url: _RUTA+'vaucher/add', headers: { 'X-CSRF-TOKEN': _TOKEN },
		type: 'POST', dataType: 'json', data: formData,
		contentType: false,processData: false,cache: false,
	})
	.done(function(json) {  
		if (json['estado']=='error') {mn(json['mensaje']);} 
		else if(json['estado']=='exito') { mn(json['mensaje']); seleccion(); } 
		else { me(json); } })
	.fail(function() { console.log("error"); })
	.always(function() { console.log("complete"); op(); });
}

function update_vaucher(bandera, id){
	mp();
	if (!validar_vaucher()) { return; }

	var formData = new FormData();
			formData.append('bandera',bandera);
			formData.append('id',id);
			formData.append('celular', 		$("#celular"		).val() );
			formData.append('correo', 		$("#correo"			).val() );
			formData.append('total',   		$("#t_vaucher"	).text() );
			formData.append('no_control', $("#no_control"	).val() );

	$.each( $(".ocultar"), function(index, val) {
	 	if ( $(this).css('display')!='none' ) {
	 		var ide = this.id.split('_');			//id del elem a buscar
	 		var elem = $("[name='"+ide[1]+"']");			//elementos con name
        
        if(elem.length>1){ //obtiene el seleccionado del radio
        	for (var i = 0; i < elem.length; i++) {
        		if(elem[i].checked){ formData.append(ide[1], elem[i].value); }
        	}
        } else { //caja de texto
        	formData.append(ide[1], elem[0].value);
        }
	 	}
	});
		
	var comprobantes = [];
	var conceptos = [];
	//comprobantes
	$(".div_img").each(function(index, el) {
				formData.append('imagen_'+index, $(this).find('#imagen')[0].files[0]);
		var ident = $(this).data('id');
		var metod = $(this).find('#metodo'    ).val();
		var refer = $(this).find('#referencia').val();
		var impor = $(this).find('#importe'   ).val();
		var fecha = $(this).find('#fecha_pago').val();
				comprobantes.push({"metodo":metod, "referencia":refer, "importe":impor, "fecha":fecha, 'id':ident });
	});
	//conceptos
	var table = $('#dtBasicExample').DataTable();
	var filtro = table.column(0).nodes().filter(function(value, index){ //funcion de datatables para obtener los datos
		var chk = value.childNodes[0];
		if (chk.checked) { conceptos.push({"id":chk.dataset.id}); }
	});
	
	conceptos = JSON.stringify(conceptos);
	comprobantes = JSON.stringify(comprobantes);
	
	formData.append('conceptos', conceptos);
	formData.append('comprobantes', comprobantes);
	
	$.ajax({
		url: _RUTA+'vaucher/update', headers: { 'X-CSRF-TOKEN': _TOKEN },
		type: 'POST', dataType: 'json', data: formData,
		contentType: false,processData: false,cache: false,
	})
	.done(function(json) {  
		if (json['estado']=='error') {mn(json['mensaje']);} 
		else if(json['estado']=='exito') { mn(json['mensaje']); seleccion(); } 
		else { me(json); } })
	.fail(function() { console.log("error"); })
	.always(function() { console.log("complete"); op(); });
}

/*Muestra u oculta la imagen que tiene el ejemplo*/
function imagen_vaucher(id){
	$(".div_img_ejemplo").hide();
	$(".lbl_img").hide();
	$("#div_metodo_"+id).show('slow');
	$("#label_"+id).show('slow');
	
	$.each($(".div_img"), function(index, elem) {
		if ($(this).css('display')=="block") {
			var numer = $("#label_"+id).text().toLowerCase(); 
			$(this).find('#referencia')[0].dataset.numero = numer.substring(0,numer.length-1);
		}
	});

}