Skip to content

Commit ce51820

Browse files
thyseusHerbert Maschkemarksalmon
authored
introduce ability to make i18nable custom column category labels (MedicOneSystems#297)
* introduce ability to make i18nable custom column category labels * column group labelling improvements * remove some unnecessary code Co-authored-by: Herbert Maschke <thyseus@pm.me> Co-authored-by: Mark Salmon <mark.salmon@mediconesystems.com>
1 parent 1c5ce46 commit ce51820

File tree

4 files changed

+71
-4
lines changed

4 files changed

+71
-4
lines changed

README.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -216,6 +216,27 @@ NumberColumn::name('students.age:max')->label('Student Max'),
216216
### Column Groups
217217

218218
When you have a very big table with a lot of columns, it is possible to create 'column groups' that allows the user to toggle the visibility of a whole group at once. Use `->group('NAME')` at any column to achieve this.
219+
You can human readable labels and translations of your groups via the `groupLabels` property of your table:
220+
221+
```php
222+
class GroupDemoTable extends LivewireDatatable
223+
{
224+
public $groupLabels = [
225+
'group1' => 'app.translation_for_group_1'
226+
'group2' => 'app.translation_for_group_2'
227+
];
228+
229+
public function columns()
230+
{
231+
return [
232+
Column::name('planets.name')
233+
->group('group1')
234+
->label('Planet'),
235+
236+
Column::name('planets.name')
237+
->group('group2')
238+
->label('Planet'),
239+
```
219240

220241
### Custom column names
221242
It is still possible to take full control over your table, you can define a ```builder``` method using whatever query you like, using your own joins, groups whatever, and then name your columns using your normal SQL syntax:

resources/views/livewire/datatables/datatable.blade.php

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,10 @@
5353
@endif
5454

5555
@foreach ($columnGroups as $name => $group)
56-
<button wire:click="toggleGroup('{{ $name }}')" class="px-3 py-2 border border-green-400 rounded-md bg-white text-green-500 text-xs leading-4 font-medium uppercase tracking-wider hover:bg-green-200 focus:outline-none"><span class="flex items-center h-5">{{ __('Toggle :group', ['group' => $name]) }}</span>
57-
</button>
56+
<button wire:click="toggleGroup('{{ $name }}')"
57+
class="px-3 py-2 border border-green-400 rounded-md bg-white text-green-500 text-xs leading-4 font-medium uppercase tracking-wider hover:bg-green-200 focus:outline-none">
58+
<span class="flex items-center h-5">{{ isset($this->groupLabels[$name]) ? __($this->groupLabels[$name]) : __('Toggle :group', ['group' => $name]) }}</span>
59+
</button>
5860
@endforeach
5961
</div>
6062
</div>

src/Column.php

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ class Column
99
{
1010
public $type = 'string';
1111
public $label;
12-
public $group;
1312
public $name;
1413
public $select;
1514
public $joins;
@@ -34,6 +33,11 @@ class Column
3433
public $width;
3534
public $exportCallback;
3635

36+
/**
37+
* @var string (optional) you can group your columns to let the user toggle the visibility of a group at once.
38+
*/
39+
public $group;
40+
3741
/** @var array list all column types that are not sortable by SQL here */
3842
public const UNSORTABLE_TYPES = ['label', 'checkbox'];
3943

@@ -336,6 +340,8 @@ public function field()
336340

337341
/**
338342
* You can use group(null) to revoke a column from a group, if necessary.
343+
*
344+
* @see array LivewireDatatable->groupLabels to assign a human readable and translatable label for the group
339345
*/
340346
public function group($group)
341347
{

src/Http/Livewire/LivewireDatatable.php

Lines changed: 39 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,16 @@ class LivewireDatatable extends Component
6767
public $persistPerPage = true;
6868
public $persistFilters = true;
6969

70+
/**
71+
* @var array List your groups and the corresponding label (or translation) here.
72+
* The label can be a i18n placeholder like 'app.my_string' and it will be automatically translated via __().
73+
*
74+
* Group labels are optional. If they are omitted, the 'name' of the group will be displayed to the user.
75+
*
76+
* @example ['group1' => 'app.toggle_group1', 'group2' => 'app.toggle_group2']
77+
*/
78+
public $groupLabels = [];
79+
7080
protected $query;
7181
protected $listeners = ['refreshLivewireDatatable', 'complexQuery', 'saveQuery', 'deleteQuery', 'applyToTable', 'resetTable'];
7282

@@ -543,7 +553,7 @@ public function initialisePerPage()
543553
public function initialiseColumnGroups()
544554
{
545555
array_map(function ($column) {
546-
if ($column['group'] ?? false) {
556+
if (isset($column['group'])) {
547557
$this->columnGroups[$column['group']][] = $column['name'] ?? $column['label'];
548558
}
549559
}, $this->columns);
@@ -673,6 +683,34 @@ public function toggleGroup($group)
673683
}
674684
}
675685

686+
/**
687+
* @return bool returns true if all columns of the given group are _completely_ visible.
688+
*/
689+
public function isGroupVisible($group)
690+
{
691+
foreach ($this->columns as $column) {
692+
if ($column['group'] === $group && $column['hidden']) {
693+
return false;
694+
}
695+
}
696+
697+
return true;
698+
}
699+
700+
/**
701+
* @return bool returns true if all columns of the given group are _completely_ hidden.
702+
*/
703+
public function isGroupHidden($group)
704+
{
705+
foreach ($this->columns as $column) {
706+
if ($column['group'] === $group && ! $column['hidden']) {
707+
return false;
708+
}
709+
}
710+
711+
return true;
712+
}
713+
676714
public function doBooleanFilter($index, $value)
677715
{
678716
$this->activeBooleanFilters[$index] = $value;

0 commit comments

Comments
 (0)