Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| bec4b93fdd | |||
| 7c4ccb073a |
@@ -16,10 +16,11 @@ export default function LandingPage() {
|
|||||||
const [isReserving, setIsReserving] = useState(false);
|
const [isReserving, setIsReserving] = useState(false);
|
||||||
const [email, setEmail] = useState("");
|
const [email, setEmail] = useState("");
|
||||||
const [mobile, setMobile] = useState("");
|
const [mobile, setMobile] = useState("");
|
||||||
|
const [guests, setGuests] = useState("2");
|
||||||
|
|
||||||
const handleReserve = () => {
|
const handleReserve = () => {
|
||||||
const message = encodeURIComponent(`Hello, I would like to book a table. Email: ${email}, Mobile: ${mobile}`);
|
const message = encodeURIComponent(`Hello, I would like to book a table at Shaffa. \nEmail: ${email}\nMobile: ${mobile}\nGuests: ${guests}`);
|
||||||
window.open(`https://wa.me/91XXXXXXXXXX?text=${message}`, '_blank');
|
window.open(`https://wa.me/919876543210?text=${message}`, '_blank');
|
||||||
setIsReserving(false);
|
setIsReserving(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -69,7 +70,7 @@ export default function LandingPage() {
|
|||||||
{isReserving && (
|
{isReserving && (
|
||||||
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
|
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
|
||||||
<div className="bg-white p-8 rounded-lg shadow-xl w-full max-w-sm">
|
<div className="bg-white p-8 rounded-lg shadow-xl w-full max-w-sm">
|
||||||
<h2 className="text-xl font-bold mb-4 text-black">Reserve a Table</h2>
|
<h2 className="text-xl font-bold mb-4 text-black">Confirm Your Reservation</h2>
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
placeholder="Email Address"
|
placeholder="Email Address"
|
||||||
@@ -82,9 +83,16 @@ export default function LandingPage() {
|
|||||||
className="w-full p-2 mb-4 border rounded text-black"
|
className="w-full p-2 mb-4 border rounded text-black"
|
||||||
onChange={(e) => setMobile(e.target.value)}
|
onChange={(e) => setMobile(e.target.value)}
|
||||||
/>
|
/>
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
placeholder="Number of Guests"
|
||||||
|
className="w-full p-2 mb-4 border rounded text-black"
|
||||||
|
value={guests}
|
||||||
|
onChange={(e) => setGuests(e.target.value)}
|
||||||
|
/>
|
||||||
<div className="flex gap-2">
|
<div className="flex gap-2">
|
||||||
<button onClick={() => setIsReserving(false)} className="flex-1 p-2 bg-gray-200 rounded">Cancel</button>
|
<button onClick={() => setIsReserving(false)} className="flex-1 p-2 bg-gray-200 rounded">Cancel</button>
|
||||||
<button onClick={handleReserve} className="flex-1 p-2 bg-blue-600 text-white rounded">Complete Booking</button>
|
<button onClick={handleReserve} className="flex-1 p-2 bg-blue-600 text-white rounded">Send to WhatsApp</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -175,7 +183,7 @@ export default function LandingPage() {
|
|||||||
columns={[
|
columns={[
|
||||||
{ title: "Shaffa", items: [{ label: "About", href: "#about" }, { label: "Menu", href: "#menu" }] },
|
{ title: "Shaffa", items: [{ label: "About", href: "#about" }, { label: "Menu", href: "#menu" }] },
|
||||||
{ title: "Reservation", items: [{ label: "WhatsApp Booking", onClick: () => setIsReserving(true), href: "#" }, { label: "Directions", href: "https://maps.google.com" }] },
|
{ title: "Reservation", items: [{ label: "WhatsApp Booking", onClick: () => setIsReserving(true), href: "#" }, { label: "Directions", href: "https://maps.google.com" }] },
|
||||||
{ title: "Contact", items: [{ label: "Sec 26B, Chandigarh", href: "#" }, { label: "+91-XXXXXXXXXX", href: "tel:+91XXXXXXXXXX" }] },
|
{ title: "Contact", items: [{ label: "Sec 26B, Chandigarh", href: "#" }, { label: "+91-9876543210", href: "tel:+919876543210" }] },
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user