如何显示文档的评论列表并进行分页？

在使用安企CMS管理网站内容时，文档详情页面的评论功能是与读者互动的重要组成部分。有效地展示这些评论，并确保在评论数量增多时页面依然保持良好的加载速度和用户体验，就需要妥善处理评论列表的显示与分页。安企CMS提供了非常直观且强大的模板标签，帮助我们轻松实现这一目标。

理解评论列表的展示基础

要在文档页面上显示评论，我们主要会用到安企CMS内置的 commentList 标签。这个标签专门设计用于获取与特定文档相关的评论数据。当您位于一篇文档的详情页面时，这个标签会智能地识别当前文档的ID，无需手动指定，非常方便。

例如，在一个典型的文档详情模板中，您可以通过如下方式初步展示评论：

{# 假设我们正在一个文档详情页，archive.Id会自动被标签识别 #}
{% commentList comments with archiveId=archive.Id type="list" limit="6" %}
    {% for item in comments %}
    <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 %}
        {# 评论的发布时间，使用stampToDate过滤器进行格式化 #}
        <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>
    {% endfor %}
{% endcommentList %}

在上面的代码中，commentList 标签将评论数据赋值给了 comments 变量，并通过 for 循环遍历每一条评论。我们通过 item.UserName 获取评论者，item.Content 获取评论内容，item.CreatedTime 获取发布时间，并利用 stampToDate 过滤器将其格式化为易读的日期。值得注意的是，item.Status 可以用来判断评论是否已通过审核，而 item.Parent 则用于显示回复的上下文，这对于构建清晰的对话流至关重要。

实现评论列表的分页功能

当评论数量较多时，一次性加载所有评论会导致页面过长，影响用户体验和页面性能。这时，我们就需要引入分页功能。安企CMS的分页实现也非常简单，只需要对 commentList 标签的 type 参数进行调整，并结合 pagination 标签即可。

首先，将 commentList 标签的 type 参数从 list 改为 page，并设置 limit 参数来控制每页显示的评论数量。例如，我们设定每页显示10条评论：

{% commentList comments with archiveId=archive.Id type="page" limit="10" %}
    {# 评论列表的渲染方式与上方基本一致 #}
    {% for item in comments %}
    <div>
        {# ... 评论详情展示代码 ... #}
    </div>
    {% endfor %}
{% endcommentList %}

接下来，在 commentList 标签的下方，紧接着使用 pagination 标签来生成分页导航。pagination 标签会自动识别当前页面的分页上下文，并生成相应的页码链接。您可以根据需求通过 show 参数来指定在分页条中显示多少个页码按钮。

<div class="pagination">
    {% pagination pages with show="5" %}
    <ul>
        {# 首页链接 #}
        <li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}"><a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a></li>
        {# 上一页链接 #}
        {% if pages.PrevPage %}
            <li class="page-item"><a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a></li>
        {% endif %}
        {# 中间页码列表 #}
        {% for item in pages.Pages %}
            <li class="page-item {% if item.IsCurrent %}active{% endif %}"><a href="{{item.Link}}">{{item.Name}}</a></li>
        {% endfor %}
        {# 下一页链接 #}
        {% if pages.NextPage %}
            <li class="page-item"><a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a></li>
        {% endif %}
        {# 尾页链接 #}
        <li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}"><a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a></li>
    </ul>
    {# 您还可以选择显示总评论数、总页数和当前页码等信息 #}
    <p>总数：{{pages.TotalItems}}条评论，总共：{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页。</p>
    {% endpagination %}
</div>

在这个分页代码中，pages 变量包含了所有与分页相关的信息，例如当前页码 (pages.CurrentPage)、总页数 (pages.TotalPages)、首页链接 (pages.FirstPage.Link)、上一页/下一页 (pages.PrevPage.Link, pages.NextPage.Link) 以及中间的页码列表 (pages.Pages)。通过遍历 pages.Pages，我们能够生成具体的页码链接，并通过 item.IsCurrent 判断当前页，从而添加相应的样式（例如 active 类）。

评论表单的集成

虽然本文主要围绕评论列表的显示与分页展开，但评论功能的核心也离不开评论提交。安企CMS同样提供了简洁的评论提交机制。一个基本的评论提交表单通常会像这样：

<form method="post" action="/comment/publish">
  <input type="hidden" name="return" value="html"> {# 提交后希望返回html内容 #}
  <input type="hidden" name="archive_id" value="{% archiveDetail with name="Id" %}"> {# 隐藏字段，指定评论关联的文档ID #}
  <div>
    <label>用户名</label>
    <div>
      <input type="text" name="user_name" required placeholder="请填写您的昵称" autocomplete="off">
    </div>
  </div>
  <div>
    <label>评论内容</label>
    <div>
      <textarea name="content" placeholder="您的评论..." rows="5"></textarea>
    </div>
  </div>
  {# 如果后台开启了验证码，这里还需要添加验证码相关的输入框和图片 #}
  <div style="margin-top: 15px;">
    <button type="submit">提交评论</button>
    <button type="reset">重置</button>
  </div>
</form>

请注意，archive_id 是必须的隐藏字段，它告诉系统这条评论是针对哪篇文档的。如果您的网站后台开启了评论验证码，还需要在表单中增加验证码相关的字段和图片，具体实现可以参考安企CMS的文档说明。

通过以上步骤，您就可以在安企CMS搭建的网站中，优雅地展示文档评论列表，并结合分页功能，提供给读者一个流畅的阅读和互动体验。

常见问题 (FAQ)

1. 为什么我的评论列表没有显示任何评论，即使后台有评论数据？ 这通常是由于评论的审核状态导致的。在安企CMS中，评论可能需要经过管理员审核才能在前台显示。请检查 commentList 标签内 item.Status 的判断逻辑，确保您展示了 Status = 1（已审核通过）的评论。如果后台设置了评论默认需要审核，那么新提交的评论在前台可能不会立即显示。

2. 我想为不同文档模型的评论列表设置不同的分页样式，应该怎么做？ 安企CMS的模板系统支持高度定制。您可以根据文档模型ID（moduleId）在模板文件中使用 if 语句来判断，然后加载不同的分页样式或布局。例如，可以检查 archive.ModuleId 的值，然后应用不同的CSS类或引用不同的 partial 分页模板。此外，design-director.md 中提到模板支持自定义名称，例如 comment/list.html，您可以为不同模型的评论列表创建特定的评论模板，并在后台进行关联。

3. 如何在非文档详情页显示某个特定文档的评论列表？ 在 commentList 标签中，archiveId 参数是可以手动指定的。这意味着即使您不在文档详情页，只要知道目标文档的ID，就可以通过 {% commentList comments with archiveId="目标文档ID" type="page" limit="10" %} 的方式来获取并显示该文档的评论列表和分页。