category.html

<div class="container" id="category">
  {% for p in posts %}
    {% if currentLoop.currentIndex == 0 %}
      <div class="article huge">
        <div class="featureimg" style="background-image: url('{% if p.ext_featureimg.length %}{{p.ext_featureimg}}{% else %}asset/defaultfeaimg.jpg{% /if %}')"></div>
        <div class="row content">
          <div class="col-md-2"></div>
          <div class="col-md-10 main">
            <div class="row">
              <div class="col-md-10 post">
                <div class="headline"><a href="{{ p.url }}">{{ p.title }}</a></div>
                {% if p.ext_subtitle.length %}<div class="subtitle">{{p.ext_subtitle}}</div>{% /if %}
                <div class="meta"><span class="time">$[timeformat('{{p.dateGTM}}')]</span></div>
                <div class="body">
                    {{ p.desContent }}
                </div>
                <div class="bottom">
                  <a href="{{ p.url }}" class="continue float-right">
                    继续阅读
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="otherposts row">
    {% else %}
        <div class="col-md-6">
          <a href="{{ p.url }}" class="item">
            <div class="article normal">
              <div class="featureimg" style="background-image: url('{% if p.ext_featureimg.length %}{{p.ext_featureimg}}{% else %}asset/defaultfeaimg.jpg{% /if %}')"></div>
              <div class="articleinfo">
                <div class="headline">{{ p.title }}</div>
                {% if p.ext_subtitle.length %}<div class="subtitle">{{p.ext_subtitle}}</div>{% /if %}
              </div>
            </div>
          </a>
        </div>
    {% /if %}
  {% /for %} 
  </div>
  <div class="pagenavi">
    <div class="item">{% if prevPageUrl.length %}<a href="{{ prevPageUrl }}">更新文章</a>{% else %}已是最新一页{% /if %}</div>
    <div class="item"> · </div>
    <div class="item">{% if nextPageUrl.length %}<a href="{{ nextPageUrl }}">旧有文章</a>{% else %}已是最旧一页{% /if %}</div>
  </div>
 </div>
 <script>
   let category = new Vue({
    el: '#category',
    data: {},
    methods: {
      indexOddandEven(index) {
        return index%2 ? 'odd' : 'even';
      },
      timeformat(raw) {
        return moment(raw).format("YYYY 年 MM 月 DD 日");
      }
    },
    delimiters: ['$[', ']']
  })
 </script>