<%- include('_ust', { baslik: 'Panel' }) %>
<div class="sayfa-bas">
  <h1>Panel</h1>
  <div class="hizli-islem"><a class="btn" href="/" target="_blank" rel="noopener">Siteyi gör ↗</a><a class="btn birincil" href="/yonetim/ayarlar">Ayarlar</a></div>
</div>

<% if (numaraUyari) { %><div class="uyari dikkat">⚠️ WhatsApp numarası henüz girilmedi (örnek numara duruyor). Arama numarası boşsa telefon düğmeleri de bu numarayı arar → <a href="/yonetim/ayarlar"><b>Ayarlar</b></a>'dan kendi numaralarını yaz.</div><% } %>
<% if (gunlukUyari) { %><div class="uyari dikkat">⚠️ <%= gunlukUyari %></div><% } %>

<div class="kartlar">
  <div class="kpi"><span>Bugün ziyaret</span><b><%= ozet.bugun.ziyaret %></b><small><%= ozet.bugun.tekil %> tekil ziyaretçi</small></div>
  <div class="kpi"><span>Bugün arama</span><b class="turuncu"><%= ozet.bugun.tel %></b><small>ziyaretçi aramaya bastı</small></div>
  <div class="kpi"><span>Bugün WhatsApp</span><b class="yesil"><%= ozet.bugun.wa %></b><small>ziyaretçi WhatsApp'a bastı</small></div>
  <div class="kpi"><span>Son 7 gün</span><b><%= ozet.son7.ziyaret %></b><small>ziyaret · <%= ozet.son7.iletisim %> iletişim</small></div>
  <div class="kpi"><span>Dönüşüm (30 gün)</span><b class="turuncu"><%= ozet.toplam.ziyaret ? Math.round(ozet.toplam.iletisim / ozet.toplam.ziyaret * 100) : 0 %>%</b><small><%= ozet.toplam.iletisim %> iletişim / <%= ozet.toplam.ziyaret %> ziyaret (<%= ozet.toplam.tel %> arama, <%= ozet.toplam.wa %> WA; ikisine basan 1 sayılır)</small></div>
</div>

<div class="kutu">
  <div class="kutu-bas"><h2>Son 14 gün</h2><span class="aciklama"><i class="kare mavi"></i> Ziyaret <i class="kare yesil"></i> Arama / WhatsApp</span></div>
  <% var maxV = Math.max(1, ...ozet.days.map(function (d) { return d.ziyaret; })); %>
  <div class="grafik">
    <% ozet.days.forEach(function (d) { %>
    <div class="grafik-sutun" title="<%= d.etiket %>: <%= d.ziyaret %> ziyaret, <%= d.iletisim %> iletişim">
      <div class="cubuklar"><i class="mavi" style="height:<%= Math.round(d.ziyaret / maxV * 100) %>%"></i><i class="yesil" style="height:<%= Math.round(d.iletisim / maxV * 100) %>%"></i></div>
      <span><%= d.ziyaret %></span><em><%= d.etiket %></em>
    </div>
    <% }) %>
  </div>
</div>

<div class="iki">
  <div class="kutu">
    <div class="kutu-bas"><h2>Hangi düğmeye basıldı (30 gün)</h2></div>
    <% if (!dugmeler.length) { %><p class="mut">Henüz tıklama yok.</p><% } else { %>
    <table>
      <tr><th>Düğme</th><th class="r">Arama</th><th class="r">WhatsApp</th></tr>
      <% dugmeler.forEach(function (d) { %>
      <tr><td><%= d.yer %></td><td class="r turuncu"><%= d.tel || '—' %></td><td class="r yesil"><%= d.wa || '—' %></td></tr>
      <% }) %>
    </table>
    <% } %>
    <% if (konular.length) { %>
    <div class="kutu-bas ust"><h2>WhatsApp'ta sorulan konular <small class="mut">(çipler + parça sayfalarındaki düğmeler)</small></h2></div>
    <div class="cipler"><% konular.forEach(function (k) { %><span class="cip"><%= k.konu %> <b><%= k.n %></b></span><% }) %></div>
    <% } %>
  </div>
  <div class="kutu">
    <div class="kutu-bas"><h2>Kaynaklar (30 gün)</h2></div>
    <% if (!ozet.kaynaklar.length) { %><p class="mut">Henüz ziyaret yok.</p><% } else { %>
    <table>
      <tr><th>Kaynak</th><th class="r">Ziyaret</th><th class="r">İletişim</th><th class="r">Dönüşüm</th></tr>
      <% ozet.kaynaklar.slice(0, 8).forEach(function (k) { %>
      <tr><td><%= k.kaynak %></td><td class="r"><%= k.ziyaret %></td><td class="r yesil"><%= k.iletisim %></td><td class="r"><%= k.ziyaret ? Math.round(k.iletisim / k.ziyaret * 100) : 0 %>%</td></tr>
      <% }) %>
    </table>
    <% } %>
    <div class="kutu-bas ust"><h2>Cihazlar</h2></div>
    <div class="cipler"><% ozet.cihazlar.forEach(function (c) { %><span class="cip"><%= c.cihaz %> <b><%= c.n %></b></span><% }) %><% if (!ozet.cihazlar.length) { %><span class="mut">—</span><% } %></div>
  </div>
</div>

<div class="kutu">
  <div class="kutu-bas"><h2>Son ziyaretler</h2><a class="mini" href="/yonetim/ziyaretciler">Tümü →</a></div>
  <% if (!son.length) { %><p class="mut">Henüz ziyaret yok. Siteyi bir telefondan açınca burada göreceksin (panelden giriş yaptığın tarayıcı sayılmaz).</p><% } else { %>
  <div class="tablo-kaydir"><table>
    <tr><th>Zaman</th><th>Sayfa</th><th>Kaynak</th><th>Cihaz</th><th>Süre</th><th class="r">Tık</th></tr>
    <% son.forEach(function (x) { %>
    <tr>
      <td class="tek"><%= fmt(x.ts) %></td>
      <td class="tek kisa" title="<%= x.sayfalar.join(' → ') %>"><%= x.sayfalar.join(' → ') %></td>
      <td><%= x.kaynak %></td>
      <td><%= x.cihaz %></td>
      <td class="tek"><% if (x.sure == null) { %>—<% } else if (x.sure >= 60) { %><%= Math.floor(x.sure / 60) %>dk <%= x.sure % 60 %>sn<% } else { %><%= x.sure %>sn<% } %></td>
      <td class="r"><% if (x.tel) { %><span class="etiket turuncu">Arama<%= x.tel > 1 ? ' ×' + x.tel : '' %></span><% } %><% if (x.wa) { %><span class="etiket yesil">WA<%= x.wa > 1 ? ' ×' + x.wa : '' %></span><% } %><% if (!x.wa && !x.tel) { %>—<% } %></td>
    </tr>
    <% }) %>
  </table></div>
  <% } %>
</div>
<%- include('_alt') %>
