如何按状态将收集的液体分成3列,

时间:2019-02-18 12:37:45

标签: arrays collections jekyll liquid

我想将我的收藏品分为3个列,用于3种不同的状态。而且,如果没有具有该状态的演出/项目,则必须说“没有项目”

我已经尝试过了:

<div class="col-sm">
    <h2>Up next</h2>
    {% assign next = site.gigs | gig.status == 'Next' | sort: gig.date %}
    {% if next.gigs.size == 0 %}
      No projects
    {% else %}
      {% for gig in next %}
        {{ gig.title }}
      {% endfor %}
    {% endif %}
</div>
<div class="col-sm">
    <h2>Working on</h2>
    {% assign on = site.gigs | gig.status == 'On' | sort: gig.date %}
    {% if on.gigs.size == 0 %}
      No projects
    {% else %}
      {% for gig in on %}
        {{ gig.title }}
      {% endfor %}
    {% endif %}
</div>
<div class="col-sm">
    <h2>Done</h2>
    {% assign done = site.gigs | gig.status == 'Done' | sort: gig.date %}
    {% if done.gigs.size == 0 %}
      No projects
    {% else %}
      {% for gig in done %}
        {{ gig.title }}
      {% endfor %}
    {% endif %}
</div>

但是它只是排列所有演出/项目:(

也许可以用更简单的方式来完成。 我不知道您是否可以通过计算不同状态的数量来编写一个紧凑的液体代码并排列3列。

帮助!

1 个答案:

答案 0 :(得分:0)

订购

我们的状态为“下一步”,“打开”和“完成”。必须按这样的顺序订购它们。 由于这不是按字母顺序排序的顺序,因此我们需要自行定义此顺序。

_config.yml 中:

status-order:
  -
   name: "Next"        ### status as it is set on gigs (!!! Case-Sensitive !!!)
   display: "Up Next"  ### status column header to display
  -
   name: "On"
   display: "Working On"
  -
   name: "Done"
   display: "Done"

我们现在可以遍历site.status-order并以期望的状态顺序获得演出。

{% for status in site.status-order %}
  {{ status.name }} - {{ status.display }}
{% endfor %}

展示

由于您当前的代码有些重复,因此我们可以将其分解为这样:

{% for status in site.status-order %}
  {% assign items = site.gigs | where: 'status', status.name | sort: date %}
  <div class="col-sm">
    <h2>{{ status.display }} ({{ items.size }})</h2>
    {% if items.size > 0 %}
      <ul>
      {% for item in items %}
        <li><a href="{{ site.baseurl }}{{ item.url }}">{{ item.title }}</a></li>
      {% endfor %}
      </ul>
    {% else %}
      No project
    {% endif %}
</div>
{% endfor %}

注意

您必须确保使用正确的大小写设置状态(例如:“下一个”而不是“下一个”)。

和正确的类型。如果设置status: On,则将其理解为true布尔值,而不是string“ on”。在这种情况下,正确的状态表达式为status: "On"。必须用双引号或双引号将其理解为“ On”字符串。

任何带有错误大小写或状态表达式的项目都不会出现在我们的列表中。