{include file="_partials/head.tpl"}

<div class="page-head">
  <div>
    <h1>[if {row.id}]{row.code}[else]{lang key="shop.promocode.new"}[/if]</h1>
    <p class="muted"><a href="/admin/shop/promocodes">{lang key="shop.promocode.back_to_list"}</a></p>
  </div>
</div>

<form method="post" action="{form_action}" class="card">
  {csrf}

  <div class="form-row">
    <div class="form-group">
      <label>{lang key="shop.promocode.code_required"}</label>
      <div class="input-group">
        <input type="text" name="code" value="{row.code}" required style="text-transform:uppercase" placeholder="SUMMER2026" data-promo-code>
        <button type="button" class="btn btn-secondary input-group-btn" data-promo-generate title="{lang key="shop.promocode.generate_hint"}">
          {icon name="refresh-cw" size="14"} {lang key="shop.promocode.generate"}
        </button>
      </div>
    </div>
    <div class="form-group">
      <label>{lang key="shop.promocode.type"}</label>
      <select name="type">
        <option value="percent"       [if {row.type}="percent"]selected[/if]>{lang key="shop.promocode.type_percent_full"}</option>
        <option value="fixed"         [if {row.type}="fixed"]selected[/if]>{lang key="shop.promocode.type_fixed_short"}</option>
        <option value="free_shipping" [if {row.type}="free_shipping"]selected[/if]>{lang key="shop.promocode.type_free_ship"}</option>
      </select>
    </div>
    <div class="form-group">
      <label>{lang key="shop.promocode.value"}</label>
      <input type="number" min="0" step="0.01" name="value" value="{row.value}">
    </div>
  </div>

  <div class="form-row">
    <div class="form-group">
      <label>{lang key="shop.promocode.min_amount"}, {currency}</label>
      <input type="number" min="0" step="0.01" name="min_amount" value="{row.min_amount}" placeholder="{lang key="shop.promocode.min_amount_placeholder"}">
    </div>
    <div class="form-group">
      <label>{lang key="shop.promocode.usage_limit"}</label>
      <input type="number" min="0" name="usage_limit" value="{row.usage_limit}" placeholder="{lang key="shop.promocode.usage_placeholder"}">
    </div>
  </div>

  <fieldset class="form-fieldset">
    <legend>{icon name="calendar" size="14"} {lang key="shop.promocode.validity"}</legend>
    <div class="form-row">
      <div class="form-group">
        <label>{lang key="shop.promocode.starts_at"}</label>
        <input type="datetime-local" name="starts_at" value="{row.starts_at}">
      </div>
      <div class="form-group">
        <label>{lang key="shop.promocode.ends_at"}</label>
        <input type="datetime-local" name="ends_at" value="{row.ends_at}">
      </div>
    </div>
  </fieldset>

  <div class="form-group">
    <label>{lang key="shop.promocode.comment_internal"}</label>
    <textarea name="comment" rows="3">{row.comment}</textarea>
  </div>

  <div class="form-group">
    <label class="checkbox">
      <input type="checkbox" name="is_active" value="1" [if {row.is_active}]checked[/if]>
      Активен
    </label>
  </div>

  <div class="form-actions">
    <button type="submit" class="btn btn-primary">{lang key="admin.save"}</button>
    <a href="/admin/shop/promocodes" class="btn btn-secondary">{lang key="admin.cancel"}</a>
  </div>
</form>

<script>
(function () {
  var btn = document.querySelector('[data-promo-generate]');
  var input = document.querySelector('[data-promo-code]');
  if (!btn || !input) return;
  // Без I/O/L/0/1 — чтобы пользователь не путал символы при ручном вводе.
  var alphabet = 'ABCDEFGHJKMNPQRSTUVWXYZ23456789';
  btn.addEventListener('click', function () {
    var len = 10;
    var out = '';
    if (window.crypto && window.crypto.getRandomValues) {
      var buf = new Uint32Array(len);
      window.crypto.getRandomValues(buf);
      for (var i = 0; i < len; i++) out += alphabet[buf[i] % alphabet.length];
    } else {
      for (var j = 0; j < len; j++) out += alphabet[Math.floor(Math.random() * alphabet.length)];
    }
    input.value = out;
    input.focus();
    input.dispatchEvent(new Event('input', { bubbles: true }));
  });
})();
</script>

{include file="_partials/foot.tpl"}
