{% extends 'admin/admin_base.html' %}
{% block title %}Роли{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item"><a href="{{ url_for('admin.dashboard') }}">Главная</a></li>
<li class="breadcrumb-item active">Роли</li>
{% endblock %}
{% block admin_content %}
<div class="admin-toolbar"><div class="admin-toolbar__main">
                <h1 class="admin-toolbar__title"><i class="bi bi-person-badge"></i> Роли и политики</h1>
        
            </div><div class="admin-toolbar__actions">
            <button type="button" class="btn primary" id="createRoleBtn">
                <i class="bi bi-plus-lg"></i> Создать роль
            </button>
        </div>
    </div>
    <div class="admin-card">
        <div class="card-header"><h5 class="mb-0">Список ролей</h5></div>
        <div class="table-wrap">
            <table class="admin-table table table-hover align-middle">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Имя</th>
                        <th>Тип</th>
                        <th>Public API</th>
                        <th>Мин. длина пароля</th>
                        <th>Действия</th>
                    </tr>
                </thead>
                <tbody id="rolesTableBody">
                    <tr><td colspan="6" class="text-center">Загрузка...</td></tr>
                </tbody>
            </table>
        </div>
    </div>

<div class="modal fade" id="createRoleModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Создать роль</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <label class="form-label" for="createRoleName">Имя</label>
                    <input type="text" class="form-control" id="createRoleName" maxlength="32">
                </div>
                <div class="mb-3">
                    <label class="form-label" for="createRoleDescription">Описание</label>
                    <input type="text" class="form-control" id="createRoleDescription" maxlength="255">
                </div>
                <div class="mb-3">
                    <label class="form-label" for="createRoleType">Тип</label>
                    <select class="form-select" id="createRoleType">
                        <option value="custom">Пользовательская</option>
                        <option value="operator">Оператор</option>
                        <option value="auditor">Аудитор</option>
                    </select>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn ghost" data-bs-dismiss="modal">Отмена</button>
                <button type="button" class="btn primary" id="confirmCreateRoleBtn">Создать</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="editRoleModal" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Редактировать роль</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <input type="hidden" id="editRoleId">
                <p class="text-muted">Роль: <strong id="editRoleName"></strong></p>
                <div class="mb-3">
                    <label class="form-label" for="editRoleDescription">Описание</label>
                    <input type="text" class="form-control" id="editRoleDescription" maxlength="255">
                </div>
                <h6>Политика пароля</h6>
                <div class="row mb-3">
                    <div class="col-md-4">
                        <label class="form-label" for="editPolicyMinLength">Мин. длина</label>
                        <input type="number" class="form-control" id="editPolicyMinLength" min="6" max="128">
                    </div>
                    <div class="col-md-4">
                        <div class="form-check mt-4">
                            <input class="form-check-input" type="checkbox" id="editPolicyRequireUpper">
                            <label class="form-check-label" for="editPolicyRequireUpper">Заглавная буква</label>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-check mt-4">
                            <input class="form-check-input" type="checkbox" id="editPolicyRequireDigit">
                            <label class="form-check-label" for="editPolicyRequireDigit">Цифра</label>
                        </div>
                    </div>
                </div>
                <div class="mb-3">
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" id="editPolicyRequireSpecial">
                        <label class="form-check-label" for="editPolicyRequireSpecial">Спецсимвол</label>
                    </div>
                </div>
                <div class="form-check form-switch mb-3">
                    <input class="form-check-input" type="checkbox" id="editPublicApiBlocked">
                    <label class="form-check-label" for="editPublicApiBlocked">Блокировать Public API для роли</label>
                </div>
                <h6>Разрешения</h6>
                <div id="permissionsMatrix" class="border rounded p-3 mb-2">
                    <div class="text-muted">Загрузка каталога разрешений...</div>
                </div>
                <p class="text-muted small mb-0" id="permissionsReadonlyHint" style="display:none;">
                    Permissions системной роли доступны только для просмотра.
                </p>
            </div>
            <div class="modal-footer justify-content-between">
                <button type="button" class="btn ghost" id="deleteRoleBtn" style="display:none;">
                    <i class="bi bi-trash"></i> Удалить роль
                </button>
                <div>
                    <button type="button" class="btn ghost" data-bs-dismiss="modal">Отмена</button>
                    <button type="button" class="btn primary" id="saveRoleBtn">Сохранить</button>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
{% block admin_scripts %}
<script src="{{ url_for('static', filename='js/roles.js') }}"></script>
{% endblock %}