@extends('layouts.front.app')
@section('css')
<link href="{{ asset('css/jquery-ui.min.css') }}" rel="stylesheet">
@endsection
@section('content')
<!-- Main content -->

<!--Modal: modalEnviaPagamento-->
<div class="modal fade p-5" id="modalEnviaPagamento" tabindex="-1" role="dialog" data-backdrop="false">
	<div class="modal-dialog modal-notify modal-warning" role="document">
		<!--Content-->
		<div class="modal-content text-center">
			<!--Header-->
			<div class="modal-header d-flex justify-content-center">
				<p class="heading">Prossessando pagamento</p>
			</div>

			<!--Body-->
			<div class="modal-body">
				<i class="fas fa-bell fa-4x animated rotateIn mb-4"></i>
				<p>
					<span class="txtProcessando">Estamos processando seu pagamento, aguarde...</span>
					<div class="spinner-grow text-danger" role="status">
						<span class="sr-only">Carregando...</span>
					</div>
				</p>
			</div>

			<!--Footer-->
			<div class="modal-footer flex-center">
				Aguarde que esta janela se fechar&aacute; ao concluir o pagamento
			</div>
		</div>
		<!--/.Content-->
	</div>
</div>
<!--Modal: modalEnviaPagamento-->

<section>

	<div class="container dark-grey-text">

		<nav>
			<ol class="breadcrumb transparent mt-3">
				<li>
					<a href="{{ route('home') }}" class="font-weight-bold fosco-text"><i class="fa fa-home"></i> Home</a>
					<i class="fas fa-angle-double-right mx-2"></i>
				</li>
				@if(isset($order_id))
				<li class="breadcrumb-item">
					<a class="black-text font-weight-bolder" href="{{ route('accounts', ['tab' => 'orders']) }}">Pedidos</a>
					<i class="fas fa-angle-double-right mx-2"></i>
				</li>
				@else
				<li class="breadcrumb-item">
					<a class="black-text font-weight-bolder" href="{{ route('cart.index') }}">Carrinho</a>
					<i class="fas fa-angle-double-right mx-2"></i>
				</li>
				@endif
				<li class="active">Pagamento</li>
			</ol>
		</nav>

		@if($products->count() > 0)
		@if(auth()->check())

		@php
		$cliente = \App\Shop\Customers\Customer::find(auth()->id());
		/* Esta &eacute; a primeira compra do cliente  */
		if($cliente->orders->count() === 0) {
			$desconto = (floatVal($subtotal) / 100 * floatVal(config('cart.desconto_iniciante')));
			$valorTotal = floatVal($subtotal) - $desconto;
		} else {
			$desconto = 0;
			$valorTotal = $subtotal;
		}
		if(config('cart.desconto_dinheiro') && (config('cart.desconto_dinheiro') >0) ) {
			$descontoAnt = $desconto;
			$desconto = (floatVal($subtotal) / 100 * floatVal(config('cart.desconto_dinheiro')));
			$valorTotal = floatVal($subtotal) - $desconto;
			$desconto = $descontoAnt + $desconto;
		}
		@endphp

		@endif

		<div class="card">
			<h3 class="font-weight-bold fosco-text text-center pt-3"> Finalizar Compra</h3>
			<div class="card-body">
				<form id="formPagamento" action="" method="POST">
					@if($order_id && $order->order_status_id === 1 && $order->pagamentos->count() > 0)
					{{-- Pagamento realizado --}}
					<div class="row">
						<div class="col-sm-6 mb-3 mb-md-0">
							<div class="card text-center">
								<div class="card-header">
									<h3>Pedido nº <span class="badge badge-inline badge-info">{{ $order->id }}</span></h3>
								</div>
								<div class="card-body">
									<h5 class="card-title">Pagamento Realizado</h5>
									<ul class="list-group list-group-flush">
										<li class="list-group-item">Meio de Pagamento: {!! ucfirst($order->payment) !!}</li>
										<li class="list-group-item">Código do pagamento: {{ $order->transaction_id }}</li>
										<li class="list-group-item">Valor em produtos: {!! number_format($order->total_products, 2, ',','.') !!}</li>
										<li class="list-group-item">Valor do Frete: {!! number_format($order->total_shipping, 2, ',','.') !!}</li>
										<li class="list-group-item">Total Pago: {!! number_format($order->total_paid, 2, ',','.') !!}</li>
										<li class="list-group-item">Tipo de pagamento: {!! ucfirst($order->pagamentos->first()->tipo_pagamento) !!}</li>
										@if($order->pagamentos->first()->tipo_pagamento === 'boleto')
										<li class="list-group-item">Link p/ Boleto: <a href="{!! url($order->pagamentos->first()->link_boleto) !!}" target="_blank">Baixe</a></li>
										@else
										@if ($order->pagamentos->first()->tipo_pagamento === 'transferencia')
										@foreach ($order->comprovantes as $comprovante)
										<li class="list-group-item">
											<h5 class="title-description">Comprovante já enviado</h5>
											@if($comprovante)
											<div class="view overlay zoom rounded m-2 z-depth-1">
												<img src="{{ asset("$comprovante->src") }}" alt="Comprovante de pagamento" class="card-img-top">
											</div>
											@endif
										</li>
										@endforeach
										@else
										<li class="list-group-item">Bandeira do cart&atilde;o: {!! ucfirst($order->pagamentos->first()->bandeira) !!}</li>
										<li class="list-group-item">Número de parcelas: {!! ucfirst($order->pagamentos->first()->num_parcelas) !!}</li>
										<li class="list-group-item">Código da autoriza&ccedil;&atilde;o: {!! ucfirst($order->pagamentos->first()->transaction_id) !!}</li>
										@endif
										@endif
									</ul>
								</div>
								<div class="card-footer text-muted">
									Pedido pago em: <span class="badge badge-primary badge-lg">{!! \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $order->pagamentos->first()->created_at)->format('d/m/Y H:i') !!}</span>
								</div>
							</div>
						</div>
						<div class="col-sm-6 mb-3 mb-md-0">
							<div class="card text-center">
								<div class="card-header">
									<h3>Dados do Pedido</h3>
								</div>
								@php
								if($order->filial_id !== null) {
									$json_lojas = file_get_contents('storage/lojas.json');
									$lojas =  collect(json_decode($json_lojas, true));
									foreach ($lojas as $key => $loja) {
										if($loja['id_filial'] === $order->filial_id) {
											$filial = $loja['nome'] . ': ' . $loja['endereco'] .', '.$loja['numero'] .' - '.$loja['bairro'] .' ('.$loja['cidade'] .'/'.$loja['uf'].')';
										}
									}
								} else {
									$filial = '';
								}
								@endphp
								<div class="card-body">
									<ul class="list-group list-group-flush">
										@foreach ($order->products as $produto)
										<li class="list-group-item">Nome: {!! $produto->name !!}</li>
										<li class="list-group-item">SKU: {!! $produto->sku !!}</li>
										@if($order->filial_id !== null)
										<li class="list-group-item"><strong>Loja a ser retirado:</strong> {!! $filial !!}</li>
										@endif
										<li class="list-group-item">Valor unitário: {{ config('cart.currency_symbol') }}
											@if ($produto->sales_price)
											{!! number_format($produto->sales_price, 2, ',','.') !!}
											@else
											{!! number_format($produto->price, 2, ',','.') !!}
											@endif
										</li>
										@endforeach
									</ul>
								</div>
								<div class="card-footer text-muted">
									Pedido criado em: <span class="badge badge-primary badge-lg">{!! \Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $order->created_at)->format('d/m/Y H:i') !!}</span>
								</div>
							</div>
						</div>
					</div>

					@else

					<div class="row">

						<div class="col-lg-8 mb-4">
							<!-- Horizontal Steppers -->

							<!-- Stepers Wrapper -->
							<ul class="stepper stepper-horizontal">
								<!-- First Step -->
								<li class="active" id="tabCadastro">
									<a href="#!">
										<span class="circle">1</span>
										<span class="label red-text">Cadastro</span>
									</a>
								</li>

								<!-- Second Step -->
								<li class="@if($order_id) active @endif" id="tabPagamento">
									<a href="#!" >
										<span class="circle">2</span>
										<span class="label">Pagar com</span>
									</a>
								</li>

								<!-- Third Step -->
								<li id="tabEnviaPagamento">
									<a href="#!" >
										<span class="circle">3</span>
										<span class="label">Conclus&atilde;o</span>
									</a>
								</li>

							</ul>
							<!-- /.Stepers Wrapper -->

							<!-- /.Horizontal Steppers -->

							<div class="tab-content">

								<div class="tab-pane fade @if(!$order_id) show active @endif" id="cadastro" role="tabpanel">

									<div class="row">

										<div class="col-md">
											<label for="name" class="font-weight-bold fosco-text active">Nome:</label>
											<input type="text" id="name" name="name" class="form-control disabled" value="{{ auth()->user()->name }}" readonly>
										</div>

										<div class="col-md">
											<label for="email" class="font-weight-bold fosco-text active">E-mail:</label>
											<input type="email" id="email" name="email" class="form-control disabled" value="{{ auth()->user()->email }}" readonly>
										</div>

									</div>

									<div class="my-3">
										<label for="tipoPessoa" class="font-weight-bold fosco-text">Tipo de pessoa:</label>
										<select class="browser-default custom-select" name="pessoa" id="tipoPessoa">
											<option selected value="0">Pessoa Física</option>
											<option value="1">Jurídica</option>
											<option value="">Extrangeira</option>
										</select>
									</div>

									<div class="my-3">
										<label for="cpf_cnpj" data-tipo="cpf_cnpj" class="font-weight-bold fosco-text active">CPF <span class="red-text">*</span></label>
										<input type="text" id="cpf_cnpj" name="cpf_cnpj" value="{{ auth()->user()->cpf_cnpj }}" placeholder="XXX.XXX.XXX-XX" class="form-control">
									</div>

									@if(isset($addresses) && $addresses->count() > 0 )

									@foreach ($addresses as $address)

									<div class="local-entrega mt-4">

										<div class="card col-lg border rounded p-3 my-2">
											<div class="custom-control custom-radio">
												<input class="custom-control-input" type="radio" id="cobranca_{{ $address->id }}" name="end_cobranca" value="{{ $address->id }}" @if(isset($order_id) && $entrega === $address->id) checked @endif @if($addresses->count() === 1) checked @endif data-zip="{{ $address->zip }}" >
												<label class="custom-control-label h4 fosco-text" for="cobranca_{{ $address->id }}">{{ $address->alias }} (cobrança)</label>
											</div>

											<div class="local p-3">
												<span class="font-weight-bold red-text">
													<i class="fas fa-angle-right"></i>
													{{ $address->address_1 }}, {{ $address->numero }}
													@if ($address->address_2) - {{ $address->address_2 }}@endif
													CEP: {{ $address->zip }} - {{ $address->cidade->nome_municipio }}/{{$address->cidade->uf}}
												</span>
											</div>

											@if($returnFrete)
											<div class="card-body metodo-retirada text-left font-weight-bolder my-2">

												<h5 class="font-weight-bold black-text">Selecione o m&eacute;todo de retirada (ou entrega):</h5>
												<ul class="list-group list-group-flush">
													@foreach ($returnFrete as $frete)
													<li class="list-group-item">
														<input class="custom-control-input" type="radio" name="end_entrega" id="entrega_pac_{{ $frete['codigo'] }}"
														value="{{ $frete['codigo'] }}" data-cep="{{ $address->zip }}" data-street="{{ $address->address_1 }}"
														data-number="{{ $address->numero }}" data-city="{{ $address->cidade->nome_municipio }}"
														data-district="{{ $address->address_2 }}" data-state="{{ $address->cidade->uf }}" data-country="BRA"
														data-shipping="@if($frete['servico'] === 'PAC' ) 1 @else 2 @endif" data-address="{{ $address->id }}"
														data-valor="{{$frete['valor']}}" data-servico="{{ $frete['servico'] }}" data-codigo="{{ $frete['codigo'] }}">
														<label class="custom-control-label" for="entrega_pac_{{ $frete['codigo'] }}">
															{{ $frete['descServico'] }} Entrega em {{ $frete['prazo'] }} @if ($frete['prazo'] > 1) dias @else dia @endif
															Valor: {{ config('cart.currency_symbol') }} {{ number_format($frete['valor'], 2, ',', '.') }}
														</label>
													</li>
													@endforeach
													@if(config('shipping.retirada.ativo'))
													<div id="lojas_retirada">

													</div>
													@endif
												</ul>
											</div>
											@endif

										</div>

									</div>

									@endforeach

									@if(!$order_id)
									<p class="font-weight-bold text-right mb-2">
										<a href="{{ route('customer.address.create', auth()->user()->id) }}" class="btn btn-md btn-rounded red darken-3 white-text font-weight-bolder waves-effect waves-light">
											Adicionar novo endereço<i class="fas fa-plus-circle ml-2"></i>
										</a>
									</p>
									@endif

									@else

									@if(!$order_id)
									<p class="font-weight-bold text-right mb-2">
										<a href="{{ route('customer.address.create', auth()->user()->id) }}" class="btn btn-md btn-rounded red darken-3 white-text font-weight-bolder waves-effect waves-light">
											Adicionar novo endereço<i class="fas fa-plus-circle ml-2"></i>
										</a>
									</p>
									@endif

									@endif

									<a href="#!" class="btn box-green btn-block no-rounded" id="seguirPagamento">Próximo passo <i class="fas fa-arrow-right ml-1"></i></a>
									<a href="#!" class="" id="seguirPagamentoReal"></a>

								</div>

								<div class="tab-pane fade @if($order_id) show active @endif" id="pagamento" role="tabpanel">

									<div class="panel panel-default credit-card-box">
										<table class="table-responsive w-100 ml-3">
											@php
											$pagamentos = explode(',', config('payees.name'));
											@endphp
											<tbody>
												@foreach ($pagamentos as $pagamento)

												@if ($pagamento === 'cielo')
												<tr>
													<th>
														<div class="custom-control custom-radio">
															<input class="form-check-input" type="radio" name="tipo_pagamento" id="tipo_pagamento_{{ $pagamento }}"
															value="{{ $pagamento }}">
															<label class="custom-control-label font-weight-bold h6 pointer" for="tipo_pagamento_{{ $pagamento }}">
																<img class="mx-4 pr-1" height="75" src="{{ asset('storage/images/scholl/card-deb-cdt.png') }}">
																Cart&atilde;o Cr&eacute;dito ou d&eacute;bito
															</label>
														</div>
													</th>
												</tr>
												@endif

												@if ($pagamento === 'erede')
												<tr>
													<th>
														<div class="custom-control custom-radio">
															<input class="form-check-input" id="tipo_pagamento_{{ $pagamento }}" type="radio" name="tipo_pagamento" value="{{ $pagamento }}">
															<label class="form-check-label" for="tipo_pagamento_{{ $pagamento }}">
																<span class="input-group-text">
																	<img class="img-thumbnail rounded float-left mr-5" style="width: 250px" src="https://www.userede.com.br/desenvolvedores/images/com_apiportal/menu/u172.png"> Cart&atilde;o Cr&eacute;dito (eRede)
																</span>
															</label>
														</div>
													</th>
												</tr>
												@endif

												@if ($pagamento === 'getnet')
												<tr>
													<th>
														<div class="custom-control custom-radio">
															<input class="form-check-input" type="radio" name="tipo_pagamento" id="tipo_pagamento_{{ $pagamento }}"
															value="{{ $pagamento }}">
															<label class="custom-control-label font-weight-bold h6 pointer" for="tipo_pagamento_{{ $pagamento }}">
																<img class="mx-4 pr-1" height="75" src="{{ asset('storage/images/scholl/card-deb-cdt.png') }}">
																Cart&atilde;o Cr&eacute;dito ou d&eacute;bito
															</label>
														</div>
													</th>
												</tr>
												@endif
												@if ($pagamento === 'pagseguro')
												<tr>
													<th>
														<div class="custom-control custom-radio">
															<input class="form-check-input" type="radio" name="tipo_pagamento" id="tipo_pagamento_{{ $pagamento }}"
															value="{{ $pagamento }}">
															<label class="custom-control-label font-weight-bold h6 pointer" for="tipo_pagamento_{{ $pagamento }}">
																<img class="mx-4 pr-1" height="75" src="{{ asset('storage/images/scholl/card-deb-cdt.png') }}">
																Cart&atilde;o Cr&eacute;dito ou d&eacute;bito
															</label>
														</div>
													</th>
												</tr>

												@endif
												@if ($pagamento === 'bank-transfer')
												<tr>
													<th>
														<div class="custom-control custom-radio mt-5">
															<input class="form-check-input" type="radio" name="tipo_pagamento" id="tipo_pagamento_{{ $pagamento }}"
															value="{{ $pagamento }}">
															<label class="custom-control-label font-weight-bold h6 pointer" for="tipo_pagamento_{{ $pagamento }}">
																<img class="mx-3" height="75" src="{{ asset('storage/images/scholl/transferencia.png') }}">
																Transfer&ecirc;ncia Banc&aacute;ria
															</label>
														</div>
													</th>
												</tr>

												@endif
												@endforeach
											</tbody>

											<tfoot class="d-none">
												<tr>
													<th>
														<input type="hidden" name="tipoPagamentoEnvia">
														<a href="#!" class="btn btn-primary btn-lg btn-block" id="concluirPagamento">
															Pr&oacute;ximo
														</a>
														<a href="#!" id="concluirPagamentoReal">

														</a>
													</th>
												</tr>
											</tfoot>
										</table>

										<!-- <button class="btn box-green btn-block no-rounded" id="concluirPagamento" type="submit">EFETUAR PkAGAMENTO
											<i class="fas fa-arrow-right ml-1"></i>
										</button> -->
									</div>

								</div>

								<div class="tab-pane fade" id="enviaPagamento" role="tabpanel">
									<input type="hidden" name="items" value="{{ $products }}">
									{{-- Para o endereço --}}
									<input type="hidden" name="address_id" value="@if($order_id){!! $order->address->id !!}@endif">
									<input type="hidden" name="entrega_id" value="@if($order_id && $order->entrega){!! $order->entrega->id !!}@endif">
									<input type="hidden" name="frete" value="@if($order_id){!! $order->total_shipping !!}@endif">
									<input type="hidden" name="postalCode" value="@if($order_id){!! $order->address->zip !!}@endif">
									<input type="hidden" name="street" value="@if($order_id){!! $order->address->address_1 !!}@endif">
									<input type="hidden" name="number" value="@if($order_id){!! $order->address->numero !!}@endif">
									<input type="hidden" name="district" value="@if($order_id){!! $order->address->address_2 !!}@endif">
									<input type="hidden" name="city" value="@if($order_id){!! $order->address->cidade->nome_municipio !!}@endif">
									<input type="hidden" name="state" value="@if($order_id){!! $order->address->cidade->uf !!}@endif">
									<input type="hidden" name="country" value="BRA">
									<input type="hidden" name="type" value="@if($order_id){!! $order->courier_id !!}@endif">
									<input type="hidden" name="cost" value="@if($order_id){!! $order->total_shipping !!}@endif">
									<input type="hidden" name="discount" value="@if($order_id){!! $order->discounts !!}@elseif($desconto > 0){!! $desconto !!}@endif">
									<input type="hidden" name="order_id" value="{!! ($order_id) ?? null !!}">
									{{-- Para o comprador --}}
									<input type="hidden" name="email" value="{{ auth()->user()->email }} ">
									<input type="hidden" name="name" value="{{ auth()->user()->name }}">
									<input type="hidden" name="document_number" value="{{ auth()->user()->cpf_cnpj }}">
									<input type="hidden" name="document_type" value="CPF">
									<input type="hidden" name="document_phone">

									<div id="incluiBankTransfer" style="display: none;">
										@include(config('site.domain').'.front.payments.bank-transfer')
									</div>
									<div id="incluiCielo" style="display: none;">
										@include(config('site.domain').'.front.payments.form-payment', ['gateway' => 'cielo', 'products' => $products, 'total' => $total, 'subtotal' => $subtotal])
									</div>
									{{-- <div id="incluieRede" style="display: none;">
										@include(config('site.domain').'.front.payments.form-payment', ['gateway' => 'erede', 'products' => $products, 'total' => $total])
									</div> --}}
									{{-- <div id="incluiGetNet" style="display: none;">
										@include(config('site.domain').'.front.payments.form-payment', ['gateway' => 'getnet', 'products' => $products, 'total' => $total])
									</div> --}}
									<div id="incluiPagseguro" style="display: none;">
										{{-- @include(config('site.domain').'.front.payments.pagseguro') --}}
									</div>
									<div id="incluiPaypal" style="display: none;">
										{{-- @include(config('site.domain').'.front.payments.paypal') --}}
									</div>
									<div id="incluiStripe" style="display: none;">
										{{-- @include(config('site.domain').'.front.payments.stripe') --}}
									</div>
								</div>

							</div>
							@if(!$order)</form>@endif
						</div>


						<div class="col-lg-4 mb-4">

							<div class="card">

								<div class="card-body">
									<h4 class="mb-4 mt-1 h5 text-center font-weight-bold">Sumário</h4>

									<hr>
									@foreach($products as $product)
									<dl class="row">
										<dd class="col-sm-7">
											{{ $product->name }}
										</dd>
										<dd class="col-sm text-right">
											{{ config('cart.currency_symbol') }} {{ number_format($product->price, 2, ',', '.') }}
										</dd>
									</dl>
									<hr>
									<input type="hidden" name="peso_total" value="{{ floatVal($product->weight) }}">
									@endforeach

									<dl class="row">
										<dt class="col-sm-7">
											Sub Total
										</dt>
										<dt class="col-sm text-right">
											{{ config('cart.currency_symbol') }} {{ number_format(floatVal($subtotal), 2, ',', '.') }}
											<input type="hidden" name='subTotal' value="{{ floatVal($subtotal) }}">
											<input type="hidden" name='total' value="{{ floatVal($valorTotal) }}">
										</dt>
									</dl>
									<hr>
									<dl class="row">
										<dd class="col-sm-7">
											Descontos
											@if (config('cart.desconto_dinheiro'))
													(à vista)
											@endif
										</dd>
										<dd class="col-sm text-right">

											<span class="text-success"><span class="valorPromocao">{{ config('cart.currency_symbol') }} {{ number_format($desconto, 2, ',','.') }}</span></span>
											<input type="hidden" name="id_voucher">
										</dd>
									</dl>
									@if (!isset($order_paid) || $order_paid > 1)
									@if(config('possui_descontos_ls'))
									<dl class="row">
										<form class="">
											{{ csrf_field() }}
											<dd class="col-sm-12">
												<!-- Promo code -->
												<input type="text" class="form-control" placeholder="Código Promocional" aria-label="Código Promocional"  aria-describedby="basic-addon2" name="codigoVoucher">
											</dd>
											<dd class="col-sm-12">
												<button class="btn btn-success btn-md waves-effect" type="button" id="resgatar">Resgatar</button>
											</dd>
										</form>
									</dl>
									@endif
									<!-- Promo code -->
									@endif

									<hr>

									<dl class="row">
										<dd class="col-sm-7">
											Frete
										</dd>
										<dd class="col-sm text-right">
											<span id="valorFrete">{{ config('cart.currency_symbol') }} @if($valorFrete) {{ number_format($valorFrete, 2, ',', '.') }} @else 0,00 @endif</span>
										</dd>
									</dl>
									<hr>

									<dl class="row">
										<dt class="col-sm-7">
											Total
										</dt>
										<dt class="col-sm text-right">
											<span id="valorTotal">{{ config('cart.currency_symbol') }} @if($valorFrete) {{ number_format(floatVal($valorFrete) + floatVal($valorTotal), 2, ',', '.') }} @else {{ number_format(floatVal($valorTotal), 2, ',', '.') }} @endif</span>
										</dt>
									</dl>
								</div>

							</div>


						</div>
					</div>


					@endif
				</div>

			</div>

		</div>
		@else
		<div class="row wow fadeIn">
			<div class="col-md-12">
				<p class="alert alert-warning">Nenhum produto no carrinho. <a href="{{ route('home') }}">Comprar!</a></p>
			</div>
		</div>
		@endif
		<!-- Container -->

		<!-- Modal informativo do Frete -->
		<div class="modal fade top" id="modalFrete" tabindex="-1" role="dialog" aria-labelledby="modalFrete" aria-hidden="true">

			<div class="modal-dialog modal-frame modal-top modal-notify" role="document">


				<div class="modal-content">
					<div class="modal-body">
						<div class="row d-flex justify-content-center align-items-center">

							<p class="pt-3 pr-2">Valor do Frete: <span class="vl-frete-info badge badge-dark"></span> foi adicionado ao seu Pedido.</p>

							<button type="button" class="btn btn-success" data-dismiss="modal">Fechar</button>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Modal informativo do Frete -->

		<!-- Modal informativo do Cupom -->
		<div class="modal fade top" id="modalVoucher" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

			<div class="modal-dialog modal-frame modal-top modal-notify" role="document">


				<div class="modal-content">
					<div class="modal-body">
						<div class="row d-flex justify-content-center align-items-center">

							<p class="pt-3 pr-2">O cupom <span class="codigo badge badge-dark"></span> foi adicionado ao seu Pedido.</p>

							<button type="button" class="btn btn-success" data-dismiss="modal">Fechar</button>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Modal informativo do Cupom -->

		<!-- Modal caso o Cupom esteja vazio -->
		<div class="modal fade" id="modalCupom" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

			<!-- Change class .modal-sm to change the size of the modal -->
			<div class="modal-dialog modal-sm modal-notify modal-danger" role="document">


				<div class="modal-content">
					<div class="modal-header">
						<h4 class="modal-title w-100" id="myModalLabel">Cupom n&atilde;o preenchido</h4>
						<button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						C&atilde;³digo do Cupom, n&atilde;o informado.
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Fechar</button>
					</div>
				</div>
			</div>
		</div>
		<!-- Modal caso o Cupom esteja vazio -->

		<!-- Modal caso o Cupom esteja vazio -->
		<div class="modal fade" id="modalObrigatorio" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

			<!-- Change class .modal-sm to change the size of the modal -->
			<div class="modal-dialog modal-sm modal-notify modal-danger" role="document">


				<div class="modal-content">
					<div class="modal-header">
						<h4 class="modal-title w-100" id="myModalLabel">Verifique os seguintes campos</h4>
						<button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						<ol>
							<li>CPF</li>
							<li>Endereço de Cobrança</li>
							<li>Endereço de Entrega</li>
						</ol>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Fechar</button>
					</div>
				</div>
			</div>
		</div>
		<!-- Modal caso o Cupom esteja vazio -->
	</div>
</section>
@endsection
@section('js')
<script src = "{{ asset('js/axios.js') }}" type = "text/javascript" charset = "utf-8">
</script>
<script src = "{{ asset('js/jquery.mask.js') }}" type = "text/javascript" charset = "utf-8">
</script>
<script src = "{{ asset('js/jquery-ui.min.js') }}" type = "text/javascript" charset = "utf-8">
</script>
<script type="application/javascript" src="https://fingerprint.userede.com.br/b.js"></script>
<script>
	function getPHPSessId() {
		var phpSessionId = document.cookie.match(/PHPSESSID=[A-Za-z0-9]+\;/i);

		if(phpSessionId == null)
		return '';

		if(typeof(phpSessionId) == 'undefined')
		return '';

		if(phpSessionId.length <= 0)
		return '';

		phpSessionId = phpSessionId[0];

		var end = phpSessionId.lastIndexOf(';');
		if(end == -1) end = phpSessionId.length;

		return phpSessionId.substring(10, end);
	}
	function simility(){
		var sc = {
			"customer_id": "c54b99d0-894e-11e7-adc9-77887d29e284",
			"session_id": getPHPSessId(),
			"event_types": "checkout_page",
			"zone": "us",
			"request_endpoint": "https://fingerprint.userede.com.br"
		};
		var ss = new SimilityScript(sc);
		ss.execute();
	};
</script>

<script type="text/javascript">

	var token = document.head.querySelector('meta[name="csrf-token"]')
	axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content
	function TestaCPF(valor) {
		valor = valor.toString();
		valor = valor.replace(/[^0-9]/g, '');

		var digitos = valor.substr(0, 9);
		var novo_cpf = calc_digitos_posicoes(digitos);
		var novo_cpf = calc_digitos_posicoes(novo_cpf, 11);
		if (novo_cpf === valor) {
			return true;
		} else {
			return false;
		}
	}

	function calc_digitos_posicoes(digitos, posicoes = 10, soma_digitos = 0) {
		digitos = digitos.toString();
		for (var i = 0; i < digitos.length; i++) {
			soma_digitos = soma_digitos + (digitos[i] * posicoes);
			posicoes--;
			if (posicoes < 2) {
				posicoes = 9;
			}
		}
		soma_digitos = soma_digitos % 11;
		if (soma_digitos < 2) {
			soma_digitos = 0;
		} else {
			soma_digitos = 11 - soma_digitos;
		}
		var cpf = digitos + soma_digitos;
		return cpf;
	}

	function calculaFrete()
	{
		let entrega = $('input[name=end_entrega]:checked')
		console.log(entrega)
		$('#adicionandoCarrinho').modal( 'show' )

		$('#adicionandoCarrinho').on('shown.bs.modal', function (event) {
			var modal = $(this)
			modal.find('.modal-title').text('Calculando o Frete')
			$(this).modal({
				backdrop: 'static'
			})
		})
		let cep = entrega.data('cep')
		let entrega_id = entrega.data('address')
		let street = entrega.data('street')
		let number = entrega.data('number')
		let district = entrega.data('district')
		let city = entrega.data('city')
		let state = entrega.data('state')
		let country = entrega.data('country')
		let type = entrega.data('shipping')
		let vlFrete = entrega.data('valor')
		let desconto_dinheiro = "{!! config('cart.desconto_dinheiro') !!}"
		let valorPromocao = 0.00
		vlFrete = parseFloat(vlFrete)

		let subTotal = $('input[name=subTotal]').val()
		subTotal = parseFloat(subTotal)

		let vlFinal = subTotal + vlFrete

		if(desconto_dinheiro && (desconto_dinheiro > 0)) {
			subTotal = subTotal  ///- (subTotal * (desconto_dinheiro / 100))
			valorPromocao = (subTotal * (desconto_dinheiro / 100))
			vlFinal = subTotal - valorPromocao + vlFrete
		}

		let formato = { minimumFractionDigits: 2 , style: 'currency', currency: 'BRL' }
		let num_parcelas = "{!! config('cart.parcelas') !!}"
		let parc_sem_juros = "{!! config('cart.parc_sem_juros') !!}"
		let juros_parcelas = "{!! config('cart.juros_parcelas') !!}"
		let valor_min_parcela = "{!! config('cart.valor_min_parcela') !!}"
		let preco_valido = parseFloat(subTotal) + parseFloat(vlFrete)
		let _optionParcela = '<option value="1">Parcelas</option>'
		let valor_parcela = 0.00
		let txt_parcela = '1 x de ' + preco_valido.toLocaleString('pt-BR', formato)

		for(p = 1 ; p <= num_parcelas; p++){
			valor_parcela = preco_valido / p
			if(p === 1){
				_optionParcela += '<option value="'+p+'" data-parcelas="'+ p +'" data-porparcela="'+valor_parcela.toFixed(2)+'">'+p+'</option>'
			} else {
				if(valor_parcela > valor_min_parcela) {
					_optionParcela += '<option value="'+p+'" data-parcelas="'+ p +'" data-porparcela="'+valor_parcela.toFixed(2)+'">'+p+'</option>'
				}
			}
			txt_parcela = p + ' x de ' + valor_parcela.toLocaleString('pt-BR', formato)
		}
		$('select[name=num_parcelas]').html(_optionParcela)

		$('.show-parcelas').val(txt_parcela)

		$('#valorFrete').html(vlFrete.toLocaleString('pt-BR', formato))
		$('#valorTotal').html(vlFinal.toLocaleString('pt-BR', formato))
		$('.valorTotal').html(vlFinal.toLocaleString('pt-BR', formato))
		$('.valorPromocao').html(valorPromocao.toLocaleString('pt-BR', formato))
		$('.vl-frete-info').html(vlFrete.toLocaleString('pt-BR', formato))
		$('input[name=frete]').val(vlFrete)
		$('input[name=cost]').val(vlFrete)

		$('input[name=entrega_id]').val(entrega_id)
		$('input[name=street]').val(street)
		$('input[name=number]').val(number)
		$('input[name=district]').val(district)
		$('input[name=city]').val(city)
		$('input[name=state]').val(state)
		$('input[name=country]').val(country)
		$('input[name=type]').val(type)
		$('input[name=postalCode]').val(cep)

		$('.vl-frete-info').removeClass('badge-success')
		$('.vl-frete-info').addClass('badge-warning')

		$('#modalFrete').modal( 'show' )
		$('#modalFrete').on('shown.bs.modal', function (e) {
			$('#adicionandoCarrinho').modal( 'hide' )
		})
	}
	var token = document.head.querySelector('meta[name="csrf-token"]')
	axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content

	$(document).ready(function() {
		let desconto_dinheiro = "{!! config('cart.desconto_dinheiro') !!}"
		let desconto = 0.00
		let subTotal = $('input[name=subTotal]').val()
		/* Ira fazer o calculo do desconto a vista e carregar no campo corretamente */
		if(desconto_dinheiro && (desconto_dinheiro > 0)) {
			subTotal = parseFloat(subTotal)

			let desconto = (subTotal * (desconto_dinheiro / 100))
			$('input[name=discount]').val(desconto.toFixed(2))
		}

		axios.get("storage/lojas.json")
		.then((response) => {
			let lojas = response.data
			console.log(lojas)
			_divRetirada = '<li class="list-group-item collapsed" data-toggle="collapse" data-target="#areaRetirada" aria-expanded="false">'
				_divRetirada += '<input class="custom-control-input" type="radio" name="end_entrega" id="retirada" value="retirada" data-valor="0.00">'
				_divRetirada += '<label class="custom-control-label" for="retirada"> Retirada (selecione abaixo, a loja que irá retirar/montar) <i class="icon-action fa fa-chevron-down"></i></label>'
				_divRetirada += '</li>'
				_divRetirada += '<li class="list-group-item">'
					_divRetirada += '<ul class="list-group list-group-flush collapsed collapse" id="areaRetirada">'

						let horasEntrega = "{!! config('shipping.retirada.horas') !!}"
						$('#lojas_retirada').html("")

						$.each(lojas, function(i, loja) {
							_divRetirada += '<li class="list-group-item">'
								_divRetirada += '<input class="custom-control-input" type="radio" name="retirada" id="retirada_'+loja.id_filial+'"value="'+loja.id_filial+'" data-cep="'+loja.cep+'" data-street="'+loja.endereco+'"data-number="'+loja.numero+'" data-city="'+loja.cidade+'"data-district="'+loja.bairro+'" data-state="'+loja.uf+'" data-country="BRA" data-shipping="1" data-address="'+loja.id_filial+'" data-valor="'+0.00+'" data-servico="'+i+'" data-codigo="'+loja.id_filial+'">'
								_divRetirada += '<label class="custom-control-label" for="retirada_'+loja.id_filial+'"> '+loja.nome+' <br> '+loja.endereco+', '+loja.numero+' - '+loja.bairro+' ('+loja.cidade+' / '+loja.uf+') <br> Retirada em '+horasEntrega+' horas  Valor: * GRATUITO * </label>'
								_divRetirada += '</li>'
							})
							_divRetirada += '</ul></li>'
							$('#lojas_retirada').append(_divRetirada)
							$('input[name=end_entrega]').on('click', function() {
								calculaFrete()
								$('input[nam=retirada]').removeAttr('checked')
							})
						}).catch((error)=>{
							console.log('Error', error)
						})
						$('input[name=cpf_cnpj]').mask('999.999.999-99')
						$('.numero_cartao').mask('9999 9999 9999 9999')
						$('.validade').mask('99/9999')
						$('.cvv').mask('999')

						$('div.master-card').on('click', function(){
							$('input[value=master]').attr('checked', true)
							$('input[value=amex]').removeAttr('checked')
							$('input[value=aura]').removeAttr('checked')
							$('input[value=discover]').removeAttr('checked')
							$('input[value=diners]').removeAttr('checked')
							$('input[value=elo]').removeAttr('checked')
							$('input[value=jcb]').removeAttr('checked')
							$('input[value=visa]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.visa').on('click', function(){
							$('input[value=visa]').attr('checked', true)
							$('input[value=amex]').removeAttr('checked')
							$('input[value=aura]').removeAttr('checked')
							$('input[value=discover]').removeAttr('checked')
							$('input[value=diners]').removeAttr('checked')
							$('input[value=elo]').removeAttr('checked')
							$('input[value=jcb]').removeAttr('checked')
							$('input[value=master]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.elo').on('click', function(){
							$('input[value=elo]').attr('checked', true)
							$('input[value=amex]').removeAttr('checked')
							$('input[value=aura]').removeAttr('checked')
							$('input[value=discover]').removeAttr('checked')
							$('input[value=diners]').removeAttr('checked')
							$('input[value=jcb]').removeAttr('checked')
							$('input[value=master]').removeAttr('checked')
							$('input[value=visa]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.diners').on('click', function(){
							$('input[value=diners]').attr('checked', true)
							$('input[value=amex]').removeAttr('checked')
							$('input[value=aura]').removeAttr('checked')
							$('input[value=discover]').removeAttr('checked')
							$('input[value=elo]').removeAttr('checked')
							$('input[value=jcb]').removeAttr('checked')
							$('input[value=master]').removeAttr('checked')
							$('input[value=visa]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.discover').on('click', function(){
							$('input[value=discover]').attr('checked', true)
							$('input[value=amex]').removeAttr('checked')
							$('input[value=aura]').removeAttr('checked')
							$('input[value=diners]').removeAttr('checked')
							$('input[value=elo]').removeAttr('checked')
							$('input[value=jcb]').removeAttr('checked')
							$('input[value=master]').removeAttr('checked')
							$('input[value=visa]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.jcb').on('click', function(){
							$('input[value=jcb]').attr('checked', true)
							$('input[value=master]').removeAttr('checked')
							$('input[value=amex]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.aura').on('click', function(){
							$('input[value=aura]').attr('checked', true)
							$('input[value=master]').removeAttr('checked')
							$('input[value=amex]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 0000 0000 0000')
							$('.numero_cartao').mask('9999 9999 9999 9999')
							$('.cvv').attr('placeholder', '000')
							$('.cvv').mask('999')
						})

						$('div.amex').on('click', function(){
							$('input[value=amex]').attr('checked', true)
							$('input[value=master]').removeAttr('checked')
							$('input[value=visa]').removeAttr('checked')
							$('.numero_cartao').attr('placeholder', '0000 000000 00000')
							$('.numero_cartao').mask('9999 999999 99999')
							$('.cvv').attr('placeholder', '0000')
							$('.cvv').mask('0000')
						})

						$('#tipoPessoa').on('change', function(){
							let tipo = $('#tipoPessoa option:selected').val()
							$('input[name=cpf_cnpj]').unmask()
							$('input[name=cpf_cnpj]').val('')
							if( tipo === '0'	) {
								$('span[data-tipo=cpf_cnpj]').html('CPF <span class="red-text">*</span>')
								$('input[name=cpf_cnpj]').attr('placeholder', 'XX.XXX.XXX-XX')
								$('input[name=cpf_cnpj]').mask('999.999.999-99')
								$('input[name=document_type]').val('CPF')
							} else if( tipo === '1' ) {
								$('span[data-tipo=cpf_cnpj]').html('CNPJ <span class="red-text">*</span>')
								$('input[name=cpf_cnpj]').attr('placeholder', 'XX.XXX.XXX/XXXX-XX')
								$('input[name=cpf_cnpj]').mask('99.999.999/9999-99')
								$('input[name=document_type]').val('CNPJ')
							} else {
								$('span[data-tipo=cpf_cnpj]').html('Passport')
								$('input[name=cpf_cnpj]').attr('placeholder', 'Passport')
								$('input[name=cpf_cnpj]').unmask()
								$('input[name=document_type]').val('Passport')
							}
						})

						$('input[name=cpf_cnpj]').on('blur', function(){
							let tipoPessoa = $('#tipoPessoa option:selected').val()
							let strCPF = $('input[name=cpf_cnpj]').val();
							let testCPF = TestaCPF(strCPF)
							console.log(testCPF)
							if(testCPF === false) {
								$("#modalAviso").on('show.bs.modal', function() {
									$('.modal-title').empty()
									$('.modal-title').html('CPF Inv&aacute;lido!!!')
									$('.modal-body').html('O n&uacute;mero do CPF, n&atilde;o &eacute; v&aacute;lido.')
								});
								$("#modalAviso").modal('show')
							} else {
								$('input[name=document_number]').val($(this).val())
							}
						})

						$('.ativa-cartao').on('click', function() {
							let periodo = $('input[name=horario_entrega]:checked').val()
							if (!periodo) {
								$('#modalAviso').find('.modal-title').html('Selecione a data da entrega')
								$('#modalAviso').find('.modal-body').html('Selecione o período da entrega para prosseguir')
								$('#modalAviso').addClass('p-5')
								$('div.modal-dialog').addClass('modal-notify modal-warning')
								$('#modalAviso').modal('show')
							} else {
								$('#seqCartao').addClass('active')
								$('#seqCartao>span.label').addClass('text-success')
								$('#periodo').removeClass('show').removeClass('active').addClass('in')
								$('#cartao').addClass('show').addClass('active')
							}
						})

						$('.ativa-ret-periodo').on('click', function(){
							$('#seqCartao').removeClass('active')
							$('#seqCartao>span.label').removeClass('text-success')
							$('#periodo').addClass('show').addClass('active').removeClass('in')
							$('#cartao').removeClass('show').removeClass('active')
						})

						$('.ativa-cadastro').on('click', function(){
							let entrega_para = $('input[name=entrega_para]').val()
							let assinado = $('input[name=assinado]:checked').val()
							let tem_assinatura = false

							$('input[name=assinado]').each(function(){
								if($(this).prop('checked') === true){
									tem_assinatura = true
								}
							})

							console.log(assinado, tem_assinatura)

							if (!entrega_para) {
								$("#modalAviso").on('show.bs.modal', function() {
									$('#modalAviso').find('.modal-title').html('Preencha os dados da entrega')
									$('.modal-body').html('O nome da pessoa que irá receber, &eacute; obrigatório')
								});

								$('#modalAviso').addClass('p-5')
								$('div.modal-dialog').addClass('modal-notify modal-warning')
								$('#modalAviso').modal('show')
							}

							if (tem_assinatura === false) {
								$('#modalAviso').modal('show')
								$("#modalAviso").on('show.bs.modal', function() {
									$('.modal-body').html('Insira seu nome na assinatura')
								})
							} else if(assinado === 'assinado') {
								let assinatura = $('input[name=assinatura]').val()
								console.log(assinatura)
								if(assinatura === '') {
									$('#modalAviso').modal('show')
									$("#modalAviso").on('show.bs.modal', function() {
										$('#modalAviso').find('.modal-title').html('Marque se tem assinatura')
										$('.modal-body').html('Ou, insira seu nome na assinatura')
									})

									$('#modalAviso').addClass('p-5')
									$('div.modal-dialog').addClass('modal-notify modal-warning')
									$('#modalAviso').modal('show')
								} else {
									$('#seqCadastro').addClass('active')
									$('#seqCadastro>span.label').addClass('text-success')
									$('#cartao').removeClass('show').removeClass('active').addClass('in')
									$('#cadastro').addClass('show').addClass('active')
								}

							} else {
								$('#seqCadastro').addClass('active')
								$('#seqCadastro>span.label').addClass('text-success')
								$('#cartao').removeClass('show').removeClass('active').addClass('in')
								$('#cadastro').addClass('show').addClass('active')
							}
						})

						$('input[name=end_entrega]').on('click', function() {
							calculaFrete()
						})
						$('.ativa-pagamento').on('click', function(e){
							let tipoPessoa = $('#tipoPessoa option:selected').val()
							let cpf_cnpj = $('input[name=cpf_cnpj]').val()
							let cobranca = $('input[name=end_cobranca]:checked').val()
							let entrega = $('input[name=end_entrega]:checked').val()
							let testCPF = TestaCPF(cpf_cnpj)
							e.preventDefault()

							if(testCPF === false && tipoPessoa === "0") {
								console.log('entra no modal')
								$("#modalAviso").on('show.bs.modal', function() {
									$('.modal-title').empty()
									$('.modal-title').html('CPF Inv&aacute;lido!!!')
									$('.modal-body').html('O n&uacute;mero do CPF, n&atilde;o &eacute; v&aacute;lido.')
								});
								$("#modalAviso").modal('show')
								return false
							}
							console.log({'CPF':cpf_cnpj, 'Cobranca': cobranca, 'Entrega': entrega})
							if(cobranca === 'undefined' || entrega === 'undefined' || cobranca === '' || entrega === '' || cpf_cnpj === '') {
								$('#modalObrigatorio').modal( 'show' )
								return false
							} else {
								let url = "{!! url('customer/update') !!}"
								let customer_id = "{!! auth()->id() !!}"
								axios.post(url, {
									token          : token,
									customer_id    : parseInt(customer_id),
									cpf_cnpj       : cpf_cnpj
								},
								{
									headers: {'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest','Content-Type': 'application/json'},
									crossDomain: true
								})
								.then((response)=>{
									console.log('Status', response.status)
									$('#modalAviso').on('show.bs.modal', function (event) {
										var modal = $(this)
										modal.find('.modal-title').text('Informações gravadas')
										modal.find('.modal-body #modal-message').html('Prossiga com o pagamento.')
									})
									$('#modalAviso').modal( 'show' )

								}).catch((error)=>{
									console.log('Error', error)
								})
								$('#pagamento').addClass('active')
								$('#seqPagamento>span.label').addClass('text-success')
								$('#seqPagamento').addClass('active')
								$('#cadastro').removeClass('show').removeClass('active').addClass('in')
								$('#pagamento').addClass('show').addClass('active')
							}
						})

						$('input[name=meio_pagamento]').on('click', function() {
							let meio_pagamento = $('input[name=meio_pagamento]:checked').val()
							let formato = { minimumFractionDigits: 2 }
							let vlFrete = $('input[name=frete]').val()
							vlFrete = parseFloat(vlFrete)

							let subTotal = $('input[name=subTotal]').val()
							subTotal = parseFloat(subTotal)

							let preco_valido = parseFloat(subTotal) + parseFloat(vlFrete)
							let txt_parcela = preco_valido.toLocaleString('pt-BR', formato)
							if(meio_pagamento === 'debito') {
								$('.label_cartao_amex').hide()
								$('.label_cartao_jcb').hide()
								$('.label_cartao_discover').hide()
								$('.label_cartao_diners').hide()
								$('select[name=num_parcelas] option[value=1]').attr('selected','selected')
								$('select[name=num_parcelas]').attr('disabled', true)

								$('.show-parcelas').val(txt_parcela)
								$('input[name=mobile]').removeAttr('readonly')
								$('input[name=mobile]').mask('(99)9 9999-9999')
							} else {
								$('.label_cartao_amex').show()
								$('.label_cartao_jcb').show()
								$('.label_cartao_discover').show()
								$('.label_cartao_diners').show()
								$('select[name=num_parcelas]').removeAttr('disabled')
								$('select[name=num_parcelas] option[value=1]').removeAttr('selected')
								$('input[name=mobile]').attr('readonly', true)
								$('input[name=mobile]').val("")
							}
						})

						$('input[name=tipo_pagamento]').on('click', function() {
							let tipo_pagamento = $('input[name=tipo_pagamento]:checked').val()
							let end_cobranca = $('input[name=end_cobranca]:checked').val()

							if(tipo_pagamento !== '' && tipo_pagamento !== 'undefined') {
								$('#tabEnviaPagamento').addClass('active')
								$('#tabEnviaPagamento>a>span.label').addClass('vitas-text')

								$('#concluirPagamentoReal').attr( 'href', '#enviaPagamento')
								$('#concluirPagamentoReal').attr( 'data-toggle', 'tab')
								$('#concluirPagamentoReal').attr( 'role', 'tab')
								$('#concluirPagamentoReal').trigger("click")

								if(tipo_pagamento === 'bank-transfer') {
									$('#incluiBankTransfer').show()
									$('#incluiCielo').hide()
									$('#incluieRede').hide()
									$('#incluiGetNet').hide()
									$('#incluiPagseguro').hide()
									$('#incluiPaypal').hide()
									$('#incluiStripe').hide()
									$('#formPagamento').attr('method', "POST")
									$('#formPagamento input[name=billing_address]').val(end_cobranca)
									$('#formPagamento').attr('action', "{{ route('bank-transfer.store') }}")
								} else if (tipo_pagamento === 'cielo') {
									$('#incluiCielo').show()
									$('#incluieRede').hide()
									$('#incluiGetNet').hide()
									$('#incluiBankTransfer').hide()
									$('#incluiPagseguro').hide()
									$('#incluiPaypal').hide()
									$('#incluiStripe').hide()
									$('#formPagamento').attr('method', "POST")
									$('#formPagamento input[name=billing_address]').val(end_cobranca)
									$('#formPagamento').attr('action', "{{ route('cielo.storenew') }}")
								} else if (tipo_pagamento === 'erede') {
									$('#incluieRede').show()
									$('#incluiCielo').hide()
									$('#incluiGetNet').hide()
									$('#incluiBankTransfer').hide()
									$('#incluiPagseguro').hide()
									$('#incluiPaypal').hide()
									$('#incluiStripe').hide()
									$('#formPagamento').attr('method', "POST")
									$('#formPagamento input[name=billing_address]').val(end_cobranca)
									$('#formPagamento').attr('action', "{{ route('erede.store') }}")
								} else if (tipo_pagamento === 'getnet') {
									$('#incluiGetNet').show()
									$('#incluiCielo').hide()
									$('#incluieRede').hide()
									$('#incluiBankTransfer').hide()
									$('#incluiPagseguro').hide()
									$('#incluiPaypal').hide()
									$('#incluiStripe').hide()
									$('#formPagamento').attr('method', "POST")
									$('#formPagamento input[name=billing_address]').val(end_cobranca)
									$('#formPagamento').attr('action', "{{ route('getnet.store') }}")
								} else if (tipo_pagamento === 'pagseguro') {
									$('#incluiPagseguro').removeAttr('style')
									$('#incluiPagseguro').show()
									$('#incluiCielo').hide()
									$('#incluieRede').hide()
									$('#incluiGetNet').hide()
									$('#incluiBankTransfer').hide()
									$('#incluiPaypal').hide()
									$('#incluiStripe').hide()
								} else if (tipo_pagamento === 'paypal') {
									$('#incluiPaypal').show()
									$('#incluiPagseguro').hide()
									$('#incluiCielo').hide()
									$('#incluieRede').hide()
									$('#incluiGetNet').hide()
									$('#incluiBankTransfer').hide()
									$('#incluiStripe').hide()
								} else if (tipo_pagamento === 'stripe') {
									$('#incluiStripe').show()
									$('#incluiPaypal').hide()
									$('#incluiPagseguro').hide()
									$('#incluiCielo').hide()
									$('#incluieRede').hide()
									$('#incluiGetNet').hide()
									$('#incluiBankTransfer').hide()
								}
							}
						})

						$('input[name=end_cobranca]').on('click', function(){
							let cobranca = $('input[name=end_cobranca]:checked').val()
							$('input[name=address_id]').val(cobranca)
						})

						$('input[name=entrega]').on('click', function(){
							$('#adicionandoCarrinho').modal( 'show' )

							$('#adicionandoCarrinho').on('shown.bs.modal', function (event) {
								var modal = $(this)
								modal.find('.modal-title').text('Calculando o Frete')
								$(this).modal({
									backdrop: 'static'
								})
							})
							let entrega_id = $(this).data('address')
							let street = $(this).data('street')
							let number = $(this).data('number')
							let district = $(this).data('district')
							let city = $(this).data('city')
							let state = $(this).data('state')
							let country = $(this).data('country')
							let type = $(this).data('shipping')
							let vlFrete = $(this).data('valor')
							vlFrete = parseFloat(vlFrete)

							let subTotal = $('input[name=subTotal]').val()
							subTotal = parseFloat(subTotal)

							let vlFinal = 0.00
							// subTotal + vlFrete

							let formato = { minimumFractionDigits: 2 , style: 'currency', currency: 'BRL' }
							let num_parcelas = "{!! config('cart.parcelas') !!}"
							let parc_sem_juros = "{!! config('cart.parc_sem_juros') !!}"
							let juros_parcelas = "{!! config('cart.juros_parcelas') !!}"
							let valor_min_parcela = "{!! config('cart.valor_min_parcela') !!}"
							let preco_valido = parseFloat(subTotal) + parseFloat(vlFrete)
							let _optionParcela = '<option>Parcelas</option>'
							let valor_parcela = 0.00
							let txt_parcela = '1 x de ' + preco_valido.toLocaleString('pt-BR', formato)

							for(p = 1 ; p <= num_parcelas; p++){
								valor_parcela = preco_valido / p
								if(p === 1){
									_optionParcela += '<option value="'+p+'" data-parcelas="'+ p +'" data-por-parcela="'+valor_parcela.toFixed(2)+'">'+p+'</option>'
								} else {
									if(valor_parcela > valor_min_parcela) {
										_optionParcela += '<option value="'+p+'" data-parcelas="'+ p +'" data-por-parcela="'+valor_parcela.toFixed(2)+'">'+p+'</option>'
									}
								}
								txt_parcela = p + ' x de ' + valor_parcela.toLocaleString('pt-BR', formato)
							}
							$('select[name=num_parcelas]').html(_optionParcela)

							$('.show-parcelas').val(txt_parcela)

							$('#valorFrete').html(vlFrete.toLocaleString('pt-BR', formato))
							$('#valorTotal').html(vlFinal.toLocaleString('pt-BR', formato))
							$('.valorTotal').html(vlFinal.toLocaleString('pt-BR', formato))
							$('.vl-frete-info').html(vlFrete.toLocaleString('pt-BR', formato))
							$('input[name=frete]').val(vlFrete)
							$('input[name=cost]').val(vlFrete)

							$('input[name=entrega_id]').val(entrega_id)
							$('input[name=street]').val(street)
							$('input[name=number]').val(number)
							$('input[name=district]').val(district)
							$('input[name=city]').val(city)
							$('input[name=state]').val(state)
							$('input[name=country]').val(country)
							$('input[name=type]').val(type)

							$('.vl-frete-info').removeClass('badge-success')
							$('.vl-frete-info').addClass('badge-warning')

							$('#modalFrete').modal( 'show' )
							$('#modalFrete').on('shown.bs.modal', function (e) {
								$('#adicionandoCarrinho').modal( 'hide' )
							})

						})

						$('#selectDataEntrega').on('click', function(){

						})

						$('#cielo').on('click', function(){
							$('#formPagamento').attr('action', "{{ route('cielo.index') }}")
						})
						$('#bank-transfer').on('click', function(){
							$('#formPagamento').attr('action', "{{ route('bank-transfer.index') }}")
						})
						$('#stripe').on('click', function(){
							$('#formPagamento').attr('action', "{{ route('checkout.execute') }}")
						})

						$('.btn-pagseguro').on('click', function() {
							$('#adicionandoCarrinho').modal( 'show' )

							$('#adicionandoCarrinho').on('shown.bs.modal', function (event) {
								var modal = $(this)
								modal.find('.modal-title').text('Gerando o Boleto')
								$(this).modal({
									backdrop: 'static'
								})
							})

							let items = $('input[name=items]').val()
							let postalCode = $('input[name=postalCode]').val()
							let cost = $('input[name=frete]').val()
							let street = $('input[name=street]').val()
							let number = $('input[name=number]').val()
							let district = $('input[name=district]').val()
							let city = $('input[name=city]').val()
							let state = $('input[name=state]').val()
							let country = $('input[name=country]').val()
							let type = $('input[name=type]').val()
							let cpf_cnpj = $('input[name=cpf_cnpj]').val()
							let document_type = $('input[name=document_type]').val()
							let address_id = $('input[name=address_id]').val()
							let entrega_id = $('input[name=entrega_id]').val()
							let order_id = $('input[name=order_id]').val()
							let gera_so_boleto = $('input[name=gera_so_boleto]').val()

							let body = {items: items, cost: cost, postalCode: postalCode, street: street, number: number, district: district, city: city, state: state, country: country, type: type, cpf_cnpj: cpf_cnpj, document_type: document_type, address_id: address_id, entrega_id: entrega_id, order_id: order_id}

							if(gera_so_boleto) {
								axios({
									method: 'post',
									url: "{!! url('pagseguro/gera-boleto') !!}",
									data: body
								})
								.then(function (response) {
									console.log(response.data)
									if(response.data.errors) {
										console.log(response.data.errors)
									} else {
										let link = response.data.paymentLink
										$(location).href = link
										window.open(link,'Pagamento do Boleto','height=600,width=800')
										$('#adicionandoCarrinho').modal( 'hide' )
										$('#enviaPagamento').removeClass('active').removeClass('show')
										let divBoleto = '<div id="linkBoleto">'
											divBoleto += '<h3>Boleto gerado com sucesso!</h3>'
											divBoleto += 'Para imprimir o boleto, <a href="'+link+'" target="_blank">clique aqui</a>.'
											divBoleto += '</div>'
											$('#exibeBoleto').html(divBoleto)
											$('#exibeBoleto').addClass('active').addClass('show')
										}
									})
									.catch(function (error) {
										console.log(error);
									})
								} else {
									axios({
										method: 'post',
										url: "{!! url('pagseguro/envia-pagamento') !!}",
										data: body
									})
									.then(function (response) {
										let code = response.data.code
										let pedido_id = response.data.pedido.id
										console.log(response.data, pedido_id);

										let callback = {
											success : function(transactionCode) {
												//Insira os comandos para quando o usuário finalizar o pagamento.
												//O código da transaç&atilde;o estará na variável "transactionCode"
												console.log("Compra feita com sucesso, código de transaç&atilde;o: " + transactionCode)
												axios({
													method: 'get',
													url: "api/pagseguro/confirm/"+code+"/"+transactionCode
												}).then(function (responseC) {
													console.log(responseC)

												})
												.catch(function(error) {
													console.log(error)
												})
											},
											abort : function() {
												//Insira os comandos para quando o usuário abandonar a tela de pagamento.
												console.log("abortado")
											}
										}
										$('#adicionandoCarrinho').modal( 'hide' )
										//Chamada do lightbox passando o código de checkout e os comandos para o callback
										let isOpenLightbox = PagSeguroLightbox(code, callback)
										// Redireciona o comprador, caso o navegador n&atilde;o tenha suporte ao Lightbox
										if (!isOpenLightbox){
											$(location).href="https://pagseguro.uol.com.br/v2/checkout/payment.html?code=" + code
										}

										$('#enviaPagamento').removeClass('active').removeClass('show').addClass('in')
										$('#resultadoPagamento').addClass('show').addClass('active')
									})
									.catch(function (error) {
										console.log(error);
									})
								}
							})

							$('#seguirPagamento').on('click', function(e) {
								console.log('aqui')
								let tipoPessoa = $('#tipoPessoa option:selected').val()
								let cpf_cnpj = $('input[name=cpf_cnpj]').val()
								let entrega = $('input[name=end_entrega]:checked').val()
								let testCPF = TestaCPF(cpf_cnpj)
								e.preventDefault()

								if(testCPF === false && tipoPessoa === "0") {
									console.log('entra no modal')
									$("#modalAviso").on('show.bs.modal', function() {
										$('.modal-title').empty()
										$('.modal-title').html('CPF Inv&aacute;lido!!!')
										$('.modal-body').html('O n&uacute;mero do CPF, n&atilde;o &eacute; v&aacute;lido.')
									});
									$("#modalAviso").modal('show')
									return false
								}
								console.log({'CPF':cpf_cnpj, 'Entrega': entrega})
								if(typeof entrega === 'undefined' || entrega === '' || cpf_cnpj === '') {
									$("#modalAviso").on('show.bs.modal', function() {
										$('.modal-title').empty()
										$('.modal-title').html('Informe enrede&ccedil;o')
										$('.modal-body').html('Informe o enrede&ccedil;o de entrega.')
									});
									$("#modalAviso").modal('show')
									return false
								} else {
									let url = "{!! url('customer/update') !!}"
									let customer_id = "{!! auth()->id() !!}"
									axios.post(url, {
										token          : token,
										customer_id    : parseInt(customer_id),
										cpf_cnpj       : cpf_cnpj
									},
									{
										headers: {'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest','Content-Type': 'application/json'},
										crossDomain: true
									})
									.then((response)=>{
										console.log('Status', response.status)
										$('#modalAviso').on('show.bs.modal', function (event) {
											var modal = $(this)
											modal.find('.modal-title').text('Informações gravadas')
											modal.find('.modal-body #modal-message').html('Prossiga com o pagamento.')
										})
										$('#modalAviso').modal( 'show' )

									}).catch((error)=>{
										console.log('Error', error)
									})
									$('#pagamento').addClass('active')
									$('#seqPagamento>span.label').addClass('text-success')
									$('#seqPagamento').addClass('active')
									$('#cadastro').removeClass('show').removeClass('active').addClass('in')
									$('#pagamento').addClass('show').addClass('active')
								}
							})

							/* Pagando por boleto */
							$('.btn-boleto').on('click', function(){

								$('#modalEnviaPagamento').modal( 'show' )

								let items = $('input[name=items]').val()
								let postalCode = $('input[name=postalCode]').val()
								let frete = $('input[name=frete]').val()
								let street = $('input[name=street]').val()
								let number = $('input[name=number]').val()
								let district = $('input[name=district]').val()
								let city = $('input[name=city]').val()
								let state = $('input[name=state]').val()
								let country = $('input[name=country]').val()
								let type = $('input[name=type]').val()
								let cpf_cnpj = $('input[name=cpf_cnpj]').val()
								let document_type = $('input[name=document_type]').val()
								let address_id = $('input[name=address_id]').val()
								let entrega_id = $('input[name=entrega_id]').val()
								let order_id = $('input[name=order_id]').val()
								let meio_pagamento = $('input[name=meio_pagamento]:checked').val()
								let total = $('input[name=total]').val()
								let discount = $('input[name=discount]').val()

								let body = {items: items, frete: frete, postalCode: postalCode, street: street, number: number, district: district, city: city, state: state, country: country, type: type, cpf_cnpj: cpf_cnpj, document_type: document_type, address_id: address_id, entrega_id: entrega_id, order_id: order_id, meio_pagamento: meio_pagamento, total: total, discount:discount}

								axios({
									method: 'post',
									url: "{!! url('getnet') !!}",
									data: body
								})
								.then(function (response) {
									console.log('Retorno', response.data);
									$('.linha_digitavel').html(response.data.linha)
									$('.link_boleto').html('<a href="'+response.data.boleto+'" target="_blank">Clique para baixar seu boleto</a>')
									$('#modalEnviaPagamento').modal( 'hide' )
									$("#modalAviso").on('show.bs.modal', function() {
										$("#modalAviso").find('.modal-title').empty()
										$("#modalAviso").find('.modal-title').html('Boleto Gerado com sucesso')
										$("#modalAviso").find('.modal-body').html('<a href="'+response.data.boleto+'" target="_blank">Clique para baixar seu boleto</a>')
									});
									$("#modalAviso").modal('show')
								})
								.catch(function (error) {
									$('#modalEnviaPagamento').modal( 'hide' )
									console.log('ERROR', error);
									$("#modalAviso").on('show.bs.modal', function() {
										$("#modalAviso").find('.modal-title').empty()
										$("#modalAviso").find('.modal-title').html('Erro ao gerar Boleto')
										$("#modalAviso").find('.modal-body').html(error)
									});
									$("#modalAviso").modal('show')
								})
							})
							/* ./Pagando por Boleto */
							$('#resgatar').on('click', function(e){
								let voucher = $('input[name=codigoVoucher]').val()
								let valorPedido = $('input[name=total]').val()
								if(voucher === ''){
									$('#modalCupom').modal('show')
								} else {
									e.preventDefault();
									$.ajaxSetup({
										headers: {
											'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
										}
									});
									$.ajax({
										url: "{{ url('api/voucher/findByString') }}",
										method: 'post',
										data: {
											voucher: voucher,
											nome: voucher
										},
										success: function(result){
											/*
											Documentaç&atilde;o:
											tipo {
												I = Índice (percentual)
												P = Produto (percentual) - precisa ler tamb&eacute;m, qual o item está associado ou age em qq item, mas uma única vez (promoç&atilde;o de primeira compra)
												V = Valor do produto
												F = Frete Gratis
												Se o campo qtde = '-1', isto quer dizer que n&atilde;o existe limite para usar
												Observar o campo valor m&atilde;­nimo e o campo da data de validade do cumpom, mesmo que já esteja validado no sistema
											}
											*/
											if(result.total > 0) {
												$(".codigo").html(result.data.voucher)
												$('input[name=id_voucher]').val(result.data.id)
												$('input[name=discount]').val(result.data.valor)
												let novoValor = valorPedido
												let valorDesconto = 0.00
												if(result.data.tipo === 'I') {
													valorDesconto = valorPedido * (result.data.valor / 100)
												}
												novoValor = valorPedido - valorDesconto
												// console.log(result.data, valorPedido, novoValor, valorDesconto)
												$(".valorPromocao").html(valorDesconto.toLocaleString('pt-BR'))
												$(".novoValor").html(novoValor.toLocaleString('pt-BR'))
												$("input[name=total]").val(novoValor.toLocaleString('pt-BR'))
												$('#modalVoucher').modal('show')
											}
										}
									})
								}
							})

							$(".datepicker").datepicker({
								dateFormat: 'mm/yy',
								minDate: new Date(),
								changeMonth: true,
								changeYear: true,
								showButtonPanel: true,
								monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
								nextText: 'Próximo',
								prevText: 'Anterior',
								weekHeader: 'Semana',
								currentText: 'Hoje',
								doneText: 'Ok',

								onClose: function(dateText, inst) {
									var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
									var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
									$(this).val($.datepicker.formatDate('mm/yy', new Date(year, month, 1)));
								},

								onChangeMonthYear: function (year, month, inst) {
									$(this).val($.datepicker.formatDate('mm/yy', new Date(year, month - 1, 1)));
								},

							})

							$(".datepicker").focus(function () {
								$(".ui-datepicker-calendar").hide();
								$("#ui-datepicker-div").position({
									my: "center top",
									at: "center bottom",
									of: $(this)
								})
							})

							$('select[name=num_parcelas]').on('change', function(){
								let formato = { minimumFractionDigits: 2 }
								let parcela = $(this).children("option:selected").data('parcelas')
								let val_parcela = $(this).children("option:selected").data('por-parcela')
								console.log(parcela, val_parcela)
								let txt_parcela = parcela + ' x de ' + val_parcela.toLocaleString('pt-BR', formato)
								$('.show-parcelas').val(txt_parcela)
							})

							$('.finalizar-compra>button[type=submit]').on('click', function(e){
								e.preventDefault()
								let textModal = ''
								let order_id = $('input[name=order_id]').val()
								let meio_pagamento = $('input[name=meio_pagamento]:checked').val()
								let brand_card = $('input[name=brand_card]:checked').val()
								let nome_completo =$('input[name=nome_completo]').val()
								let birthday =$('input[name=birthday]').val()
								let numero_cartao =$('input[name=numero_cartao]').val()
								let cvv =$('input[name=cvv]').val()
								let validade_cartao =$('input[name=validade_cartao]').val()
								let num_parcelas =$('select[name=num_parcelas] option:selected').val()
								let num_documento =$('input[name=rg]').val()
								let cpf_cnpj =$('input[name=cpf_cnpj]').val()
								let mobile =$('input[name=mobile]').val()
								let error = false

								if(meio_pagamento === 'debito' && mobile === '') {
									error = true
									textModal += 'Preencha o n&aacute;mero do celular <br>'
								}
								if(meio_pagamento === '') {
									error = true
									textModal += 'Selecione se &eacute; cr&eacute;dito ou d&eacute;bito <br>'
								}
								if(brand_card === '') {
									error = true
									textModal += 'Selecione a bandeira de seu cart&atilde;o <br>'
								}
								if(nome_completo === '') {
									error = true
									textModal += 'Preencha o nome do titular do cart&atilde;o <br>'
								}
								if(birthday === '') {
									error = true
									textModal += 'Preencha a data de anivers&aacute;rio do titular <br>'
								}
								if(numero_cartao === '') {
									error = true
									textModal += 'Preencha o n&uacute;mero do cart&atilde;o <br>'
								}
								if(cvv === '') {
									error = true
									textModal += 'Informe o c&oacute;digo de seguran&ccedil;a do cart&atilde;o <br>'
								}
								if(validade_cartao === '') {
									error = true
									textModal += 'Informe data de validade do cart&atilde;o <br>'
								}
								if(num_parcelas === '') {
									error = true
									textModal += 'Selecione o n&uacute;mero de parcelas <br>'
								}
								if(cpf_cnpj === '') {
									error = true
									textModal += 'Informe o CPF / CNPJ do titular do cart&atilde;o <br>'
								}
								/* if(num_documento === '') {
									error = true
									textModal += 'Informe o n&uacute;mero do documento do Titular do cart&atilde;o <br>'
								} */

								$("#modalAviso").on('show.bs.modal', function(){
									$('#modalAviso').find('#modalAvisoLabel').html('Reveja os campos')
									$('#modalAviso').find("#modal-message").html(textModal)
								});

								$("#modalEnviaPagamento").on('show.bs.modal', function(){
									$('#modal-message').html('Estamos processando seu pagamento, aguarde...')
								});

								if(error) {
									$('#modalAviso').modal( 'show' )
								} else {
									$('#modalEnviaPagamento').modal( 'show' )
									$('#formPagamento').submit();
								}
							})

							$('.pay-transfer').on('click', function(e){
								e.preventDefault()
								$('input[name=entrega]').removeAttr('required')
								$('input[name=end_cobranca]').removeAttr('required')
								$('#formPagamento').submit()
							})
							$('#PagamentoCredito').on('click', function(){
								$('.cartao').show()
							})
							$('#PagamentoDebito').on('click', function(){
								$('.cartao').show()
							})
							$('#PagamentoBoleto').on('click', function(){
								$('.cartao').hide()
							})

						})
					</script>
					@endsection