Skip to content

Commit 18a938a

Browse files
lrljoelrljoe
committed
Tweaks for Lazy Tables & Tidying Item
1 parent 7e6c205 commit 18a938a

File tree

4 files changed

+131
-134
lines changed

4 files changed

+131
-134
lines changed

‎resources/views/components/tools/filter-pills.blade.php‎

Lines changed: 26 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,30 @@
11
@aware([ 'tableName','isTailwind','isBootstrap','isBootstrap4','isBootstrap5'])
22

3-
@if ($this->filtersAreEnabled() && $this->filterPillsAreEnabled() && $this->hasAppliedVisibleFiltersForPills())
4-
<div>
5-
<div @class([
6-
'mb-4 px-4 md:p-0' => $isTailwind,
7-
'mb-3' => $isBootstrap,
8-
]) x-cloak x-show="!currentlyReorderingStatus">
9-
<small @class([
10-
'text-gray-700 dark:text-white' => $isTailwind,
11-
'' => $isBootstrap,
12-
])>
13-
{{ __($this->getLocalisationPath.'Applied Filters') }}:
14-
</small>
3+
<div>
4+
<div @class([
5+
'mb-4 px-4 md:p-0' => $isTailwind,
6+
'mb-3' => $isBootstrap,
7+
]) x-cloak x-show="!currentlyReorderingStatus">
8+
<small @class([
9+
'text-gray-700 dark:text-white' => $isTailwind,
10+
'' => $isBootstrap,
11+
])>
12+
{{ __($this->getLocalisationPath.'Applied Filters') }}:
13+
</small>
1514

16-
@foreach($this->getAppliedFiltersWithValues() as $filterSelectName => $value)
17-
@php($filter = $this->getFilterByKey($filterSelectName))
18-
@continue(is_null($filter) || $filter->isHiddenFromPills())
19-
@php( $filterPillTitle = $filter->getFilterPillTitle())
20-
@php( $filterPillValue = $filter->getFilterPillValue($value))
21-
@php( $separator = method_exists($filter, 'getPillsSeparator') ? $filter->getPillsSeparator() : ', ')
22-
@continue((is_array($filterPillValue) && empty($filterPillValue)))
23-
24-
@if ($filter->hasCustomPillBlade())
25-
@include($filter->getCustomPillBlade(), ['filter' => $filter])
26-
@else
27-
<x-livewire-tables::tools.filter-pills.item :$filterPillTitle :$filterPillValue :$filterSelectName :$separator/>
28-
@endif
29-
@endforeach
30-
<x-livewire-tables::tools.filter-pills.buttons.reset-all />
31-
</div>
15+
@tableloop($this->getAppliedFiltersWithValues() as $filterSelectName => $value)
16+
@php($filter = $this->getFilterByKey($filterSelectName))
17+
@continue(is_null($filter) || $filter->isHiddenFromPills())
18+
@php( $filterPillValue = $filter->getFilterPillValue($value))
19+
@continue((is_array($filterPillValue) && empty($filterPillValue)))
20+
@php( $filterPillTitle = $filter->getFilterPillTitle())
21+
@php( $separator = method_exists($filter, 'getPillsSeparator') ? $filter->getPillsSeparator() : ', ')
22+
@if ($filter->hasCustomPillBlade())
23+
@include($filter->getCustomPillBlade(), ['filter' => $filter])
24+
@else
25+
<x-livewire-tables::tools.filter-pills.item :$filterPillTitle :$filterPillValue :$filterSelectName :$separator/>
26+
@endif
27+
@endtableloop
28+
<x-livewire-tables::tools.filter-pills.buttons.reset-all />
3229
</div>
33-
@endif
30+
</div>

‎resources/views/components/tools/filter-pills/item.blade.php‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,20 @@
33
<span
44
wire:key="{{ $tableName }}-filter-pill-{{ $filterSelectName }}"
55
{{
6-
$attributes->merge($this->getFilterPillsItemAttributes())
6+
$attributes->merge($this->getFilterPillsItemAttributes)
77
->class([
8-
'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium leading-4 capitalize' => $isTailwind && $this->getFilterPillsItemAttributes()['default-styling'],
9-
'bg-indigo-100 text-indigo-800 dark:bg-indigo-200 dark:text-indigo-900' => $isTailwind && $this->getFilterPillsItemAttributes()['default-colors'],
10-
'badge badge-pill badge-info d-inline-flex align-items-center' => $isBootstrap4 && $this->getFilterPillsItemAttributes()['default-styling'],
11-
'badge rounded-pill bg-info d-inline-flex align-items-center' => $isBootstrap5 && $this->getFilterPillsItemAttributes()['default-styling'],
8+
'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium leading-4 capitalize' => $isTailwind && ($this->getFilterPillsItemAttributes['default-styling'] ?? true),
9+
'bg-indigo-100 text-indigo-800 dark:bg-indigo-200 dark:text-indigo-900' => $isTailwind && ($this->getFilterPillsItemAttributes['default-colors'] ?? true),
10+
'badge badge-pill badge-info d-inline-flex align-items-center' => $isBootstrap4 && ($this->getFilterPillsItemAttributes['default-styling'] ?? true),
11+
'badge rounded-pill bg-info d-inline-flex align-items-center' => $isBootstrap5 && ($this->getFilterPillsItemAttributes['default-styling'] ?? true),
1212
])
1313
->except(['default-styling', 'default-colors'])
1414
}}
1515
>
1616
{{ $filterPillTitle }}:
1717

1818
@if(is_array($filterPillValue))
19-
@foreach($filterPillValue as $filterPillArrayValue)
20-
{{ $filterPillArrayValue }}{!! !$loop->last ? $separator : '' !!}
21-
@endforeach
19+
{{ implode($separator, $filterPillValue) }}
2220
@else
2321
{{ $filterPillValue }}
2422
@endif

‎resources/views/datatable.blade.php‎

Lines changed: 98 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -7,133 +7,135 @@
77
@php($isBootstrap5 = $this->isBootstrap5)
88

99
<div>
10-
<div {{ $this->getTopLevelAttributes() }}>
11-
12-
@includeWhen(
13-
$this->hasConfigurableAreaFor('before-wrapper'),
14-
$this->getConfigurableAreaFor('before-wrapper'),
15-
$this->getParametersForConfigurableArea('before-wrapper')
16-
)
17-
18-
<x-livewire-tables::wrapper :component="$this" :tableName="$tableName" :$primaryKey :$isTailwind :$isBootstrap :$isBootstrap4 :$isBootstrap5>
19-
@if($this->hasActions && !$this->showActionsInToolbar)
20-
<x-livewire-tables::includes.actions/>
21-
@endif
10+
<div x-data="{ currentlyReorderingStatus: false }">
11+
<div {{ $this->getTopLevelAttributes() }}>
2212

2313
@includeWhen(
24-
$this->hasConfigurableAreaFor('before-tools'),
25-
$this->getConfigurableAreaFor('before-tools'),
26-
$this->getParametersForConfigurableArea('before-tools')
14+
$this->hasConfigurableAreaFor('before-wrapper'),
15+
$this->getConfigurableAreaFor('before-wrapper'),
16+
$this->getParametersForConfigurableArea('before-wrapper')
2717
)
2818

29-
@if($this->shouldShowTools)
30-
<x-livewire-tables::tools>
31-
@if ($this->showSortPillsSection)
32-
<x-livewire-tables::tools.sorting-pills />
33-
@endif
34-
@if($this->showFilterPillsSection)
35-
<x-livewire-tables::tools.filter-pills />
36-
@endif
37-
38-
@includeWhen(
39-
$this->hasConfigurableAreaFor('before-toolbar'),
40-
$this->getConfigurableAreaFor('before-toolbar'),
41-
$this->getParametersForConfigurableArea('before-toolbar')
42-
)
43-
44-
@if($this->shouldShowToolBar)
45-
<x-livewire-tables::tools.toolbar />
19+
<x-livewire-tables::wrapper :component="$this" :tableName="$tableName" :$primaryKey :$isTailwind :$isBootstrap :$isBootstrap4 :$isBootstrap5>
20+
@if($this->hasActions && !$this->showActionsInToolbar)
21+
<x-livewire-tables::includes.actions/>
4622
@endif
4723

4824
@includeWhen(
49-
$this->hasConfigurableAreaFor('after-toolbar'),
50-
$this->getConfigurableAreaFor('after-toolbar'),
51-
$this->getParametersForConfigurableArea('after-toolbar')
25+
$this->hasConfigurableAreaFor('before-tools'),
26+
$this->getConfigurableAreaFor('before-tools'),
27+
$this->getParametersForConfigurableArea('before-tools')
5228
)
5329

54-
</x-livewire-tables::tools>
55-
@endif
56-
57-
<x-livewire-tables::table>
58-
59-
<x-slot name="thead">
60-
@if($this->getCurrentlyReorderingStatus)
61-
<x-livewire-tables::table.th.reorder x-cloak x-show="currentlyReorderingStatus" />
30+
@if($this->shouldShowTools)
31+
<x-livewire-tables::tools>
32+
@if ($this->showSortPillsSection)
33+
<x-livewire-tables::tools.sorting-pills />
6234
@endif
63-
@if($this->showBulkActionsSections)
64-
<x-livewire-tables::table.th.bulk-actions :displayMinimisedOnReorder="true" />
35+
@if($this->showFilterPillsSection)
36+
<x-livewire-tables::tools.filter-pills />
6537
@endif
66-
@if ($this->showCollapsingColumnSections)
67-
<x-livewire-tables::table.th.collapsed-columns />
38+
39+
@includeWhen(
40+
$this->hasConfigurableAreaFor('before-toolbar'),
41+
$this->getConfigurableAreaFor('before-toolbar'),
42+
$this->getParametersForConfigurableArea('before-toolbar')
43+
)
44+
45+
@if($this->shouldShowToolBar)
46+
<x-livewire-tables::tools.toolbar />
6847
@endif
6948

70-
@foreach($this->selectedVisibleColumns as $index => $column)
71-
<x-livewire-tables::table.th wire:key="{{ $tableName.'-table-head-'.$index }}" :$column :$index />
72-
@endforeach
73-
</x-slot>
49+
@includeWhen(
50+
$this->hasConfigurableAreaFor('after-toolbar'),
51+
$this->getConfigurableAreaFor('after-toolbar'),
52+
$this->getParametersForConfigurableArea('after-toolbar')
53+
)
7454

75-
@if($this->secondaryHeaderIsEnabled() && $this->hasColumnsWithSecondaryHeader())
76-
<x-livewire-tables::table.tr.secondary-header />
77-
@endif
78-
@if($this->hasDisplayLoadingPlaceholder())
79-
<x-livewire-tables::includes.loading colCount="{{ $this->columns->count()+1 }}" />
55+
</x-livewire-tables::tools>
8056
@endif
8157

82-
@if($this->showBulkActionsSections)
83-
<x-livewire-tables::table.tr.bulk-actions :displayMinimisedOnReorder="true" />
84-
@endif
58+
<x-livewire-tables::table>
8559

86-
@forelse ($this->getRows as $rowIndex => $row)
87-
<x-livewire-tables::table.tr wire:key="{{ $tableName }}-row-wrap-{{ $row->{$primaryKey} }}" :$row :$rowIndex>
60+
<x-slot name="thead">
8861
@if($this->getCurrentlyReorderingStatus)
89-
<x-livewire-tables::table.td.reorder x-cloak x-show="currentlyReorderingStatus" wire:key="{{ $tableName }}-row-reorder-{{ $row->{$primaryKey} }}" :rowID="$tableName.'-'.$row->{$this->getPrimaryKey()}" :$rowIndex />
62+
<x-livewire-tables::table.th.reorder x-cloak x-show="currentlyReorderingStatus" />
9063
@endif
9164
@if($this->showBulkActionsSections)
92-
<x-livewire-tables::table.td.bulk-actions wire:key="{{ $tableName }}-row-bulk-act-{{ $row->{$primaryKey} }}" :$row :$rowIndex />
65+
<x-livewire-tables::table.th.bulk-actions :displayMinimisedOnReorder="true" />
9366
@endif
9467
@if ($this->showCollapsingColumnSections)
95-
<x-livewire-tables::table.td.collapsed-columns wire:key="{{ $tableName }}-row-collapsed-{{ $row->{$primaryKey} }}" :$rowIndex />
68+
<x-livewire-tables::table.th.collapsed-columns />
9669
@endif
9770

98-
@foreach($this->selectedVisibleColumns as $colIndex => $column)
99-
<x-livewire-tables::table.td wire:key="{{ $tableName . '-' . $row->{$primaryKey} . '-datatable-td-' . $column->getSlug() }}" :$column :$colIndex>
100-
@if($column->isHtml())
101-
{!! $column->setIndexes($rowIndex, $colIndex)->renderContents($row) !!}
102-
@else
103-
{{ $column->setIndexes($rowIndex, $colIndex)->renderContents($row) }}
104-
@endif
105-
</x-livewire-tables::table.td>
71+
@foreach($this->selectedVisibleColumns as $index => $column)
72+
<x-livewire-tables::table.th wire:key="{{ $tableName.'-table-head-'.$index }}" :$column :$index />
10673
@endforeach
107-
</x-livewire-tables::table.tr>
74+
</x-slot>
10875

109-
@if ($this->showCollapsingColumnSections)
110-
<x-livewire-tables::table.collapsed-columns :$row :$rowIndex />
76+
@if($this->secondaryHeaderIsEnabled() && $this->hasColumnsWithSecondaryHeader())
77+
<x-livewire-tables::table.tr.secondary-header />
11178
@endif
112-
@empty
113-
<x-livewire-tables::table.empty />
114-
@endforelse
115-
116-
@if ($this->footerIsEnabled() && $this->hasColumnsWithFooter())
117-
<x-slot name="tfoot">
118-
@if ($this->useHeaderAsFooterIsEnabled())
119-
<x-livewire-tables::table.tr.secondary-header />
120-
@else
121-
<x-livewire-tables::table.tr.footer />
79+
@if($this->hasDisplayLoadingPlaceholder())
80+
<x-livewire-tables::includes.loading colCount="{{ $this->columns->count()+1 }}" />
81+
@endif
82+
83+
@if($this->showBulkActionsSections)
84+
<x-livewire-tables::table.tr.bulk-actions :displayMinimisedOnReorder="true" />
85+
@endif
86+
87+
@forelse ($this->getRows as $rowIndex => $row)
88+
<x-livewire-tables::table.tr wire:key="{{ $tableName }}-row-wrap-{{ $row->{$primaryKey} }}" :$row :$rowIndex>
89+
@if($this->getCurrentlyReorderingStatus)
90+
<x-livewire-tables::table.td.reorder x-cloak x-show="currentlyReorderingStatus" wire:key="{{ $tableName }}-row-reorder-{{ $row->{$primaryKey} }}" :rowID="$tableName.'-'.$row->{$this->getPrimaryKey()}" :$rowIndex />
91+
@endif
92+
@if($this->showBulkActionsSections)
93+
<x-livewire-tables::table.td.bulk-actions wire:key="{{ $tableName }}-row-bulk-act-{{ $row->{$primaryKey} }}" :$row :$rowIndex />
94+
@endif
95+
@if ($this->showCollapsingColumnSections)
96+
<x-livewire-tables::table.td.collapsed-columns wire:key="{{ $tableName }}-row-collapsed-{{ $row->{$primaryKey} }}" :$rowIndex />
97+
@endif
98+
99+
@foreach($this->selectedVisibleColumns as $colIndex => $column)
100+
<x-livewire-tables::table.td wire:key="{{ $tableName . '-' . $row->{$primaryKey} . '-datatable-td-' . $column->getSlug() }}" :$column :$colIndex>
101+
@if($column->isHtml())
102+
{!! $column->setIndexes($rowIndex, $colIndex)->renderContents($row) !!}
103+
@else
104+
{{ $column->setIndexes($rowIndex, $colIndex)->renderContents($row) }}
105+
@endif
106+
</x-livewire-tables::table.td>
107+
@endforeach
108+
</x-livewire-tables::table.tr>
109+
110+
@if ($this->showCollapsingColumnSections)
111+
<x-livewire-tables::table.collapsed-columns :$row :$rowIndex />
122112
@endif
123-
</x-slot>
124-
@endif
125-
</x-livewire-tables::table>
113+
@empty
114+
<x-livewire-tables::table.empty />
115+
@endforelse
116+
117+
@if ($this->footerIsEnabled() && $this->hasColumnsWithFooter())
118+
<x-slot name="tfoot">
119+
@if ($this->useHeaderAsFooterIsEnabled())
120+
<x-livewire-tables::table.tr.secondary-header />
121+
@else
122+
<x-livewire-tables::table.tr.footer />
123+
@endif
124+
</x-slot>
125+
@endif
126+
</x-livewire-tables::table>
126127

127-
<x-livewire-tables::pagination />
128+
<x-livewire-tables::pagination />
128129

129-
@includeIf($customView)
130-
</x-livewire-tables::wrapper>
130+
@includeIf($customView)
131+
</x-livewire-tables::wrapper>
131132

132-
@includeWhen(
133-
$this->hasConfigurableAreaFor('after-wrapper'),
134-
$this->getConfigurableAreaFor('after-wrapper'),
135-
$this->getParametersForConfigurableArea('after-wrapper')
136-
)
133+
@includeWhen(
134+
$this->hasConfigurableAreaFor('after-wrapper'),
135+
$this->getConfigurableAreaFor('after-wrapper'),
136+
$this->getParametersForConfigurableArea('after-wrapper')
137+
)
137138

139+
</div>
138140
</div>
139141
</div>

‎src/Traits/WithQueryString.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ trait WithQueryString
1414
#[Locked]
1515
public array $queryStringConfig = [
1616
'columns' => ['status' => false, 'alias' => null],
17-
'filters' => ['status' => false, 'alias' => null],
17+
'filters' => ['status' => true, 'alias' => null],
1818
'search' => ['status' => true, 'alias' => null],
1919
'sorts' => ['status' => true, 'alias' => null],
2020
];

0 commit comments

Comments
 (0)