Refactor image fragment to improve code readability and maintainability
This commit is contained in:
parent
d488324c50
commit
028cb84fed
1 changed files with 43 additions and 41 deletions
|
@ -4,49 +4,51 @@
|
|||
<!-- Image fragment -->
|
||||
<div class="image-slot text-center">
|
||||
{% if image %}
|
||||
<img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}" class="img-thumbnail w-100"
|
||||
style="height: auto;" data-bs-toggle="modal" data-bs-target="#imageModal-{{ id }}">
|
||||
<div class="modal fade" id="imageModal-{{ id }}" tabindex="-1" style="z-index: 9999;">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body text-center">
|
||||
<img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}" class="img-fluid">
|
||||
</div>
|
||||
{% if enabled %}
|
||||
<div class="modal-footer justify-content-between">
|
||||
<button class="btn btn-danger" onclick="ImageWidget.deleteImage('{{ id }}', '{{ image.id }}')">
|
||||
{{ icons.render_icon('trash') }}
|
||||
</button>
|
||||
|
||||
<form method="POST" enctype="multipart/form-data" id="image-upload-form-{{ id }}" class="d-none">
|
||||
<input type="file" id="image-upload-input-{{ id }}" name="file"
|
||||
onchange="ImageWidget.submitImageUpload('{{ id }}')">
|
||||
<input type="hidden" name="target_model" value="inventory">
|
||||
<input type="hidden" name="model_id" value="{{ id }}">
|
||||
<input type="hidden" name="caption" value="Uploaded via UI">
|
||||
</form>
|
||||
|
||||
<label class="btn btn-secondary mb0" for="image-upload-input-{{ id }}">
|
||||
{{ icons.render_icon('upload') }}
|
||||
</label>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}" class="img-thumbnail w-100"
|
||||
style="height: auto;" data-bs-toggle="modal" data-bs-target="#imageModal-{{ id }}">
|
||||
<div class="modal fade" id="imageModal-{{ id }}" tabindex="-1" style="z-index: 9999;">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body text-center">
|
||||
<img src="{{ url_for('static', filename=image.filename) }}" alt="Image of ID {{ id }}"
|
||||
class="img-fluid">
|
||||
</div>
|
||||
{% if enabled %}
|
||||
<div class="modal-footer justify-content-between">
|
||||
<button class="btn btn-danger" onclick="ImageWidget.deleteImage('{{ id }}', '{{ image.id }}')">
|
||||
{{ icons.render_icon('trash') }}
|
||||
</button>
|
||||
|
||||
<form method="POST" enctype="multipart/form-data" id="image-upload-form-{{ id }}" class="d-none">
|
||||
<input type="file" id="image-upload-input-{{ id }}" name="file"
|
||||
onchange="ImageWidget.submitImageUpload('{{ id }}')">
|
||||
<input type="hidden" name="target_model" value="inventory">
|
||||
<input type="hidden" name="model_id" value="{{ id }}">
|
||||
<input type="hidden" name="caption" value="Uploaded via UI">
|
||||
</form>
|
||||
|
||||
<label class="btn btn-secondary mb0" for="image-upload-input-{{ id }}">
|
||||
{{ icons.render_icon('upload') }}
|
||||
</label>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
{% if enabled %}
|
||||
<a href="#" class="link-secondary" onclick="document.getElementById('image-upload-input-{{ id }}').click(); return false;">
|
||||
{{ icons.render_icon('image', 256) }}
|
||||
</a>
|
||||
<form method="POST" enctype="multipart/form-data" id="image-upload-form-{{ id }}" class="d-none">
|
||||
<input type="file" id="image-upload-input-{{ id }}" name="file"
|
||||
onchange="ImageWidget.submitImageUpload('{{ id }}')">
|
||||
<input type="hidden" name="target_model" value="inventory">
|
||||
<input type="hidden" name="model_id" value="{{ id }}">
|
||||
<input type="hidden" name="caption" value="Uploaded via UI">
|
||||
</form>
|
||||
{% endif %}
|
||||
{% if enabled %}
|
||||
<a href="#" class="link-secondary"
|
||||
onclick="document.getElementById('image-upload-input-{{ id }}').click(); return false;">
|
||||
{{ icons.render_icon('image', 256) }}
|
||||
</a>
|
||||
<form method="POST" enctype="multipart/form-data" id="image-upload-form-{{ id }}" class="d-none">
|
||||
<input type="file" id="image-upload-input-{{ id }}" name="file"
|
||||
onchange="ImageWidget.submitImageUpload('{{ id }}')">
|
||||
<input type="hidden" name="target_model" value="inventory">
|
||||
<input type="hidden" name="model_id" value="{{ id }}">
|
||||
<input type="hidden" name="caption" value="Uploaded via UI">
|
||||
</form>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
{% endmacro %}
|
Loading…
Add table
Add a link
Reference in a new issue