feat: 后台表格优化——行点击禁用/标题省略/行高统一/筛选控件紧凑
- 8 个资源表格 recordUrl(null)+recordAction(null):行不再可点击,查看/编辑仅通过操作列按钮;标题列不再自动变链接 - 标题列单行省略(含分类描述),长标题不换行,所有数据行统一 53px 与表头等高 - 筛选下拉控件紧凑(min-height 1.75rem、字号 0.8rem),与应用按钮协调 - 重置链接紧跟应用筛选按钮(不再推到最右) - 操作列固定宽度 88px - 实测:表头=数据行=53px、行点击关闭、重置紧跟应用
This commit is contained in:
@@ -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(),
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user