Description: Comments list and comment paging list used to obtain documents
How to use:{% commentList 变量名称 with archiveId="1" type="page|list" %}
If variables are defined as comments{% commentList comments with archiveId="1" type="page" %}...{% endcommentList %}
The supported parameters of commentList are:
- Document Review ID
archiveId
archiveId
For the specified document ID; - Comments sort
order
order
You can specify the display sorting rule, supporting ascending order sorting based on idorder="id desc"
, and descending order sorting by idorder="id desc"
; - Display quantity
limit
List of quantities, e.g.limit="10"
It will only display 10 entries,limit
When it is not a paging list, supportoffset
Mode, that is,
Separator mode, if you want to start from the 2nd entry and get 10 entries, you can set it tolimit="2,10"
; - List Type
type
type
Supports listing in page or list mode. The default value is list, iftype="page"
Available in the future Pagination tagpagination
To organize pagination display{% pagination pages with show="5" %}
. - Site ID
siteId
siteId
Generally, there is no need to fill in it. If you use the background multi-site management to create multiple sites and want to call data from other sites, you can specify itsiteId
To implement the data calling the specified site.
comments is an array object, so it needs to be usedfor
Loop to output
item is the variable within the for loop, the available fields are:)
- Comment ID
Id
- Type content ID
ArchiveId
- username
UserName
- User ID
UserId
- User IP
Ip
- Number of likes
VoteCount
- Comment content
Content
- Parent comment ID
ParentId
- Review status
Status
Status = 1 means the review is passed, status = 0 is under review, do not display it - The object data of the previous comment
Parent
Parent contains the complete item of the superior comment, fields are the same as the comment item - Add time
CreatedTime
Time stamp, need to use formatted timestamps as date format{{stampToDate(item.CreatedTime, "2006-01-02")}}
General Comments List
{# list 列表展示 #}
<div>
{% commentList comments with archiveId=archive.Id type="list" limit="6" %}
{% for item in comments %}
<div>
<div>
<span>
{% if item.Status != 1 %}
审核中:{{item.UserName|truncatechars:6}}
{% else %}
{{item.UserName}}
{% endif %}
</span>
{% if item.Parent %}
<span>回复</span>
<span>
{% if item.Status != 1 %}
审核中:{{item.Parent.UserName|truncatechars:6}}
{% else %}
{{item.Parent.UserName}}
{% endif %}
</span>
{% endif %}
<span>{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
</div>
<div>
{% if item.Parent %}
<blockquote>
{% if item.Parent.Status != 1 %}
该内容正在审核中:{{item.Parent.Content|truncatechars:9}}
{% else %}
{{item.Parent.Content|truncatechars:100}}
{% endif %}
</blockquote>
{% endif %}
{% if item.Status != 1 %}
该内容正在审核中:{{item.Content|truncatechars:9}}
{% else %}
{{item.Content}}
{% endif %}
</div>
<div class="comment-control" data-id="{{item.Id}}" data-user="{{item.UserName}}">
<a class="item" data-id="praise">赞(<span class="vote-count">{{item.VoteCount}}</span>)</a>
<a class="item" data-id=reply>回复</a>
</div>
</div>
{% endfor %}
{% endcommentList %}
</div>
Page display comment list
{# page 分页列表展示 #}
<div>
{% commentList comments with archiveId=archive.Id type="page" limit="10" %}
{% for item in comments %}
<div>
<div>
<span>
{% if item.Status != 1 %}
审核中:{{item.UserName|truncatechars:6}}
{% else %}
{{item.UserName}}
{% endif %}
</span>
{% if item.Parent %}
<span>回复</span>
<span>
{% if item.Status != 1 %}
审核中:{{item.Parent.UserName|truncatechars:6}}
{% else %}
{{item.Parent.UserName}}
{% endif %}
</span>
{% endif %}
<span>{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
</div>
<div>
{% if item.Parent %}
<blockquote>
{% if item.Parent.Status != 1 %}
该内容正在审核中:{{item.Parent.Content|truncatechars:9}}
{% else %}
{{item.Parent.Content|truncatechars:100}}
{% endif %}
</blockquote>
{% endif %}
{% if item.Status != 1 %}
该内容正在审核中:{{item.Content|truncatechars:9}}
{% else %}
{{item.Content}}
{% endif %}
</div>
<div class="comment-control" data-id="{{item.Id}}" data-user="{{item.UserName}}">
<a class="item" data-id="praise">赞(<span class="vote-count">{{item.VoteCount}}</span>)</a>
<a class="item" data-id=reply>回复</a>
</div>
</div>
{% endfor %}
{% endcommentList %}
</div>
<div>
{% pagination pages with show="5" %}
<ul>
<li>总数:{{pages.TotalItems}}条,总共:{{pages.TotalPages}}页,当前第{{pages.CurrentPage}}页</li>
<li class="{% if pages.FirstPage.IsCurrent %}active{% endif %}"><a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a></li>
{% if pages.PrevPage %}
<li><a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a></li>
{% endif %}
{% for item in pages.Pages %}
<li class="{% if item.IsCurrent %}active{% endif %}"><a href="{{item.Link}}">{{item.Name}}</a></li>
{% endfor %}
{% if pages.NextPage %}
<li><a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a></li>
{% endif %}
<li class="{% if pages.LastPage.IsCurrent %}active{% endif %}"><a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a></li>
</ul>
{% endpagination %}
</div>
Comment form submission
Comments are submitted using the form, and the receiving address of the background is:./comment/publish
. The fields that need to be submitted are
Fields | Is it required | illustrate |
---|---|---|
archive_id | yes | The corresponding document ID |
user_name | yes | Comment username |
content | yes | Comment content |
parent_id | no | Parent comment ID, it needs to be included when replying to a specific comment in order to establish a connection |
Return | no | After submission, specify the format returned by the backend, and the optional values are:html /json , default to html |
Form code example
<form method="post" action="/comment/publish">
<input type="hidden" name="return" value="html">
<input type="hidden" name="archive_id" value="{% archiveDetail with name="Id" %}">
<div>
<label>用户名</label>
<div>
<input type="text" name="user_name" required lay-verify="required" placeholder="请填写您的昵称" autocomplete="off">
</div>
</div>
<div>
<label>评论内容</label>
<div>
<textarea name="content" placeholder="" id="comment-content-field" rows="5"></textarea>
</div>
</div>
<div>
<div>
<button type="submit">提交评论</button>
<button type="reset">重置</button>
</div>
</div>
</form>
Like the comment content
You can like the content of a comment, liking uses a form submission, and the back-end receiving address for the liking submission is:/comment/praise
. The fields that need to be submitted for like are:
Fields | Is it required | illustrate |
---|---|---|
id | yes | Comment Content ID |
Comments and likes only support data returning json format, so you need to use js post to submit it.
Sample code
<div class="comment-control">
<a class="item vote-comment" data-id="praise" data-id="{{item.Id}}">赞(<span class="vote-count">{{item.VoteCount}}</span>)</a>
</div>
$(".vote-comment").click(function (e) {
let that = $(this);
let commentId = $(this).data("id");
//赞
$.ajax({
url: "/comment/praise",
method: "post",
data: { id: commentId },
dataType: "json",
success: function (res) {
if (res.code === 0) {
alert(res.msg);
that.find(".vote-count").text(res.data.vote_count);
} else {
alert(res.msg);
}
},
error: function (err) {
alert(res.msg);
},
});
});