{% extends "layout.html" %}
{% block title %}Documentos recibidos
{% endblock %}

{% set nav_active = 'recibidos' %}
{% block content %}
<div class="box">
	<div class="box-header with-border">
		<h3 class="box-title">Documentos recibidos</h3>
		<div class="box-tools pull-right">
			<button class="btn btn-box-tool" data-widget="collapse">
				<i class="fa fa-minus"></i>
			</button>

			<button class="btn btn-box-tool" data-widget="remove">
				<i class="fa fa-times"></i>
			</button>
		</div>
	</div>
	<div class="box-body">
		<div class="row">
			<div class="col-md-12">
				<div class="row">
					<div class="col-md-6">
						<form class="form-inline form-reporte" action="admin.php" method="get">
							<div class="form-group mr-3">
								<label for="fecha_de">De</label>
								<input type="date" class="form-control ml-1" id="fecha_de" name="fecha_de"
									value="{{fecha_de}}">
							</div>
							<div class="form-group">
								<label for="fecha_asta">Hasta</label>
								<input type="date" class="form-control ml-1" id="fecha_asta" name="fecha_asta"
									value="{{fecha_asta}}">
							</div>
							<button type="submit" class="btn btn-verdedark ml-3">Buscar</button>
						</form>
					</div>
					<div class="col-md-6">
						<form class="form-inline" style="float: right;">
							<div class="form-group">
								<input class="form-control light-table-filter" data-table="order-table" type="text" placeholder="Buscar..">
							</div>
						</form>
					</div>
				</div>

				<div class="table-responsive" style="margin-top:20px;">
					<table class="table table-condensed table-bordered table-striped order-table" style="font-size: 11px;">
						<thead class="text-center">
							<tr style="text-transform: uppercase;">
								<th scope="col" class="text-center">Items</th>
								<th class="text-center">Empresa</th>
								<th class="text-center">Responsable</th>
								<th class="text-center;">Telefono</th>
								<th class="text-center;">Correo</th>
								<th class="text-center">Asunto</th>
								<th class="text-center">Folio</th>
								<th class="text-center">Fecha</th>
								<th class="text-center">Archivos</th>
								<th class="text-center">Estado</th>
								{% for privilegio in privilegios %}
							    {% if privilegio.nombre == "usuarios" %}
								<th class="text-center">Accion</th>
								{% endif %}
								{% endfor %}
							</tr>
						</thead>
						<tbody>
							{% set numero = 0 %}
							{% for solicitante in solicitantes %}
							{% set numero = numero + 1 %}
							<tr>
								<th scope="row">{{solicitante.id}} - {{numero}}</th>
								<td>{{solicitante.razon_social}}</td>
								<td>{{solicitante.apellido_paterno}} {{solicitante.apellido_materno}} {{solicitante.nombres}}</td>
								<td>{{solicitante.telefono}}</td>
								<td>{{solicitante.correo}}</td>
								<td>{{solicitante.asunto}}</td>
								<td>{{solicitante.numero_folio}}</td>
								<td class="text-right">{{solicitante.getFecha()}} <br> {{solicitante.getHora()}}</td>
								<td class="td-last">
									<a class="btn btn-link btn-sm"
										href="archivos.php?solicitante={{solicitante.id}}">Ver archivos</a>
								</td>
								<td>
									{% if solicitante.estado == 'pendiente' %}
									<a href="cambio_estado.php?solicitante={{solicitante.id}}&estado=revisado"
										class="btn btn-light btn-sm btn-estado-reporte">Pendiente</a>
									{% else %}
									<a href="cambio_estado.php?solicitante={{solicitante.id}}&estado=pendiente"
										class="btn btn-success btn-sm btn-estado-reporte">Revisado</a>
									    <p class="text-center">{{solicitante.getFechaRevidado()}}</p>
									{% endif %}
                                    
								</td>
								{% for privilegio in privilegios %}
							    {% if privilegio.nombre == "usuarios" %}
								<td class="td-last">
								    <button type="button" class="btn btn-sm btn-warning" data-toggle="modal"
										data-target="#myModal{{solicitante.id}}">
										Eliminar
									</button>

									<!-- Modal -->
									<div class="modal fade" id="myModal{{solicitante.id}}" tabindex="-1" role="dialog"
										aria-labelledby="myModalLabel{{solicitante.id}}">
										<div class="modal-dialog" role="document" style="max-width: 350px;">
											<div class="modal-content">
												<div class="modal-header" style="padding: 5px 15px">
													<button type="button" class="close" data-dismiss="modal"
														aria-label="Close"><span
															aria-hidden="true">&times;</span></button>
													<h4 class="modal-title" id="myModalLabel{{solicitante.id}}">Confirmaci&oacute;n</h4>
												</div>
												<div class="modal-body" style="font-size: 1.5rem;">
													¿Estas seguro que deseas eliminar al solicitante <br> <b>{{solicitante.apellido_paterno}} {{solicitante.apellido_materno}}
														{{solicitante.nombres}}?</b>
												</div>
												<div class="modal-footer" style="padding: 5px 15px">
													<button type="button" class="btn btn-default"
														data-dismiss="modal">No</button>
													<a class="btn btn-warning btn-sm"
														href="delete.php?solicitante={{solicitante.id}}">Eliminar</a>
												</div>
											</div>
										</div>
									</div>
									<!--/. Modal -->
									
								</td>
								{% endif %}
								{% endfor %}
							</tr>
							{% endfor %}

						</tbody>
					</table>
					{% if numero == 0 %}
					<p class="text-center">Sin registros</p>
					{% endif %}
				</div>

			</div>
		</div>
	</div>
</div>
<div>
	<button class="btn btn-sm btn-verdedark" id="btn-imprimir-recibidos" style="float: left;">IMPRIMIR</button>
	<p style="float: right;">Número de registros
		{{numero}}</p>
</div>
<!-- fin box -->

<script type="text/javascript">
	(function (document) {
		'use strict';

		var LightTableFilter = (function (Arr) {

			var _input;

			function _onInputEvent(e) {
				_input = e.target;
				var tables = document.getElementsByClassName(_input.getAttribute('data-table'));
				Arr.forEach.call(tables, function (table) {
					Arr.forEach.call(table.tBodies, function (tbody) {
						Arr.forEach.call(tbody.rows, _filter);
					});
				});
			}

			function _filter(row) {
				var text = row.textContent.toLowerCase(), val = _input.value.toLowerCase();
				row.style.display = text.indexOf(val) === -1 ? 'none' : 'table-row';
			}

			return {
				init: function () {
					var inputs = document.getElementsByClassName('light-table-filter');
					Arr.forEach.call(inputs, function (input) {
						input.oninput = _onInputEvent;
					});
				}
			};
		})(Array.prototype);

		document.addEventListener('readystatechange', function () {
			if (document.readyState === 'complete') {
				LightTableFilter.init();
			}
		});

	})(document);
</script>
{% endblock %}