───────┬──────────────────────────────────────────────────────────────────────── │ File: src/main/resources/templates/list.html ───────┼──────────────────────────────────────────────────────────────────────── 1 │ <!DOCTYPE html> 2 │ <html lang="ja" xmlns:th="http://www.thymeleaf.org"> 3 │ 4 │ <head> 5 │ <meta charset="UTF-8"> 6 │ <title>ToDoList</title> 7 │ </head> 8 │ 9 │ <body> 10 │ <h1> ようこそ [[${member.name}]] さん！</h1> 11 │ <p> 12 │ <a th:href="@{/{mid}/todos/all(mid=${member.mid})}">みんなのToDo</a> 13 │ <a th:href="@{/}">ログアウト</a> 14 │ </p> 15 │ <h2>ToDo</h2> 16 │ <table border="1"> 17 │ <tr> 18 │ <th>#</th> 19 │ <th>タイトル</th> 20 │ <th>作成日時</th> 21 │ <th>コマンド</th> 22 │ </tr> 23 │ <tr th:each="todo: ${todos}"> 24 │ <td>[[${todo.seq}]]</td> 25 │ <td>[[${todo.title}]]</td> 26 │ <td>[[${todo.createdAt}]]</td> 27 │ <td> 28 │ <a th:href="@{/{mid}/todos/{seq}/done(mid=${member.mid},seq=${todo.seq})}">完了</a> 29 │ </td> 30 │ </tr> 31 │ <tr> 32 │ <td> 33 │ * 34 │ </td> 35 │ <td colspan="3"> 36 │ <form role="form" th:action="@{/{mid}/todos(mid=${member.mid})}" th:object="${ToDoForm}" method="post"> 37 │ <input type="text" required th:field="*{title}" /> 38 │ <input type="submit" value="新規作成" /> 39 │ <div th:if="${#fields.hasErrors('title')}" th:errors="*{title}" style="color: red"></div> 40 │ </form> 41 │ </td> 42 │ </tr> 43 │ </table> 44 │ <div th:fragment="paginationbar"> 45 │ <ul> 46 │ <li th:class="${todos.first}? 'disabled': ''" style="display:inline"> 47 │ <span th:if="${todos.first}"><<</span> 48 │ <a th:if="${not todos.first}" th:href="@{${url}(page=0)}"><<</a> 49 │ </li> 50 │ <li th:if="${todos.totalPages} > 0" th:each="i: ${#numbers.sequence(0, todos.totalPages-1)}" th:class="(${i}==${todos.number})?'active': ''" style="display:inline"> 51 │ <span th:if="${i} == ${todos.number}" th:text="${i+1}">1</span> 52 │ <a th:if="${i}!=${todos.number}" th:href="@{${url}(page=${i})}"> 53 │ <span th:text="${i+1}">1</span> 54 │ </a> 55 │ </li> 56 │ <li th:class="${todos.last}? 'disabled': ''" style="display:inline"> 57 │ <span th:if="${todos.last}">>></span> 58 │ <a th:if="${not todos.last}" th:href="@{${url}(page=(${todos.totalPages}-1))}">>></a> 59 │ </li> 60 │ </ul> 61 │ </div> 62 │ 63 │ <h2>Done</h2> 64 │ <table border="1"> 65 │ <tr> 66 │ <th>#</th> 67 │ <th>タイトル</th> 68 │ <th>作成日時</th> 69 │ <th>完了日時</th> 70 │ </tr> 71 │ <tr th:each="done: ${dones}"> 72 │ <td>[[${done.seq}]]</td> 73 │ <td>[[${done.title}]]</td> 74 │ <td>[[${done.createdAt}]]</td> 75 │ <td>[[${done.doneAt}]]</td> 76 │ </tr> 77 │ </table> 78 │ <div th:fragment="paginationbar"> 79 │ <ul> 80 │ <li th:class="${dones.first}? 'disabled': ''" style="display:inline"> 81 │ <span th:if="${dones.first}"><<</span> 82 │ <a th:if="${not dones.first}" th:href="@{${url}(page=0)}"><<</a> 83 │ </li> 84 │ <li th:if="${dones.totalPages} > 0" th:each="i: ${#numbers.sequence(0, dones.totalPages-1)}" th:class="(${i}==${dones.number})?'active': ''" style="display:inline"> 85 │ <span th:if="${i} == ${dones.number}" th:text="${i+1}">1</span> 86 │ <a th:if="${i}!=${dones.number}" th:href="@{${url}(page=${i})}"> 87 │ <span th:text="${i+1}">1</span> 88 │ </a> 89 │ </li> 90 │ <li th:class="${dones.last}? 'disabled': ''" style="display:inline"> 91 │ <span th:if="${dones.last}">>></span> 92 │ <a th:if="${not dones.last}" th:href="@{${url}(page=(${dones.totalPages}-1))}">>></a> 93 │ </li> 94 │ </ul> 95 │ </div> 96 │ </body> 97 │ 98 │ </html> ───────┴────────────────────────────────────────────────────────────────────────