github
/
halo-theme-hao
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

图库页面添加分页

This commit is contained in:
1152958806@qq.com 2023-10-18 22:27:52 +08:00
parent 5098b2d41f
commit 9d735b1831
9 changed files with 107 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/archives.html
View File

@ -53,7 +53,7 @@
</div>
</div>
<!-- 分页 -->
<div th:replace="~{modules/widgets/page :: page('/archives',${archives},false)}"></div>
<div th:replace="~{modules/widgets/page :: page('/archives',${archives},false,'')}"></div>
</div>
<!-- sidebar -->
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.categoryWidgets})}"></div>

20
templates/assets/js/heo.js
View File

@ -484,9 +484,23 @@ var heo = {
, o = document.getElementById("toPageText")
, n = parseInt(o.value);
if (!isNaN(n) && n > 0 && "0" !== ("" + n)[0] && n <= t) {
var a, l = window.location.href.replace(/\/page\/\d$/, "");
a = 1 === n ? l : l + (l.endsWith("/") ? "" : "/") + "page/" + n,
document.getElementById("toPageButton").href = a
var url = window.location.href;
var photosIndexOf = url.indexOf("?group") >= 0 ? url.indexOf("?group") : -1;
if (photosIndexOf >= 0) {//图库页面
var new_url = url.substr(0,photosIndexOf);
var group = url.substr(photosIndexOf)
var a, l = new_url.replace(/\/page\/\d$/, "");
a = 1 === n ? l : l + (l.endsWith("/") ? "" : "/") + "page/" + n,
document.getElementById("toPageButton").href = a + group
}else{
var a, l = url.replace(/\/page\/\d$/, "");
a = 1 === n ? l : l + (l.endsWith("/") ? "" : "/") + "page/" + n,
document.getElementById("toPageButton").href = a
}
//首页有第一屏就跳转指定位置
scrollToPost();
}
},
changeSayHelloText: function() {

81
templates/category.html
View File

@ -32,85 +32,8 @@
<!-- 跳转到分类页 -->
<a class="category-bar-more" href="/categories">更多</a>
</div>
<div class="recent-posts category_ui" id="recent-posts"
th:with='postItems=${posts.items},
postRandomImg=${#strings.contains(theme.config.layout.postRandomImg,"?") ? theme.config.layout.postRandomImg+"&" : theme.config.layout.postRandomImg+"?"}'>
<!-- card，需要添加在没有图片时使用随机图片 -->
<div class="recent-post-item" th:classappend="${theme.config.layout.post.cols} + ' ' +
${theme.config.layout.post.postLocation} + ' ' +
(${iStat.even} ? 'even' : 'odd') + ' ' +
(${post.spec.pinned} ? 'pinned-post-item' : '')"
th:attr="onclick='pjax.loadUrl(\''+ @{${post.status.permalink}} +'\')'"
th:each="post,iStat : ${postItems}">
<div class="post_cover left_radius">
<a th:attr="title=${post.spec.title}" th:href="@{${post.status.permalink}}">
<img class="post_bg"
th:with='img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+post.spec.title : post.spec.cover}'
th:alt="${post.spec.title}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:src="${isLazyload ? loadingImg : img}">
</a>
</div>
<div class="recent-post-info">
<div class="recent-post-info-top">
<div class="recent-post-info-top-tips">
<!-- 类别非空时 -->
<th:block th:if="${not #lists.isEmpty(post.categories)}">
<span th:each="category : ${post.categories}"
th:href="@{${category.status.permalink}}"
th:text="${category.spec.displayName}"
th:title="${category.spec.displayName}" class="original"></span>
</th:block>
<!-- <span class="lastestpost">最新</span>-->
<a class="unvisited-post" th:href="@{${post.status.permalink}}"
th:title="${post.spec.title}" data-pjax-state="">未读</a>
</div>
<a class="article-title" th:attr="title=${post.spec.title}"
th:href="@{${post.status.permalink}}" th:text="${post.spec.title}">
</a>
<div class="content" th:text="${post.status.excerpt}"></div>
</div>
<div class="article-meta-wrap">
<!-- tag -->
<th:block th:if="${not #lists.isEmpty(post.tags)}">
<span class="article-meta tags">
<a class="article-meta__tags" event.cancelbubble
onclick="window.event.cancelBubble=!0" th:each="tag : ${post.tags}"
th:href="@{${tag.status.permalink}}" th:title="${tag.spec.displayName}">
<span
class="tags-punctuation">[[${#strings.trim(tag.spec.displayName)}]]</span>
</a>
</span>
</th:block>
<!-- 创建时间 -->
<span class="post-meta-date"
th:with="days=${(new java.util.Date().getTime()-post.spec.publishTime.toEpochMilli())/86400000}">
<i class="far fa-calendar-alt"></i>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days > 30}"
th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days <= 30 && days > 0}" th:text="${days}+天前"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days == 0}" th:text="最近"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
</span>
</div>
</div>
</div>
<!-- 分页 -->
<div
th:replace="~{modules/widgets/page :: page(${'/categories/'+category.spec.slug},${posts},false)}">
</div>
</div>
<!-- 文章 -->
<th:block th:replace="~{macro/post-list :: post-list(${'/categories/'+category.spec.slug})}" />
</div>
<!-- sidebar -->
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.categoryWidgets})}"></div>

72
templates/macro/post-list.html Normal file
View File

@ -0,0 +1,72 @@
<th:block th:fragment="post-list(_path)">
<div class="recent-posts" id="recent-posts"
th:with='postItems=${posts.items},
postRandomImg=${#strings.contains(theme.config.layout.postRandomImg,"?") ? theme.config.layout.postRandomImg+"&" : theme.config.layout.postRandomImg+"?"}'>
<!-- card，需要添加在没有图片时使用随机图片 -->
<div class="recent-post-item" th:classappend="${theme.config.layout.post.cols} + ' ' +
${theme.config.layout.post.postLocation} + ' ' +
(${iStat.even} ? 'even' : 'odd') + ' ' +
(${post.spec.pinned} ? 'pinned-post-item' : '')"
th:attr="onclick='pjax.loadUrl(\''+ @{${post.status.permalink}} +'\')'" th:each="post,iStat : ${postItems}">
<div class="post_cover left_radius">
<a th:attr="title=${post.spec.title}" th:href="@{${post.status.permalink}}">
<img class="post_bg"
th:with='img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+post.spec.title : post.spec.cover}'
th:alt="${post.spec.title}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:src="${isLazyload ? loadingImg : img}">
</a>
</div>
<div class="recent-post-info">
<div class="recent-post-info-top">
<div class="recent-post-info-top-tips">
<!-- 类别非空时 -->
<th:block th:if="${not #lists.isEmpty(post.categories)}">
<span th:each="category : ${post.categories}" th:href="@{${category.status.permalink}}"
th:text="${category.spec.displayName}" th:title="${category.spec.displayName}"
class="original"></span>
</th:block>
<a class="unvisited-post" th:href="@{${post.status.permalink}}" th:title="${post.spec.title}"
data-pjax-state="">未读</a>
</div>
<a class="article-title" th:attr="title=${post.spec.title}" th:href="@{${post.status.permalink}}"
th:text="${post.spec.title}">
</a>
<div class="content" th:text="${post.status.excerpt}"></div>
</div>
<div class="article-meta-wrap">
<!-- tag -->
<th:block th:if="${not #lists.isEmpty(post.tags)}">
<span class="article-meta tags">
<a class="article-meta__tags" event.cancelbubble onclick="window.event.cancelBubble=!0"
th:each="tag : ${post.tags}" th:href="@{${tag.status.permalink}}"
th:title="${tag.spec.displayName}">
<span class="tags-punctuation">[[${#strings.trim(tag.spec.displayName)}]]</span>
</a>
</span>
</th:block>
<!-- 创建时间 -->
<span class="post-meta-date"
th:with="days=${(new java.util.Date().getTime()-post.spec.publishTime.toEpochMilli())/86400000}">
<i class="far fa-calendar-alt"></i>
<time style="display: inline;" th:datetime="${post.spec.publishTime}" th:if="${days > 30}"
th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days <= 30 && days > 0}" th:text="${days}+天前"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}" th:if="${days == 0}"
th:text="最近" th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
</span>
</div>
</div>
</div>
<!-- 分页 -->
<div th:replace="~{modules/widgets/page :: page(${_path},${posts},false,'')}"></div>
</div>
</th:block>

4
templates/modules/footer.html
View File

@ -14,7 +14,8 @@
<th:block th:with="socialMedias = ${theme.config.footer.social_media.socialMediaLeft}">
<a th:class="${socialMedia.option_social_data == 'custom' ? 'custom_socials' : 'deal_link'}" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
th:href="${socialMedia.url}" th:title="${socialMedia.name}">
<i th:if="${socialMedia.option_social_data == 'icon'}" th:class="${socialMedia.icon}"></i>
<i th:if="${socialMedia.option_social_data == 'icon' || #strings.isEmpty(socialMedia.option_social_data)}"
th:class="${socialMedia.icon}"></i>
<th:block th:if="${socialMedia.option_social_data == 'custom'}" th:utext="${socialMedia.icon}"></th:block>
</a>
</th:block>
@ -22,6 +23,7 @@
<img th:if="${not #strings.isEmpty(theme.config.footer.social_media.centerImg)}" class="footer_mini_logo"
th:with="img = @{${theme.config.footer.social_media.centerImg}}" th:src="${isLazyload ? '' : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" title="返回顶部" onclick="btf.scrollToDest(0, 500)">
<th:block th:with="socialMedias = ${theme.config.footer.social_media.socialMediaRight}">
<a th:class="${socialMedia.option_social_data == 'custom' ? 'custom_socials' : 'deal_link'}" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
th:href="${socialMedia.url}" th:title="${socialMedia.name}">

2
templates/modules/post-list.html
View File

@ -104,7 +104,7 @@
</div>
<!-- 分页 -->
<div th:replace="~{modules/widgets/page :: page('',${posts},true)}"></div>
<div th:replace="~{modules/widgets/page :: page('',${posts},true,'')}"></div>
</th:block>

10
templates/modules/widgets/page.html
View File

@ -6,8 +6,9 @@
@param path '/path/page/n' 中的 `/path` 需要保留 `/`
@param pageInfo Halo类型UrlContextListResult<ListedPostVo>
@param isIndex 是否主页
@param _param 参数
-->
<nav id="pagination" th:fragment="page(path,pageInfo,isIndex)">
<nav id="pagination" th:fragment="page(path,pageInfo,isIndex,_param)">
<div class="pagination" th:with="paths = ${isIndex ? path+'/' : path}">
<!-- 页码按钮 -->
@ -20,7 +21,7 @@
<span class="page-number current" th:if="${pageInfo.page} == ${index}" th:text="${pageInfo.page}"></span>
<a class="page-number" th:unless="${pageInfo.page == index}"
th:if="${index > 0 && index <= pageInfo.totalPages}"
th:href="${#strings.equals(index, '1') ? paths : path+'/page/'+index}"
th:href="${#strings.equals(index, '1') ? paths + _param : path+'/page/'+index + _param}"
th:text="${index}"
onclick="scrollToPost()"></a>
</th:block>
@ -28,11 +29,10 @@
<th:block th:if="${pageInfo.totalPages - pageInfo.page > 2}">
<span class="space" th:if="${pageInfo.totalPages - pageInfo.page != 3}">…</span>
<a class="page-number"
th:href="${path+'/page/'+pageInfo.totalPages}"
th:href="${path+'/page/'+pageInfo.totalPages+_param}"
th:text="${pageInfo.totalPages}"
onclick="scrollToPost()"></a>
</th:block>
<!-- 翻页按钮 -->
<a class="extend prev" rel="prev"
th:if="${pageInfo.hasPrevious}"
@ -53,7 +53,7 @@
<input id="toPageText" maxlength="3" title="跳转到指定页面"
oninput="value=value.replace(/[^0-9]/g,'')"
onkeyup="if (this.value === '0') this.value = ''">
<a id="toPageButton" onclick="heo.toPage();scrollToPost();"><i class="haofont hao-icon-angles-right"></i>
<a id="toPageButton" onclick="heo.toPage();"><i class="haofont hao-icon-angles-right"></i>
</a>
</div>

4
templates/photos.html
View File

@ -104,6 +104,10 @@
</section>
</div>
</div>
<!-- 分页 -->
<th:block th:with="param_group = ${not #strings.isEmpty(param.group) ? '?group='+param.group : ''}">
<div th:replace="~{modules/widgets/page :: page('/photos',${photos},false,${param_group})}"></div>
</th:block>
<style>
.gallery-groups {
box-shadow: var(--heo-shadow-border);

78
templates/tag.html
View File

@ -26,82 +26,8 @@
<span class="tagsPageCount" th:text="${tagItem.status.visiblePostCount}"></span>
</a>
</div>
<div class="recent-posts" id="recent-posts"
th:with='postItems=${posts.items},
postRandomImg=${#strings.contains(theme.config.layout.postRandomImg,"?") ? theme.config.layout.postRandomImg+"&" : theme.config.layout.postRandomImg+"?"}'>
<!-- card，需要添加在没有图片时使用随机图片 -->
<div class="recent-post-item" th:classappend="${theme.config.layout.post.cols} + ' ' +
${theme.config.layout.post.postLocation} + ' ' +
(${iStat.even} ? 'even' : 'odd') + ' ' +
(${post.spec.pinned} ? 'pinned-post-item' : '')"
th:attr="onclick='pjax.loadUrl(\''+ @{${post.status.permalink}} +'\')'"
th:each="post,iStat : ${postItems}">
<div class="post_cover left_radius">
<a th:attr="title=${post.spec.title}" th:href="@{${post.status.permalink}}">
<img class="post_bg"
th:with='img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+post.spec.title : post.spec.cover}'
th:alt="${post.spec.title}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:src="${isLazyload ? loadingImg : img}">
</a>
</div>
<div class="recent-post-info">
<div class="recent-post-info-top">
<div class="recent-post-info-top-tips">
<!-- 类别非空时 -->
<th:block th:if="${not #lists.isEmpty(post.categories)}">
<span th:each="category : ${post.categories}"
th:href="@{${category.status.permalink}}"
th:text="${category.spec.displayName}"
th:title="${category.spec.displayName}" class="original"></span>
</th:block>
<!-- <span class="lastestpost">最新</span>-->
<a class="unvisited-post" th:href="@{${post.status.permalink}}"
th:title="${post.spec.title}" data-pjax-state="">未读</a>
</div>
<a class="article-title" th:attr="title=${post.spec.title}"
th:href="@{${post.status.permalink}}" th:text="${post.spec.title}">
</a>
<div class="content" th:text="${post.status.excerpt}"></div>
</div>
<div class="article-meta-wrap">
<!-- tag -->
<th:block th:if="${not #lists.isEmpty(post.tags)}">
<span class="article-meta tags">
<a class="article-meta__tags" event.cancelbubble
onclick="window.event.cancelBubble=!0" th:each="tag : ${post.tags}"
th:href="@{${tag.status.permalink}}" th:title="${tag.spec.displayName}">
<span
class="tags-punctuation">[[${#strings.trim(tag.spec.displayName)}]]</span>
</a>
</span>
</th:block>
<!-- 创建时间 -->
<span class="post-meta-date"
th:with="days=${(new java.util.Date().getTime()-post.spec.publishTime.toEpochMilli())/86400000}">
<i class="far fa-calendar-alt"></i>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days > 30}"
th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days <= 30 && days > 0}" th:text="${days}+天前"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
<time style="display: inline;" th:datetime="${post.spec.publishTime}"
th:if="${days == 0}" th:text="最近"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
</time>
</span>
</div>
</div>
</div>
<!-- 分页 -->
<div th:replace="~{modules/widgets/page :: page(${'/tags/'+tag.spec.slug},${posts},false)}"></div>
</div>
<!-- 文章 -->
<th:block th:replace="~{macro/post-list :: post-list(${'/tags/'+tag.spec.slug})}" />
</div>
<!-- sidebar -->
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.tagWidgets})}"></div>