mirror of
https://github.com/kbenestad/ClubLedger.git
synced 2026-06-18 09:44:33 +00:00
79d51973cd
Removed product search field, results list, barProductLookup(), and selectProduct() from the bar view in index.html, bar.html, app.js, and bar.js. Backend /products endpoints are unchanged. https://claude.ai/code/session_01JuRTR5Xjx8emQsyerBgGU7
163 lines
5.5 KiB
HTML
163 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ClubLedger</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
|
|
<nav>
|
|
<span class="brand" id="navBrand">ClubLedger</span>
|
|
<button class="nav-btn active" data-view="members">Members</button>
|
|
<button class="nav-btn" data-view="cashier">Cashier</button>
|
|
<button class="nav-btn" data-view="bar">Bar</button>
|
|
</nav>
|
|
|
|
<!-- ===================== MEMBERS VIEW ===================== -->
|
|
<div id="view-members" class="view">
|
|
|
|
<div class="panel">
|
|
<h2>Register New Member</h2>
|
|
<form id="registerForm">
|
|
<div class="form-row">
|
|
<label>Member Number</label>
|
|
<input type="text" id="reg-number" placeholder="e.g. 001" required>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Full Name</label>
|
|
<input type="text" id="reg-name" placeholder="Name" required>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>PIN</label>
|
|
<input type="password" id="reg-pin" placeholder="Min 4 digits" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Register</button>
|
|
</form>
|
|
<div id="registerMsg" class="msg"></div>
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<h2>Members</h2>
|
|
<div class="search-row">
|
|
<input type="text" id="memberSearch" placeholder="Search name or number…">
|
|
<button class="btn" onclick="searchMembers()">Search</button>
|
|
</div>
|
|
<table id="memberTable" class="data-table">
|
|
<thead>
|
|
<tr><th>#</th><th>Name</th><th>Balance</th><th>Joined</th><th class="actions-col"></th></tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<h2>Staff</h2>
|
|
<div class="search-row">
|
|
<input type="text" id="staffNameInput" placeholder="Staff name">
|
|
<button class="btn btn-primary" onclick="addStaff()">Add</button>
|
|
</div>
|
|
<div id="staffChips" class="staff-chips"></div>
|
|
<div id="staffMsg" class="msg"></div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- ===================== CASHIER VIEW ===================== -->
|
|
<div id="view-cashier" class="view hidden">
|
|
<div class="panel">
|
|
<h2>Top Up Account</h2>
|
|
<div class="search-row">
|
|
<input type="text" id="cashierSearch" placeholder="Search member…">
|
|
<button class="btn" onclick="cashierSearchMembers()">Search</button>
|
|
</div>
|
|
<div id="cashierMemberList" class="member-pick-list"></div>
|
|
|
|
<div id="cashierForm" class="hidden">
|
|
<div class="selected-member-box" id="cashierSelected"></div>
|
|
<div class="form-row">
|
|
<label>Amount (<span class="currency-unit"></span>)</label>
|
|
<input type="number" id="cashierAmount" placeholder="e.g. 1000" min="1" step="1">
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Staff</label>
|
|
<select id="cashierStaff"></select>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Note (optional)</label>
|
|
<input type="text" id="cashierNote" placeholder="">
|
|
</div>
|
|
<button class="btn btn-primary" onclick="doTopup()">Top Up</button>
|
|
<button class="btn" onclick="clearCashierSelection()">Cancel</button>
|
|
</div>
|
|
<div id="cashierMsg" class="msg"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ===================== BAR VIEW ===================== -->
|
|
<div id="view-bar" class="view hidden">
|
|
<div class="panel">
|
|
<h2>Charge Account</h2>
|
|
<div class="search-row">
|
|
<input type="text" id="barSearch" placeholder="Search member…">
|
|
<button class="btn" onclick="barSearchMembers()">Search</button>
|
|
</div>
|
|
<div id="barMemberList" class="member-pick-list"></div>
|
|
|
|
<div id="barForm" class="hidden">
|
|
<div class="selected-member-box" id="barSelected"></div>
|
|
|
|
<div class="form-row">
|
|
<label>Amount (<span class="currency-unit"></span>)</label>
|
|
<input type="number" id="barAmount" placeholder="e.g. 350" min="1" step="1">
|
|
</div>
|
|
<div class="form-row">
|
|
<label>PIN</label>
|
|
<input type="password" id="barPin" placeholder="Member PIN" maxlength="20">
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Staff</label>
|
|
<select id="barStaff"></select>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Note (optional)</label>
|
|
<input type="text" id="barNote" placeholder="">
|
|
</div>
|
|
<button class="btn btn-danger" onclick="doCharge()">Charge</button>
|
|
<button class="btn" onclick="clearBarSelection()">Cancel</button>
|
|
</div>
|
|
<div id="barMsg" class="msg"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ===================== EDIT MODAL ===================== -->
|
|
<div id="editModal" class="modal-overlay hidden" onclick="if(event.target===this)closeEditModal()">
|
|
<div class="modal">
|
|
<h3>Edit Member</h3>
|
|
<form id="editForm">
|
|
<div class="form-row">
|
|
<label>Member Number</label>
|
|
<input type="text" id="edit-number" required>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>Full Name</label>
|
|
<input type="text" id="edit-name" required>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>New PIN <span style="font-weight:400;color:#aaa">(leave blank to keep current)</span></label>
|
|
<input type="password" id="edit-pin" placeholder="Leave blank to keep">
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
<button type="button" class="btn" onclick="closeEditModal()">Cancel</button>
|
|
</div>
|
|
</form>
|
|
<div id="editMsg" class="msg"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/common.js"></script>
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|