Added popover infos to chat header/badges about all chats and available agents.

This commit is contained in:
Martin Edenhofer 2016-01-05 22:15:19 +01:00
parent a6e0ba301c
commit 4803fa9383
6 changed files with 136 additions and 24 deletions

View file

@ -22,8 +22,11 @@ class App.CustomerChat extends App.Controller
@meta =
active: false
waiting_chat_count: 0
waiting_chat_session_list: []
running_chat_count: 0
active_agents: 0
running_chat_session_list: []
active_agent_count: 0
active_agent_ids: []
@render()
@on 'layout-has-changed', @propagateLayoutChange
@ -86,7 +89,65 @@ class App.CustomerChat extends App.Controller
@html App.view('customer_chat/index')()
chatSessionList = (list) ->
for chat_session in list
chat = App.Chat.find(chat_session.chat_id)
chat_session.name = "#{chat.displayName()} [##{chat_session.id}]"
chat_session.geo_data = ''
if chat_session.preferences && chat_session.preferences.geo_ip
if chat_session.preferences.geo_ip.country_name
chat_session.geo_data += chat_session.preferences.geo_ip.country_name
if chat_session.preferences.geo_ip.city_name
chat_session.geo_data += " #{chat_session.preferences.geo_ip.city_name}"
if chat_session.user_id
chat_session.user = App.User.find(chat_session.user_id)
App.view('customer_chat/chat_list')(
chat_sessions: list
)
@el.find('.js-waitingCustomers').popover(
trigger: 'hover'
container: 'body'
html: true
animation: false
delay: 100
title: ->
App.i18n.translateContent('Waiting Customers')
content: =>
chatSessionList(@meta.waiting_chat_session_list)
)
@el.find('.js-chattingCustomers').popover(
trigger: 'hover'
container: 'body'
html: true
animation: false
delay: 100
title: ->
App.i18n.translateContent('Chatting Customers')
content: =>
chatSessionList(@meta.running_chat_session_list)
)
@el.find('.js-activeAgents').popover(
trigger: 'hover'
container: 'body'
html: true
animation: false
delay: 100
title: ->
App.i18n.translateContent('Active Agents')
content: =>
users = []
for user_id in @meta.active_agent_ids
users.push App.User.find(user_id)
App.view('customer_chat/user_list')(
users: users
)
)
show: (params) =>
@title 'Customer Chat', true
@navupdate '#customer_chat'
counter: =>
@ -168,7 +229,7 @@ class App.CustomerChat extends App.Controller
@$('.js-acceptChat').removeClass('is-clickable is-blinking')
@$('.js-badgeWaitingCustomers').text(@meta.waiting_chat_count)
@$('.js-badgeChattingCustomers').text(@meta.running_chat_count)
@$('.js-badgeActiveAgents').text(@meta.active_agents)
@$('.js-badgeActiveAgents').text(@meta.active_agent_count)
# reopen chats
if @meta.active_sessions
@ -265,11 +326,12 @@ class ChatWindow extends App.Controller
chat = App.Chat.find(@session.chat_id)
@name = "#{chat.displayName()} [##{@session.id}]"
@title = ''
if @session && @session.preferences && @session.preferences.geo_ip
if @session.preferences.geo_ip.country_name
@name += " #{@session.preferences.geo_ip.country_name}"
@title += @session.preferences.geo_ip.country_name
if @session.preferences.geo_ip.city_name
@name += " #{@session.preferences.geo_ip.city_name}"
@title += " #{@session.preferences.geo_ip.city_name}"
@on 'layout-change', @scrollToBottom
@ -303,6 +365,7 @@ class ChatWindow extends App.Controller
render: ->
@html App.view('customer_chat/chat_window')
name: @name
title: @title
@el.one 'transitionend', @onTransitionend
@ -412,6 +475,7 @@ class ChatWindow extends App.Controller
sendMessage: (delay) =>
content = @input.html()
return if !content
return if @el.hasClass('is-offline')
send = =>
App.WebSocket.send(

View file

@ -0,0 +1,9 @@
<% if _.isEmpty(@chat_sessions): %>
<%- @T('none') %>
<% else: %>
<ul>
<% for chat_session in @chat_sessions: %>
<li><%= chat_session.name %> <% if chat_session.geo_data: %>- <%= chat_session.geo_data %><% end %> - <% if chat_session.user_id: %><%= chat_session.user.displayName() %> -<% end %> <small class=""><%- @humanTime(chat_session.created_at) %></small>
<% end %>
</ul>
<% end %>

View file

@ -6,7 +6,7 @@
<%- @Icon('status-modified-inner-circle') %>
</div>
</div>
<div class="chat-name"><%- @name %></div>
<div class="chat-name" title="<%= @title %>"><%= @name %></div>
<div class="chat-close js-close">
<%- @Icon('diagonal-cross') %>
</div>

View file

@ -5,13 +5,13 @@
</div>
<div class="page-header-center">
<div class="status-fields">
<div class="status-field js-acceptChat">
<div class="status-field js-acceptChat js-waitingCustomers">
<span class="badge js-badgeWaitingCustomers"></span> <%- @T('Waiting Customers') %>
</div>
<div class="status-field">
<div class="status-field js-chattingCustomers">
<span class="badge js-badgeChattingCustomers"></span> <%- @T('Chatting Customers') %>
</div>
<div class="status-field">
<div class="status-field js-activeAgents">
<span class="badge js-badgeActiveAgents"></span> <%- @T('Active Agents') %>
</div>
</div>

View file

@ -0,0 +1,9 @@
<% if _.isEmpty(@users): %>
<%- @T('none') %>
<% else: %>
<ul>
<% for user in @users: %>
<li><%= user.displayName() %>
<% end %>
</ul>
<% end %>

View file

@ -68,10 +68,25 @@ class Chat < ApplicationModel
Chat.where(active: true).each {|chat|
assets = chat.assets(assets)
}
active_agent_ids = []
active_agents.each {|user|
active_agent_ids.push user.id
assets = user.assets(assets)
}
runningchat_session_list_local = running_chat_session_list
runningchat_session_list_local.each {|session|
next if !session['user_id']
user = User.lookup(id: session['user_id'])
next if !user
assets = user.assets(assets)
}
{
waiting_chat_count: waiting_chat_count,
waiting_chat_session_list: waiting_chat_session_list,
running_chat_count: running_chat_count,
active_agents: active_agents,
running_chat_session_list: runningchat_session_list_local,
active_agent_count: active_agent_count,
active_agent_ids: active_agent_ids,
seads_available: seads_available,
seads_total: seads_total,
active: Chat::Agent.state(user_id),
@ -81,30 +96,35 @@ class Chat < ApplicationModel
def self.agent_state_with_sessions(user_id)
return { state: 'chat_disabled' } if !Setting.get('chat')
assets = {}
Chat.where(active: true).each {|chat|
assets = chat.assets(assets)
}
{
waiting_chat_count: waiting_chat_count,
running_chat_count: running_chat_count,
active_sessions: Chat::Session.active_chats_by_user_id(user_id),
active_agents: active_agents,
seads_available: seads_available,
seads_total: seads_total,
active: Chat::Agent.state(user_id),
assets: assets,
}
result = agent_state(user_id)
result[:active_sessions] = Chat::Session.active_chats_by_user_id(user_id)
result
end
def self.waiting_chat_count
Chat::Session.where(state: ['waiting']).count
end
def self.waiting_chat_session_list
sessions = []
Chat::Session.where(state: ['waiting']).each {|session|
sessions.push session.attributes
}
sessions
end
def self.running_chat_count
Chat::Session.where(state: ['running']).count
end
def self.running_chat_session_list
sessions = []
Chat::Session.where(state: ['running']).each {|session|
sessions.push session.attributes
}
sessions
end
def self.active_chat_count
Chat::Session.where(state: %w(waiting running)).count
end
@ -117,10 +137,20 @@ class Chat < ApplicationModel
agents
end
def self.active_agents(diff = 2.minutes)
def self.active_agent_count(diff = 2.minutes)
Chat::Agent.where(active: true).where('updated_at > ?', Time.zone.now - diff).count
end
def self.active_agents(diff = 2.minutes)
users = []
Chat::Agent.where(active: true).where('updated_at > ?', Time.zone.now - diff).each {|record|
user = User.lookup(id: record.updated_by_id)
next if !user
users.push user
}
users
end
def self.seads_total(diff = 2.minutes)
total = 0
available_agents(diff).each {|_user_id, concurrent|