Removed inline JS and improved dropdown labels
This commit is contained in:
parent
f157a9e514
commit
922b38a0be
|
@ -13,6 +13,7 @@
|
||||||
this.perPage = this.el.data('perPage');
|
this.perPage = this.el.data('perPage');
|
||||||
this.clearListeners();
|
this.clearListeners();
|
||||||
this.initBtnListeners();
|
this.initBtnListeners();
|
||||||
|
this.initFilters();
|
||||||
}
|
}
|
||||||
|
|
||||||
Todos.prototype.clearListeners = function() {
|
Todos.prototype.clearListeners = function() {
|
||||||
|
@ -27,6 +28,61 @@
|
||||||
return $('.todo').on('click', this.goToTodoUrl);
|
return $('.todo').on('click', this.goToTodoUrl);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Todos.prototype.initFilters = function() {
|
||||||
|
new UsersSelect();
|
||||||
|
this.initProjectFilterDropdown();
|
||||||
|
this.initTypeFilterDropdown();
|
||||||
|
this.initActionFilterDropdown();
|
||||||
|
|
||||||
|
$('form.filter-form').on('submit', function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
Turbolinks.visit(this.action + '&' + $(this).serialize());
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
Todos.prototype.initProjectFilterDropdown = function() {
|
||||||
|
$projectDropdown = $('.js-project-search');
|
||||||
|
$projectDropdown.glDropdown({
|
||||||
|
filterable: true,
|
||||||
|
selectable: true,
|
||||||
|
fieldName: 'project_id',
|
||||||
|
data: $projectDropdown.data('data'),
|
||||||
|
clicked: function() {
|
||||||
|
if ($projectDropdown.hasClass('js-filter-submit')) {
|
||||||
|
return $projectDropdown.closest('form.filter-form').submit();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
Todos.prototype.initTypeFilterDropdown = function() {
|
||||||
|
$typeDropdown = $('.js-type-search');
|
||||||
|
$typeDropdown.glDropdown({
|
||||||
|
selectable: true,
|
||||||
|
fieldName: 'type',
|
||||||
|
data: $typeDropdown.data('data'),
|
||||||
|
clicked: function() {
|
||||||
|
if ($typeDropdown.hasClass('js-filter-submit')) {
|
||||||
|
return $typeDropdown.closest('form.filter-form').submit();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
Todos.prototype.initActionFilterDropdown = function() {
|
||||||
|
$actionDropdown = $('.js-action-search');
|
||||||
|
$actionDropdown.glDropdown({
|
||||||
|
selectable: true,
|
||||||
|
fieldName: 'action_id',
|
||||||
|
data: $actionDropdown.data('data'),
|
||||||
|
clicked: function() {
|
||||||
|
if ($actionDropdown.hasClass('js-filter-submit')) {
|
||||||
|
return $actionDropdown.closest('form.filter-form').submit();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
Todos.prototype.doneClicked = function(e) {
|
Todos.prototype.doneClicked = function(e) {
|
||||||
var $this;
|
var $this;
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
|
@ -98,12 +98,22 @@ module TodosHelper
|
||||||
|
|
||||||
def todo_types_options
|
def todo_types_options
|
||||||
[
|
[
|
||||||
{ text: 'Any Type', id: '' },
|
{ id: '', text: 'Any Type' },
|
||||||
{ text: 'Issue', id: 'Issue' },
|
{ id: 'Issue', text: 'Issue' },
|
||||||
{ text: 'Merge Request', id: 'MergeRequest' }
|
{ id: 'MergeRequest', text: 'Merge Request' }
|
||||||
]
|
]
|
||||||
end
|
end
|
||||||
|
|
||||||
|
def todo_actions_dropdown_label(selected_action_id, default_action)
|
||||||
|
selected_action = todo_actions_options.find { |action| action[:id] == selected_action_id.to_i}
|
||||||
|
selected_action ? selected_action[:text] : default_action
|
||||||
|
end
|
||||||
|
|
||||||
|
def todo_types_dropdown_label(selected_type, default_type)
|
||||||
|
selected_type = todo_types_options.find { |type| type[:id] == selected_type && type[:id] != '' }
|
||||||
|
selected_type ? selected_type[:text] : default_type
|
||||||
|
end
|
||||||
|
|
||||||
private
|
private
|
||||||
|
|
||||||
def show_todo_state?(todo)
|
def show_todo_state?(todo)
|
||||||
|
|
|
@ -40,13 +40,13 @@
|
||||||
.filter-item.inline
|
.filter-item.inline
|
||||||
- if params[:type].present?
|
- if params[:type].present?
|
||||||
= hidden_field_tag(:type, params[:type])
|
= hidden_field_tag(:type, params[:type])
|
||||||
= dropdown_tag(params[:type] || 'Type', options: { toggle_class: 'js-type-search js-filter-submit', dropdown_class: 'dropdown-menu-selectable dropdown-menu-type js-filter-submit',
|
= dropdown_tag(todo_types_dropdown_label(params[:type], 'Type'), options: { toggle_class: 'js-type-search js-filter-submit', dropdown_class: 'dropdown-menu-selectable dropdown-menu-type js-filter-submit',
|
||||||
data: { data: todo_types_options, selected: params[:type], field_name: 'type', default_label: 'Type' } })
|
data: { data: todo_types_options } })
|
||||||
.filter-item.inline.actions-filter
|
.filter-item.inline.actions-filter
|
||||||
- if params[:action_id].present?
|
- if params[:action_id].present?
|
||||||
= hidden_field_tag(:action_id, params[:action_id])
|
= hidden_field_tag(:action_id, params[:action_id])
|
||||||
= dropdown_tag(params[:action_id] || 'Action', options: { toggle_class: 'js-action-search js-filter-submit', dropdown_class: 'dropdown-menu-selectable dropdown-menu-action js-filter-submit',
|
= dropdown_tag(todo_actions_dropdown_label(params[:action_id], 'Action'), options: { toggle_class: 'js-action-search js-filter-submit', dropdown_class: 'dropdown-menu-selectable dropdown-menu-action js-filter-submit',
|
||||||
data: { data: todo_actions_options, selected: params[:action_id], field_name: 'action_id', default_label: 'Action' } })
|
data: { data: todo_actions_options }})
|
||||||
.pull-right
|
.pull-right
|
||||||
.dropdown.inline.prepend-left-10
|
.dropdown.inline.prepend-left-10
|
||||||
%button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
|
%button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
|
||||||
|
@ -80,48 +80,3 @@
|
||||||
= paginate @todos, theme: "gitlab"
|
= paginate @todos, theme: "gitlab"
|
||||||
- else
|
- else
|
||||||
.nothing-here-block You're all done!
|
.nothing-here-block You're all done!
|
||||||
|
|
||||||
:javascript
|
|
||||||
new UsersSelect();
|
|
||||||
|
|
||||||
$projectDropdown = $('.js-project-search');
|
|
||||||
$projectDropdown.glDropdown({
|
|
||||||
filterable: true,
|
|
||||||
selectable: true,
|
|
||||||
fieldName: 'project_id',
|
|
||||||
data: $projectDropdown.data('data'),
|
|
||||||
clicked: function() {
|
|
||||||
if ($projectDropdown.hasClass('js-filter-submit')) {
|
|
||||||
return $projectDropdown.closest('form').submit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$typeDropdown = $('.js-type-search');
|
|
||||||
$typeDropdown.glDropdown({
|
|
||||||
selectable: true,
|
|
||||||
fieldName: 'type_id',
|
|
||||||
data: $typeDropdown.data('data'),
|
|
||||||
clicked: function() {
|
|
||||||
if ($typeDropdown.hasClass('js-filter-submit')) {
|
|
||||||
return $typeDropdown.closest('form').submit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$actionDropdown = $('.js-action-search');
|
|
||||||
$actionDropdown.glDropdown({
|
|
||||||
selectable: true,
|
|
||||||
fieldName: 'action_id',
|
|
||||||
data: $actionDropdown.data('data'),
|
|
||||||
clicked: function() {
|
|
||||||
if ($actionDropdown.hasClass('js-filter-submit')) {
|
|
||||||
return $actionDropdown.closest('form').submit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('form.filter-form').on('submit', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
Turbolinks.visit(this.action + '&' + $(this).serialize());
|
|
||||||
});
|
|
||||||
|
|
Loading…
Reference in New Issue