Merge branch 'feature/column-select' into develop

rappasoft · rappasoft · commit 7c9d80bfdf39 · 2021-06-17T17:14:58.000-04:00
diff --git a/resources/lang/en.json b/resources/lang/en.json
@@ -4,6 +4,7 @@
     "Applied Sorting": "Applied Sorting",
     "Bulk Actions": "Bulk Actions",
     "Clear": "Clear",
+    "Columns": "Columns",
     "Filters": "Filters",
     "Remove filter option": "Remove filter option",
     "Remove sort option": "Remove sort option",
diff --git a/resources/views/bootstrap-4/components/table/row-columns.blade.php b/resources/views/bootstrap-4/components/table/row-columns.blade.php
@@ -1,5 +1,7 @@
 @foreach($columns as $column)
     @if ($column->isVisible())
+        @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
         <x-livewire-tables::bs4.table.cell
             :class="method_exists($this, 'setTableDataClass') ? $this->setTableDataClass($column, $row) : ''"
             :id="method_exists($this, 'setTableDataId') ? $this->setTableDataId($column, $row) : ''"
diff --git a/resources/views/bootstrap-4/datatable.blade.php b/resources/views/bootstrap-4/datatable.blade.php
@@ -30,6 +30,7 @@ class="container-fluid p-0"
 
             <div class="d-md-flex">
                 @include('livewire-tables::bootstrap-4.includes.bulk-actions')
+                @include('livewire-tables::bootstrap-4.includes.column-select')
                 @include('livewire-tables::bootstrap-4.includes.per-page')
             </div>
         </div>
diff --git a/resources/views/bootstrap-4/includes/column-select.blade.php b/resources/views/bootstrap-4/includes/column-select.blade.php
@@ -0,0 +1,20 @@
+@if ($columnSelect)
+    <div class="dropdown mb-3 mb-md-0 pl-0 pl-md-3 d-block d-md-inline">
+        <button class="btn dropdown-toggle d-block w-100 d-md-inline" type="button" id="columnSelect" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+            @lang('Columns')
+        </button>
+
+        <div class="dropdown-menu dropdown-menu-right w-100" aria-labelledby="columnSelect">
+            @foreach($columns as $column)
+                @if ($column->isVisible() && $column->isSelectable())
+                    <div>
+                        <label class="px-2 {{ $loop->last ? 'mb-0' : 'mb-1' }}">
+                            <input wire:model="columnSelectEnabled" type="checkbox" value="{{ $column->column() }}">
+                            <span class="ml-2">{{ $column->text() }}</span>
+                        </label>
+                    </div>
+                @endif
+            @endforeach
+        </div>
+    </div>
+@endif
diff --git a/resources/views/bootstrap-4/includes/table.blade.php b/resources/views/bootstrap-4/includes/table.blade.php
@@ -11,6 +11,8 @@
 
         @foreach($columns as $column)
             @if ($column->isVisible())
+                @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
                 @if ($column->isBlank())
                     <x-livewire-tables::bs4.table.heading />
                 @else
diff --git a/resources/views/bootstrap-5/components/table/row-columns.blade.php b/resources/views/bootstrap-5/components/table/row-columns.blade.php
@@ -1,5 +1,7 @@
 @foreach($columns as $column)
     @if ($column->isVisible())
+        @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
         <x-livewire-tables::bs5.table.cell
             :class="method_exists($this, 'setTableDataClass') ? $this->setTableDataClass($column, $row) : ''"
             :id="method_exists($this, 'setTableDataId') ? $this->setTableDataId($column, $row) : ''"
diff --git a/resources/views/bootstrap-5/datatable.blade.php b/resources/views/bootstrap-5/datatable.blade.php
@@ -30,6 +30,7 @@ class="container-fluid p-0"
 
             <div class="d-md-flex">
                 @include('livewire-tables::bootstrap-5.includes.bulk-actions')
+                @include('livewire-tables::bootstrap-5.includes.column-select')
                 @include('livewire-tables::bootstrap-5.includes.per-page')
             </div>
         </div>
diff --git a/resources/views/bootstrap-5/includes/column-select.blade.php b/resources/views/bootstrap-5/includes/column-select.blade.php
@@ -0,0 +1,20 @@
+@if ($columnSelect)
+    <div class="dropdown mb-3 mb-md-0 md-0 ms-md-3 d-block d-md-inline">
+        <button class="btn dropdown-toggle d-block w-100 d-md-inline" type="button" id="columnSelect" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+            @lang('Columns')
+        </button>
+
+        <div class="dropdown-menu dropdown-menu-end w-100" aria-labelledby="columnSelect">
+            @foreach($columns as $column)
+                @if ($column->isVisible() && $column->isSelectable())
+                    <div>
+                        <label class="px-2 {{ $loop->last ? 'mb-0' : 'mb-1' }}">
+                            <input wire:model="columnSelectEnabled" type="checkbox" value="{{ $column->column() }}">
+                            <span class="ml-2">{{ $column->text() }}</span>
+                        </label>
+                    </div>
+                @endif
+            @endforeach
+        </div>
+    </div>
+@endif
diff --git a/resources/views/bootstrap-5/includes/table.blade.php b/resources/views/bootstrap-5/includes/table.blade.php
@@ -12,6 +12,8 @@ class="form-check-input"
 
         @foreach($columns as $column)
             @if ($column->isVisible())
+                @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
                 @if ($column->isBlank())
                     <x-livewire-tables::bs5.table.heading />
                 @else
diff --git a/resources/views/tailwind/components/table/row-columns.blade.php b/resources/views/tailwind/components/table/row-columns.blade.php
@@ -1,5 +1,7 @@
 @foreach($columns as $column)
     @if ($column->isVisible())
+        @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
         <x-livewire-tables::table.cell
             :class="method_exists($this, 'setTableDataClass') ? $this->setTableDataClass($column, $row) : ''"
             :id="method_exists($this, 'setTableDataId') ? $this->setTableDataId($column, $row) : ''"
diff --git a/resources/views/tailwind/datatable.blade.php b/resources/views/tailwind/datatable.blade.php
@@ -27,6 +27,7 @@
 
                     <div class="md:space-x-2 md:flex md:items-center">
                         @include('livewire-tables::tailwind.includes.bulk-actions')
+                        @include('livewire-tables::tailwind.includes.column-select')
                         @include('livewire-tables::tailwind.includes.per-page')
                     </div>
                 </div>
diff --git a/resources/views/tailwind/includes/column-select.blade.php b/resources/views/tailwind/includes/column-select.blade.php
@@ -0,0 +1,57 @@
+@if ($columnSelect)
+    <div class="w-full md:w-auto mb-4 md:mb-0">
+        <div
+            x-data="{ open: false }"
+            @keydown.window.escape="open = false"
+            @click.away="open = false"
+            class="relative inline-block text-left z-10 w-full md:w-auto"
+        >
+            <div>
+                <span class="rounded-md shadow-sm">
+                    <button
+                        @click="open = !open"
+                        type="button"
+                        class="inline-flex justify-center w-full rounded-md border border-gray-300 px-4 py-2 bg-white text-sm leading-5 font-medium text-gray-700 hover:text-gray-500 focus:outline-none focus:border-indigo-300 focus:shadow-outline-indigo active:bg-gray-50 active:text-gray-800 transition ease-in-out duration-150"
+                        id="column-select-menu"
+                        aria-haspopup="true"
+                        x-bind:aria-expanded="open"
+                        aria-expanded="true"
+                    >
+                        @lang('Columns')
+
+                        <svg class="-mr-1 ml-2 h-5 w-5" x-description="Heroicon name: chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+                            <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
+                        </svg>
+                    </button>
+                </span>
+            </div>
+
+            <div
+                x-cloak
+                x-show="open"
+                x-transition:enter="transition ease-out duration-100"
+                x-transition:enter-start="transform opacity-0 scale-95"
+                x-transition:enter-end="transform opacity-100 scale-100"
+                x-transition:leave="transition ease-in duration-75"
+                x-transition:leave-start="transform opacity-100 scale-100"
+                x-transition:leave-end="transform opacity-0 scale-95"
+                class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg z-50"
+            >
+                <div class="rounded-md bg-white shadow-xs">
+                    <div class="p-2" role="menu" aria-orientation="vertical" aria-labelledby="column-select-menu">
+                        @foreach($columns as $column)
+                            @if ($column->isVisible() && $column->isSelectable())
+                                <div>
+                                    <label class="px-2 py-1 inline-flex items-center">
+                                        <input wire:model="columnSelectEnabled" type="checkbox" value="{{ $column->column() }}">
+                                        <span class="ml-2">{{ $column->text() }}</span>
+                                    </label>
+                                </div>
+                            @endif
+                        @endforeach
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+@endif
diff --git a/resources/views/tailwind/includes/table.blade.php b/resources/views/tailwind/includes/table.blade.php
@@ -14,6 +14,8 @@ class="rounded-md shadow-sm border-gray-300 block transition duration-150 ease-i
 
         @foreach($columns as $column)
             @if ($column->isVisible())
+                @continue($columnSelect && ! $this->isColumnSelectEnabled($column))
+
                 @if ($column->isBlank())
                     <x-livewire-tables::table.heading />
                 @else
diff --git a/src/DataTableComponent.php b/src/DataTableComponent.php
@@ -8,6 +8,7 @@
 use Illuminate\Support\Collection;
 use Livewire\Component;
 use Rappasoft\LaravelLivewireTables\Traits\WithBulkActions;
+use Rappasoft\LaravelLivewireTables\Traits\WithColumnSelect;
 use Rappasoft\LaravelLivewireTables\Traits\WithCustomPagination;
 use Rappasoft\LaravelLivewireTables\Traits\WithFilters;
 use Rappasoft\LaravelLivewireTables\Traits\WithPerPagePagination;
@@ -22,6 +23,7 @@
 abstract class DataTableComponent extends Component
 {
     use WithBulkActions;
+    use WithColumnSelect;
     use WithCustomPagination;
     use WithFilters;
     use WithPerPagePagination;
diff --git a/src/Traits/WithColumnSelect.php b/src/Traits/WithColumnSelect.php
@@ -0,0 +1,50 @@
+<?php
+
+namespace Rappasoft\LaravelLivewireTables\Traits;
+
+use Rappasoft\LaravelLivewireTables\Views\Column;
+
+/**
+ * Trait WithColumnSelect.
+ */
+trait WithColumnSelect
+{
+    public bool $columnSelect = false;
+    public array $columnSelectEnabled = [];
+
+    public function mountWithColumnSelect(): void
+    {
+        // If the column select is off, make sure to clear the session
+        if (! $this->columnSelect && session()->has($this->tableName.'-columnSelectEnabled')) {
+            session()->forget($this->tableName.'-columnSelectEnabled');
+        }
+
+        // Get a list of visible default columns that are not excluded
+        $columns = collect($this->columns())
+            ->filter(fn ($column) => $column->isVisible() && $column->isSelectable())
+            ->map(fn ($column) => $column->column())
+            ->values()
+            ->toArray();
+
+        // Set to either the default set or what is stored in the session
+        $this->columnSelectEnabled = session()->get($this->tableName.'-columnSelectEnabled', $columns);
+
+        // Check to see if there are any excluded that are already stored in the enabled and remove them
+        foreach ($this->columns() as $column) {
+            if (! $column->isSelectable() && ! in_array($column->column(), $this->columnSelectEnabled, true)) {
+                $this->columnSelectEnabled[] = $column->column();
+                session([$this->tableName.'-columnSelectEnabled' => $this->columnSelectEnabled]);
+            }
+        }
+    }
+
+    public function updatedColumnSelectEnabled(): void
+    {
+        session([$this->tableName.'-columnSelectEnabled' => $this->columnSelectEnabled]);
+    }
+
+    public function isColumnSelectEnabled($column): bool
+    {
+        return in_array($column instanceof Column ? $column->column() : $column, $this->columnSelectEnabled, true);
+    }
+}
diff --git a/src/Views/Column.php b/src/Views/Column.php
@@ -64,6 +64,11 @@ class Column
      */
     public bool $hidden = false;
 
+    /**
+     * @var bool
+     */
+    public bool $selectable = true;
+
     /**
      * Column constructor.
      *
@@ -287,4 +292,22 @@ public function isVisible(): bool
     {
         return $this->hidden !== true;
     }
+
+    /**
+     * @return $this
+     */
+    public function excludeFromSelectable(): self
+    {
+        $this->selectable = false;
+
+        return $this;
+    }
+
+    /**
+     * @return bool
+     */
+    public function isSelectable(): bool
+    {
+        return $this->selectable === true;
+    }
 }
