From ba22150bde8572a8b9ea69de7db9e4f3b4fe6f81 Mon Sep 17 00:00:00 2001
From: augushong <augushong@163.com>
Date: Sat, 3 Oct 2026 12:48:03 +0000
Subject: [PATCH] =?UTF-8?q?feat(table):=20=E5=8D=A1=E7=89=87=E6=93=8D?=
 =?UTF-8?q?=E4=BD=9C=E6=8C=89=E9=92=AE=E8=BF=87=E5=A4=9A=E6=97=B6=E6=8A=98?=
 =?UTF-8?q?=E5=8F=A0=E6=94=B6=E7=BA=B3=EF=BC=88pro#6=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

卡片操作按钮直接子级超 3 个时第 4 个起收纳
容器级委托展开/收起
阈值写死
---
 public/static/admin/css/public.css            | 18 +++++++++++
 public/static/admin/css/public.scss           | 19 ++++++++++++
 .../static/plugs/ulthon-admin/admin-table.js  | 30 +++++++++++++++++++
 3 files changed, 67 insertions(+)

diff --git a/public/static/admin/css/public.css b/public/static/admin/css/public.css
index 2297b5d..38c4706 100644
--- a/public/static/admin/css/public.css
+++ b/public/static/admin/css/public.css
@@ -885,6 +885,24 @@ table样式
   }
 }
 
+/* 卡片操作按钮折叠收纳：按钮超过 3 个时其余移入隐藏容器（admin-table.js
+   applyCardOperatFold 移 DOM），点击"更多"锚点展开整行排列，on 态高亮 */
+.ua-card-operat-more-wrap:not(.layui-hide) {
+  flex-basis: 100%;
+  display: flex;
+  justify-content: flex-end;
+  gap: 4px;
+  flex-wrap: wrap;
+}
+
+.ua-card-operat-more {
+  cursor: pointer;
+  color: inherit;
+}
+.ua-card-operat-more.on {
+  color: rgb(22, 183, 119);
+}
+
 .ua-card-setting-panel {
   min-width: 200px;
 }
diff --git a/public/static/admin/css/public.scss b/public/static/admin/css/public.scss
index 1ce6c95..ce5139c 100644
--- a/public/static/admin/css/public.scss
+++ b/public/static/admin/css/public.scss
@@ -907,6 +907,25 @@ table样式
     }
 }
 
+// 卡片操作按钮折叠收纳：按钮超过 3 个时其余移入隐藏容器（admin-table.js
+// applyCardOperatFold 移 DOM），点击"更多"锚点展开整行排列，on 态高亮
+.ua-card-operat-more-wrap:not(.layui-hide) {
+    flex-basis: 100%;
+    display: flex;
+    justify-content: flex-end;
+    gap: 4px;
+    flex-wrap: wrap;
+}
+
+.ua-card-operat-more {
+    cursor: pointer;
+    color: inherit;
+
+    &.on {
+        color: rgb(22, 183, 119);
+    }
+}
+
 // 卡片设置面板（admin-table.js listenToolbar case 'TABLE_CARD_SETTING' 产出；
 // 面板骨架复用上方 .ul-nav-block 基类，此处只补面板本体、配置行与自绘开关）
 .ua-card-setting-panel {
diff --git a/public/static/plugs/ulthon-admin/admin-table.js b/public/static/plugs/ulthon-admin/admin-table.js
index 313b283..26f0b11 100644
--- a/public/static/plugs/ulthon-admin/admin-table.js
+++ b/public/static/plugs/ulthon-admin/admin-table.js
@@ -289,6 +289,25 @@
         return false;
     };
 
+    // 卡片操作按钮折叠收纳：模板管线渲染完成后扫描各卡片操作区，直接子级
+    // a/button 超过阈值 3 时从第 4 个起移入隐藏收纳容器，并在操作区末尾追加
+    // "更多"开关锚点（展开委托在 render() 受控接线创建模板容器处绑定）。
+    // 阈值写死不配置；调用点在 form.render 之前——按钮为锚点无逐节点事件，
+    // 先移 DOM 再美化安全。Vue 分支不经过本函数（模板自理）。
+    var applyCardOperatFold = function ($container) {
+        $container.find('.ua-data-card-operat').each(function () {
+            var $operat = $(this);
+            var $buttons = $operat.children('a, button');
+            if ($buttons.length <= 3) {
+                return;
+            }
+            var $moreWrap = $('<div class="ua-card-operat-more-wrap layui-hide"></div>');
+            $buttons.slice(3).appendTo($moreWrap);
+            $moreWrap.appendTo($operat);
+            $operat.append($('<a class="ua-card-operat-more"><i class="layui-icon layui-icon-more"></i></a>'));
+        });
+    };
+
     // ========== vue/vueId 引擎（任务 17，全局 Vue 2.6.10 运行时编译）==========
     // 渲染模式为列表级单实例：模板内 v-for="d in rows" 循环行，一次渲染只挂载
     // 一个实例（逐行 new Vue 的成本随行数线性膨胀，销毁纪律也难以收口）。
@@ -720,6 +739,8 @@
             // 切形态/重渲后保持；CSS 三态效果见 public.scss）
             $container.toggleClass('ua-card-operat-always', ua.getPageSetting('card-operat-always', '') === '1');
             $container.html(html);
+            // 卡片操作按钮折叠收纳（function/laytpl 共用分支，见 applyCardOperatFold）
+            applyCardOperatFold($container);
             // 容器恒为 .layui-form（lay-filter 与容器 id 同名），scoped form.render
             // 美化模板产出的 switch/checkbox 控件
             form.render(null, 'ua-layout-' + tableId);
@@ -1068,6 +1089,15 @@
                     '<div id="' + layoutId + '" class="ua-layout-container layui-form" lay-filter="ua-layout-' + options.id + '"></div>'
                 );
 
+                // 卡片操作按钮"更多"展开委托：容器每次 render 经上方 remove 后
+                // 重建，容器级委托绑定一次即随容器生命周期，无重复绑定；展开
+                // 状态不记忆（重渲后收回）属预期
+                $('#' + layoutId).on('click', '.ua-card-operat-more', function (e) {
+                    $(this).toggleClass('on').siblings('.ua-card-operat-more-wrap').toggleClass('layui-hide');
+                    e.preventDefault();
+                    e.stopPropagation();
+                });
+
                 // 形态注册：layoutList 已在 defaultToolbar 段规范化（视图按钮
                 // 注入共用）。运行期切形态经 ua.table.setLayoutForm。
                 // options.cols 此时已过 formatCols/renderOperat/renderTrueHide，