feat: 后台表格优化——行点击禁用/标题省略/行高统一/筛选控件紧凑

- 8 个资源表格 recordUrl(null)+recordAction(null):行不再可点击,查看/编辑仅通过操作列按钮;标题列不再自动变链接
- 标题列单行省略(含分类描述),长标题不换行,所有数据行统一 53px 与表头等高
- 筛选下拉控件紧凑(min-height 1.75rem、字号 0.8rem),与应用按钮协调
- 重置链接紧跟应用筛选按钮(不再推到最右)
- 操作列固定宽度 88px
- 实测:表头=数据行=53px、行点击关闭、重置紧跟应用
This commit is contained in:
ak
2026-08-12 19:11:13 +08:00
parent 1d0fe3f8b6
commit c12eb38cca
9 changed files with 30 additions and 4 deletions
@@ -47,6 +47,8 @@ class CategoriesTable
->recordActions([
EditAction::make(),
])
->recordUrl(null)
->recordAction(null)
->toolbarActions([
BulkActionGroup::make([
DeleteBulkAction::make(),
@@ -73,7 +73,9 @@ class CommentsTable
->color('success')
->visible(fn (Comment $record) => $record->status !== 'published')
->action(function (Comment $record): void {
$record->update(['status' => 'published']);
$record->update(['status' => 'published'])
->recordUrl(null)
->recordAction(null);
$record->post?->increment('comment_count');
}),
Action::make('spam')
@@ -53,6 +53,8 @@ class LinksTable
->recordActions([
EditAction::make(),
])
->recordUrl(null)
->recordAction(null)
->toolbarActions([
BulkActionGroup::make([
DeleteBulkAction::make(),
@@ -60,6 +60,8 @@ class MediaTable
->recordActions([
\Filament\Actions\EditAction::make(),
])
->recordUrl(null)
->recordAction(null)
->toolbarActions([
BulkActionGroup::make([
DeleteBulkAction::make(),
@@ -85,6 +85,8 @@ class PostsTable
ViewAction::make(),
EditAction::make(),
])
->recordUrl(null)
->recordAction(null)
->toolbarActions([
BulkActionGroup::make([
DeleteBulkAction::make(),
@@ -55,6 +55,8 @@ class UsersTable
->recordActions([
EditAction::make(),
])
->recordUrl(null)
->recordAction(null)
->toolbarActions([
BulkActionGroup::make([
DeleteBulkAction::make(),
+13 -3
View File
@@ -69,18 +69,28 @@ class AppServiceProvider extends ServiceProvider
/* 表格行紧凑:数据行高度由 .fi-ta-text / .fi-ta-icon 的 padding-block 驱动;操作列按钮禁止换行堆叠 */
.fi-ta-text, .fi-ta-icon { padding-block: calc(var(--spacing) * 1.75) !important; }
.fi-ta-actions { flex-wrap: nowrap !important; min-height: 0 !important; }
.fi-ta-header-cell { padding-block: calc(var(--spacing) * 3) !important; }
.fi-ta-header-cell { padding-block: calc(var(--spacing) * 4) !important; }
.fi-ta-selection-cell { padding-block: calc(var(--spacing) * 1.5) !important; }
.fi-ta-header-toolbar { padding-block: 0.5rem !important; }
/* 筛选条件区:整体一行横排,重置靠右,应用按钮缩小 */
/* 标题列过长单行省略,避免换行撑高行 */
.fi-ta-cell-title .fi-ta-text { display: block !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.fi-ta-cell-title .fi-ta-text .fi-ta-text-item,
.fi-ta-cell-title .fi-ta-text .fi-ta-text-description { display: inline !important; margin: 0 !important; }
/* 操作列固定宽度(钉住右侧需 table sticky,见备注) */
.fi-ta-actions-header-cell, .fi-ta-cell:has(.fi-ta-actions) { width: 88px !important; min-width: 88px !important; }
/* 筛选条件区:整体一行横排,重置紧跟应用按钮,控件紧凑 */
.fi-ta-filters-above-content-ctn { padding: 0.4rem 0.9rem !important; }
.fi-ta-filters-heading { display: none !important; }
.fi-ta-filters { display: flex !important; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.fi-ta-filters-header { margin: 0 0 0 auto !important; order: 99 !important; }
.fi-ta-filters-header { margin: 0 !important; order: 99 !important; }
.fi-ta-filters .fi-grid { display: flex !important; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.fi-ta-filters .fi-fo-field { display: flex !important; align-items: center; gap: 0.4rem; }
.fi-ta-filters .fi-fo-field-label { margin-bottom: 0 !important; }
.fi-ta-filters .fi-input-wrp { min-height: 1.75rem !important; border-radius: 0.4rem !important; }
.fi-ta-filters .fi-select-input, .fi-ta-filters .fi-select-native { font-size: 0.8rem !important; }
.fi-ta-filters-actions-ctn { display: inline-flex !important; }
.fi-ta-filters-actions-ctn .fi-btn { padding: 0.2rem 0.7rem !important; font-size: 0.8rem !important; }
</style>