travandClaude Opus 5
d1cb472696
A per-event queue board for a repair cafe. Customers sign items in on a shared tablet; volunteers drag repairs through Queue, In progress and Done on a dashboard, then export the day's records as CSV. Zero npm dependencies: node:http plus JSON files on disk, no build step. Categories and house rules are set in config.json. Events are deleted 7 days after creation. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
65 lines
2.1 KiB
HTML
65 lines
2.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Sign in a repair</title>
|
|
<link rel="stylesheet" href="/static/app.css">
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<h1 id="event-name"> </h1>
|
|
<p class="subtitle">Fill this in and a volunteer will call you when it is your turn.</p>
|
|
|
|
<div id="saved" class="notice ok" hidden>Added to the queue. Thank you!</div>
|
|
<div id="error" class="notice error" hidden></div>
|
|
|
|
<form id="form" autocomplete="off">
|
|
<div class="field">
|
|
<label for="customer">Your name</label>
|
|
<input type="text" id="customer" required maxlength="80">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="item">What have you brought?</label>
|
|
<input type="text" id="item" required maxlength="120" placeholder="Toaster, table lamp, bike…">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="category">Category <span class="hint">— start typing, then pick one from the list</span></label>
|
|
<input type="text" id="category" list="categories" required autocapitalize="none">
|
|
<datalist id="categories"></datalist>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="problem">What is wrong with it?</label>
|
|
<textarea id="problem" maxlength="2000" placeholder="Describe the problem, and anything you have already tried."></textarea>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="check">
|
|
<input type="checkbox" id="agree" required>
|
|
<span>I agree to the <a href="#" id="rules-link">house rules</a></span>
|
|
</label>
|
|
</div>
|
|
|
|
<button type="submit" class="primary big" id="submit">Submit</button>
|
|
</form>
|
|
|
|
<p style="margin-top:40px"><a id="dashboard-link" href="">Volunteer dashboard</a></p>
|
|
</div>
|
|
|
|
<dialog id="rules">
|
|
<div class="dialog-body">
|
|
<h2>House rules</h2>
|
|
<div class="rules-text" id="rules-text"></div>
|
|
<div class="dialog-actions">
|
|
<button type="button" id="rules-ok" class="primary">OK</button>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
|
|
<script src="/static/intake.js"></script>
|
|
</body>
|
|
</html>
|