rattail/tailbone
2
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Refactor the Edit Time Sheet view for "autocommit" mode

Browse source 
I.e. instead of letting changes queue up for "batch" mode, immediately
flush changes to server after each edit.
This commit is contained in:
Lance Edgar 2017-02-09 16:10:40 -06:00
parent d21c8bcaeb
commit 7ca03df04d
5 changed files with 309 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

14
tailbone/templates/shifts/base.mako
View file

@ -11,6 +11,11 @@
var data_modified = false;
var okay_to_leave = true;
var previous_selections = {};
var weekdays = [
% for i, day in enumerate(weekdays, 1):
'${day.strftime('%a %d %b %Y')}'${',' if i < len(weekdays) else ''}
% endfor
];
window.onbeforeunload = function() {
if (! okay_to_leave) {
@ -89,15 +94,6 @@
<%def name="edit_timetable_javascript()">
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.edit-shifts.js'))}
<script type="text/javascript">
var weekdays = [
% for i, day in enumerate(weekdays, 1):
'${day.strftime('%a %d %b %Y')}'${',' if i < len(weekdays) else ''}
% endfor
];
</script>
</%def>
<%def name="edit_timetable_styles()">

63
tailbone/templates/shifts/timesheet_edit.mako
View file

@ -3,7 +3,59 @@
<%def name="extra_javascript()">
${parent.extra_javascript()}
${self.edit_timetable_javascript()}
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.timesheet.edit.js'))}
<script type="text/javascript">
show_timepicker = false;
$(function() {
$('.timesheet').on('click', '.day', function() {
editing_day = $(this);
var editor = $('#day-editor');
var employee = editing_day.siblings('.employee').text();
var date = weekdays[editing_day.get(0).cellIndex - 1];
var shifts = editor.children('.shifts');
shifts.empty();
editing_day.children('.shift:not(.deleted)').each(function() {
var uuid = $(this).data('uuid');
var times = $.trim($(this).children('span').text()).split(' - ');
times[0] = times[0] == '??' ? '' : times[0];
times[1] = times[1] == '??' ? '' : times[1];
add_shift(false, uuid, times[0], times[1]);
});
if (! shifts.children('.shift').length) {
add_shift();
}
editor.dialog({
modal: true,
title: employee + ' - ' + date,
position: {my: 'center', at: 'center', of: editing_day},
width: 'auto',
autoResize: true,
buttons: [
{
text: "Save Changes",
click: function(event) {
$(event.target).button('disable').button('option', 'label', "Saving...");
cleanup_editor_input();
update_timetable();
$('#timetable-form').submit();
}
},
{
text: "Cancel",
click: function() {
editor.dialog('close');
}
}
]
});
});
});
</script>
</%def>
<%def name="extra_styles()">
@ -37,18 +89,9 @@
${h.csrf_token(request)}
</%def>
<%def name="edit_tools()">
<div class="buttons">
<button type="button" class="save-changes" disabled="disabled">Save Changes</button>
<button type="button" class="undo-changes" disabled="disabled">Undo Changes</button>
</div>
</%def>
${self.timesheet_wrapper(with_edit_form=True, change_employee='confirm_leave')}
${edit_tools()}
<div id="day-editor" style="display: none;">
<div class="shifts"></div>
<button type="button" id="add-shift">Add Shift</button>