Merge branch 'master' into cute-little-statistics

This commit is contained in:
Felix Van der Jeugt 2015-09-17 15:59:01 +02:00
commit a59dfd0d51
4 changed files with 57 additions and 30 deletions

View file

@ -24,7 +24,8 @@ ready = function() {
$.each($(".select2-selector"), function(index, val) { $.each($(".select2-selector"), function(index, val) {
$(val).select2({ $(val).select2({
width: 'resolve', width: 'resolve',
placeholder: $(".select2-selector") placeholder: $(".select2-selector"),
allowClear: true
}); });
} }
) )

View file

@ -16,11 +16,11 @@ ready = function() {
autoWidth: false, autoWidth: false,
responsive: true, responsive: true,
columns: [ columns: [
{ data: 'time', name: 'Time', width: "15%", className: 'min-tablet-l'}, { data: 'time', name: 'Time', width: "15%", className: 'min-tablet-l date-column'},
{ data: 'amount', name: 'Amount', width: "10%", className: 'min-mobile'}, { data: 'amount', name: 'Amount', width: "10%", className: 'min-mobile amount-column'},
{ data: 'peer', name: 'Peer', width: "15%", className: 'min-mobile'}, { data: 'peer', name: 'Peer', width: "15%", className: 'min-mobile peer-column'},
{ data: 'issuer', name: 'Issuer', width: "15%", className: 'min-desktop'}, { data: 'issuer', name: 'Issuer', width: "15%", className: 'min-desktop issuer-column'},
{ data: 'message', name: 'Message', width: "45%", className: 'min-tablet-p'} { data: 'message', name: 'Message', width: "45%", className: 'min-tablet-p message-column'}
], ],
columnDefs: [ columnDefs: [
{ {
@ -44,21 +44,22 @@ ready = function() {
var filter = $(element); var filter = $(element);
var type = filter.attr('data-input-type'); var type = filter.attr('data-input-type');
var column = table.column(filter.attr('data-filter-name') + ':name'); var column = table.column(filter.attr('data-filter-name') + ':name');
console.log(column); var refreshTable = function() {
filter.find('input').on('keyup change', function() { var value = null
var value = null if(filter.hasClass('bound')) {
if(filter.hasClass('bound')) { var lower = filter.find('.lower-bound');
var lower = filter.find('.lower-bound'); var upper = filter.find('.upper-bound');
var upper = filter.find('.upper-bound'); value = lower.val() + '~' + upper.val();
value = lower.val() + '~' + upper.val(); } else {
} else { value = $(this).val();
value = $(this).val(); }
} value = filter.attr('data-input-type') + ':' + value;
value = filter.attr('data-input-type') + ':' + value; if(column.search() !== value) {
if(column.search() !== value) { column.search(value).draw();
column.search(value).draw(); }
} };
}); filter.find('.value-thing').on('change', refreshTable);
filter.find('.value-thing.live-updating').on('keyup', refreshTable);
}); });
// filters // filters

View file

@ -0,0 +1,26 @@
// Alignment of datatable columns.
.date-column,
.amount-column {
text-align: right;
}
.peer-column,
.issuer-column {
text-align: center;
}
.message-column {
text-align: left;
}
// Dates aren't that important
td.date-column {
color: #BBB;
}
// Love them euro signs
td.amount-column:before {
content: '';
}

View file

@ -15,14 +15,13 @@
.input-group .input-group
%span.input-group-addon %span.input-group-addon
%span.glyphicon.glyphicon-calendar %span.glyphicon.glyphicon-calendar
%input.lower-bound.form-control.filter-align{type: 'date', %input.lower-bound.form-control.filter-align.value-thing.pure-group-addon{type: 'date',
placeholder: 'After', class: 'pure-group-addon'} placeholder: 'After'}
.col-md-6 .col-md-6
.input-group .input-group
%span.input-group-addon %span.input-group-addon
%span.glyphicon.glyphicon-calendar %span.glyphicon.glyphicon-calendar
%input.upper-bound.form-control.filter-align{type: 'date', %input.upper-bound.form-control.filter-align.value-thing.pure-group-addon{type: 'date', placeholder: 'Before' }
placeholder: 'Before', class: 'pure-group-addon'}
.bound.input-listen.pure-u-1{ 'data-input-type': 'number-range', .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range',
'data-filter-name': 'Amount' } 'data-filter-name': 'Amount' }
.row .row
@ -30,28 +29,28 @@
.input-group .input-group
%span.input-group-addon %span.input-group-addon
%span.glyphicon.glyphicon-euro %span.glyphicon.glyphicon-euro
%input.lower-bound.form-control.filter-align{type: 'number', %input.lower-bound.form-control.filter-align.value-thing{type: 'number',
placeholder: 'Minimum'} placeholder: 'Minimum'}
.col-md-6 .col-md-6
.input-group .input-group
%span.input-group-addon %span.input-group-addon
%span.glyphicon.glyphicon-euro %span.glyphicon.glyphicon-euro
%input.upper-bound.form-control.filter-align{type: 'number', %input.upper-bound.form-control.filter-align.value-thing{type: 'number',
placeholder: 'Maximum'} placeholder: 'Maximum'}
.row .row
.col-md-4 .col-md-4
.input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Issuer' } .input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Issuer' }
= grouped_collection_select nil, nil, [User, Client], :all, :name, :name, :name, = grouped_collection_select nil, nil, [User, Client], :all, :name, :name, :name,
{ include_blank: true }, { include_blank: true },
{ data: { placeholder: "Filter on Issuer" }, class: "select2-selector form-control" } { data: { placeholder: "Filter on Issuer" }, class: "select2-selector form-control value-thing" }
.col-md-4 .col-md-4
.input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Peer' } .input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Peer' }
= select_tag nil, = select_tag nil,
options_from_collection_for_select(User.all.order(:name), :name, :name), options_from_collection_for_select(User.all.order(:name), :name, :name),
include_blank: true, class: "select2-selector form-control", data: { placeholder: "Filter on Peer" } include_blank: true, class: "select2-selector form-control value-thing", data: { placeholder: "Filter on Peer" }
.col-md-4 .col-md-4
.input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Message' } .input-listen{ 'data-input-type': 'text', 'data-filter-name': 'Message' }
%input{type: 'text', placeholder: 'Filter on Message', %input.live-updating.value-thing{type: 'text', placeholder: 'Filter on Message',
class: "form-control" } class: "form-control" }
%table#transactions.pure-table.pure-table-striped{data: { source: user_path(@user) }} %table#transactions.pure-table.pure-table-striped{data: { source: user_path(@user) }}