{% extends "base.html" %}
{% block title %}Admin - Lazarus{% endblock %}
{% block content %}
<h1>⚙️ پنل ادمین</h1>

<div class="card">
    <h3 style="color: #58a6ff;">📊 وضعیت پروژه</h3>
    <p style="color: #8b949e; margin-top: 8px;">
        وضعیت: <span class="badge badge-green">{{ progress.status }}</span>
        &nbsp;|&nbsp;
        پیشرفت: {{ progress.done }}/{{ progress.total }} ({{ progress.percent|int }}%)
    </p>
</div>

<div class="card">
    <h3 style="color: #58a6ff;">💬 چت با AI</h3>
    <div id="chat" style="height: 300px; overflow-y: auto; padding: 12px; background: #0d1117; border-radius: 8px; margin: 12px 0;">
    </div>
    <div style="display: flex; gap: 8px;">
        <input type="text" id="msg" placeholder="پیامت رو بنویس..." style="margin: 0; flex: 1;">
        <button class="btn" onclick="sendMsg()">ارسال</button>
    </div>
</div>

<div class="card">
    <h3 style="color: #58a6ff;">📁 سایت‌های ساخته شده</h3>
    {% for site in sites %}
    <div style="display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #30363d;">
        <span>{{ site.name }}</span>
        <a href="/preview/{{ site.name }}.html" target="_blank" class="btn" style="padding: 4px 12px;">👁️ مشاهده</a>
    </div>
    {% endfor %}
    {% if not sites %}
    <p style="color: #8b949e;">هنوز سایتی ساخته نشده</p>
    {% endif %}
</div>

<script>
function sendMsg() {
    const input = document.getElementById('msg');
    const chat = document.getElementById('chat');
    const msg = input.value.trim();
    if (!msg) return;

    // Add user message
    chat.innerHTML += '<div style="text-align:left; margin:8px 0;"><span style="background:#1f6feb; padding:8px 12px; border-radius:8px; display:inline-block;">' + msg + '</span></div>';
    input.value = '';
    chat.scrollTop = chat.scrollHeight;

    // Send to API
    fetch('/api/chat', {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({message: msg})
    })
    .then(r => r.json())
    .then(data => {
        let response = data.response || data.error || 'خطا';
        chat.innerHTML += '<div style="text-align:right; margin:8px 0;"><span style="background:#21262d; padding:8px 12px; border-radius:8px; display:inline-block;">' + response + '</span></div>';
        chat.scrollTop = chat.scrollHeight;
    });
}

document.getElementById('msg').addEventListener('keydown', function(e) {
    if (e.key === 'Enter') sendMsg();
});
</script>
{% endblock %}