mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-02-03 22:06:07 +00:00
Merge pull request #10123 from jibees/10017-introduce-a-filter-results-button-on-the-bom-page
Introduce a filter results button on the BOM page
This commit is contained in:
@@ -3,10 +3,6 @@ angular.module("admin.lineItems").controller 'LineItemsCtrl', ($scope, $timeout,
|
||||
$scope.RequestMonitor = RequestMonitor
|
||||
$scope.line_items = LineItems.all
|
||||
$scope.confirmDelete = true
|
||||
$scope.startDate = moment().startOf('day').subtract(7, 'days').format('YYYY-MM-DD')
|
||||
$scope.endDate = moment().startOf('day').format('YYYY-MM-DD')
|
||||
$scope.previousDates = { startDate: $scope.startDate, endDate: $scope.endDate }
|
||||
$scope.datesChangedOnCancelEvent = false
|
||||
$scope.bulkActions = [ { name: t("admin.orders.bulk_management.actions_delete"), callback: 'deleteLineItems' } ]
|
||||
$scope.selectedUnitsProduct = {}
|
||||
$scope.selectedUnitsVariant = {}
|
||||
@@ -17,42 +13,29 @@ angular.module("admin.lineItems").controller 'LineItemsCtrl', ($scope, $timeout,
|
||||
$scope.confirmRefresh = ->
|
||||
LineItems.allSaved() || confirm(t("unsaved_changes_warning"))
|
||||
|
||||
$scope.initStartAndEnDate = ->
|
||||
$scope.startDate = moment().startOf('day').subtract(7, 'days').format('YYYY-MM-DD')
|
||||
$scope.endDate = moment().startOf('day').format('YYYY-MM-DD')
|
||||
|
||||
$scope.resetFilters = ->
|
||||
$scope.distributorFilter = ''
|
||||
$scope.supplierFilter = ''
|
||||
$scope.orderCycleFilter = ''
|
||||
$scope.quickSearch = ''
|
||||
$scope.initStartAndEnDate()
|
||||
event = new CustomEvent('flatpickr:change', {
|
||||
detail: {
|
||||
startDate: $scope.startDate,
|
||||
endDate: $scope.endDate
|
||||
}
|
||||
})
|
||||
window.dispatchEvent(event)
|
||||
|
||||
$scope.resetSelectFilters = ->
|
||||
$scope.resetFilters()
|
||||
$scope.refreshData()
|
||||
|
||||
$scope.$watchCollection "[startDate, endDate]", (newValues, oldValues) ->
|
||||
if newValues != oldValues && !$scope.datesChangedOnCancelEvent
|
||||
state = $scope.refreshData()
|
||||
if (state == "cancel")
|
||||
$scope.datesChangedOnCancelEvent = true
|
||||
$scope.cancelDateChange()
|
||||
|
||||
$scope.cancelDateChange = ->
|
||||
# Reset the date filters to the previous values
|
||||
$scope.startDate = $scope.previousDates.startDate
|
||||
$scope.endDate = $scope.previousDates.endDate
|
||||
# throw a flatpickr:change event to change the date back in the datepicker
|
||||
event = new CustomEvent('flatpickr:change', {
|
||||
detail: {
|
||||
startDate: $scope.previousDates.startDate,
|
||||
endDate: $scope.previousDates.endDate
|
||||
}
|
||||
})
|
||||
window.dispatchEvent(event)
|
||||
$timeout ->
|
||||
$scope.datesChangedOnCancelEvent = false
|
||||
|
||||
$scope.refreshData = ->
|
||||
unless !$scope.orderCycleFilter? || $scope.orderCycleFilter == ''
|
||||
$scope.setOrderCycleDateRange()
|
||||
|
||||
$scope.formattedStartDate = moment($scope.startDate).format()
|
||||
$scope.formattedEndDate = moment($scope.endDate).add(1,'day').format()
|
||||
|
||||
@@ -67,11 +50,6 @@ angular.module("admin.lineItems").controller 'LineItemsCtrl', ($scope, $timeout,
|
||||
$scope.loadAssociatedData()
|
||||
|
||||
$scope.dereferenceLoadedData()
|
||||
|
||||
$timeout ->
|
||||
# update the previous dates with the current ones since loading was successful
|
||||
$scope.previousDates.startDate = $scope.startDate
|
||||
$scope.previousDates.endDate = $scope.endDate
|
||||
|
||||
$scope.setOrderCycleDateRange = ->
|
||||
start_date = OrderCycles.byID[$scope.orderCycleFilter].orders_open_at
|
||||
@@ -79,6 +57,14 @@ angular.module("admin.lineItems").controller 'LineItemsCtrl', ($scope, $timeout,
|
||||
format = "YYYY-MM-DD HH:mm:ss Z"
|
||||
$scope.startDate = moment(start_date, format).format('YYYY-MM-DD')
|
||||
$scope.endDate = moment(end_date, format).startOf('day').format('YYYY-MM-DD')
|
||||
# throw a flatpickr:change event to change the date back in the datepicker
|
||||
event = new CustomEvent('flatpickr:change', {
|
||||
detail: {
|
||||
startDate: $scope.startDate,
|
||||
endDate: $scope.endDate
|
||||
}
|
||||
})
|
||||
window.dispatchEvent(event)
|
||||
|
||||
$scope.loadOrders = ->
|
||||
RequestMonitor.load $scope.orders = Orders.index(
|
||||
@@ -277,5 +263,4 @@ angular.module("admin.lineItems").controller 'LineItemsCtrl', ($scope, $timeout,
|
||||
lineItem.final_weight_volume = LineItems.pristineByID[lineItem.id].final_weight_volume * lineItem.quantity / LineItems.pristineByID[lineItem.id].quantity
|
||||
$scope.weightAdjustedPrice(lineItem)
|
||||
|
||||
$scope.resetFilters()
|
||||
$scope.refreshData()
|
||||
$scope.resetSelectFilters()
|
||||
|
||||
@@ -12,39 +12,42 @@
|
||||
= admin_inject_column_preferences module: 'admin.lineItems'
|
||||
= admin_inject_available_units
|
||||
|
||||
%div{ ng: { controller: 'LineItemsCtrl' } }
|
||||
%save-bar{ dirty: "bulk_order_form.$dirty", persist: "false" }
|
||||
%input.red{ type: "button", value: "Save Changes", ng: { click: "submit()", disabled: "!bulk_order_form.$dirty" } }
|
||||
|
||||
.filters{ :class => "sixteen columns alpha" }
|
||||
.date_filter{class: "four columns"}
|
||||
%label
|
||||
= t("date_range")
|
||||
%br
|
||||
%div{ data: { controller: "flatpickr", "flatpickr-mode-value": "range", "flatpickr-default-date": "{{ [startDate, endDate] }}" } }
|
||||
%input.datepicker.fullwidth{ class: "datepicker", data: { "flatpickr-target": "instance" } }
|
||||
%input{ type: "text", id: 'start_date_filter', 'ng-model': "startDate", data: { "flatpickr-target": "start" }, style: "display: none;" }
|
||||
%input{ type: "text", id: 'end_date_filter', 'ng-model': "endDate", data: { "flatpickr-target": "end" }, style: "display: none;" }
|
||||
.one.column
|
||||
.filter_select{ :class => "three columns" }
|
||||
%label{ :for => 'supplier_filter' }
|
||||
= t("admin.producer")
|
||||
%br
|
||||
%input#supplier_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'suppliers', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'supplierFilter', change: 'refreshData()' } }
|
||||
.filter_select{ :class => "three columns" }
|
||||
%label{ :for => 'distributor_filter' }
|
||||
= t("admin.shop")
|
||||
%br
|
||||
%input#distributor_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'distributors', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'distributorFilter', change: 'refreshData()' } }
|
||||
.filter_select{ :class => "three columns" }
|
||||
%label{ :for => 'order_cycle_filter' }
|
||||
= t("admin.order_cycle")
|
||||
%br
|
||||
%input#order_cycle_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'orderCycles', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'orderCycleFilter', change: 'refreshData()' } }
|
||||
.filter_clear{ :class => "two columns omega" }
|
||||
%label{ :for => 'clear_all_filters' }
|
||||
%br
|
||||
%input.red.fullwidth{ :type => 'button', :id => 'clear_all_filters', :value => t('admin.clear_all'), 'ng-click' => "resetSelectFilters()" }
|
||||
%div{ ng: { controller: 'LineItemsCtrl' }, id: "table-filter" }
|
||||
%fieldset
|
||||
%save-bar{ dirty: "bulk_order_form.$dirty", persist: "false" }
|
||||
%input.red{ type: "button", value: "Save Changes", ng: { click: "submit()", disabled: "!bulk_order_form.$dirty" } }
|
||||
%legend{ align: 'center'}= t(:search)
|
||||
%div{ :class => "sixteen columns alpha" }
|
||||
.filter_select{ :class => "four columns" }
|
||||
%label{ :for => 'supplier_filter' }
|
||||
= t("admin.producer")
|
||||
%br
|
||||
%input#supplier_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'suppliers', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'supplierFilter' } }
|
||||
.filter_select{ :class => "four columns" }
|
||||
%label{ :for => 'distributor_filter' }
|
||||
= t("admin.shop")
|
||||
%br
|
||||
%input#distributor_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'distributors', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'distributorFilter' } }
|
||||
.filter_select{ :class => "four columns" }
|
||||
%label{ :for => 'order_cycle_filter' }
|
||||
= t("admin.order_cycle")
|
||||
%br
|
||||
%input#order_cycle_filter.ofn-select2.fullwidth{ type: 'number', 'min-search' => 5, data: 'orderCycles', placeholder: "#{t(:all)}", blank: "{ id: '', name: '#{t(:all)}' }", on: { selecting: "confirmRefresh" }, ng: { model: 'orderCycleFilter', change: "setOrderCycleDateRange()" } }
|
||||
.date_filter{class: "four columns"}
|
||||
%label
|
||||
= t("date_range")
|
||||
%br
|
||||
%div{ data: { controller: "flatpickr", "flatpickr-mode-value": "range", "flatpickr-default-date": "{{ [startDate, endDate] }}" } }
|
||||
%input.datepicker.fullwidth{ class: "datepicker", data: { "flatpickr-target": "instance" } }
|
||||
%input{ type: "text", id: 'start_date_filter', 'ng-model': "startDate", data: { "flatpickr-target": "start" }, style: "display: none;" }
|
||||
%input{ type: "text", id: 'end_date_filter', 'ng-model': "endDate", data: { "flatpickr-target": "end" }, style: "display: none;" }
|
||||
|
||||
.clearfix
|
||||
.actions.filter-actions
|
||||
%a.button.icon-search{'ng-click' => 'refreshData()'}
|
||||
= t(:filter_results)
|
||||
%a.button{'ng-click' => 'resetSelectFilters()', "id": "clear_filters_button", "class": ("secondary" if feature?(:admin_style_v2, spree_current_user)) }
|
||||
= t(:clear_filters)
|
||||
|
||||
%hr.divider.sixteen.columns.alpha.omega{ ng: { show: 'unitsVariantSelected()' } }
|
||||
|
||||
|
||||
@@ -346,6 +346,7 @@ describe '
|
||||
end
|
||||
close_select2
|
||||
select2_select s1.name, from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -354,9 +355,11 @@ describe '
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
select2_select s1.name, from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
select2_select "All", from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -389,6 +392,7 @@ describe '
|
||||
expect(page).to have_selector "div.select2-drop-active ul.select2-results li", text: dn
|
||||
end
|
||||
find(".select2-result-label", text: d1.name.to_s).click
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -398,10 +402,12 @@ describe '
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
find("#s2id_distributor_filter .select2-chosen").click
|
||||
find(".select2-result-label", text: d1.name.to_s).click
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
# displays orders from all enterprises
|
||||
find("#s2id_distributor_filter .select2-chosen").click
|
||||
find(".select2-result-label", text: "All").click
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -432,6 +438,7 @@ describe '
|
||||
expect(page).to have_select2 'order_cycle_filter',
|
||||
with_options: OrderCycle.pluck(:name).unshift("All")
|
||||
select2_select oc1.name, from: "order_cycle_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_no_selector "#loading i"
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
@@ -441,9 +448,11 @@ describe '
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
select2_select oc1.name, from: "order_cycle_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
select2_select "All", from: "order_cycle_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -477,17 +486,21 @@ describe '
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
click_on_select2 oc1.name, from: "order_cycle_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
click_on_select2 d1.name, from: "distributor_filter"
|
||||
click_on_select2 s1.name, from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
click_on_select2 d2.name, from: "distributor_filter"
|
||||
click_on_select2 s2.name, from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_no_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
click_on_select2 oc2.name, from: "order_cycle_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_no_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
end
|
||||
@@ -498,10 +511,10 @@ describe '
|
||||
click_on_select2 oc1.name, from: "order_cycle_filter"
|
||||
click_on_select2 d1.name, from: "distributor_filter"
|
||||
click_on_select2 s1.name, from: "supplier_filter"
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_no_selector "tr#li_#{li2.id}"
|
||||
expect(page).to have_button "Clear All"
|
||||
click_button "Clear All"
|
||||
page.find('.filter-actions #clear_filters_button').click
|
||||
expect(page).to have_selector "div#s2id_order_cycle_filter a.select2-choice", text: "All"
|
||||
expect(page).to have_selector "div#s2id_supplier_filter a.select2-choice", text: "All"
|
||||
expect(page).to have_selector "div#s2id_distributor_filter a.select2-choice", text: "All"
|
||||
@@ -589,6 +602,7 @@ describe '
|
||||
|
||||
find("input.datepicker").click
|
||||
select_dates_from_daterangepicker(from, today)
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
@@ -597,6 +611,7 @@ describe '
|
||||
|
||||
find("input.datepicker").click
|
||||
select_dates_from_daterangepicker(from, to)
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
|
||||
expect(page).to have_selector "tr#li_#{li1.id}"
|
||||
expect(page).to have_selector "tr#li_#{li2.id}"
|
||||
@@ -615,6 +630,7 @@ describe '
|
||||
accept_confirm "Unsaved changes exist and will be lost if you continue." do
|
||||
find("input.datepicker").click
|
||||
select_dates_from_daterangepicker(today - 9.days, today)
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
end
|
||||
# daterange picker should have changed
|
||||
expect(find("input.datepicker").value).to eq "#{today.prev_day(9).strftime('%F')} to #{today.strftime('%F')}"
|
||||
@@ -629,9 +645,8 @@ describe '
|
||||
dismiss_confirm "Unsaved changes exist and will be lost if you continue." do
|
||||
find("input.datepicker").click
|
||||
select_dates_from_daterangepicker(today - 9.days, today)
|
||||
page.find('.filter-actions .button.icon-search').click
|
||||
end
|
||||
# daterange picker shouldn't have changed
|
||||
expect(find("input.datepicker").value).to eq previousdaterangestring
|
||||
expect(page).to have_selector "#save-bar"
|
||||
within("tr#li_#{li2.id} td.quantity") do
|
||||
expect(page).to have_selector "input[name=quantity].ng-dirty"
|
||||
|
||||
Reference in New Issue
Block a user