diff --git a/InvenTree/InvenTree/static/css/inventree.css b/InvenTree/InvenTree/static/css/inventree.css index b920205ca3..6dc6ad4822 100644 --- a/InvenTree/InvenTree/static/css/inventree.css +++ b/InvenTree/InvenTree/static/css/inventree.css @@ -183,6 +183,24 @@ -webkit-opacity: 10%; } +/* grid display for part images */ + +.table-img-grid tr { + display: inline; +} + +.table-img-grid td { + padding: 10px; + margin: 10px; +} + +.table-img-grid .grid-image { + + height: 128px; + width: 128px; + object-fit: contain; + background: #eee; +} .btn-glyph { padding-left: 6px; diff --git a/InvenTree/part/templates/part/part_base.html b/InvenTree/part/templates/part/part_base.html index 70640027ce..13d82c573b 100644 --- a/InvenTree/part/templates/part/part_base.html +++ b/InvenTree/part/templates/part/part_base.html @@ -28,13 +28,14 @@
-
+ Select Part Image

@@ -163,7 +164,7 @@ enableDragAndDrop( '#part-thumb', - "{% url 'part-image' part.id %}", + "{% url 'part-image-upload' part.id %}", { label: 'image', success: function(data, status, xhr) { @@ -210,13 +211,40 @@ $("#part-thumb").click(function() { launchModalForm( - "{% url 'part-image' part.id %}", + "{% url 'part-image-upload' part.id %}", { reload: true } ); }); + function onSelectImage(response) { + + $("#modal-form").find("#image-select-table").bootstrapTable({ + pagination: true, + pageSize: 25, + url: "{% url 'api-part-thumbs' %}", + showHeader: false, + columns: [ + { + field: 'image', + title: 'Image', + formatter: function(value, row, index, field) { + return "" + } + } + ], + }); + } + + $("#part-image-select").click(function() { + launchModalForm("{% url 'part-image-select' part.id %}", + { + reload: true, + after_render: onSelectImage + }); + }); + $("#part-edit").click(function() { launchModalForm( "{% url 'part-edit' part.id %}", diff --git a/InvenTree/part/templates/part/select_image.html b/InvenTree/part/templates/part/select_image.html new file mode 100644 index 0000000000..851688bf05 --- /dev/null +++ b/InvenTree/part/templates/part/select_image.html @@ -0,0 +1,20 @@ +{% extends "modal_form.html" %} + +{% block pre_form_content %} + +{{ block.super }} + +Select from existing images. + +{% endblock %} + +{% block form %} +
+{% csrf_token %} +{% load crispy_forms_tags %} + + +
+ +
+{% endblock %} \ No newline at end of file diff --git a/InvenTree/part/urls.py b/InvenTree/part/urls.py index 0a9adefe8f..48e647302a 100644 --- a/InvenTree/part/urls.py +++ b/InvenTree/part/urls.py @@ -57,7 +57,8 @@ part_detail_urls = [ url(r'^qr_code/?', views.PartQRCode.as_view(), name='part-qr'), # Normal thumbnail with form - url(r'^thumbnail/?', views.PartImage.as_view(), name='part-image'), + url(r'^thumbnail/?', views.PartImageUpload.as_view(), name='part-image-upload'), + url(r'^thumb-select/?', views.PartImageSelect.as_view(), name='part-image-select'), # Any other URLs go to the part detail page url(r'^.*$', views.PartDetail.as_view(), name='part-detail'), diff --git a/InvenTree/part/views.py b/InvenTree/part/views.py index 722588b51a..dbc57ece59 100644 --- a/InvenTree/part/views.py +++ b/InvenTree/part/views.py @@ -601,8 +601,8 @@ class PartQRCode(QRCodeView): return None -class PartImage(AjaxUpdateView): - """ View for uploading Part image """ +class PartImageUpload(AjaxUpdateView): + """ View for uploading a new Part image """ model = Part ajax_template_name = 'modal_form.html' @@ -622,6 +622,10 @@ class PartImageSelect(AjaxUpdateView): ajax_template_name = 'part/select_image.html' ajax_form_title = _('Select Part Image') + fields = [ + 'image', + ] + def get_data(self): return { 'success': _('Selected part image')