maple-bbs/maple/templates/topic/replies.html

<style>
 .like-active {
     color:#a40004;
 }
 .like-no-active {
     color:#ccc;
 }
</style>
<script type="text/javascript">
 $(document).ready(function(){
     $('.like-reply').click(function() {
         var _$this = $(this);
         var replyId = _$this.attr('data-id');
         var data = JSON.stringify({
             uid:replyId
         });
         if(_$this.hasClass('like-active')){
             $.ajax ({
                 type : "DELETE",
                 url : "{{ url_for('mine.like') }}",
                 data:data,
                 contentType: 'application/json;charset=UTF-8',
                 success: function(result) {
                     if (result.judge === true)
                     {
                         _$this.attr("title","赞");
                         _$this.removeClass("like-active");
                         _$this.addClass("like-no-active");
                     } else
                     {
                         window.location.href = result.url;
                     }
                 }});
         }else {
             $.ajax ({
                 type : "POST",
                 url : "{{ url_for('mine.like') }}",
                 data:data,
                 contentType: 'application/json;charset=UTF-8',
                 success: function(result) {
                     if (result.judge === true)
                     {
                         _$this.attr("title","取消赞");
                         _$this.removeClass("like-no-active");
                         _$this.addClass("like-active");
                     } else
                     {
                         window.location.href = result.url;
                     }
                 }});
         }});
     $('.reply-author').click(function() {
         var _$this = $(this);
         var author = _$this.attr('data-id');
         $('#content').focus();
         $('#content').val('@' + author + ' ');
     })
 });
</script>
<div class="panel panel-default" id="replies-content">
    <div class="panel-heading">
        共收到{{ replies.total }}条回复
    </div>
    {% if replies.items %}
    {% set num = 1 %}
    {% for reply in replies.items %}
    <div class="panel-body media" style="border-bottom:1px solid #eee;margin:0">
        <div class="media-left">
            <a href="#">
                <img class="media-object img-circle" src="{{ url_for('static',filename='images/Moo.png')}}" alt="..." style="width:48px;height:48px">
            </a>
        </div>
        <div class="media-body">
            <small class="media-heading" style="color:#999">
                <span>{{ link_base.user(reply.author.username)}}</span>
                <span>{{ reply.publish | timesince }}</span>
                <a name="reply{{ num }}" class="anchor" href="#reply{{ num }}" aria-hidden="true">#{{ num }}</a>
            </small>
            <div>
                {{ reply.content}}
            </div>
        </div>
        <div class="media-right">
            {% if reply in current_user.likes and g.user.is_authenticated %}
            <a href="javascript:void(0);" style="padding:0" class="like-reply btn btn-sm like-active" data-id="{{ reply.id}}" title="取消赞">
                <i class="icon-thumbs-up"></i>
            </a>
            {% else %}
            <a href="javascript:void(0);" style="padding:0" class="like-reply btn btn-sm like-no-active" data-id="{{ reply.id}}" title="赞">
                <i class="icon-thumbs-up"></i>
            </a>
            {% endif %}
        </div>
        <div class="media-right">
            <a href="javascript:void(0);" style="color:#ccc;padding:0" class="reply-author btn btn-sm" data-id="{{ reply.author.username }}" title="回复">
                <i class="icon-reply"></i>
            </a>
        </div>
    </div>
    {% set num = num + 1 %}
    {% endfor %}
    {{ p_footer(replies,'topic.topic',dict(uid=topic.uid))}}
    {% else %}
    <div class="panel-body">
        <span class="text-center" style="display:block;width:100%;color:#999">
            暂无回复
        </span>
    </div>
    {% endif %}
</div>
<div class="panel panel-default">
    {% if g.user.is_authenticated %}
    <div class="panel-heading"> 回帖 </div>
    <div class="panel-body">
        <form action="{{ url_for('topic.reply',uid=topic.id)}}" method="POST">
            {{ form.hidden_tag() }}
            {{ form.content(class='form-control')}}
            <button class="btn btn-sm btn-primary" type="submit">提交问题</button>
        </form>
    </div>
    {% else %}
    <div class="panel-body" style="border:1px dashed #337ab7;margin:5px;">
        <span class="text-center" style="display:block;width:100%;color:#999">
            <span class="glyphicon glyphicon-lock" aria-hidden="true" style="font-size:16px;"></span>
            你需要<a href="{{ url_for('auth.login') }}">登陆</a>后才能发表回复
        </span>
    </div>
    {% endif %}
</div>