{extend name="public/base" /}
{block name="title"}{$article.title} - {$sysInfo.webname}{/block}
{block name="keywords"}{$article.keywords ?: $article.title}{/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}
{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">
          {//标题}
          <div class="title layui-clear"><h1 style="color:{article:title_color /};">{article:title /}</h1></div>
          {//图标}
          <div class="user-questions">
            <a class="user-avatar" href="{article:user name='link' /}">
              <img src="{article:user name='user_img' /}" alt="{article:user name='name' /}" />
              <cite>{article:auther} / </cite>
            </a>
            <span class="user-post-time" data="{$article.create_time}" style="padding-top: 5px"></span>
            / <i class="iconfont" title="{:lang('reply')}">&#xe60c;</i> {$article:comments_count} / <i class="iconfont" title="浏览">&#xe60b;</i> {$pv}
            {if ($article.jie == 0) }
            <span class="layui-btn layui-btn-xs" style="background-color: #ff5722">{:lang('no finished')}</span>
            {else /}
            <span class="layui-btn layui-btn-xs" style="background-color: #009688">{:lang('finished')}</span>
            {/if}
            <span id="LAY_jieAdmin" data-id="{$article['id']}"></span>
          </div>

          <hr class="layui-border-green" />

          {//问题内容}
          <div style="margin-top: 15px; font-size: 18px; font-weight: bold; color: rgb(130, 125, 125)">问题描述：</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>

        {//评论内容}
        <div class="fly-panel detail-box" id="flyReply">
          <span style="font-size: 18px">评论 {article:comment_num}</span>
          <ul class="jieda" id="jieda">
            {article:comment}
            <li data-id="{comment:id /}" class="jieda-daan">
              <a name="item-1111111111"></a>
              <div class="detail-about detail-about-reply">
                <a class="fly-avatar" href="{comment:ulink /}">
                  <img src="{comment:uimg /}" alt=" " />{if($comment.user.vip > 0)}<i class="iconfont icon-renzheng" title="认证信息"></i>{/if}
                </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}
                </div>
                <div class="detail-hits"><span class="post-time" data="{comment:time /}"></span>{:hook('ipShow', $comment.user.city)}</div>
                {if $comment.cai == 1}<i class="iconfont icon-caina" title="最佳答案"></i>{/if}
              </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" id="user-reply"><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} {if ($comment.cai == 0) && ((session('user_id') == $article.user_id) OR ($user.auth ?? '')) && ($article.jie == 0)/}
                  <span class="jieda-accept" type="accept">{:lang('accept')}</span>
                  {/if}
                </div>
              </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}
                <hr style="border:1px dotted red;height:1px;width:90%" />
                <div style="margin: 5px 0px;">{comment:usign /}</div>
            </li>
            {/article:comment}
          </ul>
          <div style="text-align: center" id="pages"></div>
        </div>

        {//评论区}
        {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" style="height: 150px"></textarea>
            </div>
          </div>
          <div class="layui-form-item que-comments">
            <input type="hidden" name="article_id" value="{$article.id}" />
            <input type="hidden" name="user_id" value="{:session('user_id')}" />
            <button class="layui-btn layui-btn-danger" lay-filter="user-comment" lay-submit>{:lang('submit comments')}</button>
          </div>
        </div>
        {/if}
      </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('taonyeditor')}

{: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;

    //如果你是采用模版自带的编辑器，你需要开启以下语句来解析。
    // 编辑器插件禁用状态,用原方式解析网页
    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.user-questions").children("span.user-post-time").each(function () {
        var othis = $(this);
        var string = laytpl("{{ d.time }}").render({
          time: othis.attr("data"),
        });
        var posttime = layui.util.timeAgo(string, 1);
        othis.text(posttime);
      });

    //tpl模板给发布时间赋值
    $("div.detail-hits").children("span.post-time").each(function () {
        var othis = $(this);
        var string = laytpl("{{ d.time }}").render({
          time: othis.attr("data"),
        });
        var posttime = layui.util.timeAgo(string, 1);
        othis.text(posttime);
      });

    //预定义颜色项
    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.render({
      elem: "pages", //注意，这里的 test1 是 ID，不用加 # 号
      count: "{$article.comments_count}", //数据总数，从服务端得到
      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 + '#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])}";
        },
      });
    });

    $("#jiemi").click(function (){
      //判断登陆
      if(uid == -1){
        layer.msg('请先登录再查看', {icon: 6}, function(){location.href = login})
        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')}

{//图片点击放大}
{include file="/public/images-click" /}

{include file="/public/qr-read" /}

{/block}