{ "name": "Ticket", "slug": "ticket", "blocks": ["Pages", "Lists", "Sign-in: users"], "persona": "freelancers", "keywords": [ "requests", "job status", "customers", "app", "login", "member sign-in", "IT support", "helpdesk", "support tickets", "tech support", "screenshots", "members area" ], "description": "An app template for a one-person IT support business: client offices sign in, pick the area and raise a ticket with a screenshot, follow each one through New, Looking into it, Waiting on you, Visit booked and Fixed with the owner's reply, read every update in a thread and see booked visits. The owner answers each ticket with one status tap and a reply. A public page, six member pages under /app and a privacy notice with blanks.", "audience": [ "one-person IT support businesses", "freelance IT technicians for small offices" ], "category": "Customer requests", "job": "member-app", "categoryId": "requests", "alsoFits": [ "helpdesk for small offices", "website support requests", "office equipment repairs", "managed IT for shops" ], "direction": "Dark server rack: mono asset labels, LEDs that step green per ticket stage and terminal logs", "mood": [ "light", "calm", "modern" ], "fonts": [ "JetBrains Mono", "Inter" ], "memberApp": { "path": "/app", "lists": [ { "list": "tickets", "label": "Tickets", "by": "member", "status_options": [ "New", "Looking into it", "Waiting on you", "Visit booked", "Fixed", "Closed" ], "reply": true, "fields": [ { "name": "subject", "type": "text", "label": "What's wrong?", "required": true }, { "name": "area", "type": "choice", "label": "Area", "required": true, "options": [ "Printer", "Wi-Fi", "Email", "Laptop or PC", "Phone", "Sign-in problems", "Other" ] }, { "name": "urgency", "type": "choice", "label": "How urgent?", "required": true, "options": [ "When you can", "This week", "Today", "Stopping work" ] }, { "name": "details", "type": "long_text", "label": "Details", "required": true }, { "name": "screenshot", "type": "photo", "label": "Screenshot or photo of the screen" } ] }, { "list": "updates", "label": "Ticket updates", "by": "owner", "fields": [ { "name": "date", "type": "date", "label": "Date", "required": true }, { "name": "ticket", "type": "text", "label": "Ticket", "required": true }, { "name": "stage", "type": "choice", "label": "Stage", "required": true, "options": [ "New", "Looking into it", "Waiting on you", "Visit booked", "Fixed", "Closed" ] }, { "name": "memo", "type": "long_text", "label": "Note" }, { "name": "visit", "type": "date", "label": "Visit booked for" }, { "name": "visit_time", "type": "choice", "label": "Visit time", "options": [ "09:00 to 10:00", "11:00 to 12:00", "14:00 to 15:00", "16:00 to 17:00" ] } ] }, { "list": "messages", "label": "Answers to Ossie", "by": "member", "fields": [ { "name": "subject", "type": "text", "label": "Ticket", "required": true }, { "name": "message", "type": "long_text", "label": "Your answer", "required": true } ] } ], "demo": { "member": { "name": "Tomasz Okafor", "email": "tomasz.okafor@example.com", "profile": { "name": "Tomasz" } }, "plans": [], "rows": { "tickets": [ { "subject": "Front desk printer says offline", "area": "Printer", "urgency": "Today", "details": "Nobody at the front desk can print any more. The printer screen looks fine but every laptop says it is offline. It was working a few days ago.", "screenshot": "art/printer-offline.svg", "_added": "-5d", "_status": "Visit booked", "_reply": "Set a fixed address remotely; I'm in on Friday next week, 9 to 10, to check the cable and the tray." }, { "subject": "Set up a laptop for our new starter", "area": "Laptop or PC", "urgency": "This week", "details": "Priti joins the lettings team soon and needs a laptop with email, the shared drive and the office printers. Her work email is already made.", "_added": "-4d", "_status": "Visit booked", "_reply": "Monday 9:00 it is. I'll bring the laptop and set Priti up at her desk." }, { "subject": "Shared inbox not syncing on my phone", "area": "Email", "urgency": "This week", "details": "The lettings inbox shows on my laptop but not on my phone for a few days. My own mail is fine. Error says 'Cannot get mail'.", "_added": "-5d", "_status": "Fixed", "_reply": "Removed and re-added the shared inbox on your phone…" }, { "subject": "Wi-Fi drops in the meeting room", "area": "Wi-Fi", "urgency": "When you can", "details": "Video calls cut out every few minutes in the back meeting room. The front office is fine.", "_added": "-5d", "_status": "Waiting on you", "_reply": "I moved the access point away from the filing cabinet and updated its firmware…" }, { "subject": "New mouse and keyboard for reception", "area": "Laptop or PC", "urgency": "When you can", "details": "The reception keyboard has a sticky space bar and the mouse wheel has stopped.", "_added": "-5w:tue", "_status": "Closed", "_reply": "Swapped both on Thursday. Closing this one." } ], "updates": [ { "date": "today", "ticket": "Set up a laptop for our new starter", "stage": "Visit booked", "memo": "Monday 9:00 it is. I'll bring the laptop and set Priti up at her desk.", "_added": "today", "visit": "+1w:mon", "visit_time": "09:00 to 10:00" }, { "date": "-1d", "ticket": "Front desk printer says offline", "stage": "Visit booked", "memo": "The printer lost its address after the router restarted. I've set a fixed one remotely and I'm in on Friday next week to check the cable and the paper tray.", "visit": "+1w:fri", "_added": "-1d", "visit_time": "09:00 to 10:00" }, { "date": "-2d", "ticket": "Set up a laptop for our new starter", "stage": "Waiting on you", "memo": "The laptop is built and ready. Which day does Priti start? I would like to hand it over in person.", "_added": "-2d" }, { "date": "-4d", "ticket": "Front desk printer says offline", "stage": "New", "memo": "Thanks for the screenshot. I will look at it this afternoon.", "_added": "-4d" }, { "date": "-2d", "ticket": "Shared inbox not syncing on my phone", "stage": "Fixed", "memo": "Removed and re-added the shared inbox on your phone. It is syncing again. Let me know if it stops.", "_added": "-2d" }, { "date": "-3d", "ticket": "Wi-Fi drops in the meeting room", "stage": "Waiting on you", "memo": "I moved the access point away from the filing cabinet and updated its firmware. Is it still dropping? Tell me the room and the time if it is.", "_added": "-3d" }, { "date": "-4w:thu", "ticket": "New mouse and keyboard for reception", "stage": "Closed", "memo": "Swapped the keyboard and mouse at reception. Closing this one.", "_added": "-4w:thu" } ], "messages": [ { "subject": "Set up a laptop for our new starter", "message": "Thanks Ossie. Priti starts on Monday at 9:00, so any time that morning works.", "_added": "-1d" } ] } }, "setup": { "signup": "invite", "profile_fields": [ { "name": "name", "type": "text", "label": "First name" } ], "display_field": "name" } }, "files": [ "index.html", "privacy.html", "app/index.html", "app/tickets.html", "app/ticket.html", "app/new.html", "app/updates.html", "app/visits.html", "app/account.html", "styles.css", "app.js", "kit.css", "kit.js", "kit-icons.svg", "icons.svg", "site.webmanifest", "favicon.svg", "art/router.svg", "art/printer-offline.svg", "art/printer.svg", "og.png", "apple-touch-icon.png", "icon-192.png", "icon-512.png", "icon-512-maskable.png" ], "pages": [ { "path": "index.html", "label": "Home", "purpose": "The public page: what the support covers, how a ticket works in three steps, a sample screenshot, the owner and the client sign-in" }, { "path": "app/index.html", "label": "Home", "purpose": "The client's home: open tickets by stage, the next visit, Raise a ticket, the urgent phone line, the latest tickets and Ossie's latest updates; a welcome screen when signed out" }, { "path": "app/tickets.html", "label": "Tickets", "purpose": "Every ticket newest first with its area, stage timeline, screenshot and the owner's reply, Same problem again, and what the stages mean" }, { "path": "app/ticket.html", "label": "Ticket", "purpose": "One ticket (opened from any ticket card): its stage, details, screenshot and Ossie's reply, his updates on it, your answers, a reply box and It's working again or Still broken" }, { "path": "app/new.html", "label": "New", "purpose": "The ticket form with area tiles, urgency, details and a screenshot, and quick checks per area" }, { "path": "app/updates.html", "label": "Updates", "purpose": "Reply to Ossie (an answer on a ticket), your answers, and every update Ossie posted (date, ticket, stage, note, visit date and time) as a thread" }, { "path": "app/visits.html", "label": "Visits", "purpose": "Booked on-site visits from the updates' visit dates, and what to expect" }, { "path": "app/account.html", "label": "Account", "purpose": "The client's first name, the account block (sign-in, devices, leaving) and contacts" }, { "path": "privacy.html", "label": "Privacy", "purpose": "The privacy notice, with blanks the owner fills in" } ], "facts": [ "business name", "who answers the tickets", "contact email", "phone number for urgent problems", "reply time for a new ticket", "privacy contact and address" ], "interview": [ "What is your IT support business called, and who answers the tickets?", "Which offices or businesses do you look after, and roughly how many people in each?", "What do clients usually ask you about (email, laptops, printers, Wi-Fi, phones)?", "How quickly do you reply to a new ticket, and how fast for one marked Stopped working?", "Which email address and phone number should clients use when something is urgent?", "What address and privacy contact should the privacy notice show?" ], "customise": { "strings": [ "Stoneygate IT, Ossie Brandt, Larchway Lettings (the sample client office), the phone, email and £95 a month: replace them on every page and in site.webmanifest.", "Fill in every highlighted blank on privacy.html before clients sign in (not legal advice: https://pagelemon.com/agents/member-app-legal).", "setup_app with signup invite, the profile field name (First name) and display_field name; invite_users with each client's work email.", "Make the tickets list exactly as memberApp.lists says, with status_options New, Looking into it, Waiting on you, Visit booked, Fixed and Closed (Fixed tickets close after 7 days unless the client says Still broken; a ticket Waiting on you closes after 14 days without an answer) and reply on. The owner sets the stage with one tap and writes a short reply in the Dashboard (Apps, Entries); the client sees both on Home and Tickets, with the stage timeline.", "Make the updates list (by owner) exactly as memberApp.lists says: one row per update, assigned to the client, with the ticket's subject, stage, note and an optional visit date. Visits shows the rows with a visit date from today.", "Make the messages list (by member) exactly as memberApp.lists says: a client answers Ossie's question on a ticket from app/updates.html (the Reply to Ossie button on a Waiting on you ticket fills in the subject). Read them in the Dashboard (Apps, Entries).", "Change the areas together: the area options in the list, the select and the tiles on app/new.html, and the quick checks there.", "Never ask for passwords, PINs or sign-in codes, and never collect card, bank, ID or health details. Screenshots should be cropped of personal details." ], "colours": "Edit the :root tokens at the top of styles.css: the --t-* rack colours (dark in both schemes) and the room colours, which follow the device (aluminium in light, terminal in dark).", "fonts": "JetBrains Mono (display, ticket labels, LED labels, dates) with Inter (text), from Google Fonts by one in every page head; ask to self-host them if you prefer no font service.", "sections": "Public: index.html and privacy.html. Member pages under /app on the shared app kit (kit.css, kit.js, kit-icons.svg; never edit them): index.html (home: the rack, one unit per open ticket with its asset label and five status LEDs, totals per stage on the rack display), tickets.html, ticket.html (one ticket: app.js shows the ticket named in ?subject= with its updates and answers), new.html (the add form as a blank asset label; the area tiles are patch-panel ports, kit product cards that pick the area), updates.html (the updates list as a thread), visits.html (updates with a visit date), account.html (the account block). Tabs: Home, Tickets, New, Updates, Visits. Template pieces are the t-* classes in styles.css (t-rack, t-unit, t-label, t-panel and its LEDs, t-log, t-svc); the LEDs follow the status through data-k-status on .t-panel and the area code through data-k-status-field=\"area\" on .t-tag.", "images": "art/router.svg (900×900) is the line drawing of a printer and router on the signed-out screens; art/printer-offline.svg (800×500) is a sample error screenshot on the sample ticket and the public page. Both are drawn SVG; replace the router drawing with a photo of the owner at work if they have one. icons.svg holds the extra icons (printer, wifi, laptop, key)." }, "schemaVersion": 2, "updated": "2026-10-26" }