Skip to content

Commit 1027123

Browse files
lrljoelrljoe
committed
ColumnSelectTweaks
1 parent fb5ff84 commit 1027123

File tree

10 files changed

+316
-157
lines changed

10 files changed

+316
-157
lines changed

‎resources/views/includes/toolbar/items/column-select/modern.blade.php‎

Lines changed: 28 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@
33
@php($columnSelectButtonAttributes = $this->getColumnSelectButtonAttributes())
44
@php($columnSelectMenuOptionCheckboxAttributes = $this->getColumnSelectMenuOptionCheckboxAttributes)
55
@php($selectableSelectedColumnCount = $this->getSelectableSelectedColumns()->count())
6+
@php($selectedColCount = count($this->getColumnsForColumnSelect()))
7+
@php($columnSelectItems = $this->generateColumnSelectItems())
68

79
@if ($isTailwind || $isTailwind4)
810
<div @class([
@@ -17,47 +19,53 @@
1719
updatingRoot: false,
1820
previousCols: [],
1921
selectedCols: $wire.entangle('selectedColumns'),
20-
colsForColSelect: {{ $jsoned }},
22+
selectableColumnCount: $wire.entangle('selectableColumnCount'),
2123
timeout: 0,
2224
toggleAll()
2325
{
24-
if(this.selectedCols.length < this.colsForColSelect.length)
25-
{
26-
this.selectedCols = this.colsForColSelect;
27-
}
28-
else
29-
{
30-
this.selectedCols = [];
31-
}
26+
$wire.call('toggleAllColumns');
3227
},
3328
sendUpdate()
3429
{
35-
3630
if(this.selectedCols != this.previousCols)
3731
{
3832
console.log('this selectedCols: '+this.selectedCols);
3933
console.log('this previousCols: '+this.previousCols);
4034
this.previousCols = this.selectedCols;
4135
open = false;
36+
console.log('SelectedCol Length: '+this.selectedCols.length);
4237
$wire.$refresh();
4338
}
4439
},
40+
adjustSelectedStatus(value)
41+
{
42+
console.log('adjustSelectedStatus');
43+
console.log('value');
44+
let array = JSON.parse(JSON.stringify(value))
45+
console.log(array);
46+
47+
},
4548
init()
4649
{
4750
$nextTick(() => {
48-
console.log('selectedCols: '+this.selectedCols.length);
49-
console.log('colsForColSelect: '+this.colsForColSelect.length);
5051
this.previousCols = $wire.get('selectedColumns');
5152
console.log('previousCols: '+this.previousCols);
53+
5254
});
55+
$watch('selectedCols', value => this.adjustSelectedStatus(value));
5356
5457
}
5558
}"
5659
@keydown.window.escape="if (!childElementOpen) { open = false }"
5760
x-on:click.away="if (!childElementOpen) { open = false }"
5861
class="inline-block relative w-full text-left md:w-auto"
5962
wire:key="{{ $dataTableFingerprint }}-column-select-button"
60-
>
63+
> <div>
64+
<div><span>selectedCols.length</span><span x-text="selectedCols.length"></span></div>
65+
<div><span>selectableColumnCount</span><span x-text="selectableColumnCount"></span></div>
66+
67+
68+
</div>
6169
<div>
6270
<span class="rounded-md shadow-sm">
6371
<button
@@ -104,7 +112,7 @@ class="absolute right-0 z-50 mt-2 w-full rounded-md divide-y divide-gray-100 rin
104112
class="inline-flex items-center px-2 py-1 disabled:opacity-50 disabled:cursor-wait"
105113
>
106114
<x-livewire-tables::forms.checkbox
107-
::checked="selectedCols.length == colsForColSelect.length"
115+
::checked="selectedCols.length == selectableColumnCount"
108116
wire:key="{{ $dataTableFingerprint }}-columnSelect-selectAll-checkbox"
109117
wire:target="selectedCols"
110118
wire:loading.attr="disabled"
@@ -115,25 +123,22 @@ class="inline-flex items-center px-2 py-1 disabled:opacity-50 disabled:cursor-wa
115123
</label>
116124
</div>
117125

118-
@foreach ($this->getColumnsForColumnSelect() as $columnSlug => $columnTitle)
126+
@foreach ($columnSelectItems as $index => $columnDetail)
119127
<div
120128
wire:key="{{ $dataTableFingerprint }}-columnSelect-{{ $loop->index }}"
121129
>
122130
<label
123131
wire:loading.attr="disabled"
124-
wire:target="selectedColumns"
132+
wire:target="selectedCols"
125133
class="inline-flex items-center px-2 py-1 disabled:opacity-50 disabled:cursor-wait"
126134
>
127135

128-
<x-livewire-tables::forms.checkbox
129-
wire:key="{{ $dataTableFingerprint . 'selectedItems-'.$columnSlug }}"
136+
<input type='checkbox'
137+
wire:key="{{ $dataTableFingerprint . 'selectedItems-'.$columnDetail['slug'] }}"
130138
x-model='selectedCols'
131-
wire:target="selectedColumns"
132-
wire:loading.attr="disabled"
133-
value="{{ $columnSlug }}"
134-
:checkboxAttributes=$columnSelectMenuOptionCheckboxAttributes
139+
value="{{ $columnDetail['slug'] }}"
135140
/>
136-
<span class="ml-2">{{ $columnTitle }}</span>
141+
<span class="ml-2">{{ $columnDetail['title'] }}</span>
137142
</label>
138143
</div>
139144
@endforeach

‎src/Collections/ColumnCollection.php‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<?php
2+
3+
namespace Rappasoft\LaravelLivewireTables\Collections;
4+
5+
use Illuminate\Support\Collection;
6+
use Rappasoft\LaravelLivewireTables\Features\Columns\Views\Column;
7+
8+
class ColumnCollection extends Collection
9+
{
10+
public function visible() {
11+
return $this->reject(fn (Column $column) => $column->isHidden());
12+
}
13+
14+
public function selectable() {
15+
return $this->reject(fn (Column $column) => !$column->isSelectable());
16+
}
17+
18+
public function unselectable() {
19+
return $this->reject(fn (Column $column) => $column->isSelectable());
20+
}
21+
22+
public function selected() {
23+
return $this->reject(fn (Column $column) => $column->isSelectable() && ! $column->isSelected());
24+
}
25+
26+
public function visibleOnReorder() {
27+
return $this->reject(fn (Column $column) => !$column->isVisibleOnReorder());
28+
}
29+
30+
31+
public function reorder() {
32+
return $this->reject(fn (Column $column) => !$column->isVisibleOnReorder());
33+
}
34+
35+
public function visibleSelectable() {
36+
return $this->visible()->selectable();
37+
}
38+
39+
}

‎src/Features/ColumnSelect/Concerns/HandlesColumnSelectStatus.php‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<?php
2+
3+
namespace Rappasoft\LaravelLivewireTables\Features\ColumnSelect\Concerns;
4+
5+
use Livewire\Attributes\Computed;
6+
use Rappasoft\LaravelLivewireTables\Features\Columns\Views\Column;
7+
8+
trait HandlesColumnSelectStatus
9+
{
10+
11+
/**
12+
* Determines if Column Select should be in use
13+
*
14+
* @var boolean
15+
*/
16+
protected bool $columnSelectStatus = true;
17+
18+
protected function setColumnSelectStatus(bool $status): self
19+
{
20+
$this->columnSelectStatus = $status;
21+
22+
return $this;
23+
}
24+
25+
protected function setColumnSelectEnabled(): self
26+
{
27+
return $this->setColumnSelectStatus(true);
28+
}
29+
30+
protected function setColumnSelectDisabled(): self
31+
{
32+
return $this->setColumnSelectStatus(false);
33+
}
34+
35+
/**
36+
* Undocumented function
37+
*
38+
* @return boolean
39+
*/
40+
public function getColumnSelectStatus(): bool
41+
{
42+
return $this->columnSelectStatus ?? true;
43+
}
44+
45+
/**
46+
* Undocumented function
47+
*
48+
* @return boolean
49+
*/
50+
#[Computed]
51+
public function columnSelectIsEnabled(): bool
52+
{
53+
return $this->getColumnSelectStatus() === true;
54+
}
55+
56+
/**
57+
* Undocumented function
58+
*
59+
* @return boolean
60+
*/
61+
public function columnSelectIsDisabled(): bool
62+
{
63+
return $this->getColumnSelectStatus() === false;
64+
}
65+
66+
}

‎src/Features/ColumnSelect/Concerns/HandlesColumnSelectVisibility.php‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<?php
2+
3+
namespace Rappasoft\LaravelLivewireTables\Features\ColumnSelect\Concerns;
4+
5+
use Livewire\Attributes\Computed;
6+
use Rappasoft\LaravelLivewireTables\Features\Columns\Views\Column;
7+
8+
trait HandlesColumnSelectVisibility
9+
{
10+
/**
11+
* Sets whether Column Select is Hidden on Mobile
12+
*
13+
* @var boolean
14+
*/
15+
protected bool $columnSelectHiddenOnMobile = false;
16+
17+
/**
18+
* Sets whether Column Select is Hidden on Tablet
19+
*
20+
* @var boolean
21+
*/
22+
protected bool $columnSelectHiddenOnTablet = false;
23+
24+
/**
25+
* Undocumented function
26+
*
27+
* @return boolean
28+
*/
29+
public function getColumnSelectIsHiddenOnTablet(): bool
30+
{
31+
return $this->columnSelectHiddenOnTablet;
32+
}
33+
34+
/**
35+
* Undocumented function
36+
*
37+
* @return boolean
38+
*/
39+
public function getColumnSelectIsHiddenOnMobile(): bool
40+
{
41+
return $this->columnSelectHiddenOnMobile;
42+
}
43+
44+
45+
public function setColumnSelectHiddenOnMobile(): self
46+
{
47+
$this->columnSelectHiddenOnMobile = true;
48+
49+
return $this;
50+
}
51+
52+
public function setColumnSelectHiddenOnTablet(): self
53+
{
54+
$this->columnSelectHiddenOnTablet = true;
55+
56+
return $this;
57+
}
58+
59+
}

‎src/Features/ColumnSelect/Configuration/ColumnSelectConfiguration.php‎

Lines changed: 0 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -6,22 +6,6 @@
66

77
trait ColumnSelectConfiguration
88
{
9-
public function setColumnSelectStatus(bool $status): self
10-
{
11-
$this->columnSelectStatus = $status;
12-
13-
return $this;
14-
}
15-
16-
public function setColumnSelectEnabled(): self
17-
{
18-
return $this->setColumnSelectStatus(true);
19-
}
20-
21-
public function setColumnSelectDisabled(): self
22-
{
23-
return $this->setColumnSelectStatus(false);
24-
}
259

2610
public function setRememberColumnSelectionStatus(bool $status): self
2711
{
@@ -57,20 +41,6 @@ public function setExcludeDeselectedColumnsFromQueryDisabled(): self
5741
return $this->setExcludeDeselectedColumnsFromQuery(false);
5842
}
5943

60-
public function setColumnSelectHiddenOnMobile(): self
61-
{
62-
$this->columnSelectHiddenOnMobile = true;
63-
64-
return $this;
65-
}
66-
67-
public function setColumnSelectHiddenOnTablet(): self
68-
{
69-
$this->columnSelectHiddenOnTablet = true;
70-
71-
return $this;
72-
}
73-
7444
/**
7545
* Undocumented function
7646
*

0 commit comments

Comments
 (0)