Add row group customization (#1189)

* Add row group customization * fix rowGroup state loading * activate rowGroup for all datatables * add reset button * reload page done on success callback * Review Co-authored-by: Bernd Bestel <bernd@berrnd.de>
2025-08-20 04:12:59 +00:00 · 2020-12-16 18:18:03 +01:00
parent d9a3c5169e
commit 07ff28da39
38 changed files with 344 additions and 106 deletions
--- a/views/batteries.blade.php
+++ b/views/batteries.blade.php
@@ -72,7 +72,7 @@
 				<tr>
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#batteries-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/batteriesjournal.blade.php
+++ b/views/batteriesjournal.blade.php
@@ -68,7 +68,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#batteries-journal-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/batteriesoverview.blade.php
+++ b/views/batteriesoverview.blade.php
@@ -90,7 +90,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#batteries-overview-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/chores.blade.php
+++ b/views/chores.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#chores-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/choresjournal.blade.php
+++ b/views/choresjournal.blade.php
@@ -68,7 +68,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#chores-journal-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/choresoverview.blade.php
+++ b/views/choresoverview.blade.php
@@ -112,7 +112,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#chores-overview-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/equipment.blade.php
+++ b/views/equipment.blade.php
@@ -63,7 +63,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#equipment-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/layout/default.blade.php
+++ b/views/layout/default.blade.php
@@ -65,6 +65,8 @@
 		rel="stylesheet">
 	<link href="{{ $U('/node_modules/datatables.net-colreorder-bs4/css/colReorder.bootstrap4.min.css?v=', true) }}{{ $version }}"
 		rel="stylesheet">
+	<link href="{{ $U('/node_modules/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css?v=', true) }}{{ $version }}"
+		rel="stylesheet">
 	<link href="{{ $U('/node_modules/datatables.net-select-bs4/css/select.bootstrap4.min.css?v=', true) }}{{ $version }}"
 		rel="stylesheet">
 	<link href="{{ $U('/node_modules/toastr/build/toastr.min.css?v=', true) }}{{ $version }}"
@@ -684,10 +686,12 @@
 	<script src="{{ $U('/node_modules/datatables.net-bs4/js/dataTables.bootstrap4.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules/datatables.net-colreorder/js/dataTables.colReorder.min.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules/datatables.net-colreorder-bs4/js/colReorder.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
-	<script src="{{ $U('/node_modules/datatables.net-select/js/dataTables.select.min.js?v=', true) }}{{ $version }}"></script>
-	<script src="{{ $U('/node_modules/datatables.net-select-bs4/js/select.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules/datatables.net-plugins/filtering/type-based/accent-neutralise.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules/datatables.net-plugins/sorting/chinese-string.js?v=', true) }}{{ $version }}"></script>
+	<script src="{{ $U('/node_modules/datatables.net-rowgroup/js/dataTables.rowGroup.min.js?v=', true) }}{{ $version }}"></script>
+	<script src="{{ $U('/node_modules/datatables.net-rowgroup-bs4/js/rowGroup.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
+	<script src="{{ $U('/node_modules/datatables.net-select/js/dataTables.select.min.js?v=', true) }}{{ $version }}"></script>
+	<script src="{{ $U('/node_modules/datatables.net-select-bs4/js/select.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules/timeago/jquery.timeago.js?v=', true) }}{{ $version }}"></script>
 	<script src="{{ $U('/node_modules', true) }}/timeago/locales/jquery.timeago.{{ $__t('timeago_locale') }}.js?v={{ $version }}"></script>
 	<script src="{{ $U('/node_modules/toastr/build/toastr.min.js?v=', true) }}{{ $version }}"></script>
@@ -746,4 +750,4 @@
 	@endif
 </body>

-</html>
+</html>
--- a/views/locations.blade.php
+++ b/views/locations.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#locations-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/manageapikeys.blade.php
+++ b/views/manageapikeys.blade.php
@@ -78,7 +78,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#apikeys-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/productform.blade.php
+++ b/views/productform.blade.php
@@ -10,15 +10,11 @@

@push('pageScripts')
 <script src="{{ $U('/node_modules/TagManager/tagmanager.js?v=', true) }}{{ $version }}"></script>
-<script src="{{ $U('/node_modules/datatables.net-rowgroup/js/dataTables.rowGroup.min.js?v=', true) }}{{ $version }}"></script>
-<script src="{{ $U('/node_modules/datatables.net-rowgroup-bs4/js/rowGroup.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
@endpush

@push('pageStyles')
 <link href="{{ $U('/node_modules/TagManager/tagmanager.css?v=', true) }}{{ $version }}"
 	rel="stylesheet">
-<link href="{{ $U('/node_modules/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css?v=', true) }}{{ $version }}"
-	rel="stylesheet">
@endpush

@section('content')
@@ -472,7 +468,7 @@
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#barcode-table"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
@@ -573,14 +569,14 @@
 						<tr>
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#qu-conversions-table-products"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
 							<th>{{ $__t('Quantity unit from') }}</th>
 							<th>{{ $__t('Quantity unit to') }}</th>
 							<th>{{ $__t('Factor') }}</th>
-							<th class="d-none">Hidden group</th>
+							<th>{{ $__t('Group')}}</th>
 							<th></th>
 						</tr>
 					</thead>
--- a/views/productgroups.blade.php
+++ b/views/productgroups.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#productgroups-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/products.blade.php
+++ b/views/products.blade.php
@@ -102,7 +102,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#products-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/quantityunitform.blade.php
+++ b/views/quantityunitform.blade.php
@@ -128,7 +128,7 @@
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#qu-conversions-table"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
--- a/views/quantityunits.blade.php
+++ b/views/quantityunits.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#quantityunits-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/recipeform.blade.php
+++ b/views/recipeform.blade.php
@@ -8,16 +8,6 @@

@section('viewJsName', 'recipeform')

-@push('pageScripts')
-<script src="{{ $U('/node_modules/datatables.net-rowgroup/js/dataTables.rowGroup.min.js?v=', true) }}{{ $version }}"></script>
-<script src="{{ $U('/node_modules/datatables.net-rowgroup-bs4/js/rowGroup.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
-@endpush
-
-@push('pageStyles')
-<link href="{{ $U('/node_modules/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css?v=', true) }}{{ $version }}"
-	rel="stylesheet">
-@endpush
-
@section('content')
 <div class="row">
 	<div class="col">
@@ -149,14 +139,14 @@
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#recipes-pos-table"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
 							<th>{{ $__t('Product') }}</th>
 							<th>{{ $__t('Amount') }}</th>
 							<th class="fit-content">{{ $__t('Note') }}</th>
-							<th class="d-none">Hidden ingredient group</th>
+							<th>{{ $__t('Ingredient group') }}</th>
 						</tr>
 					</thead>
 					<tbody class="d-none">
@@ -252,7 +242,7 @@
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#recipes-includes-table"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
--- a/views/recipes.blade.php
+++ b/views/recipes.blade.php
@@ -102,7 +102,7 @@
 							<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 									data-toggle="tooltip"
 									data-toggle="tooltip"
-									title="{{ $__t('Hide/view columns') }}"
+									title="{{ $__t('Table options') }}"
 									data-table-selector="#recipes-table"
 									href="#"><i class="fas fa-eye"></i></a>
 							</th>
--- a/views/shoppinglist.blade.php
+++ b/views/shoppinglist.blade.php
@@ -5,16 +5,12 @@
@section('viewJsName', 'shoppinglist')

@push('pageScripts')
-<script src="{{ $U('/node_modules/datatables.net-rowgroup/js/dataTables.rowGroup.min.js?v=', true) }}{{ $version }}"></script>
-<script src="{{ $U('/node_modules/datatables.net-rowgroup-bs4/js/rowGroup.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
 <script src="{{ $U('/viewjs/purchase.js?v=', true) }}{{ $version }}"></script>
@endpush

@push('pageStyles')
 <link href="{{ $U('/node_modules/animate.css/animate.min.css?v=', true) }}{{ $version }}"
 	rel="stylesheet">
-<link href="{{ $U('/node_modules/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css?v=', true) }}{{ $version }}"
-	rel="stylesheet">

 <style>
 	tr.dtrg-group {
@@ -178,13 +174,13 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#shoppinglist-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
 					<th>{{ $__t('Product') }} / <em>{{ $__t('Note') }}</em></th>
 					<th>{{ $__t('Amount') }}</th>
-					<th class="d-none">Hidden product group</th>
+					<th>{{ $__t('Product group') }}</th>
 					<th class="d-none">Hidden status</th>

 					@include('components.userfields_thead', array(
@@ -251,7 +247,7 @@
 						@endif
 						<span class="locale-number locale-number-quantity-amount">{{ $listItem->amount }}</span> @if(!empty($listItem->product_id)){{ $__n($listItem->amount, FindObjectInArrayByPropertyValue($quantityunits, 'id', $listItem->qu_id)->name, FindObjectInArrayByPropertyValue($quantityunits, 'id', $listItem->qu_id)->name_plural) }}@endif
 					</td>
-					<td class="d-none">
+					<td>
 						@if(!empty(FindObjectInArrayByPropertyValue($products, 'id', $listItem->product_id)->product_group_id)) {{ FindObjectInArrayByPropertyValue($productGroups, 'id', FindObjectInArrayByPropertyValue($products, 'id', $listItem->product_id)->product_group_id)->name }} @else <span class="font-italic font-weight-light">{{ $__t('Ungrouped') }}</span> @endif
 					</td>
 					<td id="shoppinglistitem-{{ $listItem->id }}-status-info"
--- a/views/shoppinglocations.blade.php
+++ b/views/shoppinglocations.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#shoppinglocations-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/stockentries.blade.php
+++ b/views/stockentries.blade.php
@@ -58,7 +58,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#stockentries-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/stockjournal.blade.php
+++ b/views/stockjournal.blade.php
@@ -121,7 +121,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#stock-journal-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/stockjournalsummary.blade.php
+++ b/views/stockjournalsummary.blade.php
@@ -96,7 +96,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#stock-journal-summary-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/stockoverview.blade.php
+++ b/views/stockoverview.blade.php
@@ -152,7 +152,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#stock-overview-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/taskcategories.blade.php
+++ b/views/taskcategories.blade.php
@@ -73,7 +73,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#taskcategories-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/tasks.blade.php
+++ b/views/tasks.blade.php
@@ -4,16 +4,9 @@
@section('activeNav', 'tasks')
@section('viewJsName', 'tasks')

-@push('pageScripts')
-<script src="{{ $U('/node_modules/datatables.net-rowgroup/js/dataTables.rowGroup.min.js?v=', true) }}{{ $version }}"></script>
-<script src="{{ $U('/node_modules/datatables.net-rowgroup-bs4/js/rowGroup.bootstrap4.min.js?v=', true) }}{{ $version }}"></script>
-@endpush
-
@push('pageStyles')
 <link href="{{ $U('/node_modules/animate.css/animate.min.css?v=', true) }}{{ $version }}"
 	rel="stylesheet">
-<link href="{{ $U('/node_modules/datatables.net-rowgroup-bs4/css/rowGroup.bootstrap4.min.css?v=', true) }}{{ $version }}"
-	rel="stylesheet">
@endpush

@section('content')
@@ -108,13 +101,13 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#tasks-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
 					<th>{{ $__t('Task') }}</th>
 					<th>{{ $__t('Due') }}</th>
-					<th class="d-none">Hidden category</th>
+					<th>{{ $__t('Category') }}</th>
 					<th>{{ $__t('Assigned to') }}</th>
 					<th class="d-none">Hidden status</th>

@@ -176,7 +169,7 @@
 						<time class="timeago timeago-contextual"
 							datetime="{{ $task->due_date }}"></time>
 					</td>
-					<td class="d-none">
+					<td>
 						@if($task->category_id != null) <span>{{ FindObjectInArrayByPropertyValue($taskCategories, 'id', $task->category_id)->name }}</span> @else <span class="font-italic font-weight-light">{{ $__t('Uncategorized') }}</span>@endif
 					</td>
 					<td>
--- a/views/userentities.blade.php
+++ b/views/userentities.blade.php
@@ -69,7 +69,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#userentities-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/userfields.blade.php
+++ b/views/userfields.blade.php
@@ -84,7 +84,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#userfields-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>
--- a/views/users.blade.php
+++ b/views/users.blade.php
@@ -69,7 +69,7 @@
 					<th class="border-right"><a class="text-muted change-table-columns-visibility-button"
 							data-toggle="tooltip"
 							data-toggle="tooltip"
-							title="{{ $__t('Hide/view columns') }}"
+							title="{{ $__t('Table options') }}"
 							data-table-selector="#users-table"
 							href="#"><i class="fas fa-eye"></i></a>
 					</th>