Improved wording.
This commit is contained in:
parent
a77b3f77fe
commit
9cf188ca6e
7 changed files with 236 additions and 20 deletions
|
@ -0,0 +1,196 @@
|
|||
class App.UiElement.ticket_perform_action
|
||||
@defaults: ->
|
||||
defaults = ['ticket.state_id']
|
||||
|
||||
groups =
|
||||
ticket:
|
||||
name: 'Ticket'
|
||||
model: 'Ticket'
|
||||
|
||||
# megre config
|
||||
elements = {}
|
||||
for groupKey, groupMeta of groups
|
||||
for row in App[groupMeta.model].configure_attributes
|
||||
|
||||
# ignore passwords and relations
|
||||
if row.type isnt 'password' && row.name.substr(row.name.length-4,4) isnt '_ids'
|
||||
config = _.clone(row)
|
||||
elements["#{groupKey}.#{config.name}"] = config
|
||||
|
||||
[defaults, groups, elements]
|
||||
|
||||
@render: (attribute, params = {}) ->
|
||||
|
||||
[defaults, groups, elements] = @defaults()
|
||||
|
||||
selector = @buildAttributeSelector(groups, elements)
|
||||
|
||||
# return item
|
||||
item = $( App.view('generic/ticket_perform_action')( attribute: attribute ) )
|
||||
item.find('.js-attributeSelector').prepend(selector)
|
||||
|
||||
# add filter
|
||||
item.find('.js-add').bind('click', (e) =>
|
||||
element = $(e.target).closest('.js-filterElement')
|
||||
elementClone = element.clone(true)
|
||||
element.after(elementClone)
|
||||
elementClone.find('.js-attributeSelector select').trigger('change')
|
||||
)
|
||||
|
||||
# remove filter
|
||||
item.find('.js-remove').bind('click', (e) =>
|
||||
$(e.target).closest('.js-filterElement').remove()
|
||||
@rebuildAttributeSelectors(item)
|
||||
)
|
||||
|
||||
# change attribute selector
|
||||
item.find('.js-attributeSelector select').bind('change', (e) =>
|
||||
groupAndAttribute = $(e.target).find('option:selected').attr('value')
|
||||
elementRow = $(e.target).closest('.js-filterElement')
|
||||
|
||||
@rebuildAttributeSelectors(item, elementRow, groupAndAttribute)
|
||||
@buildValue(item, elementRow, groupAndAttribute, elements, undefined, attribute)
|
||||
)
|
||||
|
||||
# build inital params
|
||||
console.log('initial', params[attribute.name])
|
||||
if !_.isEmpty(params[attribute.name])
|
||||
|
||||
selectorExists = false
|
||||
for groupAndAttribute, meta of params[attribute.name]
|
||||
selectorExists = true
|
||||
value = meta.value
|
||||
|
||||
# get selector rows
|
||||
elementFirst = item.find('.js-filterElement').first()
|
||||
elementLast = item.find('.js-filterElement').last()
|
||||
|
||||
# clone, rebuild and append
|
||||
elementClone = elementFirst.clone(true)
|
||||
@rebuildAttributeSelectors(item, elementClone, groupAndAttribute)
|
||||
@buildValue(item, elementClone, groupAndAttribute, elements, value, attribute)
|
||||
elementLast.after(elementClone)
|
||||
|
||||
# remove first dummy row
|
||||
if selectorExists
|
||||
item.find('.js-filterElement').first().remove()
|
||||
|
||||
else
|
||||
for default_row in defaults
|
||||
|
||||
# get selector rows
|
||||
elementFirst = item.find('.js-filterElement').first()
|
||||
elementLast = item.find('.js-filterElement').last()
|
||||
|
||||
# clone, rebuild and append
|
||||
elementClone = elementFirst.clone(true)
|
||||
@rebuildAttributeSelectors(item, elementClone, default_row)
|
||||
elementLast.after(elementClone)
|
||||
item.find('.js-filterElement').first().remove()
|
||||
|
||||
item
|
||||
|
||||
@buildValue: (elementFull, elementRow, groupAndAttribute, elements, value, attribute) ->
|
||||
|
||||
# do nothing if item already exists
|
||||
name = "#{attribute.name}::#{groupAndAttribute}::value"
|
||||
return if elementRow.find("[name=\"#{name}\"]").get(0)
|
||||
return if elementRow.find("[data-name=\"#{name}\"]").get(0)
|
||||
|
||||
# build new item
|
||||
attributeConfig = elements[groupAndAttribute]
|
||||
config = _.clone(attributeConfig)
|
||||
|
||||
# force to use auto compition on user lookup
|
||||
if config.relation is 'User'
|
||||
config.tag = 'user_autocompletion'
|
||||
|
||||
# render ui element
|
||||
item = ''
|
||||
if config && App.UiElement[config.tag]
|
||||
config['name'] = name
|
||||
config['value'] = value
|
||||
if 'multiple' of config
|
||||
config.multiple = false
|
||||
config.nulloption = false
|
||||
if config.tag is 'checkbox'
|
||||
config.tag = 'select'
|
||||
tagSearch = "#{config.tag}_search"
|
||||
if App.UiElement[tagSearch]
|
||||
item = App.UiElement[tagSearch].render(config, {})
|
||||
else
|
||||
item = App.UiElement[config.tag].render(config, {})
|
||||
elementRow.find('.js-value').html(item)
|
||||
|
||||
@buildAttributeSelector: (groups, elements) ->
|
||||
selection = $('<select class="form-control"></select>')
|
||||
for groupKey, groupMeta of groups
|
||||
displayName = App.i18n.translateInline(groupMeta.name)
|
||||
selection.closest('select').append("<optgroup label=\"#{displayName}\" class=\"js-#{groupKey}\"></optgroup>")
|
||||
optgroup = selection.find("optgroup.js-#{groupKey}")
|
||||
for elementKey, elementGroup of elements
|
||||
spacer = elementKey.split(/\./)
|
||||
if spacer[0] is groupKey
|
||||
attributeConfig = elements[elementKey]
|
||||
displayName = App.i18n.translateInline(attributeConfig.display)
|
||||
optgroup.append("<option value=\"#{elementKey}\">#{displayName}</option>")
|
||||
selection
|
||||
|
||||
@rebuildAttributeSelectors: (elementFull, elementRow, groupAndAttribute) ->
|
||||
|
||||
# enable all
|
||||
elementFull.find('.js-attributeSelector select option').removeAttr('disabled')
|
||||
|
||||
# disable all used attributes
|
||||
elementFull.find('.js-attributeSelector select').each(->
|
||||
keyLocal = $(@).val()
|
||||
elementFull.find('.js-attributeSelector select option[value="' + keyLocal + '"]').attr('disabled', true)
|
||||
)
|
||||
|
||||
# disable - if we only have one attribute
|
||||
if elementFull.find('.js-attributeSelector select').length > 1
|
||||
elementFull.find('.js-remove').removeClass('is-disabled')
|
||||
else
|
||||
elementFull.find('.js-remove').addClass('is-disabled')
|
||||
|
||||
# set attribute
|
||||
if groupAndAttribute
|
||||
elementRow.find('.js-attributeSelector select').val(groupAndAttribute)
|
||||
|
||||
@humanText: (condition) ->
|
||||
none = App.i18n.translateContent('No filter.')
|
||||
return [none] if _.isEmpty(condition)
|
||||
[defaults, groups, elements] = @defaults()
|
||||
rules = []
|
||||
for attribute, value of condition
|
||||
|
||||
objectAttribute = attribute.split(/\./)
|
||||
|
||||
# get stored params
|
||||
if meta && objectAttribute[1]
|
||||
model = toCamelCase(objectAttribute[0])
|
||||
config = elements[attribute]
|
||||
|
||||
valueHuman = []
|
||||
if _.isArray(value)
|
||||
for data in value
|
||||
r = @humanTextLookup(config, data)
|
||||
valueHuman.push r
|
||||
else
|
||||
valueHuman.push @humanTextLookup(config, value)
|
||||
|
||||
if valueHuman.join
|
||||
valueHuman = valueHuman.join(', ')
|
||||
rules.push "#{App.i18n.translateContent('Set')} <b>#{App.i18n.translateContent(model)} -> #{App.i18n.translateContent(config.display)}</b> #{App.i18n.translateContent('to')} <b>#{valueHuman}</b>."
|
||||
|
||||
return [none] if _.isEmpty(rules)
|
||||
rules
|
||||
|
||||
@humanTextLookup: (config, value) ->
|
||||
return value if !App[config.relation]
|
||||
return value if !App[config.relation].exists(value)
|
||||
data = App[config.relation].fullLocal(value)
|
||||
return value if !data
|
||||
if data.displayName
|
||||
return App.i18n.translateContent( data.displayName() )
|
||||
valueHuman.push App.i18n.translateContent( data.name )
|
|
@ -15,10 +15,10 @@
|
|||
<div class="controls js-value"></div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remove rule') %>">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remote') %>">
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add new rule') %>">
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add') %>">
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -9,10 +9,10 @@
|
|||
<div class="controls js-value"></div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remove rule') %>">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remote') %>">
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add new rule') %>">
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add') %>">
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter js-filterElement">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin js-attributeSelector">
|
||||
<%- @Icon('arrow-down', 'dropdown-arrow') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls js-value"></div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remote') %>">
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add') %>">
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -15,10 +15,10 @@
|
|||
<div class="controls js-value"></div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remove rule') %>">
|
||||
<div class="filter-control filter-control-remove js-remove" title="<%- @T('Remote') %>">
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add new rule') %>">
|
||||
<div class="filter-control filter-control-add js-add" title="<%- @T('Add') %>">
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -46,10 +46,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -106,10 +106,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -164,10 +164,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -227,10 +227,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -301,10 +301,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -417,10 +417,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove is-disabled js-remove" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove is-disabled js-remove" title=<%- @T('Remote') %>>
|
||||
<%- @Icon('minus') %>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<%- @Icon('plus') %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -48,10 +48,10 @@
|
|||
<input id="filter_value_1" type="text" class="form-control">
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove is-disabled" title="Remove rule">
|
||||
<div class="filter-control filter-control-remove js-remove is-disabled" title=<%- @T('Remote') %>>
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<div class="filter-control filter-control-add js-add" title=<%- @T('Add') %>>
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue