From dafcd0ddc2921709973b9ccc9f4edcf21076fd0a Mon Sep 17 00:00:00 2001 From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com> Date: Tue, 25 Sep 2018 13:19:51 +0100 Subject: [PATCH 1/2] Add per_page controls to admin orders index --- .../admin/orders/controllers/orders_controller.js.coffee | 8 +++++++- .../stylesheets/admin/components/per_page_controls.scss | 7 +++++++ .../spree/admin/orders_controller_decorator.rb | 5 +++-- app/views/spree/admin/orders/_per_page_controls.html.haml | 6 ++++++ app/views/spree/admin/orders/index.html.haml | 3 +++ config/locales/en.yml | 5 +++++ 6 files changed, 31 insertions(+), 3 deletions(-) create mode 100644 app/assets/stylesheets/admin/components/per_page_controls.scss create mode 100644 app/views/spree/admin/orders/_per_page_controls.html.haml diff --git a/app/assets/javascripts/admin/orders/controllers/orders_controller.js.coffee b/app/assets/javascripts/admin/orders/controllers/orders_controller.js.coffee index 96bfd63ab2..b2c1e692f0 100644 --- a/app/assets/javascripts/admin/orders/controllers/orders_controller.js.coffee +++ b/app/assets/javascripts/admin/orders/controllers/orders_controller.js.coffee @@ -3,8 +3,14 @@ angular.module("admin.orders").controller "ordersCtrl", ($scope, RequestMonitor, $scope.pagination = Orders.pagination $scope.orders = Orders.all $scope.sortOptions = SortOptions + $scope.per_page_options = [ + {id: 15, name: t('js.admin.orders.index.per_page', results: 15)}, + {id: 50, name: t('js.admin.orders.index.per_page', results: 50)}, + {id: 100, name: t('js.admin.orders.index.per_page', results: 100)} + ] $scope.initialise = -> + $scope.per_page = 15 $scope.q = { completed_at_not_null: true } @@ -25,7 +31,7 @@ angular.module("admin.orders").controller "ordersCtrl", ($scope, RequestMonitor, 'q[order_cycle_id_in]': $scope['q']['order_cycle_id_in'], 'q[order_cycle_id_in]': $scope['q']['order_cycle_id_in'], 'q[s]': $scope.sorting || 'id desc', - per_page: $scope.per_page || 15, + per_page: $scope.per_page, page: page }) diff --git a/app/assets/stylesheets/admin/components/per_page_controls.scss b/app/assets/stylesheets/admin/components/per_page_controls.scss new file mode 100644 index 0000000000..34ae9f7737 --- /dev/null +++ b/app/assets/stylesheets/admin/components/per_page_controls.scss @@ -0,0 +1,7 @@ +.per-page { + float: left; + + .per-page-feedback { + margin-left: 1em; + } +} diff --git a/app/controllers/spree/admin/orders_controller_decorator.rb b/app/controllers/spree/admin/orders_controller_decorator.rb index 6df8943966..88110da52f 100644 --- a/app/controllers/spree/admin/orders_controller_decorator.rb +++ b/app/controllers/spree/admin/orders_controller_decorator.rb @@ -65,8 +65,9 @@ Spree::Admin::OrdersController.class_eval do orders: ActiveModel::ArraySerializer.new(@orders, each_serializer: Api::Admin::OrderSerializer), pagination: { results: @orders.total_count, - pages: @orders.num_pages, - page: params[:page].to_i + pages: @orders.num_pages.to_i, + page: params[:page].to_i, + per_page: params[:per_page].to_i } } end diff --git a/app/views/spree/admin/orders/_per_page_controls.html.haml b/app/views/spree/admin/orders/_per_page_controls.html.haml new file mode 100644 index 0000000000..7a0c3fd081 --- /dev/null +++ b/app/views/spree/admin/orders/_per_page_controls.html.haml @@ -0,0 +1,6 @@ +.per-page{'ng-show' => '!RequestMonitor.loading && orders.length > 0'} + %input.per-page-select.ofn-select2{type: 'number', data: 'per_page_options', 'ng-model' => 'per_page'} + + %span.per-page-feedback + {{ 'spree.admin.orders.index.results_found' | t:{number: pagination.results} }} + {{ 'spree.admin.orders.index.viewing' | t:{start: ((pagination.page -1) * pagination.per_page) +1, end: ((pagination.page -1) * pagination.per_page) + orders.length} }} diff --git a/app/views/spree/admin/orders/index.html.haml b/app/views/spree/admin/orders/index.html.haml index 159ca01238..1dc35e308a 100644 --- a/app/views/spree/admin/orders/index.html.haml +++ b/app/views/spree/admin/orders/index.html.haml @@ -16,6 +16,9 @@ - content_for :table_filter do = render partial: 'filters' +.row + = render partial: 'per_page_controls' + %table#listing_orders.index.responsive{width: "100%", 'ng-init' => 'initialise()', 'ng-show' => "!RequestMonitor.loading && orders.length > 0" } %colgroup %col{style: "width: 10%"} diff --git a/config/locales/en.yml b/config/locales/en.yml index ea6a746d97..be7e43f7b5 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -2571,6 +2571,9 @@ See the %{link} to find out more about %{sitename}'s features and to start using resolve: Resolve new_tag_rule_dialog: select_rule_type: "Select a rule type:" + orders: + index: + per_page: "%{results} per page" resend_user_email_confirmation: resend: "Resend" sending: "Resend..." @@ -2667,6 +2670,8 @@ See the %{link} to find out more about %{sitename}'s features and to start using next: "Next" loading: "Loading" no_orders_found: "No Orders Found" + results_found: "%{number} Results found." + viewing: "Viewing %{start} to %{end}." invoice: issued_on: Issued on tax_invoice: TAX INVOICE From fcff83592204923d6be0b9efec69b712cbcf6b15 Mon Sep 17 00:00:00 2001 From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com> Date: Fri, 12 Oct 2018 17:06:42 +0100 Subject: [PATCH 2/2] Update results on dropdown select --- app/views/spree/admin/orders/_per_page_controls.html.haml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/spree/admin/orders/_per_page_controls.html.haml b/app/views/spree/admin/orders/_per_page_controls.html.haml index 7a0c3fd081..87e6c50dba 100644 --- a/app/views/spree/admin/orders/_per_page_controls.html.haml +++ b/app/views/spree/admin/orders/_per_page_controls.html.haml @@ -1,5 +1,5 @@ .per-page{'ng-show' => '!RequestMonitor.loading && orders.length > 0'} - %input.per-page-select.ofn-select2{type: 'number', data: 'per_page_options', 'ng-model' => 'per_page'} + %input.per-page-select.ofn-select2{type: 'number', data: 'per_page_options', 'ng-model' => 'per_page', 'ng-change' => 'fetchResults()'} %span.per-page-feedback {{ 'spree.admin.orders.index.results_found' | t:{number: pagination.results} }}