Shopware 6 订单列表：仅在有评论时显示评论图标
2024-03-07 21:45:17
在 Shopware 6 的后台管理中，订单列表默认会为每个订单显示一个评论图标，无论该订单是否真的有客户评论。这可能会让列表显得有些混乱，尤其当大部分订单都没有评论时。本文将介绍如何修改订单列表视图，使其仅在订单存在客户评论时才显示评论图标，从而使界面更加简洁直观。
实现方案
要实现这个功能，我们需要修改 Shopware 6 后台管理的订单列表模板。具体步骤如下：
1. 找到订单列表模板文件
订单列表的模板文件位于 Shopware 6 安装目录下的以下路径：
vendor/shopware/administration/Resources/app/administration/src/module/sw-order/page/sw-order-list/sw-order-list.html.twig
2. 修改模板文件
在 sw-order-list.html.twig 文件中，找到显示评论图标的部分。通常情况下，它会包含类似以下代码：
<sw-button
class="sw-order-list__comment-action"
size="small"
@click="onOpenCustomerCommentModal(item)"
>
<sw-icon name="regular-comments" size="12"></sw-icon>
</sw-button>
我们需要修改这段代码，使其根据订单是否有评论来决定是否显示图标。可以使用 Twig 的条件语句来实现：
{% if item.customerComment %}
<sw-button
class="sw-order-list__comment-action"
size="small"
@click="onOpenCustomerCommentModal(item)"
>
<sw-icon name="regular-comments" size="12"></sw-icon>
</sw-button>
{% endif %}
这段代码的意思是：如果订单的 customerComment 属性不为空，则显示评论图标按钮；否则，不显示任何内容。
3. 清除缓存
修改完模板文件后，需要清除 Shopware 6 的缓存才能使更改生效。可以使用以下命令清除缓存：
bin/console cache:clear
4. 验证结果
清除缓存后，刷新 Shopware 6 后台管理的订单列表页面。现在，只有存在客户评论的订单才会显示评论图标。
一些额外的考虑
- 显示不同的图标 : 如果希望在没有评论时显示一个不同的图标，例如一个空的评论气泡，可以在
{% else %}部分添加相应的代码。 - 添加提示信息 : 可以使用
title属性为评论图标添加提示信息，例如显示评论的内容或评论的日期。 - 自定义评论内容 : 可以使用 Twig 的过滤器来格式化评论内容，例如截取过长的评论或高亮显示关键词。
常见问题解答
问：我修改了模板文件，但没有生效，怎么办？
答：首先确保你已经清除了 Shopware 6 的缓存。如果仍然没有生效，可以尝试重启服务器或者重新构建前端资源。
问：我想在没有评论时显示一个灰色的图标，如何实现？
答：可以在 {% else %} 部分添加一个灰色的图标，例如：
{% else %}
<sw-icon name="regular-comments" size="12" color="#ccc"></sw-icon>
{% endif %}
问：我想在评论图标上显示评论的数量，如何实现？
答：需要修改后端代码来获取评论的数量，然后在模板中使用 {{ item.commentCount }} 这样的语法来显示评论数量。
问：我可以自定义评论图标的样式吗？
答：可以使用 CSS 来修改评论图标的样式，例如修改颜色、大小或添加边框等。
问：我找不到 sw-order-list.html.twig 文件，怎么办？
答：请确保你使用的是 Shopware 6 的正确版本，并且已经正确安装了 Shopware 6。你也可以尝试使用搜索工具来查找该文件。
