{% 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-gear-fill" aria-hidden="true"></i> Настройки и интеграции</h1>
        <p class="admin-toolbar__meta muted">Системные параметры, интеграции, уведомления и резервные копии</p>
    </div>
</div>
            
            <!-- Вкладки -->
            <ul class="nav nav-tabs mb-3" id="settingsTabs" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" onclick="switchSettingsTab('system-settings', this)" type="button">
                        <i class="bi bi-sliders"></i> Настройки системы
                    </button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" onclick="switchSettingsTab('integrations', this)" type="button">
                        <i class="bi bi-plug"></i> Интеграции
                    </button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" onclick="switchSettingsTab('notifications', this)" type="button">
                        <i class="bi bi-bell"></i> Уведомления
                    </button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" onclick="switchSettingsTab('backups', this)" type="button">
                        <i class="bi bi-archive"></i> Резервное копирование
                    </button>
                </li>
            </ul>
            
            <!-- Вкладка Настройки системы -->
            <div id="system-settings-tab" class="tab-content">
                <div class="card mb-4">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="bi bi-sliders"></i> Настройки системы</h5>
                        <button class="btn primary btn-sm" onclick="showAddSettingModal()">
                            <i class="bi bi-plus-circle"></i> Добавить настройку
                        </button>
                    </div>
                    <div class="card-body">
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <label class="form-label">Категория</label>
                                <select class="form-select" id="settingsCategoryFilter" onchange="loadSystemSettings()">
                                    <option value="">Все категории</option>
                                    <option value="general">Общие</option>
                                    <option value="security">Безопасность</option>
                                    <option value="performance">Производительность</option>
                                    <option value="integration">Интеграции</option>
                                </select>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table class="table table-striped table-hover">
                                <thead>
                                    <tr>
                                        <th>Ключ</th>
                                        <th>Значение</th>
                                        <th>Тип</th>
                                        <th>Категория</th>
                                        <th>Описание</th>
                                        <th>Обновлено</th>
                                        <th>Действия</th>
                                    </tr>
                                </thead>
                                <tbody id="systemSettingsTableBody">
                                    <tr>
                                        <td colspan="7" class="text-center">Загрузка...</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Вкладка Интеграции -->
            <div id="integrations-tab" class="tab-content" style="display: none;">
                <div class="card mb-4">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="bi bi-plug"></i> Интеграции</h5>
                        <button class="btn primary btn-sm" onclick="showAddIntegrationModal()">
                            <i class="bi bi-plus-circle"></i> Добавить интеграцию
                        </button>
                    </div>
                    <div class="card-body">
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <select class="form-select" id="integrationTypeFilter" onchange="loadIntegrations()">
                                    <option value="">Все типы</option>
                                    <option value="prometheus">Prometheus</option>
                                    <option value="grafana">Grafana</option>
                                    <option value="elasticsearch">Elasticsearch</option>
                                    <option value="custom">Пользовательская</option>
                                </select>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table class="table table-striped table-hover">
                                <thead>
                                    <tr>
                                        <th>Название</th>
                                        <th>Тип</th>
                                        <th>Статус</th>
                                        <th>Последняя синхронизация</th>
                                        <th>Статус синхронизации</th>
                                        <th>Действия</th>
                                    </tr>
                                </thead>
                                <tbody id="integrationsTableBody">
                                    <tr>
                                        <td colspan="6" class="text-center">Загрузка...</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Вкладка Уведомления -->
            <div id="notifications-tab" class="tab-content" style="display: none;">
                {% if mail_banner %}
                <div class="alert alert-{{ mail_banner.level }} mb-3" role="alert">
                    <i class="bi bi-envelope-exclamation"></i> {{ mail_banner.text }}
                    {% if mail_readiness != 'unavailable' %}
                    <a href="{{ url_for('admin.settings') }}#mail" class="alert-link ms-2">Настроить почту</a>
                    {% endif %}
                </div>
                {% endif %}
                {% if injection_content.get('admin.settings.notifications') %}
                <div class="mb-3">
                    {% for block in injection_content['admin.settings.notifications'] %}
                    {{ block|safe }}
                    {% endfor %}
                </div>
                {% endif %}
                <div class="row">
                    <div class="col-md-6">
                        <div class="card mb-4">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5 class="mb-0"><i class="bi bi-broadcast"></i> Каналы уведомлений</h5>
                                <button class="btn primary btn-sm" onclick="showAddChannelModal()">
                                    <i class="bi bi-plus-circle"></i> Добавить канал
                                </button>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover table-sm">
                                        <thead>
                                            <tr>
                                                <th>Название</th>
                                                <th>Тип</th>
                                                <th>Статус</th>
                                                <th>Действия</th>
                                            </tr>
                                        </thead>
                                        <tbody id="notificationChannelsTableBody">
                                            <tr>
                                                <td colspan="4" class="text-center">Загрузка...</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card mb-4">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5 class="mb-0"><i class="bi bi-list-check"></i> Правила уведомлений</h5>
                                <button class="btn primary btn-sm" onclick="showAddRuleModal()">
                                    <i class="bi bi-plus-circle"></i> Добавить правило
                                </button>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover table-sm">
                                        <thead>
                                            <tr>
                                                <th>Название</th>
                                                <th>Тип события</th>
                                                <th>Приоритет</th>
                                                <th>Статус</th>
                                                <th>Действия</th>
                                            </tr>
                                        </thead>
                                        <tbody id="notificationRulesTableBody">
                                            <tr>
                                                <td colspan="5" class="text-center">Загрузка...</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- Вкладка Резервное копирование -->
            <div id="backups-tab" class="tab-content" style="display: none;">
                <div class="card mb-4">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0"><i class="bi bi-archive"></i> Резервное копирование</h5>
                        <div>
                            <button class="btn primary btn-sm me-2" onclick="createBackup('database')">
                                <i class="bi bi-database"></i> БД
                            </button>
                            <button class="btn primary btn-sm me-2" onclick="createBackup('config')">
                                <i class="bi bi-file-earmark-code"></i> Конфигурация
                            </button>
                            <button class="btn primary btn-sm" onclick="createBackup('full')">
                                <i class="bi bi-archive"></i> Полная копия
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <select class="form-select" id="backupTypeFilter" onchange="loadBackups()">
                                    <option value="">Все типы</option>
                                    <option value="database">База данных</option>
                                    <option value="config">Конфигурация</option>
                                    <option value="full">Полная копия</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <button class="btn secondary btn-sm" onclick="cleanupOldBackups()">
                                    <i class="bi bi-trash"></i> Очистить старые копии
                                </button>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table class="table table-striped table-hover">
                                <thead>
                                    <tr>
                                        <th>Название</th>
                                        <th>Тип</th>
                                        <th>Размер</th>
                                        <th>Статус</th>
                                        <th>Создано</th>
                                        <th>Описание</th>
                                        <th>Действия</th>
                                    </tr>
                                </thead>
                                <tbody id="backupsTableBody">
                                    <tr>
                                        <td colspan="7" class="text-center">Загрузка...</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

<div class="modal fade" id="channelModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="channelModalTitle">Канал уведомлений</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <input type="hidden" id="channelEditId" value="">
                <div class="mb-3">
                    <label class="form-label">Название</label>
                    <input type="text" class="form-control" id="channelName">
                </div>
                <div class="mb-3">
                    <label class="form-label">Тип канала</label>
                    <select class="form-select" id="channelType" onchange="onChannelTypeChange()">
                        <option value="email">Email</option>
                        <option value="webhook">Webhook</option>
                        <option value="slack">Slack</option>
                        <option value="telegram">Telegram</option>
                    </select>
                </div>
                <div id="channelEmailFields">
                    <div class="mb-3">
                        <label class="form-label">Получатели (to)</label>
                        <input type="text" class="form-control" id="channelEmailTo" placeholder="ops@example.com, admin@example.com">
                        <div class="form-text">Через запятую. SMTP настраивается в разделе «Почта».</div>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Копия (cc)</label>
                        <input type="text" class="form-control" id="channelEmailCc" placeholder="">
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Шаблон</label>
                        <input type="text" class="form-control" id="channelEmailTemplate" value="system.notification">
                    </div>
                </div>
                <div id="channelWebhookFields" style="display:none;">
                    <div class="mb-3">
                        <label class="form-label">URL</label>
                        <input type="url" class="form-control" id="channelWebhookUrl">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn ghost" data-bs-dismiss="modal">Отмена</button>
                <button type="button" class="btn primary" onclick="saveChannel()">Сохранить</button>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block admin_scripts %}
<script src="{{ url_for('static', filename='js/settings_integrations.js') }}"></script>
{% endblock %}