323 lines
11 KiB
HTML
323 lines
11 KiB
HTML
|
{extend name="public/base" /}
|
|||
|
{block name="title"}{$article.title}-{$sysInfo.webname}{/block}
|
|||
|
{block name="keywords"}{$article.tags}{/block}
|
|||
|
{block name="description"}{$article.title},{$article.description}{/block}
|
|||
|
{block name="link"}<link rel="stylesheet" href="/static/res/css/plyr.css" charset="utf-8">{/block}
|
|||
|
{block name="column"}<div class="layui-hide-xs">{include file="/public/column" /}</div>{/block}
|
|||
|
{block name="content"}
|
|||
|
<div class="layui-container">
|
|||
|
<div class="layui-row layui-col-space15">
|
|||
|
<div class="layui-col-md12 content detail">
|
|||
|
<div class="fly-panel detail-box">
|
|||
|
{//标题}
|
|||
|
<h1 style="color:{$article.title_color};" align="center">{$article.title}</h1>
|
|||
|
<div class="detail_qrcode layui-hide-xs" onclick="PhoneDown();" id="mobile"></div>
|
|||
|
|
|||
|
{//图标}
|
|||
|
<div class="fly-detail-info">
|
|||
|
<span id="LAY_jieAdmin" data-id="{$article['id']}"></span>
|
|||
|
<span class="fly-list-nums">
|
|||
|
<a href="#comment"><i class="iconfont" title="{:lang('reply')}"></i>{$article.comments_count}</a><i class="iconfont" title="浏览"></i>{$pv}
|
|||
|
</span>
|
|||
|
</div>
|
|||
|
{//作者}
|
|||
|
<div class="detail-about">
|
|||
|
<a class="fly-avatar" href="{:url('user/home',['id'=>$article.user.id])}">
|
|||
|
<img src="{$article.user.user_img}" alt="{$article.user.name}">
|
|||
|
<i class="iconfont icon-renzheng" title="认证信息"></i>
|
|||
|
</a>
|
|||
|
<div class="fly-detail-user">
|
|||
|
<a href="{:url('user/home',['id'=>$article.user.id])}" class="fly-link">
|
|||
|
{if config('taoler.config.area_show') == 1}<i class="layui-badge layui-bg-green " title="">{:getAsing($article.user.area_id) ?: '无'}</i>{/if}
|
|||
|
<cite>{$article.user.nickname ?: $article.user.name}</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>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<hr>
|
|||
|
{// 内容}
|
|||
|
<div class="detail-body photos" id="content">{$article.content}</div>
|
|||
|
|
|||
|
{//管理}
|
|||
|
{if (($article.upzip !== '') || session('?user_name'))}
|
|||
|
<div class="detail-assist">
|
|||
|
{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 class="fly-admin-box" data-id="{$article.id}">
|
|||
|
{if ($user.auth ?? '')}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="del"><i class="layui-icon layui-icon-delete"></i></span>
|
|||
|
{if($article.is_top == 0)}<span class="layui-btn layui-btn-xs jie-admin" type="set" field="top" rank="1"><i class="layui-icon layui-icon-top"></i></span>
|
|||
|
{else /}<span class="layui-btn layui-btn-xs jie-admin" type="set" field="top" rank="0" style="background-color:#ccc;">{:lang('cancel topping')}</span>{/if}
|
|||
|
{if($article.is_hot == 0)}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="hot" rank="1"><i class="layui-icon layui-icon-fire"></i></span>
|
|||
|
{else /}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="hot" rank="0" style="background-color:#ccc;">{:lang('cancel hoting')}</span>
|
|||
|
{/if}
|
|||
|
{if($article.is_reply == 1)}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="reply" rank="0"><i class="layui-icon layui-icon-face-cry"></i></span>
|
|||
|
{else /}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="reply" rank="1" style="background-color:#ccc;">{:lang('enable reply')}</span>
|
|||
|
{/if}
|
|||
|
<span id="color">{:lang('title color')}</span>
|
|||
|
{/if}
|
|||
|
{if(session('user_name')==$article.user.name || ($user.auth ?? ''))}
|
|||
|
<span class="layui-btn layui-btn-xs jie-admin" type="edit"><a href="{:url('article/edit',['id'=>$article.id])}">{:lang('edit')}</a></span>
|
|||
|
{/if}
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
{/if}
|
|||
|
</div>
|
|||
|
|
|||
|
<div class="fly-panel detail-box" >
|
|||
|
|
|||
|
</div>
|
|||
|
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<!--底部栏-->
|
|||
|
<div class="site-tree-mobile-detail-bottom layui-hide-md">
|
|||
|
<div id="LAY_jieAdmin1" data-id="{$article['id']}"></div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
{include file="public/menu" /}
|
|||
|
{/block}
|
|||
|
|
|||
|
{block name="script"}
|
|||
|
<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')}";
|
|||
|
|
|||
|
layui.use(['fly', 'face','colorpicker','plyr', 'laypage'], function(){
|
|||
|
var $ = layui.jquery
|
|||
|
,form = layui.form
|
|||
|
,fly = layui.fly
|
|||
|
,colorpicker = layui.colorpicker
|
|||
|
,plyr = layui.plyr;
|
|||
|
var laytpl = layui.laytpl;
|
|||
|
var uid = layui.cache.user.uid;
|
|||
|
var laypage = layui.laypage;
|
|||
|
|
|||
|
//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'));
|
|||
|
});
|
|||
|
|
|||
|
|
|||
|
//预定义颜色项
|
|||
|
colorpicker.render({
|
|||
|
elem: '#color'
|
|||
|
,color: '#393d49'
|
|||
|
,predefine: true // 开启预定义颜色
|
|||
|
,size: 'xs'
|
|||
|
,done: function(color){
|
|||
|
//改变标题颜色
|
|||
|
$('h1').css("color", color);
|
|||
|
var id = "{$article.id}";
|
|||
|
$.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});
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
//评论需要登陆
|
|||
|
form.on('submit(user-comment)',function (data){
|
|||
|
var index = layer.load(1);
|
|||
|
var filed = data.field;
|
|||
|
if (uid == -1) {
|
|||
|
layer.msg('请先登陆',{icon:5,time:2000},function(){
|
|||
|
location.href = "{:url('login/index')}";
|
|||
|
});
|
|||
|
} else {
|
|||
|
$.ajax({
|
|||
|
type: "post",
|
|||
|
url: "{:url('article/comment')}",
|
|||
|
data: filed,
|
|||
|
dataType: "json",
|
|||
|
success:function (data) {
|
|||
|
if (data.code == 0) {
|
|||
|
layer.msg(data.msg,{icon:6,time:2000},function () {
|
|||
|
location.reload(true);
|
|||
|
});
|
|||
|
}else {
|
|||
|
layer.open({title:'评论失败',content:data.msg,icon:5,anim:6});
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
}
|
|||
|
return false;
|
|||
|
});
|
|||
|
|
|||
|
//执行一个laypage实例
|
|||
|
laypage.render({
|
|||
|
elem: 'pages' //注意,这里的 test1 是 ID,不用加 # 号
|
|||
|
,count: "{$article.comments_count}" //数据总数,从服务端得到
|
|||
|
,limit: 10
|
|||
|
,curr : {$page}
|
|||
|
|
|||
|
//获取起始页
|
|||
|
,jump: function(obj, first){
|
|||
|
//首次不执行
|
|||
|
if(!first){
|
|||
|
var page = obj.curr;
|
|||
|
var url = "{:url('article/detail',['id'=>$article.id])}";
|
|||
|
var id = "{$article.id}";
|
|||
|
$.post("{:url('article/detail')}",{"id":id,"page":page},function(){
|
|||
|
window.location.href = url + '?page=' + page + '#flyReply';
|
|||
|
});
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
|
|||
|
//下载
|
|||
|
$('#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])}";
|
|||
|
}
|
|||
|
});
|
|||
|
});
|
|||
|
|
|||
|
//如果你是采用模版自带的编辑器,你需要开启以下语句来解析。
|
|||
|
$('.detail-body').each(function(){
|
|||
|
var othis = $(this), html = othis.html();
|
|||
|
othis.html(fly.content(html));
|
|||
|
});
|
|||
|
//加载播放器
|
|||
|
plyr.setup();
|
|||
|
|
|||
|
});
|
|||
|
</script>
|
|||
|
|
|||
|
|
|||
|
<script type="text/javascript">
|
|||
|
// 点击图片放大
|
|||
|
$(function(){
|
|||
|
$(".photos").on("click","img",function(){
|
|||
|
var _this = $(this);
|
|||
|
console.log(_this);
|
|||
|
imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
|
|||
|
});
|
|||
|
});
|
|||
|
function imgShow(outerdiv, innerdiv, bigimg, _this){
|
|||
|
var src = _this.attr("src");
|
|||
|
$(bigimg).attr("src", src);
|
|||
|
|
|||
|
$("<img/>").attr("src", src).on("load",function(){
|
|||
|
var windowW = $(window).width();
|
|||
|
var windowH = $(window).height();
|
|||
|
var realWidth = this.width;
|
|||
|
var realHeight = this.height;
|
|||
|
var imgWidth, imgHeight;
|
|||
|
var scale = 0.8;
|
|||
|
if(realHeight>windowH*scale) {
|
|||
|
//判断图片高度
|
|||
|
imgHeight = windowH*scale;
|
|||
|
imgWidth = imgHeight/realHeight*realWidth;
|
|||
|
if(imgWidth>windowW*scale) {
|
|||
|
//如宽度扔大于窗口宽度
|
|||
|
imgWidth = windowW*scale;
|
|||
|
}
|
|||
|
} else if(realWidth>windowW*scale) {
|
|||
|
|
|||
|
imgWidth = windowW*scale;
|
|||
|
imgHeight = imgWidth/realWidth*realHeight;
|
|||
|
} else {
|
|||
|
//如果图片真实高度和宽度都符合要求,高宽不变
|
|||
|
imgWidth = realWidth;
|
|||
|
imgHeight = realHeight;
|
|||
|
}
|
|||
|
$(bigimg).css("width",imgWidth);
|
|||
|
var w = (windowW-imgWidth)/2;
|
|||
|
var h = (windowH-imgHeight)/2;
|
|||
|
$(innerdiv).css({"top":h, "left":w});
|
|||
|
$(outerdiv).fadeIn("fast");
|
|||
|
});
|
|||
|
$(outerdiv).click(function(){
|
|||
|
//再次点击淡出消失弹出层
|
|||
|
$(this).fadeOut("fast");
|
|||
|
});
|
|||
|
}
|
|||
|
|
|||
|
</script>
|
|||
|
|
|||
|
<div id="outerdiv" style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:2;width:100%;height:100%;display:none;">
|
|||
|
<div id="innerdiv" style="position:absolute;">
|
|||
|
<img id="bigimg" style="border:5px solid #fff;" src="" />
|
|||
|
</div>
|
|||
|
|
|||
|
{:hook('markdownhook')}
|
|||
|
|
|||
|
<script>
|
|||
|
//扫码阅读
|
|||
|
$("#rdown").hover(function(){
|
|||
|
$("#phonedl").show().stop();
|
|||
|
},function(){
|
|||
|
$("#phonedl").hide().stop();
|
|||
|
});
|
|||
|
|
|||
|
$("#phonedl").hover(function(){
|
|||
|
$("#phonedl").show().stop();
|
|||
|
},function(){
|
|||
|
$("#phonedl").hide().stop();
|
|||
|
});
|
|||
|
|
|||
|
function PhoneDown(){
|
|||
|
layer.open({
|
|||
|
title: "扫码查阅",
|
|||
|
skin: 'layui-layer',
|
|||
|
content: "<img src='/qrcode/?text={$Request.domain}{:url('article/detail',['id' => $article.id])}&size=230'>"
|
|||
|
});
|
|||
|
}
|
|||
|
//推送百度收录服务
|
|||
|
(function(){
|
|||
|
var bp = document.createElement('script');
|
|||
|
var curProtocol = window.location.protocol.split(':')[0];
|
|||
|
if (curProtocol === 'https') {
|
|||
|
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
|
|||
|
}
|
|||
|
else {
|
|||
|
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
|
|||
|
}
|
|||
|
var s = document.getElementsByTagName("script")[0];
|
|||
|
s.parentNode.insertBefore(bp, s);
|
|||
|
})();
|
|||
|
</script>
|
|||
|
|
|||
|
{/block}
|