{{include "header.html"}}
{{include "nav.html"}}

{{if index .ThemesExt "show_breadcrumb"}}
{{if .Nav}}
<nav class="breadcrumb">
  <div class="container">
    <a href="/">首页</a>
    {{range .Nav}}<span>/</span><a href="{{.URL}}">{{.Name}}</a>{{end}}
  </div>
</nav>
{{end}}
{{end}}

<main class="container page-layout">
  <section class="content-main">
    <div class="page-head">
      <p class="eyebrow">TRADE LIST</p>
      <h1>{{if .CurrentColumn}}{{.CurrentColumn.Title}}{{else}}交易列表{{end}}</h1>
      {{if .CurrentColumn}}{{if .CurrentColumn.Description}}<p>{{.CurrentColumn.Description}}</p>{{end}}{{end}}
    </div>

    {{if .CurrentColumn}}
    {{$filters := ColumnExtFilter .CurrentColumn .Request}}
    {{if $filters}}
    <div class="filter-panel">
      <div class="filter-title">
        <strong>筛选条件</strong>
        <a href="{{.CurrentColumn.URL}}">重置</a>
      </div>
      {{range $filters}}
      <div class="filter-row">
        <span>{{.Label}}</span>
        <div>
          {{range .Options}}
          {{if .URL}}<a class="{{if .Selected}}active{{end}}" href="{{.URL}}">{{.Label}}</a>{{end}}
          {{end}}
        </div>
      </div>
      {{end}}
    </div>
    {{end}}
    {{end}}

    {{if .List}}
    <div class="trade-list">
      {{range .List}}
      <a class="trade-card" href="{{.URL}}">
        <img src="{{DefaultCover .Img}}" alt="{{.Title}}">
        <div class="trade-info">
          <div class="deal-meta">
            <span>{{.ColumnName}}</span>
            {{if .Ext}}{{if index .Ext "badge"}}<em>{{index .Ext "badge"}}</em>{{end}}{{end}}
          </div>
          <h2>{{.Title}}</h2>
          <p>{{StrLimit .Description 108 "..."}}</p>
          <div class="field-grid">
            {{if .Ext}}
            {{if index .Ext "game_server"}}<span><b>区服</b>{{index .Ext "game_server"}}</span>{{end}}
            {{if index .Ext "trade_type"}}<span><b>类型</b>{{index .Ext "trade_type"}}</span>{{end}}
            {{if index .Ext "grade"}}<span><b>等级</b>{{index .Ext "grade"}}</span>{{end}}
            {{if index .Ext "delivery"}}<span><b>交付</b>{{index .Ext "delivery"}}</span>{{end}}
            {{end}}
          </div>
        </div>
        <div class="trade-side">
          <strong>{{if .Ext}}{{index .Ext "price_range"}}{{else if .Price}}{{printf "¥%.0f" .Price}}{{end}}</strong>
          <span>{{ParseTime .CreatedAt "2006-01-02"}}</span>
        </div>
      </a>
      {{end}}
    </div>

    {{if .Pager.Enabled}}
    <nav class="pager">
      {{if .Pager.HasPrev}}<a href="{{.Pager.PrevURL}}">上一页</a>{{end}}
      {{range .Pager.Items}}
      {{if .Active}}<span class="active">{{.Label}}</span>{{else if .URL}}<a href="{{.URL}}">{{.Label}}</a>{{else if eq .Kind "gap"}}<span>...</span>{{end}}
      {{end}}
      {{if .Pager.HasNext}}<a href="{{.Pager.NextURL}}">下一页</a>{{end}}
    </nav>
    {{end}}
    {{else}}
    <div class="empty-state">当前栏目暂无交易信息。</div>
    {{end}}
  </section>

  {{if index .ThemesExt "show_sidebar"}}
  {{include "sidebar.html"}}
  {{end}}
</main>

{{include "footer.html"}}
{{include "js.html"}}