TaoLer/view/taoler/index/article/posts/detail.html
2023-07-03 12:50:57 +08:00

495 lines
20 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{extend name="public/base" /}
<!--seo-->
{block name="title"}{$article.title} - {$sysInfo.webname}{/block}
{block name="keywords"}{article:keywords /}{/block}
{block name="description"}{article:title /},{article:description /}{/block}
{block name="ogtitle"}<meta property="og:title" content="{article:title /} - {$sysInfo.webname}">{/block}
{block name="ogdescription"}<meta property="og:description" content="{article:title /},{$article.description ?: ''}" />{/block}
{block name="meta"}
<meta property="og:type" content="article"/>
<meta property="article:published_time" content="{$article.create_time|date='c'}"/>
<meta property="bytedance:published_time" content="{$article.create_time|date='c'}" />
<meta property="bytedance:lrDate_time" content="{$lrDate_time|date='c'}" />
<meta property="bytedance:updated_time" content="{$article.update_time|date='c'}" />
{/block}
{block name="link"} {/block}
{block name="column"}<div class="layui-hide-xs">{include file="/public/column" /}</div>{/block}
<!--body-->
{block name="content"}
<div class="layui-container">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8 content detail">
<div class="fly-panel detail-box">
{//标题}
<h1 style="color:{article:title_color /};">{article:title /}</h1>
{//图标}
<div class="fly-detail-info">
<span class="layui-badge layui-bg-green fly-detail-column">
{if (cookie('think_lang') == 'en-us')} {article:cate name="ename" /}
{else /} {article:cate name="name" /}
{/if}
</span>
{if ($article.is_top == 1)}<span class="layui-badge layui-bg-black">{:lang('top')}</span>{/if}
{if ($article.is_hot == 1)}<span class="layui-badge layui-bg-red">{:lang('hot')}</span>{/if}
<span id="LAY_jieAdmin" data-id="{article:id /}" data-colurl="{:url('collection/find')}"></span>
<span class="fly-list-nums">
<a href="#comment">
<i class="iconfont" title="{:lang('reply')}">&#xe60c;</i>{article:comment_num /}
</a>
<i class="iconfont" title="浏览">&#xe60b;</i>{article:pv /}
</span>
</div>
{//作者}
<div class="detail-about">
<a class="fly-avatar" href="{article:user name='link' /}">
<img src="{article:user name='user_img' /}" alt="{article:user name='name' /}">
{if($article.user.vip > 0)}<i class="iconfont icon-renzheng" title="认证信息"></i>{/if}
</a>
<div class="fly-detail-user">
<a href="{article:user name='link' /}" class="fly-link">
<cite>{article:auther}</cite>
</a>
<span class="layui-btn layui-btn-xs guanzhu" >关注</span>
</div>
<div class="detail-hits">
<!--span style="padding-right: 10px; color: #FF7200">悬赏60飞吻</span-->
<span class="post-time" data="{$article.create_time}" style="padding-top: 5px;"></span>
{:hook('ipShow',$article.user.city)}
</div>
</div>
<hr>
{//内容}
{:hook('taoplayerdiv')}
<div class="detail-body photos" id="content">{article:content}</div>
{//下载}
{if (($article.upzip !== '') || session('?user_name'))}
<div class="">
{notempty name="$article.upzip"}
<button type="button" class="layui-btn layui-btn-xs" id="zip-download"><i class="layui-icon layui-icon-download-circle"></i>{:lang('download files')}: {$article.downloads}次</button>
{/notempty}
</div>
{/if}
{//解密文件}
{empty name="passJieMi"}
{if($article.read_type == 1)}
<div id="jiemi" style="text-align:center">
<button type="button" class="layui-btn layui-btn-primary"><i class="layui-icon layui-icon-password" style="font-size: 30px; color: #FF5722;"></i> 阅读请解密 </button>
</div>
{/if}
{/empty}
{notempty name="tags"}
<div style="margin-top: 15px">标签
{volist name="tags" id="vo" }
<a href="{$vo.url}"><span class="layui-btn layui-btn-xs layui-btn-normal layui-btn-radius">{$vo.name}</span></a>
{/volist}
</div>
{/notempty}
<div style="margin: 20px 0px 15px 0px; color: rgb(130, 125, 125);">
<p style="line-height:200%; ">{$sysInfo.state|raw}</p>
</div>
<div style="margin-top: 20px;">本文链接:<a href="{$Request.domain}{$Request.url}">{$Request.domain}{$Request.url}</a></div>
<div class="detail-zan">
<span class="jieda-zan" type="zan" id="article-zan">
点赞 <i class="iconfont icon-zan"></i> <em>{:count($userZanList)}</em>
</span>
{volist name="userZanList" id="vo" }
<span><img src="{$vo.userImg}"></span>
{/volist}
</div>
</div>
{//评论}
<div class="fly-panel">
{if session('?user_id') AND ( config('taoler.config.is_reply') == 1 ) AND ( $article.is_reply == 1 )}
<div class="layui-form layui-form-pane">
<div class="layui-form-item layui-form-text">
<a name="comment"></a>
<div class="layui-input-block">
<textarea id="L_content" name="content" required lay-verify="required" placeholder="{:lang('please input the content')}" class="layui-textarea fly-editor"></textarea>
</div>
</div>
<div class="layui-form-item">
<input type="hidden" name="article_id" value="{$article.id}">
<button class="layui-btn" lay-filter="user-comment" lay-submit>{:lang('submit comments')}</button>
</div>
</div>
{/if}
</div>
{//评论内容}
<div class="fly-panel detail-box" id="flyReply">
<span style="font-size:18px;">评论 {$article.comments_count}</span>
<ul class="jieda" id="jieda">
{article:comment}
<li data-id="{comment:id /}" class="jieda-daan">
<div class="detail-about detail-about-reply">
<a class="fly-avatar" href="{comment:ulink /}">
<img src="{comment:uimg /}" alt="{comment:uname}">
</a>
<div class="fly-detail-user">
<a href="{comment:ulink /}" class="fly-link">
<cite>{comment:uname /}</cite>
</a>
{if condition="$article.user_id eq $comment.user_id"}<span>({:lang('poster')})</span>{/if}
<span>{comment:usign /}</span>
</div>
<div class="detail-hits">
<span class="post-time" data="{comment:time}"></span>{:hook('ipShow',$comment.user.city)}</span>
</div>
{//加密未解密评论不可查看}
{if($article.read_type == 0 || (($article.read_type == 1) && $passJieMi))}
<div class="detail-body jieda-body photos">{comment:content /}</div>
<div class="jieda-reply">
<span class="jieda-zan {if($comment.zan != 0)}zanok{/if}" type="zan">
<i class="iconfont icon-zan"></i><em>{comment:zan /}</em>
</span>
<span type="reply" data-pid="{comment:id /}" data-tid="{comment:uid /}"><i class="iconfont icon-svgmoban53"></i>{:lang('reply')}</span>
{//评论编辑删除采纳权限}
<div class="jieda-admin">
{if ((session('user_id') == $comment.user_id) && (getLimtTime($comment.create_time) < 2)) OR ($user.auth ?? '')}
<span type="edit" class="comment-edit" data-id="{comment:id /}">{:lang('edit')}</span>
<span type="del">{:lang('delete')}</span>
{/if}
</div>
{// 第二层回复}
{notempty name="$comment.children"}
{volist name="$comment.children" id="vo"}
<div class="layui-clear" style="margin:10px 0; padding: 10px; border: 1px solid #f0f0f0; background: #f6f6f6">
<a style="display: inline-block; float: left; width: 50px;"><img src="{$vo.user.user_img}" style="width: 30px; height: 30px; border-radius: 15px; object-fit: cover"></a>
<div style="float: left;width: calc(100% - 50px);">
<div>{$vo.user.name} {$vo.create_time|date='Y-m-d H:i'}</div>
<div class="detail-body jieda-body photos">{$vo.content|raw}</div>
<div class="jieda-reply">
<span class="jieda-zan {if($vo.zan != 0)}zanok{/if}" type="zan">
<i class="iconfont icon-zan"></i><em>{$vo.zan}</em>
</span>
<span type="reply" data-pid="{$vo.id}" data-tid="{$vo.user.id}"><i class="iconfont icon-svgmoban53"></i>{:lang('reply')}</span>
{//评论编辑删除采纳权限}
<div class="jieda-admin">
{if ((session('user_id') == $vo.user.id) && (getLimtTime($vo.create_time) < 2)) OR ($user.auth ?? '')}
<span type="edit" class="comment-edit" data-id="{$vo.id}">{:lang('edit')}</span>
<span type="del">{:lang('delete')}</span>
{/if}
</div>
</div>
</div>
</div>
{// 第三层回复}
{notempty name="$vo.children"}
{volist name="$vo.children" id="voo"}
<div class="layui-clear" style="margin:10px 0; padding: 10px; border: 1px solid #f0f0f0;">
<a style="display: inline-block; float: left; width: 50px;"><img src="{$voo.user.user_img}" style="width: 30px; height: 30px; object-fit: cover; border-radius: 15px;"></a>
<div style="float: left;width: calc(100% - 50px);">
<div>{$voo.user.name} 回复 {$voo.touser} {$voo.create_time|date='Y-m-d H:i'}</div>
<div class="detail-body jieda-body photos">{$voo.content|raw}</div>
<div class="jieda-reply">
<span class="jieda-zan {if($voo.zan != 0)}zanok{/if}" type="zan">
<i class="iconfont icon-zan"></i><em>{$voo.zan}</em>
</span>
<span type="reply" data-pid="{$vo.id}" data-tid="{$voo.user.id}"><i class="iconfont icon-svgmoban53"></i>{:lang('reply')}</span>
{//评论编辑删除采纳权限}
<div class="jieda-admin">
{if ((session('user_id') == $voo.user.id) && (getLimtTime($voo.create_time) < 2)) OR ($user.auth ?? '')}
<span type="edit" class="comment-edit" data-id="{$voo.id}">{:lang('edit')}</span>
<span type="del">{:lang('delete')}</span>
{/if}
</div>
</div>
</div>
</div>
{/volist}
{/notempty}
{/volist}
{/notempty}
</div>
{else /}
<div class="detail-body jieda-body photos">
<i class="layui-icon layui-icon-password" style="font-size: 24px; color: #FF5722;"></i>
评论解密后查看
</div>
{/if}
</div>
</li>
{/article:comment}
</ul>
<div style="text-align: center" id="pages"></div>
</div>
</div>
{//右栏}
<div class="layui-col-md4">
<div class="fly-panel">
<div class="fly-panel-main wenda-user">
<div class="user-img">
<a href="{$Request.domain}{:url('user/home',['id'=>$article.user.id])}">
<img class="" src="{$Request.domain}{$article.user.user_img}" alt="{$article.user.name}" />
{if($article.user.vip > 0)}<i class="iconfont icon-renzheng" title="认证信息"></i>{/if}
</a>
</div>
<div class="questions">
<span class="layui-badge layui-bg-green">回答 {$article.user.comments_count}</span> <span class="layui-badge layui-bg-green">发表 {$article.user.article_count}</span>
<span class="layui-badge layui-bg-green">+ 关注</span>
</div>
</div>
</div>
<!--详情广告赞助位-->
{:hook('ads_detail_support')}
<dl class="fly-panel fly-list-one">
<dt class="fly-panel-title">{:lang('hot post list')}</dt>
{volist name="artHot" id="vo"}
<dd>
<a href="{$Request.domain}{$vo.url}">{$vo.title}</a>
<span><i class="iconfont icon-pinglun1"></i> {$vo.comments_count}</span>
</dd>
{/volist}
</dl>
<!--详情广告图片位-->
{:hook('ads_detail_rimg')}
</div>
{//crud管理模块}
{include file="/public/crud" /}
</div>
<!--底部栏-->
</div>
{include file="public/menu" /}
{/block}
{block name="script"}
{:hook('taoplayer')}
<script>
var collectionFind = "{:url('collection/find')}",
collection = "{:url('collection/')}",
articleJieset = "{:url('Article/jieset')}",
articleDelete = "{:url('Article/delete')}",
commentJiedaZan = "{:url('Comment/jiedaZan')}",
commentJiedaCai = "{:url('Comment/jiedaCai')}",
commentGetDa = "{:url('Comment/getDa')}",
commentUpdateDa = "{:url('Comment/updateDa')}",
commentJiedaDelete = "{:url('Comment/jiedaDelete')}",
langCollection = "{:lang('collection')}",
langCancelCollection = "{:lang('cancel collection')}";
let taonystatus = "{:hook('taonystatus') ? 1 : 0} ";
layui.use(['fly', 'face','colorpicker', 'laypage'], function(){
var $ = layui.jquery
,form = layui.form
,fly = layui.fly
,colorpicker = layui.colorpicker
,laytpl = layui.laytpl
,uid = layui.cache.user.uid
,laypage = layui.laypage;
var id = "{$article.id}";
let LOGIN_URL = "{:url('login/index')}";
//如果你是采用模版自带的编辑器,你需要开启以下语句来解析。
// 编辑器插件启用状态
if(taonystatus == 0) {
$('.detail-body').each(function(){
var othis = $(this), html = othis.html();
othis.html(fly.content(html));
});
} else {
$(".comment-edit").on('click',function (){
var id = $(this).data('id');
layer.open({
type: 2,
title: '修改',
shade: 0.1,
area: ['600px', '500px'],
content: "{:url('comment/edit')}" + '?id=' + id
});
});
}
//tpl模板给发布时间赋值
$('div.detail-hits').children('span.post-time').each(function(){
var othis = $(this), html = othis.html();
var string = laytpl('{{ d.time }}').render({
//time: html
time: othis.attr('data')
});
var posttime = layui.util.timeAgo(string, 1);
othis.text(posttime);
//console.log(othis.attr('data'));
});
//文章点赞
$("#article-zan").on('click',function(){
//判断登陆
if(uid == -1){
layer.msg('请登录再点赞', {icon: 6}, function(){location.href = login})
return false;
}
$.post("{:url('article/userZanArticle')}",{article_id:id,type:1},function(data){
if(data.code == 0){
layer.msg(data.msg,{icon:6,time:2000},function () {
location.reload(true);
});
} else {
layer.msg(data.msg,{icon:6,adim:6});
}
})
});
//预定义颜色项
colorpicker.render({
elem: '#color'
,color: '#393d49'
,predefine: true // 开启预定义颜色
,size: 'xs'
,done: function(color){
//改变标题颜色
$('h1').css("color", color);
$.ajax({
type:'post',
url:"{:url('Article/titleColor')}",
data:{id: id,title_color: color},
dataType:'json',
success:function(data){
if(data.code == 0){
layer.msg(data.msg,{icon:6,time:2000
});
} else {
layer.open({content:data.msg,icon:5,adim:6});
}
}
});
}
});
// 评论接口
function comment(data){
if (uid == -1) {
layer.msg('请先登陆',{icon:5,time:2000},function(){location.href = "{:url('login/index')}"});
return false;
}
var index = layer.load(1);
$.ajax({
type: "post",
url: "{:url('article/comment')}",
data: data,
dataType: "json",
success:function (res) {
layer.close(index);
if (res.code === 0) {
layer.msg(res.msg,{icon:6,time:2000},function () {location.reload(true)});
}else {
layer.open({title:'评论失败',content:res.msg,icon:5,anim:6});
}
}
});
}
// 评论
form.on('submit(user-comment)',function (data){
comment(data.field);
});
// 回复用户
$("span[type='reply']").on('click',function (){
var pid = $(this).attr('data-pid');
var tid = $(this).data('tid');
var html =
'<form class="layui-form user-comment" style="margin-left:50px;">' +
'<div>' +
'<input type="hidden" name="article_id" value="{$article.id}">' +
'<input name="pid" value="'+ pid +'" class="layui-hide">' +
'<input name="to_user_id" value="'+ tid +'" class="layui-hide">' +
'<textarea name="content" required lay-verify="required" class="layui-textarea fly-editor" style="height: 100px; right: 5px; margin: 10px 5px;"></textarea>' +
'<button type="submit" class="layui-btn" lay-submit lay-filter="submit-user-comment">提交</button>' +
'</div>' +
'</form>';
var forms = $(this).nextAll('form');
if(forms.length == 0) {
// 移除其它评论块
$('.user-comment').remove();
//动态添加评论块
$(this).next().after(html);
}
})
//提交回复
form.on('submit(submit-user-comment)', function(data){
comment(data.field);
return false;
})
// 评论分页
laypage.render({
elem: "pages", //注意,这里的 test1 是 ID不用加 # 号
count: "{$comments['total']}", //数据总数,从服务端得到
limit: 10,
curr: "{$page}",
//获取起始页
jump: function (obj, first) {
var page = obj.curr;
var limit = obj.limit;
var url = "{:url('article_detail',['id' => $article.id ,'ename' =>$article['cate']['ename']])}";
var id = "{$article.id}";
//首次不执行
if (!first) {
$.post("{:url('article/detail')}", { id: id, page: page }, function () {
location.href = url + '?page=' + page + '#comment';
});
}
},
});
//下载
$('#zip-download').click(function (){
var id = "{$article.id}";
$.ajax({
type:"post",
url:"{:url('article/download')}",
data:{id:id},
success:function (data) {
location.href = "{:url('article/download',['id'=>$article.id])}";
}
});
});
$("#jiemi").click(function (){
//判断登陆
if(uid == -1){
layer.msg('请先登录再查看', {icon: 6}, function(){location.href = LOGIN_URL})
return false;
}
var id = "{$article.id}";
layer.prompt(function(value, index, elem){
// alert(value); //得到value
$.post("{:url('article/jiemi')}",{id:id, art_pass:value},function (res){
if(res.code === 0){
layer.msg(res.msg,{icon:6,time:2000},function () {
parent.location.reload(); //刷新父页面注意一定要在关闭当前iframe层之前执行刷新
});
} else {
layer.msg(res.msg,{icon:5,adim:6});
}
});
layer.close(index);
});
});
});
</script>
{:hook('taoplyr')}
{:hook('taonyeditor')}
{//图片点击放大}
{include file="/public/images-click" /}
{include file="/public/qr-read" /}
{/block}