Forráskód Böngészése

Added universal sort of table by all fields

Alexander Musikhin 10 hónapja
szülő
commit
b7966fde4d

+ 19 - 1
app/Http/Controllers/ProductController.php

@@ -19,7 +19,25 @@ class ProductController extends Controller
 
     public function index(Request $request)
     {
-        $this->data['products'] = Product::query()->paginate()->withQueryString();
+        $q = Product::query();
+
+        // ------- setup sort and order --------------------------------------------------------------------------------
+        $this->data['sortBy'] = (!empty($request->sortBy))
+            ? Str::replace('_txt', '', $request->sortBy) // remove '_txt' fields modifier
+            : Product::DEFAULT_SORT_BY;
+
+        // check for sortBy is valid field
+        $p = new Product();
+        if(!in_array($this->data['sortBy'], $p->getFillable())) {
+            $this->data['sortBy'] = Product::DEFAULT_SORT_BY;
+        }
+
+        // set order
+        $this->data['orderBy'] = (!empty($request->order)) ? 'desc' : 'asc';
+        $q->orderBy($this->data['sortBy'], $this->data['orderBy']);
+
+
+        $this->data['products'] = $q->paginate()->withQueryString();
         return view('catalog.index', $this->data);
     }
 

+ 3 - 0
app/Models/Product.php

@@ -10,6 +10,9 @@ use Illuminate\Database\Eloquent\SoftDeletes;
 class Product extends Model
 {
     use SoftDeletes;
+
+    const DEFAULT_SORT_BY = 'article';
+
     protected $fillable = [
         'year',
         'name_tz',

+ 28 - 12
resources/views/partials/table.blade.php

@@ -5,11 +5,23 @@
             <i class="bi bi-gear-fill"></i>
         </button>
     </div>
-    <table class="table" id="tbl" data-table-name="{{ $id }}">
+    <table class="table" id="tbl" data-table-name="{{ $id }}" style="display: none;">
         <thead>
             <tr>
                 @foreach($header as $headerName => $headerTitle)
-                    <th scope="col" class="column_{{ $headerName }} hrader_{{ $headerName }}">{{ $headerTitle }}</th>
+                    <th scope="col" class="bg-primary-subtle column_{{ $headerName }} hrader_{{ $headerName }}">
+                        <span class="cursor-pointer sort-by-column" data-name="{{ $headerName }}">
+                            {{ $headerTitle }}
+                            @if(str_starts_with($headerName, $sortBy))
+                                @if($orderBy === 'asc')
+                                    <i class="bi bi-arrow-up"></i>
+                                @else
+                                    <i class="bi bi-arrow-down"></i>
+                                @endif
+                            @endif
+
+                        </span>
+                    </th>
                 @endforeach
 
             </tr>
@@ -56,9 +68,7 @@
         let tables = JSON.parse(localStorage.getItem('table_'+tableName));
 
         // on first load create tables object
-        if(!tables) {
-            tables = {};
-        }
+        if(!tables) { tables = {}; }
 
         $.each(tables, function (colName, colStatus) {
             if(!colStatus) {
@@ -67,6 +77,8 @@
             }
         });
 
+        $('.table').fadeIn();
+
         $('.toggle-column').on('change', function () {
             let columnName = $(this).attr('data-name');
             let columnStatus = $(this).is(':checked');
@@ -83,16 +95,20 @@
             }
         });
 
-
-
-
-
-        $('#table-settings').on('click', function () {
-
+        $('.sort-by-column').on('click', function () {
+            let columnName = $(this).attr('data-name');
+            let currentUrl = new URL(document.location.href);
+            let currentColumnName = currentUrl.searchParams.get('sortBy');
+            currentUrl.searchParams.set('sortBy', columnName);
+            if((currentColumnName !== columnName) || (currentUrl.searchParams.has('order'))) {
+                currentUrl.searchParams.delete('order');
+            } else {
+                currentUrl.searchParams.set('order', 'desc');
+            }
+            document.location.href = currentUrl.href;
         });
 
 
 
-
     </script>
 @endpush

+ 4 - 3
todo.md

@@ -1,9 +1,10 @@
 - [x] пользователи и роли
 - [x] управление пользователями (CRUD)
 - [x] каталог товаров
-- [ ] каталог товаров фильтры, поиск, сортировка
-- [ ] каталог товаров экспорт
-- [x] импорт товаров
+- [x] настраиваемые таблицы
+- [ ] каталог товаров: фильтры, поиск, +сортировка
+- [ ] каталог товаров: экспорт
+- [x] каталог товаров: импорт
 - [ ] складские остатки товаров
 - [ ] заказы (площадки) (сюда же входят клиенты, если нужна отдельная сущность)
 - [ ] заказы поставщику