Merge pull request #2379 from consul/advanced-filters-design

Advanced filters design
This commit is contained in:
María Checa
2018-01-25 11:53:07 +01:00
committed by GitHub
7 changed files with 99 additions and 53 deletions

View File

@@ -9,7 +9,7 @@
// 07. Legislation
// 08. CMS
// 09. Map
// 10. Budget phases
// 10. Budgets
//
// 01. Global styles
@@ -1034,8 +1034,33 @@ table {
height: 0;
}
// 10. Budget phases
// 10. Budgets
// -----------------
.advanced-filters {
margin: $line-height 0;
@include breakpoint(medium) {
margin: $line-height / 2 0 0;
}
}
.advanced-filters-content {
background: $highlight;
clear: both;
padding: $line-height / 2;
margin: $line-height 0;
.filter {
display: inline-block;
margin: 0 $line-height / 2;
}
.button {
margin-top: $line-height / 2;
}
}
.budget-phase-enabled {
font-weight: bold;
padding-left: rem-calc(20);

View File

@@ -1525,7 +1525,7 @@
h3 {
background: $budget;
color: white;
color: #fff;
display: inline-block;
}

View File

@@ -1,27 +1,44 @@
<div id="advanced-filters" class="callout primary">
<%= link_to "#advanced_filters_content",
data: {toggle: "advanced_filters"},
class: "advanced-filters float-right" do %>
<%= t("admin.budget_investments.index.advanced_filters") %>
<% end %>
<div id="advanced_filters" class="row expanded advanced-filters-content hide" data-toggler=".hide">
<%= form_tag(admin_budget_budget_investments_path(budget: @budget,
filter: params[:filter],
second_filter: params[:second_filter],
max_per_heading: params[:max_per_heading],
page: 1), method: :get, remote: true, enforce_utf8: false) do %>
<div class="small-12 medium-8 large-10 column">
<span class="filter">
<%= check_box_tag :second_filter, "feasible" %>
<%= t("#{i18n_namespace}.filters.feasible") %>
</span>
<%= check_box_tag :second_filter, "feasible" %>
<%= t("#{i18n_namespace}.filters.feasible") %>
<span class="filter">
<%= check_box_tag :second_filter, "selected" %>
<%= t("#{i18n_namespace}.filters.selected") %>
</span>
<%= check_box_tag :second_filter, "selected" %>
<%= t("#{i18n_namespace}.filters.selected") %>
<span class="filter">
<%= check_box_tag :second_filter, "undecided" %>
<%= t("#{i18n_namespace}.filters.undecided") %>
</span>
<%= check_box_tag :second_filter, "undecided" %>
<%= t("#{i18n_namespace}.filters.undecided") %>
<span class="filter">
<%= check_box_tag :second_filter, "unfeasible" %>
<%= t("#{i18n_namespace}.filters.unfeasible") %>
</span>
<%= check_box_tag :second_filter, "unfeasible" %>
<%= t("#{i18n_namespace}.filters.unfeasible") %>
<div class="large-1">
<%= text_field_tag :max_per_heading %>
<%= t("#{i18n_namespace}.filters.max_per_heading") %>
<span class="filter">
<strong><%= t("#{i18n_namespace}.filters.max_per_heading") %></strong>
<%= text_field_tag :max_per_heading %>
</span>
</div>
<%= submit_tag t("#{i18n_namespace}.filters.button"), class: "button small float-right" %>
<div class="small-12 medium-4 large-2 column">
<%= submit_tag t("#{i18n_namespace}.filters.button"), class: "button expanded" %>
</div>
<% end %>
</div>

View File

@@ -1,40 +1,38 @@
<h2 class="inline-block"><%= @budget.name %> - <%= t("admin.budget_investments.index.title") %></h2>
<div class="row margin">
<%= form_tag(admin_budget_budget_investments_path(budget: @budget), method: :get, enforce_utf8: false) do %>
<div class="small-12 medium-3 column">
<%= select_tag :administrator_id,
options_for_select(admin_select_options, params[:administrator_id]),
{ prompt: t("admin.budget_investments.index.administrator_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<%= form_tag(admin_budget_budget_investments_path(budget: @budget), method: :get, enforce_utf8: false) do %>
<div class="small-12 medium-3 column">
<%= select_tag :administrator_id,
options_for_select(admin_select_options, params[:administrator_id]),
{ prompt: t("admin.budget_investments.index.administrator_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :valuator_id,
options_for_select(valuator_select_options, params[:valuator_id]),
{ prompt: t("admin.budget_investments.index.valuator_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :valuator_id,
options_for_select(valuator_select_options, params[:valuator_id]),
{ prompt: t("admin.budget_investments.index.valuator_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :heading_id,
options_for_select(budget_heading_select_options(@budget), params[:heading_id]),
{ prompt: t("admin.budget_investments.index.heading_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :heading_id,
options_for_select(budget_heading_select_options(@budget), params[:heading_id]),
{ prompt: t("admin.budget_investments.index.heading_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :tag_name,
options_for_select(investment_tags_select_options, params[:tag_name]),
{ prompt: t("admin.budget_investments.index.tags_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<% end %>
</div>
<div class="small-12 medium-3 column">
<%= select_tag :tag_name,
options_for_select(investment_tags_select_options, params[:tag_name]),
{ prompt: t("admin.budget_investments.index.tags_filter_all"),
label: false,
class: "js-submit-on-change" } %>
</div>
<% end %>
<%= render "advanced_filters", i18n_namespace: "admin.budget_investments.index" %>

View File

@@ -137,6 +137,7 @@ en:
administrator_filter_all: All administrators
valuator_filter_all: All valuators
tags_filter_all: All tags
advanced_filters: Advanced filters
filters:
all: All
without_admin: Without assigned admin

View File

@@ -137,6 +137,7 @@ es:
administrator_filter_all: Todos los administradores
valuator_filter_all: Todos los evaluadores
tags_filter_all: Todas las etiquetas
advanced_filters: Filtros avanzados
filters:
all: Todos
without_admin: Sin administrador

View File

@@ -314,6 +314,7 @@ feature 'Admin budget investments' do
expect(page).to have_link("Street with #{n} supports")
end
click_link 'Advanced filters'
fill_in "max_per_heading", with: 5
click_button 'Filter'
@@ -628,7 +629,8 @@ feature 'Admin budget investments' do
expect(page).to have_content(selected_bi.title)
expect(page).to have_content(winner_bi.title)
within('#advanced-filters') { find(:css, "#second_filter[value='feasible']").set(true) }
click_link 'Advanced filters'
within('#advanced_filters') { find(:css, "#second_filter[value='feasible']").set(true) }
click_button 'Filter'
expect(page).not_to have_content(unfeasible_bi.title)
@@ -637,7 +639,7 @@ feature 'Admin budget investments' do
expect(page).to have_content(selected_bi.title)
expect(page).to have_content(winner_bi.title)
within('#advanced-filters') { find(:css, "#second_filter[value='selected']").set(true) }
within('#advanced_filters') { find(:css, "#second_filter[value='selected']").set(true) }
click_button 'Filter'
expect(page).not_to have_content(unfeasible_bi.title)
@@ -686,7 +688,8 @@ feature 'Admin budget investments' do
expect(page).to have_link('Selected')
end
within('#advanced-filters') { find(:css, "#second_filter[value='selected']").set(true) }
click_link 'Advanced filters'
within('#advanced_filters') { find(:css, "#second_filter[value='selected']").set(true) }
click_button 'Filter'
within("#budget_investment_#{feasible_vf_bi.id}") do
@@ -697,7 +700,8 @@ feature 'Admin budget investments' do
scenario "Unselecting an investment", :js do
visit admin_budget_budget_investments_path(@budget)
within('#advanced-filters') { find(:css, "#second_filter[value='selected']").set(true) }
click_link 'Advanced filters'
within('#advanced_filters') { find(:css, "#second_filter[value='selected']").set(true) }
click_button 'Filter'
expect(page).to have_content('There are 2 investments')