{% extends "layout.twig" %}

{% block content %}
<div class="row">
    <div class="col-12">
        <div class="d-flex justify-content-between align-items-center mb-3">
            <h2><i class="fas fa-users-cog"></i> Управление пользователями</h2>
            <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#userModal" onclick="openCreateModal()">
                <i class="fas fa-plus"></i> Добавить пользователя
            </button>
        </div>

        {% if session.flash_message is defined and session.flash_message %}
        <div class="alert alert-{{ session.flash_type == 'error' ? 'danger' : 'success' }} alert-dismissible fade show">
            {{ session.flash_message|nl2br }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
        {% endif %}

        <div class="card">
            <div class="card-body">
                {% if users|length > 0 %}
                <div class="table-responsive">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Имя пользователя</th>
                                <th>Email</th>
                                <th>Роль</th>
                                <th>Telegram Chat ID</th>
                                <th>Email для алертов</th>
                                <th>Дата создания</th>
                                <th>Действия</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for user in users %}
                            <tr>
                                <td>{{ user.id }}</td>
                                <td><strong>{{ user.username }}</strong></td>
                                <td>{{ user.email|default('-') }}</td>
                                <td>
                                    {% if user.role == 'admin' %}
                                        <span class="badge bg-danger"><i class="fas fa-crown"></i> Администратор</span>
                                    {% else %}
                                        <span class="badge bg-secondary"><i class="fas fa-user"></i> Пользователь</span>
                                    {% endif %}
                                </td>
                                <td>{{ user.telegram_chat_id|default('-') }}</td>
                                <td>{{ user.email_for_alerts|default('-') }}</td>
                                <td>{{ user.created_at|date('d.m.Y H:i') }}</td>
                                <td>
                                    <button class="btn btn-sm btn-outline-primary" 
                                            data-bs-toggle="modal" data-bs-target="#userModal"
                                            onclick="openEditModal({{ user.id }}, '{{ user.username }}', '{{ user.email }}', '{{ user.role }}', '{{ user.telegram_chat_id }}', '{{ user.email_for_alerts }}')">
                                        <i class="fas fa-edit"></i>
                                    </button>
                                    <a href="/admin/users/{{ user.id }}/delete" 
                                       class="btn btn-sm btn-outline-danger"
                                       onclick="return confirm('Удалить пользователя {{ user.username }}?')">
                                        <i class="fas fa-trash"></i>
                                    </a>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
                {% else %}
                <div class="text-center py-4">
                    <i class="fas fa-users fa-3x text-muted mb-3"></i>
                    <p class="lead">Пользователи не найдены</p>
                </div>
                {% endif %}
            </div>
        </div>
    </div>
</div>

<!-- Модальная форма -->
<div class="modal fade" id="userModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <form id="userForm" method="post" action="/admin/users/save">
                <input type="hidden" name="csrf_name" value="{{ csrf_name }}">
                <input type="hidden" name="csrf_value" value="{{ csrf_value }}">
                <input type="hidden" id="user_id" name="user_id" value="">
                
                <div class="modal-header">
                    <h5 class="modal-title" id="modalTitle">Добавить пользователя</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="username" class="form-label">Имя пользователя *</label>
                        <input type="text" class="form-control" id="username" name="username" required>
                    </div>

                    <div class="mb-3">
                        <label for="email" class="form-label">Email</label>
                        <input type="email" class="form-control" id="email" name="email">
                    </div>

                    <div class="mb-3">
                        <label for="password" class="form-label">Пароль <span id="password_hint" class="text-muted small">(оставьте пустым чтобы не менять)</span></label>
                        <input type="password" class="form-control" id="password" name="password">
                    </div>

                    <div class="mb-3">
                        <label for="role" class="form-label">Роль</label>
                        <select class="form-select" id="role" name="role">
                            <option value="user">Пользователь</option>
                            <option value="admin">Администратор</option>
                        </select>
                    </div>

                    <hr>
                    <h6><i class="fas fa-bell"></i> Настройки уведомлений</h6>

                    <div class="mb-3">
                        <label for="telegram_chat_id" class="form-label">Telegram Chat ID</label>
                        <input type="text" class="form-control" id="telegram_chat_id" name="telegram_chat_id"
                               placeholder="1150922 или -1001234567890">
                        <div class="form-text small">ID личного чата или группы для уведомлений</div>
                    </div>

                    <div class="mb-3">
                        <label for="email_for_alerts" class="form-label">Email для алертов</label>
                        <input type="email" class="form-control" id="email_for_alerts" name="email_for_alerts"
                               placeholder="user@example.com">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
                    <button type="submit" class="btn btn-primary">
                        <i class="fas fa-save"></i> Сохранить
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
function openCreateModal() {
    document.getElementById('modalTitle').textContent = 'Добавить пользователя';
    document.getElementById('user_id').value = '';
    document.getElementById('username').value = '';
    document.getElementById('email').value = '';
    document.getElementById('password').value = '';
    document.getElementById('password').required = true;
    document.getElementById('password_hint').style.display = 'none';
    document.getElementById('role').value = 'user';
    document.getElementById('telegram_chat_id').value = '';
    document.getElementById('email_for_alerts').value = '';
    document.getElementById('userForm').action = '/admin/users/save';
}

function openEditModal(id, username, email, role, telegramChatId, emailForAlerts) {
    document.getElementById('modalTitle').textContent = 'Редактировать пользователя';
    document.getElementById('user_id').value = id;
    document.getElementById('username').value = username;
    document.getElementById('email').value = email === '' ? '' : email;
    document.getElementById('password').required = false;
    document.getElementById('password').value = '';
    document.getElementById('password').autocomplete = 'new-password';
    document.getElementById('password_hint').style.display = 'inline';
    document.getElementById('role').value = role;
    document.getElementById('telegram_chat_id').value = telegramChatId === '' ? '' : telegramChatId;
    document.getElementById('email_for_alerts').value = emailForAlerts === '' ? '' : emailForAlerts;
    document.getElementById('userForm').action = '/admin/users/save';
}
</script>

{% endblock %}