1. OVERVIEW

This system helps you:

  • Accept online bookings from customers
  • Manage therapists and schedules
  • Organize services (treatments)
  • Handle bookings from the operator dashboard

Booking Flow:

Customer selects:
Service → Date → Time → Therapist → Fill Details → Confirm
 

2. ACCESSING THE SYSTEM

There are usually 2 main pages:

1. Booking Page (For Customers)

Used by customers to make bookings
Example:
https://mantaspa.webside.id/booking


2. Operator Page (For Staff/Admin)

Used by receptionist / admin
Example:
https://mantaspa.webside.id/operator

Login using:

  • Username
  • Password

3. INITIAL SETUP (IMPORTANT)

3.1 Add Services (Treatments)

Go to:
👉 Services

Fill in:

  • Service Name
    Example: Hot Stones
  • Duration
    Example: 60 minutes
  • Price
    Example: 500000

💡 Tips:

  • Use plain numbers → 500000 (will display as 500,000)
  • You can create multiple durations:
    • 60 min
    • 90 min

3.2 Add Therapists

Go to:
👉 Therapists

Fill in:

  • Therapist Name
    Example: Putri
  • Select services they can perform

💡 Important:

  • One therapist can handle multiple services
  • One service can have multiple therapists

3.3 Set Working Schedule

Go to:
👉 Schedule / Weekly Schedule

Set:

  • Working days (Monday – Sunday)
  • Working hours (e.g. 10:00 – 22:00)

💡 Example:

Putri:
Monday – Sunday
10:00 – 22:00
 

4. HOW CUSTOMERS MAKE A BOOKING

Customers will:

  1. Select service
  2. Select date
  3. Select time
  4. Select therapist
  5. Enter name & phone number
  6. Confirm booking

5. VIEW BOOKINGS

Go to:
👉 Operator Dashboard

You will see:

  • Customer name
  • Phone number
  • Selected service
  • Therapist
  • Booking time
  • Status

6. OPERATOR ACTIONS

Each booking can be:

✅ Confirmed

  • Booking is accepted

❌ Cancelled

  • Booking is rejected

7. CONTACT CUSTOMER

In the operator dashboard, you may find:

  • 📱 WhatsApp button
  • 📞 Call button

Use them to:

  • Confirm bookings
  • Send reminders
  • Follow up

8. ADD MANUAL BOOKING (WALK-IN)

For customers who come directly:

Go to:
👉 Operator → Add Booking

Fill in:

  • Service
  • Date
  • Time
  • Therapist
  • Customer name
  • Phone number

Click:
👉 Save / Create Booking


9. IMPORTANT RULES

1. Therapist cannot handle multiple bookings at the same time

  • 1 therapist = 1 booking per time slot

2. However:

👉 1 service can have multiple bookings
(as long as different therapists are available)

Example:

Hot Stones:
– Putri
– Sari
– Dewi

→ 3 bookings can happen at the same time


3. If time slots are not showing:

Check:

  • Is therapist schedule set?
  • Is service assigned to therapist?
  • Are working hours configured?

10. MOBILE VS DESKTOP

Desktop:

  • Full detailed layout

Mobile:

  • Simpler step-by-step flow

💡 Tip:
Most customers use mobile → keep layout clean and clear


11. AUTO REFRESH

Operator dashboard will:

  • Refresh automatically (± every 10 minutes)

Purpose:

  • Show latest bookings
  • No need to manually reload

12. BEST PRACTICES

✅ Use clear service names

Example:

  • ❌ Massage 1
  • ✅ Relaxation Massage – 60 min

✅ Use active WhatsApp number

  • For quick communication with customers

✅ Set realistic durations

  • Avoid scheduling conflicts

✅ Always check therapist availability

  • Prevent overbooking

13. TROUBLESHOOTING

❌ Service not visible

  • Not assigned to any therapist

❌ No time slots available

  • Schedule not configured

❌ Therapist not showing

  • No service assigned

❌ Booking failed

  • Time slot already taken

14. QUICK SUMMARY

1. Add Services
2. Add Therapists
3. Assign Services to Therapists
4. Set Schedule
5. Accept Bookings
6. Manage via Operator Dashboard

🧩 Embedding Guide for Manta Spa Website

If the Manta Spa team would like to display the booking system directly on your main website, you can use the embed version below:
https://mantaspa.webside.id/embed-2/

You can install it using an iframe as shown in the example below:

<iframe 
  src="https://mantaspa.webside.id/embed-2/" 
  width="100%" 
  height="900" 
  style="border:0; width:100%; max-width:100%;" 
  loading="lazy"
  allowfullscreen>
</iframe>

Quick iframe usage guide:

  • Paste the iframe code into the page where you want the booking system to appear
  • It is recommended to use width 100% so it adapts to your website layout
  • The height can be adjusted (recommended: 900px–1200px depending on layout)
  • If needed, the RVG team can assist in optimizing the layout for both desktop and mobile