Skip to content
Steps 1 Highlighted (default) with Text “Order Information”Steps 2 Greyed with Text “Detail Information”Steps 3 Greyed with Text “Wrap Up”onClick Continue button, will move to next step and highlighted current and past stepsInactiveActiveText Field withTitle “Booking source”Placeholder “Select options”AsteriskEditable and requiredonClick, open bottom sheet Booking sourceDefault (unselected)Active (editing)Error (empty)Text Field withTitle “Booking ID”Placeholder “Ex : HKR-91023”Enabled and not requiredText Field withTitle “Date of visit”Placeholder “Ex : HKR-91023”AsteriskCalendar icon on the rightEditable and requiredonClick open Bottom Sheet CalendarDefaultError (empty)Text Field withTitle “Arrival time”Placeholder “Select arrival time”AsteriskDropdown icon on the rightEditable and requiredonClick open Bottom Sheet Arival timeDefaultError (empty)Section Title Text “Local tickets option”Text “Adult Local” with default price and quantity counterText “Child Local” with subtitle “3-12 years old, default price and quantity counterGet default price from Firebase configDefault counter is 0 and minimum counter is 0onClick + increase counteronClick - decrease counter, disable when counter is 0Section Title Text “International tickets option”Text “Adult Local” with default price and quantity counterText “Child Local” with subtitle “3-12 years old, default price and quantity counterGet default price from Firebase configDefault counter is 0 and minimum counter is 0onClick + increase counteronClick - decrease counter, disable when counter is 0Primary Button with Text ContinueonClick, validate formDate of Visit and Arrival time is not emptyIf empty, change empty field state to error stateTotal ticket options (local and international) should be more than 0If total ticket is 0 show error toast
1. Add Ticket – Order Information
1. Stepper
Purpose: Indicates user progress through the ticket creation steps
Content and Elements:
Behavior and Interactions:
Data Sources:
Static
UI References:
State:
2. Booking Source
Purpose: Collect the source of the booking made by super admin (available when login as super admin only)
Content and Elements:
Behavior and Interactions:
Data Source:
Static
State:
3. Booking ID Field
Purpose: Filled with booking ID/ invoice ID from OTA or other platform
Content and Elements:
Behavior and Interactions:
4. Date of Visit
Purpose: Enabled user to choose their date of visit to the event
Content and Elements:
Behavior and Interactions:
State:
5. Arrival Time
Purpose: Enabled user to choose their arrival time on date to the event
Content and Elements:
Behavior and Interactions:
State:
6. Local ticket section
Purpose: User can input the ticket they want to book with adult and child for local visitor
Content and Elements:
Behavior and Interactions:
7. International ticket section
Purpose: User can input the ticket they want to book with adult and child for International visitor
Content and Elements:
Behavior and Interactions:
8. Continue Button
Purpose: Validate form and navigate user to the next step
Content and Elements:
Behavior and Interactions:
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ··· in the right corner or using a keyboard shortcut (
CtrlP
) instead.