Init version of ticket sidebar.
This commit is contained in:
parent
277f8ff05e
commit
1f9e7e37b1
4 changed files with 86 additions and 100 deletions
|
@ -1,11 +1,4 @@
|
||||||
class App.TicketZoom extends App.Controller
|
class App.TicketZoom extends App.Controller
|
||||||
events:
|
|
||||||
'click .sidebar-tabs': 'toggleSidebar'
|
|
||||||
'click .close-sidebar': 'toggleSidebar'
|
|
||||||
|
|
||||||
toggleSidebar: ->
|
|
||||||
@el.find('.ticket-zoom').toggleClass('state--sidebar-hidden')
|
|
||||||
|
|
||||||
constructor: (params) ->
|
constructor: (params) ->
|
||||||
super
|
super
|
||||||
|
|
||||||
|
@ -145,7 +138,39 @@ class App.TicketZoom extends App.Controller
|
||||||
isCustomer: @isRole('Customer')
|
isCustomer: @isRole('Customer')
|
||||||
)
|
)
|
||||||
@TicketTitle()
|
@TicketTitle()
|
||||||
@Widgets()
|
new Sidebar(el: @el)
|
||||||
|
required = 'edit'
|
||||||
|
if @isRole('Customer')
|
||||||
|
required = 'customer'
|
||||||
|
new App.ControllerForm(
|
||||||
|
el: @el.find('.edit')
|
||||||
|
model: App.Ticket
|
||||||
|
required: required
|
||||||
|
params: App.Ticket.find(@ticket.id)
|
||||||
|
)
|
||||||
|
# start link info controller
|
||||||
|
if !@isRole('Customer')
|
||||||
|
new App.WidgetTag(
|
||||||
|
el: @el.find('.tags')
|
||||||
|
object_type: 'Ticket'
|
||||||
|
object: @ticket
|
||||||
|
)
|
||||||
|
new App.WidgetLink(
|
||||||
|
el: @el.find('.links')
|
||||||
|
object_type: 'Ticket'
|
||||||
|
object: @ticket
|
||||||
|
)
|
||||||
|
new App.ControllerForm(
|
||||||
|
el: @el.find('.customer-edit')
|
||||||
|
model: App.User
|
||||||
|
required: 'quick'
|
||||||
|
params: App.User.find(@ticket.customer_id)
|
||||||
|
)
|
||||||
|
new App.ControllerForm(
|
||||||
|
el: @el.find('.organization-edit')
|
||||||
|
model: App.Organization
|
||||||
|
params: App.Organization.find(@ticket.organitaion_id)
|
||||||
|
)
|
||||||
|
|
||||||
@TicketAction()
|
@TicketAction()
|
||||||
@ArticleView()
|
@ArticleView()
|
||||||
|
@ -194,15 +219,6 @@ class App.TicketZoom extends App.Controller
|
||||||
ui: @
|
ui: @
|
||||||
)
|
)
|
||||||
|
|
||||||
Widgets: =>
|
|
||||||
# show ticket action row
|
|
||||||
new Widgets(
|
|
||||||
ticket: @ticket
|
|
||||||
task_key: @task_key
|
|
||||||
el: @el.find('.widgets')
|
|
||||||
ui: @
|
|
||||||
)
|
|
||||||
|
|
||||||
TicketAction: =>
|
TicketAction: =>
|
||||||
# start action controller
|
# start action controller
|
||||||
if !@isRole('Customer')
|
if !@isRole('Customer')
|
||||||
|
@ -254,69 +270,46 @@ class TicketTitle extends App.Controller
|
||||||
release: =>
|
release: =>
|
||||||
App.Ticket.unsubscribe( @subscribeId )
|
App.Ticket.unsubscribe( @subscribeId )
|
||||||
|
|
||||||
class TicketInfo extends App.ControllerDrox
|
class Sidebar extends App.Controller
|
||||||
|
events:
|
||||||
|
'click .sidebar-tabs': 'toggleTab'
|
||||||
|
'click .close-sidebar': 'toggleSidebar'
|
||||||
|
|
||||||
constructor: ->
|
constructor: ->
|
||||||
super
|
super
|
||||||
|
name = @el.find('.sidebar-content').first().data('content')
|
||||||
|
@toggleContent(name)
|
||||||
|
|
||||||
@subscribeId = @ticket.subscribe(@render)
|
# render: =>
|
||||||
@render(@ticket)
|
# @html App.view('ticket_zoom/sidebar')()
|
||||||
|
|
||||||
render: (ticket) =>
|
toggleSidebar: ->
|
||||||
@html @template(
|
@el.find('.ticket-zoom').toggleClass('state--sidebar-hidden')
|
||||||
file: 'ticket_zoom/info'
|
|
||||||
header: '#' + ticket.number
|
|
||||||
params:
|
|
||||||
ticket: ticket
|
|
||||||
)
|
|
||||||
|
|
||||||
# start tag controller
|
showSidebar: ->
|
||||||
if !@isRole('Customer')
|
# show sidebar if not shown
|
||||||
new App.WidgetTag(
|
if @el.find('.ticket-zoom').hasClass('state--sidebar-hidden')
|
||||||
el: @el.find('.tag_info')
|
@el.find('.ticket-zoom').removeClass('state--sidebar-hidden')
|
||||||
object_type: 'Ticket'
|
|
||||||
object: ticket
|
|
||||||
)
|
|
||||||
|
|
||||||
release: =>
|
toggleTab: (e) ->
|
||||||
App.Ticket.unsubscribe( @subscribeId )
|
|
||||||
|
|
||||||
class Widgets extends App.Controller
|
name = $(e.target).closest('.sidebar-tab').data('content')
|
||||||
constructor: ->
|
if name
|
||||||
super
|
@el.find('.ticket-zoom .sidebar-tab').removeClass('active')
|
||||||
@subscribeId = @ticket.subscribe(@render)
|
$(e.target).closest('.sidebar-tab').addClass('active')
|
||||||
@render(@ticket)
|
|
||||||
|
|
||||||
render: (ticket) =>
|
@toggleContent(name)
|
||||||
|
|
||||||
@html App.view('ticket_zoom/widgets')()
|
@showSidebar()
|
||||||
|
|
||||||
# show ticket info
|
|
||||||
new TicketInfo(
|
|
||||||
ticket: ticket
|
|
||||||
el: @el.find('.ticket_info')
|
|
||||||
)
|
|
||||||
|
|
||||||
# start customer info controller
|
toggleContent: (name) ->
|
||||||
if !@isRole('Customer')
|
return if !name
|
||||||
new App.WidgetUser(
|
@el.find('.sidebar-content').addClass('hide')
|
||||||
el: @el.find('.customer_info')
|
@el.find('.sidebar-content[data-content=' + name + ']').removeClass('hide')
|
||||||
user_id: ticket.customer_id
|
title = @el.find('.sidebar-content[data-content=' + name + ']').data('title')
|
||||||
ticket: ticket
|
@el.find('.sidebar h2').html(title)
|
||||||
)
|
|
||||||
|
|
||||||
# start link info controller
|
|
||||||
if !@isRole('Customer')
|
|
||||||
new App.WidgetLink(
|
|
||||||
el: @el.find('.link_info')
|
|
||||||
object_type: 'Ticket'
|
|
||||||
object: ticket
|
|
||||||
)
|
|
||||||
|
|
||||||
# show frontend times
|
|
||||||
@frontendTimeUpdate()
|
|
||||||
|
|
||||||
release: =>
|
|
||||||
App.Ticket.unsubscribe( @subscribeId )
|
|
||||||
|
|
||||||
class Edit extends App.Controller
|
class Edit extends App.Controller
|
||||||
events:
|
events:
|
||||||
|
|
|
@ -6,11 +6,11 @@ class App.Ticket extends App.Model
|
||||||
{ name: 'number', display: '#', tag: 'input', type: 'text', limit: 100, null: true, read_only: true, style: 'width: 8%' },
|
{ name: 'number', display: '#', tag: 'input', type: 'text', limit: 100, null: true, read_only: true, style: 'width: 8%' },
|
||||||
{ name: 'customer_id', display: 'Customer', tag: 'input', type: 'text', limit: 100, null: false, autocapitalize: false, relation: 'User' },
|
{ name: 'customer_id', display: 'Customer', tag: 'input', type: 'text', limit: 100, null: false, autocapitalize: false, relation: 'User' },
|
||||||
{ name: 'organization_id', display: 'Organization', relation: 'Organization', tagreadonly: 1 },
|
{ name: 'organization_id', display: 'Organization', relation: 'Organization', tagreadonly: 1 },
|
||||||
{ name: 'group_id', display: 'Group', tag: 'select', multiple: false, limit: 100, null: false, relation: 'Group', style: 'width: 10%' },
|
{ name: 'group_id', display: 'Group', tag: 'select', multiple: false, limit: 100, null: false, relation: 'Group', style: 'width: 10%', edit: true },
|
||||||
{ name: 'owner_id', display: 'Owner', tag: 'select', multiple: false, limit: 100, null: true, relation: 'User', style: 'width: 12%' },
|
{ name: 'owner_id', display: 'Owner', tag: 'select', multiple: false, limit: 100, null: true, relation: 'User', style: 'width: 12%', edit: true },
|
||||||
{ name: 'title', display: 'Title', tag: 'input', type: 'text', limit: 100, null: false },
|
{ name: 'title', display: 'Title', tag: 'input', type: 'text', limit: 100, null: false },
|
||||||
{ name: 'state_id', display: 'State', tag: 'select', multiple: false, null: false, relation: 'TicketState', default: 'new', class: 'medium', style: 'width: 12%' },
|
{ name: 'state_id', display: 'State', tag: 'select', multiple: false, null: false, relation: 'TicketState', default: 'new', class: 'medium', style: 'width: 12%', edit: true, customer: true, },
|
||||||
{ name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: false, relation: 'TicketPriority', default: '2 normal', class: 'medium', style: 'width: 12%' },
|
{ name: 'priority_id', display: 'Priority', tag: 'select', multiple: false, null: false, relation: 'TicketPriority', default: '2 normal', class: 'medium', style: 'width: 12%', edit: true, customer: true, },
|
||||||
{ name: 'last_contact', display: 'Last contact', type: 'time', null: true, style: 'width: 12%' },
|
{ name: 'last_contact', display: 'Last contact', type: 'time', null: true, style: 'width: 12%' },
|
||||||
{ name: 'last_contact_agent', display: 'Last contact (Agent)', type: 'time', null: true, style: 'width: 12%' },
|
{ name: 'last_contact_agent', display: 'Last contact (Agent)', type: 'time', null: true, style: 'width: 12%' },
|
||||||
{ name: 'last_contact_customer', display: 'Last contact (Customer)', type: 'time', null: true, style: 'width: 12%' },
|
{ name: 'last_contact_customer', display: 'Last contact (Customer)', type: 'time', null: true, style: 'width: 12%' },
|
||||||
|
|
|
@ -32,7 +32,7 @@
|
||||||
<div class="sidebar-holder vertical">
|
<div class="sidebar-holder vertical">
|
||||||
<div class="sidebar bottom-form-shadow flex">
|
<div class="sidebar bottom-form-shadow flex">
|
||||||
<div class="horizontal center">
|
<div class="horizontal center">
|
||||||
<h2 class="flex contain-text">Ticket Einstellungen</h2>
|
<h2 class="flex contain-text"></h2>
|
||||||
<div class="close-sidebar centered clickable">
|
<div class="close-sidebar centered clickable">
|
||||||
<div class="arrow-right icon"></div>
|
<div class="arrow-right icon"></div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -41,19 +41,34 @@
|
||||||
<form>
|
<form>
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
<div class="widgets"></div>
|
<div class="sidebar-content" data-content="ticket" data-title="<%- @T('Ticket Settings') %>">
|
||||||
<div class="action"></div>
|
<div class="edit"></div>
|
||||||
|
<div class="tags"></div>
|
||||||
|
<div class="links"></div>
|
||||||
|
<div class="action"></div>
|
||||||
|
</div>
|
||||||
|
<div class="sidebar-content" data-content="customer" data-title="<%- @T('Customer Settings') %>">
|
||||||
|
<div class="customer-edit"></div>
|
||||||
|
</div>
|
||||||
|
<div class="sidebar-content" data-content="organization" data-title="<%- @T('Organization Settings') %>">
|
||||||
|
<div class="organization-edit"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="sidebar-tabs vertical justified">
|
<div class="sidebar-tabs vertical justified">
|
||||||
<div class="active sidebar-tab centered">
|
<div class="active sidebar-tab centered" data-content="ticket">
|
||||||
<div class="dark message icon"></div>
|
<div class="dark message icon"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="sidebar-tab centered">
|
<% if !@isCustomer: %>
|
||||||
|
<div class="sidebar-tab centered" data-content="customer">
|
||||||
<div class="dark person icon"></div>
|
<div class="dark person icon"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="sidebar-tab centered">
|
<% if @ticket.organization_id: %>
|
||||||
|
<div class="sidebar-tab centered" data-content="organization">
|
||||||
<div class="dark group icon"></div>
|
<div class="dark group icon"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<% end %>
|
||||||
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,22 +0,0 @@
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<td><%- @T('Group') %></td><td><%= @ticket.group.name %></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><%- @T('State') %></td><td><%- @T( @ticket.state.name ) %></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><%- @T('Priority') %></td><td><%- @T( @ticket.priority.name ) %></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><%- @T('Age') %></td><td><span class="humanTimeFromNow" data-time="<%- @ticket.created_at %>">?</span></td>
|
|
||||||
</tr>
|
|
||||||
<% if !@isCustomer && @ticket.escalation_time: %>
|
|
||||||
<tr>
|
|
||||||
<td><%- @T('Escalation in') %></td>
|
|
||||||
<td><span class="humanTimeFromNow escalation" data-time="<%- @ticket.escalation_time %>">?</span></td>
|
|
||||||
</tr>
|
|
||||||
<% end %>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div class="tag_info"></div>
|
|
Loading…
Reference in a new issue