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:
Filipe
2022-12-28 16:55:30 +00:00
committed by GitHub
3 changed files with 76 additions and 73 deletions

View File

@@ -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()

View File

@@ -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()' } }

View File

@@ -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"