{% extends "erp_base.html" %}

{% block head_extra %}<link rel="stylesheet" href="/static/vacation.css?v=20260530i" />{% endblock %}

{% block content %}
<section class="vac">

  <div class="vac-settings-head">
    <form method="get" action="/vacation/settings" class="vac-year-form">
      <label class="erp-field vac-year-field"><span>연도</span>
        <input class="erp-input" type="number" name="year" value="{{ year }}" min="2020" max="2100" />
      </label>
      <button type="submit" class="erp-btn erp-btn-outline">조회</button>
    </form>
  </div>

  <div class="vac-settings-grid">

    <!-- ── 공휴일 관리 ── -->
    <div class="erp-card vac-set-card">
      <div class="vac-card-head"><h2>공휴일 ({{ year }})</h2></div>

      <form method="post" action="/vacation/settings/holidays" class="vac-holiday-form">
        <label class="erp-field"><span>날짜 *</span>
          <input class="erp-input" type="date" name="holiday_date" required value="{{ year }}-01-01" />
        </label>
        <label class="erp-field"><span>이름 *</span>
          <input class="erp-input" type="text" name="name" required placeholder="예: 신정" />
        </label>
        <label class="erp-field"><span>종류</span>
          <select class="erp-select" name="kind">
            <option value="public">공휴일</option>
            <option value="lunar">음력</option>
            <option value="substitute">대체</option>
            <option value="company">회사지정</option>
          </select>
        </label>
        <label class="erp-check"><input type="checkbox" name="is_red" checked /> 빨강(달력 표시)</label>
        <button type="submit" class="erp-btn erp-btn-primary">추가 / 수정</button>
      </form>

      <div class="erp-table-wrap vac-set-scroll">
        <table class="erp-table">
          <thead><tr><th>날짜</th><th>이름</th><th>종류</th><th>빨강</th><th></th></tr></thead>
          <tbody>
            {% for h in holidays %}
            <tr>
              <td>{{ h.holiday_date }}</td>
              <td>{{ h.name }}</td>
              <td class="erp-muted">{{ h.kind }}</td>
              <td>{% if h.is_red %}●{% else %}○{% endif %}</td>
              <td>
                <form method="post" action="/vacation/settings/holidays/{{ h.id }}/delete"
                      onsubmit="return confirm('{{ h.holiday_date }} {{ h.name }} 삭제?');">
                  <input type="hidden" name="year" value="{{ year }}" />
                  <button type="submit" class="erp-btn erp-btn-danger erp-btn-sm">삭제</button>
                </form>
              </td>
            </tr>
            {% else %}
            <tr><td colspan="5" class="erp-muted">등록된 공휴일이 없습니다.</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>

    <!-- ── 연차 잔여 관리 ── -->
    <div class="erp-card vac-set-card">
      <div class="vac-card-head"><h2>연차 잔여 ({{ year }})</h2></div>

      <form method="post" action="/vacation/settings/balances" class="vac-balance-form">
        <input type="hidden" name="year" value="{{ year }}" />
        <label class="erp-field"><span>이메일 *</span>
          <input class="erp-input" type="email" name="user_email" required
                 placeholder="user@dbxcorp.co.kr" />
        </label>
        <label class="erp-field"><span>연차 일수 *</span>
          <input class="erp-input" type="number" name="total_days" step="0.5" min="0" required value="15" />
        </label>
        <label class="erp-field vac-full"><span>메모</span>
          <input class="erp-input" type="text" name="memo" placeholder="입사일/비고 등" />
        </label>
        <button type="submit" class="erp-btn erp-btn-primary">설정</button>
      </form>

      <div class="erp-table-wrap vac-set-scroll">
        <table class="erp-table">
          <thead><tr><th>이메일</th><th>연차</th><th>사용</th><th>메모</th></tr></thead>
          <tbody>
            {% for b in balances %}
            <tr>
              <td>{{ b.user_email }}</td>
              <td>{{ b.total_days }}</td>
              <td class="erp-muted">{{ b.used_days }}</td>
              <td class="erp-muted">{{ b.memo }}</td>
            </tr>
            {% else %}
            <tr><td colspan="4" class="erp-muted">설정된 연차가 없습니다.</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      <p class="erp-muted vac-set-note">사용 일수는 승인된 휴가 합계로 자동 계산됩니다.</p>
    </div>

  </div>
</section>
{% endblock %}