issue-495: multi filter

ellite · Sep 1, 2024 · 8b35c30 · 8b35c30
1 parent 6e96c5d
commit 8b35c30
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 12 deletions.
diff --git a/endpoints/subscriptions/get.php b/endpoints/subscriptions/get.php
@@ -33,9 +33,17 @@
     $params[':category'] = $_GET['category'];
   }
 
-  if (isset($_GET['payment']) && $_GET['payment'] != "") {
-    $sql .= " AND payment_method_id = :payment";
-    $params[':payment'] = $_GET['payment'];
+  if (isset($_GET['payments']) && $_GET['payments'] !== "") {
+    $sql .= " AND (";
+    $innerSql = [];
+    $idx = 0;
+    $allPayments = explode(',', $_GET['payments']);
+    foreach($allPayments as $payment) {
+      $innerSql[] = "payment_method_id = :payments{$idx}";
+      $params[':payments' . $idx] = $payment;
+      $idx++;
+    }
+    $sql .= implode(' OR ', $innerSql) . ")";
   }
 
   if (isset($_GET['member']) && $_GET['member'] != "") {

diff --git a/index.php b/index.php
@@ -163,7 +163,7 @@
                 <?php
                 foreach ($payment_methods as $payment) {
                   $selectedClass = '';
-                  if (isset($_GET['payment']) && $_GET['payment'] == $payment['id']) {
+                  if (isset($_GET['payment']) && in_array( $payment['id'], $_GET['payment'])) {
                     $selectedClass = 'selected';
                   }
                   ?>

diff --git a/scripts/dashboard.js b/scripts/dashboard.js
@@ -298,8 +298,8 @@ function fetchSubscriptions() {
   if (activeFilters['member'] !== "") {
     getSubscriptions += getSubscriptions.includes("?") ? `&member=${activeFilters['member']}` : `?member=${activeFilters['member']}`;
   }
-  if (activeFilters['payment'] !== "") {
-    getSubscriptions += getSubscriptions.includes("?") ? `&payment=${activeFilters['payment']}` : `?payment=${activeFilters['payment']}`;
+  if (activeFilters['payments'].length > 0) {
+    getSubscriptions += getSubscriptions.includes("?") ? `&payments=${activeFilters['payments']}` : `?payments=${activeFilters['payments']}`;
   }
   if (activeFilters['state'] !== "") {
     getSubscriptions += getSubscriptions.includes("?") ? `&state=${activeFilters['state']}` : `?state=${activeFilters['state']}`;
@@ -461,7 +461,7 @@ function closeSubMenus() {
 const activeFilters = [];
 activeFilters['category'] = "";
 activeFilters['member'] = "";
-activeFilters['payment'] = "";
+activeFilters['payments'] = [];
 activeFilters['state'] = "";
 
 document.addEventListener("DOMContentLoaded", function () {
@@ -526,14 +526,17 @@ document.querySelectorAll('.filter-item').forEach(function (item) {
       }
     } else if (this.hasAttribute('data-paymentid')) {
       const paymentId = this.getAttribute('data-paymentid');
-      if (activeFilters['payment'] === paymentId) {
-        activeFilters['payment'] = "";
+      if (activeFilters['payments'].includes(paymentId)) {
+        const index = activeFilters['payments'].indexOf(paymentId);
+        activeFilters['payments'].splice(index, 1);
         this.classList.remove('selected');
       } else {
-        activeFilters['payment'] = paymentId;
+        activeFilters['payments'].push(paymentId);
+        /*
         Array.from(this.parentNode.children).forEach(sibling => {
           sibling.classList.remove('selected');
         });
+        */
         this.classList.add('selected');
       }
     } else if (this.hasAttribute('data-state')) {
@@ -550,7 +553,7 @@ document.querySelectorAll('.filter-item').forEach(function (item) {
       }
     }
 
-    if (activeFilters['category'] !== "" || activeFilters['member'] !== "" || activeFilters['payment'] !== "") {
+    if (activeFilters['category'] !== "" || activeFilters['member'] !== "" || activeFilters['payments'].length > 0) {
       document.querySelector('#clear-filters').classList.remove('hide');
     } else {
       document.querySelector('#clear-filters').classList.add('hide');
@@ -565,7 +568,7 @@ function clearFilters() {
   searchInput.value = "";
   activeFilters['category'] = "";
   activeFilters['member'] = "";
-  activeFilters['payment'] = "";
+  activeFilters['payments'] = [];
   document.querySelectorAll('.filter-item').forEach(function (item) {
     item.classList.remove('selected');
   });