import React, { useState } from "react"; //Import Breadcrumb import BreadCrumb from "../../Components/Common/BreadCrumb"; import { Container, Form, Row, Col, Card, Nav, Modal, Tab, } from "react-bootstrap"; import Select from "react-select"; import { orderSummary } from "../../common/data/ecommerce"; import { Head, Link } from "@inertiajs/react"; import Layout from "../../Layouts"; const EcommerceCheckout = () => { const [selectedCountry, setselectedCountry] = useState(null); const [selectedState, setselectedState] = useState(null); const [activeTab, setactiveTab] = useState(1); const [passedSteps, setPassedSteps] = useState([1]); const [modal, setModal] = useState(false); const [deletemodal, setDeleteModal] = useState(false); const toggledeletemodal = () => { setDeleteModal(!deletemodal); }; const togglemodal = () => { setModal(!modal); }; function handleSelectCountry(selectedCountry: any) { setselectedCountry(selectedCountry); } function handleSelectState(selectedState: any) { setselectedState(selectedState); } function toggleTab(tab: any) { if (activeTab !== tab) { var modifiedSteps = [...passedSteps, tab]; if (tab >= 1 && tab <= 4) { setactiveTab(tab); setPassedSteps(modifiedSteps); } } } const productState = [ { options: [ { label: "Select State...", value: "Select State" }, { label: "Alabama", value: "Alabama" }, { label: "Alaska", value: "Alaska" }, { label: "American Samoa", value: "American Samoa" }, { label: "California", value: "California" }, { label: "Colorado", value: "Colorado" }, { label: "District Of Columbia", value: "District Of Columbia" }, { label: "Florida", value: "Florida" }, { label: "Georgia", value: "Georgia" }, { label: "Guam", value: "Guam" }, { label: "Hawaii", value: "Hawaii" }, { label: "Idaho", value: "Idaho" }, { label: "Kansas", value: "Kansas" }, { label: "Louisiana", value: "Louisiana" }, { label: "Montana", value: "Montana" }, { label: "Nevada", value: "Nevada" }, { label: "New Jersey", value: "New Jersey" }, { label: "New Mexico", value: "New Mexico" }, { label: "New York", value: "New York" }, ], }, ]; const productCountry = [ { options: [ { label: "Select Country...", value: "Select Country" }, { label: "United States", value: "United States" }, ], }, ]; return (
Billing Information

Please fill all information below

First Name
Last Name
Email (Optional)
Phone
Address
Country
State
Zip Code
Shipping Information

Please fill all information below

Saved Address
Home Address Marcus Alfaro 4739 Bubby Drive Austin, TX 78729 Mo. 012-345-6789
Edit
Remove
Office Address James Honda 1246 Virgil Street Pensacola, FL 32501 Mo. 012-345-6789
Edit
Remove
Shipping Method
Free Free Delivery Expected Delivery 3 to 5 Days
$24.99 Express Delivery Delivery within 24hrs.
Payment Selection

Please select and enter your billing information

Paypal
Credit / Debit Card
Cash on Delivery
Name on card Full name as displayed on card Credit card number Expiration CVV
{" "} Your transaction is secured with SSL encryption
Thank you ! Your Order is Completed !

You will receive an order confirmation email with details of your order.

Order ID:{" "} VZ2451

Order Summary
{orderSummary.map((product, key) => ( ))}
Product Product Info Price
{product.name}

$ {product.price} x {product.quantity}

$ {product.total}
Sub Total : $ 359.96
Discount{" "} (VELZON15):{" "} - $ 50.00
Shipping Charge : $ 24.99
Estimated Tax (12%): $ 18.20
Total (USD) : $353.15
{/* modal Delete Address */}

Are you sure ?

Are you Sure You want to Remove this Address ?

{/* modal Add Address */}
Address
Name
Address
Phone
Address Type
); }; EcommerceCheckout.layout = (page: any) => export default EcommerceCheckout;