@extends('includes.navbarclient')
@section('content')
<style>
	.letra {
		font-size: 10px;	
	}
	.slec{
		background-color:  #797d7f;
	}
	.cortar {
      width: 80px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
	}
</style>
<div class="container">
	<div class="row">
		<div class="col-6">
			<h1>{{ trans( 'messages.servicios' ) }}</h1>
		</div>
		<!--<div class="col-6" align="right">
			<button class="btn btn-danger badge-pill" onclick="vaciaCarrito();">{{ trans( 'messages.eliminar_servicios' ) }}</button>
		</div>-->
	</div>
	<div class="row">
		<div class="col-6" align="left">
			<button class="btn btn-primary badge-pill" onclick="vaciaCarrito();">{{ trans( 'messages.regresar' ) }}</button>
		</div>
	</div>
@if(session('cart'))
	<div class="row">
		<div class="col-6">
			<label>{{ trans( 'messages.moneda' ) }} : {{ $moneda['moneda'] }}</label>
		</div>
		<div class="col-6" align="right">
			<label>{{ trans( 'messages.tipo_cambio' ) }} : {{ $moneda['tipoCambio'] }}</label>
		</div>
	</div>	
	@foreach(session('cart') as $id => $details)			
	<div class="row" style="padding-bottom: 1%;">
		<div class="col-12">
			<div class="card">
				<div class="card-body"> 
					<div class="row">
						<div class="col-5 col-md-2 abs-center">
							<img class="img-fluid border" style="width: 95%;max-width: 120px;" src="{{ asset('/imagenes/imgservicios/navegacion.jpeg') }}" alt="Foto descripcion">
						</div>
						<div class="col-5 col-md-9 align-self-center">
							<div class="row">
								<div class="col-sm-4">{{ $details['nombre'] }}</div>
								<!--<div class="col-sm-3">{{ $details['nombre'] }}</div>-->
								<div class="col-sm-4">
									<div class="row">
										<label>{{ trans( 'messages.costo' ) }} : <strong>${{ $details['costo'] }}</strong></label>
									</div>
									<div class="row">
										<label>{{ trans( 'messages.comision' ) }} : <strong>${{ $details['comisionIAS'] }}</strong></label>
									</div>
									<div class="row" style="display: none;">
										<label>{{ trans( 'messages.comision_bancaria' ) }}: $<strong>{{ $details['comisionBanc'] }}</strong></label>
									</div>
									<div class="row">
										<label>{{ trans( 'messages.impuestos' ) }} : <strong>${{ $details['impuestos'] }}</strong></label>
									</div>
									<select id="cantidad-{{ $details['idServicio'] }}" class="form-control" style="display: none;">
												

										<option value="1" >1</option>';
												

										<option value="2" >2</option>';
												

										<option value="3" >3</option>';
												

										<option value="4" >4</option>';
												

										<option value="5" >5</option>';
												

										<option value="6" >6</option>';
												

										<option value="7" >7</option>';
												

										<option value="8" >8</option>';
												

										<option value="9" >9</option>';
												

										<option value="10" >10</option>';
												

										<option value="11" >11</option>';
												

										<option value="12" >12</option>';
												

										<option value="13" >13</option>';
												

										<option value="14" >14</option>';
												

										<option value="15" >15</option>';
												

										<option value="16" >16</option>';
												

										<option value="17" >17</option>';
												

										<option value="18" >18</option>';
												

										<option value="19" >19</option>';
												

										<option value="20" >20</option>';
												

										<option value="21" >21</option>';
												

										<option value="22" >22</option>';
												

										<option value="23" >23</option>';
												

										<option value="24" >24</option>';
												

										<option value="25" >25</option>';
												

										<option value="26" >26</option>';
												

										<option value="27" >27</option>';
												

										<option value="28" >28</option>';
												

										<option value="29" >29</option>';
												

										<option value="30" >30</option>';
												

										<option value="31" >31</option>';
												

										<option value="32" >32</option>';
												

										<option value="33" >33</option>';
												

										<option value="34" >34</option>';
												

										<option value="35" >35</option>';
												

										<option value="36" >36</option>';
												

										<option value="37" >37</option>';
												

										<option value="38" >38</option>';
												

										<option value="39" >39</option>';
												

										<option value="40" >40</option>';
												

										<option value="41" >41</option>';
												

										<option value="42" >42</option>';
												

										<option value="43" >43</option>';
												

										<option value="44" >44</option>';
												

										<option value="45" >45</option>';
												

										<option value="46" >46</option>';
												

										<option value="47" >47</option>';
												

										<option value="48" >48</option>';
												

										<option value="49" >49</option>';
												

										<option value="50" >50</option>';
												

										<option value="51" >51</option>';
												

										<option value="52" >52</option>';
												

										<option value="53" >53</option>';
												

										<option value="54" >54</option>';
												

										<option value="55" >55</option>';
												

										<option value="56" >56</option>';
												

										<option value="57" >57</option>';
												

										<option value="58" >58</option>';
												

										<option value="59" >59</option>';
												

										<option value="60" >60</option>';
												

										<option value="61" >61</option>';
												

										<option value="62" >62</option>';
												

										<option value="63" >63</option>';
												

										<option value="64" >64</option>';
												

										<option value="65" >65</option>';
												

										<option value="66" >66</option>';
												

										<option value="67" >67</option>';
												

										<option value="68" >68</option>';
												

										<option value="69" >69</option>';
												

										<option value="70" >70</option>';
												

										<option value="71" >71</option>';
												

										<option value="72" >72</option>';
												

										<option value="73" >73</option>';
												

										<option value="74" >74</option>';
												

										<option value="75" >75</option>';
												

										<option value="76" >76</option>';
												

										<option value="77" >77</option>';
												

										<option value="78" >78</option>';
												

										<option value="79" >79</option>';
												

										<option value="80" >80</option>';
												

										<option value="81" >81</option>';
												

										<option value="82" >82</option>';
												

										<option value="83" >83</option>';
												

										<option value="84" >84</option>';
												

										<option value="85" >85</option>';
												

										<option value="86" >86</option>';
												

										<option value="87" >87</option>';
												

										<option value="88" >88</option>';
												

										<option value="89" >89</option>';
																			</select>
								</div>
								<div class="col-sm-4 align-self-center">
									<!--<div class="row">
										<label>Subtotal: <strong>${{ number_format($details['subtotal'],2) }}</strong></label>
									</div>-->
									<div class="row">
										<label>{{ trans( 'messages.importe' ) }}: <strong>${{ number_format($details['subtotal'],2) }}</strong></label>
									</div>
									
							    </div>
							</div>
						</div>
						<div class="col-2 col-md-1 align-self-center">
							<button class="btn btn-danger" onclick="removeItem({{ $details['idServicio'] }});">X</button>
						</div>	
					</div>
				</div>
			</div>	  
		</div>
	</div>
	@endforeach
	<div class="row">
		<div class="col-12" align="right">
			<h4>Subtotal : ${{ $totales['subtotal'] }}<span style="font-size: 15px;">{{ $moneda['moneda'] }}</span></h4>
		</div>
	</div>
		<div class="row">
		<div class="col-12" align="right">
			<h4>{{ trans( 'messages.impuestos' ) }} : ${{ $totales['impuestos'] }}<span style="font-size: 15px;">{{ $moneda['moneda'] }}</span></h4>
		</div>
	</div>
	<div class="row">
		<div class="col-12" align="right">
			<h4>Total : ${{ $totalCarrito }}<span style="font-size: 15px;">{{ $moneda['moneda'] }}</span></h4>
		</div>
	</div>
	<form method="POST" enctype="multipart/form-data" id="laravel-ajax-file-upload" action="javascript:void(0)" >
	<div class="row">
		<div class="col-12" align="center">
			<label>{{ trans( 'messages.comentarios' ) }}</label>
			<textarea class="form-control" id="comentarios" cols="12" rows="2"></textarea>
		</div>
	</div>
	<div class="row">
		<div class="col-3">
			<label>{{ trans( 'messages.factura' ) }}</label>
			<input id="file" class="form-control text-center" type="file" name="file[]" multiple required/>
		</div>
		<div class="col-5">
			<br>
			<div class="alert alert-warning" role="alert">
  				{{ trans( 'messages.mensaje_muiltiple' ) }}
			</div>
		</div>
	</div>
	<br>
	<div class="row" id="filesDivView">

	</div>
		<div class="row">
		<div class="col-12" align="center">
			<div class="form-check">
    			<input type="checkbox" class="form-check-input" id="exampleCheck1" onclick="checar();">
    			<a href="{{ url('/terminosycondiciones') }}" class="form-check-label">{{ trans( 'messages.aceptar_politicas' ) }}</a>
  			</div>
		</div>
	</div>
	<div class="row" id="wer" style="display:none;">
		<div class="col-6" align="right">
		<!--	<button class="btn btn-danger badge-pill">{{ trans( 'messages.cancelar' ) }}</button>-->
		</div>
		<div class="col-6" align="left">
			<!--<a class="btn btn-primary badge-pill" href="#">Siguiente</a>-->
			<button id="nextButton" type="submit" class="btn btn-primary badge-pill" disabled="true">{{ trans( 'messages.siguiente' ) }}</button>
		</div>
	</form>
	</div>
	@else
		<div class="row">
			<div class="col-12" style="height: 100%;" align="center">
				<h1>{{ trans( 'messages.carrito_vacio' ) }}</h1>
			</div>
		</div>
		<div class="row">
			<div class="col-12" align="center">
				<a href="{{ asset('/ventas') }}" class="btn btn-primary btn-lg">{{ trans( 'messages.paga_ahora' ) }}</a>
			</div>
		</div>
	@endif
	<!--<div class="row">
		<div class="col-12">
			<h6>Subtotal : <span>$1,4949.00</span></h6>
		</div>
	</div>-->

</div>
<script>
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
$(document).ready(function() {
	$("#file").change(function(){
		$('#filesDivView').html('')
		if(this.files.length > 0){
			$("#nextButton").prop("disabled", false)
			readURL(this);
		}else{
			$("#nextButton").prop("disabled", true)
		}
	});
});

function readURL(input) {

  if (input.files && input.files[0]) {

  	$.each(input.files, function(index, val) {
  		html = '';
    	 var reader = new FileReader();
    	 console.log(val)
	    reader.onload = function(e) {
		   //		html +='<div class="col-1">'
			html +='<div class="row">'
				html +='<div class="col-1" align="center">'
					html +='<i class="fas fa-file-pdf" title="'+val.name+'"></i>'
				html +='</div>'

				html +='<div class="col-10 cortar" align="center">'
					html +='<span style="font-size:10px;" title="'+val.name+'">'+val.name+'</span>'
				html +='</div>'
			html +='</div>'
			/*html +='<div class="row">'
				html +='<div class="col-12" align="center">'
					html +='<span>'+val.name+'</span>'
				html +='</div>'
			html +='</div>'*/
			
		//	html +='</div>'	   
	      $('#filesDivView').append(html)
	       html = '';
	    }
	    reader.readAsDataURL(val);
  	});

    //reader.readAsDataURL(input.files[0]); // convert to base64 string
  }
}

		function vaciaCarrito(){
		var txt;
		var r = confirm("{{ trans( 'messages.vaciar_carrito' )  }}");
		if (r == true) {
			$.ajax({
				url: 'vacia_carrito',
				type: 'POST',
				dataType: 'json',
			})
			.done(function(resp) {
				console.log(resp);
				if(resp.result==1){
	               //window.location.reload();
	               window.location.href = "https://sistema.aviation-system.com/ventas";
				}
			})
			.fail(function() {
				console.log("error");
			})
			.always(function() {
				console.log("complete");
			});
		} else {
		  return false;
		}

		
	}
	function removeItem(id){
		$.ajax({
			url: 'elimina_item',
			type: 'POST',
			dataType: 'json',
			data: {id: id},
		})
		.done(function(resp) {
			if(resp.result==1){
               window.location.reload();
			}
		})
		.fail(function() {
			console.log("error");
		})
		.always(function() {
			console.log("complete");
		});
		
	}
	function sumaItem(idServ){
		var cantidad = $('#cantidad-'+idServ).val()
		$.ajax({
			url: 'add_cart_item2',
			type: 'POST',
			dataType: 'json',
			data: {cant : cantidad,idSer : idServ},
		})
		.done(function(resp) {
			if(resp.result==1){
               window.location.reload();
			}
		})
		.fail(function() {
			console.log("error");
		})
		.always(function() {
			console.log("complete");
		});
		

	}
	function checar(){
	if( $('#exampleCheck1').prop('checked') ) {
    	$('#wer').show('slow')
	}else{
		$('#wer').hide('slow')
	}
}
	/*function pasaPagar(){
		var comentarios = $('#comentarios').val()
		var imagen = $('#imageFile').val();
		$.ajax({
			url: 'add_comentarios',
			type: 'POST',
			dataType: 'json',
			data: {comentarios : comentarios,imagen : imagen},
		})
		.done(function(resp) {
			if(resp.result==1){
               window.location.href = "{{ url('/pagar')}}";

			}
		})
		.fail(function() {
			console.log("error");
		})
		.always(function() {
			console.log("complete");
		});
	}*/
$('#laravel-ajax-file-upload').submit(function(e) {
e.preventDefault();
var formData = new FormData(this);
$.ajax({
type:'POST',
url: "add_comentarios",
data: formData,
cache:false,
contentType: false,
processData: false,
success: (data) => {
this.reset();
if(data.result==1){
               window.location.href = "{{ url('/pagar')}}"+'/'+data.idVenta;

			}
},
error: function(data){
console.log(data);
}
});
});

</script>
@endsection