turn sla and scheduler layout refs into modals
This commit is contained in:
Felix Niklas
parent
517ca061ea
commit
72ad294a5f
7 changed files with 618 additions and 647 deletions
|
|
@ -1288,6 +1288,7 @@ class slaRef extends App.ControllerContent
|
|||
events:
|
||||
'click .js-activateColumn': 'activateColumn'
|
||||
'click .js-activateRow': 'activateRow'
|
||||
'click [data-type=new]': 'createNew'
|
||||
|
||||
constructor: ->
|
||||
super
|
||||
|
|
@ -1305,6 +1306,15 @@ class slaRef extends App.ControllerContent
|
|||
checkbox = @$(event.currentTarget)
|
||||
checkbox.closest('tr').toggleClass('is-active', checkbox.prop('checked'))
|
||||
|
||||
createNew: =>
|
||||
new App.ControllerModal
|
||||
head: 'New Service Level Agreement (SLA)'
|
||||
content: App.view('layout_ref/sla_modal')()
|
||||
button: 'Create SLA'
|
||||
shown: true
|
||||
cancel: true
|
||||
container: @el
|
||||
|
||||
App.Config.set( 'layout_ref/sla', slaRef, 'Routes' )
|
||||
|
||||
|
||||
|
|
@ -1312,6 +1322,7 @@ class schedulersRef extends App.ControllerContent
|
|||
|
||||
events:
|
||||
'click .select-value': 'select'
|
||||
'click [data-type=new]': 'createNew'
|
||||
|
||||
constructor: ->
|
||||
super
|
||||
|
|
@ -1320,6 +1331,15 @@ class schedulersRef extends App.ControllerContent
|
|||
render: ->
|
||||
@html App.view('layout_ref/schedulers')()
|
||||
|
||||
createNew: =>
|
||||
new App.ControllerModal
|
||||
head: 'New Scheduler'
|
||||
content: App.view('layout_ref/scheduler_modal')()
|
||||
button: 'Create Schedule'
|
||||
shown: true
|
||||
cancel: true
|
||||
container: @el
|
||||
|
||||
select: (event) =>
|
||||
target = $(event.currentTarget)
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
<ul>
|
||||
<li><a href="#layout_ref/schedulers">Schedulers</a></li>
|
||||
<li><a href="#layout_ref/sla">Sla Modal</a></li>
|
||||
<li><a href="#layout_ref/sla">Service Level Agreements</a></li>
|
||||
<li><a href="#layout_ref/user_list">User List</a></li>
|
||||
<li><a href="#layout_ref/admin_placeholder">Admin Placeholder (Inline Tutorials)</a></li>
|
||||
<li><a href="#layout_ref/clues">First Steps (Clues)</a></li>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,296 @@
|
|||
<h2>Selector</h2>
|
||||
<p>Create rules that single out the tickets for automated processing.</p>
|
||||
<h3>Filters</h3>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option>Group</option>
|
||||
<option selected>State</option>
|
||||
<option>Priority</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option selected>is</option>
|
||||
<option>is not</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option>closed</option>
|
||||
<option selected>open</option>
|
||||
<option>pending close</option>
|
||||
<option>pending reminder</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option selected>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option selected>is</option>
|
||||
<option>is not</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option>Inbox</option>
|
||||
<option>Drafts</option>
|
||||
<option>Important</option>
|
||||
<option selected>Spam</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-preview">
|
||||
<h3>Preview <span class="subtitle"><span class="u-highlight">2</span> matches</span></h3>
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 28px"></th>
|
||||
<th>Customer</th>
|
||||
<th style="width: 42%">Title</th>
|
||||
<th>Group</th>
|
||||
<th style="width: 25%">Created</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="item" data-id="1" data-position="1" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-1">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/1"> <span title="Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf">
|
||||
Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-12T12:58:42.000Z" data-tooltip="01/12/2015 13:58">01/12/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="6" data-position="6" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/6"> <span title="script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler">
|
||||
script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-11T07:26:31.000Z" data-tooltip="06/11/2015 09:26">5 days 3 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h2>Actions</h2>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="horizontal-filter-text">Set</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option selected>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter-text">to</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option selected>closed</option>
|
||||
<option>open</option>
|
||||
<option>pending close</option>
|
||||
<option>pending reminder</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove is-disabled js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Timer</h2>
|
||||
<p>
|
||||
When should the job run?<br>
|
||||
<output class="timer-output js-timerResult">
|
||||
Run every Monday, Tuesday, Wednesday, Thursday and Friday at 7:30 am and 1:30 pm.
|
||||
</output>
|
||||
</p>
|
||||
<div class="select-boxes">
|
||||
<div class="select-box select-box--vertical">
|
||||
<div class="select-box-header">Day</div>
|
||||
<div data-type="day" class="select-value is-selected">Monday</div>
|
||||
<div data-type="day" class="select-value is-selected">Tuesday</div>
|
||||
<div data-type="day" class="select-value is-selected">Wednesday</div>
|
||||
<div data-type="day" class="select-value is-selected">Thursday</div>
|
||||
<div data-type="day" class="select-value is-selected">Friday</div>
|
||||
<div data-type="day" class="select-value">Saturday</div>
|
||||
<div data-type="day" class="select-value">Sunday</div>
|
||||
</div>
|
||||
<div class="select-box select-box--four">
|
||||
<div data-type="hour" class="select-box-header">Hour</div>
|
||||
<div data-type="hour" class="select-value">12 am</div><!-- 0 Uhr -->
|
||||
<div data-type="hour" class="select-value">1 am</div>
|
||||
<div data-type="hour" class="select-value">2 am</div>
|
||||
<div data-type="hour" class="select-value">3 am</div>
|
||||
<div data-type="hour" class="select-value">4 am</div>
|
||||
<div data-type="hour" class="select-value">5 am</div>
|
||||
<div data-type="hour" class="select-value">6 am</div>
|
||||
<div data-type="hour" class="select-value is-selected">7 am</div>
|
||||
<div data-type="hour" class="select-value">8 am</div>
|
||||
<div data-type="hour" class="select-value">9 am</div>
|
||||
<div data-type="hour" class="select-value">10 am</div>
|
||||
<div data-type="hour" class="select-value">11 am</div>
|
||||
<div data-type="hour" class="select-value">12 am</div><!-- 12 Uhr -->
|
||||
<div data-type="hour" class="select-value is-selected">1 pm</div>
|
||||
<div data-type="hour" class="select-value">2 pm</div>
|
||||
<div data-type="hour" class="select-value">3 pm</div>
|
||||
<div data-type="hour" class="select-value">4 pm</div>
|
||||
<div data-type="hour" class="select-value">5 pm</div>
|
||||
<div data-type="hour" class="select-value">6 pm</div>
|
||||
<div data-type="hour" class="select-value">7 pm</div>
|
||||
<div data-type="hour" class="select-value">8 pm</div>
|
||||
<div data-type="hour" class="select-value">9 pm</div>
|
||||
<div data-type="hour" class="select-value">10 pm</div>
|
||||
<div data-type="hour" class="select-value">11 pm</div><!-- 23 Uhr -->
|
||||
</div>
|
||||
<div class="select-box select-box--vertical">
|
||||
<div data-type="minute" class="select-box-header">Minute</div>
|
||||
<div data-type="minute" class="select-value">00</div>
|
||||
<div data-type="minute" class="select-value">10</div>
|
||||
<div data-type="minute" class="select-value">20</div>
|
||||
<div data-type="minute" class="select-value is-selected">30</div>
|
||||
<div data-type="minute" class="select-value">40</div>
|
||||
<div data-type="minute" class="select-value">50</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,232 +1,3 @@
|
|||
<div class="modal modal--local">
|
||||
<div class="modal-backdrop"></div>
|
||||
<div class="modal-dialog">
|
||||
<form>
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<div class="modal-close js-close">
|
||||
<svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
|
||||
</div>
|
||||
<h1 class="modal-title">New Scheduler</h1>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<h2>Selector</h2>
|
||||
<p>Create rules that single out the tickets for automated processing.</p>
|
||||
<h3>Filters</h3>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
<option selected>Spam</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option>equals to</option>
|
||||
<option>contains</option>
|
||||
<option>begins with</option>
|
||||
<option>ends with</option>
|
||||
<option selected>is</option>
|
||||
<option>is not</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option selected>true</option>
|
||||
<option>false</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove is-disabled" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-preview">
|
||||
<h3>Preview <span class="subtitle"><span class="u-highlight">2</span> matches</span></h3>
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 28px"></th>
|
||||
<th>Customer</th>
|
||||
<th style="width: 42%">Title</th>
|
||||
<th>Group</th>
|
||||
<th style="width: 25%">Created</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="item" data-id="1" data-position="1" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-1">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/1"> <span title="Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf">
|
||||
Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-12T12:58:42.000Z" data-tooltip="01/12/2015 13:58">01/12/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="6" data-position="6" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/6"> <span title="script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler">
|
||||
script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-11T07:26:31.000Z" data-tooltip="06/11/2015 09:26">5 days 3 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h2>Actions</h2>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_2">
|
||||
<option selected>Move to trash</option>
|
||||
<option>Set to escalated</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove is-disabled js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Timer</h2>
|
||||
<p>
|
||||
When should the job run?<br>
|
||||
<output class="timer-output js-timerResult">
|
||||
Run every Monday, Tuesday, Wednesday, Thursday and Friday at 7:30 am and 1:30 pm.
|
||||
</output>
|
||||
</p>
|
||||
<div class="select-boxes">
|
||||
<div class="select-box select-box--vertical">
|
||||
<div class="select-box-header">Day</div>
|
||||
<div data-type="day" class="select-value is-selected">Monday</div>
|
||||
<div data-type="day" class="select-value is-selected">Tuesday</div>
|
||||
<div data-type="day" class="select-value is-selected">Wednesday</div>
|
||||
<div data-type="day" class="select-value is-selected">Thursday</div>
|
||||
<div data-type="day" class="select-value is-selected">Friday</div>
|
||||
<div data-type="day" class="select-value">Saturday</div>
|
||||
<div data-type="day" class="select-value">Sunday</div>
|
||||
</div>
|
||||
<div class="select-box select-box--four">
|
||||
<div data-type="hour" class="select-box-header">Hour</div>
|
||||
<div data-type="hour" class="select-value">12 am</div><!-- 0 Uhr -->
|
||||
<div data-type="hour" class="select-value">1 am</div>
|
||||
<div data-type="hour" class="select-value">2 am</div>
|
||||
<div data-type="hour" class="select-value">3 am</div>
|
||||
<div data-type="hour" class="select-value">4 am</div>
|
||||
<div data-type="hour" class="select-value">5 am</div>
|
||||
<div data-type="hour" class="select-value">6 am</div>
|
||||
<div data-type="hour" class="select-value is-selected">7 am</div>
|
||||
<div data-type="hour" class="select-value">8 am</div>
|
||||
<div data-type="hour" class="select-value">9 am</div>
|
||||
<div data-type="hour" class="select-value">10 am</div>
|
||||
<div data-type="hour" class="select-value">11 am</div>
|
||||
<div data-type="hour" class="select-value">12 am</div><!-- 12 Uhr -->
|
||||
<div data-type="hour" class="select-value is-selected">1 pm</div>
|
||||
<div data-type="hour" class="select-value">2 pm</div>
|
||||
<div data-type="hour" class="select-value">3 pm</div>
|
||||
<div data-type="hour" class="select-value">4 pm</div>
|
||||
<div data-type="hour" class="select-value">5 pm</div>
|
||||
<div data-type="hour" class="select-value">6 pm</div>
|
||||
<div data-type="hour" class="select-value">7 pm</div>
|
||||
<div data-type="hour" class="select-value">8 pm</div>
|
||||
<div data-type="hour" class="select-value">9 pm</div>
|
||||
<div data-type="hour" class="select-value">10 pm</div>
|
||||
<div data-type="hour" class="select-value">11 pm</div><!-- 23 Uhr -->
|
||||
</div>
|
||||
<div class="select-box select-box--vertical">
|
||||
<div data-type="minute" class="select-box-header">Minute</div>
|
||||
<div data-type="minute" class="select-value">00</div>
|
||||
<div data-type="minute" class="select-value">10</div>
|
||||
<div data-type="minute" class="select-value">20</div>
|
||||
<div data-type="minute" class="select-value is-selected">30</div>
|
||||
<div data-type="minute" class="select-value">40</div>
|
||||
<div data-type="minute" class="select-value">50</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="subtle-link standalone js-cancel" href="#/">Cancel & Go Back</a>
|
||||
<button type="submit" class="btn btn--success js-submit align-right">Create Schedule</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar NavBarAdmin">
|
||||
<h2>Manage</h2>
|
||||
|
||||
|
|
@ -297,23 +68,16 @@
|
|||
<div class="main flex">
|
||||
<div class="page-header">
|
||||
<div class="page-header-title">
|
||||
<h1>SLAs <small>Management</small></h1>
|
||||
<h1>Schedulers <small>Management</small></h1>
|
||||
</div>
|
||||
|
||||
<div class="page-header-meta">
|
||||
<a class="btn btn--success" data-type="new">New SLA</a>
|
||||
<a class="btn btn--success" data-type="new">New Scheduler</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-overview">
|
||||
<p>
|
||||
<strong>Service-Level-Agreements</strong>, abgekürzt <b>SLAs</b>, unterstützen Sie gegenüber Kunden gewisse zeitliche Reaktionen einzuhalten. Somit können Sie z. B. sagen Kunden sollen immer nach spätestens 8 Stunden eine Reaktion von Ihnen bekommen. Falls es zu einer drohenden Unterschreitung oder einer Unterschreitung kommt, weißt Zammad Sie auf solche Ereignisse hin.
|
||||
</p>
|
||||
<p>
|
||||
Es können <strong>Reaktionszeit</strong> (Zeit zwischen Erstellung eines Tickets und erster Reaktion eines Agenten), <strong>Aktualisierungszeit</strong> (Zeit zwischen Nachfrage eines Kunden und Reaktion eines Agenten) und <strong>Lösungszeit</strong> (Zeit zwischen Erstellung und schließen eines Tickets) definiert werden.
|
||||
</p>
|
||||
<p>
|
||||
Drohenden Unterschreitungen oder Unterschreitungen werden in einer eigenen Ansicht in den Übersichten angezeigt. Zudem können <strong>E-Mail Benachrichtigungen</strong> konfiguriert werden.
|
||||
</p>
|
||||
<div class="scheduler-list">
|
||||
<div class="scheduler">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,401 +1,3 @@
|
|||
<div class="modal modal--local">
|
||||
<div class="modal-backdrop"></div>
|
||||
<div class="modal-dialog">
|
||||
<form>
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<div class="modal-close js-close">
|
||||
<svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
|
||||
</div>
|
||||
<h1 class="modal-title">New Service Level Agreement (SLA)</h1>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<h2>Selector</h2>
|
||||
<p>Create rules that single out the tickets for the Service Level Agreement.</p>
|
||||
<h3>Filters</h3>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option>equals to</option>
|
||||
<option>contains</option>
|
||||
<option>begins with</option>
|
||||
<option>ends with</option>
|
||||
<option>is</option>
|
||||
<option>is not</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<input id="filter_value_1" type="text" class="form-control">
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove is-disabled" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-preview">
|
||||
<h3>Preview <span class="subtitle"><span class="u-highlight">5</span> matches</span></h3>
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 28px"></th>
|
||||
<th>Customer</th>
|
||||
<th style="width: 42%">Title</th>
|
||||
<th>Group</th>
|
||||
<th style="width: 25%">Created</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="item" data-id="1" data-position="1" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-1">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/1"> <span title="Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf">
|
||||
Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-12T12:58:42.000Z" data-tooltip="01/12/2015 13:58">01/12/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="3" data-position="3" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="4" data-original-title="" title="">
|
||||
Hans Huber
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/3"> <span title="Noch mehr Tickets bitte">
|
||||
Noch mehr Tickets bitte
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-20T11:47:43.000Z" data-tooltip="01/20/2015 12:47">01/20/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="4" data-position="4" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-3">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/4"> <span title="Welcome to Zammad!">
|
||||
Welcome to Zammad!
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-05-04T14:26:51.000Z" data-tooltip="05/04/2015 16:26">05/04/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="5" data-position="5" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-3">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/5"> <span title="das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debugge">
|
||||
das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debugge
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-10T13:41:29.000Z" data-tooltip="06/10/2015 15:41">5 days 21 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="6" data-position="6" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/6"> <span title="script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler">
|
||||
script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-11T07:26:31.000Z" data-tooltip="06/11/2015 09:26">5 days 3 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!--<h2>Auto Attributes</h2>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="horizontal-filter-text">Set</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_2">
|
||||
<option>Owner</option>
|
||||
<option>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter-text">to</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_2">
|
||||
<option>Max Reuter</option>
|
||||
<option>Caroline Blank</option>
|
||||
<option>Joe Noes</option>
|
||||
<option>Fizz Buzz</option>
|
||||
<option>Captain Chunk</option>
|
||||
<option>Marele Moon</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter-text">or</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_2">
|
||||
<option>-</option>
|
||||
<option>Caroline Blank</option>
|
||||
<option>Joe Noes</option>
|
||||
<option>Fizz Buzz</option>
|
||||
<option>Captain Chunk</option>
|
||||
<option>Marele Moon</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="horizontal-filter-text">Set</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_2">
|
||||
<option>Owner</option>
|
||||
<option>Group</option>
|
||||
<option>State</option>
|
||||
<option selected>Priority</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="horizontal-filter-text">to</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_2">
|
||||
<option>High</option>
|
||||
<option>Normal</option>
|
||||
<option>Low</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
<h2>Schedule</h2>
|
||||
<h3>Business Hours <span class="subtitle">in European Central Time <a class="btn btn--text btn--subtle" href="#">(change)</a></span></h3>
|
||||
<table class="settings-list settings-list--toggleColumn">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="monday" type="checkbox" checked> Mo</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="tuesday" type="checkbox" checked> Tu</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="wednesday" type="checkbox" checked> We</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="thursday" type="checkbox" checked> Th</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="friday" type="checkbox" checked> Fr</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="saturday" type="checkbox"> Sa</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="sunday" type="checkbox"> Su</label>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td data-column="monday" class="form-group day-time is-active">
|
||||
<label for="monday_start_time">from</label>
|
||||
<input type="time" id="monday_start_time" value="07:00" step="600">
|
||||
<td data-column="tuesday" class="form-group day-time is-active">
|
||||
<label for="tuesday_start_time">from</label>
|
||||
<input type="time" id="tuesday_start_time" value="07:00" step="600">
|
||||
<td data-column="wednesday" class="form-group day-time is-active">
|
||||
<label for="wednesday_start_time">from</label>
|
||||
<input type="time" id="wednesday_start_time" value="07:00" step="600">
|
||||
<td data-column="thursday" class="form-group day-time is-active">
|
||||
<label for="thursday_start_time">from</label>
|
||||
<input type="time" id="thursday_start_time" value="07:00" step="600">
|
||||
<td data-column="friday" class="form-group day-time is-active">
|
||||
<label for="friday_start_time">from</label>
|
||||
<input type="time" id="friday_start_time" value="07:00" step="600">
|
||||
<td data-column="saturday" class="form-group day-time">
|
||||
<label for="saturday_start_time">from</label>
|
||||
<input type="time" id="saturday_start_time" value="09:00" step="600">
|
||||
<td data-column="sunday" class="form-group day-time">
|
||||
<label for="sunday_start_time">from</label>
|
||||
<input type="time" id="sunday_start_time" step="600">
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-column="monday" class="form-group day-time is-active">
|
||||
<label for="monday_end_time">till</label>
|
||||
<input type="time" id="monday_end_time" value="18:00" step="600">
|
||||
<td data-column="tuesday" class="form-group day-time is-active">
|
||||
<label for="tuesday_end_time">till</label>
|
||||
<input type="time" id="tuesday_end_time" value="18:00" step="600">
|
||||
<td data-column="wednesday" class="form-group day-time is-active">
|
||||
<label for="wednesday_end_time">till</label>
|
||||
<input type="time" id="wednesday_end_time" value="18:00" step="600">
|
||||
<td data-column="thursday" class="form-group day-time is-active">
|
||||
<label for="thursday_end_time">till</label>
|
||||
<input type="time" id="thursday_end_time" value="18:00" step="600">
|
||||
<td data-column="friday" class="form-group day-time is-active">
|
||||
<label for="friday_end_time">till</label>
|
||||
<input type="time" id="friday_end_time" value="13:00" step="600">
|
||||
<td data-column="saturday" class="form-group day-time">
|
||||
<label for="saturday_end_time">till</label>
|
||||
<input type="time" id="saturday_end_time" value="16:00" step="600">
|
||||
<td data-column="sunday" class="form-group day-time">
|
||||
<label for="sunday_end_time">till</label>
|
||||
<input type="time" id="sunday_end_time" step="600">
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Response Times <span class="subtitle">in Business Hours</span></h3>
|
||||
<table class="settings-list settings-list--toggleRow">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Active
|
||||
<th>Type
|
||||
<th>Time <span class="text-muted">in hours</span>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="is-active">
|
||||
<td style="text-align: center"><input type="checkbox" checked class="js-activateRow" id="first_response_time">
|
||||
<td>
|
||||
<label class="inline-label" for="first_response_time">First Response Time</label>
|
||||
<p class="subtle">Timeframe for the first response.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
<tr class="is-active">
|
||||
<td style="text-align: center"><input type="checkbox" checked class="js-activateRow" id="update_time">
|
||||
<td>
|
||||
<label class="inline-label" for="update_time">Update Time</label>
|
||||
<p class="subtle">Timeframe for every following response.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center"><input type="checkbox" id="solution_time" class="js-activateRow">
|
||||
<td>
|
||||
<label class="inline-label" for="solution_time">Solution Time</label>
|
||||
<p class="subtle">Timeframe for solving the problem.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="subtle-link standalone js-cancel" href="#/">Cancel & Go Back</a>
|
||||
<button type="submit" class="btn btn--success js-submit align-right">Create SLA</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar NavBarAdmin">
|
||||
<h2>Manage</h2>
|
||||
|
||||
|
|
|
|||
285
app/assets/javascripts/app/views/layout_ref/sla_modal.jst.eco
Normal file
285
app/assets/javascripts/app/views/layout_ref/sla_modal.jst.eco
Normal file
|
|
@ -0,0 +1,285 @@
|
|||
<h2>Selector</h2>
|
||||
<p>Create rules that single out the tickets for the Service Level Agreement.</p>
|
||||
<h3>Filters</h3>
|
||||
<div class="horizontal-filters">
|
||||
<div class="horizontal-filter">
|
||||
<div class="horizontal-filter-body">
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_attribute_1">
|
||||
<optgroup label="Ticket">
|
||||
<option>Customer</option>
|
||||
<option>Owner</option>
|
||||
<option>Number</option>
|
||||
<option>Title</option>
|
||||
<option>Group</option>
|
||||
<option>State</option>
|
||||
<option>Priority</option>
|
||||
</optgroup>
|
||||
<optgroup label="Customer">
|
||||
<option>Email</option>
|
||||
<option>Country</option>
|
||||
<option>Group</option>
|
||||
<option>Organization</option>
|
||||
<option>Department</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
<optgroup label="Organization">
|
||||
<option>Country</option>
|
||||
<option>VIP</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="controls">
|
||||
<div class="u-positionOrigin">
|
||||
<select class="form-control" name="filter_operator_1">
|
||||
<option>equals to</option>
|
||||
<option>contains</option>
|
||||
<option>begins with</option>
|
||||
<option>ends with</option>
|
||||
<option>is</option>
|
||||
<option>is not</option>
|
||||
</select>
|
||||
<svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down"></use></svg>
|
||||
</div>
|
||||
</div>
|
||||
<input id="filter_value_1" type="text" class="form-control">
|
||||
</div>
|
||||
<div class="filter-controls">
|
||||
<div class="filter-control filter-control-remove js-remove is-disabled" title="Remove rule">
|
||||
<svg class="icon icon-minus"><use xlink:href="#icon-minus" /></svg>
|
||||
</div>
|
||||
<div class="filter-control filter-control-add js-add" title="Add new rule">
|
||||
<svg class="icon icon-plus"><use xlink:href="#icon-plus" /></svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-preview">
|
||||
<h3>Preview <span class="subtitle"><span class="u-highlight">5</span> matches</span></h3>
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 28px"></th>
|
||||
<th>Customer</th>
|
||||
<th style="width: 42%">Title</th>
|
||||
<th>Group</th>
|
||||
<th style="width: 25%">Created</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="item" data-id="1" data-position="1" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-1">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/1"> <span title="Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf">
|
||||
Welcome to our little planet with flowers and forests asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf asdfasdfasdfasdfasfasdfasdfasdfasdfasdfasdfasdfasdfasdf
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-12T12:58:42.000Z" data-tooltip="01/12/2015 13:58">01/12/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="3" data-position="3" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="4" data-original-title="" title="">
|
||||
Hans Huber
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/3"> <span title="Noch mehr Tickets bitte">
|
||||
Noch mehr Tickets bitte
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-01-20T11:47:43.000Z" data-tooltip="01/20/2015 12:47">01/20/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="4" data-position="4" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-3">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/4"> <span title="Welcome to Zammad!">
|
||||
Welcome to Zammad!
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-05-04T14:26:51.000Z" data-tooltip="05/04/2015 16:26">05/04/2015</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="5" data-position="5" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-3">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/5"> <span title="das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debugge">
|
||||
das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debuggen, da ich mir nicht das ist für mich schwer zu debugge
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-10T13:41:29.000Z" data-tooltip="06/10/2015 15:41">5 days 21 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="item" data-id="6" data-position="6" style="cursor: pointer;">
|
||||
<td>
|
||||
<svg class="icon-priority level-2">
|
||||
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-priority"></use>
|
||||
</svg>
|
||||
</td>
|
||||
<td> <span class="user-popover" data-id="2" data-original-title="" title="">
|
||||
Nicole Braun (Zammad Foundation)
|
||||
</span> </td>
|
||||
<td>
|
||||
<a href="#ticket/zoom/6"> <span title="script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler">
|
||||
script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler.rb start script/scheduler
|
||||
</span> </a>
|
||||
</td>
|
||||
<td> <span>
|
||||
Users
|
||||
</span> </td>
|
||||
<td class="noTruncate"> <span>
|
||||
<span class="humanTimeFromNow undefined" data-time="2015-06-11T07:26:31.000Z" data-tooltip="06/11/2015 09:26">5 days 3 hours ago</span> </span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h2>Schedule</h2>
|
||||
<h3>Business Hours <span class="subtitle">in European Central Time <a class="btn btn--text btn--subtle" href="#">(change)</a></span></h3>
|
||||
<table class="settings-list settings-list--toggleColumn">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="monday" type="checkbox" checked> Mo</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="tuesday" type="checkbox" checked> Tu</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="wednesday" type="checkbox" checked> We</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="thursday" type="checkbox" checked> Th</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="friday" type="checkbox" checked> Fr</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="saturday" type="checkbox"> Sa</label>
|
||||
<th style="text-align: center">
|
||||
<label class="day-name"><input class="js-activateColumn" data-target="sunday" type="checkbox"> Su</label>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td data-column="monday" class="form-group day-time is-active">
|
||||
<label for="monday_start_time">from</label>
|
||||
<input type="time" id="monday_start_time" value="07:00" step="600">
|
||||
<td data-column="tuesday" class="form-group day-time is-active">
|
||||
<label for="tuesday_start_time">from</label>
|
||||
<input type="time" id="tuesday_start_time" value="07:00" step="600">
|
||||
<td data-column="wednesday" class="form-group day-time is-active">
|
||||
<label for="wednesday_start_time">from</label>
|
||||
<input type="time" id="wednesday_start_time" value="07:00" step="600">
|
||||
<td data-column="thursday" class="form-group day-time is-active">
|
||||
<label for="thursday_start_time">from</label>
|
||||
<input type="time" id="thursday_start_time" value="07:00" step="600">
|
||||
<td data-column="friday" class="form-group day-time is-active">
|
||||
<label for="friday_start_time">from</label>
|
||||
<input type="time" id="friday_start_time" value="07:00" step="600">
|
||||
<td data-column="saturday" class="form-group day-time">
|
||||
<label for="saturday_start_time">from</label>
|
||||
<input type="time" id="saturday_start_time" value="09:00" step="600">
|
||||
<td data-column="sunday" class="form-group day-time">
|
||||
<label for="sunday_start_time">from</label>
|
||||
<input type="time" id="sunday_start_time" step="600">
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-column="monday" class="form-group day-time is-active">
|
||||
<label for="monday_end_time">till</label>
|
||||
<input type="time" id="monday_end_time" value="18:00" step="600">
|
||||
<td data-column="tuesday" class="form-group day-time is-active">
|
||||
<label for="tuesday_end_time">till</label>
|
||||
<input type="time" id="tuesday_end_time" value="18:00" step="600">
|
||||
<td data-column="wednesday" class="form-group day-time is-active">
|
||||
<label for="wednesday_end_time">till</label>
|
||||
<input type="time" id="wednesday_end_time" value="18:00" step="600">
|
||||
<td data-column="thursday" class="form-group day-time is-active">
|
||||
<label for="thursday_end_time">till</label>
|
||||
<input type="time" id="thursday_end_time" value="18:00" step="600">
|
||||
<td data-column="friday" class="form-group day-time is-active">
|
||||
<label for="friday_end_time">till</label>
|
||||
<input type="time" id="friday_end_time" value="13:00" step="600">
|
||||
<td data-column="saturday" class="form-group day-time">
|
||||
<label for="saturday_end_time">till</label>
|
||||
<input type="time" id="saturday_end_time" value="16:00" step="600">
|
||||
<td data-column="sunday" class="form-group day-time">
|
||||
<label for="sunday_end_time">till</label>
|
||||
<input type="time" id="sunday_end_time" step="600">
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>Response Times <span class="subtitle">in Business Hours</span></h3>
|
||||
<table class="settings-list settings-list--toggleRow">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Active
|
||||
<th>Type
|
||||
<th>Time <span class="text-muted">in hours</span>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="is-active">
|
||||
<td style="text-align: center"><input type="checkbox" checked class="js-activateRow" id="first_response_time">
|
||||
<td>
|
||||
<label class="inline-label" for="first_response_time">First Response Time</label>
|
||||
<p class="subtle">Timeframe for the first response.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
<tr class="is-active">
|
||||
<td style="text-align: center"><input type="checkbox" checked class="js-activateRow" id="update_time">
|
||||
<td>
|
||||
<label class="inline-label" for="update_time">Update Time</label>
|
||||
<p class="subtle">Timeframe for every following response.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center"><input type="checkbox" id="solution_time" class="js-activateRow">
|
||||
<td>
|
||||
<label class="inline-label" for="solution_time">Solution Time</label>
|
||||
<p class="subtle">Timeframe for solving the problem.</p>
|
||||
<td><input type="time" step="600" max="259200">
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
@ -4230,6 +4230,10 @@ footer {
|
|||
h2:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.table > thead > tr > th {
|
||||
background: hsl(197,20%,93%);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
|
|
@ -5219,15 +5223,15 @@ label + .wizard-buttonList {
|
|||
border: 1px solid hsl(198,19%,86%);
|
||||
|
||||
&:first-child {
|
||||
border-radius: 3px 3px 0 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-radius: 0 0 3px 3px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
&:only-child {
|
||||
border-radius: 3px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
& + .horizontal-filter {
|
||||
|
|
@ -5382,19 +5386,19 @@ output {
|
|||
}
|
||||
|
||||
thead th:first-child {
|
||||
border-top-left-radius: 3px;
|
||||
border-top-left-radius: 4px;
|
||||
}
|
||||
|
||||
thead th:last-child {
|
||||
border-top-right-radius: 3px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
|
||||
tbody tr:last-child td:first-child {
|
||||
border-bottom-left-radius: 3px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
|
||||
tbody tr:last-child td:last-child {
|
||||
border-bottom-right-radius: 3px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
|
|||
Loading…
Reference in a new issue