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

{{if .Content}}
{{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}}
    <span>/</span><span>{{.Content.Title}}</span>
  </div>
</nav>
{{end}}
{{end}}

<main class="container detail-page">
  <section class="detail-hero">
    <div class="detail-media">
      <img src="{{DefaultCover .Content.Img}}" alt="{{.Content.Title}}">
      {{if .Content.Albums}}
      <div class="album-row">
        {{$albums := .Content.Albums}}
        {{if eq (printf "%T" $albums) "string"}}
        {{range Split $albums ","}}{{if .}}<img src="{{.}}" alt="{{$.Content.Title}} 图集">{{end}}{{end}}
        {{else}}
        {{range $albums}}{{if .}}<img src="{{.}}" alt="{{$.Content.Title}} 图集">{{end}}{{end}}
        {{end}}
      </div>
      {{end}}
    </div>
    <div class="detail-summary">
      <p class="eyebrow">{{.Content.ColumnName}}</p>
      <h1>{{.Content.Title}}</h1>
      <p>{{.Content.Description}}</p>
      <strong class="detail-price">{{if .Content.Ext}}{{index .Content.Ext "price_range"}}{{else if .Content.Price}}{{printf "¥%.0f" .Content.Price}}{{end}}</strong>
      <div class="detail-actions">
        {{with Column "contact"}}<a class="btn btn-primary" href="{{.URL}}">咨询此交易</a>{{end}}
        {{if .Content.ColumnURL}}<a class="btn btn-ghost" href="{{.Content.ColumnURL}}">返回栏目</a>{{end}}
      </div>
      <div class="risk-box">
        <strong>交易提示</strong>
        <p>请先核验区服、绑定状态、交付方式和平台规则。当前主题仅展示信息，不包含支付或担保资金托管。</p>
      </div>
    </div>
  </section>

  <div class="detail-layout">
    <article class="detail-content">
      <section class="detail-section">
        <h2>关键字段</h2>
        <div class="spec-table">
          {{if .Content.Ext}}
          {{range $k, $v := .Content.Ext}}
          {{if and $v (ne $k "price_range")}}
          <div><span>{{$k}}</span><strong>{{$v}}</strong></div>
          {{end}}
          {{end}}
          {{end}}
        </div>
      </section>
      <section class="detail-section prose">
        <h2>交易说明</h2>
        {{.Content.Content|Str2Html}}
      </section>
      {{if .Content.Tags}}
      <section class="detail-section">
        <h2>标签</h2>
        <div class="tag-cloud">
          {{range .Content.Tags}}<a href="{{.URL}}">{{.Name}}</a>{{end}}
        </div>
      </section>
      {{end}}
      <section class="detail-section prev-next">
        {{if .Prev}}<a href="{{.Prev.URL}}">上一篇：{{.Prev.Title}}</a>{{end}}
        {{if .Next}}<a href="{{.Next.URL}}">下一篇：{{.Next.Title}}</a>{{end}}
      </section>
    </article>

    {{include "sidebar.html"}}
  </div>

  {{$related := Related .Content.Id 4}}
  {{if $related}}
  <section class="related-section">
    <div class="section-head inline">
      <div><p class="eyebrow">RELATED</p><h2>相关交易</h2></div>
    </div>
    <div class="deal-grid">
      {{range $related}}
      <a class="deal-card" href="{{.URL}}">
        <img src="{{DefaultCover .Img}}" alt="{{.Title}}">
        <div class="deal-body">
          <h3>{{.Title}}</h3>
          <p>{{StrLimit .Description 64 "..."}}</p>
          <strong class="price">{{ParseTime .CreatedAt "2006-01-02"}}</strong>
        </div>
      </a>
      {{end}}
    </div>
  </section>
  {{end}}
</main>
{{end}}

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