@extends('layouts.app')
<link rel="stylesheet" href="{{ asset('css/preloader.css')}}">

<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">
	<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_reman.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 align-items-center table-dark" id="table_entrada">
							<thead class="thead-dark">
								<tr class="text-center">
									<th>ID</th>
									<th>Fornecedor</th>
									<th>NF-e</th>
									<th>Pagamento</th>
									<th>Total</th>
									<th>Ação</th>
								</tr>
							</thead>
							<tbody>
								@foreach ($entradas as $entrada)
								<tr class="text-center">
									<td>{{ $entrada->id_entrada }}</td>
									<td>{{ $entrada->razao_cliente }}</td>
									<td> <button type="button" class="btn btn-success" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$entrada->chave_nfe}}">
											Chave
										</button>
										<button type="button" class="btn btn-success" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$entrada->numero_nfe}}">
											Nº
										</button>
									</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>
										@else
										@endif
									</td>
									<td>R$ {{ number_format($entrada->total_entrada,2,',','.') }}</td>
									<td><button type="button" value='{{$entrada->id_entrada}}' data-toggle='modal' data-target='#ModalEntradaProdutos' class="btn btn-info btn-entrada">Produtos</button></td>
								</tr>
								@endforeach
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
@include('php.modal-entrada-produtos')
@include('layouts.footers.auth')

@endsection

@push('js')
<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>
	//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"
				}
			},
			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'
				}
			],
			stateSave: true
		});

		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'
				}
			],
			stateSave: true
		});

	});
</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_reman/data_entrada/" + valor,
			method: 'get',
			dataType: 'json',
			data: {
				_token: CSRF_TOKEN,
				id: valor
			},
			timeout: 5000,
			success: function(retorno) {

				for (let x = 0; x < retorno.success.length; x++) {
					$('#entrada_produtos').append("<tr class='text-center border-top-5'><td><img class='avatar' src='" +
						retorno.success[x].imagem_produto + "'></td><td>" +
						retorno.success[x].nome_produto + "</td><td>" +
						retorno.success[x].valor_entrada_produto + "</td><td style=' white-space: pre-wrap;'>" +
						retorno.success[x].quantidade_entrada_produto + "</td></tr>");
				}
			},
			error: function() {
				alert('Dados não enviados');
			}
		})
	});
</script>

@endpush