Split of d&d action into separate templates. Use real objects from now.
This commit is contained in:
Martin Edenhofer
parent
55939db0ea
commit
38f33598d4
4 changed files with 85 additions and 206 deletions
|
|
@ -14,16 +14,66 @@ class App.TicketOverview extends App.Controller
|
||||||
'.js-batch-assign': 'batchAssign'
|
'.js-batch-assign': 'batchAssign'
|
||||||
'.js-batch-macro': 'batchMacro'
|
'.js-batch-macro': 'batchMacro'
|
||||||
|
|
||||||
#events:
|
events:
|
||||||
# 'mousedown .item': 'startDragItem'
|
'mousedown .item': 'startDragItem'
|
||||||
# 'mouseenter .js-batch-overlay-entry': 'highlightBatchEntry'
|
'mouseenter .js-batch-overlay-entry': 'highlightBatchEntry'
|
||||||
# 'mouseleave .js-batch-overlay-entry': 'unhighlightBatchEntry'
|
'mouseleave .js-batch-overlay-entry': 'unhighlightBatchEntry'
|
||||||
|
|
||||||
constructor: ->
|
constructor: ->
|
||||||
super
|
super
|
||||||
@render()
|
@render()
|
||||||
|
|
||||||
startDragItem: (event) ->
|
users = [
|
||||||
|
App.User.find(2),
|
||||||
|
App.User.find(2),
|
||||||
|
App.User.find(2),
|
||||||
|
]
|
||||||
|
groups = App.Group.all()
|
||||||
|
|
||||||
|
@batchAssign.html $(App.view('ticket_overview/batch_overlay_user_group')(
|
||||||
|
users: users
|
||||||
|
groups: groups
|
||||||
|
))
|
||||||
|
macros = [
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close Beispiel für eine besonders'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close & Tag as Spam'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Close & Reply we\'re on Holidays'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Escalate to 2nd level'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '1st Close'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
@batchMacro.html $(App.view('ticket_overview/batch_overlay_macro')(
|
||||||
|
macros: macros
|
||||||
|
))
|
||||||
|
|
||||||
|
startDragItem: (event) =>
|
||||||
@grabbedItem = $(event.currentTarget)
|
@grabbedItem = $(event.currentTarget)
|
||||||
offset = @grabbedItem.offset()
|
offset = @grabbedItem.offset()
|
||||||
@batchDragger = $(App.view('ticket_overview/batch_dragger')())
|
@batchDragger = $(App.view('ticket_overview/batch_dragger')())
|
||||||
|
|
@ -114,11 +164,12 @@ class App.TicketOverview extends App.Controller
|
||||||
complete: =>
|
complete: =>
|
||||||
# clean scale
|
# clean scale
|
||||||
action = @hoveredBatchEntry.attr('data-action')
|
action = @hoveredBatchEntry.attr('data-action')
|
||||||
|
id = @hoveredBatchEntry.attr('data-id')
|
||||||
items = @el.find('[name="bulk"]:checked')
|
items = @el.find('[name="bulk"]:checked')
|
||||||
@hoveredBatchEntry.removeAttr('style')
|
@hoveredBatchEntry.removeAttr('style')
|
||||||
@cleanUpDrag(true)
|
@cleanUpDrag(true)
|
||||||
|
|
||||||
@performBatchAction items, action
|
@performBatchAction items, action, id
|
||||||
@batchDragger.velocity
|
@batchDragger.velocity
|
||||||
properties:
|
properties:
|
||||||
scale: 0
|
scale: 0
|
||||||
|
|
@ -160,8 +211,8 @@ class App.TicketOverview extends App.Controller
|
||||||
easing: 'ease-in-out'
|
easing: 'ease-in-out'
|
||||||
duration: 300
|
duration: 300
|
||||||
|
|
||||||
performBatchAction: (items, action) ->
|
performBatchAction: (items, action, id) ->
|
||||||
console.log "perform action #{action} on #{items.length} checked items"
|
console.log "perform action #{action} with id #{id} on #{items.length} checked items"
|
||||||
|
|
||||||
showBatchOverlay: ->
|
showBatchOverlay: ->
|
||||||
@batchOverlay.show()
|
@batchOverlay.show()
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
<div class="batch-overlay-box-inner">
|
||||||
|
<% for macro in @macros: %>
|
||||||
|
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro" data-id="<%= macro.id %>">
|
||||||
|
<div class="batch-overlay-macro-entry-name"><%= macro.name %></div>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<div class="batch-overlay-box-inner">
|
||||||
|
<% for user in @users: %>
|
||||||
|
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="user_assign" data-id="<%= user.id %>">
|
||||||
|
<%- user.avatar(80) %>
|
||||||
|
<div class="batch-overlay-assign-entry-name"><%- user.displayName() %></div>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
<% for group in @groups: %>
|
||||||
|
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="group_assign" data-id="<%= group.id %>">
|
||||||
|
<span class="avatar avatar--organization size-80 avatar--unique" style="background-position: -200px -60px;">
|
||||||
|
<%- @Icon('organization') %>
|
||||||
|
</span>
|
||||||
|
<div class="batch-overlay-assign-entry-name"><%- group.displayName() %></div>
|
||||||
|
<div class="batch-overlay-assign-entry-detail"><%- @T('%s people', group.user_ids.length) %></div>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
@ -16,202 +16,6 @@
|
||||||
<%- @Icon('arrow-down') %>
|
<%- @Icon('arrow-down') %>
|
||||||
<div class="batch-overlay-circle-label"><%- @T('assign tickets') %></div>
|
<div class="batch-overlay-circle-label"><%- @T('assign tickets') %></div>
|
||||||
</div>
|
</div>
|
||||||
<!--
|
<div class="batch-overlay-assign batch-overlay-box js-batch-assign"></div>
|
||||||
sort assignes by important to not important
|
<div class="batch-overlay-macro batch-overlay-box js-batch-macro"></div>
|
||||||
first assignes are always visible
|
|
||||||
-->
|
|
||||||
<div class="batch-overlay-assign batch-overlay-box js-batch-assign">
|
|
||||||
<div class="batch-overlay-box-inner">
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">1st Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -100px -150px;">HH</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Hans Huber</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar avatar--organization size-80 avatar--unique" style="background-position: -200px -60px;">
|
|
||||||
<%- @Icon('organization') %>
|
|
||||||
</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Zammad</div>
|
|
||||||
<div class="batch-overlay-assign-entry-detail">3 Personen</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-assign-entry js-batch-overlay-entry" data-action="assign">
|
|
||||||
<span class="avatar size-80 avatar--unique" style="background-position: -30px -10px;">FD</span>
|
|
||||||
<div class="batch-overlay-assign-entry-name">Felicity Dickens</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--
|
|
||||||
sort macros by not important to important
|
|
||||||
the last macros are visible on all screen sizes
|
|
||||||
-->
|
|
||||||
<div class="batch-overlay-macro batch-overlay-box js-batch-macro">
|
|
||||||
<div class="batch-overlay-box-inner">
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close & Tag as Spam</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Close & Reply we're on Holidays</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">Escalate to 2nd level</div>
|
|
||||||
</div>
|
|
||||||
<div class="batch-overlay-macro-entry js-batch-overlay-entry" data-action="macro">
|
|
||||||
<div class="batch-overlay-macro-entry-name">1st Close</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
Loading…
Reference in a new issue