@extends('voyager::master')
@section('page_title', __('voyager::generic.view').' '.$dataType->display_name_singular)

@section('css')
    <style>
		.mb-0{margin-bottom:0px!important;}
		.mr-1{margin-right:3px!important;}
		#tab_inscritos a {text-decoration: none;}
		#modalEditarInscrito .row > [class*=col-] {margin-bottom: 2px;}
	</style>
@endsection		

@section('page_header')
    <h1 class="page-title">
        <i class="{{ $dataType->icon }}"></i> {{ __('voyager::generic.viewing') }} {{ ucfirst($dataType->display_name_singular) }} &nbsp;
        {{--
        @can('edit', $dataTypeContent)
            <a href="{{ route('voyager.'.$dataType->slug.'.edit', $dataTypeContent->getKey()) }}" class="btn btn-info">
                <span class="glyphicon glyphicon-pencil"></span>&nbsp;
                {{ __('voyager::generic.edit') }}
            </a>
        @endcan
        @can('delete', $dataTypeContent)
            @if($isSoftDeleted)
                <a href="{{ route('voyager.'.$dataType->slug.'.restore', $dataTypeContent->getKey()) }}" title="{{ __('voyager::generic.restore') }}" class="btn btn-default restore" data-id="{{ $dataTypeContent->getKey() }}" id="restore-{{ $dataTypeContent->getKey() }}">
                    <i class="voyager-trash"></i> <span class="hidden-xs hidden-sm">{{ __('voyager::generic.restore') }}</span>
                </a>
            @else
                <a href="javascript:;" title="{{ __('voyager::generic.delete') }}" class="btn btn-danger delete" data-id="{{ $dataTypeContent->getKey() }}" id="delete-{{ $dataTypeContent->getKey() }}">
                    <i class="voyager-trash"></i> <span class="hidden-xs hidden-sm">{{ __('voyager::generic.delete') }}</span>
                </a>
            @endif
        @endcan
        --}}
        <a href="{{ route('voyager.'.$dataType->slug.'.index') }}" class="btn btn-warning">
            <span class="glyphicon glyphicon-list"></span>&nbsp;
            {{ __('voyager::generic.return_to_list') }}
        </a>
    </h1>
    @include('voyager::multilingual.language-selector')
@stop
@section('content')
    <div class="page-content read container-fluid">
        <div class="row">
            <div class="col-md-12">
                @php
                 $evento = App\PaidEvent::find($dataTypeContent->getKey());
                @endphp
                <h4>Evento: <strong>{{$evento->titulo}}</strong></h4>
                <div class="panel">
                    <div class="panel-heading">
                        <h3 class="panel-title">Inscrições</h3>
                        <div class="panel-actions">
                        </div>
                    </div>
                    <div class="panel-body"> 




                        <div style="border: 0px solid #c7c7c7; padding:10px;">
							<div class="table-responsive">
                            <table class="table table-hover dataTable no-footer" id="tab_inscritos">
                                <thead>
                                    <th>#</th>
                                    <th>Número</th>
                                    <th>Nome</th>
                                    <th>Email</th>
                                    <th>Telefone</th>
                                    <th>Documento</th>
                                    <th>Sexo</th>
                                    <th>Nascimento</th>
                                    <th>Modalidade</th>
                                    <th>Ingresso</th>
                                    <th>Categoria</th>
                                    <th>Status</th>
                                    <th>Valor</th>

									@if ($evento->modalidades->count() > 0)
										@foreach ($evento->modalidades as $m )
											@if ($m->categorias->count() > 0)
												@foreach ($m->categorias as $c )
													@if ($c->formulario->extras->count() > 0)
														@foreach ($c->formulario->extras as $ex )
															<th>{{$ex->rotulo}}</th>
														@endforeach
													@endif
												@endforeach
											@endif
										@endforeach
									@endif



                                    <th>Ações</th>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


	<div class="modal fade modal-danger" id="modalExcluirInscrito">
		<div class="modal-dialog">
			<div class="modal-content">
				<form id="frmExcluirInscrito" action="/admin/evento/delete/inscrito" method="post">
				@csrf
				<input type="hidden" value="" name="id" id="exInscrito">		
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title"><i class="voyager-warning"></i>&nbsp;&nbsp;Excluir Inscrito</h4>
				</div>
				<div class="modal-body">
					<h4>Excluir este inscrito ?<span class="confirm_delete_name"></span></h4>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">{{ __('voyager::generic.cancel') }}</button>
					<button type="submit" class="btn btn-danger" >{{ __('voyager::generic.delete_confirm') }}
					</button>
				</div>
				</form>
			</div>
		</div>
	</div>

	<div class="modal fade modal-success" id="modalEditarInscrito">
		<div class="modal-dialog">
			<div class="modal-content">
				<form id="frmEditarInscrito" action="/admin/evento/editar/inscrito" method="post">
				@csrf
				<input type="hidden" value="" name="id" id="edInscrito">		
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title">Editar Inscrito</h4>
				</div>
				<div class="modal-body">
					
					<div class="row">
						<div class="col-lg-6 col-md-6">
							<div class="form-group">
								<label for="register-form-name">Tipo de Documento *</label>
								<select class="form-control" id="tipodoc" name="tipo" required="">
									<option value="">Selecione...</option>
									<option value="1">CPF</option>
									<option value="2">CNPJ</option>
									<option value="3">Estrangeiro (RNE)</option>
									<option value="4">Estrangeiro (passaporte)</option>
								</select>
							</div>
						</div>
						<div class="col-lg-6 col-md-6" id="div-doc">
							<div class="form-group">
								<label for="">Documento *</label>
								<input type="text" id="documento" name="documento" value="" class="form-control  required" >
								<div></div>						
							</div>	
						</div>	
					</div>
					<div class="row">
						<div class="col-lg-6 col-md-6">
							<div class="form-group">
								<label for="register-form-name">Nome Completo: * (Min. 8 caracteres)</label>
								<input type="text" id="nome" pattern=".{8,50}" name="nome" value="" class="form-control required " required="">
								<div></div>					
							</div>
						</div>
						<div class="col-md-2">
							<div class="form-group">
								<label for="register-form-phone">DDD: *</label>
								<input type="text" id="area" name="area" value="" maxlength="2" class="form-control" required="">
								<div></div>
							</div>					
						</div>					
						<div class="col-md-4">
							<div class="form-group">
								<label for="register-form-phone">Telefone: *</label>
								<input type="text" id="fone" name="fone" value="" class="form-control" required="">
								<div></div>
							</div>						
						</div>
					</div>
					<div class="row">
						<div class="col-lg-6 col-md-6">
							<div class="form-group">
								<label for="register-form-name">Sexo</label>
								<select class="form-control" name="sexo" id="sexo">
									<option value="M">Masculino</option>
									<option value="F">Feminino</option>
								</select>
							</div>
						</div>
						<div class="col-lg-6 col-md-6">
							<div class="form-group">
								<label for="">Nascimento *</label>
								<input type="date" id="nasc" onkeydown="return false" name="nasc" value="" class="form-control" required="">
								<div></div>						
							</div>					
						</div>					
					</div>				
					<div class="row">
						<div class="col-lg-12 col-md-12">
							<div class="form-group">
								<label for="">Email *</label>
								<input type="email" name="email" id="email" value="" class="form-control" required="">
								<div></div>	
							</div>
						</div>
						{{-- <div class="col-lg-6 col-md-6">
							<div class="form-group">
								<label for="">Confirmar Email *</label>
								<input type="email" name="email_confirmation" id="email_confirmation" value="" class="form-control" required="" onpaste="return false" ondrop="return false">
								<div></div>						
							</div>					
						</div>					 --}}
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">{{ __('voyager::generic.cancel') }}</button>
					<button type="submit" class="btn btn-success" >Confirmar</button>
				</div>
				</form>
			</div>
		</div>
	</div>
@stop

@section('javascript')
	<script src="{{setting('site.url_site')}}js/form.js"></script>	
    @if ($isModelTranslatable)
        <script>
            $(document).ready(function () {
                $('.side-body').multilingual();
            });
        </script>
        <script src="{{ voyager_asset('js/multilingual.js') }}"></script>
    @endif
    <script>

	$('#frmEditarInscrito').ajaxForm({
		dataType: "json",
		success: function(data){
			if(data.success ==  true){
				$('#modalEditarInscrito').modal('hide');
				var tab = $('#tab_inscritos').DataTable();
				tab.draw(false);
				toastr["success"]("Inscrito alterado com sucesso","Tudo certo!");
			} else {
				toastr["error"]("Inscrito não foi alterado","Falha na exclusão!");
			}
		},
		error: function(data) {
			toastr["error"]("Não foi possivel executar esta ação","Ops!");
		}
	});	

	const editaInscrito = (i) => {
		$.ajax({
			url: "/admin/inscrito/"+i,	
			headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
			type: "POST",
			dataType: "json",
			success: function(data){
				$('#tipodoc').val(data.tipo).change();
				$('#documento').val(data.documento);
				$('#nome').val(data.nome);
				$('#area').val(data.ddd);
				$('#fone').val(data.fone);
				$('#sexo').val(data.sexo).change();
				$('#nasc').val(data.nasc);
				$('#email').val(data.email);
				$('#edInscrito').val(data.id);
				$('#modalEditarInscrito').modal('show');
			},
			error: function(data) {
			}
		});
	}

	const deleteInscrito = (i) => {
		$('#exInscrito').val(i);
		$('#modalExcluirInscrito').modal('show');
	}

	$('#frmExcluirInscrito').ajaxForm({
		dataType: "json",
		success: function(data){
			if(data.success ==  true){
				$('#modalExcluirInscrito').modal('hide');
				var tab = $('#tab_inscritos').DataTable();
				tab.draw(false);
				toastr["success"]("Inscrito excluído com sucesso","Tudo certo!");
			} else {
				toastr["error"]("Inscrito não foi excluído","Falha na exclusão!");
			}
		},
		error: function(data) {
			toastr["error"]("Não foi possivel executar esta ação","Ops!");
		}
	});		

$(document).ready(function(){
            $("#tab_inscritos").dataTable({
				drawCallback: function () { 
					$('[data-toggle="tooltip"]').tooltip();
				},
				processing: true,
				serverSide:true,
				ajax:{
					url:"/admin/inscritos/carrega/tabela/{{$dataTypeContent->getKey()}}"
                },
				//dom: 'Bfrtip',
				"language": {
					"lengthMenu": "Mostrando _MENU_ registros",
					"zeroRecords": "Nada encontrado",
					"info":"Mostrando _START_ de _END_ ",
					"infoEmpty": "Nenhum registro ainda",
					"infoFiltered": "(Filtrado de um total de _MAX_ registros)",
					"sSearch":"Pesquisar",
					  "oPaginate": {
						"sFirst": "Primeiro",
						"sPrevious": "Anterior",
						"sNext": "Próximo",
						"sLast": "Último"
					  },					
				},			
			   buttons: [                    
					{ extend: 'pdfHtml5', className: 'btn btn-outline-success', exportOptions: {
						columns: ':visible'
					}  },
					{ extend: 'excelHtml5', 
						className: 'btn btn-outline-success', 
						exportOptions: {
							columns: ':visible',
							format:{
							  body: function(data, row, column, node) {
								  data = $('<p>' + data + '</p>').text();
								  return $.isNumeric(data.replace(',', '.')) ? data.replace(',', '.') : data;
							  }
							}
						}
					},
					{ extend: 'csvHtml5', className: 'btn btn-outline-success', exportOptions: {
						columns: ':visible'
					}  },
                    
					{extend: 'colvis', className: 'btn btn-outline-success', text: 'Colunas'},
					
				],
				columns:[
					{data:'id'},
					{data:'numero'},
					{data:'nome'},
					{data:'email'},
					{data:'fone'},
					{data:'documento'},
					{data:'sexo'},
					{data:'nasc'},
					{data:'modalidade'},
					{data:'lote'},
					{data:'categoria'},
					{data:'status'},
					{data:'valor'},
                    {                   
                        targets: 11,
                        orderable: false,
                        render: function(data, type, full, meta) {
                            return '<a href="javascript:;" onclick="deleteInscrito('+full.id+');" title="Remover" class="pull-right link"><i class="voyager-trash"></i><span class="hidden-xs hidden-sm"></span></a><a href="javascript:;" onclick="editaInscrito('+full.id+');" title="Editar" class="pull-right mr-1"><i class="voyager-pen"></i><span class="hidden-xs hidden-sm"></span></a>';
                        },
				    },
				],
				columnDefs: [

				],
                deferRender: true,
				"lengthMenu": [
					[5, 10, 15, 20, 50, 100, -1],
					[5, 10, 15, 20, 50, 100, "Tudo"] // change per page values here
				],		
				"order": [
					[0, 'desc']
				],				
				"pageLength": 10,
				"dom": "<'row' <'col-md-12'B>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",
            });  			
			
		});

    </script>
@stop