Merge branch 'develop' of github.com:martini/zammad into develop
This commit is contained in:
commit
dba01295c8
3 changed files with 163 additions and 69 deletions
|
@ -1310,6 +1310,9 @@ App.Config.set( 'layout_ref/sla', slaRef, 'Routes' )
|
||||||
|
|
||||||
class schedulersRef extends App.ControllerContent
|
class schedulersRef extends App.ControllerContent
|
||||||
|
|
||||||
|
events:
|
||||||
|
'click .select-value': 'select'
|
||||||
|
|
||||||
constructor: ->
|
constructor: ->
|
||||||
super
|
super
|
||||||
@render()
|
@render()
|
||||||
|
@ -1317,6 +1320,52 @@ class schedulersRef extends App.ControllerContent
|
||||||
render: ->
|
render: ->
|
||||||
@html App.view('layout_ref/schedulers')()
|
@html App.view('layout_ref/schedulers')()
|
||||||
|
|
||||||
|
select: (event) =>
|
||||||
|
target = $(event.currentTarget)
|
||||||
|
|
||||||
|
if target.hasClass('is-selected')
|
||||||
|
# prevent zero selections
|
||||||
|
if target.siblings('.is-selected').size() > 0
|
||||||
|
target.removeClass('is-selected')
|
||||||
|
else
|
||||||
|
target.addClass('is-selected')
|
||||||
|
|
||||||
|
@createOutputString()
|
||||||
|
|
||||||
|
createOutputString: ->
|
||||||
|
days = $.map(@$('[data-type=day]').filter('.is-selected'), (el) -> return $(el).text() )
|
||||||
|
hours = $.map(@$('[data-type=hour]').filter('.is-selected'), (el) -> return $(el).text() )
|
||||||
|
minutes = $.map(@$('[data-type=minute]').filter('.is-selected'), (el) -> return $(el).text() )
|
||||||
|
|
||||||
|
hours = @injectMinutes(hours, minutes)
|
||||||
|
|
||||||
|
days = @joinItems days
|
||||||
|
hours = @joinItems hours
|
||||||
|
|
||||||
|
@$('.js-timerResult').text("Run every #{ days } at #{ hours }")
|
||||||
|
|
||||||
|
injectMinutes: (hours, minutes) ->
|
||||||
|
newHours = [] # hours.length x minutes.length long
|
||||||
|
|
||||||
|
for hour in hours
|
||||||
|
# split off am/pm
|
||||||
|
[hour, suffix] = hour.split(" ")
|
||||||
|
|
||||||
|
for minute in minutes
|
||||||
|
combined = "#{ hour }:#{ minute }"
|
||||||
|
combined += " #{suffix}" if suffix
|
||||||
|
|
||||||
|
newHours.push combined
|
||||||
|
|
||||||
|
return newHours
|
||||||
|
|
||||||
|
joinItems: (items) ->
|
||||||
|
switch items.length
|
||||||
|
when 1 then return items[0]
|
||||||
|
when 2 then return "#{ items[0] } and #{ items[1] }"
|
||||||
|
else
|
||||||
|
return "#{ items.slice(0, -1).join(', ') } and #{ items[items.length-1] }"
|
||||||
|
|
||||||
App.Config.set( 'layout_ref/schedulers', schedulersRef, 'Routes' )
|
App.Config.set( 'layout_ref/schedulers', schedulersRef, 'Routes' )
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -166,80 +166,61 @@
|
||||||
<p>
|
<p>
|
||||||
When should the job run?<br>
|
When should the job run?<br>
|
||||||
<output class="timer-output js-timerResult">
|
<output class="timer-output js-timerResult">
|
||||||
Run every Monday, Tuesday, Wednesday, Thursday and Friday at 07:30 o'clock.
|
Run every Monday, Tuesday, Wednesday, Thursday and Friday at 7:30 am and 1:30 pm.
|
||||||
</output>
|
</output>
|
||||||
</p>
|
</p>
|
||||||
<table class="settings-list">
|
<div class="select-boxes">
|
||||||
<thead>
|
<div class="select-box select-box--vertical">
|
||||||
<tr>
|
<div class="select-box-header">Day</div>
|
||||||
<th>Day
|
<div data-type="day" class="select-value is-selected">Monday</div>
|
||||||
<th colspan="3">Hour
|
<div data-type="day" class="select-value is-selected">Tuesday</div>
|
||||||
<th>Minute
|
<div data-type="day" class="select-value is-selected">Wednesday</div>
|
||||||
</tr>
|
<div data-type="day" class="select-value is-selected">Thursday</div>
|
||||||
</thead>
|
<div data-type="day" class="select-value is-selected">Friday</div>
|
||||||
<tbody>
|
<div data-type="day" class="select-value">Saturday</div>
|
||||||
<tr>
|
<div data-type="day" class="select-value">Sunday</div>
|
||||||
<td><label><input type="checkbox" checked> Monday</label>
|
</div>
|
||||||
<td><label><input type="checkbox"> 00:00</label>
|
<div class="select-box select-box--four">
|
||||||
<td><label><input type="checkbox"> 08:00</label>
|
<div data-type="hour" class="select-box-header">Hour</div>
|
||||||
<td><label><input type="checkbox"> 16:00</label>
|
<div data-type="hour" class="select-value">12 am</div><!-- 0 Uhr -->
|
||||||
<td><label><input type="checkbox"> 00</label>
|
<div data-type="hour" class="select-value">1 am</div>
|
||||||
</tr>
|
<div data-type="hour" class="select-value">2 am</div>
|
||||||
<tr>
|
<div data-type="hour" class="select-value">3 am</div>
|
||||||
<td><label><input type="checkbox" checked> Tuesday</label>
|
<div data-type="hour" class="select-value">4 am</div>
|
||||||
<td><label><input type="checkbox"> 01:00</label>
|
<div data-type="hour" class="select-value">5 am</div>
|
||||||
<td><label><input type="checkbox"> 09:00</label>
|
<div data-type="hour" class="select-value">6 am</div>
|
||||||
<td><label><input type="checkbox"> 17:00</label>
|
<div data-type="hour" class="select-value is-selected">7 am</div>
|
||||||
<td><label><input type="checkbox"> 10</label>
|
<div data-type="hour" class="select-value">8 am</div>
|
||||||
</tr>
|
<div data-type="hour" class="select-value">9 am</div>
|
||||||
<tr>
|
<div data-type="hour" class="select-value">10 am</div>
|
||||||
<td><label><input type="checkbox" checked> Wednesday</label>
|
<div data-type="hour" class="select-value">11 am</div>
|
||||||
<td><label><input type="checkbox"> 02:00</label>
|
<div data-type="hour" class="select-value">12 am</div><!-- 12 Uhr -->
|
||||||
<td><label><input type="checkbox"> 10:00</label>
|
<div data-type="hour" class="select-value is-selected">1 pm</div>
|
||||||
<td><label><input type="checkbox"> 18:00</label>
|
<div data-type="hour" class="select-value">2 pm</div>
|
||||||
<td><label><input type="checkbox"> 20</label>
|
<div data-type="hour" class="select-value">3 pm</div>
|
||||||
</tr>
|
<div data-type="hour" class="select-value">4 pm</div>
|
||||||
<tr>
|
<div data-type="hour" class="select-value">5 pm</div>
|
||||||
<td><label><input type="checkbox" checked> Thursday</label>
|
<div data-type="hour" class="select-value">6 pm</div>
|
||||||
<td><label><input type="checkbox"> 03:00</label>
|
<div data-type="hour" class="select-value">7 pm</div>
|
||||||
<td><label><input type="checkbox"> 11:00</label>
|
<div data-type="hour" class="select-value">8 pm</div>
|
||||||
<td><label><input type="checkbox"> 19:00</label>
|
<div data-type="hour" class="select-value">9 pm</div>
|
||||||
<td><label><input type="checkbox" checked> 30</label>
|
<div data-type="hour" class="select-value">10 pm</div>
|
||||||
</tr>
|
<div data-type="hour" class="select-value">11 pm</div><!-- 23 Uhr -->
|
||||||
<tr>
|
</div>
|
||||||
<td><label><input type="checkbox" checked> Friday</label>
|
<div class="select-box select-box--vertical">
|
||||||
<td><label><input type="checkbox"> 04:00</label>
|
<div data-type="minute" class="select-box-header">Minute</div>
|
||||||
<td><label><input type="checkbox"> 12:00</label>
|
<div data-type="minute" class="select-value">00</div>
|
||||||
<td><label><input type="checkbox"> 20:00</label>
|
<div data-type="minute" class="select-value">10</div>
|
||||||
<td><label><input type="checkbox"> 40</label>
|
<div data-type="minute" class="select-value">20</div>
|
||||||
</tr>
|
<div data-type="minute" class="select-value is-selected">30</div>
|
||||||
<tr>
|
<div data-type="minute" class="select-value">40</div>
|
||||||
<td><label><input type="checkbox"> Saturday</label>
|
<div data-type="minute" class="select-value">50</div>
|
||||||
<td><label><input type="checkbox"> 05:00</label>
|
</div>
|
||||||
<td><label><input type="checkbox"> 13:00</label>
|
</div>
|
||||||
<td><label><input type="checkbox"> 21:00</label>
|
|
||||||
<td><label><input type="checkbox"> 50</label>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td><label><input type="checkbox"> Sunday</label>
|
|
||||||
<td><label><input type="checkbox"> 05:00</label>
|
|
||||||
<td><label><input type="checkbox"> 14:00</label>
|
|
||||||
<td><label><input type="checkbox"> 22:00</label>
|
|
||||||
<td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<td><label><input type="checkbox" checked> 07:00</label>
|
|
||||||
<td><label><input type="checkbox"> 15:00</label>
|
|
||||||
<td><label><input type="checkbox"> 23:00</label>
|
|
||||||
<td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<a class="subtle-link standalone js-cancel" href="#/">Cancel & Go Back</a>
|
<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>
|
<button type="submit" class="btn btn--success js-submit align-right">Create Schedule</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -5402,6 +5402,70 @@ output {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.select-boxes {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-box {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin: 0 14px;
|
||||||
|
border-left: 1px solid hsl(0,0%,94%);
|
||||||
|
border-top: 1px solid hsl(0,0%,94%);
|
||||||
|
|
||||||
|
&.select-box--vertical .select-value {
|
||||||
|
flex-basis: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.select-box--four .select-value {
|
||||||
|
flex-basis: 25%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.select-box--six .select-value {
|
||||||
|
flex-basis: calc(100%/6);
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-box-header {
|
||||||
|
@extend label;
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 10px;
|
||||||
|
flex-basis: 100%;
|
||||||
|
white-space: nowrap;
|
||||||
|
background: hsl(200,20%,97%);
|
||||||
|
border-right: 1px solid hsl(0,0%,94%);
|
||||||
|
border-bottom: 1px solid hsl(0,0%,91%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-value {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 34px;
|
||||||
|
border-right: 1px solid hsl(0,0%,94%);
|
||||||
|
border-bottom: 1px solid hsl(0,0%,94%);
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&.is-selected {
|
||||||
|
background: hsl(203,65%,55%);
|
||||||
|
color: white;
|
||||||
|
border-bottom-color: hsl(202,68%,48%);
|
||||||
|
border-right-color: hsl(202,68%,48%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
||||||
----------------
|
----------------
|
||||||
|
|
Loading…
Reference in a new issue