{{define "setup_scan"}}
<!DOCTYPE html>
<html lang="hu">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Meghajtók keresése — Felhom</title>
    <link rel="stylesheet" href="/static/style.css">
</head>
<body class="login-body">
    <div class="setup-container">
        <div class="setup-header">
            <img src="/static/felhom-logo.svg" alt="Felhom.eu" style="width: 120px;">
            <h1>Visszaállítás mentésből</h1>
        </div>

        <div class="setup-card" id="scan-status">
            <h3>Külső meghajtók keresése...</h3>
            <p style="color: var(--text-secondary, #8b949e);">Ha vannak külső meghajtók csatlakoztatva a szerverhez, győződjön meg róla, hogy most csatlakoztatva vannak.</p>
            <div style="margin-top: 1rem; text-align: center;">
                <div class="spinner"></div>
            </div>
        </div>

        <div id="results" style="display: none;">
            <div class="setup-card">
                <h3>Találatok</h3>
                <table id="results-table">
                    <thead>
                        <tr>
                            <th></th>
                            <th>Meghajtó</th>
                            <th>Ügyfél</th>
                            <th>Dátum</th>
                            <th>Verzió</th>
                            <th>Alkalmazások</th>
                            <th>Lemezek</th>
                            <th>Állapot</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
            <div style="display: flex; gap: 0.75rem; justify-content: center; margin-top: 1rem;">
                <form method="POST" action="/setup/restore" id="restore-form">
                    <input type="hidden" name="_csrf" value="{{.CSRF}}">
                    <input type="hidden" name="source" value="local">
                    <input type="hidden" name="drive_path" id="selected-drive" value="">
                    <input type="hidden" name="history_file" id="selected-history" value="">
                    <button type="submit" class="btn btn-primary" id="restore-btn" disabled>Visszaállítás</button>
                </form>
                <a href="/setup/hub-restore" class="btn btn-outline">Tovább a Hub-hoz</a>
            </div>
        </div>

        <div id="no-results" style="display: none;">
            <div class="setup-card">
                <h3>Nem található helyi mentés.</h3>
                <p style="color: var(--text-secondary, #8b949e);">A csatlakoztatott meghajtókon nem található Felhom infra mentés.</p>
            </div>
            <div style="display: flex; gap: 0.75rem; justify-content: center; margin-top: 1rem;">
                <a href="/setup/hub-restore" class="btn btn-primary">Tovább a Hub-hoz</a>
                <a href="/setup" class="btn btn-outline">Vissza</a>
            </div>
        </div>

        <div id="scan-error" style="display: none;">
            <div class="alert alert-error" id="scan-error-msg"></div>
            <a href="/setup" class="btn btn-outline">Vissza</a>
        </div>
    </div>

    <script>
    (function() {
        function poll() {
            fetch('/setup/scan/status')
                .then(function(r) { return r.json(); })
                .then(function(data) {
                    if (data.error) {
                        document.getElementById('scan-status').style.display = 'none';
                        document.getElementById('scan-error').style.display = 'block';
                        document.getElementById('scan-error-msg').textContent = data.error;
                        return;
                    }
                    if (!data.done) {
                        setTimeout(poll, 1000);
                        return;
                    }
                    document.getElementById('scan-status').style.display = 'none';
                    if (!data.results || data.results.length === 0) {
                        document.getElementById('no-results').style.display = 'block';
                        return;
                    }
                    document.getElementById('results').style.display = 'block';
                    var tbody = document.querySelector('#results-table tbody');
                    tbody.innerHTML = '';
                    var validCount = 0;
                    data.results.forEach(function(r, i) {
                        var tr = document.createElement('tr');
                        var driveVal = r.mount_point + '|' + (r.history_file || '');
                        var radio = r.integrity_ok ? '<input type="radio" name="backup" value="' + driveVal + '" onclick="selectDrive(this)">' : '';
                        var apps = '-';
                        if (r.stack_count > 0) {
                            apps = r.stack_count.toString();
                            if (r.stack_names && r.stack_names.length > 0) {
                                var names = r.stack_names.slice(0, 3).join(', ');
                                if (r.stack_names.length > 3) names += ', ...';
                                apps += ': ' + names;
                            }
                        }
                        var disks = r.disk_count > 0 ? r.disk_count.toString() : '-';
                        var dateBadge = '';
                        if (r.is_history) dateBadge = ' <span class="badge" style="font-size:0.7em;background:#6e4000;color:#ffd080;">korábbi</span>';
                        var statusCol = r.integrity_ok
                            ? '<span class="badge badge-ok">OK</span>'
                            : '<span class="badge badge-error">' + (r.error || 'Hiba') + '</span>';
                        tr.innerHTML = '<td>' + radio + '</td>' +
                            '<td>' + (r.device || '') + (r.label ? ' (' + r.label + ')' : '') + '</td>' +
                            '<td>' + (r.customer_id || '-') + '</td>' +
                            '<td>' + (r.timestamp ? r.timestamp.substring(0, 10) : '-') + dateBadge + '</td>' +
                            '<td>' + (r.controller_version || '-') + '</td>' +
                            '<td>' + apps + '</td>' +
                            '<td>' + disks + '</td>' +
                            '<td>' + statusCol + '</td>';
                        tbody.appendChild(tr);
                        if (r.integrity_ok) validCount++;
                    });
                    if (validCount === 1) {
                        var radio = tbody.querySelector('input[type="radio"]');
                        if (radio) { radio.checked = true; selectDrive(radio); }
                    }
                });
        }
        window.selectDrive = function(el) {
            var parts = el.value.split('|');
            document.getElementById('selected-drive').value = parts[0];
            document.getElementById('selected-history').value = parts[1] || '';
            document.getElementById('restore-btn').disabled = false;
        };
        poll();
    })();
    </script>
</body>
</html>
{{end}}
