Skip to content

Commit

Permalink
minor fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
patrickweh committed Jul 30, 2024
1 parent b95ec04 commit 1e0af50
Show file tree
Hide file tree
Showing 4 changed files with 61 additions and 10 deletions.
23 changes: 23 additions & 0 deletions resources/js/tall-datatables.js
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,29 @@ document.addEventListener('alpine:init', () => {
}
});
},
searchable(data, search = null) {
if (!search) {
return data;
}

// data could be an object or an array, search in both
// if its an object we have to return an object
if (typeof data === 'object') {
let obj = {};
for (const [key, value] of Object.entries(data)) {
if (JSON.stringify(value).toLowerCase().includes(search.toLowerCase())) {
obj[key] = value;
}
}

return obj;
}

// its an array, return all items that include the search string
return data.filter(item => {
return JSON.stringify(item).toLowerCase().includes(search.toLowerCase());
});
},
loadTableConfig() {
$wire.getConfig().then(
result => {
Expand Down
40 changes: 32 additions & 8 deletions resources/views/components/options.blade.php
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="mt-2" x-init.once="columnsSortable($el.querySelector('.table-cols'))">
<div class="mt-2" x-data="{searchRelations: null, searchColumns: null, searchAggregatable: null}" x-init.once="columnsSortable($el.querySelector('.table-cols'))">
@if(auth()->user() && method_exists(auth()->user(), 'datatableUserSettings'))
<x-dialog z-index="z-40" id="save-filter" :title="__('Save filter')">
<x-input required :label="__('Filter name')" x-model="filterName" />
Expand Down Expand Up @@ -496,8 +496,16 @@ class="w-full"
@endif
@if($this->aggregatable)
<div x-cloak x-show="tab === 'summarize'">
<div class="pb-2">
<x-input
type="search"
x-model.debounce.300ms="searchAggregatable"
placeholder="{{ __('Search') }}"
class="w-full"
/>
</div>
<div class="grid grid-cols-1 gap-3">
<template x-for="col in aggregatable">
<template x-for="col in searchable(aggregatable, searchAggregatable)">
<div>
<x-label>
<span x-text="getLabel(col)">
Expand Down Expand Up @@ -573,24 +581,32 @@ class="block text-sm font-medium text-gray-700 dark:text-gray-50"
<div class="text-sm font-medium text-gray-700 dark:text-gray-50">
<div class="flex overflow-x-auto">
<div class="flex gap-1.5 items-center">
<x-button flat primary x-on:click="$wire.$parent.loadSlug()" >
<x-button flat primary x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadSlug()" >
<span class="whitespace-nowrap">{{ __('This table') }}</span>
</x-button>
<x-icon name="chevron-right" class="h-4 w-4"/>
</div>
<template x-for="segment in $wire.$parent.displayPath">
<div class="flex gap-1.5 items-center">
<x-button flat primary x-on:click="$wire.$parent.loadSlug(segment.value)" >
<x-button flat primary x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadSlug(segment.value)" >
<span class="whitespace-nowrap" x-text="segment.label"></span>
</x-button>
<x-icon name="chevron-right" class="h-4 w-4"/>
</div>
</template>
</div>
<hr class="pb-2.5">
<div class="grid grid-cols-2">
<div class="grid grid-cols-2 gap-1.5">
<div>
<template x-for="col in $wire.$parent.selectedCols">
<div class="pb-2">
<x-input
type="search"
x-model.debounce.300ms="searchColumns"
placeholder="{{ __('Search') }}"
class="w-full"
/>
</div>
<template x-for="col in searchable($wire.$parent.selectedCols, searchColumns)">
<div class="flex gap-1.5">
<x-checkbox
x-bind:checked="$wire.$parent.enabledCols.includes(col.attribute)"
Expand All @@ -605,8 +621,16 @@ class="block text-sm font-medium text-gray-700 dark:text-gray-50"
</template>
</div>
<div>
<template x-for="relation in $wire.$parent.selectedRelations">
<div class="flex gap-1.5 cursor-pointer items-center" x-on:click="$wire.$parent.loadRelation(relation.model, relation.name)">
<div class="pb-2">
<x-input
type="search"
x-model.debounce.300ms="searchRelations"
placeholder="{{ __('Search') }}"
class="w-full"
/>
</div>
<template x-for="relation in searchable($wire.$parent.selectedRelations, searchRelations)">
<div class="flex gap-1.5 cursor-pointer items-center" x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadRelation(relation.model, relation.name);">
<span class="overflow-hidden text-ellipsis whitespace-nowrap" x-text="relation.label"></span>
<x-icon name="chevron-right" class="h-4 w-4"/>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/Traits/DataTables/SupportsRelations.php
Original file line number Diff line number Diff line change
Expand Up @@ -365,7 +365,7 @@ protected function getFilterValueList(string $enabledCol, Attribute $attributeIn
return;
}

if ($attributeInfo->type === 'boolean') {
if ($attributeInfo->phpType === 'bool' || $attributeInfo->cast === 'boolean') {
$this->filterValueLists[$enabledCol] = [
[
'value' => 1,
Expand Down
6 changes: 5 additions & 1 deletion tailwind.config.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
module.exports = {
content: ['./js/**/*.js', './resources/views/**/*.blade.php', './src/**/*.php'],
content: [
__dirname + '/js/**/*.js',
__dirname + '/resources/views/**/*.blade.php',
__dirname + '/src/**/*.php'
],
darkMode: 'class',
plugins: [require('@tailwindcss/forms')],
}

0 comments on commit 1e0af50

Please sign in to comment.