<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/head :: head}">
    <meta charset="UTF-8">
    <title>Too Easy</title>
</head>
<body>
<div th:replace="~{layout}">
    <div th:fragment="content">
        <section>
            <div class="container p-4 shadow bg-white rounded">
                <div class="d-flex align-items-center justify-content-between mb-4">
                    <h1 class="mb-4" th:text="${titulo}"></h1>
                    <a th:href="@{/commodity}" type="button" class="btn btn-outline-dark" title="Novo">
                        <i class="bi bi-plus-square"></i>
                    </a>
                </div>
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>Código</th>
                        <th>Descrição</th>
                        <th>Ações</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="comodity : ${commodities}">
                        <td th:text="${comodity.id}">0</td>
                        <td th:text="${comodity.descricao}">0</td>
                        <td>
                            <a th:href="@{'/commodity/edit/' + ${comodity.id}}" type="button" class="btn btn-outline-dark"
                               title="Editar">
                                <i class="bi bi-pencil-square"></i>
                            </a>
                            <a th:href="@{'/commodity/remove/' + ${comodity.id}}" type="button" class="btn btn-outline-dark"
                               title="Remover">
                                <i class="bi bi-dash-square"></i>
                            </a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </section>
    </div>
</div>
</body>
</html>
