diff --git a/public/css/admin-components.css b/public/css/admin-components.css index 3fb5797..44ca8c5 100644 --- a/public/css/admin-components.css +++ b/public/css/admin-components.css @@ -108,6 +108,24 @@ line-height:1.5; } +/* 可复用:折叠面板(参考 Ant Design Pro 的筛选区交互:可折叠、摘要做成一条可点 Header) */ +.collapsible > summary{ + list-style:none; + cursor:pointer; +} + +.collapsible > summary::-webkit-details-marker{ + display:none; +} + +.collapsible-summary{ + user-select:none; +} + +.collapsible-body{ + margin-top:10px; +} + /* 平台订单:工具区(两列分组卡片化,避免表单散落) */ .tool-grid{ display:grid; diff --git a/public/js/admin.js b/public/js/admin.js index f92c803..f28bf21 100644 --- a/public/js/admin.js +++ b/public/js/admin.js @@ -43,6 +43,37 @@ }); })(); + // 通用:折叠面板(collapsible)记忆展开状态(localStorage) + // 用法:
+ (function () { + var nodes = document.querySelectorAll('details[data-role="collapsible"][data-storage-key]'); + if (!nodes || nodes.length === 0) { + return; + } + + nodes.forEach(function (d) { + var key = d.getAttribute('data-storage-key'); + if (!key) { + return; + } + + try { + var saved = window.localStorage.getItem(key); + if (saved === 'open') { + d.open = true; + } else if (saved === 'closed') { + d.open = false; + } + } catch (e) {} + + d.addEventListener('toggle', function () { + try { + window.localStorage.setItem(key, d.open ? 'open' : 'closed'); + } catch (e) {} + }); + }); + })(); + // 通用:将后端 flash 信息同步到 toast(更像 Ant Design Pro 的反馈方式) // 说明:渐进增强。页面仍保留原本的提示块,不依赖 JS。 (function () { diff --git a/resources/views/admin/platform_orders/index.blade.php b/resources/views/admin/platform_orders/index.blade.php index b091caa..5e9b970 100644 --- a/resources/views/admin/platform_orders/index.blade.php +++ b/resources/views/admin/platform_orders/index.blade.php @@ -295,9 +295,15 @@ -
-

筛选条件

-
+
+ +
+

筛选条件

+ 点击收起/展开 +
+
+
+ @if($safeBackForLinks !== '') @endif @@ -391,7 +397,8 @@
-
+ +
diff --git a/tests/Feature/AdminPlatformOrderIndexFilterPanelShouldBeCollapsibleTest.php b/tests/Feature/AdminPlatformOrderIndexFilterPanelShouldBeCollapsibleTest.php new file mode 100644 index 0000000..6ad5da5 --- /dev/null +++ b/tests/Feature/AdminPlatformOrderIndexFilterPanelShouldBeCollapsibleTest.php @@ -0,0 +1,36 @@ +seed(); + + $this->post('/admin/login', [ + 'email' => 'platform.admin@demo.local', + 'password' => 'Platform@123456', + ])->assertRedirect('/admin'); + } + + public function test_index_filter_panel_should_be_collapsible(): void + { + $this->loginAsPlatformAdmin(); + + $res = $this->get('/admin/platform-orders'); + $res->assertOk(); + + $html = (string) $res->getContent(); + + $this->assertStringContainsString('data-role="collapsible"', $html); + $this->assertStringContainsString('data-storage-key="admin.platform_orders.filters"', $html); + $this->assertStringContainsString('assertStringContainsString('筛选条件', $html); + } +}