@extends('layouts.app')
<link rel="stylesheet" href="{{ asset('css/preloader.css')}}">
<link rel="stylesheet" href="{{ asset('argon') }}/vendor/animate.css/animate.min.css">
<div id="preloaders" class="preloader"></div>
@section('title', 'Transferência de estoque')
@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  mb-2 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 Transferências') }}</h3>
						</div>
						<div class="col-4 text-right">
							<a href="{{ route('transferencia_reman.transferencia') }}" class="btn btn-sm btn-primary">{{ __('Adicionar uma transferencia') }}</a>
						</div>
					</div>
				</div>
				<div class="card-body">
					<div class="table-responsive">
						<table class="table align-items-center table-dark table-sm" id="table_transferencia">
							<thead class="thead-dark">
								<tr class="text-center">
									<th>ID</th>
									<th>Entre</th>
									<th>NF-e</th>
									<th>Origem/Destino</th>
									<th>Status</th>
									<th>Enviado</th>
									<th>Recebido</th>
									<th>Ação</th>
								</tr>
							</thead>
							<tbody>
								@foreach ($transferencias->where('tipo_transferencia','!=', 'Loja')->sortByDesc('id_transferencia') as $transferencia)
								<tr class="text-center">
									<td>{{ $transferencia->id_transferencia }}</td>
									<td>{{ $transferencia->tipo_transferencia }}</td>
									<td>
										@if($transferencia->tipo_transferencia == 'Deposito' || $transferencia->tipo_transferencia == 'Garantia')
										-
										@elseif($transferencia->chave_nfe == null and $transferencia->tipo_transferencia == 'Loja')

										<button type="button" class="btn btn-success chamar_pedido" data-toggle="modal" data-target="#modal_imprimir_nfe" data-id-pedido="{{$transferencia->id_transferencia}}">
											Gerar NF-e
										</button>

										@elseif($transferencia->chave_nfe == null and $transferencia->tipo_transferencia == 'Repasse')

										<button type="button" class="btn btn-success chamar_pedido_repasse" data-id-pedido="{{$transferencia->id_transferencia}}">
											Gerar NF-e
										</button>

										@else

										<button type="button" class="btn btn-success" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$transferencia->chave_nfe}}" @if($transferencia->tipo_transferencia == 'Deposito') disabled @else @endif>
											<i class="fas fa-key"></i>
										</button>

										<button type="button" class="btn  btn-success" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$transferencia->numero_nfe}}" @if($transferencia->tipo_transferencia == 'Deposito') disabled @else @endif>
											<i class="fab fa-creative-commons-zero"></i>
										</button>

										@endif
									</td>
									<td>
										<button type="button" class="btn btn-md btn-info" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$transferencia->empresa_origem}}">
											<i class="fas fa-store"></i>
										</button>

										<i class="fas fa-arrow-right mx-1"></i>

										<button type="button" class="btn btn-info" data-container="body" data-toggle="popover" data-placement="bottom" data-html="true" data-content="{{$transferencia->empresa_destino}}">
											<i class="fas fa-store"></i>
										</button>

									</td>
									<td>
										@if($transferencia->status_transferencia == 'Enviado')
										<i class="fas fa-shipping-fast text-warning"></i>
										@else
										<i class="fas fa-dolly-flatbed text-success"></i>
										@endif

										<br><small>{{$transferencia->status_transferencia}}</small>
									</td>
									<td>{{$transferencia->user_origem}}</td>
									<td>{{$transferencia->user_destino}}</td>
									@if(auth()->user()->id_endereco_fk == $transferencia->destino_transferencia || auth()->user()->id == 1)
									<td>

										<button type="button" value='{{$transferencia->id_transferencia}}' data-toggle='modal' data-target='#ModalentradaProdutos' class="btn btn-info btn-entrada">Inventário</button>
									</td>

									@else
									<td>-</td>
									@endif

								</tr>
								@endforeach
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- Modal -->
<style>
	.modal-full {
		min-width: 90%;
		margin: auto;
		padding: 0;
	}

	.modal-full .modal-content {
		min-height: auto;
		margin: auto;
		padding: 0;
	}

	.modal-body .form-group {
		margin-bottom: 10px;
	}
</style>

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

@endsection

@push('js')
<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 src="{{ asset('argon') }}/vendor/bootstrap-notify/bootstrap-notify.min.js"></script>
<script src="{{asset('js')}}/repasse_reman.js"></script>

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

<script>
	$(document).ready(function() {
		$('#table_transferencia_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_transferencia').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() {

		let valor = $(this).val();
		let CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

		$('#form_entrada .btn-success').attr('value', valor);
		$('#entrada_produtos').children().remove();

		$.ajax({
			url: "/transferencia_reman/data_transferencia/" + valor,
			method: 'post',
			dataType: 'json',
			data: {
				_token: CSRF_TOKEN,
				id: valor
			},
			timeout: 5000,
			success: function(retorno) {
				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>";
						$('#form_entrada .btn-success').prop('disabled', '');
						$('#form_entrada .btn-success').removeClass('d-none');
					} else {
						$td = "<td class='white-space'>" + retorno.success[x].estoque_transferencia_produto + "</td>";
						$('#form_entrada .btn-success').prop('disabled', 'disabled');
						$('#form_entrada .btn-success').addClass('d-none');
					}

					$('#entrada_produtos').append("<tr class='text-center border-top-5'>" +
						"<td>" + retorno.success[x].id_produto + "</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>-</td>" +
						"<td>-</td>" +
						"<td class='white-space'>" + retorno.success[x].quantidade_transferencia_produto + "</td>" +
						$td +
						"<td class='white-space'>" +
						"<input type='hidden' name='id_entrada[]' form='form_entrada' value='" + retorno.success[x].id_transferencia + "' 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>");
				}
			},
			error: function() {

				alert('Dados não enviados');
			}
		})

	});
</script>

<script>
	$(document).on('submit', '#form_entrada', function(e) {
		e.preventDefault();
		let valor = $('#form_entrada .btn-success').val();
		console.log(valor);
		let CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
		$.ajax({
			url: "/transferencia_reman/transferencia_update/" + valor,
			method: 'post',
			dataType: 'json',
			data: $('#form_entrada').serialize(),
			timeout: 5000,
			success: function(retorno) {
				if (retorno.error) {
					$.notify({
						icon: 'fas fa-times-circle fa-2x',
						title: 'Transferência Inválida',
						message: retorno.error,
					}, {
						element: 'body',
						type: 'danger',
						z_index: 1080,
						delay: 1000,
						timer: 1000,
						animate: {
							enter: 'animated fadeInDown',
							exit: 'animated fadeOutUp'
						},
						template: '<div data-notify="container" class="alert alert-dismissible alert-{0} alert-notify" role="alert">' +
							'<span class="alert-icon" data-notify="icon"></span> ' +
							'<div class="alert-text"</div> ' +
							'<span class="alert-title" data-notify="title">{1}</span> ' +
							'<span class="h3 font-weight-bold" data-notify="message">{2}</span>' +
							'</div>' +
							'<button type="button" class="close" data-notify="dismiss" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
							'</div>'
					});

				} else {


					$.notify({
						icon: 'fas fa-edit fa-2x',
						title: 'Transferência Recebida',
						message: 'Operação confirmada',
					}, {
						element: 'body',
						type: 'success',
						z_index: 1080,
						delay: 1000,
						timer: 1000,
						animate: {
							enter: 'animated fadeInDown',
							exit: 'animated fadeOutUp'
						},
						template: '<div data-notify="container" class="alert alert-dismissible alert-{0} alert-notify" role="alert">' +
							'<span class="alert-icon" data-notify="icon"></span> ' +
							'<div class="alert-text"</div> ' +
							'<span class="alert-title" data-notify="title">{1}</span> ' +
							'<span class="h3 font-weight-bold" data-notify="message">{2}</span>' +
							'</div>' +
							'<button type="button" class="close" data-notify="dismiss" aria-label="Close"><span aria-hidden="true">&times;</span></button>' +
							'</div>'
					});
				}
			},
			error: function(retorno) {
				alert(JSON.stringify(retorno));
			}
		})
		$('#form_entrada .btn-success').prop('disabled', 'disabled');
		$('#form_entrada .btn-success').addClass('d-none');

	});
</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>

@endpush