{% extends "admin/admin_base.html" %}

{% block admin_content %}
<div class="admin-toolbar">
    <div class="admin-toolbar__main">
        <h1 class="admin-toolbar__title"><i class="bi bi-plugin" aria-hidden="true"></i> Управление плагинами</h1>
        <p class="admin-toolbar__meta muted">Список, порядок выполнения и метрики плагинов ядра</p>
    </div>
    <div class="admin-toolbar__actions">
        <button type="button" class="btn ghost btn-sm" onclick="refreshPlugins()" title="Обновить список">
            <i class="bi bi-arrow-clockwise" aria-hidden="true"></i> Обновить
        </button>
    </div>
</div>

<div class="tabs plugin-tabs" role="tablist">
    <button type="button" class="tab active" data-plugin-tab="list" id="list-tab">
        <i class="bi bi-list-ul" aria-hidden="true"></i> Список плагинов
    </button>
    <button type="button" class="tab" data-plugin-tab="order" id="order-tab">
        <i class="bi bi-sort-alpha-down" aria-hidden="true"></i> Порядок выполнения
    </button>
    <button type="button" class="tab" data-plugin-tab="metrics" id="metrics-tab">
        <i class="bi bi-speedometer2" aria-hidden="true"></i> Метрики
    </button>
</div>

<section class="plugin-panel active" id="plugin-tab-list" role="tabpanel">
    <article class="admin-card card">
        <div class="toolbar">
            <h3 class="mb-0">Плагины</h3>
            <div class="toolbar-controls plugin-filters">
                <input type="search" class="form-control form-control-sm" id="pluginSearch" placeholder="Поиск по имени, описанию, автору…" aria-label="Поиск">
                <select class="form-select form-select-sm" id="pluginStatusFilter" aria-label="Статус">
                    <option value="">Все статусы</option>
                    <option value="started">Запущен</option>
                    <option value="stopped">Остановлен</option>
                    <option value="loaded">Загружен</option>
                    <option value="available">Доступен</option>
                </select>
                <select class="form-select form-select-sm" id="pluginCompatibleFilter" aria-label="Совместимость">
                    <option value="">Совместимость</option>
                    <option value="true">Совместим</option>
                    <option value="false">Не совместим</option>
                </select>
                <select class="form-select form-select-sm" id="pluginRequiredFilter" aria-label="Обязательность">
                    <option value="">Обязательность</option>
                    <option value="true">Обязательный</option>
                    <option value="false">Не обязательный</option>
                </select>
                <label class="checkbox-inline">
                    <input type="checkbox" id="pluginIncludeAvailable" onchange="refreshPlugins()"> Показать доступные
                </label>
                <button type="button" class="btn primary btn-sm" onclick="refreshPlugins()">
                    <i class="bi bi-arrow-clockwise" aria-hidden="true"></i> Обновить
                </button>
            </div>
        </div>
        <div class="table-wrap">
            <div id="pluginsContainer">
                <table class="plugin-table">
                    <thead>
                        <tr>
                            <th>Имя</th>
                            <th>Версия</th>
                            <th>Описание</th>
                            <th>Статус</th>
                            <th>Совместимость</th>
                            <th>Разрешения</th>
                            <th>Действия</th>
                        </tr>
                    </thead>
                    <tbody id="pluginTableBody">
                        <tr>
                            <td colspan="7" class="empty-cell text-center">
                                <div class="spinner-border text-primary spinner-border-sm" role="status">
                                    <span class="visually-hidden">Загрузка…</span>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </article>
</section>

<section class="plugin-panel" id="plugin-tab-order" role="tabpanel">
    <article class="admin-card card">
        <h3>Порядок выполнения плагинов</h3>
        <p class="muted">Перетащите за ручку слева или используйте кнопки вверх/вниз, затем сохраните.</p>
        <div id="executionOrderContainer">
            <div class="text-center py-3">
                <div class="spinner-border text-primary" role="status">
                    <span class="visually-hidden">Загрузка…</span>
                </div>
            </div>
        </div>
        <div class="form-actions">
            <button type="button" class="btn primary" onclick="saveExecutionOrder()">
                <i class="bi bi-save" aria-hidden="true"></i> Сохранить порядок
            </button>
        </div>
    </article>
</section>

<section class="plugin-panel" id="plugin-tab-metrics" role="tabpanel">
    <article class="admin-card card">
        <div class="toolbar">
            <h3 class="mb-0">Метрики производительности плагинов</h3>
            <div class="toolbar-controls">
                <button type="button" class="btn primary btn-sm" onclick="refreshMetrics()">
                    <i class="bi bi-arrow-clockwise" aria-hidden="true"></i> Обновить
                </button>
            </div>
        </div>
        <div id="metricsContainer">
            <div class="text-center py-3">
                <div class="spinner-border text-primary" role="status">
                    <span class="visually-hidden">Загрузка…</span>
                </div>
            </div>
        </div>
    </article>
</section>

<!-- Модальные окна success / error / confirm -->
<div class="modal fade" id="pluginModalSuccess" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-check-circle text-success"></i> Успешно</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="pluginModalSuccessMessage"></div>
            <div class="modal-footer">
                <button type="button" class="btn primary" data-bs-dismiss="modal">OK</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="pluginModalError" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-exclamation-triangle text-danger"></i> Ошибка</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="pluginModalErrorMessage"></div>
            <div class="modal-footer">
                <button type="button" class="btn secondary" data-bs-dismiss="modal">OK</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="pluginModalConfirm" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-question-circle"></i> Подтверждение</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="pluginModalConfirmMessage"></div>
            <div class="modal-footer">
                <button type="button" class="btn secondary" data-bs-dismiss="modal">Отмена</button>
                <button type="button" class="btn primary" id="pluginModalConfirmOk">Подтвердить</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="configModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Конфигурация плагина: <span id="configPluginName"></span></h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="d-flex justify-content-end mb-2 gap-2" id="configEditorToolbar">
                    <div class="btn-group btn-group-sm" role="group">
                        <button type="button" class="btn secondary active" id="configModeFormBtn" onclick="setConfigEditMode('form')">Форма</button>
                        <button type="button" class="btn secondary" id="configModeJsonBtn" onclick="setConfigEditMode('json')">JSON</button>
                    </div>
                </div>
                <div id="configParseError" class="alert alert-danger d-none"></div>
                <div id="configEditor" style="min-height: 300px;"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn secondary" data-bs-dismiss="modal">Отмена</button>
                <button type="button" class="btn primary" onclick="savePluginConfig()">Сохранить</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="infoModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Информация о плагине: <span id="infoPluginName"></span></h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="pluginInfoContainer">
                <div class="text-center">
                    <div class="spinner-border text-primary" role="status"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="logsModal" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Логи плагина: <span id="logsPluginName"></span></h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="toolbar mb-3">
                    <div class="toolbar-controls">
                        <select class="form-select form-select-sm" id="logLevelFilter" onchange="refreshPluginLogs()">
                            <option value="">Все уровни</option>
                            <option value="info">Info</option>
                            <option value="warning">Warning</option>
                            <option value="error">Error</option>
                            <option value="debug">Debug</option>
                        </select>
                        <button type="button" class="btn primary btn-sm" onclick="refreshPluginLogs()">
                            <i class="bi bi-arrow-clockwise" aria-hidden="true"></i> Обновить
                        </button>
                    </div>
                </div>
                <div id="pluginLogsContainer" style="max-height: 500px; overflow-y: auto;">
                    <div class="text-center">
                        <div class="spinner-border text-primary" role="status">
                            <span class="visually-hidden">Загрузка…</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block admin_scripts %}
<script src="{{ url_for('static', filename='js/sortable.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/admin-config-editor.js') }}"></script>
<script src="{{ url_for('static', filename='js/plugins.js') }}"></script>
{% endblock %}