feature-9020: Filter options for orders and attendees not working

app/controllers/events/view/tickets/attendees.js

@@ -2,12 +2,19 @@ import classic from 'ember-classic-decorator';
 import { action } from '@ember/object';
 import Controller from '@ember/controller';
 import { run } from '@ember/runloop';
+import { tracked } from '@glimmer/tracking';
 
 @classic
 export default class AttendeesController extends Controller {
   isLoadingcsv = false;
   isLoadingpdf = false;
 
+  @tracked
+  start_date = this.router.currentRoute.queryParams?.start_date;
+
+  @tracked
+  end_date = this.router.currentRoute.queryParams?.end_date;
+
   @action
   export(mode) {
     this.set(`isLoading${mode}`, true);
@@ -23,6 +30,61 @@ export default class AttendeesController extends Controller {
       });
   }
 
+  @action
+  attendeeFilter(name) {
+    if (name === 'date') {
+      if (!this.start_date || !this.end_date) {
+        this.router.transitionTo('events.view.tickets.attendees.list', {
+          queryParams: {
+            filter: name
+          }
+        });
+        return;
+      }
+      this.router.transitionTo('events.view.tickets.attendees.list', {
+        queryParams: {
+          start_date : this.start_date,
+          end_date   : this.end_date,
+          filter     : name
+        }
+      });
+    } else {
+      this.router.transitionTo('events.view.tickets.attendees.list', {
+        queryParams: {
+          filter: name
+        }
+      });
+    }
+  }
+
+  @action
+  onChangeStartDate() {
+    if (!this.end_date) {
+      return;
+    }
+    this.router.transitionTo('events.view.tickets.attendees.list', {
+      queryParams: {
+        start_date : this.start_date,
+        end_date   : this.end_date,
+        filter     : 'date'
+      }
+    });
+  }
+
+  @action
+  onChangeEndDate() {
+    if (!this.start_date) {
+      return;
+    }
+    this.router.transitionTo('events.view.tickets.attendees.list', {
+      queryParams: {
+        start_date : this.start_date,
+        end_date   : this.end_date,
+        filter     : 'date'
+      }
+    });
+  }
+
   requestLoop(exportJobInfo, mode) {
     run.later(() => {
       this.loader

app/controllers/events/view/tickets/orders.js

@@ -2,12 +2,19 @@ import classic from 'ember-classic-decorator';
 import { action } from '@ember/object';
 import Controller from '@ember/controller';
 import { run } from '@ember/runloop';
+import { tracked } from '@glimmer/tracking';
 
 @classic
 export default class OrdersController extends Controller {
   isLoadingcsv = false;
   isLoadingpdf = false;
 
+  @tracked
+  start_date = this.router.currentRoute.queryParams?.start_date;
+
+  @tracked
+  end_date = this.router.currentRoute.queryParams?.end_date;
+
   @action
   export(mode) {
     this.set(`isLoading${mode}`, true);
@@ -23,6 +30,61 @@ export default class OrdersController extends Controller {
       });
   }
 
+  @action
+  orderFilter(name) {
+    if (name === 'date') {
+      if (!this.start_date || !this.end_date) {
+        this.router.transitionTo('events.view.tickets.orders.list', {
+          queryParams: {
+            filter: name
+          }
+        });
+        return;
+      }
+      this.router.transitionTo('events.view.tickets.orders.list', {
+        queryParams: {
+          start_date : this.start_date,
+          end_date   : this.end_date,
+          filter     : name
+        }
+      });
+    } else {
+      this.router.transitionTo('events.view.tickets.orders.list', {
+        queryParams: {
+          filter: name
+        }
+      });
+    }
+  }
+
+  @action
+  onChangeStartDate() {
+    if (!this.end_date) {
+      return;
+    }
+    this.router.transitionTo('events.view.tickets.orders.list', {
+      queryParams: {
+        start_date : this.start_date,
+        end_date   : this.end_date,
+        filter     : 'date'
+      }
+    });
+  }
+
+  @action
+  onChangeEndDate() {
+    if (!this.start_date) {
+      return;
+    }
+    this.router.transitionTo('events.view.tickets.orders.list', {
+      queryParams: {
+        start_date : this.start_date,
+        end_date   : this.end_date,
+        filter     : 'date'
+      }
+    });
+  }
+
   requestLoop(exportJobInfo, mode) {
     run.later(() => {
       this.loader

app/mixins/ember-table-route.js

@@ -12,6 +12,15 @@ export default Mixin.create({
     search: {
       refreshModel: true
     },
+    filter: {
+      refreshModel: true
+    },
+    start_date: {
+      refreshModel: true
+    },
+    end_date: {
+      refreshModel: true
+    },
     sort_dir: {
       refreshModel: true
     },

app/routes/events/view/tickets/attendees/list.js

@@ -1,5 +1,6 @@
 import Route from '@ember/routing/route';
 import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
+import moment from 'moment-timezone';
 
 export default class extends Route.extend(EmberTableRouteMixin) {
   titleToken() {
@@ -23,6 +24,7 @@ export default class extends Route.extend(EmberTableRouteMixin) {
 
   async model(params) {
     this.set('params', params);
+    const eventDetails = this.modelFor('events.view');
     let filterOptions = [];
     if (params.attendees_status === 'checkedIn') {
       filterOptions = [
@@ -40,20 +42,52 @@ export default class extends Route.extend(EmberTableRouteMixin) {
           val  : false
         }
       ];
-    } else if (params.attendees_status === 'all') {
-      filterOptions = [];
     } else {
-      filterOptions = [
-        {
+      if (params.attendees_status !== 'all') {
+        filterOptions = [
+          {
+            name : 'order',
+            op   : 'has',
+            val  : {
+              name : 'status',
+              op   : 'eq',
+              val  : params.attendees_status
+            }
+          }
+        ];
+      }
+    }
+    if (params.filter) {
+      if (params.filter === 'discount') {
+        filterOptions.pushObject({
           name : 'order',
           op   : 'has',
           val  : {
-            name : 'status',
-            op   : 'eq',
-            val  : params.attendees_status
+            name : 'discount_code_id',
+            op   : 'isnot',
+            val  : null
           }
-        }
-      ];
+        });
+      } else if (params.filter === 'date' && params.start_date && params.end_date) {
+        filterOptions.pushObject({
+          name : 'order',
+          op   : 'has',
+          val  : {
+            name : 'created-at',
+            op   : 'ge',
+            val  : moment.tz(params.start_date, eventDetails.timezone).toISOString()
+          }
+        });
+        filterOptions.pushObject({
+          name : 'order',
+          op   : 'has',
+          val  : {
+            name : 'created-at',
+            op   : 'le',
+            val  : moment.tz(params.end_date, eventDetails.timezone).add(1, 'days').toISOString()
+          }
+        });
+      }
     }
     filterOptions = this.applySearchFiltersExtend(
       filterOptions,
@@ -78,6 +112,6 @@ export default class extends Route.extend(EmberTableRouteMixin) {
 
     queryString = this.applySortFilters(queryString, params);
 
-    return  this.asArray(this.modelFor('events.view').query('attendees', queryString));
+    return this.asArray(eventDetails.query('attendees', queryString));
   }
 }

app/routes/events/view/tickets/orders/list.js

@@ -1,5 +1,6 @@
 import Route from '@ember/routing/route';
 import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
+import moment from 'moment-timezone';
 
 export default class extends Route.extend(EmberTableRouteMixin) {
   titleToken() {
@@ -18,8 +19,33 @@ export default class extends Route.extend(EmberTableRouteMixin) {
   }
 
   async model(params) {
+    const eventDetails = this.modelFor('events.view');
     this.set('params', params);
     const filterOptions = [];
+    if (params.filter) {
+      if (params.filter === 'discount') {
+        filterOptions.pushObject({
+          name : 'discount_code_id',
+          op   : 'isnot',
+          val  : null
+        });
+      } else if (params.filter === 'date' && params.start_date && params.end_date) {
+        filterOptions.push({
+          and: [
+            {
+              name : 'created-at',
+              op   : 'ge',
+              val  : moment.tz(params.start_date, eventDetails.timezone).toISOString()
+            },
+            {
+              name : 'created-at',
+              op   : 'le',
+              val  : moment.tz(params.end_date, eventDetails.timezone).add(1, 'days').toISOString()
+            }
+          ]
+        });
+      }
+    }
     if (params.search) {
       filterOptions.pushObject({
         name : 'user',
@@ -48,6 +74,6 @@ export default class extends Route.extend(EmberTableRouteMixin) {
 
     queryString = this.applySortFilters(queryString, params);
 
-    return  this.asArray(this.modelFor('events.view').query('orders', queryString));
+    return  this.asArray(eventDetails.query('orders', queryString));
   }
 }

app/styles/components/ticket-list.scss

@@ -10,3 +10,15 @@
     vertical-align: baseline !important;
   }
 }
+
+.filter-date-mobile-session {
+  .end-date-session {
+    .ui.popup.calendar {
+      inset: 43px !important;
+
+      table {
+        transform: translateX(-62%);
+      }
+    }
+  }
+}

app/styles/partials/utils.scss

@@ -258,6 +258,10 @@
   vertical-align: bottom;
 }
 
+.b-0 {
+  border: 0 !important;
+}
+
 .add-to-calender-join-video {
   height: 36px;
 }

app/templates/components/widgets/forms/date-picker.hbs

@@ -2,4 +2,4 @@
 {{#if this.icon}}
   <i class="calendar icon"></i>
 {{/if}}
-<Input @type="text" @value={{value}} placeholder={{this.placeholder}} @name={{name}} @focus-out={{action "onChange"}} />
+<Input @type="text" @value={{value}} autocomplete="off" placeholder={{this.placeholder}} @name={{name}} @focus-out={{action "onChange"}} />