Skip to content

Commit

Permalink
Merge pull request #2117 from LowerRockLabs/SetBulkActionRowButtonAtt…
Browse files Browse the repository at this point in the history 
…ributes

Set bulk action row button attributes
  • Loading branch information
@lrljoe
lrljoe authored Dec 8, 2024
2 parents 51f998a + 5ad3f49 commit da04abd
Show file tree
Hide file tree
Showing 5 changed files with 115 additions and 123 deletions.
206 changes: 83 additions & 123 deletions resources/views/components/table/tr/bulk-actions.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@aware([ 'tableName','isTailwind','isBootstrap'])
@aware([ 'tableName'])

@if ($this->bulkActionsAreEnabled() && $this->hasBulkActions())
@php
Expand All @@ -7,134 +7,94 @@
$simplePagination = $this->isPaginationMethod('simple');
@endphp

@if ($isTailwind)
<x-livewire-tables::table.tr.plain
x-cloak x-show="selectedItems.length > 0 && !currentlyReorderingStatus"
wire:key="{{ $tableName }}-bulk-select-message"
class="bg-indigo-50 dark:bg-gray-900 dark:text-white"
>
<x-livewire-tables::table.td.plain :colspan="$colspan">
<template x-if="selectedItems.length == paginationTotalItemCount || selectAllStatus">
<div wire:key="{{ $tableName }}-all-selected">
<span>
{{ __($this->getLocalisationPath.'You are currently selecting all') }}
@if(!$simplePagination) <strong><span x-text="paginationTotalItemCount"></span></strong> @endif
{{ __($this->getLocalisationPath.'rows') }}.
</span>

<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
class="ml-1 text-blue-600 underline text-gray-700 text-sm leading-5 font-medium focus:outline-none focus:text-gray-800 focus:underline transition duration-150 ease-in-out dark:text-white dark:hover:text-gray-400"
>
{{ __($this->getLocalisationPath.'Deselect All') }}
</button>
</div>
</template>

<template x-if="selectedItems.length !== paginationTotalItemCount && !selectAllStatus">
<div wire:key="{{ $tableName }}-some-selected">
<span>
{{ __($this->getLocalisationPath.'You have selected') }}
<strong><span x-text="selectedItems.length"></span></strong>
{{ __($this->getLocalisationPath.'rows, do you want to select all') }}
@if(!$simplePagination) <strong><span x-text="paginationTotalItemCount"></span></strong> @endif
</span>

<button
x-on:click="selectAllOnPage()"
wire:loading.attr="disabled"
type="button"
class="ml-1 text-blue-600 underline text-gray-700 text-sm leading-5 font-medium focus:outline-none focus:text-gray-800 focus:underline transition duration-150 ease-in-out dark:text-white dark:hover:text-gray-400"
>{{ __($this->getLocalisationPath.'Select All On Page') }}
</button>&nbsp;

<button
x-on:click="setAllSelected()"
wire:loading.attr="disabled"
type="button"
class="ml-1 text-blue-600 underline text-gray-700 text-sm leading-5 font-medium focus:outline-none focus:text-gray-800 focus:underline transition duration-150 ease-in-out dark:text-white dark:hover:text-gray-400"
>
{{ __($this->getLocalisationPath.'Select All') }}
</button>

<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
class="ml-1 text-blue-600 underline text-gray-700 text-sm leading-5 font-medium focus:outline-none focus:text-gray-800 focus:underline transition duration-150 ease-in-out dark:text-white dark:hover:text-gray-400"
>
{{ __($this->getLocalisationPath.'Deselect All') }}
</button>
</div>
</template>
</x-livewire-tables::table.td.plain>
</x-livewire-tables::table.tr.plain>
@elseif ($isBootstrap)
<x-livewire-tables::table.tr.plain
x-cloak x-show="selectedItems.length > 0 && !currentlyReorderingStatus"
wire:key="{{ $tableName }}-bulk-select-message"
>
<x-livewire-tables::table.td.plain :colspan="$colspan">
<template x-if="selectedItems.length == paginationTotalItemCount || selectAllStatus">
<div wire:key="{{ $tableName }}-all-selected">
<span>
<x-livewire-tables::table.tr.plain
x-cloak x-show="selectedItems.length > 0 && !currentlyReorderingStatus"
wire:key="{{ $tableName }}-bulk-select-message"
@class([
'bg-indigo-50 dark:bg-gray-900 dark:text-white' => $this->isTailwind,
])
>
<x-livewire-tables::table.td.plain :colspan="$colspan">
<template x-if="selectedItems.length == paginationTotalItemCount || selectAllStatus">
<div wire:key="{{ $tableName }}-all-selected">
<span>
{{ __($this->getLocalisationPath.'You are currently selecting all') }}
@if(!$simplePagination) <strong><span x-text="paginationTotalItemCount"></span></strong> @endif
{{ __($this->getLocalisationPath.'rows') }}.
{{ __($this->getLocalisationPath.'rows') }}.
</span>

</span>

<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
class="btn btn-primary btn-sm"
>
<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
{{
$this->getBulkActionsRowButtonAttributesBag->class([
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true),
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-colors'] ?? true),
'btn btn-primary btn-sm' => $this->isBootstrap && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true)
])
}}
>
{{ __($this->getLocalisationPath.'Deselect All') }}
</button>
</div>
</template>
</button>
</div>
</template>

<template x-if="selectedItems.length !== paginationTotalItemCount && !selectAllStatus">
<div wire:key="{{ $tableName }}-some-selected">
<span>
{{ __($this->getLocalisationPath.'You have selected') }}
<strong><span x-text="selectedItems.length"></span></strong>
{{ __($this->getLocalisationPath.'rows, do you want to select all') }}
@if(!$simplePagination) <strong><span x-text="paginationTotalItemCount"></span></strong> @endif
</span>

<template x-if="selectedItems.length !== paginationTotalItemCount && !selectAllStatus">
<div wire:key="{{ $tableName }}-some-selected">
<span>
{{ __($this->getLocalisationPath.'You have selected') }}
<strong><span x-text="selectedItems.length"></span></strong>
{{ __($this->getLocalisationPath.'rows, do you want to select all') }}
@if(!$simplePagination) <strong><span x-text="paginationTotalItemCount"></span></strong> @endif
</span>
<button
x-on:click="selectAllOnPage()"
wire:loading.attr="disabled"
type="button"
{{
$this->getBulkActionsRowButtonAttributesBag->class([
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true),
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-colors'] ?? true),
'btn btn-primary btn-sm' => $this->isBootstrap && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true)
])
}}

<button
x-on:click="selectAllOnPage"
wire:loading.attr="disabled"
type="button"
class="btn btn-primary btn-sm"
>
{{ __($this->getLocalisationPath.'Select All On Page') }}
</button>&nbsp;
>{{ __($this->getLocalisationPath.'Select All On Page') }}
</button>&nbsp;

<button
x-on:click="setAllSelected()"
wire:loading.attr="disabled"
type="button"
class="btn btn-primary btn-sm"
>
{{ __($this->getLocalisationPath.'Select All') }}
</button>
<button
x-on:click="setAllSelected()"
wire:loading.attr="disabled"
type="button"
{{
$this->getBulkActionsRowButtonAttributesBag->class([
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true),
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-colors'] ?? true),
'btn btn-primary btn-sm' => $this->isBootstrap && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true)
])
}}
>
{{ __($this->getLocalisationPath.'Select All') }}
</button>

<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
class="btn btn-primary btn-sm"
>
{{ __($this->getLocalisationPath.'Deselect All') }}
</button>
</div>
</template>
</x-livewire-tables::table.td.plain>
</x-livewire-tables::table.tr.plain>
@endif
<button
x-on:click="clearSelected"
wire:loading.attr="disabled"
type="button"
{{
$this->getBulkActionsRowButtonAttributesBag->class([
'ml-1 underline text-sm leading-5 font-medium focus:outline-none focus:underline transition duration-150 ease-in-out' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true),
'text-blue-600 text-gray-700 focus:text-gray-800 dark:text-white dark:hover:text-gray-400' => $this->isTailwind && ($this->getBulkActionsRowButtonAttributes['default-colors'] ?? true),
'btn btn-primary btn-sm' => $this->isBootstrap && ($this->getBulkActionsRowButtonAttributes['default-styling'] ?? true)
])
}}
>
{{ __($this->getLocalisationPath.'Deselect All') }}
</button>
</div>
</template>
</x-livewire-tables::table.td.plain>
</x-livewire-tables::table.tr.plain>
@endif
10 changes: 10 additions & 0 deletions src/Traits/Styling/Configuration/BulkActionStylingConfiguration.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,4 +73,14 @@ public function setBulkActionsThCheckboxAttributes(array $bulkActionsThCheckboxA

return $this;
}

/**
* Used to set attributes for the Bulk Actions Row Buttons
*/
public function setBulkActionsRowButtonAttributes(array $bulkActionsRowButtonAttributes): self
{
$this->setCustomAttributes('bulkActionsRowButtonAttributes', $bulkActionsRowButtonAttributes);

return $this;
}
}
2 changes: 2 additions & 0 deletions src/Traits/Styling/HasBulkActionsStyling.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,4 +25,6 @@ trait HasBulkActionsStyling
protected array $bulkActionsMenuAttributes = ['default-colors' => true, 'default-styling' => true];

protected array $bulkActionsMenuItemAttributes = ['default-colors' => true, 'default-styling' => true];

protected array $bulkActionsRowButtonAttributes = ['default-colors' => true, 'default-styling' => true];
}
19 changes: 19 additions & 0 deletions src/Traits/Styling/Helpers/BulkActionStylingHelpers.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

namespace Rappasoft\LaravelLivewireTables\Traits\Styling\Helpers;

use Illuminate\View\ComponentAttributeBag;
use Livewire\Attributes\Computed;

trait BulkActionStylingHelpers
Expand Down Expand Up @@ -93,4 +94,22 @@ public function getBulkActionsTdCheckboxAttributes(): array
return $this->getCustomAttributes('bulkActionsTdCheckboxAttributes');

}

/**
* Used to get attributes for the Bulk Actions Row Buttons
*
* @return array<mixed>
*/
#[Computed]
public function getBulkActionsRowButtonAttributes(): array
{
return $this->getCustomAttributes('bulkActionsRowButtonAttributes', true);

}

#[Computed]
public function getBulkActionsRowButtonAttributesBag(): ComponentAttributeBag
{
return $this->getCustomAttributesBagFromArray($this->getBulkActionsRowButtonAttributes());
}
}
1 change: 1 addition & 0 deletions tests/Unit/Traits/Configuration/BulkActionsStylingConfigurationTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ public static function providesBulkActionMethodsToTest(): array
'BulkActionsThCheckboxAttributes',
'BulkActionsTdAttributes',
'BulkActionsTdCheckboxAttributes',
'BulkActionsRowButtonAttributes',
];
}

Expand Down

0 comments on commit da04abd

Please sign in to comment.