{% extends "base.html" %}
{% block title %}帳票マスタ — 保守デスク{% endblock %}
{% block content %}
<div class="head">
  <h1>帳票マスタ</h1>
  <div class="sub">帳票の種類ごとに複数のテンプレートを登録し、生成時に選べます。レイアウトも出力内容も自由に。</div>
</div>

<div class="grid">
  <div>
    <section class="card">
      <h2>カスタマイズの手順</h2>
      <ol style="margin:.4em 0 0 1.2em;padding:0;font-size:13.5px;line-height:2">
        <li>「標準テンプレート」をダウンロード</li>
        <li>Excelでレイアウト・文言・ロゴ等を自由に編集（<code>{{ '{{' }}名前{{ '}}' }}</code> が差し込み位置）</li>
        <li>名前を付けてマスタに登録 → 帳票生成時に選択できます</li>
      </ol>
      <p class="ai-note" style="margin-top:8px">
        同じ種類に何枚でも登録できます（例:「障害報告書 社内向け」「障害報告書 A社提出用」）。
        ★既定にしたものが、生成時に何も選ばなかったときに使われます（顧客専用の既定 &gt; 共通の既定 &gt; 標準）。
        繰り返し行（row:）に結合セルは使わないでください。
      </p>
    </section>

    <section class="card">
      <h2>標準テンプレート（編集の起点）</h2>
      <ul class="similar">
        {% for kind, ja in KIND_JA.items() %}
        <li><a href="/templates/builtin/{{ kind }}">{{ ja }} をダウンロード</a></li>
        {% endfor %}
      </ul>
    </section>

    <section class="card">
      <h2>差し込み変数（出力内容のカスタマイズ）</h2>
      <p class="ai-note">会社住所・電話番号など、テンプレートに差し込みたい自由項目。
        テンプレートには <code>{{ '{{' }}var.変数名{{ '}}' }}</code> と書きます。全帳票で使えます。</p>
      {% if vars %}
      <div class="tablewrap">
        <table>
          <thead><tr><th>プレースホルダ</th><th>値</th><th></th></tr></thead>
          <tbody>
            {% for name, value in vars.items() %}
            <tr>
              <td class="mono">{{ '{{' }}var.{{ name }}{{ '}}' }}</td>
              <td>{{ value }}</td>
              <td>
                <form method="post" action="/templates/vars/{{ name }}/delete" class="inline-form">
                  <button class="linkbtn" type="submit">削除</button>
                </form>
              </td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% endif %}
      <form method="post" action="/templates/vars">
        <label>変数名（英数字・アンダースコア）</label>
        <input type="text" name="name" placeholder="例: company_tel">
        <label>値</label>
        <input type="text" name="value" placeholder="例: 03-1234-5678">
        <div class="form-foot"><button class="btn ghost small" type="submit">追加・更新</button></div>
      </form>
    </section>
  </div>

  <div>
    <section class="card">
      <h2>登録済みテンプレート</h2>
      {% if master %}
      <div class="tablewrap">
        <table>
          <thead><tr><th>名前</th><th>種類</th><th>対象</th><th>既定</th><th>操作</th></tr></thead>
          <tbody>
            {% for tp in master %}
            <tr>
              <td class="title"><a href="/templates/{{ tp.id }}/download">{{ tp.name }}</a>
                {% if tp.warnings %}<span class="warn" title="{{ tp.warnings|join('、') }}">⚠ {{ tp.warnings|join('／') }}</span>{% endif %}
                <span class="cust">{{ tp.filename }}・登録 {{ tp.created_at }}</span>
              </td>
              <td>{{ KIND_JA[tp.kind] }}</td>
              <td>{% if tp.customer_id %}{{ tp.customer_name }} 専用{% else %}共通{% endif %}</td>
              <td>{% if tp.is_default %}★ 既定{% else %}
                <form method="post" action="/templates/{{ tp.id }}/default" class="inline-form">
                  <button class="linkbtn" type="submit">既定にする</button>
                </form>{% endif %}
              </td>
              <td>
                <form method="post" action="/templates/{{ tp.id }}/delete" class="inline-form"
                      onsubmit="return confirm('「{{ tp.name }}」を削除します。よろしいですか？')">
                  <button class="linkbtn" type="submit">削除</button>
                </form>
              </td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% else %}
      <div class="empty"><div class="emoji">📐</div><p class="lead">まだテンプレートが登録されていません。</p>
        <p>標準テンプレートをダウンロードして編集し、下のフォームから登録しましょう。標準のままでも帳票は生成できます。</p></div>
      {% endif %}

      <form method="post" action="/templates" enctype="multipart/form-data">
        <label>テンプレート名（省略時はファイル名）</label>
        <input type="text" name="name" placeholder="例: 障害報告書 A社提出用">
        <label>帳票の種類</label>
        <select name="kind">
          {% for kind, ja in KIND_JA.items() %}<option value="{{ kind }}">{{ ja }}</option>{% endfor %}
        </select>
        <label>対象</label>
        <select name="customer_id">
          <option value="">共通（全顧客で選択可）</option>
          {% for c in customers %}<option value="{{ c.id }}">{{ c.name }} 専用</option>{% endfor %}
        </select>
        <label>テンプレートファイル（.xlsx・5MBまで）</label>
        <input type="file" name="file" accept=".xlsx">
        <div class="form-foot"><button class="btn small" type="submit">マスタに登録</button></div>
      </form>
      <p class="ai-note">登録時にサンプルデータで検証し、未知のプレースホルダは⚠で表示します（登録は可能・該当箇所は空欄になります）。</p>
    </section>

    <section class="card">
      <h2>プレースホルダ早見表</h2>
      <div class="tablewrap">
        <table>
          <thead><tr><th>プレースホルダ</th><th>差し込まれる内容</th></tr></thead>
          <tbody>
            {% for name, desc in placeholders %}
            <tr><td class="mono">{{ '{{' }}{{ name }}{{ '}}' }}</td><td>{{ desc }}</td></tr>
            {% endfor %}
            {% for name, desc in row_placeholders %}
            <tr><td class="mono">{{ '{{' }}{{ name }}{{ '}}' }}</td><td>{{ desc }}</td></tr>
            {% endfor %}
            {% for name in vars %}
            <tr><td class="mono">{{ '{{' }}var.{{ name }}{{ '}}' }}</td><td>差し込み変数（左で定義）</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      <p class="ai-note">row: を含む行はチケット件数分だけ複製されます（月次の一覧向け）。</p>
    </section>
  </div>
</div>
{% endblock %}