[master] - table filters

resources/views/partials/filterElement.blade.php

@@ -0,0 +1,84 @@
+<div class="dropdown-menu" style="width: 170px;" aria-labelledby="{{$id}}">
+    <div class="px-1">
+        <form class="dropdown-filter_{{$id}}">
+            @if($type === 'filters')
+                @include('partials.select', [
+                'name' => 'filters[' . $id . ']',
+                'title' => false,
+                'options' => $data['values'],
+                'value' => request()->filters[$id] ?? '',
+                'right' => true,
+                ])
+            @elseif($type === 'ranges')
+                @include('partials.input', [
+                    'name' => 'filters[' . $id . '_from]',
+                    'type' => 'range',
+                    'title' => 'с:',
+                    'min' => $data['min'],
+                    'max' => $data['max'],
+                    'value' => request()->filters[$id . '_from'] ?? '', // $range['min']
+                ])
+                @include('partials.input', [
+                        'name' => 'filters[' . $id . '_to]',
+                        'type' => 'range',
+                        'title' => 'по:',
+                        'min' => $data['min'],
+                        'max' => $data['max'],
+                        'value' => request()->filters[$id . '_to'] ?? '', // $range['max']
+                    ])
+            @elseif($type === 'dates')
+                @include('partials.input', [
+                        'name' => 'filters[' . $id . '_from]',
+                        'type' => 'date',
+                        'title' => 'с:',
+                        'min' => $data['min'],
+                        'max' => $data['max'],
+                        'right' => true,
+                        'value' => request()->filters[$id . '_from'] ?? '',
+                     ])
+                @include('partials.input', [
+                        'name' => 'filters[' . $id . '_to]',
+                        'type' => 'date',
+                        'title' => 'по:',
+                        'min' => $data['min'],
+                        'max' => $data['max'],
+                        'right' => true,
+                        'value' => request()->filters[$id . '_to'] ?? '',
+                    ])
+            @endif
+        </form>
+        <div class="modal-footer d-flex justify-content-between">
+            <button type="button" class="btn btn-primary accept-filter_{{$id}} btn-sm">Применить</button>
+            <button type="button" class="btn btn-outline-secondary reset-filters_{{$id}} btn-sm">Сбросить</button>
+        </div>
+    </div>
+</div>
+
+@push('scripts')
+    <script type="module">
+        $('.accept-filter_{{$id}}').on('click', function () {
+            let filters = $('.dropdown-filter_{{$id}}').serializeArray();
+            let currentUrl = new URL(document.location.href);
+            $.each(filters, function (id, filter) {
+                if (filter.value !== '') {
+                    currentUrl.searchParams.set(filter.name, filter.value);
+                } else {
+                    currentUrl.searchParams.delete(filter.name);
+                }
+            });
+            currentUrl.searchParams.delete('page');
+            document.location.href = currentUrl.href;
+        });
+
+        $('.reset-filters_{{$id}}').on('click', function () {
+            let filters = $('.dropdown-filter_{{$id}}').serializeArray();
+            let currentUrl = new URL(document.location.href);
+            $.each(filters, function (id, filter) {
+                currentUrl.searchParams.delete(filter.name);
+            });
+            currentUrl.searchParams.delete('page');
+            document.location.href = currentUrl.href;
+        });
+
+    </script>
+@endpush

resources/views/partials/input.blade.php

@@ -1,20 +1,23 @@
 <div class="row mb-2">
     <label for="{{ $name }}" class="col-form-label @if(!($right ?? null)) col-md-4 text-md-end @endif">
         {{ $title ?? '' }}
-        @isset($required) <sup>*</sup> @endisset
+        @isset($required)
+            <sup>*</sup>
+        @endisset
     </label>
     <div class="@if(!($right ?? null)) col-md-8 @endif">
         <div class="input-group">
-        <input type="{{ $type ?? 'text' }}" name="{{ $name }}" id="{{ $name }}"
-               class="form-control @error($name) is-invalid @enderror" @disabled($disabled ?? null) @required($required ?? null)
-                @isset($min) min="{{ $min }}" @endisset
-                @isset($max) max="{{ $max }}" @endisset
-                @isset($style) style="{{ $style }}" @endisset
-                @isset($pattern) pattern="{{ $pattern }}" @endisset
-                placeholder="{{ $placeholder ?? ''}}"
-                @isset($multiple) multiple="multiple" @endisset
-                @isset($datalist) list="dl-{{ $name }}" @endisset
-               value="{{ old($name, $value ?? '') }}" autocomplete="off">
+            <input type="{{ $type ?? 'text' }}" name="{{ $name }}" id="{{ $name }}"
+                   class="@if(($type ?? 'text') === 'range') form-range @else form-control @endif  @error($name) is-invalid @enderror "
+                   @disabled($disabled ?? null) @required($required ?? null)
+                   @isset($min) min="{{ $min }}" @endisset
+                   @isset($max) max="{{ $max }}" @endisset
+                   @isset($style) style="{{ $style }}" @endisset
+                   @isset($pattern) pattern="{{ $pattern }}" @endisset
+                   placeholder="{{ $placeholder ?? ''}}"
+                   @isset($multiple) multiple="multiple" @endisset
+                   @isset($datalist) list="dl-{{ $name }}" @endisset
+                   value="{{ old($name, $value ?? '') }}" autocomplete="off">
             @isset($datalist)
                 <datalist id="dl-{{ $name }}">
                     @foreach($datalist as $s)
@@ -24,11 +27,25 @@
             @endisset
 
             @isset($button)
-                <button class="btn btn-outline-info" type="button" id="{{ $button }}">{{ $buttonText ?? 'Имя' }}</button>
+                <button class="btn btn-outline-info" type="button"
+                        id="{{ $button }}">{{ $buttonText ?? 'Имя' }}</button>
             @endisset
         </div>
+        @if(($type ?? 'text') === 'range')
+            <label for="{{$name}}" class="form-label fs-6 text-center w-100"><span
+                        id="rangeValue_{{$name}}">{{$value ?? ''}}</span></label>
+        @endif
         @error($name)
         <div class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></div>
         @enderror
     </div>
 </div>
+
+@push('scripts')
+    <script type="module">
+        console.log($('#rangeValue_{{ $name }}'))
+        $('[id="{{ $name }}"]').on('input', function () {
+            $('[id="rangeValue_{{ $name }}"]').text($(this).val());
+        });
+    </script>
+@endpush

resources/views/partials/select.blade.php

@@ -1,8 +1,12 @@
 <div class="row mb-{{ ($mb ?? 2) }}">
-    <label for="{{ $name }}" class="col-form-label @if(!($right ?? null)) col-md-4 text-md-end @endif mt-1">
-        {{ $title }}
-        @isset($required) <sup>*</sup> @endisset
-    </label>
+    @if(!empty($title))
+        <label for="{{ $name }}" class="col-form-label @if(!($right ?? null)) col-md-4 text-md-end @endif mt-1">
+            {{ $title }}
+            @isset($required)
+                <sup>*</sup>
+            @endisset
+        </label>
+    @endif
     <div class="@if(!($right ?? null)) col-md-8 @endif">
         <select name="{{ $name }}"
                 id="{{ $name }}"

resources/views/partials/table.blade.php

@@ -36,20 +36,36 @@
                                 @endif
                             @endif
                         </div>
-                        <div class="text-end cursor-pointer">
-                            <i data-bs-toggle="modal"
-                               data-bs-target="#table_{{ $id }}_modal_filters"
-                                    class="bi
-                            @if(isset(request()->filters[$headerName]) ||
-                                isset(request()->filters[str_replace('_txt', '', $headerName) . '_from']) ||
-                                isset(request()->filters[str_replace('_txt', '', $headerName) . '_to'])
-                                )
-                                bi-funnel-fill text-danger
-                                @else
-                                bi-funnel
-                            @endif
-                            "></i>
-                        </div>
+                        @if(isset((array_merge($filters, $ranges, $dates))[$headerName]))
+                            <div class="text-end cursor-pointer dropdown">
+                                <i
+                                        data-bs-toggle="dropdown"
+                                        class="dropdown-toggle bi
+                                @if(isset(request()->filters[$headerName]) ||
+                                    isset(request()->filters[str_replace('_txt', '', $headerName) . '_from']) ||
+                                    isset(request()->filters[str_replace('_txt', '', $headerName) . '_to'])
+                                    )
+                                    bi-funnel-fill text-danger
+                                    @else
+                                    bi-funnel
+                                @endif
+                                " id="{{$headerName}}"></i>
+                                @php
+                                    $mergedData = array_merge($filters, $ranges, $dates);
+                                    $type = null;
+                                    $data = (array_merge($filters, $ranges, $dates))[$headerName] ?? null;
+
+                                    if (isset($filters[$headerName])) {
+                                        $type = 'filters';
+                                    } elseif (isset($ranges[$headerName])) {
+                                        $type = 'ranges';
+                                    } elseif (isset($dates[$headerName])) {
+                                        $type = 'dates';
+                                    }
+                                @endphp
+                                @include('partials.filterElement', ['id' => $headerName, 'data' => $data, 'type' => $type])
+                            </div>
+                        @endif
                     </div>
 
                 </th>
@@ -69,17 +85,18 @@
                             @endphp
                             @if(isset($string->$rel->$field))
                                 @if(str_ends_with($field, '_id'))
-                                @php
-                                    $relation = \Illuminate\Support\Str::camel(str_replace('_id', '', $field));
-                                @endphp
+                                    @php
+                                        $relation = \Illuminate\Support\Str::camel(str_replace('_id', '', $field));
+                                    @endphp
                                     {!! $string->$rel->$relation?->name; !!}
                                 @else
                                     @if(str_contains($field, 'image') && $string->$rel->$field)
-                                    <a href="{{ $string->$rel->$field }}" data-toggle="lightbox" data-gallery="photos" data-size="fullscreen">
-                                        <img src="{{ $string->$rel->$field }}" alt="" class="img-thumbnail maf-img">
-                                    </a>
+                                        <a href="{{ $string->$rel->$field }}" data-toggle="lightbox"
+                                           data-gallery="photos" data-size="fullscreen">
+                                            <img src="{{ $string->$rel->$field }}" alt="" class="img-thumbnail maf-img">
+                                        </a>
                                     @else
-                                    {!! $string->$rel->$field !!}
+                                        {!! $string->$rel->$field !!}
                                     @endif
                                 @endif
                             @else
@@ -97,14 +114,15 @@
                                 $relation = \Illuminate\Support\Str::camel(str_replace('_id', '', $headerName));
                             @endphp
                             @if($headerName == 'order_status_id')
-                                <div class="badge fs-5 text-bg-{{ App\Models\Order::STATUS_COLOR[$string->order_status_id] }}" >{{ $string->$relation?->name }}</div>
+                                <div class="badge fs-5 text-bg-{{ App\Models\Order::STATUS_COLOR[$string->order_status_id] }}">{{ $string->$relation?->name }}</div>
                             @else
                                 {!! $string->$relation?->name; !!}
                             @endif
                         @elseif(str_ends_with($headerName, '_date') && ($string->$headerName))
                             {{ \App\Helpers\DateHelper::getHumanDate($string->$headerName, true) }}
                         @elseif(str_contains($headerName, 'image') && $string->$headerName)
-                            <a href="{{ $string->$headerName }}" data-toggle="lightbox" data-gallery="photos" data-size="fullscreen">
+                            <a href="{{ $string->$headerName }}" data-toggle="lightbox" data-gallery="photos"
+                               data-size="fullscreen">
                                 <img src="{{ $string->$headerName }}" alt="" class="img-thumbnail maf-img">
                             </a>
                         @else