From 0deb0a7b2c200e40dcb984f818953616d48ff0eb Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Mon, 26 Feb 2024 17:52:08 +0100
Subject: [PATCH] wait #6752 @1.5

---
 config/backpack/base.php                      |   4 +-
 resources/views/columns/owner.blade.php       |  18 +-
 .../backpack/crud/filters/select2.blade.php   | 143 +++++++++++++
 .../crud/filters/select2_ajax.blade.php       | 190 ++++++++++++++++++
 .../crud/filters/select2_multiple.blade.php   | 157 +++++++++++++++
 5 files changed, 503 insertions(+), 9 deletions(-)
 create mode 100644 resources/views/vendor/backpack/crud/filters/select2.blade.php
 create mode 100644 resources/views/vendor/backpack/crud/filters/select2_ajax.blade.php
 create mode 100644 resources/views/vendor/backpack/crud/filters/select2_multiple.blade.php

diff --git a/config/backpack/base.php b/config/backpack/base.php
index 857c2d18a..c0147e204 100644
--- a/config/backpack/base.php
+++ b/config/backpack/base.php
@@ -153,9 +153,9 @@ return [
         'https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.3.0/jquery.form.min.js',
         "https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.9.2/jquery.contextMenu.min.js",
         "https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.9.2/jquery.ui.position.min.js",
-        'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.4/gsap.min.js',
+        'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js',
         'https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js',
-        'https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.7.3/sweetalert2.all.js',
+        'https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.10.5/sweetalert2.all.js',
         'https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js',
 
         // examples (everything inside the bundle, loaded from CDN)
diff --git a/resources/views/columns/owner.blade.php b/resources/views/columns/owner.blade.php
index 38cfdb0d4..ed12176fc 100644
--- a/resources/views/columns/owner.blade.php
+++ b/resources/views/columns/owner.blade.php
@@ -25,11 +25,11 @@
                 confirmButtonText: '{{__('Valider')}}',
                 showCancelButton: true,
                 cancelButtonText: '{{__('Annuler')}}',
-                cancelButtonColor: '#f1ecec',
-                cancelButtonTextColor: '#000000',
+                cancelButtonColor: '#cccccc',
                 focusConfirm: false,
                 didOpen: function () {
                     let select = $(Swal.getHtmlContainer()).find('select');
+                    console.log(select);
                     $(select).select2({
                         theme: 'bootstrap',
                         ajax: {
@@ -42,8 +42,12 @@
                     });
                 },
                 didDestroy: function () {
-                    let select = $(Swal.getHtmlContainer()).find('select');
-                    $(select).select2('destroy');
+                    try {
+                        let select = $(Swal.getHtmlContainer()).find('select');
+                        $(select).select2('destroy');
+                    } catch (e) {
+
+                    }
                 },
             }).then((result) => {
                 if (result.isConfirmed) {
@@ -61,9 +65,9 @@
 <span data-{{$entry->getOption('name')}}-{{$column['name']}}="{{$values}}">
     <div class="owners_list_container" style="display: none;">
         <select
-                style="width: 100%;"
-                name="owners_list"
-                data-ajax="{{$crud->ajaxOwnerList}}"
+            style="width: 100%;"
+            name="owners_list"
+            data-ajax="{{$crud->ajaxOwnerList}}"
         >
             <option value="{{$values}}" selected>{!! $v !!}</option>
         </select>
diff --git a/resources/views/vendor/backpack/crud/filters/select2.blade.php b/resources/views/vendor/backpack/crud/filters/select2.blade.php
new file mode 100644
index 000000000..6de243363
--- /dev/null
+++ b/resources/views/vendor/backpack/crud/filters/select2.blade.php
@@ -0,0 +1,143 @@
+{{-- Select2 Backpack CRUD filter --}}
+<li filter-name="{{ $filter->name }}"
+    filter-type="{{ $filter->type }}"
+    filter-key="{{ $filter->key }}"
+	class="nav-item dropdown {{ Request::get($filter->name)?'active':'' }}">
+    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{ $filter->label }} <span class="caret"></span></a>
+    <div class="dropdown-menu p-0">
+      <div class="form-group backpack-filter mb-0">
+			<select
+				id="filter_{{ $filter->key }}"
+				name="filter_{{ $filter->key }}"
+				class="form-control input-sm select2"
+				placeholder="{{ $filter->placeholder }}"
+				data-filter-key="{{ $filter->key }}"
+				data-filter-type="select2"
+				data-filter-name="{{ $filter->name }}"
+				data-language="{{ str_replace('_', '-', app()->getLocale()) }}"
+				>
+				<option value="">-</option>
+				@if (is_array($filter->values) && count($filter->values))
+					@foreach($filter->values as $key => $value)
+						<option value="{{ $key }}"
+							@if($filter->isActive() && $filter->currentValue == $key)
+								selected
+							@endif
+							>
+							{{ $value }}
+						</option>
+					@endforeach
+				@endif
+			</select>
+		</div>
+    </div>
+  </li>
+
+{{-- ########################################### --}}
+{{-- Extra CSS and JS for this particular filter --}}
+
+{{-- FILTERS EXTRA CSS --}}
+{{-- push things in the after_styles section --}}
+
+@push('crud_list_styles')
+    {{-- include select2 css --}}
+    <link href="{{ asset('packages/select2/dist/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
+    <link href="{{ asset('packages/select2-bootstrap-theme/dist/select2-bootstrap.min.css') }}" rel="stylesheet" type="text/css" />
+    <style>
+	  .form-inline .select2-container {
+	    display: inline-block;
+	  }
+	  .select2-drop-active {
+	  	border:none;
+	  }
+	  .select2-container .select2-choices .select2-search-field input, .select2-container .select2-choice, .select2-container .select2-choices {
+	  	border: none;
+	  }
+	  .select2-container-active .select2-choice {
+	  	border: none;
+	  	box-shadow: none;
+	  }
+	  .select2-container--bootstrap .select2-dropdown {
+	  	margin-top: -2px;
+	  	margin-left: -1px;
+	  }
+	  /*.select2-container--bootstrap {*/
+	  /*	position: relative!important;*/
+	  /*	top: 0px!important;*/
+	  /*}*/
+    </style>
+@endpush
+
+
+{{-- FILTERS EXTRA JS --}}
+{{-- push things in the after_scripts section --}}
+
+@push('crud_list_scripts')
+	{{-- include select2 js --}}
+    <script src="{{ asset('packages/select2/dist/js/select2.full.min.js') }}"></script>
+    @if (app()->getLocale() !== 'en')
+    <script src="{{ asset('packages/select2/dist/js/i18n/' . str_replace('_', '-', app()->getLocale()) . '.js') }}"></script>
+    @endif
+
+    <script>
+        jQuery(document).ready(function($) {
+            // trigger select2 for each untriggered select2 box
+            $('select[data-filter-type=select2]').not('[data-filter-enabled]').each(function () {
+            	var filterName = $(this).attr('data-filter-name');
+                var filterKey = $(this).attr('data-filter-key');
+            	var element = $(this);
+
+            	$(this).attr('data-filter-enabled', 'true');
+
+            	var obj = $(this).select2({
+	            	allowClear: true,
+		            closeOnSelect: false,
+					theme: "bootstrap",
+					dropdownParent: $(this).parent('.form-group'),
+	        	    placeholder: $(this).attr('placeholder'),
+	            }).on('change', function(c) {
+					var value = $(this).val();
+					var parameter = $(this).attr('data-filter-name');
+
+                    if(!value) {
+                       return;
+                    }
+
+                    var new_url = updateDatatablesOnFilterChange(filterName, value, true);
+
+                    // mark this filter as active in the navbar-filters
+                    if (URI(new_url).hasQuery(filterName, true)) {
+                        $("li[filter-key="+filterKey+"]").addClass('active');
+                    }
+				}).on('select2:unselecting', function (e) {
+
+                    updateDatatablesOnFilterChange(filterName, null, true);
+
+                    $('#filter_'+filterKey).val(null)
+                    $("li[filter-key="+filterKey+"]").removeClass("active");
+                    $("li[filter-key="+filterKey+"]").find('.dropdown-menu').removeClass("show");
+
+                    e.stopPropagation();
+                    return true;
+                });
+
+
+				// when the dropdown is opened, autofocus on the select2
+				$("li[filter-key="+filterKey+"]").on('shown.bs.dropdown', function () {
+					setTimeout(() => {
+						$('select[data-filter-key='+filterKey+']').select2('open');
+						element.data('select2').dropdown.$search.get(0).focus();
+					}, 50);
+				});
+
+				// clear filter event (used here and by the Remove all filters button)
+				$("li[filter-key="+filterKey+"]").on('filter:clear', function(e) {
+					$("li[filter-key="+filterKey+"]").removeClass('active');
+	                $('#filter_'+filterKey).val(null).trigger('change');
+				});
+            });
+		});
+	</script>
+@endpush
+{{-- End of Extra CSS and JS --}}
+{{-- ########################################## --}}
diff --git a/resources/views/vendor/backpack/crud/filters/select2_ajax.blade.php b/resources/views/vendor/backpack/crud/filters/select2_ajax.blade.php
new file mode 100644
index 000000000..52e6f0632
--- /dev/null
+++ b/resources/views/vendor/backpack/crud/filters/select2_ajax.blade.php
@@ -0,0 +1,190 @@
+{{-- Select2 Ajax Backpack CRUD filter --}}
+
+@php
+    $filter->options['quiet_time'] = $filter->options['quiet_time'] ?? $filter->options['delay'] ?? 500;
+@endphp
+
+<li filter-name="{{ $filter->name }}"
+    filter-type="{{ $filter->type }}"
+    filter-key="{{ $filter->key }}"
+	class="nav-item dropdown {{ Request::get($filter->name)?'active':'' }}">
+    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{ $filter->label }} <span class="caret"></span></a>
+    <div class="dropdown-menu p-0 ajax-select">
+	    <div class="form-group mb-0">
+            <select
+                id="filter_{{ $filter->key }}"
+                name="filter_{{ $filter->name }}"
+                class="form-control input-sm select2"
+                placeholder="{{ $filter->placeholder }}"
+                data-filter-key="{{ $filter->key }}"
+                data-filter-type="select2_ajax"
+                data-filter-name="{{ $filter->name }}"
+                data-select-key="{{ $filter->options['select_key'] ?? 'id' }}"
+                data-select-attribute="{{ $filter->options['select_attribute'] ?? 'name' }}"
+                data-language="{{ str_replace('_', '-', app()->getLocale()) }}"
+                filter-minimum-input-length="{{ $filter->options['minimum_input_length'] ?? 2 }}"
+                filter-method="{{ $filter->options['method'] ?? 'GET' }}"
+                filter-quiet-time="{{ $filter->options['quiet_time'] }}"
+            >
+				@if (Request::get($filter->name))
+					<option value="{{ Request::get($filter->name) }}" selected="selected"> {{ Request::get($filter->name.'_text') ?? 'Previous selection' }} </option>
+				@endif
+			</select>
+	    </div>
+    </div>
+  </li>
+
+{{-- ########################################### --}}
+{{-- Extra CSS and JS for this particular filter --}}
+
+{{-- FILTERS EXTRA CSS --}}
+{{-- push things in the after_styles section --}}
+
+@push('crud_list_styles')
+    {{-- include select2 css --}}
+    <link href="{{ asset('packages/select2/dist/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
+    <link href="{{ asset('packages/select2-bootstrap-theme/dist/select2-bootstrap.min.css') }}" rel="stylesheet" type="text/css" />
+    <style>
+	  .form-inline .select2-container {
+	    display: inline-block;
+	  }
+	  .select2-drop-active {
+	  	border:none;
+	  }
+	  .select2-container .select2-choices .select2-search-field input, .select2-container .select2-choice, .select2-container .select2-choices {
+	  	border: none;
+	  }
+	  .select2-container-active .select2-choice {
+	  	border: none;
+	  	box-shadow: none;
+	  }
+	  .select2-container--bootstrap .select2-dropdown {
+	  	margin-top: -2px;
+	  	margin-left: -1px;
+	  }
+/*	  .select2-container--bootstrap {
+	  	position: relative!important;
+	  	top: 0px!important;
+	  }*/
+    </style>
+@endpush
+
+
+{{-- FILTERS EXTRA JS --}}
+{{-- push things in the after_scripts section --}}
+
+@push('crud_list_scripts')
+	{{-- include select2 js --}}
+    <script src="{{ asset('packages/select2/dist/js/select2.full.min.js') }}"></script>
+    @if (app()->getLocale() !== 'en')
+    <script src="{{ asset('packages/select2/dist/js/i18n/' . str_replace('_', '-', app()->getLocale()) . '.js') }}"></script>
+    @endif
+
+    <script>
+        jQuery(document).ready(function($) {
+            // trigger select2 for each untriggered select2 box
+            //TODO: Is it really necessary to foreach an ID when it must be UNIQUE ?
+            $('#filter_{{ $filter->key }}').each(function () {
+                var element = $(this);
+
+            	// if the filter has already been initialised, do nothing
+            	if ($(this).attr('data-initialised')) {
+            		return;
+            	} else {
+	            	$(this).attr('data-initialised', 'true');
+            	}
+
+            	var filterName = $(this).attr('data-filter-name');
+                var filterKey = $(this).attr('data-filter-key');
+                var selectAttribute = $(this).attr('data-select-attribute');
+                var selectKey = $(this).attr('data-select-key');
+
+            	$(this).select2({
+				    theme: "bootstrap",
+				    minimumInputLength: $(this).attr('filter-minimum-input-length'),
+	            	allowClear: true,
+	        	    placeholder: $(this).attr('placeholder'),
+					closeOnSelect: false,
+					dropdownParent: $(this).parent('.form-group'),
+				    // tags: [],
+				    ajax: {
+				        url: '{{ $filter->values }}',
+				        dataType: 'json',
+				        type: $(this).attr('filter-method'),
+				        delay: $(this).attr('filter-quiet-time'),
+				        processResults: function (data) {
+                            //if we have data.data here it means we returned a paginated instance from controller.
+                            //otherwise we returned one or more entries unpaginated.
+                            if (data.data) {
+                                return {
+                                    results: $.map(data.data, function (item) {
+                                        return {
+                                            text: item[selectAttribute],
+                                            id: item[selectKey]
+                                        }
+                                    }),
+                                    pagination: {
+                                        more: typeof data.next_page_url !== 'undefined' && data.next_page_url !== null,
+                                    },
+                                };
+                            }
+
+                            //it's non-paginated result
+                            return {
+                                results: $.map(data, function (item, i) {
+                                    return {
+                                        text: item,
+                                        id: i
+                                    }
+                                }),
+                            }
+
+
+				        }
+				    }
+				}).on('change', function (evt) {
+                        var val = $(this).val();
+                        var val_text = $(this).select2('data')[0]?$(this).select2('data')[0].text:null;
+                        var extra_param = filterName + '_text';
+
+                        if (!val_text) {
+                           return;
+                        }
+
+                        updateDatatablesOnFilterChange(filterName, val);
+                        var new_url = updateDatatablesOnFilterChange(extra_param, val_text, true);
+
+                        // mark this filter as active in the navbar-filters
+                        if (URI(new_url).hasQuery(filterName, true)) {
+                            $('li[filter-key='+filterKey+']').removeClass('active').addClass('active');
+                        }
+                    }).on('select2:unselecting', function (e) {
+                        var extra_param = filterName + '_text';
+
+                        updateDatatablesOnFilterChange(filterName, null);
+                        updateDatatablesOnFilterChange(extra_param, null, true);
+
+                        $('#filter_'+filterKey).val(null)
+                        $("li[filter-key="+filterKey+"]").removeClass("active");
+                        $("li[filter-key="+filterKey+"]").find('.dropdown-menu').removeClass("show");
+                    });
+
+                // when the dropdown is opened, autofocus on the select2
+				$("li[filter-key="+filterKey+"]").on('shown.bs.dropdown', function () {
+					setTimeout(() => {
+						$('select[data-filter-key='+filterKey+']').select2('open');
+						element.data('select2').dropdown.$search.get(0).focus();
+					}, 50);
+				});
+
+				// clear filter event (used here and by the Remove all filters button)
+				$('li[filter-key='+filterKey+']').on('filter:clear', function(e) {
+					$('li[filter-key='+filterKey+']').removeClass('active');
+	                $('#filter_'+filterKey).val(null).trigger('change');
+				});
+            });
+        });
+    </script>
+@endpush
+{{-- End of Extra CSS and JS --}}
+{{-- ########################################## --}}
diff --git a/resources/views/vendor/backpack/crud/filters/select2_multiple.blade.php b/resources/views/vendor/backpack/crud/filters/select2_multiple.blade.php
new file mode 100644
index 000000000..07a5079a3
--- /dev/null
+++ b/resources/views/vendor/backpack/crud/filters/select2_multiple.blade.php
@@ -0,0 +1,157 @@
+{{-- Select2 Multiple Backpack CRUD filter --}}
+<li filter-name="{{ $filter->name }}"
+    filter-type="{{ $filter->type }}"
+    filter-key="{{ $filter->key }}"
+	class="nav-item dropdown {{ Request::get($filter->name)?'active':'' }}">
+    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{ $filter->label }} <span class="caret"></span></a>
+    <div class="dropdown-menu p-0">
+      <div class="form-group backpack-filter mb-0">
+			<select
+				id="filter_{{ $filter->key }}"
+				name="filter_{{ $filter->key }}"
+				class="form-control input-sm select2"
+				placeholder="{{ $filter->placeholder }}"
+				data-filter-key="{{ $filter->key }}"
+				data-filter-type="select2_multiple"
+				data-filter-name="{{ $filter->name }}"
+				data-language="{{ str_replace('_', '-', app()->getLocale()) }}"
+				multiple
+				>
+				@if (is_array($filter->values) && count($filter->values))
+					@foreach($filter->values as $key => $value)
+						<option value="{{ $key }}"
+							@if($filter->isActive() && json_decode($filter->currentValue) && array_search($key, json_decode($filter->currentValue)) !== false)
+								selected
+							@endif
+							>
+							{{ $value }}
+						</option>
+					@endforeach
+				@endif
+			</select>
+		</div>
+    </div>
+  </li>
+
+{{-- ########################################### --}}
+{{-- Extra CSS and JS for this particular filter --}}
+
+{{-- FILTERS EXTRA CSS --}}
+{{-- push things in the after_styles section --}}
+
+@push('crud_list_styles')
+    {{-- include select2 css --}}
+    <link href="{{ asset('packages/select2/dist/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
+    <link href="{{ asset('packages/select2-bootstrap-theme/dist/select2-bootstrap.min.css') }}" rel="stylesheet" type="text/css" />
+    <style>
+	  .form-inline .select2-container {
+	    display: inline-block;
+	  }
+	  .select2-drop-active {
+	  	border:none;
+	  }
+	  .select2-container .select2-choices .select2-search-field input, .select2-container .select2-choice, .select2-container .select2-choices {
+	  	border: none;
+	  }
+	  .select2-container-active .select2-choice {
+	  	border: none;
+	  	box-shadow: none;
+	  }
+	  .select2-container--bootstrap .select2-dropdown {
+	  	margin-top: -2px;
+	  	margin-left: -1px;
+	  }
+/*	  .select2-container--bootstrap {
+	  	position: relative!important;
+	  	top: 0px!important;
+	  }*/
+    </style>
+@endpush
+
+
+{{-- FILTERS EXTRA JS --}}
+{{-- push things in the after_scripts section --}}
+
+@push('crud_list_scripts')
+	{{-- include select2 js --}}
+    <script src="{{ asset('packages/select2/dist/js/select2.full.min.js') }}"></script>
+    @if (app()->getLocale() !== 'en')
+    <script src="{{ asset('packages/select2/dist/js/i18n/' . str_replace('_', '-', app()->getLocale()) . '.js') }}"></script>
+    @endif
+
+    <script>
+        jQuery(document).ready(function($) {
+            // trigger select2 for each untriggered select2 box
+            $('select[name=filter_{{ $filter->key }}]').not('[data-filter-enabled]').each(function () {
+            	var filterName = $(this).attr('data-filter-name');
+                var filterKey = $(this).attr('data-filter-key');
+
+                $(this).select2({
+                	allowClear: true,
+					closeOnSelect: false,
+					theme: "bootstrap",
+					dropdownParent: $(this).parent('.form-group'),
+	        	    placeholder: $(this).attr('placeholder'),
+                }).on('change', function() {
+                    var value = '';
+                    if (Array.isArray($(this).val())) {
+                        // clean array from undefined, null, "".
+                        var values = $(this).val().filter(function(e){ return e === 0 || e });
+                        // stringify only if values is not empty. otherwise it will be '[]'.
+                        value = values.length ? JSON.stringify(values) : '';
+                    }
+
+                    if (!value) {
+                        return;
+                    }
+
+                    var new_url = updateDatatablesOnFilterChange(filterName, value, true);
+
+                    // mark this filter as active in the navbar-filters
+                    if (URI(new_url).hasQuery(filterName, true)) {
+                        $("li[filter-key="+filterKey+"]").addClass('active');
+                    }
+
+				}).on('select2:unselecting', function(e) {
+
+                    var unselectingValue = e.params.args.data.id;
+                    let currentElementValue = $(this).val();
+
+                    if(currentElementValue.length) {
+
+                        currentElementValue = currentElementValue.filter(function(v) {
+                            return v !== unselectingValue
+                        });
+
+                        if (!currentElementValue.length) {
+                            updateDatatablesOnFilterChange(filterName, null, true);
+
+                            $("li[filter-key="+filterKey+"]").removeClass("active");
+                            $("li[filter-key="+filterKey+"]").find('.dropdown-menu').removeClass("show");
+                        }
+                    }
+
+                }).on('select2:clear', function(e) {
+                    // when the "x" clear all button is pressed, we update the table
+                    updateDatatablesOnFilterChange(filterName, null, true);
+
+                    $("li[filter-key="+filterKey+"]").removeClass("active");
+					$("li[filter-key="+filterKey+"]").find('.dropdown-menu').removeClass("show");
+                });
+
+				// when the dropdown is opened, autofocus on the select2
+				$("li[filter-key="+filterKey+"]").on('shown.bs.dropdown', function () {
+					$('#filter_'+filterKey+'').select2('open');
+				});
+
+				// clear filter event (used here and by the Remove all filters button)
+				$("li[filter-key="+filterKey+"]").on('filter:clear', function(e) {
+					$("li[filter-key="+filterKey+"]").removeClass('active');
+	                $('#filter_'+filterKey).val(null).trigger('change');
+				});
+            });
+		});
+	</script>
+@endpush
+{{-- End of Extra CSS and JS --}}
+{{-- ########################################## --}}
-- 
2.39.5