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

add sortByColumn method

Browse source
This commit is contained in:
Felix Niklas 2015-10-22 13:39:33 +02:00
parent ad0394e73e
commit 2ffe0d2efa
3 changed files with 21 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
app/assets/javascripts/app/controllers/_application_controller_table.coffee
View file

@ -255,6 +255,10 @@ class App.ControllerTable extends App.Controller
# enable resize column # enable resize column
table.on 'mousedown', '.js-col-resize', @onColResizeMousedown table.on 'mousedown', '.js-col-resize', @onColResizeMousedown
table.on 'click', '.js-col-resize', @stopPropagation
# enable sort column
table.on 'click', '.js-sort', @sortByColumn
# enable checkbox bulk selection # enable checkbox bulk selection
if data.checkbox if data.checkbox
@ -283,6 +287,9 @@ class App.ControllerTable extends App.Controller
return table return table
stopPropagation: (event) =>
event.stopPropagation()
onColResizeMousedown: (event) => onColResizeMousedown: (event) =>
@resizeTargetLeft = $(event.currentTarget).parents('th') @resizeTargetLeft = $(event.currentTarget).parents('th')
@resizeTargetRight = @resizeTargetLeft.next() @resizeTargetRight = @resizeTargetLeft.next()
@ -308,17 +315,18 @@ class App.ControllerTable extends App.Controller
$(document).off 'mousemove.resizeCol' $(document).off 'mousemove.resizeCol'
# switch to percentage # switch to percentage
resizeBaseWidth = @resizeTargetLeft.parents('table').width() resizeBaseWidth = @resizeTargetLeft.parents('table').width()
leftPercentage = (@resizeTargetLeft.outerWidth() / resizeBaseWidth) * 100 leftWidth = @resizeTargetLeft.outerWidth()
rightPercentage = (@resizeTargetRight.outerWidth() / resizeBaseWidth) * 100 rightWidth= @resizeTargetRight.outerWidth()
@resizeTargetLeft.width leftPercentage + '%'
@resizeTargetRight.width rightPercentage + '%'
leftColumnKey = @resizeTargetLeft.attr('data-column-key') leftColumnKey = @resizeTargetLeft.attr('data-column-key')
rightColumnKey = @resizeTargetRight.attr('data-column-key') rightColumnKey = @resizeTargetRight.attr('data-column-key')
# save table changed widths # save table changed widths
# @storeColWidths [ # @storeColWidths [
# { key: leftColumnKey, width: leftPercentage } # { key: leftColumnKey, width: leftWidth }
# { key: rightColumnKey, width: rightPercentage } # { key: rightColumnKey, width: rightWidth }
# ] # ]
sortByColumn: (event) =>
column = $(event.currentTarget).closest('[data-column-key]').attr('data-column-key')
# sort

2
app/assets/javascripts/app/views/generic/table.jst.eco
View file

@ -15,7 +15,7 @@
<% end %> <% end %>
<% for item, i in @header: %> <% for item, i in @header: %>
<th<%= " class='#{ item.className }'" if item.className %><%= " style='#{ item.style }'" if item.style %> data-column-key="<%= item.name %>"> <th<%= " class='#{ item.className }'" if item.className %><%= " style='#{ item.style }'" if item.style %> data-column-key="<%= item.name %>">
<div class="table-column-title"> <div class="table-column-title js-sort">
<%- @T( item.display ) %> <%- @T( item.display ) %>
<% if item.sortOrderIcon: %> <% if item.sortOrderIcon: %>
<%- @Icon(item.sortOrderIcon[0], item.sortOrderIcon[1]) %> <%- @Icon(item.sortOrderIcon[0], item.sortOrderIcon[1]) %>

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

@ -699,6 +699,10 @@ table {
box-sizing: content-box; box-sizing: content-box;
} }
.table-column-title {
cursor: pointer;
}
.table > tbody > tr > td { .table > tbody > tr > td {
padding: 11px 10px 7px; padding: 11px 10px 7px;
border: none; border: none;