adebaumann/labhelper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add/remove/change image on box detail page added
All checks were successful
Build containers when image tags change / build-if-image-changed (., web, containers, main container, git.baumann.gr/adebaumann/labhelper) (push) Successful in 25s
Details
Build containers when image tags change / build-if-image-changed (data-loader, loader, initContainers, init-container, git.baumann.gr/adebaumann/labhelper-data-loader) (push) Successful in 6s
Details

Browse Source
This commit is contained in:
Adrian A. Baumann
2026-01-01 13:48:09 +01:00
parent c566e31ab5
commit 10cc24ff03
4 changed files with 64 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
boxes/templates/boxes/thing_detail.html
View File

@@ -30,6 +30,24 @@
</div>
</div>
{% endif %}
<form method="post" enctype="multipart/form-data" style="margin-top: 20px;">
{% csrf_token %}
<input type="hidden" name="action" value="upload_picture">
<div style="display: flex; gap: 10px; flex-wrap: wrap;">
<label class="btn" style="cursor: pointer; display: inline-flex; align-items: center; gap: 8px;">
<i class="fas fa-camera"></i>
<span>{% if thing.picture %}Change picture{% else %}Add picture{% endif %}</span>
<input type="file" name="picture" accept="image/*" style="display: none;" onchange="this.form.submit();">
</label>
{% if thing.picture %}
<button type="submit" name="action" value="delete_picture" class="btn" style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); border: none;" onclick="return confirm('Are you sure you want to delete this picture?');">
<i class="fas fa-trash"></i>
<span>Remove</span>
</button>
{% endif %}
</div>
</form>
</div>
<div class="thing-details" style="flex-grow: 1; min-width: 300px;">
@@ -68,6 +86,7 @@
<form method="post" class="section">
{% csrf_token %}
<input type="hidden" name="action" value="move">
<div style="display: flex; align-items: center; gap: 15px; flex-wrap: wrap;">
<div style="flex-grow: 1;">
<label for="new_box" style="font-weight: 600; color: #666; font-size: 14px; margin-bottom: 8px; display: block;">
@@ -99,5 +118,14 @@ $('#new_box').on('focus', function() {
$(this).css('border-color', '#e0e0e0');
$(this).css('box-shadow', 'none');
});
$('input[type="file"]').on('change', function() {
var fileName = $(this).val().split('\\').pop();
if (fileName) {
var form = $(this).closest('form');
form.append('<input type="hidden" name="action" value="upload_picture">');
form[0].submit();
}
});
</script>
{% endblock %}