Skip to content

Commit

Permalink
Use modal popups for "change stock line details" forms
Browse files Browse the repository at this point in the history
  • Loading branch information
@sde1000
sde1000 committed Jun 25, 2024
1 parent e4d6362 commit f951a5f
Show file tree
Hide file tree
Showing 4 changed files with 154 additions and 72 deletions.
74 changes: 50 additions & 24 deletions quicktill/tillweb/templates/tillweb/stockline-continuous.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,46 +6,72 @@

{% block tillcontent %}

{% if form %}
<form action="" method="post">{% csrf_token %}
{% include "form-horizontal.html" %}
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
{% else %}
<table class="kvtable">
<table class="kvtable mb-2">
<tr><th>Name</th><td>{{stockline.name}}</td></tr>
<tr><th>Location</th><td><a href="{% url "tillweb-location" pubname=pubname location=stockline.location %}">{{stockline.location}}</a></td></tr>
<tr><th>Stock type</th><td><a href="{{stockline.stocktype.get_absolute_url}}">{{stockline.stocktype}}</a></td></tr>
<tr><th>Amount remaining</th><td>{{stockline.remaining_str}}</td></tr>
</table>
{% endif %}

<p class="mt-2">This is a "continuous" stock line. Continuous stock
lines never have any stock items explicitly on sale. Instead, when
a sale is made the till searches for stock of the specified type
that is not already on sale on another stock line, and uses that.
If a particular stock item doesn't have enough stock left for the
whole sale, multiple stock items are used. Continuous stock lines
are typically used where a single sale (for example of a glass of
wine) can come from multiple stock items (eg. where a wine bottle
<p>This is a "continuous" stock line. Continuous stock lines never
have any stock items explicitly on sale. Instead, when a sale is
made the till searches for stock of the specified type that is not
already on sale on another stock line, and uses that. If a
particular stock item doesn't have enough stock left for the whole
sale, multiple stock items are used. Continuous stock lines are
typically used where a single sale (for example of a glass of wine)
can come from multiple stock items (eg. where a wine bottle
finishes, and the next bottle is from a different case or even a
different delivery).</p>

{% if form %}
<button class="btn btn-secondary mb-2" type="button" data-toggle="modal" data-target="#changeModal">
Change details
</button>
<div class="modal fade" id="changeModal" tabindex="-1" aria-labelledby="changeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="changeModalLabel">Edit stock line</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form action="" method="post">{% csrf_token %}
<div class="modal-body">
{% include "form-horizontal.html" %}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">
Cancel
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
</div>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
</div>
</div>
</div>
{% endif %}

{% if stockline.stocktype.stockonsale %}
<h2>Items on sale</h2>

<p>(The total amount remaining in these items is
{{stockline.remaining_str}}.)</p>
{% with stocklist=stockline.stocktype.stockonsale exclude_column="stockline" %}
{% include "tillweb/stocklist.html" %}
{% endwith %}
{% endif %}

<div class="mb-2"></div>

{% include "tillweb/bindings.html" %}

Expand Down
72 changes: 47 additions & 25 deletions quicktill/tillweb/templates/tillweb/stockline-display.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,40 +6,62 @@

{% block tillcontent %}

{% if form %}
<form action="" method="post">{% csrf_token %}
{% include "form-horizontal.html" %}
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
{% else %}
<table class="kvtable">
<table class="kvtable mb-2">
<tr><th>Name</th><td>{{stockline.name}}</td></tr>
<tr><th>Location</th><td><a href="{% url "tillweb-location" pubname=pubname location=stockline.location %}">{{stockline.location}}</a></td></tr>
<tr><th>Stock type</th><td><a href="{{stockline.stocktype.get_absolute_url}}">{{stockline.stocktype}}</a></td></tr>
<tr><th>Capacity</th><td>{{stockline.capacity}}</td></tr>
</table>
{% endif %}

<p class="mt-2">This is a "display" stock line. Display stock lines
can have several stock items on sale at once. Moving from one stock
item to the next is automatic; when one item is empty the next is
used. These stock lines have a "capacity", and the system keeps
track of how many units of each stock item are "on display" and
available to be sold; the "capacity" is the number of units that can
be on display at any one time (for example, in a fridge). Display
stock lines are typically used where it isn't obvious to the member
of staff where one stock item finishes and another one starts; for
<p>This is a "display" stock line. Display stock lines can have
several stock items on sale at once. Moving from one stock item to
the next is automatic; when one item is empty the next is used.
These stock lines have a "capacity", and the system keeps track of
how many units of each stock item are "on display" and available to
be sold; the "capacity" is the number of units that can be on
display at any one time (for example, in a fridge). Display stock
lines are typically used where it isn't obvious to the member of
staff where one stock item finishes and another one starts; for
example, the bottles on display in a fridge may come from several
different stock items.</p>

{% if form %}
<button class="btn btn-secondary mb-2" type="button" data-toggle="modal" data-target="#changeModal">
Change details
</button>
<div class="modal fade" id="changeModal" tabindex="-1" aria-labelledby="changeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="changeModalLabel">Edit stock line</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form action="" method="post">{% csrf_token %}
<div class="modal-body">
{% include "form-horizontal.html" %}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">
Cancel
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
</div>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
</div>
</div>
</div>
{% endif %}

{% if stockline.stockonsale %}
<h2>Items on sale</h2>

Expand Down
68 changes: 45 additions & 23 deletions quicktill/tillweb/templates/tillweb/stockline-regular.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,60 @@

{% block tillcontent %}

{% if form %}
<form action="" method="post">{% csrf_token %}
{% include "form-horizontal.html" %}
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
{% else %}
<table class="kvtable">
<table class="kvtable mb-2">
<tr><th>Name</th><td>{{stockline.name}}</td></tr>
<tr><th>Location</th><td><a href="{% url "tillweb-location" pubname=pubname location=stockline.location %}">{{stockline.location}}</a></td></tr>
<tr><th>Stock type</th><td>{% if stockline.stocktype %}<a href="{{stockline.stocktype.get_absolute_url}}">{{stockline.stocktype}}</a>{% else %}Unrestricted{% endif %}</td></tr>
<tr><th>Department</th><td>{% if stockline.department %}<a href="{{stockline.department.get_absolute_url}}">{{stockline.department}}</a>{% else %}Unrestricted{% endif %}</td></tr>
<tr><th>Pullthru</th><td>{{stockline.pullthru}}</td></tr>
<tr><th>Pull through qty</th><td>{{stockline.pullthru}}</td></tr>
</table>
{% endif %}

<p class="mt-2">This is a "regular" stock line. Regular stock lines
can have at most one stock item on sale at any one time. Finishing
that stock item and putting another item on sale are done explicitly
by the staff. They are typically used where units are dispensed
directly from the stock item to the customer and it's obvious to the
member of staff when the stock item is empty, for example casks/kegs
<p>This is a "regular" stock line. Regular stock lines can have at
most one stock item on sale at any one time. Finishing that stock
item and putting another item on sale are done explicitly by the
staff. They are typically used where units are dispensed directly
from the stock item to the customer and it's obvious to the member
of staff when the stock item is empty, for example casks/kegs
through a pump, bottles of spirits, cards or boxes of snacks, and so
on.</p>

{% if form %}
<button class="btn btn-secondary mb-2" type="button" data-toggle="modal" data-target="#changeModal">
Change details
</button>
<div class="modal fade" id="changeModal" tabindex="-1" aria-labelledby="changeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="changeModalLabel">Edit stock line</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<form action="" method="post">{% csrf_token %}
<div class="modal-body">
{% include "form-horizontal.html" %}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">
Cancel
</button>
<button class="btn btn-danger" type="submit" name="submit_delete" formnovalidate{% if stockline.stockonsale %} disabled{% endif %}>
Delete stock line
</button>
<button class="btn btn-primary" type="submit" name="submit_update">
Update stock line
</button>
</div>
<datalist id="locations">
{% for l in locations %}<option value="{{l}}">{% endfor %}
</datalist>
</form>
</div>
</div>
</div>
{% endif %}

{% if not stockline.stockonsale %}
<p>There is nothing currently on sale on this stock line.</p>
{% endif %}
Expand Down
12 changes: 12 additions & 0 deletions quicktill/tillweb/templates/tillweb/stocklines.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ <h2 id="regular">Regular stock lines</h2>
is empty, for example casks/kegs through a pump, bottles of spirits,
cards or boxes of snacks, and so on.</p>

{% if regular %}
<table class="table table-striped table-hover table-sm" id="regularstocklinelist">
<thead class="thead-light">
<tr>
Expand Down Expand Up @@ -43,6 +44,9 @@ <h2 id="regular">Regular stock lines</h2>
$("#regularstocklinelist").tablesorter();
});
</script>
{% else %}
<p>No regular stock lines exist at the moment.</p>
{% endif %}

<h2 id="display">Display stock lines</h2>

Expand All @@ -57,6 +61,7 @@ <h2 id="display">Display stock lines</h2>
another one starts; for example, the bottles on display in a fridge
may come from several different stock items.</p>

{% if display %}
<table class="table table-striped table-hover table-sm" id="displaystocklinelist">
<thead class="thead-light">
<tr>
Expand Down Expand Up @@ -87,6 +92,9 @@ <h2 id="display">Display stock lines</h2>
$("#displaystocklinelist").tablesorter();
});
</script>
{% else %}
<p>No display stock lines exist at the moment.</p>
{% endif %}

<h2 id="continuous">Continuous stock lines</h2>

Expand All @@ -100,6 +108,7 @@ <h2 id="continuous">Continuous stock lines</h2>
(eg. where a wine bottle finishes, and the next bottle is from a
different case).</p>

{% if continuous %}
<table class="table table-striped table-hover table-sm" id="continuousstocklinelist">
<thead class="thead-light">
<tr>
Expand All @@ -126,5 +135,8 @@ <h2 id="continuous">Continuous stock lines</h2>
$("#continuousstocklinelist").tablesorter();
});
</script>
{% else %}
<p>No continuous stock lines exist at the moment.</p>
{% endif %}

{% endblock %}

0 comments on commit f951a5f

Please sign in to comment.