更新

assets/css/joe.global.scss

@@ -983,6 +983,7 @@
         text-shadow: var(--text-shadow);
         text-align: center;
         margin-bottom: 15px;
+        word-break: break-all;
     }
     &__count {
         position: relative;
@@ -1370,6 +1371,88 @@
             }
         }
     }
+    &__copyright {
+        padding-top: 15px;
+        border-top: 1px solid var(--classB);
+        .content {
+            background: var(--classD);
+            padding: 10px 15px;
+            border-radius: 4px;
+            .item {
+                display: flex;
+                align-items: center;
+                color: var(--minor);
+                line-height: 26px;
+                white-space: nowrap;
+                .icon {
+                    width: 18px;
+                    height: 18px;
+                    min-width: 18px;
+                    min-height: 18px;
+                    margin-right: 8px;
+                }
+                .link {
+                    color: var(--minor);
+                    &:hover {
+                        color: var(--theme);
+                    }
+                }
+                .text {
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+            }
+        }
+    }
+    &__related {
+        padding-top: 15px;
+        &-title {
+            border-left: 3px solid var(--theme);
+            padding-left: 15px;
+            font-size: 18px;
+            margin-bottom: 15px;
+            color: var(--main);
+        }
+        &-list {
+            display: flex;
+            margin: 0 -7.5px;
+            .item {
+                width: 25%;
+                padding: 0 7.5px;
+                .link {
+                    display: block;
+                    transition: transform 0.25s;
+                    &:hover {
+                        transform: translate3d(0, -3px, 0);
+                    }
+                    .inner {
+                        position: relative;
+                        .image {
+                            width: 100%;
+                            height: 125px;
+                            object-fit: cover;
+                            border-radius: 4px 4px 0 0;
+                            transition: opacity 0.35s;
+                        }
+                        .title {
+                            font-size: 13px;
+                            white-space: nowrap;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            text-align: center;
+                            padding: 0 8px;
+                            line-height: 32px;
+                            color: var(--minor);
+                            background: var(--classD);
+                            border-radius: 0 0 5px 5px;
+                            transition: background 0.35s;
+                        }
+                    }
+                }
+            }
+        }
+    }
 }
 
 @keyframes box_shadow {

assets/css/joe.index.scss

@@ -91,7 +91,6 @@
                     display: block;
                     .inner {
                         position: relative;
-                        cursor: pointer;
                         &:hover {
                             .image {
                                 opacity: 0.85;

assets/css/joe.post.css

@@ -1 +1 @@
-.joe_bread{padding-top:15px}.joe_bread__bread{display:flex;align-items:center}.joe_bread__bread .line{color:var(--seat);padding:0 8px}.joe_bread__bread .item{color:var(--minor);white-space:nowrap}.joe_bread__bread .item .link{color:var(--routine);transition:color 0.35s}.joe_bread__bread .item .link:hover{color:var(--theme)}.joe_bread__bread .item .icon{width:15px;height:15px;min-width:15px;min-height:15px;fill:var(--routine);margin-right:2px}.joe_bread__bread .item:first-child{display:flex;align-items:center}
+.joe_bread{padding-top:15px}.joe_bread__bread{display:flex;align-items:center}.joe_bread__bread .line{color:var(--seat);padding:0 8px}.joe_bread__bread .item{color:var(--minor);white-space:nowrap}.joe_bread__bread .item .link{color:var(--routine);transition:color 0.35s}.joe_bread__bread .item .link:hover{color:var(--theme)}.joe_bread__bread .item .icon{width:15px;height:15px;min-width:15px;min-height:15px;fill:var(--routine);margin-right:2px}.joe_bread__bread .item:first-child{display:flex;align-items:center}.joe_post__page{display:flex;align-items:center}

assets/css/joe.post.scss

@@ -32,3 +32,13 @@
         }
     }
 }
+
+.joe_post {
+    &__page {
+        display: flex;
+        align-items: center;
+        &-item{
+            
+        }
+    }
+}

assets/js/joe.global.js

@@ -106,7 +106,7 @@ window.Joe = function () {
         $.ajax({
             url: Joe.prototype.BASE_API,
             type: 'POST',
-            data: { routeType: 'ranking' },
+            data: { routeType: 'aside_ranking' },
             success(res) {
                 $('.joe_aside__item.ranking .joe_aside__item-title .text').html(res.title);
                 let htmlStr = '';
@@ -152,7 +152,7 @@ window.Joe = function () {
                 $.ajax({
                     url: Joe.prototype.BASE_API,
                     type: 'POST',
-                    data: { routeType: 'list', page: queryData.page, pageSize: queryData.pageSize, type: queryData.type },
+                    data: { routeType: 'publish_list', page: queryData.page, pageSize: queryData.pageSize, type: queryData.type },
                     success(res) {
                         if (res.data.length === 0) {
                             $('.joe_load').remove();
@@ -239,7 +239,7 @@ window.Joe = function () {
         $.ajax({
             url: Joe.prototype.BASE_API,
             type: 'POST',
-            data: { routeType: 'record', site: window.location.href },
+            data: { routeType: 'baidu_record', site: window.location.href },
             success(res) {
                 if (res.data && res.data === '已收录') {
                     $('#Joe_Baidu_Record').css('color', '#67C23A');
@@ -270,7 +270,7 @@ window.Joe = function () {
                 $.ajax({
                     url: Joe.prototype.BASE_API,
                     type: 'POST',
-                    data: { routeType: 'views', cid },
+                    data: { routeType: 'handle_views', cid },
                     success(res) {
                         if (res.code !== 1) return;
                         $('#Joe_Article_Views').html(`${res.data.views} 阅读`);
@@ -298,7 +298,7 @@ window.Joe = function () {
                 $.ajax({
                     url: Joe.prototype.BASE_API,
                     type: 'POST',
-                    data: { routeType: 'agree', cid, type: flag ? 'disagree' : 'agree' },
+                    data: { routeType: 'handle_agree', cid, type: flag ? 'disagree' : 'agree' },
                     success(res) {
                         if (res.code !== 1) return;
                         $('.joe_detail__agree .text').html(res.data.agree);
@@ -327,7 +327,7 @@ window.Joe = function () {
             });
         }
     }
-
+    
     new LazyLoad('.lazyload');
 };
 
@@ -339,5 +339,11 @@ Joe.prototype.decrypt = str => decodeURIComponent(escape(window.atob(str)));
 Joe.prototype.BASE_API = '/index.php/joe/api';
 /* 是否是手机 */
 Joe.prototype.IS_MOBILE = /windows phone|iphone|android/gi.test(window.navigator.userAgent);
+/* 随机值 */
+Joe.prototype.getRandomIntInclusive = (min, max) => {
+    min = Math.ceil(min);
+    max = Math.floor(max);
+    return Math.floor(Math.random() * (max - min + 1) + min);
+};
 
 $(document).ready(() => Joe());

core/core.php

@@ -10,19 +10,19 @@ function themeInit($self)
     $path_info = $self->request->getPathinfo();
     if ($path_info === "/joe/api") {
         switch ($self->request->routeType) {
-            case 'ranking':
+            case 'aside_ranking':
                 _getRanking($self);
                 break;
-            case 'list':
+            case 'publish_list':
                 _getPost($self);
                 break;
-            case 'record':
+            case 'baidu_record':
                 _getRecord($self);
                 break;
-            case 'views':
+            case 'handle_views':
                 _handleViews($self);
                 break;
-            case 'agree':
+            case 'handle_agree':
                 _handleAgree($self);
                 break;
         };
@@ -35,6 +35,19 @@ function _getVersion()
     return "1.0.0";
 };
 
+/* 获取加密的文章标题 */
+function _getEncryptionTitle($item, $type = true)
+{
+    $title = "";
+    if ($item->hidden) {
+        $db = Typecho_Db::get();
+        $title = $db->fetchRow($db->select('title')->from('table.contents')->where('cid = ?', $item->cid))['title'];
+    } else {
+        $title = $item->title;
+    }
+    if ($type) echo $title;
+    else return $title;
+}
 
 /* 过滤文章内容 */
 function _parseContent($post)

core/route.php

@@ -38,7 +38,7 @@ function _getPost($self)
             "image" => _getThumbnail($item, false),
             "time" => date('Y-m-d', $item->created),
             "created" => date('Y年m月d日', $item->created),
-            "title" => $item->title,
+            "title" => _getEncryptionTitle($item, false),
             "abstract" => _getAbstract($item, false),
             "category" => $item->categories,
             "views" => _getViews($item, false),
@@ -122,4 +122,4 @@ function _getRecord($self)
     } else {
         $self->response->throwJson(array("data" => "已收录"));
     }
-}
+}

index.php

@@ -73,14 +73,14 @@
                             <?php if (sizeof($recommend) === 2) : ?>
                                 <div class="joe_index__banner-recommend <?php echo sizeof($carousel) === 0 ? 'noswiper' : '' ?>">
                                     <?php foreach ($recommend as $cid) : ?>
-                                        <?php $this->widget('Widget_Archive', 'pageSize=1&type=post', 'cid=' . $cid)->to($item); ?>
+                                        <?php $this->widget('Widget_Archive@' . $cid, 'pageSize=1&type=post', 'cid=' . $cid)->to($item); ?>
                                         <figure class="item">
-                                            <a class="thumbnail" href="<?php $item->permalink() ?>" title="<?php $item->title() ?>">
+                                            <a class="thumbnail" href="<?php $item->permalink() ?>" title="<?php _getEncryptionTitle($item) ?>">
-                                                <img class="lazyload" onerror="<?php _getLazyload() ?>" src="<?php _getLazyload(); ?>" data-original="<?php _getThumbnail($item); ?>" alt="<?php $item->title() ?>" width="100%" />
+                                                <img class="lazyload" onerror="<?php _getLazyload() ?>" src="<?php _getLazyload(); ?>" data-original="<?php _getThumbnail($item); ?>" alt="<?php _getEncryptionTitle($item) ?>" width="100%" />
                                             </a>
                                             <figcaption class="information">
                                                 <span class="information_type">推荐</span>
-                                                <span class="information_title"><?php $item->title() ?></span>
+                                                <span class="information_title"><?php _getEncryptionTitle($item) ?></span>
                                             </figcaption>
                                         </figure>
                                     <?php endforeach; ?>
@@ -127,8 +127,9 @@
                         </div>
                     <?php endif; ?>
 
-                    <!-- Index Title -->
                     <div class="joe_index__title">
+                    
+                        <!-- Index Title -->
                         <ul class="joe_index__title-title">
                             <li class="item" data-type="created">最新文章</li>
                             <li class="item" data-type="commentsNum">评论最多</li>

post.php

@@ -30,8 +30,12 @@
         </div>
 
         <div class="joe_container">
-            <div class="joe_main">
+            <div class="joe_main joe_post">
                 <?php $this->need('public/article.php'); ?>
+                <ul class="joe_post__page">
+                    <?php $this->theNext('<li class="joe_post__page-item">%s</li>', '', ['title' => '上一篇']); ?>
+                    <?php $this->thePrev('<li class="joe_post__page-item">%s</li>', '', ['title' => '下一篇']); ?>
+                </ul>
             </div>
             <?php $this->need('public/aside.php'); ?>
         </div>

public/article.php

@@ -6,7 +6,7 @@
             <?php endforeach; ?>
         </div>
     <?php endif; ?>
-    <h1 class="joe_detail__title"><?php $this->title() ?></h1>
+    <h1 class="joe_detail__title"><?php _getEncryptionTitle($this) ?></h1>
     <div class="joe_detail__count">
         <div class="joe_detail__count-information">
             <img class="avatar" src="<?php _getAvatarByMail($this->author->mail) ?>" alt="<?php $this->author(); ?>" />
@@ -53,4 +53,63 @@
             <span class="text"><?php _getAgree($this) ?></span>
         </div>
     </div>
+    <div class="joe_detail__copyright">
+        <div class="content">
+            <div class="item">
+                <svg class="icon" width="18" height="18" viewBox="0 0 1024 1024">
+                    <path d="M614.72 554.538c-49.086-6.399-100.27-2.1-149.256-2.1-119.465 0-209.04 95.972-206.84 215.437 0 17.095 8.498 31.99 23.493 40.488 14.896 10.697 34.09 14.896 53.285 17.095 61.882 6.398 123.664 6.398 198.342 6.398 40.488 0 93.872-2.1 142.858-4.298 27.692 0 53.284-4.3 78.877-14.896 19.194-8.498 29.89-19.194 31.99-40.488 8.498-104.57-72.478-204.84-172.75-217.636zM680.8 375.39c0-87.474-74.678-162.053-164.251-162.053-89.574 0-162.053 74.679-162.053 162.053-2.1 87.474 74.678 164.252 162.053 164.252 89.673 0 164.252-74.678 164.252-164.252z" fill="#FFFFFF"></path>
+                    <path d="M512.35 0C228.733 0 0.5 228.233 0.5 511.85s228.233 511.85 511.85 511.85 511.85-228.233 511.85-511.85S795.967 0 512.35 0z m275.12 772.074c-2.1 21.294-12.797 31.99-31.991 40.488-25.593 10.697-51.185 14.896-78.877 14.896-49.086 2.099-102.37 4.298-142.858 4.298-74.678 0-136.46 0-198.342-6.398-19.195-2.1-38.389-6.398-53.285-17.095-14.895-8.497-23.493-23.493-23.493-40.488-2.1-119.465 87.475-215.437 206.84-215.437 49.085 0 100.27-4.299 149.256 2.1 100.27 12.896 181.247 113.166 172.75 217.636zM354.495 375.39c0-87.474 72.479-162.053 162.053-162.053S680.8 288.016 680.8 375.39c0 89.574-74.679 164.252-164.252 164.252-87.375 0-164.152-76.778-162.053-164.252z" fill="#249FF8"></path>
+                </svg>
+                <span>版权属于：</span>
+                <p class="text"><?php $this->options->title() ?></p>
+            </div>
+            <div class="item">
+                <svg class="icon" width="18" height="18" viewBox="0 0 1024 1024">
+                    <path d="M511.854421 0a511.854421 511.854421 0 1 0 512.145579 511.854421A511.854421 511.854421 0 0 0 511.854421 0z" fill="#39B54A"></path>
+                    <path d="M576.491328 630.355417l-116.462895 116.462894a129.56497 129.56497 0 0 1-182.555587 0l-2.0381-2.038101a128.982656 128.982656 0 0 1 0-182.26443l81.232868-81.232868a179.644015 179.644015 0 0 0 13.102076 70.460051l-52.69946 52.408302a69.877737 69.877737 0 0 0 0 98.702303l2.038101 2.038101a70.168894 70.168894 0 0 0 98.702303 0l116.462895-116.462894a69.877737 69.877737 0 0 0 0-98.702304l-2.038101-2.0381a69.586579 69.586579 0 0 0-13.975547-10.772818l42.508956-42.508956a128.109184 128.109184 0 0 1 13.102076 11.355132l2.0381 2.0381a129.273813 129.273813 0 0 1 0 182.26443z" fill="#FFFFFF"></path>
+                    <path d="M746.235997 460.901905l-81.232869 81.232869a179.352858 179.352858 0 0 0-13.102076-70.460051l52.69946-52.408303a69.877737 69.877737 0 0 0 0-98.702303l-2.038101-2.038101a69.877737 69.877737 0 0 0-98.702303 0l-116.462894 116.462895a69.877737 69.877737 0 0 0 0 98.702303l2.0381 2.038101a68.421951 68.421951 0 0 0 13.975548 10.772817l-42.508957 42.508957a136.552744 136.552744 0 0 1-13.102076-11.355132l-2.0381-2.038101a128.982656 128.982656 0 0 1 0-182.26443l116.462894-116.462894a129.56497 129.56497 0 0 1 182.555587 0l2.038101 2.0381a128.982656 128.982656 0 0 1 0 182.26443z" fill="#FFFFFF"></path>
+                </svg>
+                <span>本文链接：</span>
+                <p class="text">
+                    <a class="link" href="<?php $this->permalink() ?>" target="_blank" rel="noopener noreferrer nofollow"><?php $this->permalink() ?></a>
+                    （转载时请注明本文出处及文章链接）
+                </p>
+            </div>
+            <div class="item">
+                <svg class="icon" width="18" height="18" viewBox="0 0 1024 1024">
+                    <path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z" fill="#F3B243"></path>
+                    <path d="M630.784 323.584m-90.112 0a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0Z" fill="#FFFFFF"></path>
+                    <path d="M630.784 688.128m-90.112 0a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0Z" fill="#FFFFFF"></path>
+                    <path d="M319.488 512m-90.112 0a90.112 90.112 0 1 0 180.224 0 90.112 90.112 0 1 0-180.224 0Z" fill="#FFFFFF"></path>
+                    <path d="M341.037056 480.370688l257.343488-175.7184 27.713536 40.59136-257.339392 175.7184z" fill="#FFFFFF"></path>
+                    <path d="M349.052928 488.452096l252.854272 182.10816-28.725248 39.886848-252.874752-182.10816z" fill="#FFFFFF"></path>
+                </svg>
+                <span>作品采用：</span>
+                <p class="text">
+                    《
+                    <a class="link" href="//creativecommons.org/licenses/by-nc-sa/4.0/deed.zh" target="_blank" rel="noopener noreferrer nofollow">署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)</a>
+                    》许可协议授权
+                </p>
+            </div>
+        </div>
+    </div>
+    <?php $this->related(4)->to($item); ?>
+    <?php if ($item->have()) : ?>
+        <div class="joe_detail__related">
+            <h5 class="joe_detail__related-title">相关推荐</h5>
+            <ul class="joe_detail__related-list">
+                <?php while ($item->next()) : ?>
+                    <li class="item">
+                        <a class="link" href="<?php $item->permalink(); ?>" title="<?php $item->title(); ?>">
+                            <figure class="inner">
+                                <img class="image lazyload" onerror="<?php _getLazyload() ?>" src="<?php _getLazyload(); ?>" data-original="<?php _getThumbnail($item); ?>" alt="<?php $item->title(); ?>" />
+                                <figcaption class="title"><?php $item->title(); ?></figcaption>
+                            </figure>
+                        </a>
+                    </li>
+                <?php endwhile; ?>
+            </ul>
+        </div>
+    <?php endif; ?>
+
 </div>