Merge pull request #426 from chengzhongxue/main

最近发布优化,优化首页分页
2023-08-17 00:33:26 +08:00 · 2023-08-17 00:33:26 +08:00 · b6eaa8a235
parent c5d2295b87 83c1f7cba7
commit b6eaa8a235
5 changed files with 74 additions and 33 deletions
--- a/templates/assets/js/heo.js
+++ b/templates/assets/js/heo.js
@ -487,7 +487,11 @@ var heo = {
        $htmlDom.toggle('hide-aside')
        $htmlDom.contains("hide-aside") ? document.querySelector("#consoleHideAside").classList.add("on") : document.querySelector("#consoleHideAside").classList.remove("on")
    },
-
+    toPage: function() {
+        var e, t = document.querySelectorAll(".page-number"), o = parseInt(t[t.length - 1].innerHTML), n = document.getElementById("toPageText"), a = parseInt(n.value);
+        !isNaN(a) && a > 0 && "0" !== ("" + a)[0] && a <= o && (e = 1 === a ? "/" : "/page/" + a,
+            document.getElementById("toPageButton").href = e)
+    },
    changeSayHelloText: function() {
        const e = GLOBAL_CONFIG.helloText.length == 0 ? ["🤖️ 数码科技爱好者", "🔍 分享与热心帮助", "🏠 智能家居小能手", "🔨 设计开发一条龙", "🤝 专修交互与设计", "🏃 脚踏实地行动派", "🧱 团队小组发动机", "💢 壮汉人狠话不多"] : GLOBAL_CONFIG.helloText
            , t = document.getElementById("author-info__sayhi");
--- a/templates/assets/libs/fcircle/heo-fcircle3.css
+++ b/templates/assets/libs/fcircle/heo-fcircle3.css
@ -119,7 +119,7 @@ Last Modified time : 20220211 98:00 by https://immmmm.com
    justify-content: space-between;
 }

-#cf-container a {
+#cf-container a:not(.rss-plan-item) {
    text-decoration: none;
    display: flex;
    align-items: center;
--- a/templates/assets/zhheo/blogex.js
+++ b/templates/assets/zhheo/blogex.js
@ -643,11 +643,27 @@ function setBodyDataType(){
    att.value = GLOBAL_CONFIG.htmlType;
    body.setAttributeNode(att);
 }
-
+function listenToPageInputPress() {
+    var e = document.getElementById("toPageText")
+        , t = document.getElementById("toPageButton");
+    e && (e.addEventListener("keydown", (e=>{
+            13 === e.keyCode && (heo.toPage(),
+                pjax.loadUrl(t.href))
+        }
+    )),
+        e.addEventListener("input", (function() {
+                "" === e.value || "0" === e.value ? t.classList.remove("haveValue") : t.classList.add("haveValue");
+                var o = document.querySelectorAll(".page-number")
+                    , n = +o[o.length - 1].innerHTML;
+                +document.getElementById("toPageText").value > n && (e.value = n)
+            }
+        )))
+}
 function initBlog() {
    heo.initIndexEssay(),
    checkUrlAndAddHideBanner(),
-    setBodyDataType()
+    setBodyDataType(),
+    listenToPageInputPress()
 }

 // 如果当前页有评论就执行函数
--- a/templates/assets/zhheo/zhheoblog.css
+++ b/templates/assets/zhheo/zhheoblog.css
@ -2092,6 +2092,8 @@ blockquote footer cite::before {
    flex: 1 1 0%;
    padding-left: 10px;
    word-break: break-all;
+    display: flex;
+    flex-direction: column;
 }

 #aside-content .aside-list > .aside-list-item .content > .name {
@ -2109,7 +2111,7 @@ blockquote footer cite::before {
 #aside-content .aside-list > .aside-list-item .content > .title {
    color: var(--heo-fontcolor);
    font-size: 95%;
-    line-height: 1.5;
+    line-height: 1.4;
    -webkit-line-clamp: 2;
 }

@ -4104,6 +4106,15 @@ figure.gallery-group:hover .gallery-group-name::after {
    transform: translate3d(0, 0, 0)
 }

+#aside-content .aside-list>.aside-list-item .content>.comment,
+#aside-content .aside-list>.aside-list-item .content>.name,
+#aside-content .aside-list>.aside-list-item .content>.title,
+#error-wrap .error-content .error-info .error_subtitle,
+#post-info .post-title, #recent-posts>.recent-post-item>.recent-post-info>.article-title,
+#recent-posts>.recent-post-item>.recent-post-info>.content,
+.article-sort-item-title, .limit-more-line,
+.relatedPosts>.relatedPosts-list .content .title,
+figure.gallery-group .gallery-group-name,
 figure.gallery-group p {
    display: -webkit-box;
    overflow: hidden;
--- a/templates/modules/widgets/page.html
+++ b/templates/modules/widgets/page.html
@ -6,38 +6,48 @@
    @param  path       '/path/page/n' 中的 `/path` 需要保留 `/`
    @param  pageInfo   Halo类型UrlContextListResult<ListedPostVo>
 -->
-    <nav id="pagination" th:fragment="page(path,pageInfo)">
-        <div class="pagination">
+<nav id="pagination" th:fragment="page(path,pageInfo)">
+    <div class="pagination">

-            <!-- 页码按钮 -->
-            <th:block th:if="${pageInfo.page > 3}">
-                <a class="page-number" th:href="${path+'/page/1'}" th:text="1"></a>
-                <span class="space" th:if="${pageInfo.page != 4}">…</span>
-            </th:block>
+        <!-- 页码按钮 -->
+        <th:block th:if="${pageInfo.page > 3}">
+            <a class="page-number" th:href="${path+'/'}" th:text="1"></a>
+            <span class="space" th:if="${pageInfo.page != 4}">…</span>
+        </th:block>

-            <th:block th:each="index:${#numbers.sequence(pageInfo.page-2,pageInfo.page+2)}">
-                <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="${path+'/page/'+index}" th:text="${index}"></a>
-            </th:block>
+        <th:block th:each="index:${#numbers.sequence(pageInfo.page-2,pageInfo.page+2)}">
+            <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') ? path+'/' : path+'/page/'+index}"
+               th:text="${index}"></a>
+        </th:block>

-            <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:text="${pageInfo.totalPages}"></a>
-            </th:block>
-           
-            <!-- 翻页按钮 -->
-            <a class="extend prev" rel="prev"  th:if="${pageInfo.hasPrevious}" th:href="${pageInfo.prevUrl}" data-pjax-state="">
-                <i class="fas fa-chevron-left fa-fw"></i>
-                <div class="pagination_tips_prev">上页</div>
+        <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:text="${pageInfo.totalPages}"></a>
+        </th:block>
+
+        <!-- 翻页按钮 -->
+        <a class="extend prev" rel="prev" th:if="${pageInfo.hasPrevious}" th:href="${pageInfo.prevUrl}"
+           data-pjax-state="">
+            <i class="haofont hao-icon-chevron-left fa-fw"></i>
+            <div class="pagination_tips_prev">上页</div>
+        </a>
+
+        <a class="extend next" rel="next" th:if="${pageInfo.hasNext}" th:href="${pageInfo.nextUrl}" data-pjax-state="">
+            <div class="pagination_tips_next">下页</div>
+            <i class="haofont hao-icon-chevron-right fa-fw"></i>
+        </a>
+        <div th:if="${pageInfo.totalPages > 2}" class="toPageGroup">
+            <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()"
+               data-pjax-state=""><i class="haofont hao-icon-angles-right"></i>
            </a>
-            
-            <a class="extend next" rel="next"  th:if="${pageInfo.hasNext}" th:href="${pageInfo.nextUrl}" data-pjax-state="">
-                <div class="pagination_tips_next">下页</div>
-                <i class="fas fa-chevron-right fa-fw"></i>
-            </a>
-
        </div>
-    </nav>
+
+    </div>
+</nav>

 </html>