You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

203 lines
8.2 KiB

{{#if data.id}}
<h1>Edit Queue</h1>
{{else}}
<h1>Create Queue</h1>
{{/if}}
<form id="queue-form" class="form-vertical">
<div class="control-group">
<label class="control-label" for="queue-name">Name</label>
<div class="controls">
<input class="js-to-serialize" type="text" value="{{ data.name }}" name="name" data-toggle="tooltip"
id="queue-name" title="Friendly name for this Queue">
</div>
</div>
<div id="accordion" class="accordion-light">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent=".accordion-light" href="#queue-agents-wrapper" class="collapsed">
<i class="fa fa-accordion-mark"></i>
<span>Agents</span>
</a>
</h4>
</div>
<div id="queue-agents-wrapper" class="panel-collapse collapse">
<div class="panel-body queue-agents-content" id="queue-agents-content"></div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent=".accordion-light" href="#queue-settings" class="collapsed">
<i class="fa fa-accordion-mark"></i>
<span>Queue settings</span>
</a>
</h4>
</div>
<div id="queue-settings" class="panel-collapse collapse">
<div class="panel-body">
<div class="control-group">
<span class="control-label"></span>
<div class="controls">
<div class="checkbox">
<label>
<input class="js-to-serialize" type="checkbox" value="" name="record_caller"
{{#if data.record_caller }}checked="checked"{{/if}} >
<span data-toggle="tooltip" title="You can also change individual agent's recording settings under the Agent's section">Call Recording</span>
</label>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-music-on-hold">Music on Hold</label>
<div class="controls">
<select class="js-to-serialize" name="moh" id="queue-music-on-hold" data-toggle="tooltip" title="Select the media file that you want to be played by default when it's not set on a user or a device.">
{{#each media_list}}
{{#compare @root.data.moh "===" id}}
<option id="{{ id }}" value="{{ id }}" selected="selected">{{ name }}</option>
{{else}}
<option id="{{ id }}" value="{{ id }}">{{ name }}</option>
{{/compare}}
{{/each}}
</select>
<a href="#" class="js-edit-media dynamic-link">Edit</a>
<a href="#" class="js-create-media dynamic-link">Create</a>
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-strategy">Strategy</label>
<div class="controls">
<select class="js-to-serialize" id="queue-strategy" name="strategy" data-toggle="tooltip" title="The queue strategy for connecting agents to caller">
{{#compare data.strategy "===" "most_idle"}}
<option value="round_robin">Round Robin</option>
<option value="most_idle" selected="selected">Most Idle</option>
{{else}}
<option value="round_robin" selected="selected">Round Robin</option>
<option value="most_idle">Most Idle</option>
{{/compare}}
</select>
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-call-recording-url">Call Recording URL</label>
<div class="controls">
<input id="queue-call-recording-url" class="js-to-serialize" type="text"
value="{{ data.call_recording_url }}" name="call_recording_url"
placeholder="http://xxx.yyy.com/call_recordings" data-toggle="tooltip"
title="URL pointing to a server that will host the recording of the calls processed by this queue.">
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-agent-wrapup-time">Call Wrap-up Time (s)</label>
<div class="controls">
<input class="js-to-serialize" id="queue-agent-wrapup-time" type="text"
name="agent_wrapup_time" placeholder="30"
value="{{ data.agent_wrapup_time }}" data-toggle="tooltip"
title="Automatic break time between calls for the agents in this queue.">
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-max-queue-size">Max Number of Calls</label>
<div class="controls">
<input class="js-to-serialize" type="text" name="max_queue_size"
value="{{ data.max_queue_size }}" id="queue-max-queue-size" placeholder="10000"
data-toggle="tooltip"
title="How many callers are allowed to wait on hold in the queue (0 for no limit).">
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-connection-timeout">Max Hold Time (s)</label>
<div class="controls">
<input class="js-to-serialize" type="text" name="connection_timeout"
value="{{ data.connection_timeout }}" id="queue-connection-timeout" placeholder="30"
data-toggle="tooltip"
title="In seconds, how long to try to connect the caller before progressing past the queue callflow action (0 for no limit).">
</div>
</div>
<div class="control-group">
<span class="control-label"></span>
<div class="controls">
<div class="checkbox">
<label>
<input class="js-to-serialize" type="checkbox" name="enter_when_empty"
{{#if data.enter_when_empty }}checked="checked"{{/if}}>
Allows a caller to enter this queue when no agents are available.
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent=".accordion-light" href="#notifications-settings" class="collapsed">
<i class="fa fa-accordion-mark"></i>
<span>Notifications settings</span>
</a>
</h4>
</div>
<div id="notifications-settings" class="panel-collapse collapse">
<div class="panel-body">
<div class="control-group">
<label class="control-label" for="queue-notifications-hangup">Notification on Hangup</label>
<div class="controls">
<input class="js-to-serialize" type="text" name="notifications.hangup"
value="{{ data.notifications.hangup }}" id="queue-notifications-hangup"
placeholder="http://xxx.yyy/script_hangup.php" data-toggle="tooltip"
title="URL for a callback when the call ends to tell the customer on their own servers that a call has ended.">
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-notifications-pickup">Notification after Pickup</label>
<div class="controls">
<input class="js-to-serialize" type="text" name="notifications.pickup"
value="{{ data.notifications.pickup }}" id="queue-notifications-pickup"
placeholder="http://xxx.yyy/script_pickup.php" data-toggle="tooltip"
title="URL for a callback when the call is picked up to tell the customer on their own servers that a call has been picked up.">
</div>
</div>
<div class="control-group">
<label class="control-label" for="queue-notifications-method">Method</label>
<div class="controls">
<select class="js-to-serialize" name="notifications.method" data-toggle="tooltip"
id="queue-notifications-method" title="What HTTP method to use">
{{#compare data.notifications.method "===" "POST"}}
<option value="GET">GET</option>
<option value="POST" selected="selected">POST</option>
{{else}}
<option value="GET" selected="selected">GET</option>
<option value="POST">POST</option>
{{/compare}}
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="buttons-wrapper clearfix">
{{#if data.id}}
<button class="btn btn-primary js-save-queue" data-queue-id="{{ data.id }}">Save Changes</button>
<button class="btn btn-danger js-delete-queue" data-queue-id="{{ data.id }}">Delete Queue</button>
{{else}}
<button class="btn btn-primary js-save-queue">Create</button>
{{/if}}
</div>
</form>