Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

improve on the range selection - resolves #1956

Browse source
This commit is contained in:
Muhammad Nuzaihan 2018-05-11 13:13:36 +08:00
parent 3558f9a0ec
commit 813ed09d5f
No known key found for this signature in database
GPG key ID: 949F5D5715249C07
4 changed files with 121 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app/assets/javascripts/app/controllers/_ui_element/time_range.coffee
View file

@ -10,8 +10,28 @@ class App.UiElement.time_range
for key, value of ranges
ranges[key] = App.i18n.translateInline(value)
values = {}
for count in [0..31]
values[count.toString()] = count.toString()
range = 'minute'
if attribute.value && attribute.value.range
range = attribute.value.range
values =
minute: [1..120]
hour: [1..48]
day: [1..31]
month: [1..12]
year: [1..20]
$( App.view('generic/time_range')( attribute: attribute, ranges: ranges, values: values ) )
element = $( App.view('generic/time_range')(attribute: attribute, ranges: ranges))
@localRenderPulldown(element.filter('.js-valueRangeSelector'), values[range], attribute)
element.find('select.form-control.js-range').on('change', (e) =>
range = $(e.currentTarget).val()
@localRenderPulldown($(e.currentTarget).closest('.js-filterElement').find('.js-valueRangeSelector'), values[range], attribute)
)
element
@localRenderPulldown: (el, range, attribute) ->
return if !range
values = {}
for count in range
values[count.toString()] = count.toString()
select = App.view('generic/time_range_value_selector')(attribute: attribute, values: values)
el.html(select)

9
app/assets/javascripts/app/views/generic/time_range.jst.eco
View file

@ -1,11 +1,4 @@
<div class="controls u-positionOrigin">
<select class="form-control js-value" name="<%= @attribute.name %>::value">
<% for key, value of @values: %>
<option value="<%= key %>" <% if @attribute.value && @attribute.value.value.toString() is key.toString(): %>selected<% end %>><%- value %></option>
<% end %>
</select>
<%- @Icon('arrow-down', 'dropdown-arrow') %>
</div>
<div class="controls u-positionOrigin js-valueRangeSelector"></div>
<div class="controls u-positionOrigin">
<select class="form-control js-range" name="<%= @attribute.name %>::range">
<% for key, value of @ranges: %>

6
app/assets/javascripts/app/views/generic/time_range_value_selector.jst.eco Normal file
View file

@ -0,0 +1,6 @@
<select class="form-control js-value" name="<%= @attribute.name %>::value">
<% for key, value of @values: %>
<option value="<%= key %>" <% if @attribute.value && @attribute.value.value.toString() is key.toString(): %>selected<% end %>><%- value %></option>
<% end %>
</select>
<%- @Icon('arrow-down', 'dropdown-arrow') %>

93
public/assets/tests/form.js
View file

@ -1266,10 +1266,98 @@ test("object manager form 3", function() {
});
test("time range form 1", function() {
$('#forms').append('<hr><h1>time range form 1</h1><form id="form14"></form>')
var el = $('#form14')
var defaults = {}
new App.ControllerForm({
el: el,
model: {
configure_attributes: [
{ name: 'time_range', display: 'Format', tag: 'time_range', null: false },
],
},
params: $.extend(defaults, { object: 'Ticket' }),
autofocus: true
});
var params = App.ControllerForm.params(el)
var test_params = {
"time_range": {
"range": "minute",
"value": "1"
}
}
deepEqual(params, test_params, 'base form param range check')
el.find('.js-range').val('minute').trigger('change')
el.find('.js-valueRangeSelector .js-value').val('120').trigger('change')
params = App.ControllerForm.params(el)
test_params = {
"time_range": {
"range": "minute",
"value": "120"
}
}
deepEqual(params, test_params, 'form param minute range check')
el.find('.js-range').val('hour').trigger('change')
el.find('.js-valueRangeSelector .js-value').val('48').trigger('change')
params = App.ControllerForm.params(el)
test_params = {
"time_range": {
"range": "hour",
"value": "48"
}
}
deepEqual(params, test_params, 'form param hour range check')
el.find('.js-range').val('day').trigger('change')
el.find('.js-valueRangeSelector .js-value').val('31').trigger('change')
params = App.ControllerForm.params(el)
test_params = {
"time_range": {
"range": "day",
"value": "31"
}
}
deepEqual(params, test_params, 'form param day range check')
el.find('.js-range').val('month').trigger('change')
el.find('.js-valueRangeSelector .js-value').val('12').trigger('change')
params = App.ControllerForm.params(el)
test_params = {
"time_range": {
"range": "month",
"value": "12"
}
}
deepEqual(params, test_params, 'form param month range check')
el.find('.js-range').val('year').trigger('change')
el.find('.js-valueRangeSelector .js-value').val('20').trigger('change')
params = App.ControllerForm.params(el)
test_params = {
"time_range": {
"range": "year",
"value": "20"
}
}
deepEqual(params, test_params, 'form param year range check')
});
test("form select with empty option list", function() {
$('#forms').append('<hr><h1>form select with empty option list</h1><form id="form14"></form>')
var el = $('#form14')
$('#forms').append('<hr><h1>form select with empty option list</h1><form id="form15"></form>')
var el = $('#form15')
var defaults = {}
new App.ControllerForm({
el: el,
@ -1296,5 +1384,4 @@ test("form select with empty option list", function() {
select6: 'B',
}
deepEqual(params, test_params)
});