List Booking Page

Purpose: Allow user to search booking list by customer name

Content and Elements:

Search Field

Magnifier icon

Placeholder Text “Search customer name...”

Behavior and Interactions:

If empty, show empty state

onClick search field, open softkeyboard

onClick enter, filter booking list with input text

If not found, show not found state

Data Sources:

Dynamic

API Name:

Google Spreadsheet API

Purpose: Show list of booking from Spreadsheet

Content and Elements:

⁠

⁠

Booking icon & Booking Name

Date of Visit

Total Ticket & Final Price

Booking ID

Arrival Time

Payment status

Behavior and Interactions:

Booking ID might be nullable

onClick navigate to Edit Booking Summary

Data Sources:

Dynamic

API Name:

Google Spreadsheet API

State:

Payment Completed

⁠

Payment Cancelled

⁠

Waiting Payment

⁠

Pending Payment

⁠

⁠

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.