#16 board : article list page - sort
This commit is contained in:
@@ -0,0 +1,5 @@
|
||||
/* 게시글 테이블 제목 */
|
||||
#article-table > thead a {
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
@@ -9,6 +9,7 @@
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
|
||||
<link href="/css/search-bar.css" rel="stylesheet">
|
||||
<link href="/css/articles/table-header.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -59,10 +60,10 @@
|
||||
<table class="table" id="article-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="title col-6">제목</th>
|
||||
<th class="hashtag col-2">해시태그</th>
|
||||
<th class="user-id col">작성자</th>
|
||||
<th class="created-at col">작성일</th>
|
||||
<th class="title col-6"><a>제목</a></th>
|
||||
<th class="hashtag col-2"><a>해시태그</a></th>
|
||||
<th class="user-id col"><a>작성자</a></th>
|
||||
<th class="created-at col"><a>작성일</a></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
||||
@@ -3,34 +3,56 @@
|
||||
<attr sel="#header" th:replace="header :: header" />
|
||||
<attr sel="#footer" th:replace="footer :: footer" />
|
||||
|
||||
<attr sel="#article-table">
|
||||
<attr sel="tbody" th:remove="all-but-first">
|
||||
<attr sel="tr[0]" th:each="article : ${articles}">
|
||||
<attr sel="td.title/a" th:text="${article.title}" th:href="@{'/articles/' + ${article.id}}" />
|
||||
<attr sel="td.hashtag" th:text="${article.hashtag}" />
|
||||
<attr sel="td.user-id" th:text="${article.nickname}" />
|
||||
<attr sel="td.created-at/time" th:datetime="${article.createdAt}" th:text="${#temporals.format(article.createdAt, 'yyyy-MM-dd')}"/>
|
||||
<attr sel="main" th:object="${articles}">
|
||||
<attr sel="#article-table">
|
||||
<attr sel="thead/tr">
|
||||
<attr sel="th.title/a" th:text="'제목'" th:href="@{/articles(
|
||||
page=${articles.number},
|
||||
sort='title' + (*{sort.getOrderFor('title')} != null ? (*{sort.getOrderFor('title').direction.name} != 'DESC' ? ',desc' : '') : '')
|
||||
)}"/>
|
||||
<attr sel="th.hashtag/a" th:text="'해시태그'" th:href="@{/articles(
|
||||
page=${articles.number},
|
||||
sort='hashtag' + (*{sort.getOrderFor('hashtag')} != null ? (*{sort.getOrderFor('hashtag').direction.name} != 'DESC' ? ',desc' : '') : '')
|
||||
)}"/>
|
||||
<attr sel="th.user-id/a" th:text="'작성자'" th:href="@{/articles(
|
||||
page=${articles.number},
|
||||
sort='userAccount.userId' + (*{sort.getOrderFor('userAccount.userId')} != null ? (*{sort.getOrderFor('userAccount.userId').direction.name} != 'DESC' ? ',desc' : '') : '')
|
||||
)}"/>
|
||||
<attr sel="th.created-at/a" th:text="'작성일'" th:href="@{/articles(
|
||||
page=${articles.number},
|
||||
sort='createdAt' + (*{sort.getOrderFor('createdAt')} != null ? (*{sort.getOrderFor('createdAt').direction.name} != 'DESC' ? ',desc' : '') : '')
|
||||
)}"/>
|
||||
</attr>
|
||||
|
||||
<attr sel="tbody" th:remove="all-but-first">
|
||||
<attr sel="tr[0]" th:each="article : ${articles}">
|
||||
<attr sel="td.title/a" th:text="${article.title}" th:href="@{'/articles/' + ${article.id}}" />
|
||||
<attr sel="td.hashtag" th:text="${article.hashtag}" />
|
||||
<attr sel="td.user-id" th:text="${article.nickname}" />
|
||||
<attr sel="td.created-at/time" th:datetime="${article.createdAt}" th:text="${#temporals.format(article.createdAt, 'yyyy-MM-dd')}" />
|
||||
</attr>
|
||||
</attr>
|
||||
</attr>
|
||||
|
||||
<attr sel="#pagination">
|
||||
<attr sel="li[0]/a"
|
||||
th:text="'previous'"
|
||||
th:href="@{/articles(page=${articles.number - 1})}"
|
||||
th:class="'page-link' + (${articles.number} <= 0 ? ' disabled' : '')"
|
||||
/>
|
||||
<attr sel="li[1]" th:class="page-item" th:each="pageNumber : ${paginationBarNumbers}">
|
||||
<attr sel="a"
|
||||
th:text="${pageNumber + 1}"
|
||||
th:href="@{/articles(page=${pageNumber})}"
|
||||
th:class="'page-link' + (${pageNumber} == ${articles.number} ? ' disabled' : '')"
|
||||
/>
|
||||
</attr>
|
||||
<attr sel="li[2]/a"
|
||||
th:text="'next'"
|
||||
th:href="@{/articles(page=${articles.number + 1})}"
|
||||
th:class="'page-link' + (${articles.number} >= ${articles.totalPages - 1} ? ' disabled' : '')"
|
||||
/>
|
||||
</attr>
|
||||
</attr>
|
||||
|
||||
<attr sel="#pagination">
|
||||
<attr sel="li[0]/a"
|
||||
th:text="'previous'"
|
||||
th:href="@{/articles(page=${articles.number - 1})}"
|
||||
th:class="'page-link' + (${articles.number} <= 0 ? ' disabled' : '')"
|
||||
/>
|
||||
<attr sel="li[1]" th:class="page-item" th:each="pageNumber : ${paginationBarNumbers}">
|
||||
<attr sel="a"
|
||||
th:text="${pageNumber + 1}"
|
||||
th:href="@{/articles(page=${pageNumber})}"
|
||||
th:class="'page-link' + (${pageNumber} == ${articles.number} ? ' disabled' : '')"
|
||||
/>
|
||||
</attr>
|
||||
<attr sel="li[2]/a"
|
||||
th:text="'next'"
|
||||
th:href="@{/articles(page=${articles.number + 1})}"
|
||||
th:class="'page-link' + (${articles.number} >= ${articles.totalPages - 1} ? ' disabled' : '')"
|
||||
/>
|
||||
</attr>
|
||||
</thlogic>
|
||||
Reference in New Issue
Block a user