YwxAppThink/app/backend/view/upgrade/index.html

<div class="layui-container" style="margin-top:20px;">
    <div class="layui-card">
        <div class="layui-card-header">主框架在线升级</div>
        <div class="layui-card-body">
            <p>当前版本：<span class="layui-badge layui-bg-blue" id="current">{$current}</span></p>
            <div id="status" class="layui-text" style="margin:12px 0;min-height:24px;"></div>

            <div id="pkgTypeBox" style="display:none;margin:12px 0;padding:10px 12px;background:#fafafa;border:1px solid #eee;border-radius:4px;">
                <div style="margin-bottom:8px;color:#555;">升级包类型：</div>
                <div class="layui-btn-group" id="pkgTypeGroup">
                    <button type="button" class="layui-btn layui-btn-sm layui-btn-normal pkg-opt" data-type="auto">自动（推荐）</button>
                    <button type="button" class="layui-btn layui-btn-sm layui-btn-primary pkg-opt" data-type="full">完整包</button>
                    <button type="button" class="layui-btn layui-btn-sm layui-btn-primary pkg-opt" data-type="patch">增量小包</button>
                </div>
                <div id="pkgTypeTip" style="margin-top:8px;color:#e67700;font-size:13px;"></div>
            </div>

            <button class="layui-btn layui-btn-normal" id="btnCheck">
                <i class="layui-icon layui-icon-refresh"></i> 检查更新
            </button>
            <button class="layui-btn layui-btn-danger" id="btnUpgrade" style="display:none;">
                <i class="layui-icon layui-icon-release"></i> 立即升级
            </button>
        </div>
    </div>
</div>
<script>
layui.use(['jquery', 'layer', 'http'], function () {
    var $ = layui.jquery, layer = layui.layer, http = layui.http;
    var selectedType = 'auto';

    function setDisabled($el, dis) {
        if (dis) {
            $el.addClass('layui-btn-disabled').prop('disabled', true);
        } else {
            $el.removeClass('layui-btn-disabled').prop('disabled', false);
        }
    }

    $('#pkgTypeGroup').on('click', '.pkg-opt', function () {
        if ($(this).prop('disabled')) return;
        selectedType = $(this).data('type');
        $('#pkgTypeGroup .pkg-opt').removeClass('layui-btn-normal').addClass('layui-btn-primary');
        $(this).removeClass('layui-btn-primary').addClass('layui-btn-normal');
    });

    function check() {
        $('#status').html('<i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate"></i> 正在检查...');
        http.get('{:url("framework/check")}', {}, {timeout: 15000}).then(function (res) {
            if (res && res.code === 0) {
                var d = res.data;
                if (d.has_update) {
                    var autoMode = d.use_patch ? '增量补丁' : '整包';
                    var html = '发现新版本：<b>' + d.latest + '</b>'
                        + ' <span class="layui-badge layui-bg-orange">自动模式将使用' + autoMode + '</span>';
                    if (d.use_patch && d.patch_from) html += '（基于 ' + d.patch_from + '）';
                    if (d.has_full && d.has_patch) html += ' <span class="layui-badge layui-bg-gray">已同时发布完整包与增量小包</span>';
                    if (d.title) html += '（' + d.title + '）';
                    if (d.error) {
                        html += '<br><span style="color:#dc2626;">' + d.error + '</span>';
                    }
                    html += '<br>更新内容：<pre style="margin-top:6px;">' + (d.changelog || '') + '</pre>';
                    $('#status').html(html);

                    if (d.error) {
                        $('#btnUpgrade').hide();
                        $('#pkgTypeBox').hide();
                    } else {
                        $('#btnUpgrade').show();
                        // 显示升级包类型选择（按钮组，不依赖 layui.form）
                        $('#pkgTypeBox').show();
                        selectedType = 'auto';
                        $('#pkgTypeGroup .pkg-opt').removeClass('layui-btn-normal').addClass('layui-btn-primary');
                        $('#pkgTypeGroup .pkg-opt[data-type=auto]').removeClass('layui-btn-primary').addClass('layui-btn-normal');
                        setDisabled($('#pkgTypeGroup .pkg-opt[data-type=full]'), !d.has_full);
                        setDisabled($('#pkgTypeGroup .pkg-opt[data-type=patch]'), !d.use_patch);
                        var tips = [];
                        if (!d.has_full) tips.push('当前无完整包可用');
                        if (!d.use_patch) tips.push('当前版本（' + (d.current || '') + '）不支持增量小包，需基于 ' + (d.patch_from || '?'));
                        $('#pkgTypeTip').text(tips.length ? '提示：' + tips.join('；') + '，建议选「自动」' : '可手动选择完整包或增量小包');
                    }
                } else {
                    $('#status').html('<span style="color:#16a34a;">✓ 已是最新版本（' + d.current + '）</span>');
                    $('#btnUpgrade').hide();
                    $('#pkgTypeBox').hide();
                }
            } else {
                $('#status').html('<span style="color:#dc2626;">' + ((res && res.message) || '检查失败') + '</span>');
            }
        }).catch(function (err) {
            $('#status').html('<span style="color:#dc2626;">请求失败：'
                + (err && err.message ? err.message : '网络异常') + '</span>');
        });
    }

    $('#btnCheck').on('click', check);

    $('#btnUpgrade').on('click', function () {
        var label = {auto: '自动模式', full: '完整包', patch: '增量小包'}[selectedType] || selectedType;
        layer.confirm('将以【' + label + '】升级，将备份当前核心并覆盖，确定继续？', function () {
            $('#status').html('<i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate"></i> 正在下载并升级...');
            // 下载 + 备份 + 覆盖可能很久，放宽到 10 分钟
            http.post('{:url("framework/upgrade")}', {type: selectedType}, {timeout: 600000}).then(function (res) {
                if (res && res.code === 0) {
                    $('#status').html('<span style="color:#16a34a;">✓ ' + res.message + '</span>');
                    $('#btnUpgrade').hide();
                    $('#pkgTypeBox').hide();
                } else {
                    $('#status').html('<span style="color:#dc2626;">' + ((res && res.message) || '升级失败') + '</span>');
                }
            }).catch(function (err) {
                $('#status').html('<span style="color:#dc2626;">请求失败：'
                    + (err && err.message ? err.message : '网络异常') + '</span>');
            });
        });
    });

    check();
});
</script>