<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'post',title = ${post.spec.title + ' | ' + site.title}, head = ~{::head})}">
<th:block th:fragment="head">
<th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${post.spec.title},
_permalink = ${post.status.permalink},
_cover = ${post.spec.cover},
_excerpt = ${post.status.excerpt},
_type = 'article')}"></th:block>
</th:block>
<th:block th:fragment="content">
<div class="post" id="body-wrap">
<header class="post-bg" id="page-header">
<nav th:replace="~{modules/nav :: nav(title = ${post.spec.title})}"></nav>
<div class="coverdiv loaded" id="coverdiv">
<img alt="cover" class="nolazyload" id="post-cover"
th:src="${#strings.isEmpty(post.spec.cover) ? theme.config.layout.postRandomImg : post.spec.cover}">
</div>
<div id="post-info">
<div id="post-firstinfo">
<div class="meta-firstline">
<!-- 这里要跳转到版权页 -->
<th:block th:with="copyrightUrl =${#annotations.get(post, 'copyrightUrl')}"
th:if="${not #strings.isEmpty(#annotations.get(post, 'copyrightEnable')) ?
#annotations.get(post, 'copyrightEnable') == 'true' : theme.config.post.copyrights.enable}">
<a class="post-meta-original"
title="该文章为原创文章，注意版权协议"
th:if="${#strings.equals(#annotations.getOrDefault(post, 'copyrightType','original'),'original')}"
th:href="@{${not #strings.isEmpty(copyrightUrl) ? copyrightUrl :
not #strings.isEmpty(theme.config.post.copyrights.originalUrl) ? theme.config.post.copyrights.originalUrl : '#'}}"
>原创</a>
<a class="post-meta-original"
title="该文章为转载文章，版权归原作者所有"
th:if="${#strings.equals(#annotations.getOrDefault(post, 'copyrightType','original'),'reprint')}"
th:href="@{${not #strings.isEmpty(copyrightUrl) ? copyrightUrl :
not #strings.isEmpty(theme.config.post.copyrights.originalUrl) ? theme.config.post.copyrights.reprintUrl : '#'}}"
>转载</a>
</th:block>
<span class="post-meta-categories" th:each="category : ${post.categories}"
th:if="${not #lists.isEmpty(post.categories)}">
<a class="post-meta-categories" th:href="@{${category.status.permalink}}"
th:text="${category.spec.displayName}" th:title="${category.spec.displayName}">
</a>
</span>
<div class="tag_share" th:if="${not #lists.isEmpty(post.tags)}">
<div class="post-meta__tag-list">
<a class="post-meta__tags" th:each="tag : ${post.tags}"
th:href="@{${tag.status.permalink}}"
th:title="${tag.spec.displayName}">
<span class="tags-name tags-punctuation">[[${tag.spec.displayName}]]</span>
</a>
</div>
</div>
</div>
</div>
<h1 class="post-title" th:text="${post.spec.title}"></h1>
<div id="post-meta">
<div class="meta-secondline">
<span class="post-meta-author" data-flag-title="文章作者" title="文章作者">
<i class="haofont hao-icon-zuozhe post-meta-icon"></i>[[${post.owner.displayName}]]
</span>
<span class="post-meta-wordcount"
th:with="wordCount = ${#strings.length(post.content.content)}">
<i class="haofont hao-icon-file-word post-meta-icon" title="字数"></i>
<span class="post-meta-label">字数:</span>
<span class="word-count" th:text="${{wordCount}}"></span>
<span class="post-meta-separator"></span>
<i class="haofont hao-icon-clock post-meta-icon" title="阅读耗时"></i>
<span class="post-meta-label">阅读耗时:</span>
<span>[[${wordCount / 400}]] 分钟</span>
</span>
<span class="post-meta-date">
<i class="haofont hao-icon-calendar-days post-meta-icon"></i>
<time th:attr="datetime=${#dates.format(post.spec.publishTime, 'yyyy-MM-dd')}"
th:text="${#dates.format(post.spec.publishTime,'yyyy/MM/dd')}"
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd HH:mm:ss')}">
</time>
</span>
<span class="post-meta-date" th:if="${theme.config.post.update_time}">
<i class="haofont hao-icon-pencil post-meta-icon" title="最后更新时间"></i>
<time th:attr="datetime=${#dates.format(post.status.lastModifyTime, 'yyyy-MM-dd')}"
th:text="${#dates.format(post.status.lastModifyTime,'yyyy/MM/dd')}"
th:title="${#dates.format(post.status.lastModifyTime,'yyyy-MM-dd HH:mm:ss')}">
</time>
</span>
<span th:with="syncStatus=${#strings.isEmpty(#annotations.get(post, 'sync_status')) ? '未同步': #annotations.get(post, 'sync_status')}"
class="post-meta-wechat" th:title=" ${pluginFinder.available('plugin-platforms-sync') && (syncStatus == '同步更新文章成功' || syncStatus == '同步上传文章成功') ? '该文章已在公众号中更新' : '该文章在博客首发'}">
<th:block th:unless="${pluginFinder.available('plugin-platforms-sync') && (syncStatus == '同步更新文章成功' || syncStatus == '同步上传文章成功')}">
<i class="haofont hao-icon-rss post-meta-icon"></i>博客独享
</th:block>
<th:block th:if="${pluginFinder.available('plugin-platforms-sync') && (syncStatus == '同步更新文章成功' || syncStatus == '同步上传文章成功')}">
<i class="haofont hao-icon-weixin1 post-meta-icon"></i>公众号同步
</th:block>
</span>
<a class="post-meta-pv" data-flag-title="热度"
title="热度" >
<i class="haofont hao-icon-fire post-meta-icon"></i>
<span class="post-meta-label">热度:</span>
<span id="visit" th:text="${post.stats.visit}"></span>
</a>
<a th:if="${post.spec.allowComment && #strings.contains('Twikoo,Artalk,commentWidget',theme.config.comments.use)}"
class="post-meta-commentcount" data-flag-title="评论数"
title="评论数"
href="#post-comment">
<i class="haofont hao-icon-chat--fill post-meta-icon" style="font-size: 17px;"></i>
<span class="post-meta-label">评论:</span>
<span th:if="${#strings.equals(theme.config.comments.use, 'commentWidget')}"
id="comment-count" th:text="${post.stats.comment}">
<i class="haofont hao-icon-spinner fa-spin"></i>
</span>
<span th:if="${#strings.equals(theme.config.comments.use, 'Twikoo')}"
id="twikoo-count">
<i class="haofont hao-icon-spinner fa-spin"></i>
</span>
<span th:if="${#strings.equals(theme.config.comments.use, 'Artalk')}"
id="ArtalkCount">
<i class="haofont hao-icon-spinner fa-spin"></i>
</span>
</a>
<a class="post-meta-editor" sec:authorize="isAuthenticated()" data-flag-title="编辑文章"
title="编辑文章"
th:attr="onclick='javascript:window.open(\''+ '/console/posts/editor?name='+${post.metadata.name}+'&returnToView=true\''+ ',' +'\'_self'+'\')'">
<i style="margin-top: 2px;" class="haofont hao-icon-bianji post-meta-icon"></i>
<span>编辑</span>
</a>
</div>
</div>
</div>
<section class="main-hero-waves-area waves-area">
<svg class="waves-svg" preserveAspectRatio="none" shape-rendering="auto" viewBox="0 24 150 28"
xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
<defs>
<path
d="M -160 44 c 30 0 58 -18 88 -18 s 58 18 88 18 s 58 -18 88 -18 s 58 18 88 18 v 44 h -352 Z"
id="gentle-wave"></path>
</defs>
<g class="parallax">
<use href="#gentle-wave" x="48" y="0"></use>
<use href="#gentle-wave" x="48" y="3"></use>
<use href="#gentle-wave" x="48" y="5"></use>
<use href="#gentle-wave" x="48" y="7"></use>
</g>
</svg>
</section>
</header>
<main class="layout" id="content-inner" th:classappend="${theme.config.sidebar.location}">
<div id="post">
<!-- 文章ai摘要 -->
<div class="post-ai" th:if="${not #strings.isEmpty(#annotations.get(post, 'ai')) ?
#annotations.get(post, 'ai') == 'true' : theme.config.post.aiDescription.aiDescriptionEnable}">
<div class="ai-title"><i class="haofont hao-icon-bilibili"></i>
<div class="ai-title-text">AI-摘要</div>
<div th:if="${theme.config.post.aiDescription.switchBtn}" id="ai-Toggle">切换</div>
<i class="haofont hao-icon-arrow-rotate-right"></i>
<div th:if="${#strings.equals(theme.config.post.aiDescription.mode, 'local')}" class="ai-tag" id="ai-tag">[[${theme.config.post.aiDescription.gptName}]] GPT</div>
<div th:if="${#strings.equals(theme.config.post.aiDescription.mode, 'tianli')}" class="ai-tag" id="ai-tag">Tianli GPT</div>
</div>
<div class="ai-explanation" style="display: block;">AI初始化中...</div>
<div class="ai-btn-box">
<div class="ai-btn-item">介绍自己</div>
<div class="ai-btn-item">生成本文简介</div>
<div class="ai-btn-item">推荐相关文章</div>
<div class="ai-btn-item">前往主页</div>
<div class="ai-btn-item" id="go-tianli-blog">前往tianli博客</div>
</div>
</div>
<!-- 文章内容 -->
<article th:class="'post-content '+${ theme.config.code.enable_line || pluginFinder.available('PluginPrismJS') ? 'line-numbers' : ''}" id="article-container">
<th:block th:if="${theme.config.post.passage_tips.enable}"
th:with="days=${(new java.util.Date().getTime()-post.status.lastModifyTime.toEpochMilli())/86400000}">
<div class="note simple warning" th:if="${days > #conversions.convert(theme.config.post.passage_tips.day, 'java.lang.Integer')}">
<p>
<th:block th:text="|本文最后更新于 ${#dates.format(post.status.lastModifyTime,'yyyy-MM-dd')}，|"/><th:block th:utext="${theme.config.post.passage_tips.content}"/>
</p>
</div>
</th:block>
<th:block th:utext="${post.content.content}"/>
</article>
<!-- 文章ai摘要 -->
<script data-pjax th:if="${not #strings.isEmpty(#annotations.get(post, 'ai')) ?
#annotations.get(post, 'ai') == 'true' : theme.config.post.aiDescription.aiDescriptionEnable}"
th:src="${assets_link + '/libs/gpt/post-ai.js'}"></script>
<!-- 版权声明 -->
<th:block th:replace="~{modules/post/copyright}"></th:block>
<nav class="pagination-post needEndHide" id="pagination"
th:with="postCursor = ${postFinder.cursor(post.metadata.name)},
postRandomImg=${#strings.contains(theme.config.layout.postRandomImg,'?') ? theme.config.layout.postRandomImg+'&' : theme.config.layout.postRandomImg+'?'}">
<div th:if="${postCursor.hasPrevious()}" th:class="${postCursor.hasNext()==false} ? 'prev-post pull-full ' : 'prev-post pull-left'">
<a th:if="${postCursor.hasPrevious()}" th:href="@{${postCursor.previous.status.permalink}}">
<img alt="cover" id="preimg" class="nolazyload"
th:with="img = ${#strings.isEmpty(postCursor.previous.spec.cover) ? postRandomImg+postCursor.previous.spec.title : postCursor.previous.spec.cover}"
th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="pagination-info">
<div class="label">上一篇</div>
<div class="prev_info" th:text="${postCursor.previous.spec.title}"></div>
</div>
</a>
</div>
<div th:if="${postCursor.hasNext()}" th:class="${postCursor.hasPrevious()==false} ? 'next-post pull-full ':'next-post pull-right'">
<a th:if="${postCursor.hasNext()}" th:href="@{${postCursor.next.status.permalink}}">
<img alt="cover" id="preimg" class="nolazyload"
th:with="img = ${#strings.isEmpty(postCursor.next.spec.cover) ? postRandomImg+postCursor.next.spec.title : postCursor.next.spec.cover}"
th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="pagination-info">
<div class="label">下一篇</div>
<div class="next_info" th:text="${postCursor.next.spec.title}"></div>
</div>
</a>
</div>
</nav>
<!-- 阅读建议 -->
<th:block th:replace="~{modules/post/relatedPosts}"/>
<hr>
<!--/* 评论组件 */-->
<th:block
th:replace="~{modules/comment :: comment(group = 'content.halo.run',
kind = 'Post',
name = ${post.metadata.name},
allowComment = ${post.spec.allowComment})}"/>
</div>
<!-- 侧栏 -->
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.postWidgets})}"></div>
</main>
<!-- 底部 -->
<footer th:replace="~{modules/footer}"/>
</div>
</th:block>
</html>