diff --git a/app/assets/javascripts/app/views/generic/table.jst.eco b/app/assets/javascripts/app/views/generic/table.jst.eco index 07cc76b49..33ef145d1 100644 --- a/app/assets/javascripts/app/views/generic/table.jst.eco +++ b/app/assets/javascripts/app/views/generic/table.jst.eco @@ -20,9 +20,11 @@ <% end %> <% for header, i in @headers: %> -
+
<%- @T(header.display) %>
-
<% if header.sortOrderIcon: %><%- @Icon(header.sortOrderIcon[0], header.sortOrderIcon[1]) %><% end %>
+ <% if !@sortable: %> +
<% if header.sortOrderIcon: %><%- @Icon(header.sortOrderIcon[0], header.sortOrderIcon[1]) %><% end %>
+ <% end %>
<% if @tableId && !header.unresizable && i < @headers.length - 1 && (@headers.length - 1 != i && @headers[ i + 1 ] && !@headers[ i + 1 ].unresizable): %>
diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss index 4fb3570a9..0efd396ea 100644 --- a/app/assets/stylesheets/zammad.scss +++ b/app/assets/stylesheets/zammad.scss @@ -1143,6 +1143,10 @@ table { .table-column-head { display: flex; @extend %clickable; + + &-unclickable { + cursor: default; + } } .table-column-sortIcon { diff --git a/public/assets/tests/table.js b/public/assets/tests/table.js index 17a8472d0..4634aacbd 100644 --- a/public/assets/tests/table.js +++ b/public/assets/tests/table.js @@ -769,3 +769,51 @@ test('table test 5', function() { equal(el.find('tbody > tr:nth-child(2) > td:nth-child(2)').text().trim(), 'some data 2', 'check row 2') equal(el.find('tbody > tr:nth-child(2) > td:nth-child(3)').text().trim(), 'false', 'check row 2') }); + +test('table test 6/7', function() { + $('#table').append('

sotable table with data

') + var el_head_sortable = $('#table-data6') + + $('#table').append('

not sortable table with data

') + var el_not_head_sortable = $('#table-data7') + + data = [ + { name: 'a item', data: 'g data', active: true }, + { name: 'b item', data: 'b data', active: false }, + { name: 'c item', data: 'z data', active: true }, + ] + + new App.ControllerTable({ + tableId: 'a', + el: el_head_sortable, + overview: ['name', 'data', 'active'], + attribute_list: [ + { name: 'name', display: 'Name', type: 'text', style: 'width: 10%' }, + { name: 'data', display: 'Data', type: 'text' }, + { name: 'active', display: 'Active', type: 'text' }, + ], + objects: data + }); + + new App.ControllerTable({ + tableId: 'b', + el: el_not_head_sortable, + overview: ['name', 'data', 'active'], + attribute_list: [ + { name: 'name', display: 'Name', type: 'text', style: 'width: 10%' }, + { name: 'data', display: 'Data', type: 'text' }, + { name: 'active', display: 'Active', type: 'text' }, + ], + objects: data, + dndCallback: function() { return true } + }); + + equal(el_head_sortable.find('tbody > tr:nth-child(1) > td:first').text().trim(), 'a item', 'check row 1') + equal(el_not_head_sortable.find('tbody > tr:nth-child(1) > td:nth-child(2)').text().trim(), 'a item', 'check row 1') + + el_head_sortable.find('table > thead > tr > th:nth-child(2) > .js-sort').click() + el_not_head_sortable.find('table > thead > tr > th:nth-child(3) > .js-sort').click() + + equal(el_head_sortable.find('tbody > tr:nth-child(1) > td:first').text().trim(), 'b item', 'check row 1') + equal(el_not_head_sortable.find('tbody > tr:nth-child(1) > td:nth-child(2)').text().trim(), 'a item', 'check row 1') +});