{% extends "base.html" %}
{% block title %}Telefonija — {{ owner.tenant.name }}{% endblock %}
{% block nav %}{% include "dashboard/_nav.html" %}{% endblock %}
{% block content %}
<h1>Telefonija</h1>

<div class="card">
  <h2>Vaš Gogo broj</h2>
  {% if number %}
    <p style="font-size:22px;margin:4px 0"><b>{{ number.msisdn }}</b></p>
    <p class="muted">Na ovaj broj se prosljeđuju pozivi s vašeg postojećeg broja kad se niko
    ne javi. Vaši klijenti i dalje zovu vaš stari broj — ništa se ne mijenja.</p>
    <h2 style="margin-top:20px">Uključivanje prosljeđivanja</h2>
    <p class="muted">Ukucajte ove kodove na telefonu na kojem je SIM vašeg salonskog broja
    (poziv se pokreće tipkom za zvanje). Odaberite svog operatera:</p>
    {% for f in forwarding %}
    <details {{ 'open' if loop.first }}>
      <summary style="cursor:pointer;font-weight:600;padding:6px 0">{{ f.operator_label }}</summary>
      <table>
        <tr><td class="muted">Kad se ne javite ({{ t.ring_timeout_s }}s)</td><td><code>{{ f.activate_no_answer }}</code></td></tr>
        <tr><td class="muted">Kad je zauzeto</td><td><code>{{ f.activate_busy }}</code></td></tr>
        <tr><td class="muted">Kad ste nedostupni</td><td><code>{{ f.activate_unreachable }}</code></td></tr>
        <tr><td class="muted">Isključi sva prosljeđivanja</td><td><code>{{ f.deactivate_all }}</code></td></tr>
        <tr><td class="muted">Provjera statusa</td><td><code>{{ f.check_status }}</code></td></tr>
      </table>
    </details>
    {% endfor %}
  {% else %}
    <p class="banner">Broj vam još nije dodijeljen — Gogo tim će to obaviti pri uključenju.</p>
  {% endif %}
</div>

<div class="card">
  <h2>Zvonjenje osoblju prije asistenta</h2>
  <form method="post" action="/dash/telephony">
    <label><input type="checkbox" name="ring_first_enabled" {{ 'checked' if t.ring_first_enabled }}
      style="width:auto"> Prvo zvoni osoblju, asistent se javlja tek ako se niko ne javi</label>
    <div class="grid2">
      <div>
        <label>Koliko dugo zvoni osoblju <small>(sekundi)</small></label>
        <input type="number" name="ring_timeout_s" value="{{ t.ring_timeout_s }}" min="5" max="60">
      </div>
      <div>
        <label>Način zvonjenja</label>
        <select name="ring_strategy">
          <option value="ring_all" {{ 'selected' if t.ring_strategy=='ring_all' }}>Svi odjednom</option>
          <option value="sequential" {{ 'selected' if t.ring_strategy=='sequential' }}>Jedan po jedan</option>
        </select>
      </div>
    </div>
    <button style="margin-top:12px">Sačuvaj</button>
  </form>
</div>

<div class="card">
  <h2>Osoblje (aplikacija za javljanje)</h2>
  <p class="muted">Svaka radnica instalira besplatnu aplikaciju (preporučujemo
  <b>Linphone</b>, može i Zoiper/Groundwire) i skenira svoj QR kod ili prepiše podatke.
  Kad zazvoni salon, zazvoni i aplikacija.</p>
  <table>
    <tr><th>Ime</th><th>SIP korisničko ime</th><th>Podešavanje</th><th></th></tr>
    {% for w in workers %}
    <tr>
      <td>{{ w.name }}</td>
      <td><code>{{ w.sip_username }}</code></td>
      <td><a class="btn small ghost" href="/dash/workers/{{ w.id }}/setup">QR + podaci</a></td>
      <td><form method="post" action="/dash/workers/{{ w.id }}/delete"
            onsubmit="return confirm('Ukloniti {{ w.name }} iz zvonjenja?')">
          <button class="small red">Ukloni</button></form></td>
    </tr>
    {% else %}
    <tr><td colspan="4" class="muted">Još nema dodanog osoblja.</td></tr>
    {% endfor %}
  </table>
  <form method="post" action="/dash/workers" style="margin-top:12px;display:flex;gap:8px">
    <input type="text" name="name" placeholder="Ime radnice/radnika" required style="max-width:260px">
    <button class="green">Dodaj</button>
  </form>
</div>
{% endblock %}