mhu/shimatta-kenkyusho
2
0
Fork 0
Code Issues 15 Pull Requests 1 Releases Wiki Activity

Implement Add Stock modal

Browse Source
This commit is contained in:
Mario Hüttel
2021-11-08 23:11:05 +01:00
parent b4e561279b
commit fbb60b455f
8 changed files with 173 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
shimatta_kenkyusho/templates/parts/modals/add-stock-modal.html
View File

@@ -2,6 +2,7 @@
Input context:
- form: A stock-create-form
{% endcomment %}
{% load static %}
<div class="modal fade" id="add-stock-modal">
<div class="modal-dialog">
<div class="modal-content">
@@ -14,12 +15,59 @@ Input context:
<input class="form-control" autocomplete="off" data-bs-toggle="dropdown" type="search" id="add-stock-search" placeholder="Search Component" aria-label="Search for Component">
<ul class="dropdown-menu" aria-labelledby="add-stock-search" id="add-stock-search-ac-dropdown">
</div>
<hr>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<input type="submit" class="btn btn-primary" value="Add Stock" name="submit-add-stock">
</div>
<form method="post">
{% csrf_token %}
<div class="modal-body">
<div id="add-stock-modal-component-container" class="mb-3">
<h4>No component selected.<h4>
<!-- Will be filled dynamically by selecting a component from the dropdown list -->
</div>
<input type="hidden" name="{{form.component_uuid.name}}" id="add-stock-modal-comp-uuid" value="{{form.component_uuid.value}}" required>
<div class="mb-3">
<label for="add-stock-form-amount" class="form-label">Amount</label>
<input id="add-stock-form-amount" type="number" class="form-control{% if form.amount.errors %} is-invalid{% endif %}" min="0" name="{{form.amount.name}}" value="{{form.amount.value}}" required aria-describedby="add-stock-form-amount-err">
<div id="add-stock-form-amount-err" class="invalid-feedback">
{% for msg in form.amount.errors %}
{{msg}}
{% endfor %}
</div>
</div>
<div class="mb-3">
<label for="add-stock-form-watermark" class="form-label">Watermark</label>
<div class="input-group">
<div class="input-group-text">
<input class="form-check-input mt-0" type="checkbox" {% if form.watermark_active.value %}checked{% endif %} name="{{form.watermark_active.name}}">
</div>
<input id="add-stock-form-watermark" type="number" class="form-control{% if form.watermark.errors %} is-invalid{% endif %}" name="{{form.watermark.name}}" value="{{form.watermark.value}}" min="0" required aria-describedby="add-stock-form-watermark-err">
<div id="add-stock-form-watermark-err" class="invalid-feedback">
{% for msg in form.watermark.errors %}
{{msg}}
{% endfor %}
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<input type="submit" class="btn btn-primary" value="Add Stock" name="submit-add-stock">
{% if form.non_field_errors %}
{% for error in form.non_field_errors %}
<p class="text-danger text-center">{{ error }}</p>
{% endfor %}
{% endif %}
</div>
</form>
</div>
</div>
</div>
</div>
<template id="add-stock-modal-component-template">
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img id="add-stock-cmp-img" src="{% static 'css/icons/card-image.svg' %}" style="width:64px;max-height:64px;">
</div>
<div class="flex-grow-1 ms-1" id="add-stock-cmp-desc-container">
</div>
</div>
</template>

22
shimatta_kenkyusho/templates/parts/stocks-detail.html
View File

@@ -121,6 +121,7 @@
{% endblock content %}
{% block custom_scripts %}
<script type="text/javascript" src="{% static 'js/add-stock-modal.js' %}"></script>
<script type="text/javascript">
{% if add_storage_form.errors %}
@@ -133,6 +134,26 @@
var d_modal = bootstrap.Modal.getOrCreateInstance(deleteStorageModal);
d_modal.show();
{% endif %}
{% if add_stock_form.errors %}
var uuid = "{{add_stock_form.component_uuid.value}}";
if (uuid && uuid != '' && uuid != 'None') {
api_get_component_from_id(uuid, function(component){
var add_stock_modal_div = document.querySelector('#add-stock-modal');
var add_stock_modal = bootstrap.Modal.getOrCreateInstance(add_stock_modal_div);
fill_add_stock_modal_component(component);
add_stock_modal.show();
console.log(component)
}, function(){
var add_stock_modal_div = document.querySelector('#add-stock-modal');
var add_stock_modal = bootstrap.Modal.getOrCreateInstance(add_stock_modal_div);
add_stock_modal.show();
});
} else {
var add_stock_modal_div = document.querySelector('#add-stock-modal');
var add_stock_modal = bootstrap.Modal.getOrCreateInstance(add_stock_modal_div);
add_stock_modal.show();
}
{% endif %}
new AutocompleteText('{{add_storage_form.responsible.id_for_label}}', '{{add_storage_form.responsible.id_for_label}}-ac-dropdown',
function(search, autocomplete_obj) {
@@ -150,7 +171,6 @@ function(search, autocomplete_obj) {
<script type="text/javascript">
const fallback_img_path = "{% static 'css/icons/card-image.svg' %}";
</script>
<script type="text/javascript" src="{% static 'js/add-stock-modal.js' %}"></script>
{% endblock custom_scripts %}