{{define "content"}}
<div class="page narrow">
  <header class="page-head">
    <div>
      <h1>{{if .D.IsNew}}新增套餐{{else}}编辑套餐{{end}}</h1>
      <p class="muted">按日套餐用起止日期计算剩余天数；按次套餐记录剩余次数。</p>
    </div>
  </header>

  <form method="post" class="form card" data-package-form
        action="{{if .D.IsNew}}/packages{{else}}/packages/{{.D.Package.ID}}/edit{{end}}">
    <label class="field"><span>套餐名称 <i>*</i></span>
      <input name="name" required maxlength="32" value="{{.D.Package.Name}}" placeholder="例如 包月日常 / 赛季深渊 / 10 次副本">
    </label>

    <fieldset class="field">
      <span>计费方式 <i>*</i></span>
      <div class="radios">
        <label><input type="radio" name="unit" value="day"{{if eq .D.Package.Unit "day"}} checked{{end}}>
          <b>按日</b><small>有开始日与结束日，每天一条待打任务，可打卡</small></label>
        <label><input type="radio" name="unit" value="count"{{if eq .D.Package.Unit "count"}} checked{{end}}>
          <b>按次</b><small>记录剩余次数，排期完成时自动扣 1 次，有效期可选</small></label>
      </div>
    </fieldset>

    <div class="grid-2">
      <label class="field"><span>默认量 <i>*</i></span>
        <div class="input-suffix">
          <input type="number" name="default_amount" min="1" max="10000" value="{{.D.Package.DefaultAmount}}" required>
          <b data-unit-label>{{if eq .D.Package.Unit "count"}}次{{else}}天{{end}}</b>
        </div>
      </label>
      <label class="field"><span>参考价（元，可空）</span>
        <input type="number" name="price" min="0" step="1" value="{{if .D.Package.HasPrice}}{{money .D.Package.PriceCents}}{{end}}" placeholder="例如 300">
      </label>
    </div>

    <div class="grid-2">
      <label class="field"><span>日历色签</span>
        <input type="color" name="color" value="{{.D.Package.Color}}">
      </label>
      <label class="field"><span>排序（小的靠前）</span>
        <input type="number" name="sort_order" value="{{.D.Package.SortOrder}}">
      </label>
    </div>

    <label class="check-line">
      <input type="checkbox" name="calendar_separate" value="1"{{if .D.Package.CalendarSeparate}} checked{{end}}>
      <span>在日历中独立显示<small>勾选后工作台和大屏的日历会为该套餐单独开一个标签页，便于把“每日任务”和其他委托分开看</small></span>
    </label>

    <label class="field"><span>说明</span>
      <textarea name="note" rows="2" maxlength="200" placeholder="套餐包含什么、怎么个打法">{{.D.Package.Note}}</textarea>
    </label>

    <div class="actions">
      <button class="btn btn-primary" type="submit">保存</button>
      <a class="btn" href="/packages">取消</a>
    </div>
  </form>
</div>
{{end}}