shimatta-kenkyusho/shimatta_kenkyusho/templates/parts/modals/add-stock-modal.html

82 lines
4.7 KiB
HTML

{% comment %}
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">
<div class="modal-header">
<h5 class="modal-title">Add Stock</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="dropdown">
<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>
</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-lot" class="form-label">Lot</label>
<input type="text" name="{{form.lot.html_name}}" id="add-stock-form-lot" class="form-control{% if form.lot.errors %} is-invalid{% endif %}" aria-describedby="add-stock-form-lot-err">
<div id="add-stock-form-lot-err" class="invalid-feedback">
{% for msg in form.lot.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>
<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>