{% load custom_tags %}
{# ستون «شماره‌های تماس» مشتری — تک‌منبع برای همهٔ صفحاتِ ستون اطلاعات مشتری. #}
{# شماره‌ها از خودِ شیء customer استخراج می‌شوند (نه context view) تا هیچ صفحه‌ای بدون داده نماند. #}
{# با phones_editable=1 (قالب‌هایی که اسکریپت افزودن/حذف شماره دارند) دکمه‌های ویرایش هم می‌آیند. #}
{% customer_phones customer as sms_phone_entries %}
<div class="field column is-12-desktop is-12-mobile m-0">
  <label class="label">شماره‌های تماس</label>
  <div id="dynamic-phones-edit">
    {% for entry in sms_phone_entries %}
    <div class="field has-addons mt-2 ss02">
      <div class="control" style="width: 30%;">
        <input disabled value="{{ entry.title }}" name="phone_titles" class="input" type="text" placeholder="عنوان">
      </div>
      <div class="control is-expanded">
        <input disabled value="{{ entry.display }}" name="phones" class="input an_phone" type="text" placeholder="تلفن">
      </div>
      <div class="control">
        <a href="tel:{{ entry.display }}" class="button is-success" title="تماس با {{ entry.display }}">
          📞
        </a>
      </div>
      {% if perms.admin_panel.ManageSMS and entry.is_mobile %}
      <div class="control">
        <button type="button"
                class="button sms-primary-toggle {% if entry.is_primary %}is-warning{% else %}is-light{% endif %}"
                data-url="{% url 'admin_panel:sms_primary_toggle' customer.id %}"
                data-phone="{{ entry.raw }}"
                data-primary="{% if entry.is_primary %}true{% else %}false{% endif %}"
                title="{% if entry.is_primary %}برداشتن از شماره‌های اصلی پیامک{% else %}تعیین به‌عنوان شمارهٔ اصلی پیامک{% endif %}">{% if entry.is_primary %}★ اصلی{% else %}☆ اصلی{% endif %}</button>
      </div>
      {% endif %}
      {% if phones_editable and perms.admin_panel.ViewStore %}
      <div class="control">
        <button type="button" disabled class="button is-danger remove-phone-btn">-</button>
      </div>
      {% endif %}
    </div>
    {% empty %}
    <p class="help mt-2">شماره‌ای برای این مشتری ثبت نشده است.</p>
    {% endfor %}
  </div>
  {% if phones_editable and perms.admin_panel.ViewStore %}
  <button type="button" disabled id="add-more-phone-edit" class="button is-small is-info mt-2 w-100 add-phone-btn">
    + افزودن شماره دیگر
  </button>
  {% endif %}
</div>

{% if perms.admin_panel.ManageSMS %}
<script>
  // تعیین شمارهٔ اصلی پیامک از همین ستون (بدون فرم تودرتو) — با درخواست async و
  // بارگذاری مجدد صفحه تا وضعیت شماره‌ها و رنگ دکمه‌ها به‌درستی به‌روز شوند.
  (function () {
    if (window.__smsPrimaryToggleInit) { return; }
    window.__smsPrimaryToggleInit = true;

    function csrfToken() {
      var match = document.cookie.match(/(^|;\s*)csrftoken=([^;]+)/);
      return match ? decodeURIComponent(match[2]) : '';
    }

    document.addEventListener('click', function (event) {
      var btn = event.target.closest ? event.target.closest('.sms-primary-toggle') : null;
      if (!btn || btn.disabled) { return; }
      event.preventDefault();

      var body = new URLSearchParams();
      body.append('phone', btn.getAttribute('data-phone') || '');
      body.append('is_primary', btn.getAttribute('data-primary') === 'true' ? 'false' : 'true');

      btn.classList.add('is-loading');
      btn.disabled = true;

      fetch(btn.getAttribute('data-url'), {
        method: 'POST',
        credentials: 'same-origin',
        headers: {
          'X-CSRFToken': csrfToken(),
          'X-Requested-With': 'XMLHttpRequest',
          'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        },
        body: body.toString()
      }).then(function (response) {
        if (!response.ok) { throw new Error('HTTP ' + response.status); }
        window.location.reload();
      }).catch(function () {
        btn.classList.remove('is-loading');
        btn.disabled = false;
        window.alert('خطا در تغییر شمارهٔ اصلی. لطفاً دوباره تلاش کنید.');
      });
    });
  })();
</script>
{% endif %}