@extends('layouts.baseprolist')

@section('content')


@include('sucursalcalendario.top')

<div class="main-card mb-3 card">

	<div class="card-header d-flex justify-content-between align-items-center">
		<h3 class="mr-3">Listado de Turnos</h3>

		<span data-toggle="collapse" href="#filtro" class="ml-auto">
			<button data-delay='{ "show": 200, "hide": 100 }' data-toggle="tooltip" title="Filtros" type="button" class="btn-shadow btn btn-secondary mr-2">
				<i class="fa fa-filter"></i>
			</button>
		</span>

		<span data-toggle="collapse" href="#exportador">
			<button data-delay='{ "show": 200, "hide": 100 }' data-toggle="tooltip" title="Descargar información" type="button" class="btn-shadow btn btn-secondary">
				<i class="fa fa-download"></i>
			</button>
		</span>
	</div>



	<div class="collapse border mb-5 pl-3 pr-3 pb-3" id="filtro">
		{!!Form::open(['url'=>'filtrarTurnos', 'method'=>'POST'])!!}
		<div class="form-row mt-3">

			<div class="form-group col-lg-4">
				<div class="form-group">
					<label>Ingrese texto </label>
					{!!Form::text('texto',null, ['class'=>'form-control','placeholder'=>'Ingrese el texto de su búsqueda '])!!}
				</div>
			</div>

			<div class="form-group col-lg-4">
				<label>Vendedor</label>
				<select name="vendedor_id" id="vendedor_id" class="form-control" placeholder='Seleccione una opción'>
					<option value=""> Ninguno </option>
					@foreach ($usuarios as $usuario)
					<option value="{{ $usuario->id }}" {{ ((isset($vendedor_id) && $vendedor_id == $usuario->id)?'selected':'') }}>{{ $usuario->name }}</option>
					@endforeach
				</select>
			</div>

			<div class="form-group col-lg-4">
				<label>Estados</label>
				<select name="status" id="status" class="form-control" placeholder='Seleccione una opción'>
					<option value=""> Todas</option>
					<option value="ingresado" {{ ((isset($status) && $status == 'ingresado')?'selected':'') }}> Ingresadas</option>
					<option value="cancelado" {{ ((isset($status) && $status == 'cancelado')?'selected':'') }}> Canceladas</option>
					<option value="pendiente" {{ ((isset($status) && $status == 'pendiente')?'selected':'') }}> Pendientes</option>
				</select>
			</div>





			<div class="form-group col-lg-4">
				<label>Notificados</label>

				<select name="notificado" id="notificado" class="form-control" placeholder='Seleccione una opción'>
					<option value="0"> No Notificados</option>
					<option value="1" {{ ((isset($notificado) && $notificado == '1')?'selected':'') }}> Notificados</option>
					<option value="0,1" {{ ((isset($notificado) && $notificado == '0,1')?'selected':'') }}> Todos</option>
				</select>
			</div>

			<div class="form-group col-lg-4">
				<label>Reprogramados</label>

				<select name="reprogramado" id="reprogramado" class="form-control" placeholder='Seleccione una opción'>
					<option value="0"> No Reprogramados</option>
					<option value="1" {{ ((isset($reprogramado) && $reprogramado == '1')?'selected':'') }}> Reprogramados</option>
					<option value="0,1" {{ ((isset($reprogramado) && $reprogramado == '0,1')?'selected':'') }}> Todos</option>
				</select>
			</div>

			<div class="form-group col-lg-4">
				<label>Informados</label>

				<select name="informado" id="informado" class="form-control" placeholder='Seleccione una opción'>
					<option value="0"> No Informados</option>
					<option value="1" {{ ((isset($informado) && $informado == '1')?'selected':'') }}> Informados</option>
					<option value="0,1" {{ ((isset($informado) && $informado == '0,1')?'selected':'') }}> Todos</option>
				</select>
			</div>


			<div class="form-group  col-lg-4 col-md-4">
				<label>Fecha</label>
				<div class="input-group">
					<div class="input-group-prepend datepicker-trigger">
						<div class="input-group-text">
							<i class="fa fa-calendar-alt"></i>
						</div>
					</div>

					{!! Form::text('fecha',null,['class'=>'form-control', 'data-toggle'=>"datepicker", 'id'=>'fecha', 'autocomplete'=>'off']) !!}
				</div>
			</div>
			<div class="form-group  col-lg-4 col-md-4">
				<label>Fecha desde</label>
				<div class="input-group">
					<div class="input-group-prepend datepicker-trigger">
						<div class="input-group-text">
							<i class="fa fa-calendar-alt"></i>
						</div>
					</div>

					{!! Form::text('fecha_desde',null,['class'=>'form-control', 'data-toggle'=>"datepicker", 'id'=>'fecha_desde', 'autocomplete'=>'off']) !!}
				</div>
			</div>
			<div class="form-group col-lg-4 col-md-4">
				<label>Fecha hasta</label>
				<div class="input-group">
					<div class="input-group-prepend datepicker-trigger">
						<div class="input-group-text">
							<i class="fa fa-calendar-alt"></i>
						</div>
					</div>

					{!! Form::text('fecha_hasta',null,['class'=>'form-control', 'data-toggle'=>"datepicker", 'id'=>'fecha_hasta', 'autocomplete'=>'off']) !!}
				</div>
			</div>



			<div class='form-group col-12 col-md-2 offset-md-8'>
				<button type="submit" class="btn btn-gradient-primary btn-shadow-primary btn-block btn-pill pull-right" name="boton" value="filtrar">Filtrar</button>
			</div>
			<div class='form-group col-12 col-md-2'>
				<button type="submit" class="btn btn-gradient-success btn-shadow-success btn-block btn-pill pull-right" name="boton" value="csv">Filtrar y Exportar</button>
			</div>

		</div>

		{!!Form::close()!!}
	</div>

	<div class="card-body">

		<div class="collapse border mb-5" id="exportador">
			<div class="form-group text-center">
				<a href="exports/listado_turnos{{ Session::get('idUser') }}.csv" class="btn btn-success  btn-pill mt-3">Descargar </a>
			</div>
		</div>

		<div class="row justify-content-end">
			<div class="col-md-auto">
				<div class="form-group row">
					<label for="customSearch" class="text-md-right col-sm-12 col-md-4 col-form-label" style="padding-right: 0;">Buscar</label>
					<div class="col-sm-12 col-md-8">
						<input type="text" class="form-control" id="customSearch">
					</div>
				</div>
			</div>

		</div>
<div class="table-responsive">
<table  id="table_turnos" class="table table-hover table-striped table-bordered table-sm ">
				<thead>
					<tr>
						<th><span class="small font-weight-bold">#</span></th>
						<th><span class="small font-weight-bold">Sucursal</span></th>
						<th><span class="small font-weight-bold">Fecha</span></th>
						<th><span class="small font-weight-bold">Hora</span></th>
						<th><span class="small font-weight-bold">Derivaciones</span></th>
						<th><span class="small font-weight-bold">Cliente</span></th>
						<th><span class="small font-weight-bold">Teléfono</span></th>
						<th><span class="small font-weight-bold">Equipo</span></th>
						<th><span class="small font-weight-bold">Grupo equipo</span></th>
						<th><span class="small font-weight-bold">Vendedor</span></th>
						<th><span class="small font-weight-bold">Notif</span></th>
						<th><span class="small font-weight-bold">Reprogr</span></th>
						<th><span class="small font-weight-bold">Status</span></th>
					</tr>
				</thead>
				<tbody class="small">
					@foreach($sucursalesCalendarios as $sucursalCalendario)
					<tr>

						<td>{{$sucursalCalendario->id}}</td>
						<td>
							@if($sucursalCalendario->derivacion)
							@if($sucursalCalendario->derivacion->sucursal)
							{{$sucursalCalendario->derivacion->sucursal->nombre}}
							@endif
							@endif
						</td>

						<td>
							@if($sucursalCalendario->derivacion)
							<span class="text-nowrap">{{ (!empty($sucursalCalendario->derivacion->dia_preferencia)) ?  date('d/m/Y', strtotime($sucursalCalendario->derivacion->dia_preferencia)) : "-"}}</span>
							@endif

						</td>
						<td>
							@if($sucursalCalendario->derivacion)
							@if(isset($sucursalCalendario->derivacion->hora_preferencia) && $sucursalCalendario->derivacion->hora_preferencia && $sucursalCalendario->derivacion->hora_preferencia != '')
							{{ $horas[intval($sucursalCalendario->derivacion->hora_preferencia)] }}
							@endif
							@else
							-
							@endif
						</td>
						<td class="text-left linked">
							<div class="btn-block">{!!link_to('derivacion/'.$sucursalCalendario->derivacion_id.'/edit/', $title = $sucursalCalendario->derivacion_id, $attributes=null, $secure= null) !!}</div>
						</td>
						<td>
							@if($sucursalCalendario->derivacion && $sucursalCalendario->derivacion->cliente_derivacion)
							{{$sucursalCalendario->derivacion->cliente_derivacion->nombre}}
							@endif
						</td>
						<td>
							@if($sucursalCalendario->derivacion && $sucursalCalendario->derivacion->cliente_derivacion)
							{{$sucursalCalendario->derivacion->cliente_derivacion->telefono}}
							@endif
						</td>
						<td class="linked">{!! $sucursalCalendario->equipo !!}</td>
						<td>
							@if($sucursalCalendario->derivacion && $sucursalCalendario->derivacion->grupo_equipos)
							{!! $sucursalCalendario->derivacion->grupo_equipos->nombre !!}
							@endif</td>
						<td>
							@if($sucursalCalendario->usuario)
							{{$sucursalCalendario->usuario->name}}
							@endif
						</td>
						<td>
							@if($sucursalCalendario->turno_vencido_notificado)
							SI
							@endif
						</td>
						<td>
							@if($sucursalCalendario->turno_reprogramado)
							SI
							@endif
						</td>
						<td>
							@if($sucursalCalendario->status)
							{{$sucursalCalendario->status}}
							@if($sucursalCalendario->turno_ingresado_cliente)
							<br> -por Cliente
							@endif

							@if($sucursalCalendario->status == 'cancelado' && $sucursalCalendario->motivoCancelacionTurno)
							<br> {{$sucursalCalendario->motivoCancelacionTurno->nombre}}
							@endif

							@else
							<div>

								{!!Form::open(['route'=>['SucursalCalendario.ingresar', $sucursalCalendario->id], 'method'=>'POST', 'style'=>'display:inline;']) !!}
								<button data-placement="left" data-toggle="tooltip" title="Ingresar equipo" type="button" class="confirm-trigger-ingresar mb-2 mr-2 btn btn-sm btn-gradient-success btn-hover-success" style="font-size: 1em;">
									Ingresar
								</button>
								{!!Form::close()!!}

								{!!Form::open(['route'=>['SucursalCalendario.cancelar', $sucursalCalendario->id], 'method'=>'POST', 'style'=>'display:inline;']) !!}
								<button data-placement="left" data-toggle="tooltip" title="Cancelar derivación" type="button" class="confirm-trigger-cancelar mb-2 mr-2  btn btn-sm btn-gradient-danger btn-hover-danger" style="font-size: 1em;">
									Cancelar
								</button>
								{!!Form::close()!!}
							</div>

							@endif
						</td>
					</tr>
					@endforeach
				</tbody>
				<tfoot>
					<tr>
						<th><span class="small font-weight-bold">#</span></th>
						<th><span class="small font-weight-bold">Sucursal</span></th>
						<th><span class="small font-weight-bold">Fecha</span></th>
						<th><span class="small font-weight-bold">Hora</span></th>
						<th><span class="small font-weight-bold">Derivaciones</span></th>
						<th><span class="small font-weight-bold">Cliente</span></th>
						<th><span class="small font-weight-bold">Teléfono</span></th>
						<th><span class="small font-weight-bold">Equipo</span></th>
						<th><span class="small font-weight-bold">Grupo equipo</span></th>
						<th><span class="small font-weight-bold">Vendedor</span></th>
						<th><span class="small font-weight-bold">Notif</span></th>
						<th><span class="small font-weight-bold">Reprogr</span></th>
						<th><span class="small font-weight-bold">Status</span></th>
					</tr>
				</tfoot>
			</table>

		<!---- PAGINATE -->

</div>

	
		@if( Request::path() =='turnos' )
		@include('pagination.default-limit-links', ['paginator' => $sucursalesCalendarios, 'filters' => '','custom_link_limit' => 7])
		@else
		@include('pagination.default-limit-links', ['paginator' => $sucursalesCalendarios, 'filters' => '&texto='. $texto.'&status='. $status.'&vendedor_id='. $vendedor_id.'&notificado='. $notificado.'&reprogramado='. $reprogramado.'&fecha='. $fecha.'&fecha_desde='. $fecha_desde.'&fecha_hasta='. $fecha_hasta ,'custom_link_limit' => 7])
		@endif

	</div>
</div>
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="confirmModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-sm modal-dialog-centered my-custom-modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title" id="confirmModalLabel">Confirmación</h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body" id="messageconfirm">
				¿Estás seguro de enviar el formulario?
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
				<button type="button" class="btn btn-primary" id="confirmButton" style="width: 4em;">Si</button>
			</div>
		</div>
	</div>
</div>



@endsection
@section('css')
<style>


	.my-custom-modal-dialog {
		box-shadow: none;
		/* O ajusta según tus necesidades */
	}

	#table_turnos_filter {
		display: none;
	}

	
</style>
@endsection

@section('scripts')

<script>
	document.addEventListener("DOMContentLoaded", function(event) {

		$('[data-toggle="tooltip"]').tooltip({
			trigger: 'hover'
		})
		

	
		var formToSubmit;

		$('#confirmModal').on('hide.bs.modal', function(e) {
			formToSubmit = undefined;
		});

		$('#confirmButton').click(function() {
			if (formToSubmit) {
				formToSubmit.submit();
			}
		});

		$('.confirm-trigger-ingresar').click(function() {
			formToSubmit = $(this).closest('form');

			if (formToSubmit) {
				$('#messageconfirm').empty();
				$('#messageconfirm').text('¿Seguro que desea dar ingreso?');
				$('#confirmModal').modal('show');
			}
		});

		$('.confirm-trigger-cancelar').click(function() {
			formToSubmit = $(this).closest('form');

			if (formToSubmit) {
				$('#messageconfirm').empty();
				$('#messageconfirm').text('¿Seguro que desea cancelar?');
				$('#confirmModal').modal('show');
			}
		});

		$('#table_turnos').DataTable({
			"autoWidth": false,
			paging: false,
			responsive: false,
			language: {
				"url": "/js/Spanish.json"
			},
			dom: '<"custom-search"f><"table-container"t>'

		});


		$('#customSearch').on('keyup', function() {
			$('#table_turnos').DataTable().search($(this).val()).draw();
		});

	});
</script>

@endsection