{% extends 'layouts/panel_layout.html.twig' %}

{% block title %}
Historico de procesos
{% endblock %}

{% block content %}
<div class="bg-dark m-b-30">
	<div class="container">
		<div class="row p-b-60 p-t-60">
			<div class="col-md-10 mx-auto text-center text-white p-b-30">
				<div class="m-b-20">
					<div class="avatar avatar-xl my-auto">
						<i class="icon-placeholder mdi mdi-tag-multiple" style="font-size: 5rem"></i>
					</div>
				</div>
				<h1>Historico de procesos
				</h1>
			</div>
		</div>
	</div>
</div>

<div class="container-fluid pull-up pb-5 mb-5">

	<div class="row">
		<div class="col-12">
			<div class="card">
				<div class="card-body">
					<div class="table-responsive p-t-10">
						<table class="table default-table nowrap" style="width:100%">
							<thead>
								<tr class="text-center">
									<th>id</th>
									<th>Fecha</th>
									<th>Cantidad</th>
									<th>Tipo</th>
									<th>Rollback hecho</th>
									<th>Rollback fecha</th>
									<th>Afectados</th>
									<th>Acciones</th>
								</tr>
							</thead>
							<tbody>
							{% for log in logs %}
								<tr class="text-center">
									<td>{{log.id}}</td>
									<td>{{log.fecha|date('d-m-Y H:m:s')}}</td>
									<td>{{log.cantidad}}</td>
									<td>{{log.tipo}}</td>
									<td>{{log.rollback ? 'No':'Si'}}</td>
									<td>{{log.rollbackFecha ? log.rollbackFecha|date('d-m-Y  H:m:s'):'--'}}</td>
									<td>{{log.afectados}}</td>
									<td>
										<a class="btn btn-info" href="{{ path ('historico_detalles', {'id':log.id})}}">Detalles</a>
										{% if log.rollback %}
										<button onclick="rollback({{log.id}})" class="btn btn-success">RollBack</button>
										{% endif %}
									</td>
								</tr>
							{% endfor %}
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

{% endblock %}

{% block javascripts %}
	<script>
		$('.table').DataTable({
      destroy: true,
			"order": [[ 0, "desc" ]]
		});
		
		function rollback(id){
			Swal.fire({
			title: `Seguro que desea hacer un RollBack ?`,
			cancelButtonText: 'Cancelar',
			confirmButtonText: 'Aceptar',
			allowOutsideClick: false,
			allowEscapeKey: false,
			focusConfirm: false,
			focusCancel: true,
			showCancelButton: true,
		}).then(result => {
			if (!result.dismiss) {
				window.location.href = `${id}/rollback`;
				$('.btn').hide();
			}
			})
		}

	</script>
{% endblock %}