@extends('layouts.app')
<link rel="stylesheet" href="{{ asset('css/preloader.css')}}">
<link rel="stylesheet" href="{{ asset('argon') }}/vendor/animate.css/animate.min.css">
<style>
	.white-space {
		white-space: pre-wrap !important;
	}
</style>

<div id="preloaders" class="preloader"></div>
@section('title', 'Entrada de NF-e')
@section('content')
@include('layouts.headers.cards_prod')
<!-- A consulta desta tabela deve envolver INNER JOIN por causa dos nomes da família, nome do grupo e subgrupo, todos vindos das respectivas chaves estrangeiras -->

<div class="container-fluid mt--5">
    <input type="text" id="area_transferencia" class="" value="">
	<div class="row">
		<div class="col-xl-12 order-xl-1">
			<div class="card bg-secondary shadow">
				<div class="card-header bg-white border-0">
					<div class="row align-items-center">
						<div class="col-8">
							<h3 class="mb-0">{{ __('Lista de entradas') }}</h3>
						</div>
						<div class="col-4 text-right">
							<a href="{{ route('entrada.entrada') }}" class="btn btn-sm btn-primary">{{ __('Adicionar uma entrada') }}</a>
						</div>
					</div>
				</div>
				<div class="card-body">
					<div class="table-responsive">

						<table class="table table-sm align-items-center table-dark" id="table_entrada">
							<thead class="thead-dark">
								<tr class="text-center">
									<th>ID</th>
									<th>Fornecedor</th>
									<th colspan="2">NF-E</th>
									<th>Pagamento</th>
									<th>Total</th>
									<th>Inventário</th>
									<th>Data</th>
									<th>Ação</th>
								</tr>
							</thead>
							<tbody>
								@foreach ($entradas->sortByDesc('id_entrada') as $entrada)
								<tr class="text-center">
									<td>{{ $entrada->id_entrada }}</td>
									<td class="white-space">{{ $entrada->razao_cliente }}</td>

									<td>
									@if($entrada->chave_nfe != null)
										<button type="button" class="btn btn-success btn-chave" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$entrada->chave_nfe}}">
											<i class="fas fa-key text-white"> </i><small>chave</small>
										</button>

										@else
										<button type="button" class="btn btn-info btn-chave" data-toggle="modal" data-target="#modal_chave_nfe" value="{{ $entrada->id_entrada }}">
											<i class="fas fa-key text-white"> </i><small>chave</small>
										</button>

										@endif
									</td>

									<td>
										{{$entrada->numero_nfe}}
									</td>

									<td>
										@if ($entrada->nome_tipo_pagamento == 'dinheiro')
										<i class="fas fa-money-bill-wave fa-2x text-success"> </i><br><small>Dinheiro</small>
										@elseif ($entrada->nome_tipo_pagamento == 'cheque a vista')
										<i class="fas fa-money-check-alt fa-2x text-danger"></i><br><small>Cheque</small>
										@elseif ($entrada->nome_tipo_pagamento == 'cheque pre datado')
										<i class="fas fa-money-check-alt fa-2x text-danger"></i><br><small>Cheque</small>
										@elseif ($entrada->nome_tipo_pagamento == 'cartao de credito')
										<i class="fas fa-credit-card fa-2x text-info"></i><br><small>Crédito</small>
										@elseif ($entrada->nome_tipo_pagamento == 'cartao de debito')
										<i class="fas fa-credit-card fa-2x text-info"></i><br><small>Débito</small>
										@elseif ($entrada->nome_tipo_pagamento == 'boleto')
										<i class="fas fa-file-invoice-dollar fa-2x text-primary"></i><br><small>Boleto</small>
										@elseif ($entrada->nome_tipo_pagamento === null)
										<i class="fas fa-question fa-2x text-white"></i><br><small>Não definido</small>
										@else
										@endif
									</td>

									<td>R$ {{ number_format($entrada->total_entrada,2,',','.') }}</td>

									<td>@if($entrada->inventario_status == '1')
										<i class="fas fa-check fa-2x text-success"></i><br><small>Executado</small>
										@else
										<i class="fas fa-clock fa-2x text-yellow"></i><br><small>Aguardando</small>
										@endif
									</td>
									<td>{{date('d-m-Y', strtotime($entrada->created_at))}}</td>
									<td>
										<button type="button" value='{{$entrada->id_entrada}}' class="btn btn-warning btn-entrada" data-toggle='modal' data-target='#ModalEntradaProdutos'>Produtos</button>
										@if($entrada->inventario_status == '1')

										@if($entrada->forma_pagamento === null)
										<button type="button" value='{{$entrada->id_entrada}}' class="btn btn-success btn-finalizar" data-toggle="modal" data-target="#ModalContasPagar">Contas Pagar</button>

										@endif
										@endif
									</td>
								</tr>
								@endforeach
							</tbody>
						</table>

					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id='modal_chave_nfe' aria-labelledby='modal_chave_nfe' aria-hidden='true' role='dialog' tabindex="-1">
	<div class="modal-dialog modal-dialog-centered modal-sm" role='document'>
		<div class="modal-content">
			<div class="modal-header pb-0">
				<h3 class='text-center w-100'>Chave NF-e</h3>
			</div>
			<div class="modal-body">
				<div class="form-group">
					<div class="input-group input-group-alternative mb-3">
						<div class="input-group-prepend">
							<span class="input-group-text"><i class="fas fa-key"></i></span>
						</div>
						<input class="form-control" id="chave_nfe" placeholder="Digite a chave" type="text">
					</div>
				</div>
				<div class="d-flex justify-content-center">
					<button type="button" class="btn btn-success btn-block btn-enviar-chave" value="">Enviar</button>
				</div>
			</div>
		</div>
	</div>
</div>

@include('php.modal-entrada-produtos')
@include('php.modal-contas-pagar')
@include('layouts.footers.auth')

@endsection

@push('js')
<script src="js/print/es6-promise.auto.min.js"></script>
<script src="js/print/jspdf.min.js"></script>
<script src="js/print/html2canvas.min.js"></script>
<script src="js/print/html2pdf.min.js"></script>
<script src="{{ asset('argon/vendor/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-buttons-bs4/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-buttons-bs4/js/buttons.html5.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-buttons-bs4/js/buttons.flash.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-buttons-bs4/js/buttons.print.min.js') }}"></script>
<script src="{{ asset('argon/vendor/datatables.net-select-bs4/js/dataTables.select.min.js') }}"></script>
<script src="{{ asset('argon/vendor/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js') }}"></script>
<script src="{{ asset('argon/vendor/bootstrap-datepicker/dist/locales/bootstrap-datepicker.pt-BR.min.js') }}"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.colVis.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/responsive/2.2.2/js/dataTables.responsive.min.js"></script>
<script type="text/javascript" src="{{ asset('js/contas_pagar.js') }}"></script>
<script type="text/javascript" src="{{ asset('argon') }}/vendor/bootstrap-notify/bootstrap-notify.min.js"></script>

<script>
	//código usando jQuery
	$(document).ready(function() {
		$('.preloader').hide();
	});
</script>

<script>
	$(document).ready(function() {
		$('#table_entrada_produtos').DataTable({
			"language": {
				"info": "Mostrando de _START_ até _END_ de _TOTAL_ registos",
				"search": "Procurar:",
				"paginate": {
					"first": "Primeiro",
					"previous": "<",
					"next": ">",
					"last": "Último"
				}
			},
			order: [[0, "desc"]],
			dom: 'Bfrtip',
			buttons: [
			 //   {
				// 	extend: 'pdfHtml5',
				// 	className: 'btn bg-danger text-white rounded',
				// 	exportOptions: {
				// 		columns: [0, 1, 2, 3]
				// 	}
				// },
				// {
				// 	extend: 'excelHtml5',
				// 	className: 'btn bg-success text-white rounded',
				// 	exportOptions: {
				// 		columns: [0, 1, 2, 3]
				// 	}
				// },
				{
					extend: 'colvis',
					text: 'Colunas',
					className: 'btn bg-default text-white rounded'
				}
			]
		});

		var table = $('#table_entrada').DataTable({
			"language": {
				"info": "Mostrando de _START_ até _END_ de _TOTAL_ registos",
				"search": "Procurar:",
				"paginate": {
					"first": "Primeiro",
					"previous": "<",
					"next": ">",
					"last": "Último"
				}
			},
			dom: 'Bfrtip',
			buttons: [
			 //   {
				// 	extend: 'pdfHtml5',
				// 	className: 'btn bg-danger text-white rounded',
				// 	exportOptions: {
				// 		columns: [0, 1, 2, 3, 4, 5]
				// 	}
				// },
				// {
				// 	extend: 'excelHtml5',
				// 	className: 'btn bg-success text-white rounded',
				// 	exportOptions: {
				// 		columns: [0, 1, 2, 3, 4, 5]
				// 	}
				// },
				{
					extend: 'colvis',
					text: 'Colunas',
					className: 'btn bg-default text-white rounded'
				}
			]
		});

	});
</script>

<script>
	$(document).on('click', '.btn-finalizar', function() {

		let valor = $(this).val();

		$.ajax({
			url: "/entrada/data_entrada/" + valor,
			method: 'get',
			dataType: 'json',
			data: {
				id: valor
			},
			timeout: 5000,
			success: function(retorno) {

				$('#numero_entrada').html(retorno.entrada);
				$('#form_contas_pagar').attr('action', "/entrada/finalizar/" + retorno.entrada);
				$('#valor_pagar').val(retorno.total);
				$('#numero_nfe').val(retorno.nfe);
				$('#option_fornecedor').val(retorno.fornecedor.id);
				$('#option_fornecedor').text(retorno.fornecedor.razao_cliente);

			},
			error: function() {
				alert('Dados não enviados');
			}
		})
	});
</script>

<script>
	$(document).on('click', '.btn-entrada', function() {
		$('#entrada_produtos').children().remove();
		let valor = $(this).val();
		let CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
		$.ajax({
			url: "/entrada/data_entrada/" + valor,
			method: 'get',
			dataType: 'json',
			data: {
				_token: CSRF_TOKEN,
				id: valor
			},
			timeout: 5000,
			success: function(retorno) {

				$('#numero_entrada').val();

				for (let x = 0; x < retorno.success.length; x++) {
					if (retorno.success[x].inventario === null) {

						$td = "<td class='white-space'>" + retorno.success[x].quantidade_produtos + "</td>";
					} else {

						$td = "<td class='white-space'>" + retorno.success[x].estoque_entrada_produto + "</td>";
					}
					$('#entrada_produtos').append("<tr class='text-center border-top-5'>" +
						"<td>" + retorno.success[x].id + "</td>" +
						"<td> <img class='avatar avatar-sm' src='" + retorno.success[x].imagem_produto + "'></td>" +
						"<td class='white-space'>" + retorno.success[x].nome_produto + "</td>" +
						"<td>" + retorno.success[x].marca + "</td>" +
						"<td>" + retorno.success[x].valor_entrada_produto + "</td>" +
						"<td class='white-space'>" + retorno.success[x].quantidade_entrada_produto + "</td>" +
						$td +
						"<td class='white-space'>" +
						"<input type='hidden' name='id_entrada[]' form='form_entrada' value='" + retorno.success[x].id_entrada + "' class='form-control form-control-sm text-center'>" +
						"<input type='text' name='inventario[]' form='form_entrada' value='" + retorno.success[x].inventario + "' class='form-control form-control-sm text-center'>" +
						'</td>' +
						"</tr>");
				}

				$('#numero_entrada').html(retorno.entrada);
				$('#form_entrada').attr('action', "/entrada/atualizar/" + retorno.entrada);
				$('#fornecedor_nome').html(retorno.fornecedor.razao_cliente);
				$('#fornecedor_cidade').html(retorno.fornecedor.cidade_cliente);
				$('#fornecedor_estado').html(retorno.fornecedor.uf_cliente);
				// $('#fornecedor_celular').html(retorno.fornecedor.celular_cliente);
				// $('#fornecedor_telefone').html(retorno.fornecedor.telefone_cliente);

			},
			error: function(retorno) {
				alert(JSON.stringify(retorno));
			}
		})
	});
</script>

<script>
	function getPDF() {
		var element = document.getElementById('canvas_div_pdf');
		var opt = {
			margin: 0,
			filename: 'orçamento.pdf',
			image: {
				type: 'jpeg',
				quality: 0.98
			},
			html2canvas: {
				scale: 2,
				y: window.scrollY,
				logging: true
			},
			jsPDF: {
				unit: 'mm',
				format: 'a4',
				orientation: 'portrait'
			}
		};

		// New Promise-based usage:
		html2pdf().set(opt).from(element).save();
	};
</script>

<!--Botão chave-->
<script>
	$(document).on('click', '.btn-chave', function() {

		let valor = $(this).val();
		let chave = $(this).data('content');

		if (chave != null) {

			$("#area_transferencia").val(chave);
			$("#area_transferencia").select();

			document.execCommand('copy');

			$.notify({
					icon: 'fas fa-copy fa-2x',
					title: 'Chave Copiado',
					message: '' ,
				}, {
					element: 'body',
					type: 'info',
					z_index: 1080,
					delay: 1000,
					timer: 1000,
					animate: {
						enter: 'animated fadeInDown',
						exit: 'animated fadeOutUp'
					},
					template: '<div data-notify="container" class="col-xs-11 col-sm-3 alert alert-{0} px-2" role="alert">' +
						'<span class="icon icon-shape bg-white rounded-circle shadow text-dark alert-icon" data-notify="icon"></span> ' +
						'<div class="alert-text">' +
						'<span class="alert-title h3 font-weight-bold" data-notify="title">{1}</span><br>' +
						'<span class ="h4" data-notify="message">{2}</span>' +
						'</div>' +
						'<button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button>' +
						'</div>'
				});

		} else {
			$('.btn-enviar-chave').val(valor);
		}

	});

	$(document).on('click', '.btn-enviar-chave', function() {
		let CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

		let id = $(this).val();
		let chave = $("#chave_nfe").val();

		$.ajax({
			url: "{{route('entrada.chave_nfe')}}",
			method: 'post',
			dataType: 'json',
			data: {
				id: id,
				chave: chave,
				_token: CSRF_TOKEN
			},
			success: function() {
				$.notify({
					icon: 'fas fa-key fa-2x',
					title: 'Chave cadastrada',
					message: 'Referente a entrada: ' + id,
				}, {
					element: 'body',
					type: 'success',
					z_index: 1080,
					delay: 1000,
					timer: 3000,
					animate: {
						enter: 'animated fadeInDown',
						exit: 'animated fadeOutUp'
					},
					template: '<div data-notify="container" class="col-xs-11 col-sm-3 alert alert-{0} px-2" role="alert">' +
						'<span class="icon icon-shape bg-white rounded-circle shadow text-dark alert-icon" data-notify="icon"></span> ' +
						'<div class="alert-text">' +
						'<span class="alert-title h3 font-weight-bold" data-notify="title">{1}</span><br>' +
						'<span class ="h4" data-notify="message">{2}</span>' +
						'</div>' +
						'<button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button>' +
						'</div>'
				});

				$('#table_entrada_produtos').DataTable().ajax.reload(null, false);
				$('.modal').modal('hide');
			},
			error: function() {
				alert(JSON.stringify());
			}
		})
	});
</script>

<script>
	$(document).on('change', '#id_tipo_pagamento_fk', function() {
		pagamento = $(this).val();

		if (pagamento == 3 || pagamento == 5 || pagamento == 11) {
			$('#forma_parcelamento').find('option:eq(0)').text('1X');
		}
		else
		$('#forma_parcelamento').find('option:eq(0)').text('A Vista');
	})
</script>

@endpush