filter on orders

static/js/orders.js

@@ -1,5 +1,4 @@
 $(document).ready(function() {
-  var filterLinks = document.getElementsByClassName('filter__link');
 
   $('.delete_license').click(function(e){
       e.preventDefault();
@@ -21,6 +20,12 @@ $(document).ready(function() {
       })
   });
 
+  var filterLinks = document.getElementsByClassName('filter__link');
+  var filterPeriodLinks = document.getElementsByClassName('period__link');
+  var filterPeriod = false;
+  var filterStatus = false;
+  var filterType = false;
+
   var options = {
     valueNames: [
       { data: ['id'] },
@@ -30,73 +35,335 @@ $(document).ready(function() {
     ]
   };
 
+  var today = new Date();
+  var dd = today.getDate();
+  var month = today.getMonth() + 1;
+  var year = today.getFullYear();
+  var quarter, prevMonth, prevMonthYear, prevQuarter, prevYear;
+
   var orderList = new List('listData', options);
 
-  // console.log(orderList);
+  if (dd < 10) {
+    dd = '0' + dd
+  }
+
+  if (month < 10) {
+      month = '0'+ month
+  }
+
+  function getPrevMonth(d) {
+    var result;
+    d = d || new Date();
+    result = d.getMonth();
+    if (result === 0) {
+      result = 12
+    }
+    if (result < 10) {
+      result = '0'+ result
+    }
+
+    return result
+  }
+
+  function getPrevMonthYear(d) {
+    var result;
+    d = d || new Date();
+    var currMon = d.getMonth();
+
+    if (currMon === 0) {
+      result = d.getFullYear() - 1
+    } else {
+      result = d.getFullYear()
+    }
+
+    return result
+  }
+
+  function getQuarter(d) {
+    var result;
+    d = d || new Date();
+    var m = Math.floor(d.getMonth()/3) + 2;
+    result = m > 4? m - 4 : m;
+    return result - 1
+  }
+
+  function getQuarterForStrDate(strDate) {
+    var parts =strDate.split('.');
+    var resDate = new Date(parts[2],parts[1]-1,parts[0]);
+    return getQuarter(resDate)
+  }
+
+  function getPrevQuarter() {
+    var result;
+    if (quarter === 1) {
+      result = 4
+    } else {
+      result = quarter - 1
+    }
+    return result;
+  }
+
+  quarter = getQuarter();
+  prevMonth = getPrevMonth();
+  prevMonthYear = getPrevMonthYear();
+  prevQuarter = getPrevQuarter();
+  prevYear =year - 1;
 
   $('#filterNone').click(function() {
     event.preventDefault();
+    filterPeriod = false;
+    filterStatus = false;
+    filterType = false;
     orderList.filter();
     resetAllFilterStatus();
-    return false;
   });
 
   $('#filterAccountsNone').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      return item.values().type === "account";
-    });
-    return false;
+    filterStatus = false;
+    filterType = 'account';
+    filterItems();
   });
 
   $('#filterAccountsPay').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      // console.log(item.values());
-      return item.values().type === "account" && item.values().status === "2";
-    });
-    return false;
+    filterStatus = '2';
+    filterType = 'account';
+    filterItems();
   });
 
   $('#filterAccountsWaitPay').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      return item.values().type === "account" && item.values().status === "0";
-    });
-    return false;
+    filterStatus = '0';
+    filterType = 'account';
+    filterItems();
   });
 
   $('#filterAccountsFreezePay').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      return item.values().type === "account" && item.values().status === "4";
-    });
-    return false;
+    filterStatus = '4';
+    filterType = 'account';
+    filterItems();
   });
 
   $('#filterLicenseNone').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      return item.values().type === "license";
-    });
-    return false;
+    filterStatus = false;
+    filterType = 'license';
+    filterItems();
   });
 
   $('#filterLicenseNow').click(function() {
     event.preventDefault();
-    orderList.filter(function(item) {
-      return item.values().type === "license" && item.values().status === "2";
-    });
-    return false;
+    filterStatus = '2';
+    filterType = 'license';
+    filterItems();
   });
 
   $('#filterLicenseOld').click(function() {
     event.preventDefault();
+    filterStatus = '3';
+    filterType = 'license';
+    filterItems();
+  });
+
+  $('#filterPeriodNone').click(function() {
+    event.preventDefault();
+    filterPeriod = false;
+    filterItems();
+  });
+
+  $('#filterPeriodThisMonth').click(function() {
+    event.preventDefault();
+    filterPeriod = 1;
+    filterItems();
+  });
+
+  $('#filterPeriodPrevMonth').click(function() {
+    event.preventDefault();
+    filterPeriod = 2;
+    filterItems();
+  });
+
+  $('#filterPeriodThisQuarter').click(function() {
+    event.preventDefault();
+    filterPeriod = 3;
+    filterItems();
+  });
+
+  $('#filterPeriodPrevQuarter').click(function() {
+    event.preventDefault();
+    filterPeriod = 4;
+    filterItems();
+  });
+
+  $('#filterPeriodThisYear').click(function() {
+    event.preventDefault();
+    filterPeriod = 5;
+    filterItems();
+  });
+
+  $('#filterPeriodPrevYear').click(function() {
+    event.preventDefault();
+    filterPeriod = 6;
+    filterItems();
+  });
+
+  function filterItemsDontPeriod() {
     orderList.filter(function(item) {
-      return item.values().type === "license" && item.values().status === "3";
+      if (!filterType && !filterStatus) {
+        return true
+      }
+      if (filterType && filterStatus) {
+        return item.values().type === filterType && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return item.values().type === filterType;
+      }
+
     });
-    return false;
-  });
+  }
+
+  function filterItemsMonth() {
+
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return item.values()['order-date'].split('.')[1] === month.toString()
+          && item.values()['order-date'].split('.')[2] === year.toString();
+      }
+      if (filterType && filterStatus) {
+        return item.values()['order-date'].split('.')[1] === month.toString()
+          && item.values()['order-date'].split('.')[2] === year.toString()
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return item.values()['order-date'].split('.')[1] === month.toString()
+          && item.values()['order-date'].split('.')[2] === year.toString()
+          && item.values().type === filterType;
+      }
+
+    });
+
+  }
+
+  function filterItemsPrevMonth() {
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return item.values()['order-date'].split('.')[1] === prevMonth.toString()
+          && item.values()['order-date'].split('.')[2] === prevMonthYear.toString();
+      }
+      if (filterType && filterStatus) {
+        return item.values()['order-date'].split('.')[1] === prevMonth.toString()
+          && item.values()['order-date'].split('.')[2] === prevMonthYear.toString()
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return item.values()['order-date'].split('.')[1] === prevMonth.toString()
+          && item.values()['order-date'].split('.')[2] === prevMonthYear.toString()
+          && item.values().type === filterType;
+      }
+
+    });
+  }
+
+  function filterItemsThisQuarter() {
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return getQuarterForStrDate(item.values()['order-date']) === quarter
+      }
+      if (filterType && filterStatus) {
+        return getQuarterForStrDate(item.values()['order-date']) === quarter
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return getQuarterForStrDate(item.values()['order-date']) === quarter
+          && item.values().type === filterType;
+      }
+
+    });
+  }
+
+  function filterItemsPrevQuarter() {
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return getQuarterForStrDate(item.values()['order-date']) === prevQuarter
+      }
+      if (filterType && filterStatus) {
+        return getQuarterForStrDate(item.values()['order-date']) === prevQuarter
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return getQuarterForStrDate(item.values()['order-date']) === prevQuarter
+          && item.values().type === filterType;
+      }
+
+    });
+  }
+
+  function filterItemsThisYear() {
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return item.values()['order-date'].split('.')[2] === year.toString()
+      }
+      if (filterType && filterStatus) {
+        return item.values()['order-date'].split('.')[2] === year.toString()
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return item.values()['order-date'].split('.')[2] === year.toString()
+          && item.values().type === filterType;
+      }
+
+    });
+  }
+
+  function filterItemsPrevYear() {
+    orderList.filter(function(item) {
+      if (!filterType && !filterStatus) {
+        return item.values()['order-date'].split('.')[2] === prevYear.toString()
+      }
+      if (filterType && filterStatus) {
+        return item.values()['order-date'].split('.')[2] === prevYear.toString()
+          && item.values().type === filterType
+          && item.values().status === filterStatus;
+      }
+      if (filterType) {
+        return item.values()['order-date'].split('.')[2] === prevYear.toString()
+          && item.values().type === filterType;
+      }
+
+    });
+  }
+
+  function filterItems() {
+    if (!filterPeriod) {
+      filterItemsDontPeriod()
+    }
+    if (filterPeriod === 1) {
+      filterItemsMonth()
+    }
+    if (filterPeriod === 2) {
+      filterItemsPrevMonth()
+    }
+    if (filterPeriod === 3) {
+      filterItemsThisQuarter()
+    }
+    if (filterPeriod === 4) {
+      filterItemsPrevQuarter()
+    }
+    if (filterPeriod === 5) {
+      filterItemsThisYear()
+    }
+    if (filterPeriod === 6) {
+      filterItemsPrevYear()
+    }
+  }
+
 
   function removeClass(obj, cls) {
     var classes = obj.className.split(' ');
@@ -122,18 +389,38 @@ $(document).ready(function() {
         removeClass(filterLinks[i], 'is_active_filter')
       }
     }
+
+    for (var j = 0;j < filterPeriodLinks.length; j++ ) {
+      if (filterPeriodLinks[j].classList.contains('is_active_filter')) {
+        removeClass(filterPeriodLinks[j], 'is_active_filter')
+      }
+    }
+
   }
 
-  function resetAnotherFilterStatus(element) {
-    for (var i = 0;i < filterLinks.length; i++ ) {
+  function resetAnotherFilterStatus(element, typeLinks) {
 
-      if (filterLinks[i] === element) {
-        // console.log(filterLinks[i]);
-      } else {
-        if (filterLinks[i].classList.contains('is_active_filter')) {
-          removeClass(filterLinks[i], 'is_active_filter')
+    if (typeLinks === 'type') {
+      for (var i = 0;i < filterLinks.length; i++ ) {
+        if (filterLinks[i] === element) {
+          // console.log(filterLinks[i]);
+        } else {
+          if (filterLinks[i].classList.contains('is_active_filter')) {
+            removeClass(filterLinks[i], 'is_active_filter')
+          }
         }
       }
+    } else {
+      for (var j = 0;j < filterPeriodLinks.length; j++ ) {
+        if (filterPeriodLinks[j] === element) {
+          // console.log(filterLinks[i]);
+        } else {
+          if (filterPeriodLinks[j].classList.contains('is_active_filter')) {
+            removeClass(filterPeriodLinks[j], 'is_active_filter')
+          }
+        }
+      }
+
     }
   }
 
@@ -141,9 +428,15 @@ $(document).ready(function() {
   for (var i = 0;i < filterLinks.length; i++ ) {
     filterLinks[i].addEventListener('click', function () {
       setActive(this);
-      resetAnotherFilterStatus(this);
+      resetAnotherFilterStatus(this,'type');
     })
   }
 
-});
+  for (var j = 0;j < filterPeriodLinks.length; j++ ) {
+    filterPeriodLinks[j].addEventListener('click', function () {
+      setActive(this);
+      resetAnotherFilterStatus(this, 'period');
+    })
+  }
 
+});

templates/customer/profile/orders_list.html

@@ -96,13 +96,13 @@
   <div class="filter__period">
     <div class="period__title">По времени создания</div>
     <ul class="period__list">
-      <li class="period__item">Все время</li>
-      <li class="period__item">Этот месяц</li>
-      <li class="period__item">Прошлый месяц</li>
-      <li class="period__item">Этот квартал</li>
-      <li class="period__item">Прошлый квартал</li>
-      <li class="period__item">Этот год</li>
-      <li class="period__item">Прошлый год</li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodNone">Все время</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodThisMonth">Этот месяц</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodPrevMonth">Прошлый месяц</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodThisQuarter">Этот квартал</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodPrevQuarter">Прошлый квартал</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodThisYear">Этот год</a></li>
+      <li class="period__item"><a class="period__link" href="#" id="filterPeriodPrevYear">Прошлый год</a></li>
     </ul>
   </div>
   <div class="filter__clean">