{% extends "base.html" %}

{% block title %}Настройки GRC — DataAudit Platform{% endblock %}

{% block content %}
<link rel="stylesheet" href="{{ url_for('static', path='/css/grc.css') }}">

<div class="page-content">
    <div class="grc-toolbar">
        <a href="/workflows" class="btn-back">
            <i data-lucide="arrow-left"></i> GRC Процессы
        </a>
    </div>

    <div class="page-description">
        <p>Управление конфигурацией рабочих процессов, справочниками и правилами эскалации.</p>
    </div>

    <!-- Tabs -->
    <div class="settings-tabs">
        <button class="settings-tab active" onclick="switchTab('workflows')" id="tab-workflows">
            <i data-lucide="git-branch"></i> Рабочие процессы
        </button>
        <button class="settings-tab" onclick="switchTab('enums')" id="tab-enums">
            <i data-lucide="list"></i> Справочники
        </button>
        <button class="settings-tab" onclick="switchTab('escalation')" id="tab-escalation">
            <i data-lucide="bell-ring"></i> Эскалация
        </button>
    </div>

    <!-- ═══ Tab 1: Workflows ═══ -->
    <div class="settings-panel" id="panel-workflows">
        <div class="grc-filters">
            <div class="filter-group">
                <label>Тип сущности</label>
                <select id="wf-entity-select" class="form-input" onchange="loadWorkflow()" style="width:220px;">
                    <option value="plan">План аудита</option>
                    <option value="engagement">Проверка</option>
                    <option value="finding">Замечание</option>
                    <option value="remediation">Рекомендация</option>
                </select>
            </div>
        </div>

        <div class="grc-section">
            <div class="section-header">
                <h3>Цепочка статусов и переходов</h3>
                <span class="detail-meta" id="wf-version-info"></span>
            </div>
            <div class="grc-table-wrap">
                <table class="grc-table" id="wf-transitions-table">
                    <thead>
                        <tr>
                            <th>Из статуса</th>
                            <th>→</th>
                            <th>В статус(ы)</th>
                            <th style="width:80px;">Действие</th>
                        </tr>
                    </thead>
                    <tbody id="wf-transitions-tbody">
                        <tr><td colspan="4" class="loading-cell">Загрузка...</td></tr>
                    </tbody>
                </table>
            </div>
            <div style="margin-top:1rem; display:flex; gap:0.5rem;">
                <button class="btn btn-outline btn-sm" onclick="openAddTransitionModal()">
                    <i data-lucide="plus" style="width:14px;height:14px;"></i> Добавить переход
                </button>
                <button class="btn btn-primary btn-sm" onclick="saveWorkflow()" id="btn-save-wf">
                    <i data-lucide="save" style="width:14px;height:14px;"></i> Сохранить
                </button>
            </div>
        </div>
    </div>

    <!-- ═══ Tab 2: Enums / References ═══ -->
    <div class="settings-panel" id="panel-enums" style="display:none;">
        <div class="grc-filters">
            <div class="filter-group">
                <label>Категория</label>
                <select id="enum-category-select" class="form-input" onchange="loadEnumCategory()" style="width:260px;">
                    <option value="status_label">Метки статусов</option>
                    <option value="severity">Уровни критичности</option>
                    <option value="risk_level">Уровни риска</option>
                    <option value="engagement_type">Типы проверок</option>
                    <option value="notif_type">Типы уведомлений</option>
                </select>
            </div>
        </div>

        <div class="grc-section">
            <div class="section-header">
                <h3 id="enum-category-title">Значения справочника</h3>
            </div>
            <div class="grc-table-wrap">
                <table class="grc-table">
                    <thead>
                        <tr>
                            <th>Ключ</th>
                            <th>Название (RU)</th>
                            <th>Порядок</th>
                            <th>CSS / Метаданные</th>
                            <th>Статус</th>
                            <th style="width:120px;">Действия</th>
                        </tr>
                    </thead>
                    <tbody id="enum-tbody">
                        <tr><td colspan="6" class="loading-cell">Загрузка...</td></tr>
                    </tbody>
                </table>
            </div>
            <div style="margin-top:1rem;">
                <button class="btn btn-outline btn-sm" onclick="openAddEnumModal()">
                    <i data-lucide="plus" style="width:14px;height:14px;"></i> Добавить значение
                </button>
            </div>
        </div>
    </div>

    <!-- ═══ Tab 3: Escalation ═══ -->
    <div class="settings-panel" id="panel-escalation" style="display:none;">
        <div class="grc-section">
            <div class="section-header">
                <h3>Пороги эскалации</h3>
            </div>
            <p class="detail-desc" style="margin-top:0; margin-bottom:1rem;">
                Настройка уведомлений по приближению и просрочке дедлайнов рекомендаций.
            </p>
            <div class="grc-table-wrap">
                <table class="grc-table">
                    <thead>
                        <tr>
                            <th>Дни</th>
                            <th>Направление</th>
                            <th>Кому уведомлять</th>
                            <th>Тип уведомления</th>
                            <th>Повтор</th>
                            <th style="width:80px;">Действие</th>
                        </tr>
                    </thead>
                    <tbody id="esc-tbody">
                        <tr><td colspan="6" class="loading-cell">Загрузка...</td></tr>
                    </tbody>
                </table>
            </div>
            <div style="margin-top:1rem; display:flex; gap:0.5rem;">
                <button class="btn btn-outline btn-sm" onclick="openAddThresholdModal()">
                    <i data-lucide="plus" style="width:14px;height:14px;"></i> Добавить порог
                </button>
                <button class="btn btn-primary btn-sm" onclick="saveEscalation()">
                    <i data-lucide="save" style="width:14px;height:14px;"></i> Сохранить
                </button>
            </div>
        </div>
    </div>
</div>

<!-- ═══ Modals ═══ -->

<!-- Add Transition Modal -->
<div class="modal-overlay" id="modal-add-transition" style="display:none;">
    <div class="modal">
        <div class="modal-header">
            <h3>Добавить переход</h3>
            <button class="modal-close" onclick="closeModal('modal-add-transition')">&times;</button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label>Из статуса</label>
                <input type="text" id="tr-from" class="form-input" placeholder="например: draft">
            </div>
            <div class="form-group">
                <label>В статус</label>
                <input type="text" id="tr-to" class="form-input" placeholder="например: under_review">
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" onclick="closeModal('modal-add-transition')">Отмена</button>
            <button class="btn btn-primary" onclick="addTransition()">Добавить</button>
        </div>
    </div>
</div>

<!-- Add Enum Modal -->
<div class="modal-overlay" id="modal-add-enum" style="display:none;">
    <div class="modal">
        <div class="modal-header">
            <h3>Добавить значение</h3>
            <button class="modal-close" onclick="closeModal('modal-add-enum')">&times;</button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label>Ключ (латиница)</label>
                <input type="text" id="enum-new-key" class="form-input" placeholder="например: very_high">
            </div>
            <div class="form-group">
                <label>Название (RU)</label>
                <input type="text" id="enum-new-label" class="form-input" placeholder="например: Очень высокий">
            </div>
            <div class="form-group">
                <label>Порядок сортировки</label>
                <input type="number" id="enum-new-sort" class="form-input" value="50">
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" onclick="closeModal('modal-add-enum')">Отмена</button>
            <button class="btn btn-primary" onclick="addEnumValue()">Добавить</button>
        </div>
    </div>
</div>

<!-- Add Escalation Threshold Modal -->
<div class="modal-overlay" id="modal-add-threshold" style="display:none;">
    <div class="modal">
        <div class="modal-header">
            <h3>Добавить порог эскалации</h3>
            <button class="modal-close" onclick="closeModal('modal-add-threshold')">&times;</button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label>Количество дней</label>
                <input type="number" id="thr-days" class="form-input" value="3" min="0">
            </div>
            <div class="form-group">
                <label>Направление</label>
                <select id="thr-direction" class="form-input">
                    <option value="before">До дедлайна</option>
                    <option value="after">После дедлайна</option>
                </select>
            </div>
            <div class="form-group">
                <label>Тип уведомления</label>
                <input type="text" id="thr-type" class="form-input" placeholder="например: deadline_3d">
            </div>
            <div class="form-group">
                <label>Повтор ежедневно</label>
                <select id="thr-repeat" class="form-input">
                    <option value="">Нет</option>
                    <option value="daily">Ежедневно</option>
                </select>
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" onclick="closeModal('modal-add-threshold')">Отмена</button>
            <button class="btn btn-primary" onclick="addThreshold()">Добавить</button>
        </div>
    </div>
</div>

<!-- Edit Enum Modal -->
<div class="modal-overlay" id="modal-edit-enum" style="display:none;">
    <div class="modal">
        <div class="modal-header">
            <h3>Редактировать значение</h3>
            <button class="modal-close" onclick="closeModal('modal-edit-enum')">&times;</button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label>Ключ</label>
                <input type="text" id="enum-edit-key" class="form-input" disabled>
            </div>
            <div class="form-group">
                <label>Название (RU)</label>
                <input type="text" id="enum-edit-label" class="form-input">
            </div>
            <div class="form-group">
                <label>Порядок сортировки</label>
                <input type="number" id="enum-edit-sort" class="form-input">
            </div>
            <div class="form-group">
                <label>Метаданные (JSON)</label>
                <textarea id="enum-edit-metadata" rows="3" class="form-input" placeholder='{"css_class": "badge-info"}'></textarea>
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" onclick="closeModal('modal-edit-enum')">Отмена</button>
            <button class="btn btn-primary" onclick="saveEnumEdit()">Сохранить</button>
        </div>
    </div>
</div>

<style>
.settings-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--color-border);
    margin-bottom: 1.5rem;
}
.settings-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.75rem 1.25rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}
.settings-tab svg { width: 16px; height: 16px; }
.settings-tab:hover { color: var(--color-text); }
.settings-tab.active {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}
.settings-panel { }
.wf-arrow-cell { text-align: center; color: #94a3b8; font-size: 1.25rem; }
.wf-target-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.wf-target-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; background: #f1f5f9; border-radius: 999px;
    font-size: 0.8125rem; color: #475569;
}
.wf-target-badge .wf-remove-target {
    background: none; border: none; color: #94a3b8; cursor: pointer;
    font-size: 1rem; line-height: 1; padding: 0 2px;
}
.wf-target-badge .wf-remove-target:hover { color: #dc2626; }
.btn-icon-danger {
    background: none; border: none; color: #94a3b8; cursor: pointer;
    padding: 4px;
}
.btn-icon-danger:hover { color: #dc2626; }
.btn-icon-edit {
    background: none; border: none; color: #94a3b8; cursor: pointer;
    padding: 4px;
}
.btn-icon-edit:hover { color: var(--color-primary); }
.enum-inactive { opacity: 0.5; text-decoration: line-through; }
.toast {
    position: fixed; bottom: 2rem; right: 2rem; padding: 0.75rem 1.25rem;
    border-radius: 8px; font-size: 0.875rem; z-index: 100001;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); transition: opacity 0.3s;
}
.toast-success { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; }
.toast-error { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }
</style>

<script src="{{ url_for('static', path='/js/grc.js') }}"></script>
<script>
/* ═══ State ═══ */
let currentWorkflow = {};  // {from_status: [to_statuses]}
let currentWorkflowVersion = 0;
let currentEscalation = { thresholds: [] };
let allLabels = {};  // loaded from API

/* ═══ Tabs ═══ */
function switchTab(tab) {
    document.querySelectorAll('.settings-tab').forEach(t => t.classList.remove('active'));
    document.querySelectorAll('.settings-panel').forEach(p => p.style.display = 'none');
    document.getElementById('tab-' + tab).classList.add('active');
    document.getElementById('panel-' + tab).style.display = '';

    if (tab === 'workflows') loadWorkflow();
    if (tab === 'enums') loadEnumCategory();
    if (tab === 'escalation') loadEscalation();
}

/* ═══ Toast Notifications ═══ */
async function showToast(message, type) {
    const toast = document.createElement('div');
    toast.className = 'toast toast-' + (type || 'success');
    toast.textContent = message;
    document.body.appendChild(toast);
    setTimeout(() => { toast.style.opacity = '0'; setTimeout(() => toast.remove(), 300); }, 2500);
}

/* ═══ Init ═══ */
document.addEventListener('DOMContentLoaded', async function() {
    // Load labels for display
    try {
        const resp = await fetch('/api/grc/reference/statuses');
        const data = await resp.json();
        allLabels = data.labels || {};
    } catch(e) {}

    await loadWorkflow();
    lucide.createIcons(); 
});

function statusLabel(key) {
    return allLabels[key] || GRC_LABELS[key] || key;
}

/* ══════════════════════════════════════════════════════
   TAB 1: WORKFLOWS
   ══════════════════════════════════════════════════════ */

async function loadWorkflow() {
    const entity = document.getElementById('wf-entity-select').value;
    try {
        const resp = await fetch(`/api/grc/admin/configs/transitions/${entity}`);
        if (!resp.ok) throw new Error('Ошибка загрузки');
        const data = await resp.json();
        currentWorkflow = data.config || {};
        currentWorkflowVersion = data.version || 0;
        document.getElementById('wf-version-info').textContent =
            `Версия: ${currentWorkflowVersion} | ${data.updated_by || ''}`;
        renderWorkflowTable();
    } catch(e) {
        document.getElementById('wf-transitions-tbody').innerHTML =
            '<tr><td colspan="4" class="loading-cell">Ошибка загрузки</td></tr>';
    }
}

function renderWorkflowTable() {
    const tbody = document.getElementById('wf-transitions-tbody');
    const entries = Object.entries(currentWorkflow);

    if (!entries.length) {
        tbody.innerHTML = '<tr><td colspan="4" class="loading-cell">Нет переходов</td></tr>';
        return;
    }

    tbody.innerHTML = entries.map(([from, raw]) => {
        const targets = Array.isArray(raw) ? raw : (raw.allowed || []);
        const targetBadges = targets.map(t =>
            `<span class="wf-target-badge">
                <span class="status-badge status-${t}" style="margin:0;">${statusLabel(t)}</span>
                <button class="wf-remove-target" onclick="removeTransitionTarget('${from}','${t}')" title="Удалить переход">&times;</button>
            </span>`
        ).join('');

        return `<tr>
            <td><span class="status-badge status-${from}">${statusLabel(from)}</span></td>
            <td class="wf-arrow-cell">→</td>
            <td><div class="wf-target-badges">${targetBadges}</div></td>
            <td>
                <button class="btn-icon-danger" onclick="removeTransitionRow('${from}')" title="Удалить строку">
                    <i data-lucide="trash-2" style="width:16px;height:16px;"></i>
                </button>
            </td>
        </tr>`;
    }).join('');

    lucide.createIcons();
}

function removeTransitionTarget(from, target) {
    if (!currentWorkflow[from]) return;
    currentWorkflow[from] = currentWorkflow[from].filter(t => t !== target);
    if (currentWorkflow[from].length === 0) delete currentWorkflow[from];
    renderWorkflowTable();
}

function removeTransitionRow(from) {
    delete currentWorkflow[from];
    renderWorkflowTable();
}

function openAddTransitionModal() {
    document.getElementById('tr-from').value = '';
    document.getElementById('tr-to').value = '';
    openModal('modal-add-transition');
}

function addTransition() {
    const from = document.getElementById('tr-from').value.trim().toLowerCase();
    const to = document.getElementById('tr-to').value.trim().toLowerCase();
    if (!from || !to) { alert('Укажите оба статуса'); return; }

    if (!currentWorkflow[from]) currentWorkflow[from] = [];
    if (!currentWorkflow[from].includes(to)) {
        currentWorkflow[from].push(to);
    }
    closeModal('modal-add-transition');
    renderWorkflowTable();
}

async function saveWorkflow() {
    const entity = document.getElementById('wf-entity-select').value;
    try {
        const resp = await fetch(`/api/grc/admin/configs/transitions/${entity}`, {
            method: 'PUT',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({ config: currentWorkflow }),
        });
        const result = await resp.json();
        if (resp.ok) {
            currentWorkflowVersion = result.version || currentWorkflowVersion + 1;
            document.getElementById('wf-version-info').textContent = `Версия: ${currentWorkflowVersion}`;
            showToast('Конфигурация сохранена');
        } else {
            showToast(result.detail || 'Ошибка сохранения', 'error');
        }
    } catch(e) {
        showToast('Ошибка сети', 'error');
    }
}


/* ══════════════════════════════════════════════════════
   TAB 2: ENUMS
   ══════════════════════════════════════════════════════ */

const ENUM_CATEGORY_NAMES = {
    status_label: 'Метки статусов',
    severity: 'Уровни критичности',
    risk_level: 'Уровни риска',
    engagement_type: 'Типы проверок',
    notif_type: 'Типы уведомлений',
};

async function loadEnumCategory() {
    const category = document.getElementById('enum-category-select').value;
    document.getElementById('enum-category-title').textContent =
        ENUM_CATEGORY_NAMES[category] || category;

    try {
        const resp = await fetch(`/api/grc/admin/enums/${category}`);
        const items = await resp.json();
        renderEnumTable(items, category);
    } catch(e) {
        document.getElementById('enum-tbody').innerHTML =
            '<tr><td colspan="6" class="loading-cell">Ошибка загрузки</td></tr>';
    }
}

function renderEnumTable(items, category) {
    const tbody = document.getElementById('enum-tbody');
    if (!items.length) {
        tbody.innerHTML = '<tr><td colspan="6" class="loading-cell">Пусто</td></tr>';
        return;
    }

    tbody.innerHTML = items.map(item => {
        const meta = typeof item.metadata === 'string' ? item.metadata : JSON.stringify(item.metadata || {});
        const inactive = !item.is_active;
        return `<tr class="${inactive ? 'enum-inactive' : ''}">
            <td><code>${escHtml(item.key)}</code></td>
            <td>${escHtml(item.label)}</td>
            <td>${item.sort_order}</td>
            <td><code style="font-size:0.75rem;">${escHtml(meta)}</code></td>
            <td>${inactive
                ? '<span class="badge badge-default">Удалён</span>'
                : '<span class="badge badge-info">Активен</span>'}</td>
            <td>
                ${inactive ? `
                    <button class="btn btn-outline btn-sm" onclick="restoreEnum('${category}','${item.key}')">
                        Восстановить
                    </button>
                ` : `
                    <button class="btn-icon-edit" onclick="openEditEnumModal('${category}','${escHtml(item.key)}','${escHtml(item.label)}',${item.sort_order},'${escHtml(meta)}')" title="Редактировать">
                        <i data-lucide="edit" style="width:16px;height:16px;"></i>
                    </button>
                    <button class="btn-icon-danger" onclick="deleteEnum('${category}','${item.key}')" title="Удалить">
                        <i data-lucide="trash-2" style="width:16px;height:16px;"></i>
                    </button>
                `}
            </td>
        </tr>`;
    }).join('');

    lucide.createIcons();
}

function openAddEnumModal() {
    document.getElementById('enum-new-key').value = '';
    document.getElementById('enum-new-label').value = '';
    document.getElementById('enum-new-sort').value = '50';
    openModal('modal-add-enum');
}

async function addEnumValue() {
    const category = document.getElementById('enum-category-select').value;
    const key = document.getElementById('enum-new-key').value.trim();
    const label = document.getElementById('enum-new-label').value.trim();
    const sort_order = parseInt(document.getElementById('enum-new-sort').value) || 0;

    if (!key || !label) { alert('Укажите ключ и название'); return; }

    try {
        const resp = await fetch(`/api/grc/admin/enums/${category}`, {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({ key, label, sort_order, metadata: {} }),
        });
        const result = await resp.json();
        if (resp.ok) {
            closeModal('modal-add-enum');
            showToast('Значение добавлено');
            loadEnumCategory();
        } else {
            showToast(result.detail || 'Ошибка', 'error');
        }
    } catch(e) {
        showToast('Ошибка сети', 'error');
    }
}

function openEditEnumModal(category, key, label, sortOrder, metaStr) {
    document.getElementById('enum-edit-key').value = key;
    document.getElementById('enum-edit-label').value = label;
    document.getElementById('enum-edit-sort').value = sortOrder;
    document.getElementById('enum-edit-metadata').value = metaStr;
    document.getElementById('enum-edit-key').dataset.category = category;
    openModal('modal-edit-enum');
}

async function saveEnumEdit() {
    const category = document.getElementById('enum-edit-key').dataset.category;
    const key = document.getElementById('enum-edit-key').value;
    const label = document.getElementById('enum-edit-label').value.trim();
    const sort_order = parseInt(document.getElementById('enum-edit-sort').value) || 0;
    let metadata = {};
    try {
        metadata = JSON.parse(document.getElementById('enum-edit-metadata').value || '{}');
    } catch(e) {
        alert('Некорректный JSON в метаданных');
        return;
    }

    try {
        const resp = await fetch(`/api/grc/admin/enums/${category}/${key}`, {
            method: 'PUT',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({ label, sort_order, metadata }),
        });
        if (resp.ok) {
            closeModal('modal-edit-enum');
            showToast('Значение обновлено');
            loadEnumCategory();
        } else {
            const result = await resp.json();
            showToast(result.detail || 'Ошибка', 'error');
        }
    } catch(e) {
        showToast('Ошибка сети', 'error');
    }
}

async function deleteEnum(category, key) {
    if (!confirm(`Удалить «${key}»? Значение можно будет восстановить.`)) return;
    try {
        const resp = await fetch(`/api/grc/admin/enums/${category}/${key}`, { method: 'DELETE' });
        if (resp.ok) {
            showToast('Значение удалено');
            loadEnumCategory();
        }
    } catch(e) {
        showToast('Ошибка', 'error');
    }
}

async function restoreEnum(category, key) {
    try {
        const resp = await fetch(`/api/grc/admin/enums/${category}/${key}/restore`, { method: 'PUT' });
        if (resp.ok) {
            showToast('Значение восстановлено');
            loadEnumCategory();
        }
    } catch(e) {
        showToast('Ошибка', 'error');
    }
}


/* ══════════════════════════════════════════════════════
   TAB 3: ESCALATION
   ══════════════════════════════════════════════════════ */

async function loadEscalation() {
    try {
        const resp = await fetch('/api/grc/admin/configs/escalation/deadlines');
        if (!resp.ok) throw new Error('Ошибка загрузки');
        const data = await resp.json();
        const cfg = data.config || {};
        currentEscalation = { thresholds: cfg.thresholds || cfg.escalation_levels || [] };
        renderEscalationTable();
    } catch(e) {
        document.getElementById('esc-tbody').innerHTML =
            '<tr><td colspan="6" class="loading-cell">Ошибка загрузки</td></tr>';
    }
}

function renderEscalationTable() {
    const tbody = document.getElementById('esc-tbody');
    const thresholds = currentEscalation.thresholds || [];

    if (!thresholds.length) {
        tbody.innerHTML = '<tr><td colspan="6" class="loading-cell">Нет порогов</td></tr>';
        return;
    }

    tbody.innerHTML = thresholds.map((t, idx) => {
        const isBefore = 'days_before' in t;
        const days = isBefore ? t.days_before : t.days_after;
        const direction = isBefore ? 'До дедлайна' : 'После дедлайна';
        const dirBadge = isBefore
            ? '<span class="badge badge-warning">' + direction + '</span>'
            : '<span class="badge badge-danger">' + direction + '</span>';
        const notify = (t.notify || []).join(', ');
        const repeat = t.repeat ? `<span class="badge badge-info">${t.repeat}</span>` : '—';

        return `<tr>
            <td><strong>${days}</strong></td>
            <td>${dirBadge}</td>
            <td>${escHtml(notify)}</td>
            <td><code>${escHtml(t.type || '')}</code></td>
            <td>${repeat}</td>
            <td>
                <button class="btn-icon-danger" onclick="removeThreshold(${idx})" title="Удалить">
                    <i data-lucide="trash-2" style="width:16px;height:16px;"></i>
                </button>
            </td>
        </tr>`;
    }).join('');

    lucide.createIcons();
}

function removeThreshold(idx) {
    currentEscalation.thresholds.splice(idx, 1);
    renderEscalationTable();
}

function openAddThresholdModal() {
    document.getElementById('thr-days').value = '3';
    document.getElementById('thr-direction').value = 'before';
    document.getElementById('thr-type').value = '';
    document.getElementById('thr-repeat').value = '';
    openModal('modal-add-threshold');
}

function addThreshold() {
    const days = parseInt(document.getElementById('thr-days').value) || 0;
    const direction = document.getElementById('thr-direction').value;
    const type = document.getElementById('thr-type').value.trim();
    const repeat = document.getElementById('thr-repeat').value;

    if (!type) { alert('Укажите тип уведомления'); return; }

    const threshold = {
        notify: ['assignee', 'unit_head'],
        type: type,
    };
    if (direction === 'before') {
        threshold.days_before = days;
    } else {
        threshold.days_after = days;
    }
    if (repeat) threshold.repeat = repeat;

    currentEscalation.thresholds.push(threshold);
    closeModal('modal-add-threshold');
    renderEscalationTable();
}

async function saveEscalation() {
    try {
        const resp = await fetch('/api/grc/admin/configs/escalation/deadlines', {
            method: 'PUT',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({ config: { ...currentEscalation, escalation_levels: currentEscalation.thresholds } }),
        });
        if (resp.ok) {
            showToast('Эскалация сохранена');
        } else {
            const result = await resp.json();
            showToast(result.detail || 'Ошибка', 'error');
        }
    } catch(e) {
        showToast('Ошибка сети', 'error');
    }
}
</script>
{% endblock %}