Comment tag list

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:

• Comment Document IDarchiveId
archiveIdfor the specified document ID;
• Comments sortorder
orderYou can specify the displayed sorting rules, and support sorting according to id orderorder="id desc", sort by id flashbackorder="id desc";
• Display quantitylimitList of quantities, e.g.limit="10"Only 10 items will be displayed.limitWhen it is not a paging list, supportoffsetMode, that is,Separation mode, if you want to get 10 pieces of data from item 2, you can set it tolimit="2,10";
• List Typetype
typeSupports listing by page and list. The default value is list, iftype="page"Available in the future Pagination tagpaginationTo organize pagination display{% pagination pages with show="5" %}.
• Site IDsiteId
siteIdGenerally, 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 itsiteIdTo implement the data calling the specified site.

comments is an array object, so it needs to be usedforLoop to output

item is a variable in the for loop body. The available fields are:

• Comment IDId
• Type Content IDArchiveId
• usernameUserName
• User IDUserId
• User IPIp
• Number of likesVoteCount
• Comment contentContent
• Previous Comment IDParentId
• Review statusStatusStatus = 1 means the review is passed, status = 0 is under review, do not display it
• The object data of the previous commentParentParent contains the full item of the previous comment, the fields and comment item are the same
• Add timeCreatedTimeTime 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 form form, and the address received by the submission background is:/comment/publish. The fields that need to be submitted are

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, and like it is submitted using the form form. The background receiving address of the like submission is:/comment/praise. The fields that need to be submitted for like are:

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);
            }
        });
    });