社区帖子详情

代码:

<div class="post-content">
    <div class="post-title row">
        <div class="col-md-9 col-xl-9">
            <h4>#(post.title ??)</h4>
            <ul class="post-tag">
                <li><a href="#(post.category.url ??)" class="club-label">#(post.category.title ??)</a></li>
                <li><span>#(post.view_count ?? 0)</span>次浏览</li>
            </ul>
        </div>
        <div class="col-md-3 col-xl-3">
            <div class="media author-title">
                <a href="#"><img class="rounded-circle w-30" src="#(post.user.avatar ??)" alt="..."></a>
                <div class="media-body">
                    <p class="fs-12">
                        <strong><a href="#(post.user.url ??)">#(post.user.nickname ??)</a></strong>
                        #userMembers(post.user.id)
                        #for(member : members)
                        <a href="#(member.type.link ??)" class="label-vip2">
                            <img src="#(member.type.icon ??)" alt="#(member.type.title ??)">
                        </a>
                        #end
                        #end
                    </p>
                    <time class="opacity-70 fs-12" datetime="2019-01-11">#date(post.created ??)</time>
                </div>
            </div>
        </div>
    </div>
    <div class="post-main">
        #(post.content ??)
    </div>
</div>
备注:

#(post.title ??) —— 帖子标题;

#(post.category.title ??) —— 帖子所属分类;

#(post.category.url ??) —— 帖子所属分类的链接;

#(post.view_count ?? 0) —— 帖子阅读量;

#(post.user.avatar ??) —— 帖子作者头像;

#(post.user.nickname ??) —— 帖子作者昵称;

#(post.user.url ??) —— 帖子作者链接;

#date(post.created ??) —— 帖子发布时间;

#(post.content ??) —— 帖子内容;

#(member.type.title ??) —— 会员标志的标题;

#(member.type.link ??) —— 会员标志的链接;

#(member.type.icon ??) —— 会员标志的图标;

 

 

效果:

 

帖子评论代码:

#postCommentPage()
<div class="row jp-comment">
    <div class="col-12 col-lg-12" id="comments">
        <h5 class="comment-title"><i class="fa fa-star-half-o" aria-hidden="true"></i>
            #(commentPage.totalRow)个回答</h5>
        <div class="media-list">
            #for(comment : commentPage.list)
            <div class="club-post">
                <div>
                    #(comment.content ??)
                </div>
                <div class="media author-title">
                    <a href="#">
                        <img class="rounded-circle w-30" src="#(comment.user.avatar ?? 'images/team.jpg')" alt="...">
                    </a>
                    <div class="media-body">
                        <p class="fs-12">
                            <strong><a href="#">#(comment.user.nickname ??)</a></strong>
                            #userMembers(comment.user_id)
                            #for(member : members)
                            <a href="#(member.type.link ??)" class="label-vip2">
                                <img src="#(member.type.icon ??)" alt="#(member.type.title ??)">
                            </a>
                            #end
                            #end
                        </p>
                        <time class="opacity-70 fs-12" >#date(comment.created)</time>
                        <span class="club-reply">
                            <a href="javascript:;" class="toReply" data-id="#(comment.user.id)" data-author="#(comment.user.nickname)">回复</a>
                        </span>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            #end

            #if(commentPage.totalRow > 10)
            #commentPaginate(anchor="allComment",anchor="comments",nextText=">",previousText="<")
            <nav aria-label="Page navigation example">
                <ul class="pagination justify-content-center ">
                    #for(page : pages)
                    <li class="page-item #(page.style)"><a class="page-link" href="#(page.url ??)">#(page.text)</a>
                    </li>
                    #end
                </ul>
            </nav>
            #end
            #end

            <form action="#(CPATH)/club/doPublishComment" method="POST" class="mt-20" id="clubCommentForm" class="mt-20 mb-40 bg-gray p-10" style="margin-left:-15px;margin-right:-15px;">
                <input type="hidden" name="postId" value="#(post.id)">
                <input type="hidden" name="pid" id="pid" value="">
                <input type="hidden" name="csrf_token" value="#(CSRF_TOKEN)">
                <div class="form-group">
                    <textarea class="form-control" id="content" name="content" placeholder="我来回答..." rows="4"></textarea>
                </div>
                <div class="verification">
                    #if(option('post_comment_vcode_enable'))
                    <div class="verification-code">
                        <input placeholder="请输入验证码" name="captcha" id="captcha">
                        <img src="/commons/captcha" onclick="this.src='#(CPATH)/commons/captcha?d='+Math.random();" cdn-exclude id="captchaimg">
                    </div>
                    #end
                    <div class="verification-btn">
                        <button class="btn btn-primary" type="submit">提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
#end

备注:

#(commentPage.totalRow) —— 评论总数;
#(comment.content ??) —— 评论内容;
#(comment.user.avatar ?? 'images/team.jpg') —— 评论者头像,如果没有头像,就用默认头像team.jpg;
#(comment.user.nickname ??) —— 评论者昵称;
#date(comment.created) —— 评论时间;

效果如下:

加入VIP


如果你想系统学习JPress涉及到的知识点,或者希望有人解答你在深度使用JPress时遇到问题,加入VIP是个很不错的选择

立马 了解一下