#251: updated pagination, some refactoring
This commit is contained in:
parent
87f7aff544
commit
935cda4a0a
|
@ -1,23 +1,29 @@
|
|||
RosaABF.controller('BuildListsController', ['$scope', '$http', '$location', '$timeout', function($scope, $http, $location, $timeout) {
|
||||
|
||||
$scope.filter = null;
|
||||
$scope.params = null;
|
||||
$scope.first_run = true;
|
||||
$scope.server_status = null;
|
||||
$scope.build_lists = [];
|
||||
$scope.isRequest = false; // Disable 'Search' button
|
||||
$scope.will_paginate = '';
|
||||
$scope.pages = [];
|
||||
|
||||
// Fixes: redirect to page after form submit
|
||||
$("#monitoring_filter").on('submit', function(){ return false; });
|
||||
|
||||
$scope.getBuildLists = function() {
|
||||
// Disable 'Search' button
|
||||
$scope.isRequest = true;
|
||||
|
||||
$http.get('/build_lists.json', {params: $location.search()}).success(function(results) {
|
||||
// Render Server status
|
||||
$scope.server_status = results.server_status;
|
||||
|
||||
// TMP fields
|
||||
var dictionary = results.dictionary;
|
||||
var build_lists = [];
|
||||
var groups = {};
|
||||
|
||||
// Grouping of build_lists
|
||||
_.each(results.build_lists, function(r){
|
||||
var bl = new BuildList(r, dictionary);
|
||||
var key = bl.project_id + '-' + bl.commit_hash + '-' + bl.user_id;
|
||||
|
@ -29,14 +35,18 @@ RosaABF.controller('BuildListsController', ['$scope', '$http', '$location', '$ti
|
|||
}
|
||||
});
|
||||
|
||||
// Adds all build_lists into the table (group by group)
|
||||
$scope.build_lists = [];
|
||||
_.each(build_lists, function(bl){
|
||||
_.each(bl.related, function(b){ $scope.build_lists.push(b); });
|
||||
});
|
||||
|
||||
$scope.will_paginate = results.will_paginate;
|
||||
$scope.isRequest = false;
|
||||
// Render pagination
|
||||
$scope.pages = results.pages;
|
||||
// Enable 'Search' button
|
||||
$scope.isRequest = false;
|
||||
}).error(function(data, status, headers, config) {
|
||||
// Enable 'Search' button
|
||||
$scope.isRequest = false;
|
||||
});;
|
||||
}
|
||||
|
@ -45,6 +55,7 @@ RosaABF.controller('BuildListsController', ['$scope', '$http', '$location', '$ti
|
|||
build_list.relatedHidden = false;
|
||||
_.each(build_list.related, function(bl){
|
||||
bl.show = true;
|
||||
// Waits for render of build_lists
|
||||
$timeout(function() {
|
||||
$('#build-list-' + bl.id + ' td:visible').effect('highlight', {}, 1000);
|
||||
}, 100);
|
||||
|
@ -57,57 +68,51 @@ RosaABF.controller('BuildListsController', ['$scope', '$http', '$location', '$ti
|
|||
build_list.show = true;
|
||||
}
|
||||
|
||||
$scope.defaultValues = {
|
||||
'filter[ownership]': 'owned',
|
||||
'per_page': 25,
|
||||
'page': 1
|
||||
}
|
||||
$scope.cancelRefresh = null;
|
||||
$scope.refresh = function(force) {
|
||||
if ($('#autoreload').is(':checked') || force) {
|
||||
if ($.isEmptyObject($location.search()) || !$scope.first_run) {
|
||||
var array = $("#monitoring_filter").serializeArray();
|
||||
var params = {};
|
||||
for(i=0; i<array.length; i++){
|
||||
var a = array[i];
|
||||
if (a.value) {
|
||||
params[a.name] = a.value.match(/^\{/) ? $scope.defaultValues[a.name] : a.value;
|
||||
}
|
||||
}
|
||||
if (force) { params.page = 1; }
|
||||
$location.search(params);
|
||||
}
|
||||
$scope.first_run = false;
|
||||
var params = {};
|
||||
_.each($("#monitoring_filter").serializeArray(), function(a){
|
||||
if (a.value) { params[a.name] = a.value; }
|
||||
});
|
||||
$location.search(params);
|
||||
$scope.getBuildLists();
|
||||
}
|
||||
if (!force) {
|
||||
$scope.cancelRefresh = $timeout($scope.refresh, 60000);
|
||||
}
|
||||
}
|
||||
$scope.refresh();
|
||||
|
||||
|
||||
$scope.$on('$locationChangeSuccess', function(event) {
|
||||
$scope.updateFilter();
|
||||
$scope.updateParams();
|
||||
});
|
||||
|
||||
$scope.updateFilter = function() {
|
||||
$scope.updateParams = function() {
|
||||
var params = $location.search();
|
||||
var current_page = $scope.filter ? $scope.filter.page : null;
|
||||
$scope.filter = {
|
||||
page: params['page'] || $scope.defaultValues['page'],
|
||||
per_page: params['per_page'] || $scope.defaultValues['per_page'],
|
||||
ownership: params['filter[ownership]'] || $scope.defaultValues['filter[ownership]'],
|
||||
status: params['filter[status]'],
|
||||
platform_id: params['filter[platform_id]'],
|
||||
arch_id: params['filter[arch_id]'],
|
||||
mass_build_id: params['filter[mass_build_id]'],
|
||||
updated_at_start: params['filter[updated_at_start]'],
|
||||
updated_at_end: params['filter[updated_at_end]'],
|
||||
project_name: params['filter[project_name]'],
|
||||
id: params['filter[id]']
|
||||
$scope.params = {
|
||||
page: params.page || 1,
|
||||
per_page: params.per_page || 25,
|
||||
filter: {
|
||||
ownership: params['filter[ownership]'] || 'owned',
|
||||
status: params['filter[status]'],
|
||||
platform_id: params['filter[platform_id]'],
|
||||
arch_id: params['filter[arch_id]'],
|
||||
mass_build_id: params['filter[mass_build_id]'],
|
||||
updated_at_start: params['filter[updated_at_start]'],
|
||||
updated_at_end: params['filter[updated_at_end]'],
|
||||
project_name: params['filter[project_name]'],
|
||||
id: params['filter[id]']
|
||||
}
|
||||
}
|
||||
if (current_page && current_page != $scope.filter.page) { $scope.getBuildLists(); }
|
||||
}
|
||||
|
||||
$scope.goToPage = function(number) {
|
||||
$location.search('page', number);
|
||||
$scope.getBuildLists();
|
||||
}
|
||||
|
||||
$scope.updateParams();
|
||||
// Waits for render of filters
|
||||
$timeout($scope.refresh, 100);
|
||||
}]);
|
|
@ -2090,3 +2090,17 @@ table tbody {
|
|||
border-bottom: 2px solid #125687;
|
||||
}
|
||||
}
|
||||
|
||||
#will_paginate .pagination {
|
||||
div {
|
||||
display: inline-block;
|
||||
margin: 0 2px;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.disabled a {
|
||||
color: #292929;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
|
@ -10,4 +10,14 @@ module PaginateHelper
|
|||
{:page => page, :per_page => per_page}
|
||||
end
|
||||
|
||||
def angularjs_will_paginate(collection_or_options = nil, options = {})
|
||||
if collection_or_options.is_a? Hash
|
||||
options, collection_or_options = collection_or_options, nil
|
||||
end
|
||||
options.merge!(renderer: AngularjsLinkRenderer) unless options[:renderer]
|
||||
options.merge!(next_label: I18n.t('datatables.next_label')) unless options[:next_label]
|
||||
options.merge!(previous_label: I18n.t('datatables.previous_label')) unless options[:previous_label]
|
||||
will_paginate *[collection_or_options, options].compact
|
||||
end
|
||||
|
||||
end
|
||||
|
|
|
@ -14,46 +14,46 @@
|
|||
- if current_user
|
||||
.bordered.nopadding
|
||||
%h3.medium= t("layout.build_lists.ownership.header")
|
||||
=f.hidden_field :ownership, :value => '{{filter.ownership}}'
|
||||
=f.hidden_field :ownership, :value => '{{params.filter.ownership}}'
|
||||
.btn-group
|
||||
- ['owned', (@project ? nil : 'related'), 'everything'].compact.each do |ownership|
|
||||
-options = {'ng-class' =>"{active: filter.ownership == '#{ownership}'}",:value => ownership, :style => (@project ? 'width:50%;' : '')}
|
||||
-options = {'ng-class' =>"{active: params.filter.ownership == '#{ownership}'}",:value => ownership, :style => (@project ? 'width:50%;' : '')}
|
||||
%button.btn.ownership{options}= t "layout.build_lists.ownership.#{ownership}"
|
||||
%h3.medium= t 'number_rows'
|
||||
=hidden_field_tag :per_page, '{{filter.per_page}}'
|
||||
=hidden_field_tag :page, '{{filter.page}}'
|
||||
=hidden_field_tag :per_page, '{{params.per_page}}'
|
||||
=hidden_field_tag :page, '{{params.page}}'
|
||||
.btn-group
|
||||
-BuildList::Filter::PER_PAGE.each do |num|
|
||||
%button.btn.per_page{:value => num, 'ng-class' => "{active: filter.per_page == #{num}}"}=num
|
||||
%button.btn.per_page{:value => num, 'ng-class' => "{active: params.per_page == #{num}}"}=num
|
||||
%h3.medium= t 'activerecord.attributes.build_list.status'
|
||||
.lineForm.aside
|
||||
= f.select :status, BuildList::STATUSES.collect{|status| [BuildList.human_status(status), status]}, {:include_blank => true},
|
||||
html_options.merge(:id => 'status', 'ng-model' => 'filter.status')
|
||||
html_options.merge(:id => 'status', 'ng-model' => 'params.filter.status')
|
||||
.both
|
||||
%br/
|
||||
.column
|
||||
%h3.medium= t 'activerecord.models.platform'
|
||||
.lineForm.aside
|
||||
= f.select :platform_id, availables_main_platforms.collect{|pl| [pl.name, pl.id]}, {:include_blank => true}, html_options.merge(:id => 'platform', 'ng-model' => 'filter.platform_id')
|
||||
= f.select :platform_id, availables_main_platforms.collect{|pl| [pl.name, pl.id]}, {:include_blank => true}, html_options.merge(:id => 'platform', 'ng-model' => 'params.filter.platform_id')
|
||||
%h3.medium= t 'activerecord.attributes.build_list.arch'
|
||||
.lineForm.aside
|
||||
= f.select :arch_id, Arch.recent.collect{|arch| [arch.name, arch.id]}, {:include_blank => true}, html_options.merge(:id => 'architecture', 'ng-model' => 'filter.arch_id')
|
||||
= f.select :arch_id, Arch.recent.collect{|arch| [arch.name, arch.id]}, {:include_blank => true}, html_options.merge(:id => 'architecture', 'ng-model' => 'params.filter.arch_id')
|
||||
%h3.medium= t 'activerecord.models.mass_build'
|
||||
.lineForm.aside
|
||||
= f.select :mass_build_id, mass_build_options, {:include_blank => true},
|
||||
html_options.merge(:id => 'mass_build', 'ng-model' => 'filter.mass_build_id')
|
||||
html_options.merge(:id => 'mass_build', 'ng-model' => 'params.filter.mass_build_id')
|
||||
|
||||
.column
|
||||
-[:updated_at_start, :updated_at_end].each do |attr|
|
||||
-class_name, message = attr == :updated_at_start ? %w[floatleft _on] : %w[floatright until]
|
||||
%div{:class => class_name}
|
||||
%h3.medium= t message
|
||||
=f.text_field attr, :readonly => "readonly", :size => 10, :class => 'mediumheight min input_cleanse', :value => "{{filter.#{attr}}}"
|
||||
=f.text_field attr, :readonly => "readonly", :size => 10, :class => 'mediumheight min input_cleanse', :value => "{{params.filter.#{attr}}}"
|
||||
=link_to image_tag('x.png', :alt => 'x', :class => 'semi'), "#filter_#{attr}", :id => 'updated_at_clear'
|
||||
.both
|
||||
-%w[project_name id].each do |filter|
|
||||
%h3.medium= t "layout.build_lists.#{filter}_search"
|
||||
%input.mediumheight.input_cleanse{:id => "filter_#{filter}", :name => "filter[#{filter}]", :size => "30", :type => "text", :value => "{{filter.#{filter}}}"}
|
||||
%input.mediumheight.input_cleanse{:id => "filter_#{filter}", :name => "filter[#{filter}]", :size => "30", :type => "text", :value => "{{params.filter.#{filter}}}"}
|
||||
%br/
|
||||
%br/
|
||||
.butgrp
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
%span.icon-chevron-up{'ng-hide' => 'bl.relatedHidden', 'ng-click' => 'hideRelated(bl)'}
|
||||
%a{'ng-href' => '{{bl.url}}' } {{bl.id}}
|
||||
%div{'ng-show' => 'bl.hasRelated'}
|
||||
%div.status{'ng-repeat' => 'related in bl.related', :class => '{{related.status_color}}'}
|
||||
.status{'ng-repeat' => 'related in bl.related', :class => '{{related.status_color}}'}
|
||||
|
||||
/ status
|
||||
%td
|
||||
|
@ -57,7 +57,7 @@
|
|||
|
||||
/ arch_short
|
||||
%td{'ng-show' => 'bl.arch'} {{bl.arch.name}}
|
||||
%td{'ng-hide' => 'bl.arch'}= t("layout.arches.unexisted_arch")
|
||||
%td{'ng-hide' => 'bl.arch'}= t('layout.arches.unexisted_arch')
|
||||
|
||||
/ user
|
||||
%td
|
||||
|
@ -68,7 +68,6 @@
|
|||
|
||||
.both
|
||||
|
||||
|
||||
#will_paginate{'ng-bind-html-unsafe' => 'will_paginate'}
|
||||
= render 'shared/angularjs_will_paginate'
|
||||
|
||||
= render @project ? 'projects/base/submenu' : 'projects/build_lists/submenu'
|
||||
|
|
|
@ -34,4 +34,4 @@ end
|
|||
|
||||
json.server_status @build_server_status
|
||||
json.filter @filter.try(:options)
|
||||
json.will_paginate will_paginate(@bls).to_s.gsub(/\/build_lists.json/, '/build_lists#/build_lists').html_safe
|
||||
json.pages angularjs_will_paginate(@bls)
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
#will_paginate{'ng-show' => 'pages'}
|
||||
.pagination
|
||||
%div{'ng-class' => "{'disabled': !page.active}", 'ng-repeat' => 'page in pages', 'ng-switch' => 'page.type'}
|
||||
%a{'ng-switch-when' => 'previous_page', 'ng-click' => 'goToPage(page.number)', :href => ''}
|
||||
= t('datatables.previous_label')
|
||||
%a{'ng-switch-when' => 'first', :href => ''}
|
||||
{{page.number}}
|
||||
%a{'ng-switch-when' => 'page', 'ng-click' => 'goToPage(page.number)', :href => ''}
|
||||
{{page.number}}
|
||||
%a{'ng-switch-when' => 'more', 'ng-click' => 'goToPage(page.number)', :href => ''} …
|
||||
%a{'ng-switch-when' => 'last', 'ng-click' => 'goToPage(page.number)', :href => ''}
|
||||
{{page.number}}
|
||||
%a{'ng-switch-when' => 'next_page', 'ng-click' => 'goToPage(page.number)', :href => ''}
|
||||
= t('datatables.next_label')
|
|
@ -0,0 +1,43 @@
|
|||
class Array
|
||||
def html_safe
|
||||
self
|
||||
end
|
||||
end
|
||||
|
||||
|
||||
class AngularjsLinkRenderer < WillPaginate::ActionView::LinkRenderer
|
||||
|
||||
def to_html
|
||||
pagination.map do |item|
|
||||
item.is_a?(Fixnum) ? page_number(item) : send(item)
|
||||
end
|
||||
end
|
||||
|
||||
protected
|
||||
|
||||
def page_number(page)
|
||||
unless page == current_page
|
||||
{:active => true, :number => page, :type => :page}
|
||||
else
|
||||
{:active => false, :number => page, :type => :first}
|
||||
end
|
||||
end
|
||||
|
||||
def gap
|
||||
nil
|
||||
end
|
||||
|
||||
def next_page
|
||||
num = @collection.current_page < @collection.total_pages && @collection.current_page + 1
|
||||
previous_or_next_page(num, @options[:next_label], :next_page)
|
||||
end
|
||||
|
||||
def previous_or_next_page(page, text, classname)
|
||||
if page
|
||||
{:active => true, :number => page, :type => classname}
|
||||
else
|
||||
{:active => false, :number => page, :type => classname}
|
||||
end
|
||||
end
|
||||
|
||||
end
|
Loading…
Reference in New Issue