Add "worksheet file" pattern for editing batches

lets user download a worksheet, edit, then upload back to update the batch
This commit is contained in:
Lance Edgar 2020-09-18 12:17:04 -05:00
parent 37a60592f6
commit 711ed947a3
5 changed files with 262 additions and 14 deletions

View file

@ -10,7 +10,7 @@
var has_execution_options = ${'true' if master.has_execution_options(batch) else 'false'};
$(function() {
% if master.has_worksheet:
% if master.has_worksheet and master.allow_worksheet(batch) and master.has_perm('worksheet'):
$('.load-worksheet').click(function() {
disable_button(this);
location.href = '${url('{}.worksheet'.format(route_prefix), uuid=batch.uuid)}';
@ -24,6 +24,36 @@
location.href = '${url('{}.refresh'.format(route_prefix), uuid=batch.uuid)}';
});
% endif
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
$('.upload-worksheet').click(function() {
$('#upload-worksheet-dialog').dialog({
title: "Upload Worksheet",
width: 600,
modal: true,
buttons: [
{
text: "Upload & Update Batch",
click: function(event) {
var form = $('form[name="upload-worksheet"]');
var field = form.find('input[type="file"]').get(0);
if (!field.value) {
alert("Please choose a file to upload.");
return
}
disable_button(dialog_button(event));
form.submit();
}
},
{
text: "Cancel",
click: function() {
$(this).dialog('close');
}
}
]
});
});
% endif
});
</script>
@ -59,6 +89,7 @@
<div class="buttons">
${self.leading_buttons()}
${refresh_button()}
${self.trailing_buttons()}
</div>
</%def>
@ -81,7 +112,8 @@
## TODO: this should surely use a POST request?
<once-button tag="a"
href="${url('{}.refresh'.format(route_prefix), uuid=batch.uuid)}"
text="Refresh Data">
text="Refresh Data"
icon-left="fas fa-redo">
</once-button>
% else:
<button type="button" class="button" id="refresh-data">Refresh Data</button>
@ -89,6 +121,28 @@
% endif
</%def>
<%def name="trailing_buttons()">
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
% if use_buefy:
<b-button tag="a"
href="${master.get_action_url('download_worksheet', batch)}"
icon-pack="fas"
icon-left="fas fa-download">
Download Worksheet
</b-button>
<b-button type="is-primary"
icon-pack="fas"
icon-left="fas fa-upload"
@click="$emit('show-upload')">
Upload Worksheet
</b-button>
% else:
${h.link_to("Download Worksheet", master.get_action_url('download_worksheet', batch), class_='button')}
<button type="button" class="upload-worksheet">Upload Worksheet</button>
% endif
% endif
</%def>
<%def name="object_helpers()">
${self.render_status_breakdown()}
${self.render_execute_helper()}
@ -206,6 +260,54 @@
<%def name="render_this_page()">
${parent.render_this_page()}
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
% if use_buefy:
<b-modal has-modal-card
:active.sync="showUploadDialog">
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Upload Worksheet</p>
</header>
<section class="modal-card-body">
<p>
This will <span class="has-text-weight-bold">update</span>
the batch data with the worksheet file you provide.&nbsp;
Please be certain to use the right one!
</p>
<br />
<${upload_worksheet_form.component} ref="uploadForm">
</${upload_worksheet_form.component}>
</section>
<footer class="modal-card-foot">
<b-button @click="showUploadDialog = false">
Cancel
</b-button>
<b-button type="is-primary"
@click="submitUpload()"
icon-pack="fas"
icon-left="fas fa-upload"
:disabled="uploadButtonDisabled">
{{ uploadButtonText }}
</b-button>
</footer>
</div>
</b-modal>
% else:
<div id="upload-worksheet-dialog" style="display: none;">
<p>
This will <strong>update</strong> the batch data with the worksheet
file you provide.&nbsp; Please be certain to use the right one!
</p>
${upload_worksheet_form.render_deform(buttons=False, form_kwargs={'name': 'upload-worksheet'})|n}
</div>
% endif
% endif
% if not use_buefy:
% if master.handler.executable(batch) and master.has_perm('execute'):
<div id="execution-options-dialog" style="display: none;">
@ -213,22 +315,59 @@
</div>
% endif
% endif
</%def>
<%def name="render_this_page_template()">
${parent.render_this_page_template()}
% if use_buefy and master.handler.executable(batch) and master.has_perm('execute'):
## TODO: stop using |n filter
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% if use_buefy:
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
${upload_worksheet_form.render_deform(buttons=False, form_kwargs={'ref': 'actualUploadForm'})|n}
% endif
% if master.handler.executable(batch) and master.has_perm('execute'):
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% endif
% endif
</%def>
<%def name="render_buefy_form()">
<div class="form">
<${form.component} @show-upload="showUploadDialog = true">
</${form.component}>
</div>
</%def>
<%def name="modify_this_page_vars()">
${parent.modify_this_page_vars()}
<script type="text/javascript">
ThisPageData.statusBreakdownData = ${json.dumps(status_breakdown_grid.get_buefy_data()['data'])|n}
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
ThisPageData.showUploadDialog = false
ThisPageData.uploadButtonText = "Upload & Update Batch"
ThisPageData.uploadButtonDisabled = false
ThisPage.methods.submitUpload = function() {
let form = this.$refs.uploadForm
let value = form.field_model_worksheet_file
if (!value) {
alert("Please choose a file to upload.")
return
}
this.uploadButtonDisabled = true
this.uploadButtonText = "Working, please wait..."
form.submit()
}
${upload_worksheet_form.component_studly}.methods.submit = function() {
this.$refs.actualUploadForm.submit()
}
## end 'external_worksheet'
% endif
% if not batch.executed and master.has_perm('execute'):
ThisPageData.showExecutionDialog = false
@ -247,6 +386,16 @@
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
<script type="text/javascript">
## UploadForm
${upload_worksheet_form.component_studly}.data = function() { return ${upload_worksheet_form.component_studly}Data }
Vue.component('${upload_worksheet_form.component}', ${upload_worksheet_form.component_studly})
</script>
% endif
% if not batch.executed and master.has_perm('execute'):
<script type="text/javascript">