Implement component deletion

This commit is contained in:
2022-01-01 17:53:10 +01:00
parent 8ef217f224
commit dbbd8b4a99
4 changed files with 109 additions and 149 deletions

View File

@@ -22,6 +22,7 @@
<a class="btn btn-secondary mb-2" href="{{component.datasheet_link}}"><i class="bi bi-file-pdf-fill"></i> Datasheet</a>
{% endif %}
<button class="btn btn-primary mb-2" data-bs-toggle="modal" data-bs-target="#comp-edit-modal"><i class="bi bi-pencil-square"></i> Edit Component</button>
<button class="btn btn-danger mb-2" data-bs-toggle="modal" data-bs-target="#component-delete-modal"><i class="bi bi-file-x"></i> Delete {{component.name}}</button>
</div>
</div>
<div class="col m-1">
@@ -144,15 +145,54 @@
</div>
</div>
{% endif %}
<!-- Delete modal -->
<div class="modal fade" id="component-delete-modal" tabindex="-1">
<div class="modal-dialog modal-lg modal-fullscreen-lg-down">
<div class="modal-content">
<div class="modal-header">
<h5>{{component.name}}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<h4>Delete this Component?</h4>
{% if delete_error %}
<div class="alert alert-danger">
{{delete_error}}
</div>
{% if protected_stuff %}
<h4>Following prevent the deletion:</h4>
<ul>
{% for elem in protected_stuff %}
<li>{{elem}}</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
</div>
<div class="modal-footer">
<form action="" method="post">
{% csrf_token %}
<button type="submit" class="btn btn-danger" name="submit-component-delete"><i class="bi bi-file-x"></i> Delete {{component.name}}</button>
</form>
</div>
</div>
</div>
</div>
{% include 'parts/modals/edit-component-modal.html' with heading="Edit "|add:component.name form=comp_form %}
{% endblock content %}
{% block custom_scripts %}
<script type="text/javascript">
{% if edit_form.errors %}
{% if comp_form.errors %}
bootstrap.Modal.getOrCreateInstance(document.getElementById('comp-edit-modal')).show()
{% endif %}
{% if delete_error %}
bootstrap.Modal.getOrCreateInstance(document.getElementById('component-delete-modal')).show();
{% endif %}
</script>
{% endblock custom_scripts %}

View File

@@ -5,7 +5,15 @@
<div class="row">
<div class="col-md">
<h2>Components</h2>
<div class="list-group">
<form action="" method="get">
<div class="input-group mb-3">
<input class="form-control" name="search" type="search" placeholder="Search Component..." {% if search_string %}value="{{search_string}}"{% endif %}>
<button type="submit" class="btn btn-primary">
<i class="bi bi-search"></i>
</button>
<button class="btn btn-success" type="button" data-bs-toggle="modal" data-bs-target="#comp-edit-modal"><i class="bi bi-plus-circle"></i> Add Component</button> </div>
</form>
<div class="list-group mb-3">
{% for comp in components %}
<a href="{% url 'parts-components-detail' uuid=comp.id %}" class="text-decoration-none">
<li class="list-group-item list-group-item-action d-flex align-items-center">
@@ -35,4 +43,15 @@
</div>
</div>
</div>
{% endblock content %}
{% include 'parts/modals/edit-component-modal.html' with form=comp_form heading='New Component' %}
{% endblock content %}
{% block custom_scripts %}
<script type="text/javascript">
{% if comp_form.errors %}
bootstrap.Modal.getOrCreateInstance(document.getElementById('comp-edit-modal')).show()
{% endif %}
</script>
{% endblock custom_scripts %}