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

Table: add no-side-padding class

Browse source 
used in priority column to make the column slimmer
This commit is contained in:
Martin Edenhofer 2019-04-11 07:23:35 +02:00
parent a32f5bb01c
commit e26db17d75
15 changed files with 251 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -90,11 +90,11 @@
###
class App.ControllerTable extends App.Controller
minColWidth: 40
minColWidth: 30
baseColWidth: 130
minTableWidth: 612
checkBoxColWidth: 40
checkBoxColWidth: 30
radioColWidth: 22
sortableColWidth: 36
destroyColWidth: 70

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

@ -1086,12 +1086,15 @@ class Table extends App.Controller
show: true
)
@navigate ticket.uiUrl()
callbackTicketTitleAdd = (value, object, attribute, attributes) ->
attribute.title = object.title
value
callbackLinkToTicket = (value, object, attribute, attributes) ->
attribute.link = object.uiUrl()
value
callbackUserPopover = (value, object, attribute, attributes) ->
return value if !object
refObjectId = undefined
@ -1104,6 +1107,7 @@ class Table extends App.Controller
attribute.data =
id: refObjectId
value
callbackOrganizationPopover = (value, object, attribute, attributes) ->
return value if !object
return value if !object.organization_id
@ -1111,6 +1115,7 @@ class Table extends App.Controller
attribute.data =
id: object.organization_id
value
callbackCheckbox = (id, checked, e) =>
if @shouldShowBulkForm()
@bulkForm.render()
@ -1136,6 +1141,7 @@ class Table extends App.Controller
items.slice(startId+1, endId).find('[name="bulk"]').prop('checked', (-> !@checked))
@lastChecked = e.currentTarget
callbackIconHeader = (headers) ->
attribute =
name: 'icon'
@ -1147,13 +1153,60 @@ class Table extends App.Controller
headers.unshift(0)
headers[0] = attribute
headers
callbackIcon = (value, object, attribute, header) ->
value = ' '
attribute.class = object.iconClass()
attribute.link = ''
attribute.title = object.iconTitle()
attribute.class = object.iconClass()
attribute.link = ''
attribute.title = object.iconTitle()
value
callbackPriority = (value, object, attribute, header) ->
value = ' '
if object.priority
attribute.title = object.priority()
else
attribute.title = App.i18n.translateInline(App.TicketPriority.findNative(@priority_id)?.displayName())
value = object.priorityIcon()
callbackIconPriorityHeader = (headers) ->
attribute =
name: 'icon_priority'
display: ''
translation: false
width: '24px'
displayWidth: 24
unresizable: true
headers.unshift(0)
headers[0] = attribute
headers
callbackIconPriority = (value, object, attribute, header) ->
value = ' '
priority = App.TicketPriority.findNative(object.priority_id)
attribute.title = App.i18n.translateInline(priority?.name)
value = object.priorityIcon()
callbackHeader = [ callbackIconHeader ]
callbackAttributes =
icon:
[ callbackIcon ]
customer_id:
[ callbackUserPopover ]
organization_id:
[ callbackOrganizationPopover ]
owner_id:
[ callbackUserPopover ]
title:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
number:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
if App.Config.get('ui_ticket_overview_priority_icon') == true
callbackHeader = [ callbackIconHeader, callbackIconPriorityHeader ]
callbackAttributes.icon_priority = [ callbackIconPriority ]
tableArguments =
tableId: "ticket_overview_#{@overview.id}"
overview: @overview.view.s
@ -1173,20 +1226,8 @@ class Table extends App.Controller
# customer_id:
# events:
# 'mouseover': popOver
callbackHeader: [ callbackIconHeader ]
callbackAttributes:
icon:
[ callbackIcon ]
customer_id:
[ callbackUserPopover ]
organization_id:
[ callbackOrganizationPopover ]
owner_id:
[ callbackUserPopover ]
title:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
number:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
callbackHeader: callbackHeader
callbackAttributes: callbackAttributes
bindCheckbox:
events:
'click': callbackCheckbox

57
app/assets/javascripts/app/controllers/widget/ticket_list.coffee
View file

@ -19,12 +19,15 @@ class App.TicketList extends App.Controller
openTicket = (id,e) =>
ticket = App.Ticket.findNative(id)
@navigate ticket.uiUrl()
callbackTicketTitleAdd = (value, object, attribute, attributes) ->
attribute.title = object.title
value
callbackLinkToTicket = (value, object, attribute, attributes) ->
attribute.link = object.uiUrl()
value
callbackUserPopover = (value, object, attribute, attributes) ->
return value if !object
refObjectId = undefined
@ -37,6 +40,7 @@ class App.TicketList extends App.Controller
attribute.data =
id: refObjectId
value
callbackOrganizationPopover = (value, object, attribute, attributes) ->
return value if !object
return value if !object.organization_id
@ -64,6 +68,43 @@ class App.TicketList extends App.Controller
attribute.title = object.iconTitle()
value
callbackIconPriorityHeader = (headers) ->
attribute =
name: 'icon_priority'
display: ''
translation: false
width: '22px'
displayWidth: 22
unresizable: true
headers.unshift(0)
headers[0] = attribute
headers
callbackIconPriority = (value, object, attribute, header) ->
value = ' '
priority = App.TicketPriority.findNative(object.priority_id)
attribute.title = App.i18n.translateInline(priority?.name)
value = object.priorityIcon()
callbackHeader = [ callbackIconHeader ]
callbackAttributes =
icon:
[ callbackIcon ]
customer_id:
[ callbackUserPopover ]
organization_id:
[ callbackOrganizationPopover ]
owner_id:
[ callbackUserPopover ]
title:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
number:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
if App.Config.get('ui_ticket_overview_priority_icon') == true
callbackHeader = [ callbackIconHeader, callbackIconPriorityHeader ]
callbackAttributes.icon_priority = [ callbackIconPriority ]
list = []
for ticket_id in @ticket_ids
ticketItem = App.Ticket.fullLocal(ticket_id)
@ -78,20 +119,8 @@ class App.TicketList extends App.Controller
#bindRow:
# events:
# 'click': openTicket
callbackHeader: [ callbackIconHeader ]
callbackAttributes:
icon:
[ callbackIcon ]
customer_id:
[ callbackUserPopover ]
organization_id:
[ callbackOrganizationPopover ]
owner_id:
[ callbackUserPopover ]
title:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
number:
[ callbackLinkToTicket, callbackTicketTitleAdd ]
callbackHeader: callbackHeader
callbackAttributes: callbackAttributes
radio: @radio
)

18
app/assets/javascripts/app/models/ticket.coffee
View file

@ -11,7 +11,7 @@ class App.Ticket extends App.Model
{ name: 'owner_id', display: 'Owner', tag: 'select', multiple: false, limit: 100, null: true, relation: 'User', width: '12%', edit: true },
{ name: 'state_id', display: 'State', tag: 'select', multiple: false, null: false, relation: 'TicketState', default: 'new', width: '12%', edit: true, customer: true },
{ name: 'pending_time', display: 'Pending till', tag: 'datetime', null: true, width: '130px' },
{ name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: false, relation: 'TicketPriority', default: '2 normal', width: '12%', edit: true, customer: true },
{ name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: false, relation: 'TicketPriority', default: '2 normal', width: '54px', edit: true, customer: true },
{ name: 'article_count', display: 'Article#', readonly: 1, width: '12%' },
{ name: 'time_unit', display: 'Accounted Time', readonly: 1, width: '12%' },
{ name: 'escalation_at', display: 'Escalation', tag: 'datetime', null: true, readonly: 1, width: '110px', class: 'escalation' },
@ -29,6 +29,22 @@ class App.Ticket extends App.Model
uiUrl: ->
"#ticket/zoom/#{@id}"
priorityIcon: ->
priority = App.TicketPriority.findNative(@priority_id)
return '' if !priority
return '' if !priority.ui_icon
return '' if !priority.ui_color
App.Utils.icon(priority.ui_icon, "u-#{priority.ui_color}-color")
priorityClass: ->
priority = App.TicketPriority.findNative(@priority_id)
return '' if !priority
return '' if !priority.ui_color
"item--#{priority.ui_color}"
rowClass: ->
@priorityClass()
getState: ->
type = App.TicketState.findNative(@state_id)
stateType = App.TicketStateType.findNative(type.state_type_id)

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

@ -6,7 +6,7 @@
<th style="width: 36px" class="table-draggable"></th>
<% end %>
<% if @checkbox: %>
<th style="width: 40px" class="table-checkbox">
<th style="width: 30px" class="table-checkbox">
<label class="checkbox-replacement">
<input type="checkbox" value="" name="bulk_all">
<%- @Icon('checkbox', 'icon-unchecked') %>
@ -16,7 +16,7 @@
</th>
<% end %>
<% if @radio: %>
<th style="width: 40px" class="table-radio"></th>
<th style="width: 30px" class="table-radio"></th>
<% end %>
<% for header, i in @headers: %>
<th class="js-tableHead<% if header.className: %> <%= header.className %><% end %><% if header.align: %> align-<%= header.align %><% end %>" style="<% if header.displayWidth: %>width:<%= header.displayWidth %>px<% end %>" data-column-key="<%= header.name %>">

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

@ -1,4 +1,4 @@
<tr class="item<%= ' is-inactive' if @object.active is false %>" data-id="<%= @object.id %>">
<tr class="item<%= ' is-inactive' if @object.active is false %><%= ' '+ @object.rowClass() if @object.rowClass %>" data-id="<%= @object.id %>">
<% if @sortable: %>
<td class="table-draggable"><%- @Icon('draggable') %></td>
<% end %>

5
app/assets/stylesheets/bootstrap.css vendored
View file

@ -4055,10 +4055,7 @@ button.close {
transform: translate(0, -25%);
}
.modal.in .modal-dialog {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
-o-transform: translate(0, 0);
transform: translate(0, 0);
transform: none;
}
.modal-open .modal {
overflow-x: hidden;

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

@ -9,6 +9,9 @@ $task-state-pending-color: hsl(206,7%,28%);
$task-state-open-color: $ok-color;
$task-state-escalating-color: $superbad-color;
$high-priority-color: hsl(360,71%,60%);
$low-priority-color: hsl(200,68%,73%);
$minWidth: 1024px;
$sidebarWidth: 280px;
$navigationWidth: 260px;
@ -244,6 +247,14 @@ ol, ul {
z-index: 1000;
}
.u-high-priority-color {
fill: $high-priority-color;
}
.u-low-priority-color {
fill: $low-priority-color;
}
.clickCatcher {
top: 0;
left: 0;
@ -1004,10 +1015,16 @@ th.align-right {
.table > tbody > tr > td {
padding: 10px 10px 8px;
border-color: hsl(0,0%,95%);
&.no-side-padding {
padding-left: 0;
padding-right: 0;
text-align: center;
}
}
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr.is-hover > td {
.table-hover > tbody > tr:hover,
.table-hover > tbody > tr.is-hover {
background: white;
}
@ -1057,11 +1074,11 @@ th.align-right {
}
}
.table .icon {
td .icon {
vertical-align: middle;
}
.table .icon-draggable {
td .icon-draggable {
fill: hsl(240,1%,77%);
}
@ -1080,6 +1097,32 @@ th.align-right {
vertical-align: middle;
}
.item {
&--high-priority {
a {
color: $high-priority-color;
}
}
&--low-priority {
a {
color: $low-priority-color;
}
}
}
.checkbox-list {
list-style: none;
margin-bottom: 15px;
padding: 3px 12px;
font-size: 14px;
line-height: 25px;
color: hsl(60,1%,34%);
background: white;
border: 1px solid hsl(0, 0%, 90%);
border-radius: 3px;
}
.checkbox-replacement,
.radio-replacement {
padding: 0;
@ -3374,11 +3417,6 @@ footer {
opacity: 1;
}
.icon-task-state {
margin-top: 1px;
display: block;
}
.nav-tab-icon .icon-task-state {
margin: 0;
}

BIN
contrib/icon-sprite.sketch
View file

Binary file not shown.

2
db/migrate/20120101000010_create_ticket.rb
View file

@ -34,6 +34,8 @@ class CreateTicket < ActiveRecord::Migration[4.2]
create_table :ticket_priorities do |t|
t.column :name, :string, limit: 250, null: false
t.column :default_create, :boolean, null: false, default: false
t.column :ui_icon, :string, limit: 100, null: true
t.column :ui_color, :string, limit: 100, null: true
t.column :note, :string, limit: 250, null: true
t.column :active, :boolean, null: false, default: true
t.column :updated_by_id, :integer, null: false

44
db/migrate/20190409000001_setting_ticket_overview_priority_icon_and_color.rb Normal file
View file

@ -0,0 +1,44 @@
class SettingTicketOverviewPriorityIconAndColor < ActiveRecord::Migration[5.1]
def change
Setting.create_if_not_exists(
title: 'Priority Icons in Overviews',
name: 'ui_ticket_overview_priority_icon',
area: 'UI::TicketOverview::PriorityIcons',
description: 'Enables priority icons in ticket overviews.',
options: {
form: [
{
display: '',
null: true,
name: 'ui_ticket_overview_priority_icon',
tag: 'boolean',
translate: true,
options: {
true => 'yes',
false => 'no',
},
},
],
},
state: false,
preferences: {
prio: 500,
permission: ['admin.ui'],
},
frontend: true
)
if ActiveRecord::Base.connection.columns('ticket_priorities').map(&:name).exclude?('ui_icon')
add_column :ticket_priorities, :ui_icon, :string, limit: 100, null: true
end
if ActiveRecord::Base.connection.columns('ticket_priorities').map(&:name).exclude?('ui_color')
add_column :ticket_priorities, :ui_color, :string, limit: 100, null: true
end
Ticket::Priority.reset_column_information
priority = Ticket::Priority.find_by(name: '1 low')
priority&.update!(ui_icon: 'low-priority', ui_color: 'low-priority')
priority = Ticket::Priority.find_by(name: '3 high')
priority&.update!(ui_icon: 'important', ui_color: 'high-priority')
end
end

28
db/seeds/settings.rb
View file

@ -953,6 +953,34 @@ Setting.create_if_not_exists(
frontend: true
)
Setting.create_if_not_exists(
title: 'Priority Icons in Overviews',
name: 'ui_ticket_overview_priority_icon',
area: 'UI::TicketOverview::PriorityIcons',
description: 'Enables priority icons in ticket overviews.',
options: {
form: [
{
display: '',
null: true,
name: 'ui_ticket_overview_priority_icon',
tag: 'boolean',
translate: true,
options: {
true => 'yes',
false => 'no',
},
},
],
},
state: false,
preferences: {
prio: 500,
permission: ['admin.ui'],
},
frontend: true
)
Setting.create_if_not_exists(
title: 'New User Accounts',
name: 'user_create_account',

4
db/seeds/ticket_priorities.rb
View file

@ -1,3 +1,3 @@
Ticket::Priority.create_if_not_exists(id: 1, name: '1 low')
Ticket::Priority.create_if_not_exists(id: 1, name: '1 low', ui_icon: 'low-priority', ui_color: 'low-priority')
Ticket::Priority.create_if_not_exists(id: 2, name: '2 normal', default_create: true)
Ticket::Priority.create_if_not_exists(id: 3, name: '3 high')
Ticket::Priority.create_if_not_exists(id: 3, name: '3 high', ui_icon: 'important', ui_color: 'high-priority')

2
public/assets/images/icons.svg
View file

@ -302,7 +302,7 @@
<title>
important
</title>
<path d="M7.999 1a.963.963 0 0 0-.967 1.002l.274 8.447c.018.554.48 1.003 1.031 1.003h.326a1.04 1.04 0 0 0 1.03-1.003l.275-8.447A.96.96 0 0 0 9 1H7.999zM8.5 15.4a1.394 1.394 0 1 0 0-2.787 1.394 1.394 0 0 0 0 2.787z" fill-rule="evenodd"/>
<path d="M7.471 1h1.058c.551 0 .989.449.97 1.002l-.28 8.447a1.039 1.039 0 0 1-1.025 1.003h-.388a1.047 1.047 0 0 1-1.026-1.003L6.5 2.002A.964.964 0 0 1 7.472 1zm.534 14.403a1.395 1.395 0 1 1 0-2.79 1.395 1.395 0 0 1 0 2.79z" fill-rule="evenodd"/>
</symbol><symbol id="icon-in-process" viewBox="0 0 64 64">
<title>
in-process

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 78 KiB

After

Width:  |  Height:  |  Size: 78 KiB

8
public/assets/images/icons/important.svg
View file

@ -1,12 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.2 (33826) - http://www.bohemiancoding.com/sketch -->
<!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
<title>important</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="important" fill="#50E3C2">
<path d="M7.99895659,1 C7.4472481,1 7.01455388,1.44909274 7.0324768,2.00214458 L7.30623174,10.4494683 C7.32416819,11.0029375 7.78652545,11.4516129 8.33717084,11.4516129 L8.66282687,11.4516129 C9.21426237,11.4516129 9.67584315,11.0025202 9.6937662,10.4494683 L9.96752305,2.00214458 C9.98545961,1.44867541 9.55733973,1 9.00104349,1 L7.99895659,1 Z M8.49999914,15.4000001 C9.26963469,15.4000001 9.89354758,14.7760872 9.89354758,14.0064517 C9.89354758,13.2368161 9.26963469,12.6129032 8.49999914,12.6129032 C7.73036359,12.6129032 7.1064507,13.2368161 7.1064507,14.0064517 C7.1064507,14.7760872 7.73036359,15.4000001 8.49999914,15.4000001 Z" id="Path-321"></path>
</g>
<g id="important" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M7.47104725,1 L8.52894658,1 C9.08033812,1 9.51777138,1.44867541 9.49944462,2.00214458 L9.21973243,10.4494683 C9.20141948,11.0025202 8.74211962,11.4516129 8.19388832,11.4516129 L7.8061031,11.4516129 C7.27100131,11.4516129 6.79858586,11.0029375 6.78025923,10.4494683 L6.50054898,2.00214458 C6.48223616,1.44909274 6.91672922,1 7.47104725,1 Z M8.00500011,15.4029032 C7.2345629,15.4029032 6.61000013,14.7783404 6.61000013,14.0079032 C6.61000013,13.237466 7.2345629,12.6129032 8.00500011,12.6129032 C8.77543733,12.6129032 9.4000001,13.237466 9.4000001,14.0079032 C9.4000001,14.7783404 8.77543733,15.4029032 8.00500011,15.4029032 Z" id="Path-321" fill="#50E3C2"></path>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB