Support image uploads in the "notes" markdown fields (#4615)

* Support image uploads in the "notes" markdown fields

- Implemented using the existing EasyMDE library
- Copy / paste support
- Drag / drop support

* Remove debug message

* Updated API version

* Better UX when saving notes

* Pin PIP version (for testing)

* Bug fixes

- Fix typo
- Use correct serializer type

* Add unit testing

* Update role permissions

* Typo fix

* Update migration file

* Adds a notes mixin class to be used for refactoring

* Refactor existing models with notes to use the new mixin

* Add helper function for finding all model types with a certain mixin

* Refactor barcode plugin to use new method

* Typo fix

* Add daily task to delete old / unused notes

* Bug fix for barcode refactoring

* Add unit testing for function

InvenTree/templates/js/translated/helpers.js

@@ -380,6 +380,10 @@ function renderLink(text, url, options={}) {
 }
 
 
+/*
+ * Configure an EasyMDE editor for the given element,
+ * allowing markdown editing of the notes field.
+ */
 function setupNotesField(element, url, options={}) {
 
     var editable = options.editable || false;
@@ -419,12 +423,24 @@ function setupNotesField(element, url, options={}) {
         element: document.getElementById(element),
         initialValue: initial,
         toolbar: toolbar_icons,
+        uploadImage: true,
+        imagePathAbsolute: true,
+        imageUploadFunction: function(imageFile, onSuccess, onError) {
+            // Attempt to upload the image to the InvenTree server
+            var form_data = new FormData();
+
+            form_data.append('image', imageFile);
+
+            inventreeFormDataUpload('{% url "api-notes-image-list" %}', form_data, {
+                success: function(response) {
+                    onSuccess(response.image);
+                },
+                error: function(xhr, status, error) {
+                    onError(error);
+                }
+            });
+        },
         shortcuts: [],
-        renderingConfig: {
-            markedOptions: {
-                sanitize: true,
-            }
-        }
     });
 
 
@@ -460,12 +476,15 @@ function setupNotesField(element, url, options={}) {
 
             data[options.notes_field || 'notes'] = mde.value();
 
+            $('#save-notes').find('#save-icon').removeClass('fa-save').addClass('fa-spin fa-spinner');
+
             inventreePut(url, data, {
                 method: 'PATCH',
                 success: function(response) {
-                    showMessage('{% trans "Notes updated" %}', {style: 'success'});
+                    $('#save-notes').find('#save-icon').removeClass('fa-spin fa-spinner').addClass('fa-check-circle');
                 },
                 error: function(xhr) {
+                    $('#save-notes').find('#save-icon').removeClass('fa-spin fa-spinner').addClass('fa-times-circle icon-red');
                     showApiError(xhr, url);
                 }
             });

InvenTree/templates/notes_buttons.html

@@ -1,8 +1,8 @@
 {% load i18n %}
 
 <button type='button' id='edit-notes' title='{% trans "Edit" %}' class='btn btn-primary'>
-    <span class='fas fa-edit'></span> {% trans "Edit" %}
+    <span id='edit-icon' class='fas fa-edit'></span> {% trans "Edit" %}
 </button>
 <button type='button' id='save-notes' title='{% trans "Save" %}' class='btn btn-success' style='display: none;'>
-    <span class='fas fa-save'></span> {% trans "Save" %}
+    <span id='save-icon' class='fas fa-save'></span> {% trans "Save" %}
 </button>