<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity5"
      lang="en">
<head th:replace="fragments/loggedInNav :: head(~{::title}, ~{}, ~{})">
  <title>ITems | Request List</title>
</head>

<body>

<div th:block sec:authorize="!isAuthenticated()" th:replace="fragments/loggedOutNav :: nav(~{::navbar})"></div>
<div th:block sec:authorize="isAuthenticated()" th:replace="fragments/loggedInNav :: nav(~{::navbar})"></div>


<header class="masthead bg-light mb-3 border-bottom" >
  <div class="container">
    <div class="row gx-4 gx-lg-5 justify-content-center text-center">
      <div class="col-md-10 col-lg-8 col-xl-7">
        <div class="site-heading">
          <h1 mb-5 mt-5>ITems</h1>
        </div>
      </div>
    </div>
  </div>
</header>

<main>
  <div class="container w-auto">
    <h3>Employee Request List</h3>
    <hr/>
    <div class="table-responsive-sm">
      <table class="border rounded-2 table table-striped table-hover mt-3 align-middle" id="requestTable">
        <thead>
        <tr>
          <th scope="col">Request #</th>
          <th scope="col">Employee Name (or ID)</th>
          <th scope="col">Request Title</th>
          <th scope="col">Request Content</th>
          <th scope="col">Request Type</th>
          <th scope="col">Request Status</th>
          <th scope="col">Posted On</th>
          <th scope="col">Actions</th>
        </tr>
        </thead>
        <tbody>
        <tr scope="row" th:each="request: ${requests}">
          <td th:text="${request.id}"></td>
          <td th:text="${request.employee.firstName}"></td>
          <td th:text="${request.title}"></td>
          <td th:text="${request.body}"></td>
          <td th:text="${request.getRequestType}"></td>
          <td th:text="${request.status}"></td>
          <td th:text="${request.creationTS}"></td>

          <td>
            <a th:href="@{/admin/list/requests/approve(requestId=${request.id})}" class="btn btn-info m-1 w-100">Approve</a>
            <a th:href="@{/admin/list/requests/deny(requestId=${request.id})}" class="btn btn-danger m-1 w-100">Deny</a>
          </td>
        </tr>
        </tbody>
      </table>
    </div>
  </div>
</main>

<div th:block th:replace="fragments/loggedOutNav :: footer(~{::footer})"></div>

<script type="text/javascript" src="https://cdn.datatables.net/v/bs5/dt-1.11.3/datatables.min.js"></script>
<script>
  $(document).ready(function() {
    $("#requestTable").DataTable({
      'aoColumnDefs': [{
        'bSortable': false,
        'aTargets': [-1] /* 1st one, start by the right */
      }]
    });
  })
  </script>
</body>
</html>