Merge branch 'master' into cute-little-statistics
This commit is contained in:
commit
a59dfd0d51
4 changed files with 57 additions and 30 deletions
|
@ -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
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
|
@ -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
|
||||||
|
|
26
app/assets/stylesheets/transactions.css.scss
Normal file
26
app/assets/stylesheets/transactions.css.scss
Normal 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: '€';
|
||||||
|
}
|
||||||
|
|
|
@ -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) }}
|
||||||
|
|
Loading…
Reference in a new issue