ok
This commit is contained in:
insvrgent
@@ -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 (
|
||||
<div>
|
||||
<h1>Create Coupon</h1>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<label>Discount Type:</label>
|
||||
<select
|
||||
value={discountType}
|
||||
onChange={(e) => setDiscountType(e.target.value)}
|
||||
>
|
||||
<option value="percentage">Percentage</option>
|
||||
<option value="fixed">Fixed</option>
|
||||
</select>
|
||||
<div className={styles.linktreePage}>
|
||||
<div className={styles.dashboardContainer}>
|
||||
<div className={styles.mainHeading}>Buat Voucher {couponDetails != null && 'Berhasil'}</div>
|
||||
<div className={styles.subHeadingTransparent}>
|
||||
Daftarkan kedaimu sekarang dan mulai gunakan semua fitur unggulan kami.
|
||||
</div>
|
||||
<div>
|
||||
<label>Discount Value:</label>
|
||||
<input
|
||||
type="number"
|
||||
value={discountValue}
|
||||
onChange={(e) => setDiscountValue(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label>Discount Periods (in weeks):</label>
|
||||
<input
|
||||
type="number"
|
||||
value={discountPeriods}
|
||||
onChange={(e) => setDiscountPeriods(e.target.value)}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<button type="submit">Create Coupon</button>
|
||||
</form>
|
||||
{message && <p>{message}</p>}
|
||||
|
||||
{couponDetails != null ?
|
||||
<>
|
||||
<Coupon
|
||||
code={couponDetails?.code || null}
|
||||
value={couponDetails?.discountValue}
|
||||
period={couponDetails?.discountPeriods}
|
||||
type={couponDetails?.type}
|
||||
expiration={couponDetails?.expirationDate}
|
||||
/>
|
||||
<button
|
||||
onClick={() => {
|
||||
navigator.clipboard.writeText('https://dev.coupon.kedaimaster.com/coupon?c=' + couponUrl)
|
||||
.then(() => {
|
||||
// Optional: Show a message that the text has been copied
|
||||
alert("Coupon URL copied to clipboard!");
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error("Failed to copy text: ", err);
|
||||
});
|
||||
}}
|
||||
className={styles.claimButton}
|
||||
style={{marginBottom: '10px'}}
|
||||
>
|
||||
<span>Salin URL VOUCHER</span>
|
||||
</button></>
|
||||
|
||||
:
|
||||
<div className={styles.LoginForm}>
|
||||
<div className={`${styles.FormUsername} ${inputtingPassword ? styles.animateForm : wasInputtingPassword ? styles.reverseForm : ''}`}>
|
||||
<label htmlFor="username" className={styles.usernameLabel}>---- Daftar -------------------------------</label>
|
||||
<select
|
||||
className={!error ? styles.usernameInput : styles.usernameInputError}
|
||||
value={discountType}
|
||||
onChange={(e) => setDiscountType(e.target.value)}
|
||||
>
|
||||
<option value="percentage">Percentage</option>
|
||||
<option value="fixed">Fixed</option>
|
||||
</select>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
placeholder="Nilai voucher"
|
||||
value={discountValue}
|
||||
onChange={(e) => setDiscountValue(e.target.value)}
|
||||
className={!error ? styles.usernameInput : styles.usernameInputError}
|
||||
/>
|
||||
<button onClick={() => { setInputtingPassword(true); setWasInputtingPassword(true); }} className={styles.claimButton}>
|
||||
<span>➜</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className={`${styles.FormPassword} ${inputtingPassword ? styles.animateForm : wasInputtingPassword ? styles.reverseForm : ''}`}>
|
||||
<span>
|
||||
<label onClick={() => setInputtingPassword(false)} htmlFor="password" className={styles.usernameLabel}> <--- <-- kembali </label>
|
||||
<label htmlFor="password" className={styles.usernameLabel}> ----------------- </label>
|
||||
</span>
|
||||
|
||||
<input
|
||||
type="number"
|
||||
placeholder="Periode diskon (minggu)"
|
||||
value={discountPeriods}
|
||||
onChange={(e) => setDiscountPeriods(e.target.value)}
|
||||
maxLength="30"
|
||||
className={!error ? styles.usernameInput : styles.usernameInputError}
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Ekspektasi kode"
|
||||
value={codeExpectation}
|
||||
onChange={(e) => setCodeExpectation(e.target.value)}
|
||||
maxLength="30"
|
||||
className={!error ? styles.usernameInput : styles.usernameInputError}
|
||||
/>
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
className={`${styles.claimButton} ${loading ? styles.loading : ''}`}
|
||||
disabled={loading}
|
||||
>
|
||||
<span>{loading ? 'Loading...' : 'Buat'}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -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();
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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,
|
||||
}
|
||||
</div>
|
||||
}
|
||||
{!forCafe && selectedCafeId == -1 &&
|
||||
<div style={{
|
||||
textAlign: "center",
|
||||
}}>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
justifyContent: "center",
|
||||
padding: "20px",
|
||||
}}
|
||||
>
|
||||
{user?.roleId == 0 ?
|
||||
<RoundedRectangle
|
||||
title={"Masukkan nama bisnis"}
|
||||
width="calc(100% - 10px)"
|
||||
>
|
||||
<input
|
||||
value={itemName}
|
||||
onChange={(e) => setItemName(e.target.value)}
|
||||
style={{
|
||||
width: '70%',
|
||||
fontSize: '25px',
|
||||
borderRadius: '7px',
|
||||
border: '1px solid black'
|
||||
}}
|
||||
/>
|
||||
</RoundedRectangle>
|
||||
:
|
||||
|
||||
<RoundedRectangle
|
||||
title={"Masukkan nama bisnis"}
|
||||
width="calc(100% - 10px)"
|
||||
>
|
||||
<input
|
||||
value={itemName}
|
||||
onChange={(e) => setItemName(e.target.value)}
|
||||
style={{
|
||||
width: '70%',
|
||||
fontSize: '25px',
|
||||
borderRadius: '7px',
|
||||
border: '1px solid black'
|
||||
}}
|
||||
/>
|
||||
</RoundedRectangle>
|
||||
|
||||
}
|
||||
<RoundedRectangle
|
||||
title={user?.roleId === 0 ? "Buat Voucher" : "Buat Bisnis"}
|
||||
width="calc(100% - 10px)"
|
||||
onClick={handleClick}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
{user?.roleId == 1 &&
|
||||
<>
|
||||
<div className={`${styles.couponContainer}`}>
|
||||
|
||||
Reference in New Issue
Block a user