<%- include('../partials/head') %>
<div class="topbar"><div><h2>Dashboard</h2><small>API Key: <code><%= currentUser.api_key %></code></small></div><a class="btn secondary" href="/api-docs">API Docs</a></div>
<div class="content">
  <div class="grid">
    <div class="card"><h2>Tambah Device QR</h2><p class="note">Masukkan nomor sender, klik Koneksikan, lalu scan QR di panel kanan. Tidak ada pairing code di versi ini.</p><form method="post" action="/devices"><label>Nomor sender dengan kode negara<input name="sender" placeholder="62888xxxx" required></label><label>Label<input name="label" placeholder="CS 1"></label><button>Koneksikan QR</button></form></div>
    <div class="card"><h2>Auto Reply</h2><form method="post" action="/auto-replies"><label>Keyword<input name="keyword" required></label><label>Balasan<textarea name="reply" required></textarea></label><label>Scope<select name="scope"><option value="private">Private message saja</option><option value="group">Grup saja</option><option value="all">Private & grup</option></select></label><label><input type="checkbox" name="exact_match" style="width:auto"> Harus sama persis</label><button>Simpan</button></form></div>
  </div>
  <div class="chat-layout">
    <div class="device-list"><div class="device-head">Device WhatsApp</div><% devices.forEach(d=>{ %><div class="device-row"><b><%= d.label || d.sender %></b><span><%= d.sender %></span><div class="status">Status: <%= d.status %></div><form class="inline" method="post" action="/devices/<%=d.sender%>/reconnect"><button>Scan QR Ulang</button></form><form class="inline" method="post" action="/devices/<%=d.sender%>/logout"><button class="secondary">Logout</button></form><form class="inline" method="post" action="/devices/<%=d.sender%>/delete" onsubmit="return confirm('Hapus device ini?')"><button class="danger">Hapus</button></form></div><% }) %><% if(!devices.length){ %><div class="device-row"><b>Belum ada device</b><div class="status">Tambahkan nomor sender dulu.</div></div><% } %></div>
    <div class="chat-pane"><div class="chat-head"><div class="avatar">QR</div><div><b>Scan QR Login</b><small style="display:block;color:#667781">WhatsApp HP → Perangkat tertaut → Tautkan perangkat</small></div></div><div class="qr-box"><% const qdev = devices.find(d=>d.last_qr) || devices[0]; %><% if(qdev && qdev.last_qr){ %><h2>Scan QR untuk <%= qdev.sender %></h2><img class="qr" src="<%= qdev.last_qr %>"><div class="bubble">Buka WhatsApp di HP, pilih Perangkat tertaut, lalu scan QR ini.</div><% } else { %><h2>QR belum tersedia</h2><p>Klik <b>Koneksikan QR</b> atau <b>Scan QR Ulang</b>, tunggu 3–5 detik, lalu refresh.</p><% if(qdev && qdev.last_error){ %><p class="error"><%= qdev.last_error %></p><% } %><% } %></div></div>
  </div>
  <div class="card"><h2>Auto Reply Tersimpan</h2><table><tr><th>Keyword</th><th>Scope</th><th>Reply</th><th>Aksi</th></tr><% replies.forEach(r=>{ %><tr><td><%=r.keyword%></td><td><%=r.scope%></td><td><%=r.reply%></td><td><form method="post" action="/auto-replies/<%=r.id%>/delete"><button class="danger">Hapus</button></form></td></tr><% }) %></table></div>
  <div class="card"><h2>Report Pengiriman</h2><table><tr><th>Waktu</th><th>Sender</th><th>Tujuan</th><th>Status</th><th>Error</th></tr><% reports.forEach(r=>{ %><tr><td><%=r.created_at%></td><td><%=r.sender%></td><td><%=r.recipient%></td><td><%=r.status%></td><td><%=r.error||'-'%></td></tr><% }) %></table></div>
</div>
<%- include('../partials/foot') %>
