@include('header-excel')
@include('navigator_menu_principal')

<div class="containerbig">
	
	<div class="row">
		<div class="col-md-8 h3">Reporte cumplimiento de las contrapartes de {{$cli->nombre_cliente}}</div>
	</div>
	<div class="row">
	  <div class="col-md-1 h4">
	    Servicio:
	  </div>
	  <div class="col-md-7">
		<input type="hidden" class="cliente" value="{{$cli->cliente}}">
	  	@foreach($servicios as $ser)
	    	<div class="col-md-3 serv_{{$ser->producto}} serv_0">
	      <label><input type="radio" name="serv_cont[]" class="serv_cont_cump" value="{{$ser->producto}}" @if ($servicio==$ser->producto) checked @endif >&nbsp;&nbsp;{{$ser->nombre_producto}}</label>
	    	</div>
	  	@endforeach
		</div>

		<div class="col-md-4 text-right">
			<button type="button" class="btn btn-fidelitas btn-primary" onclick="location.href='/led/led-clientes'">Volver a clientes</button>
		</div>
	</div>

	<div class="row tabla">
		@include('/led/led_reporte_cumplimiento_tabla')
		<br />
		<br />
	</div>
</div>
<script type="text/javascript">

		function tabla() {

			$('.tablaReporte').DataTable({
					"pagingType": "full_numbers",
					"dom" : "Blf<t>Bip",
					"ordering": true,
					"columns": [ null, null, null, null, null, null, null, null, null ],
					"searching": true,
					"order": [[ 0, "asc", 1, "asc" ]],
				
					"info":  true,
					buttons: [ { extend: 'excel', className: 'btn btn-primary btn-fidelitas',
					 title: 'Cumplimiento', 
								 exportOptions: {
									 columns: [ 0,1,2,3,4,5,6,7,8]
									} 
							 } ],
					"lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100,"Todos"] ],
					"pageLength": 10,
					"language": {
						"lengthMenu": "Mostrar _MENU_ registros por página",
						"zeroRecords": "No se encontraron resultados",
						//"info": "Mostrando página _PAGE_ de _PAGES_",
						//"info": "Total de Registros: _MAX_", 
						"info": "Mostrando  _START_  de  _END_ - <b>Total:</b> _TOTAL_ registros",
						"infoEmpty": "No hay registros disponibles",
						"infoFiltered": "(filtered from _MAX_ total records)",
						"sSearch": "Buscar",
						"oPaginate": {
							"sFirst": "Primera",
							"sPrevious": "Anterior",
							"sNext": "Siguiente",
							"sLast": "Última"
						},
					}
				});
		}


		$(document).ready(function() {
			tabla();
			$('.serv_cont_cump').on('change', function(e) {
				var servicio = ($(this).val());
				var cliente = $('.cliente').val(); 
				$.ajax({
					method: 'post',
					url: '/led/led-reporte-cumplimiento-data',
					data: {'_token' : '{{csrf_token()}}', 'cliente': cliente, 'servicio' : servicio },
					beforeSend : function() {
					},
					success: function(data) {
						$('.tabla').html(data);
						tabla(); 
					}

				});


			});



});
</script>
@include('footer')