From 556c7337ebc4fd300294459ef827570a7cdea84a Mon Sep 17 00:00:00 2001 From: insvrgent Date: Wed, 5 Feb 2025 12:43:36 +0700 Subject: [PATCH] ok --- src/App.js | 20 ++-- src/components/Modal.js | 3 +- src/helpers/couponHelpers.js | 22 +++-- src/pages/CreateCoupon.js | 154 +++++++++++++++++++++++------- src/pages/CreateUserWithCoupon.js | 10 +- src/pages/Join.js | 2 +- src/pages/Reports.js | 64 ++----------- 7 files changed, 154 insertions(+), 121 deletions(-) diff --git a/src/App.js b/src/App.js index b7f8f8d..5d1e947 100644 --- a/src/App.js +++ b/src/App.js @@ -60,6 +60,7 @@ function App() { const [shopItems, setShopItems] = useState([]); const [isModalOpen, setIsModalOpen] = useState(false); const [modalContent, setModalContent] = useState(null); + const [onModalCloseFunction, setOnModalCloseFunction] = useState(null); const transactionList = useRef(null); const [queue, setQueue] = useState([]); @@ -394,7 +395,7 @@ function App() { }, [navigate]); // Function to open the modal - const setModal = (content, params = {}) => { + const setModal = (content, params = {}, onCloseFunction) => { const queryParams = new URLSearchParams(location.search); // Update the modal and any additional params @@ -411,6 +412,8 @@ function App() { setIsModalOpen(true); setModalContent(content) + if (onCloseFunction) setOnModalCloseFunction(onCloseFunction) + else setOnModalCloseFunction(null) }; const closeModal = (closeTheseContent = []) => { @@ -421,19 +424,19 @@ function App() { setIsModalOpen(false); setModalContent(null); document.body.style.overflow = "auto"; - + const queryParams = new URLSearchParams(location.search); - + // Clear all query parameters queryParams.keys() && [...queryParams.keys()].forEach(key => { queryParams.delete(key); }); - + // Update the URL without any query parameters navigate({ search: queryParams.toString() }, { replace: true }); } }; - + // useEffect(() => { // const askNotificationPermission = async () => { @@ -594,7 +597,7 @@ function App() { element={ <> @@ -664,6 +667,7 @@ function App() { welcomePageConfig={shop.welcomePageConfig} onClose={closeModal} setModal={setModal} + onModalCloseFunction={onModalCloseFunction} /> ); diff --git a/src/components/Modal.js b/src/components/Modal.js index d19752d..6655c0e 100644 --- a/src/components/Modal.js +++ b/src/components/Modal.js @@ -33,7 +33,7 @@ import CreateCoupon from "../pages/CreateCoupon"; import CheckCoupon from "../pages/CheckCoupon"; import CreateUserWithCoupon from "../pages/CreateUserWithCoupon"; -const Modal = ({ user, shop, isOpen, onClose, modalContent, setModal, handleMoveToTransaction,welcomePageConfig }) => { +const Modal = ({ user, shop, isOpen, onClose, modalContent, setModal, handleMoveToTransaction,welcomePageConfig, onModalCloseFunction }) => { const [shopImg, setShopImg] = useState(''); @@ -49,6 +49,7 @@ const Modal = ({ user, shop, isOpen, onClose, modalContent, setModal, handleMove // Function to handle clicks on the overlay const handleOverlayClick = (event) => { // Close the modal only if the overlay is clicked + onModalCloseFunction(); onClose(); }; diff --git a/src/helpers/couponHelpers.js b/src/helpers/couponHelpers.js index 123481e..5d50cb0 100644 --- a/src/helpers/couponHelpers.js +++ b/src/helpers/couponHelpers.js @@ -7,24 +7,31 @@ export function getAuthToken() { return localStorage.getItem('auth'); } // Function to create a coupon -export async function createCoupon(discountType, discountValue, discountPeriods) { +export async function createCoupon(discountType, discountValue, discountPeriods, codeExpectation) { try { + const bodyData = { + discountType, + discountValue, + discountPeriods, + }; + + // Conditionally add `codeExpectation` only if it's defined + if (codeExpectation !== null && codeExpectation !== undefined) { + bodyData.couponCodeExpect = codeExpectation; + } + const response = await fetch(`${API_BASE_URL}/coupon/create`, { method: 'POST', headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${getAuthToken()}`, }, - body: JSON.stringify({ - discountType, - discountValue, - discountPeriods, - }), + body: JSON.stringify(bodyData), }); if (response.ok) { const data = await response.json(); - return { success: true, couponCode: data.coupon.code }; + return { success: true, coupon: data.coupon }; } else { return { success: false, message: 'Failed to create coupon.' }; } @@ -33,6 +40,7 @@ export async function createCoupon(discountType, discountValue, discountPeriods) return { success: false, message: 'Error creating coupon.' }; } } + // Function to check the validity of the coupon code export async function checkCoupon(couponCode) { try { diff --git a/src/pages/CreateCoupon.js b/src/pages/CreateCoupon.js index f9fc292..a21f12b 100644 --- a/src/pages/CreateCoupon.js +++ b/src/pages/CreateCoupon.js @@ -1,5 +1,8 @@ import React, { useState } from "react"; +import styles from './Join.module.css'; +import Coupon from '../components/Coupon'; +import CryptoJS from 'crypto-js'; import {createCoupon} from "../helpers/couponHelpers.js" function getAuthToken() { @@ -9,57 +12,134 @@ const CreateCouponPage = () => { const [discountType, setDiscountType] = useState("percentage"); const [discountValue, setDiscountValue] = useState(""); const [discountPeriods, setDiscountPeriods] = useState(""); - const [message, setMessage] = useState(""); + const [couponDetails, setCouponDetails] = useState(null); + + const [loading, setLoading] = useState(false); + const [error, setError] = useState(false); + const [wasInputtingPassword, setWasInputtingPassword] = useState(false); + const [inputtingPassword, setInputtingPassword] = useState(false); + const [username, setUsername] = useState(''); + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + const [retypePassword, setRetypePassword] = useState(''); + const [codeExpectation, setCodeExpectation] = useState(''); + const [couponUrl, setCouponUrl] = useState(''); + const handleSubmit = async (e) => { e.preventDefault(); + setLoading(true); // Call the helper function to create the coupon - const result = await createCoupon(discountType, discountValue, discountPeriods); + const result = await createCoupon(discountType, discountValue, discountPeriods, codeExpectation); if (result.success) { - setMessage(`Coupon created successfully: ${result.couponCode}`); + setCouponDetails(result.coupon); + const secretKey = 'xixixi666'; // Your AES-256 key (32 characters) + + // Encrypt couponCode inline + const encryptedCouponCode = CryptoJS.AES.encrypt(result.coupon.code, secretKey).toString(); + setCouponUrl(encryptedCouponCode) + console.log(encryptedCouponCode) + setLoading(false); } else { - setMessage(result.message); + setLoading(false); } }; return ( -
-

Create Coupon

-
-
- - +
+
+
Buat Voucher {couponDetails != null && 'Berhasil'}
+
+ Daftarkan kedaimu sekarang dan mulai gunakan semua fitur unggulan kami.
-
- - setDiscountValue(e.target.value)} - required - /> -
-
- - setDiscountPeriods(e.target.value)} - required - /> -
- - - {message &&

{message}

} + + {couponDetails != null ? + <> + + + + : +
+
+ + + + setDiscountValue(e.target.value)} + className={!error ? styles.usernameInput : styles.usernameInputError} + /> + +
+ +
+ + + + + + setDiscountPeriods(e.target.value)} + maxLength="30" + className={!error ? styles.usernameInput : styles.usernameInputError} + /> + setCodeExpectation(e.target.value)} + maxLength="30" + className={!error ? styles.usernameInput : styles.usernameInputError} + /> + +
+
+ } +
); }; diff --git a/src/pages/CreateUserWithCoupon.js b/src/pages/CreateUserWithCoupon.js index efded44..0ccbc37 100644 --- a/src/pages/CreateUserWithCoupon.js +++ b/src/pages/CreateUserWithCoupon.js @@ -21,7 +21,7 @@ const LinktreePage = ({ setModal }) => { // Detect query params on component mount useEffect(() => { - const code = queryParams.get('couponCode'); + const code = queryParams.get('c'); if (code) { setCouponStatus('Coupon is valid'); setCouponCode(code); @@ -29,14 +29,6 @@ const LinktreePage = ({ setModal }) => { } }, [queryParams]); - // Handle coupon validation - const handleCheckCoupon = async (e) => { - e.preventDefault(); - const { status, coupon } = await checkCoupon(couponCode); - setCouponStatus(status); - setCouponDetails(coupon); - }; - // Handle user creation with coupon const handleCreateUserWithCoupon = async (e) => { e.preventDefault(); diff --git a/src/pages/Join.js b/src/pages/Join.js index 32bdc30..37a431e 100644 --- a/src/pages/Join.js +++ b/src/pages/Join.js @@ -176,7 +176,7 @@ const LinktreePage = ({ data, setModal }) => { // Encrypt couponCode inline const encryptedCouponCode = CryptoJS.AES.encrypt(couponCode, secretKey).toString(); - + console.log(encryptedCouponCode) // If it's only claiming a coupon, trigger claim logic setModal('create_user', { codeStatus: 200, c: encryptedCouponCode }); } else { diff --git a/src/pages/Reports.js b/src/pages/Reports.js index 003ee35..09bec47 100644 --- a/src/pages/Reports.js +++ b/src/pages/Reports.js @@ -15,6 +15,8 @@ import PeriodCharts from '../components/PeriodCharts.js'; import Coupon from "../components/Coupon.js"; +import CreateCouponPage from "./CreateCoupon.js"; + const RoundedRectangle = ({ onClick, title, @@ -306,12 +308,12 @@ const App = ({ forCafe = true, cafeId = -1, let updatedFullTexts; if (otherCafes.length === 0) { - updatedFullTexts = [["Buat bisnis", 0]]; + updatedFullTexts = [[user.roleId == 0 ? "Buat Voucher":"Buat bisnis", 0]]; setSelectedCafeId(-1); } else if (otherCafes.length === 1) { updatedFullTexts = [ [otherCafes[0].name || otherCafes[0].username, otherCafes[0].cafeId || otherCafes[0].userId], - ["Buat bisnis", -1] + [user.roleId == 0 ? "Buat Voucher":"Buat bisnis", -1] ]; setSelectedCafeId(otherCafes[0].cafeId); // Get the cafeId (second part of the pair) @@ -319,7 +321,7 @@ const App = ({ forCafe = true, cafeId = -1, updatedFullTexts = [ ["semua", 0], // First entry is "semua" ...otherCafes.map(item => [item.name || item.username, item.cafeId || item.userId]), // Map over cafes to get name and cafeId pairs - ["tambah bisnis +", -1] // Add the "+" entry + [user.roleId == 0 ? "Buat Voucher":"Tambah Bisnis +", -1] // Add the "+" entry ]; setSelectedCafeId(0); @@ -385,6 +387,7 @@ const App = ({ forCafe = true, cafeId = -1, if (selectedItem) { setSelectedCafeId(selectedItem[1]); // Get the cafeId (second part of the pair) } + if(selectedItem[1] == -1 && user.roleId == 0) setModal('create_coupon',{},setSelectedCafeId(0)); setResetKey((prevKey) => prevKey + 1); // Increase the key to force re-render }; @@ -654,61 +657,6 @@ const App = ({ forCafe = true, cafeId = -1, }
} - {!forCafe && selectedCafeId == -1 && -
-
- {user?.roleId == 0 ? - - setItemName(e.target.value)} - style={{ - width: '70%', - fontSize: '25px', - borderRadius: '7px', - border: '1px solid black' - }} - /> - - : - - - setItemName(e.target.value)} - style={{ - width: '70%', - fontSize: '25px', - borderRadius: '7px', - border: '1px solid black' - }} - /> - - - } - -
-
- } {user?.roleId == 1 && <>