05/07 Phase 3: initial codes
This commit is contained in:
@@ -0,0 +1,115 @@
|
||||
{% extends "tenant/layouts/base.html" %}
|
||||
{% block title %}POS Checkout{% endblock %}
|
||||
{% block content %}
|
||||
<h4 class="fw-bold mb-4"><i class="bi bi-cash-register me-2"></i>Checkout</h4>
|
||||
|
||||
<form method="POST" action="{{ url_for('pos.submit') }}" novalidate>
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
||||
{% if appointment %}
|
||||
<input type="hidden" name="appointment_id" value="{{ appointment.id }}">
|
||||
{% endif %}
|
||||
|
||||
<div class="row g-3">
|
||||
<!-- Left: items -->
|
||||
<div class="col-lg-7">
|
||||
<div class="card shadow-sm mb-3">
|
||||
<div class="card-header fw-semibold">Services</div>
|
||||
<div class="card-body">
|
||||
{% for s in services %}
|
||||
<div class="form-check mb-1">
|
||||
<input class="form-check-input" type="checkbox" name="service_ids"
|
||||
value="{{ s.id }}" id="svc_{{ s.id }}"
|
||||
{{ 'checked' if appointment and appointment.service_id == s.id }}>
|
||||
<label class="form-check-label" for="svc_{{ s.id }}">
|
||||
{{ s.name }} <span class="text-muted small">({{ s.duration_min }}min)</span>
|
||||
<span class="fw-semibold">${{ "%.2f"|format(s.price) }}</span>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% if services %}
|
||||
<div class="card shadow-sm mb-3">
|
||||
<div class="card-header fw-semibold">Products</div>
|
||||
<div class="card-body">
|
||||
{% for p in products %}
|
||||
<div class="form-check mb-1">
|
||||
<input class="form-check-input" type="checkbox" name="product_ids"
|
||||
value="{{ p.id }}" id="prod_{{ p.id }}">
|
||||
<label class="form-check-label" for="prod_{{ p.id }}">
|
||||
{{ p.name }} <span class="fw-semibold">${{ "%.2f"|format(p.sale_price) }}</span>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- Right: payment details -->
|
||||
<div class="col-lg-5">
|
||||
<div class="card shadow-sm mb-3">
|
||||
<div class="card-header fw-semibold">Payment Details</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Customer</label>
|
||||
<select class="form-select" name="customer_id">
|
||||
<option value="">— Walk-in / No Customer —</option>
|
||||
{% for c in customers %}
|
||||
<option value="{{ c.id }}"
|
||||
{{ 'selected' if appointment and appointment.customer_id == c.id }}>
|
||||
{{ c.name }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Staff</label>
|
||||
<select class="form-select" name="staff_id">
|
||||
<option value="">— Not assigned —</option>
|
||||
{% for s in staff_list %}
|
||||
<option value="{{ s.id }}"
|
||||
{{ 'selected' if appointment and appointment.staff_id == s.id }}>
|
||||
{{ s.name }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Payment Method</label>
|
||||
<select class="form-select" name="payment_method">
|
||||
{% for m in payment_methods %}
|
||||
<option value="{{ m }}">{{ m.title() }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Payment Reference <small class="text-muted">(optional)</small></label>
|
||||
<input type="text" class="form-control" name="payment_reference"
|
||||
placeholder="Transaction ID, note…">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Tip ($)</label>
|
||||
<input type="number" step="0.01" class="form-control" name="tip_amount"
|
||||
value="0" min="0">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Gift Card Code</label>
|
||||
<input type="text" class="form-control font-monospace" name="gift_card_code"
|
||||
placeholder="XXXX-XXXX-XXXX">
|
||||
</div>
|
||||
<div class="form-check mb-3">
|
||||
<input class="form-check-input" type="checkbox" name="rebook" value="1" id="rebook">
|
||||
<label class="form-check-label" for="rebook">Schedule next visit after checkout</label>
|
||||
</div>
|
||||
<div class="d-grid">
|
||||
<button type="submit" class="btn btn-success btn-lg">
|
||||
<i class="bi bi-check-circle me-2"></i>Complete Checkout
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,43 @@
|
||||
{% extends "tenant/layouts/base.html" %}
|
||||
{% block title %}Schedule Next Visit{% endblock %}
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-6">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header fw-semibold"><i class="bi bi-calendar-plus me-2"></i>Schedule Next Visit</div>
|
||||
<div class="card-body">
|
||||
{% if error %}<div class="alert alert-danger py-2">{{ error }}</div>{% endif %}
|
||||
<form method="POST" novalidate>
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Date & Time <span class="text-danger">*</span></label>
|
||||
<input type="datetime-local" class="form-control" name="start_time" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Service</label>
|
||||
<select class="form-select" name="service_id">
|
||||
<option value="">— Same as today —</option>
|
||||
{% for s in services %}
|
||||
<option value="{{ s.id }}">{{ s.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Staff</label>
|
||||
<select class="form-select" name="staff_id">
|
||||
<option value="">— Any —</option>
|
||||
{% for s in staff_list %}
|
||||
<option value="{{ s.id }}" {{ 'selected' if transaction.staff_id == s.id }}>{{ s.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button type="submit" class="btn btn-primary">Schedule</button>
|
||||
<a href="{{ url_for('pos.receipt', transaction_id=transaction.id) }}" class="btn btn-outline-secondary">Skip</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,64 @@
|
||||
{% extends "tenant/layouts/base.html" %}
|
||||
{% block title %}Receipt #{{ transaction.id }}{% endblock %}
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-6">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body p-4">
|
||||
<div class="text-center mb-4">
|
||||
<h5 class="fw-bold">{{ tenant.name }}</h5>
|
||||
{% if location %}<p class="text-muted small mb-0">{{ location.name }}</p>{% endif %}
|
||||
<p class="text-muted small">{{ transaction.created_at.strftime('%B %d, %Y %I:%M %p') }}</p>
|
||||
<p class="text-muted small">Receipt #{{ transaction.id }}</p>
|
||||
{% if transaction.voided_at %}
|
||||
<div class="alert alert-danger py-1 mt-2">VOIDED — {{ transaction.void_reason }}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<table class="table table-sm mb-3">
|
||||
<tbody>
|
||||
{% for item in items %}
|
||||
<tr>
|
||||
<td>
|
||||
{% if item.service %}{{ item.service.name }}
|
||||
{% elif item.product %}{{ item.product.name }}
|
||||
{% endif %}
|
||||
{% if item.discount_percent > 0 %}
|
||||
<span class="badge bg-success ms-1">{{ item.discount_percent }}% off</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text-end">
|
||||
{% if item.discount_percent > 0 %}
|
||||
<del class="text-muted small">${{ "%.2f"|format(item.original_price) }}</del>
|
||||
{% endif %}
|
||||
${{ "%.2f"|format(item.unit_price) }}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
<tfoot class="fw-semibold">
|
||||
{% if transaction.discount > 0 %}
|
||||
<tr class="text-success"><td>Savings</td><td class="text-end">-${{ "%.2f"|format(transaction.discount) }}</td></tr>
|
||||
{% endif %}
|
||||
{% if transaction.tip_amount > 0 %}
|
||||
<tr><td>Tip</td><td class="text-end">${{ "%.2f"|format(transaction.tip_amount) }}</td></tr>
|
||||
{% endif %}
|
||||
{% if transaction.gift_card_amount > 0 %}
|
||||
<tr class="text-info"><td>Gift Card</td><td class="text-end">-${{ "%.2f"|format(transaction.gift_card_amount) }}</td></tr>
|
||||
{% endif %}
|
||||
<tr class="table-dark fs-5"><td>Total</td><td class="text-end">${{ "%.2f"|format(transaction.total) }}</td></tr>
|
||||
<tr><td>Payment</td><td class="text-end">{{ transaction.payment_method.title() }}</td></tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<div class="d-flex gap-2 justify-content-center flex-wrap">
|
||||
<a href="{{ url_for('pos.checkout') }}" class="btn btn-primary">New Transaction</a>
|
||||
<a href="{{ url_for('pos.rebook', transaction_id=transaction.id) }}" class="btn btn-outline-primary">Rebook</a>
|
||||
{% if not transaction.voided_at %}
|
||||
<a href="{{ url_for('pos.void', transaction_id=transaction.id) }}" class="btn btn-outline-danger">Void</a>
|
||||
{% endif %}
|
||||
<a href="{{ url_for('pos.transactions') }}" class="btn btn-outline-secondary">Transactions</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,32 @@
|
||||
{% extends "tenant/layouts/base.html" %}
|
||||
{% block title %}Transactions{% endblock %}
|
||||
{% block content %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h4 class="fw-bold mb-0">Transactions</h4>
|
||||
<input type="date" class="form-control form-control-sm" value="{{ view_date.isoformat() }}"
|
||||
onchange="window.location='{{ url_for('pos.transactions') }}?date='+this.value"
|
||||
style="width:150px;">
|
||||
</div>
|
||||
<div class="card shadow-sm">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover mb-0">
|
||||
<thead class="table-light"><tr><th>Time</th><th>Customer</th><th>Staff</th><th>Total</th><th>Method</th><th>Tip</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
{% for t in transactions %}
|
||||
<tr>
|
||||
<td class="small">{{ t.created_at.strftime('%I:%M %p') }}</td>
|
||||
<td class="small">{{ t.customer.name if t.customer else '—' }}</td>
|
||||
<td class="small">{{ t.staff.name if t.staff else '—' }}</td>
|
||||
<td class="fw-semibold">${{ "%.2f"|format(t.total) }}</td>
|
||||
<td class="small">{{ t.payment_method.title() }}</td>
|
||||
<td class="small">{% if t.tip_amount > 0 %}${{ "%.2f"|format(t.tip_amount) }}{% else %}—{% endif %}</td>
|
||||
<td><a href="{{ url_for('pos.receipt', transaction_id=t.id) }}" class="btn btn-outline-secondary btn-sm">View</a></td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr><td colspan="7" class="text-center text-muted py-4">No transactions for this day.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,26 @@
|
||||
{% extends "tenant/layouts/base.html" %}
|
||||
{% block title %}Void Transaction{% endblock %}
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-5">
|
||||
<div class="card shadow-sm border-danger">
|
||||
<div class="card-header bg-danger text-white fw-semibold">Void Transaction #{{ transaction.id }}</div>
|
||||
<div class="card-body">
|
||||
<p class="text-muted">Total: <strong>${{ "%.2f"|format(transaction.total) }}</strong></p>
|
||||
{% if error %}<div class="alert alert-danger py-2">{{ error }}</div>{% endif %}
|
||||
<form method="POST" novalidate onsubmit="return confirm('Are you sure you want to void this transaction?')">
|
||||
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Reason <span class="text-danger">*</span></label>
|
||||
<input type="text" class="form-control" name="reason" required autofocus>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button type="submit" class="btn btn-danger">Confirm Void</button>
|
||||
<a href="{{ url_for('pos.receipt', transaction_id=transaction.id) }}" class="btn btn-outline-secondary">Cancel</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user