{{define "admin/ipgeo_upgrade.html"}}
{{template "admin_shell_open" .}}
<div class="cs-admin-page">
<link rel="stylesheet" href="{{asset "/template/default/assets/css/admin-site-config.css"}}">
<link rel="stylesheet" href="{{asset "/template/default/assets/css/admin-software-upgrade.css"}}">

<div class="sitecfg-page ota-page">
    <div class="sitecfg-grid">
        <div class="sitecfg-section">
            <div class="section-head">
                <span class="icon-chip"><i class="bx bx-map"></i></span>
                <div>
                    <h2 class="section-title">{{T "admin_ipgeo_upgrade_title"}}</h2>
                    <p class="section-desc">{{T "admin_ipgeo_upgrade_desc"}}</p>
                </div>
                <div class="section-head-actions">
                    <button type="button" class="btn btn-sm btn-primary" id="ipgeoBtnCheck"><i class="bx bx-cloud"></i> {{T "admin_ipgeo_btn_check"}}</button>
                </div>
            </div>
            <div class="section-body">
                <p class="ota-guide-intro mb-3" id="ipgeoHubNote">{{T "admin_ipgeo_upgrade_hub_hint"}}</p>
                <div class="ota-dl-panel d-none mb-3" id="ipgeoDownloadPanel">
                    <div class="d-flex justify-content-between align-items-center mb-2 flex-wrap gap-2">
                        <span class="ota-file-name" id="ipgeoDlFilenameWrap">
                            <i class="bx bx-data ota-file-icon is-xdb" aria-hidden="true"></i>
                            <strong id="ipgeoDlFilename">—</strong>
                        </span>
                        <span class="small text-muted" id="ipgeoDlMeta"></span>
                    </div>
                    <div class="progress mb-2">
                        <div class="progress-bar" id="ipgeoDlBar" role="progressbar" style="width:0%" aria-valuemin="0" aria-valuemax="100"></div>
                    </div>
                    <div class="small" id="ipgeoDlNotice"></div>
                    <div class="ota-dl-done-banner d-none" id="ipgeoDlDoneBanner">
                        <i class="bx bx-check-circle"></i>
                        <span id="ipgeoDlDoneText"></span>
                        <button type="button" class="btn btn-sm btn-outline-success ms-auto" id="ipgeoDlDismissBtn">{{T "admin_ota_dl_dismiss"}}</button>
                    </div>
                </div>
                <div class="table-responsive" style="margin: 0 -1.25rem -1.25rem; border-top: 1px solid var(--sc-border, #e5e7eb);">
                    <table class="table table-hover mb-0 align-middle">
                        <thead>
                            <tr>
                                <th class="ps-3">{{T "admin_ipgeo_col_kind"}}</th>
                                <th>{{T "admin_ipgeo_col_path"}}</th>
                                <th>{{T "admin_ipgeo_col_status"}}</th>
                                <th>{{T "admin_ipgeo_col_hub"}}</th>
                                <th>{{T "admin_ipgeo_col_size"}}</th>
                                <th>{{T "admin_ipgeo_col_mtime"}}</th>
                                <th class="pe-3">{{T "admin_ipgeo_col_action"}}</th>
                            </tr>
                        </thead>
                        <tbody id="ipgeoTableBody">
                            <tr><td colspan="7" class="text-center text-muted py-4">{{T "admin_ota_loading"}}</td></tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<script>
$(function() {
    var POModal = window.POModal || window.layer || window.SupfileModal || window.myModal;
    var i18n = {
        installed: {{json (T "admin_ipgeo_status_installed")}},
        missing: {{json (T "admin_ipgeo_status_missing")}},
        latest: {{json (T "admin_ipgeo_status_latest")}},
        outdated: {{json (T "admin_ipgeo_status_outdated")}},
        hubNone: {{json (T "admin_ipgeo_hub_none")}},
        kindV4: {{json (T "admin_ipgeo_kind_v4")}},
        kindV6: {{json (T "admin_ipgeo_kind_v6")}},
        download: {{json (T "admin_ipgeo_btn_download")}},
        install: {{json (T "admin_ipgeo_btn_install")}},
        downloading: {{json (T "admin_ipgeo_downloading")}},
        done: {{json (T "admin_ipgeo_download_done")}},
        checking: {{json (T "admin_ipgeo_checking")}},
        checkOk: {{json (T "admin_ipgeo_check_ok")}},
        checkHubNone: {{json (T "admin_ipgeo_check_hub_none")}},
        checkNeed: {{json (T "admin_ipgeo_check_need")}},
        checkFail: {{json (T "admin_ipgeo_check_fail")}},
        btnCheck: {{json (T "admin_ipgeo_btn_check")}},
        redownload: {{json (T "admin_ipgeo_btn_redownload")}},
        actionNone: {{json (T "admin_ipgeo_action_none")}}
    };
    var hubState = { v4: null, v6: null };
    var pollTimer = null;
    var checkXhr = null;
    var lastDlState = '';

    function formatBytes(n) {
        n = Number(n) || 0;
        if (n <= 0) return '—';
        if (n < 1024) return n + ' B';
        if (n < 1048576) return (n / 1024).toFixed(1) + ' KB';
        return (n / 1048576).toFixed(1) + ' MB';
    }
    function formatSpeed(bps) {
        bps = Number(bps) || 0;
        if (bps <= 0) return '';
        if (bps < 1024) return bps + ' B/s';
        if (bps < 1048576) return (bps / 1024).toFixed(1) + ' KB/s';
        return (bps / 1048576).toFixed(1) + ' MB/s';
    }
    function tsDisplay(ts) {
        ts = Number(ts) || 0;
        if (!ts) return '—';
        var d = new Date(ts * 1000);
        return d.getFullYear() + '-' + String(d.getMonth()+1).padStart(2,'0') + '-' + String(d.getDate()).padStart(2,'0') + ' ' +
            String(d.getHours()).padStart(2,'0') + ':' + String(d.getMinutes()).padStart(2,'0');
    }
    function toast(msg, ok) {
        if (POModal && POModal.msg) {
            POModal.msg(msg, { icon: ok ? 1 : 2 });
            return;
        }
        if (window.layer && layer.msg) layer.msg(msg, { icon: ok ? 1 : 2, time: 2200 });
        else alert(msg);
    }
    function setCheckBusy(busy) {
        var $btn = $('#ipgeoBtnCheck');
        if (busy) {
            $btn.prop('disabled', true).html('<i class="bx bx-loader-alt bx-spin"></i> ' + i18n.checking);
        } else {
            $btn.prop('disabled', false).html('<i class="bx bx-cloud"></i> ' + i18n.btnCheck);
        }
    }
    function hubCell(kind) {
        var h = hubState[kind];
        if (!h) return '<span class="text-muted">—</span>';
        if (h.error) return '<span class="text-danger small">' + $('<div>').text(h.error).html() + '</span>';
        if (!h.available) return '<span class="text-muted">' + i18n.hubNone + '</span>';
        var hub = h.hub || {};
        var fname = hub.filename || '';
        var nameHtml = fname
            ? '<span class="ota-file-name"><i class="bx bx-data ota-file-icon is-xdb" aria-hidden="true"></i><code>' + $('<div>').text(fname).html() + '</code></span>'
            : '';
        return '<div class="small"><div>' + $('<div>').text(hub.release_date || tsDisplay(hub.published_at)).html() + '</div>' + nameHtml + '</div>';
    }
    function statusCell(kind, info) {
        var h = hubState[kind];
        var exists = !!(info && info.exists);
        if (h && h.status === 'latest') return '<span class="verify-ok">' + i18n.latest + '</span>';
        if (h && h.status === 'outdated') return '<span class="text-warning">' + i18n.outdated + '</span>';
        if (h && h.status === 'missing') return '<span class="text-muted">' + i18n.missing + '</span>';
        return exists
            ? '<span class="verify-ok">' + i18n.installed + '</span>'
            : '<span class="text-muted">' + i18n.missing + '</span>';
    }
    function actionCell(kind, info) {
        var h = hubState[kind];
        if (!h) {
            return '<span class="text-muted small">' + i18n.actionNone + '</span>';
        }
        if (h.error) {
            return '<span class="text-danger small" title="' + $('<div>').text(h.error).html() + '">' + i18n.actionNone + '</span>';
        }
        if (!h.available) {
            return '<span class="text-muted small" title="' + $('<div>').text(i18n.checkHubNone || '').html() + '">' + i18n.actionNone + '</span>';
        }
        var label = i18n.install;
        if (info && info.exists) {
            label = (h.updatable || h.status === 'outdated') ? i18n.download : i18n.redownload;
        }
        return '<button type="button" class="btn btn-sm btn-outline-primary ipgeo-dl" data-kind="' + kind + '">' + label + '</button>';
    }
    function rowHTML(kind, kindLabel, info) {
        var kindIcon = kind === 'v6' ? 'bx-globe' : 'bx-map';
        var path = (info && info.path) || '—';
        return '<tr data-kind="' + kind + '">' +
            '<td class="ps-3"><span class="ota-file-name"><i class="bx ' + kindIcon + ' ota-file-icon is-kind" aria-hidden="true"></i><strong>' + kindLabel + '</strong></span></td>' +
            '<td><span class="ota-file-name"><i class="bx bx-folder ota-file-icon is-path" aria-hidden="true"></i><code>' + $('<div>').text(path).html() + '</code></span></td>' +
            '<td>' + statusCell(kind, info) + '</td>' +
            '<td>' + hubCell(kind) + '</td>' +
            '<td>' + ((info && info.exists) ? formatBytes(info.size_bytes) : '—') + '</td>' +
            '<td>' + ((info && info.exists) ? tsDisplay(info.modified_at) : '—') + '</td>' +
            '<td class="pe-3">' + actionCell(kind, info) + '</td>' +
            '</tr>';
    }
    function renderLocal(data) {
        var $tb = $('#ipgeoTableBody').empty();
        $tb.append(rowHTML('v4', i18n.kindV4, data && data.v4));
        $tb.append(rowHTML('v6', i18n.kindV6, data && data.v6));
        // 仅进行中任务由状态接口刷新面板；done/error 由下载轮询展示，避免「检查更新」再次弹出完成条
        if (data && data.download && data.download.state === 'running') showDl(data.download);
    }
    function showDl(dl) {
        var $panel = $('#ipgeoDownloadPanel');
        if (!$panel.length) return;
        var state = (dl && dl.state) || 'idle';
        var running = state === 'running';
        var done = state === 'done';
        var err = state === 'error';
        var show = running || done || err;
        $panel.toggleClass('d-none', !show);
        $panel.toggleClass('is-done', done);
        $panel.toggleClass('is-error', err);
        if (!show) {
            lastDlState = state;
            return;
        }
        var fname = dl.filename || ((dl.kind || '') ? ('ip2region_' + dl.kind) : '—');
        $('#ipgeoDlFilename').text(fname);
        var pct = Number(dl.percent) || 0;
        if (done) pct = 100;
        $('#ipgeoDlBar').css('width', pct + '%').attr('aria-valuenow', pct);
        var meta = pct + '%';
        if (dl.total > 0) {
            meta += ' · ' + formatBytes(dl.received || 0) + ' / ' + formatBytes(dl.total);
        } else if ((done || running) && dl.received > 0) {
            meta += ' · ' + formatBytes(dl.received);
        }
        var spd = formatSpeed(dl.speed_bps);
        if (spd && running) meta += ' · ' + spd;
        $('#ipgeoDlMeta').text(meta);
        var notice = '';
        if (running) notice = i18n.downloading + (dl.kind ? (' · ' + dl.kind) : '');
        if (err) notice = dl.error || 'error';
        $('#ipgeoDlNotice').text(notice).toggleClass('text-danger', err).toggleClass('text-muted', !err);
        if (done) {
            $('#ipgeoDlDoneText').text(i18n.done);
            $('#ipgeoDlDoneBanner').removeClass('d-none');
        } else {
            $('#ipgeoDlDoneBanner').addClass('d-none');
        }
        if (done && lastDlState !== 'done') {
            toast(i18n.done, true);
        }
        lastDlState = state;
    }
    function loadStatus() {
        return $.getJSON('/admin/ipgeo-status').done(function(res) {
            if (!res || !res.success || !res.data) {
                $('#ipgeoTableBody').html('<tr><td colspan="7" class="text-center text-danger py-3">' + ((res && res.message) || '—') + '</td></tr>');
                return;
            }
            renderLocal(res.data);
        });
    }
    function checkHub(fromBtn) {
        if (checkXhr && checkXhr.readyState !== 4) {
            try { checkXhr.abort(); } catch (e) {}
        }
        if (fromBtn) setCheckBusy(true);
        checkXhr = $.getJSON('/admin/ipgeo-check').done(function(res) {
            if (!res || !res.success || !res.data) {
                if (fromBtn) toast((res && res.message) || i18n.checkFail, false);
                return;
            }
            hubState.v4 = res.data.v4 || null;
            hubState.v6 = res.data.v6 || null;
            loadStatus();
            if (!fromBtn) return;
            var need = false;
            var hubErr = '';
            var anyAvail = false;
            ['v4', 'v6'].forEach(function(k) {
                var h = hubState[k];
                if (!h) return;
                if (h.available) anyAvail = true;
                if (h.updatable) need = true;
                if (h.error && !hubErr) hubErr = h.error;
            });
            if (hubErr && !anyAvail) {
                toast(hubErr, false);
            } else if (!anyAvail) {
                toast(i18n.checkHubNone, false);
            } else if (need) {
                toast(i18n.checkNeed, true);
            } else {
                toast(i18n.checkOk, true);
            }
        }).fail(function(xhr, status) {
            if (status === 'abort') return;
            if (fromBtn) toast(i18n.checkFail, false);
        }).always(function() {
            if (fromBtn) setCheckBusy(false);
            checkXhr = null;
        });
        return checkXhr;
    }
    function pollDl() {
        $.getJSON('/admin/ipgeo-download-status', function(res) {
            var dl = res && res.data && res.data.download;
            showDl(dl);
            if (dl && dl.state === 'running') {
                pollTimer = setTimeout(pollDl, 800);
            } else if (dl && (dl.state === 'done' || dl.state === 'error')) {
                checkHub();
            }
        });
    }
    $(document).on('click', '.ipgeo-dl', function() {
        var kind = $(this).data('kind');
        $.post('/admin/ipgeo-download', { kind: kind }).done(function(res) {
            toast((res && res.message) || '', !!(res && res.success));
            if (res && res.success) {
                showDl(res.data && res.data.download);
                clearTimeout(pollTimer);
                pollDl();
            }
        });
    });
    $('#ipgeoBtnCheck').on('click', function() { checkHub(true); });
    function dismissDownloadPanel() {
        $.post('/admin/ipgeo-download-dismiss', function(res) {
            var dl = res && res.data && res.data.download;
            if (dl) {
                showDl(dl);
            } else {
                $('#ipgeoDownloadPanel').addClass('d-none').removeClass('is-done is-error');
                lastDlState = 'idle';
            }
        }).fail(function() {
            $('#ipgeoDownloadPanel').addClass('d-none').removeClass('is-done is-error');
            lastDlState = 'idle';
        });
    }
    $('#ipgeoDlDismissBtn').on('click', function() { dismissDownloadPanel(); });
    // 打开页：清掉上次遗留的「已完成」面板；仅进行中任务继续轮询（对齐软件升级）
    $.post('/admin/ipgeo-download-dismiss').always(function() {
        loadStatus().always(function() {
            checkHub(false);
            $.getJSON('/admin/ipgeo-download-status', function(res) {
                var dl = res && res.data && res.data.download;
                if (dl && dl.state === 'running') {
                    showDl(dl);
                    clearTimeout(pollTimer);
                    pollDl();
                } else {
                    lastDlState = 'idle';
                }
            });
        });
    });
});
</script>
</div>
{{template "admin_shell_close" .}}
{{end}}