{{define "syb/detail_modal"}}
{{with .D}}
<div class="modal-head">
  <h2>处理订单 {{.OrderNo}}</h2>
  <button type="button" class="modal-x" data-modal-close aria-label="关闭">×</button>
</div>

<div class="modal-body form-stack">
  <p><span class="status-pill">{{.StageText}}</span>
    {{if .MappingSourceText}}<span class="status-pill mapping-source {{.MappingSourceClass}}" title="{{.MappingSourceHelp}}">{{.MappingSourceText}}</span>{{end}}
  </p>
  <p class="hint">{{.StageHelp}}</p>
  <dl class="detail">
    <dt>明细 ID</dt><dd>{{.SybID}}</dd>
    <dt>商品</dt><dd>{{.Title}}</dd>
    <dt>顺运宝规格</dt><dd>{{if .ProductSpec}}{{.ProductSpec}}{{else}}—{{end}}</dd>
    <dt>数量</dt><dd>{{.Quantity}}</dd>
    <dt>蝦皮商品 ID</dt><dd>{{.ShopeeGoodsID}}</dd>
  </dl>

  {{if eq .Stage "spec_missing"}}
  <p class="missing" role="alert">顺运宝没有提供规格原文，系统无法安全判断要采购的颜色和尺码。请先核对上游货运单数据。</p>
  {{else}}
  <h3>关联采购商品</h3>
  {{if .PddAssociationText}}<p class="hint" role="status">{{.PddAssociationText}}；仅在需要更换采购商品时修改下面的关联。</p>{{end}}
  <form method="post" action="/syb/associate-pdd" class="form-stack">
    <input type="hidden" name="csrf_token" value="{{$.CSRFToken}}">
    <input type="hidden" name="syb_id" value="{{.SybID}}">
    <input type="hidden" name="order_no" value="{{$.Keyword}}">
    <input type="hidden" name="shop" value="{{$.ShopFilter}}">
    <input type="hidden" name="stage" value="{{$.StageFilter}}">
    <input type="hidden" name="page" value="{{$.CurrentPage}}">
    <div class="field">
      <label for="syb-pdd-url">PDD 商品链接或商品 ID</label>
      <input id="syb-pdd-url" type="text" name="pdd_url" value="{{.PddURL}}" required placeholder="完整拼多多链接，或 737116531267">
      <small>{{if .PddGoodsID}}当前 PDD 商品 ID：{{.PddGoodsID}}。可以粘贴完整拼多多链接或 6～24 位纯数字商品 ID。{{else}}可以粘贴带 goods_id 的完整拼多多链接，或直接输入 6～24 位纯数字商品 ID。{{end}}</small>
    </div>
    {{if .PddGoodsID}}
    <label class="check-line"><input type="checkbox" name="confirm_replace" value="1">如果新链接是其他商品，我确认更换当前关联</label>
    {{end}}
    <div><button type="submit" class="primary">保存 PDD 关联</button></div>
  </form>

  {{if .PddGoodsID}}
  <form method="post" action="/syb/collect-pdd" class="form-stack">
    <input type="hidden" name="csrf_token" value="{{$.CSRFToken}}">
    <input type="hidden" name="syb_id" value="{{.SybID}}">
    <input type="hidden" name="order_no" value="{{$.Keyword}}">
    <input type="hidden" name="shop" value="{{$.ShopFilter}}">
    <input type="hidden" name="stage" value="{{$.StageFilter}}">
    <input type="hidden" name="page" value="{{$.CurrentPage}}">
    {{if .CanCollect}}
    <div class="field">
      <label for="syb-detail-collect-client">执行客户端</label>
      <select id="syb-detail-collect-client" name="client_id">
        <option value="">不指定（任意客户端可领取）</option>
        {{range $.AssignableClients}}
        <option value="{{.ClientID}}">{{.Name}}（{{.ClientID}}，{{.Status}}）</option>
        {{end}}
      </select>
      <small>通常保持不指定即可；指定后任务只等待该客户端领取。</small>
    </div>
    <div><button type="submit">{{if or (eq .CollectStatus "failed") (eq .Stage "pdd_collecting_stale")}}重新创建采集任务{{else}}创建采集任务{{end}}</button></div>
    {{else}}
    <span class="hint">{{if eq .CollectStatus "collecting"}}采集任务正在执行，请稍后刷新。{{else}}PDD 数据已采集，下一步匹配采购规格。{{end}}</span>
    {{end}}
  </form>

  {{if eq .CollectStatus "collected"}}
  <h3>匹配采购规格</h3>
  {{if .PddChoices}}
  <form method="post" action="/syb/match" class="form-stack">
    <input type="hidden" name="csrf_token" value="{{$.CSRFToken}}">
    <input type="hidden" name="syb_id" value="{{.SybID}}">
    <input type="hidden" name="context_version" value="{{.ContextVersion}}">
    <input type="hidden" name="order_no" value="{{$.Keyword}}">
    <input type="hidden" name="shop" value="{{$.ShopFilter}}">
    <input type="hidden" name="stage" value="{{$.StageFilter}}">
    <input type="hidden" name="page" value="{{$.CurrentPage}}">
    <div class="field">
      <label for="syb-pdd-option">顺运宝 {{.ProductSpec}} 对应的 PDD 规格</label>
      <select id="syb-pdd-option" name="pdd_option_key" required>
        <option value="">请选择，不做相似规格猜测</option>
        {{range .PddChoices}}
        <option value="{{.Key}}" {{if .Selected}}selected{{end}}>{{if .Recommended}}★ 建议 · {{end}}{{.Label}} · {{.PriceText}}</option>
        {{end}}
      </select>
      {{range .PddChoices}}{{if .Recommended}}<small>推荐理由：{{.RecommendationReason}}</small>{{end}}{{end}}
      {{if .RecommendationNotice}}<small role="status">{{.RecommendationNotice}}</small>{{end}}
      <small>PDD 维度来自采集结果：{{range $i, $name := .PddDimensionNames}}{{if $i}} / {{end}}{{$name}}{{end}}。保存后相同蝦皮商品 + 顺运宝规格 + 当前 PDD 商品会复用。</small>
    </div>
    {{if and (not .MappingValid) .PddChoices}}<p class="missing">尚无有效映射，或原映射已不在最新采集结果中，请重新选择。</p>{{end}}
    <div><button type="submit" class="primary">保存规格映射</button> <small>请核对颜色、尺码和体重范围。</small></div>
  </form>
  {{else}}
  <p class="missing">最新采集结果里没有可购买的规格组合，请核对 PDD 商品或重新采集。</p>
  {{end}}
  {{if .HasActiveTask}}<p class="hint">这条明细已有未结束采购任务，请到“采集采购”页面查看，不要重复创建。</p>{{end}}
  {{end}}
  {{end}}
  {{end}}
</div>

<div class="modal-foot">
  <button type="button" data-modal-close>关闭</button>
</div>
{{end}}
{{end}}