style(queue): 优化队列任务执行窗口

重构队列进度弹窗模板，增加任务编号、状态区域和执行日志头部，并注入独立样式让进度条、日志面板和弹窗标题更清晰。

调整队列弹窗尺寸和皮肤，保持日志区域可滚动展示，减少旧模板中 textarea 风格对实时日志阅读体验的影响。

为队列页面操作按钮补充语义化颜色：优化、启动、关闭、清理和批量删除分别使用不同按钮样式，提升危险操作和普通操作的辨识度。

plugin/think-plugs-static/stc/public/static/plugs/system/queue.js

@@ -14,12 +14,51 @@
 
 layui.define(function (exports) {
 
-    let template = '<div class="padding-30 padding-bottom-0" data-queue-load="{{d.code}}"><div class="layui-elip notselect nowrap" data-message-title><b class="color-desc">...</b></div><div class="margin-top-15 layui-progress layui-progress-big" lay-showPercent="yes"><div class="layui-progress-bar transition" lay-percent="0.00%"></div></div>' + '<div class="margin-top-15"><code class="layui-textarea layui-bg-black border-0" style="resize:none;overflow:hidden;height:190px"></code></div></div>';
+    let template = [
+        '<div class="ta-queue-box" data-queue-load="{{d.code}}">',
+        '  <div class="ta-queue-status">',
+        '    <div class="ta-queue-status-title layui-elip notselect nowrap" data-message-title><b class="color-desc">...</b></div>',
+        '    <div class="ta-queue-status-code"># {{d.code}}</div>',
+        '  </div>',
+        '  <div class="layui-progress layui-progress-big ta-queue-progress" lay-showPercent="yes"><div class="layui-progress-bar transition layui-bg-blue" lay-percent="0.00%"></div></div>',
+        '  <div class="ta-queue-log">',
+        '    <div class="ta-queue-log-head"><span>执行日志</span><small>实时刷新</small></div>',
+        '    <code></code>',
+        '  </div>',
+        '</div>'
+    ].join('');
+
+    function injectStyle() {
+        if (document.getElementById('ta-queue-style')) return;
+        let style = document.createElement('style');
+        style.id = 'ta-queue-style';
+        style.innerHTML = [
+            '.ta-queue-layer{border-radius:10px;overflow:hidden;}',
+            '.ta-queue-layer .layui-layer-title{height:48px;line-height:48px;font-weight:600;border-bottom:1px solid #edf0f5;background:#fff;}',
+            '.ta-queue-layer .layui-layer-content{overflow:hidden;background:#f6f8fb;}',
+            '.ta-queue-box{padding:18px 20px 20px;background:#f6f8fb;}',
+            '.ta-queue-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;background:#fff;border:1px solid #edf0f5;border-radius:10px;box-shadow:0 4px 18px rgba(15,35,60,.04);}',
+            '.ta-queue-status-title{min-width:0;flex:1;font-weight:600;}',
+            '.ta-queue-status-title b{font-weight:600;}',
+            '.ta-queue-status-code{flex-shrink:0;max-width:220px;color:#8c98a8;font-size:12px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}',
+            '.ta-queue-progress{height:12px;margin:14px 2px 0;border-radius:999px;background:#e8edf5;overflow:hidden;}',
+            '.ta-queue-progress .layui-progress-bar{border-radius:999px;}',
+            '.ta-queue-progress .layui-progress-text{top:-6px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2);}',
+            '.ta-queue-log{margin-top:14px;border-radius:10px;background:#222b33;border:1px solid #1a222a;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);}',
+            '.ta-queue-log-head{height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#172027;color:#dce5ee;font-size:13px;}',
+            '.ta-queue-log-head small{font-size:12px;font-weight:400;color:#7f8b98;}',
+            '.ta-queue-log code{display:block;height:185px;margin:0;padding:12px 14px;border:0;background:#222b33;color:#dce5ee;font-family:Consolas,Monaco,Menlo,monospace;font-size:12px;line-height:22px;white-space:normal;overflow:auto;}',
+            '.ta-queue-log code p{height:22px;line-height:22px;margin:0;color:#dce5ee;}',
+            '.ta-queue-log code .color-desc{color:#8c98a8!important;}'
+        ].join('');
+        document.head.appendChild(style);
+    }
 
     function Queue(code, doScript, element) {
         let queue = this;
+        injectStyle();
         (this.doAjax = true) && (this.doReload = false) || layer.open({
-            type: 1, title: false, area: ['560px', '315px'], anim: 2, shadeClose: false, end: function () {
+            type: 1, title: '任务执行进度', area: ['620px', '390px'], skin: 'ta-queue-layer', anim: 2, shadeClose: false, end: function () {
                 queue.doAjax = queue.doReload && doScript && $.layTable.reload(((element || {}).dataset || {}).tableId || true) && false;
             }, content: laytpl(template).render({code: code}), success: function ($elem) {
                 new Progress($elem, code, queue, doScript);

plugin/think-plugs-system/src/builder/QueueBuilder.php

@@ -31,26 +31,30 @@ class QueueBuilder
                             $buttons->button('优化数据库', [
                                 'data-table-id' => 'QueueTable',
                                 'data-queue' => apiuri('system/plugs/optimize'),
+                                'class' => 'layui-btn-normal',
                             ]);
                             if ($iswin || php_sapi_name() === 'cli') {
                                 $buttons->button('启动服务', [
                                     'type' => 'button',
                                     'data-queue-service' => null,
                                     'data-service-url' => apiuri('system/queue/start'),
+                                    'class' => 'layui-btn-primary',
                                 ], null, 'button');
                                 $buttons->button('关闭服务', [
                                     'type' => 'button',
                                     'data-queue-service' => null,
                                     'data-service-url' => apiuri('system/queue/stop'),
+                                    'class' => 'layui-btn-warm',
                                 ], null, 'button');
                             }
                             $buttons->button('定时清理', [
                                 'type' => 'button',
                                 'data-table-id' => 'QueueTable',
                                 'data-queue' => url('clean')->build(),
+                                'class' => 'layui-btn-primary',
                             ], null, 'button');
                         }
-                        $buttons->batchAction('批量删除', url('remove')->build(), 'id#{id}', '确定批量删除记录吗？', [], 'remove');
+                        $buttons->batchAction('批量删除', url('remove')->build(), 'id#{id}', '确定批量删除记录吗？', ['class' => 'layui-btn-danger'], 'remove');
                         if ($super) {
                             $buttons->button('复制启动命令', [
                                 'data-copy' => $command,