@extends('admin.layouts.main')

@section('content')

<style>
	div.dataTables_filter {
		text-align: end !important;
	}
	div.dataTables_filter input{
		font-weight: normal !important;
	}
</style>

<div class="normalheader transition animated fadeIn">
    <div class="hpanel">
        <div class="panel-body">
            <a class="small-header-action" href="">
                <div class="clip-header">
                    <i class="fa fa-arrow-up"></i>
                </div>
            </a>
            <div id="hbreadcrumb" class="pull-right m-t-lg">
                <ol class="hbreadcrumb breadcrumb">
                    <li><a href="{{ route('admin/dashboard') }}">Dashboard</a></li>
                    <li class="active">
                        <span>Salas</span>
                    </li>
                </ol>
            </div>
            <h2 class="font-light m-b-xs">
				<i class="fa fa-wrench"></i>
                Salas
            </h2>
            <small>Salas de demostración por concesionario</small>
        </div>
    </div>
</div>

<div class="content animate-panel">

	<div class="row">
		<div class="col-md-12">
			<div class="hpanel">
				<div class="panel-body">
          <div class="col-md-6">
            <a href="{{ url('admin/salas/create') }}" class="btn btn-success">
              <i class="fa fa-plus-circle"></i>
              Agregar sala
            </a>
          </div>
          <div class="col-sm-6 pull-right">
            <form id="salas_concesionario" class="form-inline pull-right">
              <div class="form-group">
                <meta name="csrf-token" content="{{ csrf_token() }}" />
                <select id="id_concesionario" name="id_concesionario" class="form-control">
                  <option value="0">Todos los concesionarios</option>
                  @foreach($concesionarios as $concesionario)
                  <option value="{{$concesionario->id}}">{{$concesionario->nombre}}</option>
                  @endforeach
                </select>
              </div>
              <button id="buscar_salas" class="btn btn-default">Buscar</button>
            </form>
          </div>
				</div>
			</div>
		</div>
	</div>

	<div class="row">

		<div class="col-sm-12">

			<div class="hpanel hgreen">

				<div class="panel-heading hbuilt">
					<h2>Horarios de Salas por Concesionario</h2>
				</div>

				<div class="panel-body">

					<div class="row m-b-xl">
						<div id="tabla_salas" class="col-sm-12">
							<div id="msg_table" class="alert alert-warning col-sm-12" style="display: none;">
								Este concesionario no tiene salas.
							</div>
							<table id="salasTable" class="table table-condensed">
								<thead>
									<tr>
										<th>Concesionario</th>
										<th>Nombre de sala</th>
										<th>Horario</th>
										<th>Acciones</th>
									</tr>
								</thead>
								<tbody>
									@foreach($concesionarios as $concesionario)
										@foreach($concesionario->salas as $sala)
										<tr>
											<td>{{ $concesionario->nombre }}</td>
											<td>{{ $sala->nombre }}</td>
											<td>{{ date('H:i', strtotime($sala->hora_ini)) }} - {{ date('H:i', strtotime($sala->hora_fin)) }}</td>
											<td class="text right">
												<a href="{{ url('admin/salas/edit/'.$sala->id) }}" class="btn btn-warning btn-sm"
													title="Editar {{$sala->nombre}}">
													<i class="fa fa-edit"></i>
												</a>
												<a href="{{ url('admin/salas/delete/'.$sala->id) }}"
													class="btn btn-danger btn-sm"
													title="Eliminar {{$sala->nombre}}"
													data-confirm="¿Est&aacute; seguro que desea eliminar esta sala?">
													<i class="fa fa-trash-o"></i>
												</a>
											</td>
										</tr>
										@endforeach
									@endforeach
								</tbody>
							</table>
						</div>
					</div>

				</div>

			</div>

		</div>

	</div>

</div>
@endsection

@section('css')
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap.min.css"/>
@endsection

@section('scripts')
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap.min.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		$('#salasTable').DataTable({
			paging: true,
			ordering: false,
			lengthMenu: [[30, 50, -1], [30, 50, "Todos"]],
			language: {
				lengthMenu: "Mostrar _MENU_ registros",
				zeroRecords: "No se encontraron resultados",
				info: "Mostrando _START_ a _END_ de _TOTAL_ resultados",
				infoEmpty: "No hay resultados",
				infoFiltered: "(Filtrado de _MAX_ registros totales)",
				search: "Buscar: ",
				paginate: {
					first: "Primera",
					last: "Ultima",
					next: "Siguiente",
					previous: "Anterior"
				},
        	}
		});
	});
</script>

<script type="text/javascript">
	$(document).ready(function() {

		$("#salas_concesionario").submit(function(e){
			e.preventDefault();
		});

		$("#buscar_salas").click(function(){
			var concesionario = $("#id_concesionario").val();
			var token = $('meta[name="csrf-token"]').attr('content');
			var route = "/admin/salas/salas_concesionario";
			console.log('token', token);

			$.ajax({
				type: "POST",
				url: route,
				data: {
					_token: token,
					id_concesionario: concesionario
				},
				success: function(data){
					updateTablaSalas(data);
				}
			}).done(function(){
				console.log("yay!");
			})


		});

	});

	function updateTablaSalas(data){
		var test = data;

		if(data.salas.length > 0){
			$("tr:has(td)").remove();
			$("#msg_table").hide();
			$.each(data.salas, function(key, value){

				$("#salasTable").append(
					"<tr>" +
						"<td>" + value.concesionario.nombre + "</td>" +
						"<td>" + value.nombre + "</td>" +
						"<td>" + value.hora_ini + "-" + value.hora_fin + "</td>" +
						"<td class=\"text right\">" +
							"<a href=\"{{ url('admin/salas/edit') }}/"+value.id+" \" class=\"btn btn-default btn-sm\">" +
								"<i class=\"fa fa-edit\"></i>" +
							"</a>" +
							"<a href=\"{{ url('admin/salas/delete') }}/"+value.id+" \" class=\"btn btn-default btn-sm\" data-confirm=\"¿Est&aacute; seguro que desea eliminar esta sala?\">" +
								"<i class=\"fa fa-trash-o\"></i>" +
							"</a>" +
						"</td>" +
					"</tr>"
				);

			});

		}else{
			$("tr:has(td)").remove();
			$("#msg_table").show();
		}

	}

</script>
@endsection