{% extends "base.html" %}

{% block titulo %} Cemanblin {% endblock %}

{% block seccion %}
<div class="content-header">
  <div class="container-fluid">
    <div class="row mb-2">
      <div class="col-sm-6">
        <h5 class="m-0">Panel de Control de Cemanblin</h5>
      </div>
      <div class="col-sm-6">
        <ol class="breadcrumb float-sm-right">
          <li class="breadcrumb-item"><a href="#">Centros</a></li>
          <li class="breadcrumb-item active">Cemanblin</li>
          <li class="breadcrumb-item active">Cemantar</li>
          <li class="breadcrumb-item active">Cemansac</li>
        </ol>
      </div>
    </div>
  </div>
</div>
{% endblock %}


{% block contenido %}
<div class="card card-dark card-outline">
  <div class="card-header">
    <div class="d-flex justify-content-between">
      <h3 class="card-title m-0"></h3>
      {% if perms.seajb.add_cemablin %}
      <a href="#" class="btn btn-success float-left" data-toggle="modal" data-target="#modalCemanblin"><i
          class="fas fa-plus-square"></i> Nuevo</a>
        {% endif %}
    </div>
  </div>

  <div class="card-body table-responsive">
    <table id="example1" class="table table-bordered table-striped  table-hover-blue">
      <thead class="table-dark">
        <tr>
          <th class="text-center">N° ORDEN</th>
          <th class="text-center">UNIDAD</th>
          <th class="text-center">EQUIPO</th>
          <th class="text-center">F-RECEPCIÓN</th>
          <th class="text-center">CONDICION</th>
          <th class="text-center">SERIALES</th>
          <th class="text-center">DESCRIPCIÓN</th>
          <th class="text-center">ACCIONES</th>
        </tr>
      </thead>
      <tbody>

      {% for cemanblin in cemanblin %}
        <tr>
        <td>{{cemanblin.code}}</td>
        <td>{{cemanblin.unidad}}</td>
        <td>{{cemanblin.equipo}}</td>
        <td>{{cemanblin.fechaR}}</td>
        <td>{{cemanblin.reparado}}</td>
        <td>{{cemanblin.seriales}}</td>
        <td>{{cemanblin.descripcion}}</td>
        <td>
        {% if perms.seajb.change_cemanblin %}
        <a href="#" class="btn btn-info btn-sm"><i class="fas fa-solid fa-marker"></i></a> |
        {% endif %}
        {% if perms.seajb.view_cemanblin %}
        <a href="#" class="btn btn-dark btn-sm"><i class="fas fa-file-pdf"></i></a> |
        {% endif %}
        {% if perms.seajb.delete_cemanblin %}
        <a href="#" class="btn btn-danger btn-sm" data-id="#"><i class="fas fa-solid fa-trash"></i></a>
        {% endif %}
        </td>
        </tr>
          {% endfor %}
      </tbody>
    </table>
  </div>
</div>
</div>

<div class="modal fade" id="modalCemanblin" tabindex="-1" aria-labelledby="modalTituloCemanblin" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header bg-dark bg-outline">
        <h5 class="modal-title" id="modalTituloCemanblin">FORMULARIO DE CEMANBLIN</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        {% include 'centros/cemanblin_f.html' %}
      </div>
    </div>
  </div>
</div>
{% endblock %}



{% block js %}
<script>
  $(document).ready(function () {
    $(".btn-danger").click(function () {
      let id = $(this).data('id');
      Swal.fire({
        title: '¿Estás seguro?',
        text: "Si usted acepta ¡No podrás revertir esto! Eliminaras todos los registro Cemanblin",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Sí, bórralo!'
      }).then((result) => {
        if (result.isConfirmed) {
          $.ajax({
            url: '/eliminar/' + id,
            method: 'GET',
            success: function (response) {
              if (response.status === 'success') {
                Swal.fire('¡Registro eliminado!', '', 'success');
              } else {
                location.reload();
              }
            }
          });
        }
      });
    });
  });
</script>


{% endblock %}