Merge pull request #117 from Gustavinho/feature/add-bulk-actions

Feature/add bulk actions

Author: Gustavinho

.travis.yml

@@ -26,6 +26,7 @@ branches:
   - dev
   - /^release-.*$/
   - /^release/.*$/
+  - /^feature/.*$/
 
 before_script:
   - composer config discard-changes true

README.md

@@ -179,7 +179,8 @@ Here's the plan for what's coming:
 ## Upgrade guide
 ### From 2.2 to 2.3
 - Clear your cached views `php artisan view:clear` since some of the internal components changed.
-- Update components
+- Update components.
+- Update config-file.
 - Update the renderIf() function in your action classes as follows:
   ```php
   <?php

doc/grid-view.md

@@ -99,11 +99,14 @@ Name|Description|Type|Value
 model|Model instance for this card|||
 actions|Actions defined in this view class|Array
 hasDefaultAction|Checks if the Grid View has defined a `onCardClick` method|Boolean|true,false
+selected|Defines if the item was selected when the grid view has bulk actions|Boolean|true,false
 
-With all this data you can build your own card component as you need, remember to include the `actions` component.
+With all this data you can build your own card component as you need, remember to include an `actions` component.
 
 ```html
 <x-lv-actions :actions="$actions" :model="$model" />
+<!-- Or -->
+<x-lv-actions.drop-down :actions="$actions" :model="$model" />
 ```
 
 

doc/table-view.md

@@ -21,6 +21,7 @@ This view creates a dynamic data table with some features like filters, paginati
     - [Changing title](#changing-title)
 - [Actions](#actions)
     - [Registering actions](#registering-actions)
+    - [Bulk actions](#bulk-actions)
     - [Redirect action](#redirect-action)
     - [Showing feedback messages](#showing-feedback-messages)
     - [Hiding actions](#hiding-actions)
@@ -317,6 +318,23 @@ protected function actionsByRow()
 }
 ```
 
+## Bulk actions
+You can execute bulk actions selecting items on the UI defining a `bulkActions` method with all the actions you want to use. If you define this method, a checkbox input will be displayed for each item to select or unselect it.
+
+```php
+protected function bulkActions()
+{
+    return [
+        new ActivateUsersAction,
+    ];
+}
+```
+You can creat a bulk action by an artisan command just using the `--bulk` option.
+
+```bash
+php artisan make:action Actions/ActivateUserAction --bulk
+```
+
 ## Redirect action
 This package has a defined action to redirect the user to a named route related to your model inside your project when the button is clicked, you can use it directly on the `actionsByRow` method
 
@@ -395,7 +413,7 @@ public function getConfirmationMessage($item = null)
 ```
 
 # Showing UI components
-You can display some UI components instead of plain text like avateres, badges or icons, some of these components has different variants, you can customize these varians with the `laravel-views.php` config file.
+You can display some UI components instead of plain text like avatars, badges or icons, some of these components has different variants, you can customize these varians with the `laravel-views.php` config file.
 
 ## Avatar
 Shows an 32x32 rounded image

resources/views/components/actions/drop-down.blade.php

@@ -0,0 +1,8 @@
+@props(['actions' => [], 'model' => null])
+
+<x-lv-drop-down>
+  <x-slot name="trigger">
+    <x-lv-icon-button icon="more-horizontal" size="sm"/>
+  </x-slot>
+  <x-lv-actions.icon-and-title :actions="$actions" :model="$model" />
+</x-lv-drop-down>

resources/views/components/actions/icon-and-title.blade.php

@@ -1,10 +1,14 @@
-@props(['actions', 'model'])
+@props(['actions', 'model' => null])
 
 @foreach ($actions as $action)
   @if ($action->renderIf($model, $this))
-    <a href="#!" wire:click.prevent="executeAction('{{ $action->id }}', '{{ $model->getKey() }}', true)" title="{{ $action->title}}" class="group flex items-center px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-gray-900">
+    <button
+      wire:click.prevent="{{ $model ? "executeAction('{$action->id}','{$model->getKey()}')" : "executeBulkAction('{$action->id}')" }}"
+      title="{{ $action->title}}"
+      class="group flex items-center px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-gray-900 w-full focus:outline-none"
+    >
       <i data-feather="{{ $action->icon }}" class="mr-3 h-4 w-4 text-gray-600 group-hover:text-gray-700"></i>
       {{ $action->title }}
-    </a>
+    </button>
   @endif
 @endforeach

resources/views/components/actions/icon.blade.php

@@ -2,6 +2,6 @@
 
 @foreach ($actions as $action)
   @if ($action->renderIf($model, $this))
-    <x-lv-icon-button :icon="$action->icon" size="sm" wire:click.prevent="executeAction('{{ $action->id }}', '{{ $model->getKey() }}', true)" />
+    <x-lv-icon-button :icon="$action->icon" size="sm" wire:click.prevent="executeAction('{{ $action->id }}', '{{ $model->getKey() }}')" />
   @endif
 @endforeach

…ews/components/actions/actions.blade.php …/components/actions/responsive.blade.phpresources/views/components/actions/actions.blade.php renamed to resources/views/components/actions/responsive.blade.php resources/views/components/actions/actions.blade.php renamed to resources/views/components/actions/responsive.blade.php

@@ -1,16 +1,10 @@
-@props(['actions', 'model'])
+@props(['actions' => [], 'model' => null])
 
 <div>
   @if (count($actions))
     {{-- Mobile actions dropdown --}}
     <div class="lg:hidden text-right relative">
-      <x-lv-drop-down>
-        <x-slot name="trigger">
-          <x-lv-icon-button icon="more-horizontal" size="sm" />
-        </x-slot>
-
-        <x-lv-actions.icon-and-title :actions="$actions" :model="$model" />
-      </x-lv-drop-down>
+      <x-lv-actions.drop-down :actions="$actions" :model="$model" />
     </div>
 
     {{-- Desktop action buttons --}}

resources/views/components/buttons/button.blade.php

@@ -0,0 +1,5 @@
+@props(['variant' => 'primary', 'type' => 'button'])
+
+<button {{ $attributes }} type="{{ $type }}" class="px-4 py-2 text-sm border border-transparent font-medium rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 {{ variants('buttons.' . $variant) }}">
+  {{ $slot }}
+</button>

resources/views/components/buttons/select.blade.php

@@ -14,5 +14,7 @@
   class="border border-transparent hover:border-gray-300 focus:border-gray-300 focus:outline-none flex items-center gap-1 text-xs px-3 py-2 rounded hover:shadow-sm font-medium"
 >
   {{ $slot }}
-  <i data-feather="{{ $icon }}" class="w-4 h-4"></i>
+  @if ($icon)
+    <i data-feather="{{ $icon }}" class="w-4 h-4"></i>
+  @endif
 </button>