{include file='common/head.html'}
<div class="layui-body">
    <div class="layui-tab layui-tab-brief">
        <ul class="layui-tab-title">
            <li class="layui-this">全站纯静态一键生成系统 (电脑+手机双端版)</li>
        </ul>
        <div class="layui-tab-content">

            <div class="layui-form" style="margin-top: 20px; background: #f8f8f8; padding: 15px; border: 1px solid #e2e2e2; border-radius: 4px;">
                <div class="layui-form-item" style="margin-bottom: 10px;">
                    <label class="layui-form-label" style="width: auto; padding-left: 0; font-weight: bold;">电脑端目录：</label>
                    <div class="layui-input-inline">
                        <input type="text" id="saveFolder" value="a" class="layui-input" placeholder="默认为 a">
                    </div>
                    <div class="layui-form-mid layui-word-aux">（首页强制固定在根目录。其它内容存入该目录下）</div>
                </div>
                
                <div class="layui-form-item" style="margin-bottom: 0;">
                    <label class="layui-form-label" style="width: auto; padding-left: 0; font-weight: bold;">手机端配置：</label>
                    <div class="layui-input-block" style="padding-top: 5px;">
                        <input type="checkbox" id="makeWap" title="📱 开启同步生成手机端静态页" lay-skin="primary" checked>
                        <span style="color: #888; font-size: 12px; margin-left: 10px;">(勾选后，手机站代码将全自动独立闭环输出至网站根目录的 <b>/m/</b> 文件夹下)</span>
                    </div>
                </div>
            </div>

            <div class="layui-form-item" style="margin-top: 30px;">
                <label class="layui-form-label" style="width: auto; padding-left: 0; font-weight: bold;">一键执行任务：</label>
                <div class="layui-input-block" style="margin-left: 110px;">
                    <button type="button" class="layui-btn layui-bg-black action-btn" onclick="startTask('all')" style="font-weight: bold; border: 2px solid #009688;">🚀 一键生成【全站所有】</button>
                    <button type="button" class="layui-btn layui-btn-danger action-btn" onclick="startTask('index')">📥 仅生成【首页】</button>
                    <button type="button" class="layui-btn layui-btn-normal action-btn" onclick="startTask('sort')">📥 仅生成【栏目】</button>
                    <button type="button" class="layui-btn layui-btn-warm action-btn" onclick="startTask('content')">📥 仅生成【文章】</button>
                </div>
            </div>

            <div class="layui-form-item" style="margin-top: 20px;">
                <label class="layui-form-label" style="width: auto; padding-left: 0;">执行进程大屏：</label>
                <div class="layui-input-block" style="margin-left: 110px;">
                    <div style="background: #1e1e1e; color: #0f0; padding: 15px; height: 400px; overflow-y: auto; font-family: 'Consolas', monospace; border-radius: 4px; line-height: 1.6; font-size: 13px;" id="logBox">
                        <div>双端解耦闭环静态化驱动就绪。</div>
                    </div>
                </div>
            </div>
            
        </div>
    </div>
</div>

<script>
    var executionQueue = []; 
    var currentIndex = 0;
    var isRunning = false;
    var currentFolder = '';
    var needWap = 0;

    function log(message, color) {
        var logBox = $('#logBox');
        var colorStyle = color ? 'color:' + color + ';' : '';
        logBox.append('<div style="' + colorStyle + '">' + message + '</div>');
        logBox.scrollTop(logBox[0].scrollHeight);
    }

    function startTask(type) {
        if (isRunning) return;
        
        currentFolder = $.trim($('#saveFolder').val());
        needWap = $('#makeWap').is(':checked') ? 1 : 0;
        
        var typeName = type === 'index' ? '首页' : (type === 'sort' ? '所有栏目' : (type === 'content' ? '所有文章' : '全站所有内容'));
        if(needWap === 1) typeName += " + 手机端同步";

        $('#logBox').empty();
        $('.action-btn').prop('disabled', true);
        isRunning = true;

        log('=====================================', '#009688');
        log('开始获取双端合并任务单：【' + typeName + '】', '#009688');

        $.ajax({
            type: 'GET',
            url: "{url./admin/MakeHtml/getAjaxUrlList}",
            data: { type: type, make_wap: needWap },
            dataType: 'json',
            success: function (res) {
                if (res && res.code === 1) {
                    executionQueue = res.data;
                    if(executionQueue.length === 0) {
                        log('提取中止：当前无有效可生成数据。', '#ff5252');
                        resetState();
                        return;
                    }
                    log('任务池编排成功！双端总计锁定 ' + executionQueue.length + ' 个静态化节点，立即开始执行...', '#69f0ae');
                    currentIndex = 0;
                    processNext();
                } else {
                    log('任务提取失败: ' + (res ? res.data : '未知错误'), '#ff5252');
                    resetState();
                }
            },
            error: function () {
                log('网络异常，任务分配核心不通。', '#ff5252');
                resetState();
            }
        });
    }

    function processNext() {
        if (currentIndex >= executionQueue.length) {
            log('=====================================', '#69f0ae');
            log(' 🎉 恭喜！双端全站纯静态文件已全部安全落盘完毕！', '#69f0ae');
            log('=====================================', '#69f0ae');
            resetState();
            return;
        }

        var target = executionQueue[currentIndex];
        var progress = '[' + (currentIndex + 1) + '/' + executionQueue.length + '] ';
        
        // 区分打印高亮
        var textColor = (target.device === 'wap') ? '#FF9800' : '#fff';
        log(progress + '调度执行: ' + target.name + ' ...', textColor);

        $.ajax({
            type: 'GET', 
            url: "{url./admin/MakeHtml/buildAjaxSingle}",
            data: { job: target.job, id: target.id, device: target.device, folder: currentFolder },
            dataType: 'json',
            timeout: 30000,
            success: function (res) {
                if (res && res.code === 1) {
                    log('    -> [成功] ' + res.data, '#69f0ae');
                } else {
                    log('    -> [失败] ' + (res ? res.data : '通信故障'), '#ff5252');
                }
            },
            error: function () {
                log('    -> [严重异常] 服务器超时或拒绝响应。', '#ff5252');
            },
            complete: function () {
                currentIndex++;
                setTimeout(processNext, 100); 
            }
        });
    }

    function resetState() {
        isRunning = false;
        $('.action-btn').prop('disabled', false);
    }
</script>
{include file='common/foot.html'}