Files
ulthon_information/view/index/post/read.html
2021-01-03 21:52:54 +08:00

271 lines
8.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{$post.title}</title>
<meta name="description" content="{$post.desc|default=$post.title}" />
{include file='common/_require'/}
<link rel="stylesheet" href="/static/lib/quill/quill.snow.css">
<link rel="stylesheet" href="/static/lib/highlight/styles/vs.css">
<script src="/static/lib/highlight/highlight.pack.js"></script>
<script src="/static/lib/clipboard/clipboard.js"></script>
<style>
.ql-editor {
padding: unset
}
.share {
cursor: pointer;
}
.share i {
font-size: 15px;
}
.share-tips-options div:hover {
opacity: 0.8;
}
.share-tips-options div {
height: 22px;
line-height: 22px;
white-space: nowrap;
text-align: center;
font-size: 12px;
border: none;
border-radius: 2px;
cursor: pointer;
}
.post-container {
margin-top: 15px;
}
.post-item {
display: flex;
justify-content: flex-start;
align-items: flex-start;
}
.post-item .left img {
width: 60px;
}
.post-item .right {
margin-left: 15px;
}
.post-item .content {
margin-top: 5px;
}
</style>
</head>
<body>
<div class="layui-container main-container">
<div class="layui-row layui-col-space12">
{include file='common/_left'/}
<div class="layui-col-md7">
<div class="main-container">
<div class="content-container">
<h1 class="title">
{$post.title}
</h1>
<div class="info">
<span>{$post->publish_time_text}</span>
<span>{:get_system_config('default_author')}</span>
<span class="share"><i class="layui-icon layui-icon-share"></i></span>
</div>
<div class="desc">
{$post.desc_html|raw}
</div>
{if !empty($post.jump_to_url) && $post.jump_to_url_status != 0}
<div class="jump-container">
<a href="{$post.jump_to_url}" class="layui-btn jump-btn" target="_blank">{$post.jump_to_btn_title|default='立即跳转'}</a>
</div>
{if $post.jump_to_url_status == 2 }
<script>
window.layuiInitSuccess.push(function () {
var isJumped = false;
var countDownNum = 5;
var closeJump = false;
var jumpUrl = '{$post.jump_to_url}'
window.layerJump = layer.confirm('即将自动打开新页面(倒计时<span class="jump-count-dowm">5</span>秒)', {
btn: ['立即跳转', '取消'],
offset: ['20%']
}
, function (index, layero) {
//按钮【按钮一】的回调
window.open(jumpUrl)
isJumped = true
layer.close(index)
}, function (index) {
//按钮【按钮二】的回调
closeJump = true
})
window.timerJump = setInterval(() => {
countDownNum--
$('.jump-count-dowm').text(countDownNum)
if (countDownNum <= 0) {
clearInterval(window.timerJump)
layer.close(window.layerJump)
if (!closeJump && !isJumped) {
window.open(jumpUrl)
}
}
}, 1000);
})
</script>
{/if}
{/if}
<div class="ql-snow">
<article class="ql-editor">{$post->content_html|raw}</article>
</div>
<div class="copyright">
{:get_system_config('post_copyright')}
</div>
</div>
<div class="post-container">
<fieldset class="layui-elem-field layui-field-title">
<legend>评论</legend>
<div class="layui-field-box">
<div class="post-list">
{volist name='$post.comments' id='comment'}
<div class="post-item" id="comment-{$comment.id}" data-id="{$comment.id}">
<div class="left">
<img src="{$comment.user.avatar}" alt="">
</div>
<div class="right">
<div>{$comment.user.nickname|default=$comment.user.account}</div>
<div class="content">{$comment.content}</div>
{if !empty($user_info) && $user_info.uid == $comment.user_uid }
<div>
<div class="layui-btn layui-btn-xs delete" style="cursor: pointer;">删除</div>
</div>
{/if}
</div>
</div>
{/volist}
</div>
<div class="post-main">
<form action="" class="layui-form">
<input type="hidden" name="post_id" value="{$post.id}">
<div class="layui-form-item layui-form-text">
<textarea name="content" placeholder="请输入内容" class="layui-textarea" autocomplete="off"></textarea>
</div>
<div class="layui-form-item">
<button class="layui-btn" type="submit" lay-filter="postComment" lay-submit>发表评论</button>
{empty name='Request.session.user_uid'}
<a class="layui-word-aux" href="{$login_url|default=''}">点击登录</a>
{else /}
<a href="{:get_system_config('user_hub_host')}" target="_blank" class="layui-word-aux">{$user_info.nickname|default=$user_info.account}</a>
<a href="{:url('index/Logout',['back_url'=>$post.read_url])}" class="layui-word-aux">退出</a>
{/empty}
</div>
</form>
</div>
</div>
</fieldset>
</div>
</div>
</div>
{include file='common/_right'/}
</div>
</div>
<div class="share-tips-options" style="display: none;">
<div class="text" data-clipboard-text="{$post.share_text}">分享文案</div>
</div>
<script>
layui.use(['form'], function () {
var form = layui.form
form.on('submit(postComment)', function (data) {
$.post('{:url("PostComment/save")}',
data.field
, function (result) {
if (result.code == 0) {
layer.msg('发表评论成功')
setTimeout(() => {
location.reload()
}, 1200);
} else {
layer.msg(result.msg)
}
})
return false;
})
})
$('.post-item .delete').click(function () {
var item = this;
var parent = $(item).closest('.post-item')
layer.confirm('确定要删除吗?', function () {
$.post('{:url("PostComment/delete")}', {
id: $(parent).data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
setTimeout(() => {
location.reload()
}, 1200);
} else {
layer.msg(result.msg)
}
})
})
})
$('.ql-editor pre').each(function (n, e) {
hljs.highlightBlock(e);
})
$('.share').click(function () {
var html = $('.share-tips-options').prop("outerHTML")
window.layerTips = layer.tips(html, this, {
tips: 2,
time: 0,
skin: 'share-tips',
success: function (layero) {
console.log(layero);
$(layero.css('top', $(layero).offset()['top'] - 15))
$(layero).find('.share-tips-options').show()
}
})
})
$(document).click(function (e) {
if ($(e.target).closest('.share').length == 0 && $(e.target).closest('.share-tips').length == 0) {
layer.close(window.layerTips)
}
})
var clipboard = new ClipboardJS('.share-tips .share-tips-options .text')
clipboard.on('success', function (e) {
layer.msg('复制成功')
});
</script>
</body>
</html>