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

<main class="enterprise-shell enterprise-page">
  {{if index .ThemesExt "show_breadcrumb"}}
  {{if .Nav}}
  <div class="enterprise-section enterprise-breadcrumb-tight">
    <div class="enterprise-breadcrumb-trail enterprise-card-gap-compact">
      <a href="/" class="enterprise-text-primary enterprise-text-no-decoration">首页</a>
      {{range .Nav}}
      <span class="enterprise-muted">/</span>
      <a href="{{.URL}}" class="enterprise-text-no-decoration">{{.Name}}</a>
      {{end}}
    </div>
  </div>
  {{end}}
  {{end}}

  <section class="enterprise-section">
    {{if .Single}}
    <div class="enterprise-kicker">Products</div>
    <h1 class="enterprise-title">{{.Single.Name}}</h1>
    {{if .Single.Description}}<p class="enterprise-muted enterprise-section-desc-lg">{{.Single.Description}}</p>{{end}}
    {{else}}
    <div class="enterprise-kicker">Products</div>
    <h1 class="enterprise-title">产品中心</h1>
    {{end}}

    {{if .List}}
    <div class="enterprise-grid enterprise-grid-3 enterprise-margin-top-large">
      {{range .List}}
      <article class="enterprise-card">
        <a href="{{.URL}}">
          <img src="{{if .Img}}{{.Img}}{{else}}https://images.unsplash.com/photo-1516321497487-e288fb19713f?auto=format&fit=crop&w=1200&q=80{{end}}" alt="{{.Title}}" class="enterprise-min-h-230 enterprise-hero-cover">
        </a>
        <div class="enterprise-card-body">
          {{if .Ext}}
          {{$badge := index .Ext "badge"}}
          {{if $badge}}<div class="enterprise-pill enterprise-pill-soft">{{ $badge }}</div>{{end}}
          {{end}}
          <h3 class="enterprise-card-title-compact"><a href="{{.URL}}" class="enterprise-text-no-decoration">{{.Title}}</a></h3>
          <p class="enterprise-muted enterprise-line-18 enterprise-min-h-120">{{StrSub .Description 100}}</p>
          <div class="enterprise-card-meta-md">
            {{if .Price}}<span class="enterprise-price-compact">¥{{printf "%.2f" .Price}}</span>{{end}}
            <a class="enterprise-btn" href="{{.URL}}">查看详情</a>
          </div>
        </div>
      </article>
      {{end}}
    </div>

    {{if .Pager.Enabled}}
    <div class="enterprise-pagination">
      <div class="enterprise-pagination-inner">
        {{if .Pager.HasPrev}}<a class="enterprise-btn secondary" href="{{.Pager.PrevURL}}">上一页</a>{{end}}
        {{range .Pager.Items}}
        {{if .Active}}
        <span class="enterprise-btn enterprise-cursor-default">{{.Label}}</span>
        {{else if .URL}}
        <a class="enterprise-btn secondary" href="{{.URL}}">{{.Label}}</a>
        {{end}}
        {{end}}
        {{if .Pager.HasNext}}<a class="enterprise-btn secondary" href="{{.Pager.NextURL}}">下一页</a>{{end}}
      </div>
    </div>
    {{end}}
    {{else}}
    <div class="enterprise-muted enterprise-empty-state-lg">暂无产品</div>
    {{end}}
  </section>
</main>

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