- 
+ 
-
-
- {title}
+
+
+ {title}
-
*/}
+ {/*
Lightweight • Non slip • Flexible outsole • Easy to wear on and off
-
-
{price}
-
} onClick={(e) => {
+ */}
+
+ {price}
+ ฿ 30
+
+ {/*
} onClick={(e) => {
e.preventDefault();
addToCart(itemCode)
}}>
Add to cart
-
+ */}
diff --git a/src/components/PromotionCard.jsx b/src/components/PromotionCard.jsx
new file mode 100644
index 0000000..75c07bd
--- /dev/null
+++ b/src/components/PromotionCard.jsx
@@ -0,0 +1,22 @@
+import { Link } from "react-router-dom";
+import { SfIconSearch, SfIconArrowForward, SfIconCalendarToday } from '@storefront-ui/react'
+
+const PromotionCard = ({title, image, date, link}) => {
+ return (
+
+
+ เข้าร่วมเลย
+
+
+
+
{title}
+
+
+
+ {date}
+
+
+ )
+}
+
+ export default PromotionCard
\ No newline at end of file
diff --git a/src/components/SidebarAdmin.jsx b/src/components/SidebarAdmin.jsx
new file mode 100644
index 0000000..eded1d3
--- /dev/null
+++ b/src/components/SidebarAdmin.jsx
@@ -0,0 +1,106 @@
+import { useFrappeGetDoc, useFrappeGetDocList } from 'frappe-react-sdk'
+import { useEffect, useState } from 'react';
+import { Link, useLocation } from 'react-router-dom';
+import { File06 } from '@untitled-ui/icons-react';
+
+export default function SidebarAdmin() {
+ const location = useLocation();
+ const [active, setActive] = useState('');
+
+ const handleMenuClick = (menu) => {
+ setActive(menu);
+ }
+
+ const { data: blogs } = useFrappeGetDocList('Blog Post', {
+ filter: ['name']
+ })
+
+ const { data: blogCate } = useFrappeGetDocList('Blog Category', {
+ filter: ['name']
+ })
+
+ const { data: userData } = useFrappeGetDoc('User', 'Administrator', {
+ filter: ['name', 'full_name', 'user_image']
+ })
+
+ const navigation = [
+ { name: 'Blog', icon:
, href: '/blog-admin', count: (blogs && blogs.length), current: active === '/blog-admin' ? true : false },
+ { name: 'Blog categories', icon:
, href: '/blog-categories', count: (blogCate && blogCate.length), current: active === '/blog-categories' ? true : false },
+ ]
+
+ function classNames(...classes) {
+ return classes.filter(Boolean).join(' ')
+ }
+
+ useEffect(() => {
+ setActive(location.pathname);
+ })
+
+ return (
+
+
+
+
+
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/TitleHeader.jsx b/src/components/TitleHeader.jsx
new file mode 100644
index 0000000..24be658
--- /dev/null
+++ b/src/components/TitleHeader.jsx
@@ -0,0 +1,15 @@
+import { ArrowLeft } from '@untitled-ui/icons-react'
+import { Link } from 'react-router-dom'
+
+const TitleHeader = ({link, title}) => {
+ return (
+
+ )
+}
+
+export default TitleHeader
\ No newline at end of file
diff --git a/src/fonts/eventpop/eventpop-bold.ttf b/src/fonts/eventpop/eventpop-bold.ttf
new file mode 100644
index 0000000..3626bb9
Binary files /dev/null and b/src/fonts/eventpop/eventpop-bold.ttf differ
diff --git a/src/fonts/eventpop/eventpop-medium.ttf b/src/fonts/eventpop/eventpop-medium.ttf
new file mode 100644
index 0000000..1c198c3
Binary files /dev/null and b/src/fonts/eventpop/eventpop-medium.ttf differ
diff --git a/src/hooks/useUser.jsx b/src/hooks/useUser.jsx
index 16ee799..b55c148 100644
--- a/src/hooks/useUser.jsx
+++ b/src/hooks/useUser.jsx
@@ -21,7 +21,7 @@ export const UserProvider = ({ children }) => {
const login = async (usr, pwd) => {
try {
- return fetch("https://umer2002.aca.fc.zaviago.com/api/method/frappeauth_app.authentication.login", {
+ return fetch("https://dev.zaviago.com/api/method/frappeauth_app.authentication.login", {
method: "POST",
headers: {
"Content-Type": "application/json",
diff --git a/src/img/Main Store Template.zip b/src/img/Main Store Template.zip
new file mode 100644
index 0000000..71417dd
Binary files /dev/null and b/src/img/Main Store Template.zip differ
diff --git a/src/img/activity1.svg b/src/img/activity1.svg
new file mode 100644
index 0000000..a87d255
--- /dev/null
+++ b/src/img/activity1.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity2.svg b/src/img/activity2.svg
new file mode 100644
index 0000000..3bad759
--- /dev/null
+++ b/src/img/activity2.svg
@@ -0,0 +1,15 @@
+
diff --git a/src/img/activity3.svg b/src/img/activity3.svg
new file mode 100644
index 0000000..7b3e519
--- /dev/null
+++ b/src/img/activity3.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity4.svg b/src/img/activity4.svg
new file mode 100644
index 0000000..0af271c
--- /dev/null
+++ b/src/img/activity4.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity5.svg b/src/img/activity5.svg
new file mode 100644
index 0000000..78b4343
--- /dev/null
+++ b/src/img/activity5.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity6.svg b/src/img/activity6.svg
new file mode 100644
index 0000000..871e6dc
--- /dev/null
+++ b/src/img/activity6.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity7.svg b/src/img/activity7.svg
new file mode 100644
index 0000000..f037686
--- /dev/null
+++ b/src/img/activity7.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/activity8.svg b/src/img/activity8.svg
new file mode 100644
index 0000000..3dccf4d
--- /dev/null
+++ b/src/img/activity8.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/apple-logo.svg b/src/img/apple-logo.svg
new file mode 100644
index 0000000..1f458f0
--- /dev/null
+++ b/src/img/apple-logo.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/arrow-right-solid 2.svg b/src/img/arrow-right-solid 2.svg
new file mode 100644
index 0000000..b7d9b16
--- /dev/null
+++ b/src/img/arrow-right-solid 2.svg
@@ -0,0 +1,10 @@
+
diff --git a/src/img/avatar.svg b/src/img/avatar.svg
new file mode 100644
index 0000000..4017c18
--- /dev/null
+++ b/src/img/avatar.svg
@@ -0,0 +1,10 @@
+
diff --git a/src/img/banks.svg b/src/img/banks.svg
new file mode 100644
index 0000000..a61b066
--- /dev/null
+++ b/src/img/banks.svg
@@ -0,0 +1,9 @@
+
diff --git a/src/img/banner-discount1.png b/src/img/banner-discount1.png
new file mode 100644
index 0000000..8c89774
Binary files /dev/null and b/src/img/banner-discount1.png differ
diff --git a/src/img/banner-discount2.png b/src/img/banner-discount2.png
new file mode 100644
index 0000000..1f5fd49
Binary files /dev/null and b/src/img/banner-discount2.png differ
diff --git a/src/img/banner-product.png b/src/img/banner-product.png
new file mode 100644
index 0000000..d2354be
Binary files /dev/null and b/src/img/banner-product.png differ
diff --git a/src/img/banner-reward.png b/src/img/banner-reward.png
new file mode 100644
index 0000000..906a224
Binary files /dev/null and b/src/img/banner-reward.png differ
diff --git a/src/img/banner.png b/src/img/banner.png
new file mode 100644
index 0000000..b9747c0
Binary files /dev/null and b/src/img/banner.png differ
diff --git a/src/img/book-closed.svg b/src/img/book-closed.svg
new file mode 100644
index 0000000..e4a21b1
--- /dev/null
+++ b/src/img/book-closed.svg
@@ -0,0 +1,10 @@
+
diff --git a/src/img/cart.svg b/src/img/cart.svg
new file mode 100644
index 0000000..60f95f2
--- /dev/null
+++ b/src/img/cart.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/checked-box.svg b/src/img/checked-box.svg
new file mode 100644
index 0000000..f6a126a
--- /dev/null
+++ b/src/img/checked-box.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/chevron-right.svg b/src/img/chevron-right.svg
new file mode 100644
index 0000000..b6a7cff
--- /dev/null
+++ b/src/img/chevron-right.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/clock-rewind.svg b/src/img/clock-rewind.svg
new file mode 100644
index 0000000..ddc4c7a
--- /dev/null
+++ b/src/img/clock-rewind.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/coin.svg b/src/img/coin.svg
new file mode 100644
index 0000000..3c81ee6
--- /dev/null
+++ b/src/img/coin.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/coin2.svg b/src/img/coin2.svg
new file mode 100644
index 0000000..283e6f3
--- /dev/null
+++ b/src/img/coin2.svg
@@ -0,0 +1,19 @@
+
diff --git a/src/img/coinImage.svg b/src/img/coinImage.svg
new file mode 100644
index 0000000..9d50f5c
--- /dev/null
+++ b/src/img/coinImage.svg
@@ -0,0 +1,19 @@
+
diff --git a/src/img/coupon.svg b/src/img/coupon.svg
new file mode 100644
index 0000000..fda27e5
--- /dev/null
+++ b/src/img/coupon.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/couponImage1.png b/src/img/couponImage1.png
new file mode 100644
index 0000000..cf42154
Binary files /dev/null and b/src/img/couponImage1.png differ
diff --git a/src/img/couponImage2.png b/src/img/couponImage2.png
new file mode 100644
index 0000000..ced5fda
Binary files /dev/null and b/src/img/couponImage2.png differ
diff --git a/src/img/couponImage3.png b/src/img/couponImage3.png
new file mode 100644
index 0000000..b8c3903
Binary files /dev/null and b/src/img/couponImage3.png differ
diff --git a/src/img/couponImage4.png b/src/img/couponImage4.png
new file mode 100644
index 0000000..ff6f8ed
Binary files /dev/null and b/src/img/couponImage4.png differ
diff --git a/src/img/discountfive.png b/src/img/discountfive.png
new file mode 100644
index 0000000..4bdfe54
Binary files /dev/null and b/src/img/discountfive.png differ
diff --git a/src/img/fb-logo.svg b/src/img/fb-logo.svg
new file mode 100644
index 0000000..d504a94
--- /dev/null
+++ b/src/img/fb-logo.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/german-flag.svg b/src/img/german-flag.svg
new file mode 100644
index 0000000..4573266
--- /dev/null
+++ b/src/img/german-flag.svg
@@ -0,0 +1,14 @@
+
diff --git a/src/img/giftIcon.svg b/src/img/giftIcon.svg
new file mode 100644
index 0000000..3fa6e3c
--- /dev/null
+++ b/src/img/giftIcon.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/goftIconOrange.svg b/src/img/goftIconOrange.svg
new file mode 100644
index 0000000..caa1769
--- /dev/null
+++ b/src/img/goftIconOrange.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/google-logo.svg b/src/img/google-logo.svg
new file mode 100644
index 0000000..070c3f9
--- /dev/null
+++ b/src/img/google-logo.svg
@@ -0,0 +1,7 @@
+
diff --git a/src/img/greyBg.png b/src/img/greyBg.png
new file mode 100644
index 0000000..7cd5424
Binary files /dev/null and b/src/img/greyBg.png differ
diff --git a/src/img/iconRightHead.svg b/src/img/iconRightHead.svg
new file mode 100644
index 0000000..4cc519a
--- /dev/null
+++ b/src/img/iconRightHead.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/kasikorn.svg b/src/img/kasikorn.svg
new file mode 100644
index 0000000..f8873fc
--- /dev/null
+++ b/src/img/kasikorn.svg
@@ -0,0 +1,9 @@
+
diff --git a/src/img/lazadaIcon.svg b/src/img/lazadaIcon.svg
new file mode 100644
index 0000000..d948f61
--- /dev/null
+++ b/src/img/lazadaIcon.svg
@@ -0,0 +1,29 @@
+
diff --git a/src/img/logo.svg b/src/img/logo.svg
new file mode 100644
index 0000000..9ca57cf
--- /dev/null
+++ b/src/img/logo.svg
@@ -0,0 +1,9 @@
+
diff --git a/src/img/mainBannerRewardHome.png b/src/img/mainBannerRewardHome.png
new file mode 100644
index 0000000..59bae1e
Binary files /dev/null and b/src/img/mainBannerRewardHome.png differ
diff --git a/src/img/message-circle.svg b/src/img/message-circle.svg
new file mode 100644
index 0000000..2d13837
--- /dev/null
+++ b/src/img/message-circle.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/my-qrcode.svg b/src/img/my-qrcode.svg
new file mode 100644
index 0000000..1d15f4a
--- /dev/null
+++ b/src/img/my-qrcode.svg
@@ -0,0 +1,10 @@
+
diff --git a/src/img/my-tickets.svg b/src/img/my-tickets.svg
new file mode 100644
index 0000000..e2f6987
--- /dev/null
+++ b/src/img/my-tickets.svg
@@ -0,0 +1,16 @@
+
diff --git a/src/img/new-item.png b/src/img/new-item.png
new file mode 100644
index 0000000..6191c5d
Binary files /dev/null and b/src/img/new-item.png differ
diff --git a/src/img/orangeStar.svg b/src/img/orangeStar.svg
new file mode 100644
index 0000000..c230737
--- /dev/null
+++ b/src/img/orangeStar.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/promotion1.png b/src/img/promotion1.png
new file mode 100644
index 0000000..5a567b6
Binary files /dev/null and b/src/img/promotion1.png differ
diff --git a/src/img/promotion2.png b/src/img/promotion2.png
new file mode 100644
index 0000000..dd72790
Binary files /dev/null and b/src/img/promotion2.png differ
diff --git a/src/img/promotion3.png b/src/img/promotion3.png
new file mode 100644
index 0000000..89b5d10
Binary files /dev/null and b/src/img/promotion3.png differ
diff --git a/src/img/qrcode.svg b/src/img/qrcode.svg
new file mode 100644
index 0000000..628e22e
--- /dev/null
+++ b/src/img/qrcode.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/qrcode2.svg b/src/img/qrcode2.svg
new file mode 100644
index 0000000..80df6ff
--- /dev/null
+++ b/src/img/qrcode2.svg
@@ -0,0 +1,10 @@
+
diff --git a/src/img/redeem-points.svg b/src/img/redeem-points.svg
new file mode 100644
index 0000000..7ca9bf0
--- /dev/null
+++ b/src/img/redeem-points.svg
@@ -0,0 +1,25 @@
+
diff --git a/src/img/rewardHomeBag.png b/src/img/rewardHomeBag.png
new file mode 100644
index 0000000..cba712d
Binary files /dev/null and b/src/img/rewardHomeBag.png differ
diff --git a/src/img/rewardHomeMogulo.png b/src/img/rewardHomeMogulo.png
new file mode 100644
index 0000000..3c58839
Binary files /dev/null and b/src/img/rewardHomeMogulo.png differ
diff --git a/src/img/rewardHomeVouchar.png b/src/img/rewardHomeVouchar.png
new file mode 100644
index 0000000..ce89c8b
Binary files /dev/null and b/src/img/rewardHomeVouchar.png differ
diff --git a/src/img/search-md-black.svg b/src/img/search-md-black.svg
new file mode 100644
index 0000000..dc4531b
--- /dev/null
+++ b/src/img/search-md-black.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/search-md.svg b/src/img/search-md.svg
new file mode 100644
index 0000000..d067b63
--- /dev/null
+++ b/src/img/search-md.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/img/shopeeIcon.svg b/src/img/shopeeIcon.svg
new file mode 100644
index 0000000..e9b2e72
--- /dev/null
+++ b/src/img/shopeeIcon.svg
@@ -0,0 +1,11 @@
+
diff --git a/src/img/silvercard-reward.svg b/src/img/silvercard-reward.svg
new file mode 100644
index 0000000..45ff70f
--- /dev/null
+++ b/src/img/silvercard-reward.svg
@@ -0,0 +1,125 @@
+
diff --git a/src/img/silvercard.svg b/src/img/silvercard.svg
new file mode 100644
index 0000000..8bf989e
--- /dev/null
+++ b/src/img/silvercard.svg
@@ -0,0 +1,110 @@
+
diff --git a/src/img/success.svg b/src/img/success.svg
new file mode 100644
index 0000000..3591aa7
--- /dev/null
+++ b/src/img/success.svg
@@ -0,0 +1,4 @@
+
diff --git a/src/img/test-img.png b/src/img/test-img.png
new file mode 100644
index 0000000..aa50924
Binary files /dev/null and b/src/img/test-img.png differ
diff --git a/src/img/thai-flag.svg b/src/img/thai-flag.svg
new file mode 100644
index 0000000..62a7dcc
--- /dev/null
+++ b/src/img/thai-flag.svg
@@ -0,0 +1,16 @@
+
diff --git a/src/img/theLogoImage.png b/src/img/theLogoImage.png
new file mode 100644
index 0000000..08f5383
Binary files /dev/null and b/src/img/theLogoImage.png differ
diff --git a/src/img/tiktokIcon.svg b/src/img/tiktokIcon.svg
new file mode 100644
index 0000000..7844b69
--- /dev/null
+++ b/src/img/tiktokIcon.svg
@@ -0,0 +1,9 @@
+
diff --git a/src/img/transfer-point.svg b/src/img/transfer-point.svg
new file mode 100644
index 0000000..837466a
--- /dev/null
+++ b/src/img/transfer-point.svg
@@ -0,0 +1,21 @@
+
diff --git a/src/img/visa-icon.svg b/src/img/visa-icon.svg
new file mode 100644
index 0000000..47f7726
--- /dev/null
+++ b/src/img/visa-icon.svg
@@ -0,0 +1,7 @@
+
diff --git a/src/img/warning-red.svg b/src/img/warning-red.svg
new file mode 100644
index 0000000..cf8502a
--- /dev/null
+++ b/src/img/warning-red.svg
@@ -0,0 +1,4 @@
+
diff --git a/src/pages/BankInfoPage.jsx b/src/pages/BankInfoPage.jsx
index 492db10..03e991f 100644
--- a/src/pages/BankInfoPage.jsx
+++ b/src/pages/BankInfoPage.jsx
@@ -1,20 +1,123 @@
import React from 'react'
-import { useSearchParams } from 'react-router-dom';
+import { Link, useSearchParams } from 'react-router-dom';
+import TitleHeader from '../components/TitleHeader';
+import success from '../img/success.svg'
+import kasikorn from '../img/kasikorn.svg'
+import qrcode2 from '../img/qrcode2.svg'
+import { Edit05, Copy01, Maximize01, ArrowUpRight } from '@untitled-ui/icons-react';
const BankInfoPage = () => {
- const [searchParams] = useSearchParams();
-
- return (
-
-
-
Thank you for your order: {searchParams.get("order_id")}
-
Please transfer money to the following bank account:
-
Bank: SCB
-
Account Number: 123456789
-
Account Name: John Doe
-
Amount: ฿ {searchParams.get("amount")}
+ const [searchParams] = useSearchParams();
+
+ return (
+ <>
+
+
+
+ 
+ เราได้ส่งข้อความไลน์ และอีเมล
ยืนยันพร้อมลายละเอียดการสั่งซื้อสินค้า
ของคุณไปที่ jintapa01@mail.com
+
+ คุณสามารถไปที่ คำสั่งซื้อของฉัน เพื่อติดตามสถานะ
คำสั่งซื้อของคุณ หรือแจ้งโอนเงินทีหลังได้
+
+
+
+
+
+ ข้อมูลการสั่งซื้อ
+
+
+
คำสั่งซื้อ
+
SHO7705236569
+
+
+
จัดส่งภายใน
+
3 - 4 วันทำการ
Standard Delivery
+
+
ที่อยู่ในการจัดส่ง
+
999/99 พระราม 9 ถนมพระราม9 ห้วยขวาง กรุงเทพมหานคร 12050 ประเทศไทย
+
+
+
การชำระเงิน
+
บัตรเครดิต
+
+
+
+
+
+
+ โอนเงินเข้าบัญชี
+
+
+
+
+ 
+ ธนาคารกสิกรไทย
+
+
+
+
+
ชื่อบัญชี:
+
zaviago จำกัด
+
+
+
+
+
+
+
+
+
+
ยอดที่ต้องโอน
+
฿ 4400.00
+
+
หมายเหตุ:
เมื่อโอนแล้ว คุณลูกค้าอย่าลืมแจ้งโอนกับทาง
แอดมินผ่านทางระบบด้วยค่ะ
+
+
+
+ หรือ Save QR ไปสแกน
+
+
+ 
+
+
+
+
+ {/*
+
+
Thank you for your order: {searchParams.get("order_id")}
+ Please transfer money to the following bank account:
+ Bank: SCB
+ Account Number: 123456789
+ Account Name: John Doe
+ Amount: ฿ {searchParams.get("amount")}
- )
+
*/}
+
+ )
}
export default BankInfoPage
\ No newline at end of file
diff --git a/src/pages/CategoryPage.jsx b/src/pages/CategoryPage.jsx
new file mode 100644
index 0000000..bbb195f
--- /dev/null
+++ b/src/pages/CategoryPage.jsx
@@ -0,0 +1,54 @@
+import FooterMenu from "../components/FooterMenu"
+import searchIcon from '../img/search-md-black.svg'
+import { useCart } from '../hooks/useCart';
+import { ShoppingBag01, ChevronRight } from "@untitled-ui/icons-react";
+import { Link } from 'react-router-dom'
+
+const CategoryPage = () => {
+ const { cartCount, setIsOpen } = useCart()
+
+ const allCates = ['ไอเท็มใหม่', 'เสื้อ', 'กางเกง', 'กระโปรง', 'รองเท้า']
+
+ return (
+ <>
+
+
+ สมาชิกใหม่รับ ของขวัญฟรี กดรับเลย !! 🎁
+
+
+
+
+
+ {allCates.map((cate) => {
+ return (
+
+
+ {cate}
+
+
+
+
+
+ )
+ })}
+
+
+
+
+ )
+}
+
+export default CategoryPage
\ No newline at end of file
diff --git a/src/pages/Checkout.jsx b/src/pages/Checkout.jsx
index 6b07d0e..4c1a3f8 100644
--- a/src/pages/Checkout.jsx
+++ b/src/pages/Checkout.jsx
@@ -7,14 +7,33 @@ import { useFrappeGetCall, useFrappePostCall } from 'frappe-react-sdk';
import { useFormik } from 'formik';
import { orderSchema } from '../components/forms/orderSchema';
import { useNavigate } from 'react-router-dom';
-
+import { ArrowLeft, MarkerPin01, ChevronRight, HelpCircle } from '@untitled-ui/icons-react';
+import chevronDropdown from '../img/chevron-right.svg'
+import { useProducts } from '../hooks/useProducts'
+import { ShoppingBag01 } from '@untitled-ui/icons-react';
+import banks from '../img/banks.svg'
+import visaIcon from '../img/visa-icon.svg'
const Checkout = () => {
const { cart, cartCount, getTotal, resetCart } = useCart();
const navigate = useNavigate();
+ const { getByItemCode } = useProducts()
+
+ const [modified, setModified] = useState(false)
+
const { call, isCompleted, result } = useFrappePostCall('headless_e_commerce.api.place_order');
+ const [checkoutPage, setCheckoutPage] = useState(true)
+ const [selectShippingAddress, setSelectShippingAddress] = useState(false)
+ const [selectPayment, setSelectPayment] = useState(false)
+ const [addCard, setAddCard] = useState(false);
+
+ const [delivery, setDelivery] = useState(59)
+ const [discount, setDiscount] = useState(99)
+
+ const total = getTotal() + delivery - discount
+
const formik = useFormik({
initialValues: {
billing_address: '',
@@ -42,21 +61,87 @@ const Checkout = () => {
}
}, [isCompleted])
+ const tooltipHide = {
+ visibility:"hidden",
+ opacity:"0",
+ transform:"translateY(9px)",
+ transition:"all 300ms"
+ }
+
+ const tooltipShow = {
+ visibility:"visible",
+ opacity:"1",
+ transform:"translateY(6px)",
+ filter:"drop-shadow(0 12px 16px #10182814)",
+ transition:"all 300ms",
+ }
+
+ const [showTooltipCVV, setShowTooltipCVV] = useState(tooltipHide);
const [informationAlert, setInformationAlert] = useState(false);
const [positiveAlert, setPositiveAlert] = useState(false);
const [errorAlert, setErrorAlert] = useState(false);
+ const switchToShippingAddress = () => {
+ setCheckoutPage(false);
+ setSelectShippingAddress(true)
+ }
+
+ const goBackToCheckoutPage = () => {
+ setCheckoutPage(true);
+ setSelectShippingAddress(false);
+ setSelectPayment(false)
+ }
+
+ const switchToSelectPayment = () => {
+ setCheckoutPage(false);
+ setSelectPayment(true);
+ }
+
+ const clickToAddCard = () => {
+ setSelectPayment(false);
+ setAddCard(true)
+ }
+
+ const clickToSelectPayment = () => {
+ setAddCard(false);
+ setSelectPayment(true);
+ }
return (
- 
- 
+