Enable drag-and-drop attachment upload for Part

InvenTree/InvenTree/static/script/inventree/inventree.js

@@ -140,10 +140,13 @@ function enableDragAndDrop(element, url, options) {
         url - URL to POST the file to
         options - object with following possible values:
             label - Label of the file to upload (default='file')
+            data - Other form data to upload
             success - Callback function in case of success
             error - Callback function in case of error
     */
 
+    data = options.data || {};
+
     $(element).on('drop', function(event) {
 
         var transfer = event.originalEvent.dataTransfer;
@@ -152,6 +155,11 @@ function enableDragAndDrop(element, url, options) {
 
         var formData = new FormData();
 
+        // Add the extra data
+        for (var key in data) {
+            formData.append(key, data[key]);
+        }
+
         if (isFileTransfer(transfer)) {
             formData.append(label, transfer.files[0]);
             

InvenTree/part/templates/part/attachments.html

@@ -16,6 +16,20 @@
 {% block js_ready %}
 {{ block.super }}
 
+    enableDragAndDrop(
+        '#attachment-dropzone',
+        "{% url 'part-attachment-create' %}",
+        {
+            data: {
+                part: {{ part.id }},
+            },
+            label: 'attachment',
+            success: function(data, status, xhr) {
+                location.reload();
+            }
+        }
+    );
+
     $("#new-attachment").click(function() {
         launchModalForm("{% url 'part-attachment-create' %}?part={{ part.id }}",
             {

InvenTree/templates/attachment_table.html

@@ -6,6 +6,7 @@
     </div>
 </div>
 
+<div class='dropzone' id='attachment-dropzone'>
 <table class='table table-striped table-condensed' data-toolbar='#attachment-buttons' id='attachment-table'>
     <thead>
         <tr>
@@ -38,3 +39,4 @@
         {% endfor %}
     </tbody>
 </table>
+</div>