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

bulk actions: refactor, make space for scrollbar and rows

Browse source
This commit is contained in:
Felix Niklas 2015-11-10 16:06:21 +01:00
parent 5b7d9fa528
commit e8094488f8
3 changed files with 106 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

166
app/assets/javascripts/app/controllers/ticket_overview.coffee
View file

@ -233,7 +233,7 @@ class Table extends App.Controller
@html App.view('customer_not_ticket_exists')() @html App.view('customer_not_ticket_exists')()
return return
@selected = @bulkGetSelected() @selected = @getSelected()
# set page title # set page title
@overview = App.Overview.find(overview.id) @overview = App.Overview.find(overview.id)
@ -317,9 +317,9 @@ class Table extends App.Controller
value value
callbackCheckbox = (id, checked, e) => callbackCheckbox = (id, checked, e) =>
if @el.find('table').find('input[name="bulk"]:checked').length == 0 if @el.find('table').find('input[name="bulk"]:checked').length == 0
@el.find('.bulkAction').addClass('hide') @bulkForm.hide()
else else
@el.find('.bulkAction').removeClass('hide') @bulkForm.show()
callbackIconHeader = (headers) -> callbackIconHeader = (headers) ->
attribute = attribute =
name: 'icon' name: 'icon'
@ -375,7 +375,7 @@ class Table extends App.Controller
'click': callbackCheckbox 'click': callbackCheckbox
) )
@bulkSetSelected( @selected ) @setSelected( @selected )
# start user popups # start user popups
@userPopups() @userPopups()
@ -383,10 +383,13 @@ class Table extends App.Controller
# start organization popups # start organization popups
@organizationPopups() @organizationPopups()
@bulkForm = new BulkForm
holder: @el
# start bulk action observ # start bulk action observ
@el.find('.bulkAction').append( @bulk_form() ) @el.append( @bulkForm.el )
if @el.find('.table-overview').find('input[name="bulk"]:checked').length isnt 0 if @el.find('.table-overview').find('input[name="bulk"]:checked').length isnt 0
@el.find('.bulkAction').removeClass('hide') @bulkForm.show()
# show/hide bulk action # show/hide bulk action
@el.find('.table-overview').delegate('input[name="bulk"], input[name="bulk_all"]', 'click', (e) => @el.find('.table-overview').delegate('input[name="bulk"], input[name="bulk_all"]', 'click', (e) =>
@ -394,13 +397,13 @@ class Table extends App.Controller
if @el.find('.table-overview').find('input[name="bulk"]:checked').length == 0 if @el.find('.table-overview').find('input[name="bulk"]:checked').length == 0
# hide # hide
@el.find('.bulkAction').addClass('hide') @bulkForm.hide()
@resetBulkForm() @bulkForm.reset()
else else
# show # show
@el.find('.bulkAction').removeClass('hide') @bulkForm.show()
) )
# deselect bulk_all if one item is uncheck observ # deselect bulk_all if one item is uncheck observ
@ -409,21 +412,21 @@ class Table extends App.Controller
$(e.target).parents().find('[name="bulk_all"]').attr('checked', false) $(e.target).parents().find('[name="bulk_all"]').attr('checked', false)
) )
# bind bulk form buttons getSelected: ->
@$('.js-confirm').click(@bulkFormConfirm) @ticketIDs = []
@$('.js-cancel').click(@resetBulkForm) @el.find('.table-overview').find('[name="bulk"]:checked').each( (index, element) =>
ticket_id = $(element).val()
bulkFormConfirm: => @ticketIDs.push ticket_id
@$('.js-action-step').addClass('hide') )
@$('.js-confirm-step').removeClass('hide') @ticketIDs
# need a delay because of the click event
setTimeout ( => @$('.textarea.form-group textarea').focus() ), 0
resetBulkForm: =>
@$('.js-action-step').removeClass('hide')
@$('.js-confirm-step').addClass('hide')
setSelected: (ticketIDs) ->
@el.find('.table-overview').find('[name="bulk"]').each( (index, element) ->
ticket_id = $(element).val()
for ticket_id_selected in ticketIDs
if ticket_id_selected is ticket_id
$(element).attr( 'checked', true )
)
viewmode: (e) => viewmode: (e) =>
e.preventDefault() e.preventDefault()
@ -432,13 +435,25 @@ class Table extends App.Controller
@fetch() @fetch()
#@render() #@render()
articleTypeFilter = (items) -> settings: (e) =>
for item in items e.preventDefault()
if item.name is 'note' new App.OverviewSettings(
return [item] overview_id: @overview.id
items view_mode: @view_mode
container: @el.closest('.content')
)
class BulkForm extends App.Controller
className: 'bulkAction hide'
events:
'submit form': 'submit'
'click .js-confirm': 'confirm'
'click .js-cancel': 'reset'
constructor: ->
super
bulk_form: =>
@configure_attributes_ticket = [ @configure_attributes_ticket = [
{ name: 'state_id', display: 'State', tag: 'select', multiple: false, null: true, relation: 'TicketState', filter: @bulk, translate: true, nulloption: true, default: '', class: '', item_class: '' }, { name: 'state_id', display: 'State', tag: 'select', multiple: false, null: true, relation: 'TicketState', filter: @bulk, translate: true, nulloption: true, default: '', class: '', item_class: '' },
{ name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: true, relation: 'TicketPriority', filter: @bulk, translate: true, nulloption: true, default: '', class: '', item_class: '' }, { name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: true, relation: 'TicketPriority', filter: @bulk, translate: true, nulloption: true, default: '', class: '', item_class: '' },
@ -446,10 +461,18 @@ class Table extends App.Controller
{ name: 'owner_id', display: 'Owner', tag: 'select', multiple: false, null: true, relation: 'User', filter: @bulk, nulloption: true, class: '', item_class: '' } { name: 'owner_id', display: 'Owner', tag: 'select', multiple: false, null: true, relation: 'User', filter: @bulk, nulloption: true, class: '', item_class: '' }
] ]
# render init page @holder = @options.holder
html = $( App.view('agent_ticket_view/bulk')() ) @visible = false
@render()
render: ->
@el.css 'right', App.Utils.getScrollBarWidth()
@html App.view('agent_ticket_view/bulk')()
new App.ControllerForm( new App.ControllerForm(
el: html.find('#form-ticket-bulk') el: @el.find('#form-ticket-bulk')
model: model:
configure_attributes: @configure_attributes_ticket configure_attributes: @configure_attributes_ticket
className: 'create' className: 'create'
@ -459,7 +482,7 @@ class Table extends App.Controller
) )
new App.ControllerForm( new App.ControllerForm(
el: html.find('#form-ticket-bulk-comment') el: @el.find('#form-ticket-bulk-comment')
model: model:
configure_attributes: [{ name: 'body', display: 'Comment', tag: 'textarea', rows: 4, null: true, upload: false, item_class: 'flex' }] configure_attributes: [{ name: 'body', display: 'Comment', tag: 'textarea', rows: 4, null: true, upload: false, item_class: 'flex' }]
className: 'create' className: 'create'
@ -469,12 +492,12 @@ class Table extends App.Controller
) )
@confirm_attributes = [ @confirm_attributes = [
{ name: 'type_id', display: 'Type', tag: 'select', multiple: false, null: true, relation: 'TicketArticleType', filter: articleTypeFilter, default: '9', translate: true, class: 'medium' } { name: 'type_id', display: 'Type', tag: 'select', multiple: false, null: true, relation: 'TicketArticleType', filter: @articleTypeFilter, default: '9', translate: true, class: 'medium' }
{ name: 'internal', display: 'Visibility', tag: 'select', null: true, options: { true: 'internal', false: 'public' }, class: 'medium', item_class: '', default: false } { name: 'internal', display: 'Visibility', tag: 'select', null: true, options: { true: 'internal', false: 'public' }, class: 'medium', item_class: '', default: false }
] ]
new App.ControllerForm( new App.ControllerForm(
el: html.find('#form-ticket-bulk-typeVisibility') el: @el.find('#form-ticket-bulk-typeVisibility')
model: model:
configure_attributes: @confirm_attributes configure_attributes: @confirm_attributes
className: 'create' className: 'create'
@ -483,29 +506,54 @@ class Table extends App.Controller
noFieldset: true noFieldset: true
) )
html.bind('submit', (e) => articleTypeFilter: (items) ->
e.preventDefault() for item in items
@bulk_submit(e) if item.name is 'note'
) return [item]
return html items
bulkGetSelected: -> confirm: =>
@ticketIDs = [] @$('.js-action-step').addClass('hide')
@el.find('.table-overview').find('[name="bulk"]:checked').each( (index, element) => @$('.js-confirm-step').removeClass('hide')
ticket_id = $(element).val()
@ticketIDs.push ticket_id
)
@ticketIDs
bulkSetSelected: (ticketIDs) -> @makeSpaceForTableRows()
@el.find('.table-overview').find('[name="bulk"]').each( (index, element) ->
ticket_id = $(element).val() # need a delay because of the click event
for ticket_id_selected in ticketIDs setTimeout ( => @$('.textarea.form-group textarea').focus() ), 0
if ticket_id_selected is ticket_id
$(element).attr( 'checked', true ) reset: =>
) @$('.js-action-step').removeClass('hide')
@$('.js-confirm-step').addClass('hide')
if @visible
@makeSpaceForTableRows()
show: =>
@el.removeClass('hide')
@visible = true
@makeSpaceForTableRows()
hide: =>
@el.addClass('hide')
@visible = false
@removeSpaceForTableRows()
makeSpaceForTableRows: =>
height = @el.height()
scrollParent = @holder.scrollParent()
isScrolledToBottom = scrollParent.prop('scrollHeight') is scrollParent.scrollTop() + scrollParent.outerHeight()
@holder.css 'margin-bottom', height
if isScrolledToBottom
scrollParent.scrollTop scrollParent.prop('scrollHeight') - scrollParent.outerHeight()
removeSpaceForTableRows: =>
@holder.css 'margin-bottom', 0
submit: (e) =>
e.preventDefault()
bulk_submit: (e) =>
@bulk_count = @el.find('.table-overview').find('[name="bulk"]:checked').length @bulk_count = @el.find('.table-overview').find('[name="bulk"]:checked').length
@bulk_count_index = 0 @bulk_count_index = 0
@el.find('.table-overview').find('[name="bulk"]:checked').each( (index, element) => @el.find('.table-overview').find('[name="bulk"]:checked').each( (index, element) =>
@ -570,14 +618,6 @@ class Table extends App.Controller
msg: App.i18n.translateContent('Bulk-Action executed!') msg: App.i18n.translateContent('Bulk-Action executed!')
} }
settings: (e) =>
e.preventDefault()
new App.OverviewSettings(
overview_id: @overview.id
view_mode: @view_mode
container: @el.closest('.content')
)
class App.OverviewSettings extends App.ControllerModal class App.OverviewSettings extends App.ControllerModal
constructor: -> constructor: ->
super super

2
app/assets/javascripts/app/views/agent_ticket_view/content.jst.eco
View file

@ -19,5 +19,3 @@
</div> </div>
<div class="table-overview"></div> <div class="table-overview"></div>
<div class="bulkAction hide"></div>

2
app/assets/stylesheets/zammad.scss
View file

@ -2416,6 +2416,7 @@ footer {
bottom: 0; bottom: 0;
left: $sidebarWidth + $navigationWidth; left: $sidebarWidth + $navigationWidth;
right: 0; right: 0;
min-width: $minWidth - $sidebarWidth - $navigationWidth;
background: white; background: white;
z-index: 1; z-index: 1;
box-shadow: box-shadow:
@ -2425,6 +2426,7 @@ footer {
@media only screen and (max-width: $largeScreenBreakpoint) { @media only screen and (max-width: $largeScreenBreakpoint) {
left: $navigationWidth; left: $navigationWidth;
min-width: $minWidth - $sidebarWidth;
} }
} }