{% extends "exam/base.html" %}
{% block title %}管理员登录 - 安全培训考试{% endblock %}
{% block content %}
<div class="header">
    <h1>🔐 管理员登录</h1>
    <div class="sub">安全培训考试系统管理后台</div>
</div>
<div class="container">
    <div class="card" style="max-width:400px; margin:40px auto;">
        <div class="card-title" style="text-align:center;">管理员身份验证</div>

        <form id="adminLoginForm">
            <div class="form-group">
                <label>用户名</label>
                <input type="text" class="form-control" id="username" name="username" 
                       placeholder="请输入管理员用户名" required value="admin">
            </div>
            <div class="form-group">
                <label>密码</label>
                <input type="password" class="form-control" id="password" name="password" 
                       placeholder="请输入管理员密码" required>
            </div>
            <button type="submit" class="btn btn-primary btn-block" id="submitBtn">登录</button>
        </form>

        <div id="result" style="display:none; margin-top:16px;">
            <div id="resultContent" style="padding:12px; border-radius:4px;"></div>
        </div>

        <div style="margin-top:20px; text-align:center;">
            <a href="/" class="btn" style="background:#f0f0f0; color:#666;">← 返回考试列表</a>
        </div>
    </div>
</div>

<script>
document.getElementById('adminLoginForm').addEventListener('submit', function(e) {
    e.preventDefault();
    var btn = document.getElementById('submitBtn');
    var result = document.getElementById('result');
    var resultContent = document.getElementById('resultContent');

    btn.disabled = true;
    btn.textContent = '登录中...';
    result.style.display = 'none';

    var formData = new FormData(this);

    fetch('/admin-login-api/', {
        method: 'POST',
        body: formData
    })
    .then(function(r) { return r.json(); })
    .then(function(data) {
        if (data.status === 'ok') {
            window.location.href = data.redirect;
        } else {
            result.style.display = 'block';
            resultContent.style.background = '#ffebee';
            resultContent.style.color = '#c62828';
            resultContent.innerHTML = '<strong>登录失败</strong><br>' + data.msg;
        }
    })
    .catch(function(err) {
        result.style.display = 'block';
        resultContent.style.background = '#ffebee';
        resultContent.style.color = '#c62828';
        resultContent.innerHTML = '<strong>请求失败</strong><br>请检查网络后重试';
    })
    .finally(function() {
        btn.disabled = false;
        btn.textContent = '登录';
    });
});
</script>
{% endblock %}