150 lines
7.4 KiB
Django/Jinja
150 lines
7.4 KiB
Django/Jinja
{% extends 'base.html.j2' %}
|
|
{% block title %}{{ product.name }} | Sigl{% endblock %}
|
|
{% block header %}
|
|
<div class="flex flex-col justify-start items-start sm:flex-row sm:justify-between sm:items-center sm:py-1">
|
|
<div class="text-sm w-full text-gray-800 py-1 border-b sm:border-none">Edit <span class="font-bold ">{{ product.name }}</span></span></div>
|
|
</div>
|
|
{% endblock %}
|
|
{% block main %}
|
|
<form method="post">
|
|
<div class="py-2 px-4 flex flex-col">
|
|
<div class="flex flex-col pb-4">
|
|
<label for="name" class="py-1 text-xs text-gray-700 font-semibold">Product Name:</label>
|
|
<input type="text" name="name" id="name" class="p-1 text-sm border border-gray-200 rounded" value="{{ product.name }}" />
|
|
</div>
|
|
<div class="flex flex-col pb-4">
|
|
<label for="category" class="py-1 text-xs text-gray-700 font-semibold">Product Category:</label>
|
|
<input type="text" name="category" id="category" class="p-1 text-sm border border-gray-200 rounded" value="{{ product.category }}" />
|
|
</div>
|
|
<div class="flex flex-col pb-4">
|
|
<label for="notes" class="py-1 text-xs text-gray-700 font-semibold">Notes:</label>
|
|
<textarea name="notes" id="notes" class="p-1 text-sm border border-gray-200 rounded">{{ product.notes or '' }}</textarea>
|
|
</div>
|
|
<div class="pb-4">
|
|
<fieldset>
|
|
<legend class="text-sm font-semibold">Product Locations</legend>
|
|
<table class="w-full table-fixed mx-2">
|
|
<thead>
|
|
<tr class="text-sm">
|
|
<th class="w-2/5 text-left">Store</th>
|
|
<th class="w-1/4 text-left">Aisle</th>
|
|
<th class="w-1/4 text-left">Bin</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for loc in product.locations %}
|
|
<tr>
|
|
<td>{{ loc.store }}</td>
|
|
<td>{{ loc.aisle }}</td>
|
|
<td>{{ loc.bin or '' }}</td>
|
|
<td>
|
|
<button type="button" class="pt-1 text-red-600 hover:text-red-700" onclick='removeLocation("{{ loc.store }}")'>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mx-1" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z" />
|
|
</svg>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td><input type="text" id="locStore" class="w-full border rounded text" /></td>
|
|
<td><input type="text" id="locAisle" class="w-full border rounded text" /></td>
|
|
<td><input type="text" id="locBin" class="w-full border rounded text" /></td>
|
|
<td>
|
|
<button type="button" class="pt-1 text-green-600 hover:text-green-700" onclick="addLocation()">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mx-1" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z" />
|
|
</svg>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</fieldset>
|
|
</div>
|
|
<div class="flex items-center justify-between w-full">
|
|
<div class="flex items-center">
|
|
<a href="{{ url_for('products.home') }}" class="px-2 py-1 text-sm text-white bg-gray-600 hover:bg-gray-700 border rounded flex justify-between items-center">
|
|
Cancel
|
|
</a>
|
|
<button type="button" id="delete-item-btn" class="flex ml-2 px-2 py-1 text-sm text-white bg-red-600 hover:bg-red-700 border rounded flex justify-between items-center" onclick="deleteItem()">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="pr-1 h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
|
|
</svg>
|
|
Delete Product
|
|
</button>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="px-2 py-1 border rounded text-sm text-white bg-blue-600 hover:bg-blue-700">Update Item</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<form action="{{ url_for('products.delete', id=product.id) }}" method="post" id="delete-item-form"></form>
|
|
<form action="{{ url_for('products.addLocation', id=product.id) }}" method="post" id="add-loc-form">
|
|
<input type="hidden" name="store" id="addLocationStore" />
|
|
<input type="hidden" name="aisle" id="addLocationAisle" />
|
|
<input type="hidden" name="bin" id="addLocationBin" />
|
|
</form>
|
|
<form action="{{ url_for('products.removeLocation', id=product.id) }}" method="post" id="remove-loc-form">
|
|
<input type="hidden" name="store" id="removeLocationStore" />
|
|
</form>
|
|
<script language="javascript">
|
|
function deleteItem() {
|
|
const delForm = document.getElementById('delete-item-form');
|
|
console.log(delForm);
|
|
if (delForm && confirm('Are you sure you want to delete product "{{ product.name }}"? This cannot be undone.')) {
|
|
console.log(delForm.action);
|
|
delForm.submit();
|
|
}
|
|
}
|
|
function addLocation() {
|
|
const form = document.getElementById('add-loc-form');
|
|
const fStore = document.getElementById('addLocationStore');
|
|
const fAisle = document.getElementById('addLocationAisle');
|
|
const fBin = document.getElementById('addLocationBin');
|
|
|
|
const iStore = document.getElementById('locStore');
|
|
const iAisle = document.getElementById('locAisle');
|
|
const iBin = document.getElementById('locBin');
|
|
|
|
if (!form || !fStore || !fAisle || !fBin || !iStore || !iAisle || !iBin) {
|
|
document.dispatchEvent(
|
|
new CustomEvent('notice', {
|
|
detail: {
|
|
type: 'error',
|
|
text: 'An internal error occurred when adding the product location.',
|
|
},
|
|
})
|
|
);
|
|
}
|
|
|
|
fStore.value = iStore.value;
|
|
fAisle.value = iAisle.value;
|
|
fBin.value = iBin.value;
|
|
|
|
form.submit();
|
|
}
|
|
function removeLocation(store) {
|
|
const form = document.getElementById('remove-loc-form');
|
|
const fStore = document.getElementById('removeLocationStore');
|
|
|
|
if (!form || !fStore) {
|
|
document.dispatchEvent(
|
|
new CustomEvent('notice', {
|
|
detail: {
|
|
type: 'error',
|
|
text: 'An internal error occurred when removing the product location.',
|
|
},
|
|
})
|
|
);
|
|
}
|
|
|
|
fStore.value = store;
|
|
form.submit();
|
|
}
|
|
</script>
|
|
{% endblock %} |