Add Vue.js support for "delete selected" grid feature

This commit is contained in:
Lance Edgar 2019-10-31 15:02:03 -05:00
parent ebc22d845a
commit a857d31776

View file

@ -191,7 +191,7 @@
% endif
% if use_buefy:
${h.form(url('{}.disable_set'.format(route_prefix)), class_='control', ref='disable_selected_form')}
${h.form(url('{}.disable_set'.format(route_prefix)), ref='disable_selected_form', class_='control')}
${h.csrf_token(request)}
${h.hidden('uuids', v_model='selected_uuids')}
<b-button :disabled="disableSelectedDisabled"
@ -209,13 +209,27 @@
% endif
## delete selected objects
% if master.set_deletable and request.has_perm('{}.delete_set'.format(permission_prefix)):
% if master.set_deletable and master.has_perm('delete_set'):
% if use_buefy:
${h.form(url('{}.delete_set'.format(route_prefix)), ref='delete_selected_form', class_='control')}
${h.csrf_token(request)}
${h.hidden('uuids', v_model='selected_uuids')}
<b-button type="is-danger"
:disabled="deleteSelectedDisabled"
@click="deleteSelectedSubmit()"
icon-pack="fas"
icon-left="trash">
{{ deleteSelectedText }}
</b-button>
${h.end_form()}
% else:
${h.form(url('{}.delete_set'.format(route_prefix)), name='delete-set', class_='control')}
${h.csrf_token(request)}
${h.hidden('uuids')}
<button type="button" class="button">Delete Selected</button>
${h.end_form()}
% endif
% endif
## delete search results
% if master.bulk_deletable and request.has_perm('{}.bulk_delete'.format(permission_prefix)):
@ -301,6 +315,7 @@
${parent.modify_this_page_vars()}
<script type="text/javascript">
## enable / disable selected objects
% if master.supports_set_enabled_toggle and master.has_perm('enable_disable_set'):
TailboneGridData.enableSelectedSubmitting = false
@ -360,6 +375,38 @@
}
% endif
## delete selected objects
% if master.set_deletable and master.has_perm('delete_set'):
TailboneGridData.deleteSelectedSubmitting = false
TailboneGridData.deleteSelectedText = "Delete Selected"
TailboneGrid.computed.deleteSelectedDisabled = function() {
if (this.deleteSelectedSubmitting) {
return true
}
if (!this.checkedRowUUIDs().length) {
return true
}
return false
}
TailboneGrid.methods.deleteSelectedSubmit = function() {
let uuids = this.checkedRowUUIDs()
if (!uuids.length) {
alert("You must first select one or more objects to disable.")
return
}
if (! confirm("Are you sure you wish to DELETE the " + uuids.length + " selected objects?")) {
return
}
this.deleteSelectedSubmitting = true
this.deleteSelectedText = "Working, please wait..."
this.$refs.delete_selected_form.submit()
}
% endif
</script>
</%def>