This commit is contained in:
zadit
2025-02-02 18:17:56 +07:00
parent b0813e1519
commit 02e101025e
13 changed files with 216 additions and 738 deletions

View File

@@ -1,6 +1,6 @@
import React, { useState } from "react";
import API_BASE_URL from "../config.js";
import {createCoupon} from "../helpers/couponHelpers.js"
function getAuthToken() {
return localStorage.getItem("auth");
@@ -11,30 +11,17 @@ const CreateCouponPage = () => {
const [discountPeriods, setDiscountPeriods] = useState("");
const [message, setMessage] = useState("");
const handleSubmit = async (e) => {
e.preventDefault();
try {
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,
}),
});
if (response.ok) {
const data = await response.json();
setMessage(`Coupon created successfully: ${data.coupon.code}`);
} else {
setMessage("Failed to create coupon.");
}
} catch (error) {
setMessage("Error creating coupon.");
// Call the helper function to create the coupon
const result = await createCoupon(discountType, discountValue, discountPeriods);
if (result.success) {
setMessage(`Coupon created successfully: ${result.couponCode}`);
} else {
setMessage(result.message);
}
};

View File

@@ -70,7 +70,7 @@ const LinktreePage = ({ setModal }) => {
return (
<div className={styles.linktreePage}>
<div className={styles.dashboardContainer}>
<div className={styles.mainHeading}>Gunakan Kupon</div>
<div className={styles.mainHeading}>Gunakan Voucher</div>
<div className={styles.subHeadingTransparent}>
Daftarkan kedaimu sekarang dan mulai gunakan semua fitur unggulan kami.
</div>

View File

@@ -236,634 +236,6 @@ const LinktreePage = ({ user, setModal }) => {
return (
<>
{user && user.roleId < 2 ? (
// <>
// <div className={styles.nonCenteredLinktreePage}>
// <div className={styles.dashboard}>
// <div className={styles.header}>
// <Header
// HeaderText={"selamat sore " + user.username}
// isEdit={() => setIsModalOpen(true)}
// isLogout={handleLogout}
// user={user}
// showProfile={true}
// setModal={setModal}
// HeaderMargin='0px'
// />
// </div>
// <div className={styles.headerCardWrapper}>
// <div className={styles.headerCard}>
// {user.roleId == 0 ? (
// selectedItemId == 0 || selectedItemId == -1 ? (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{items?.totalIncome}</p>
// <p> pemasukan</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p> Tagihan</p>
// <p>{items?.totalIncome * 0.02}</p>
// </div>
// </div>
// ) : (
// <div className={styles.cardBody}>
// <div className={styles.cardItem} >
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{selectedItems?.totalIncome}</p>
// <p>pemasukann</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{selectedItems?.totalIncome * 0.02}</p>
// <p>tagihan</p>
// </div>
// <div className={styles.cardImg}>
// <img
// src={filteredItems?.welcomePageConfig ?
// API_BASE_URL + "/" + (JSON.parse(filteredItems.welcomePageConfig)?.image || '') : 'https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg'
// }
// />
// <p>{selectedItems?.totalIncome * 0.02}</p>
// <p>{filteredItems.name}</p>
// </div>
// </div>
// )
// ) : (
// selectedItemId == 0 || selectedItemId == -1 ?
// (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalIncome)}</p>
// <p> pemasukan</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalOutcome)}</p>
// <p> pengeluaran</p>
// </div>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(items?.totalIncome * 0.02)}</p>
// <p> tanggungan</p>
// </div>
// </div>
// ) : (
// <div className={styles.cardBody}>
// <div className={styles.cardItem}>
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(selectedItems?.report?.totalIncome)}</p>
// <p>pemasukan</p>
// </div>
// <div className={styles.cardItem} >
// <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
// width="44.000000pt" height="44.000000pt" viewBox="0 0 224.000000 246.000000"
// preserveAspectRatio="xMidYMid meet">
// <rect x="5" y="5" width="216" height="236" rx="200" ry="500" fill="rgb(255,255,255)" />
// <g transform="translate(0.000000,246.000000) scale(0.100000,-0.100000)"
// fill="#000000" stroke="none">
// <path d="M1001 2449 c-459 -53 -835 -377 -957 -824 -25 -92 -28 -118 -32 -331
// -4 -251 4 -328 54 -485 119 -376 418 -666 782 -760 131 -33 259 -44 370 -31
// 273 32 484 133 672 322 173 172 277 375 325 635 14 71 16 133 13 319 -4 213
// -7 239 -32 331 -124 453 -498 771 -971 825 -101 11 -119 11 -224 -1z m326
// -115 c254 -52 490 -212 637 -432 59 -89 98 -174 133 -287 25 -84 27 -103 27
// -270 1 -158 -2 -189 -22 -259 -108 -376 -367 -628 -752 -733 -50 -13 -103 -17
// -230 -17 -127 0 -180 4 -230 17 -385 105 -644 357 -752 733 -20 70 -23 101
// -22 259 0 167 2 186 27 270 70 228 191 404 372 538 156 116 314 176 525 201
// 56 6 209 -4 287 -20z m-854 -1898 c56 -39 61 -49 48 -94 -6 -22 -9 -21 -68 33
// -61 55 -169 189 -198 246 -10 18 17 -4 72 -59 49 -48 114 -105 146 -126z
// m1512 185 c-44 -87 -245 -311 -278 -311 -4 0 -7 18 -5 40 2 38 7 44 72 92 39
// 28 105 86 146 129 41 43 76 78 78 78 1 1 -4 -12 -13 -28z m-1269 -315 c83 -32
// 182 -56 299 -74 l50 -7 0 -55 0 -55 -50 4 c-84 6 -227 47 -313 90 l-82 41 0
// 45 c0 25 2 45 4 45 2 0 44 -15 92 -34z m892 -18 c-3 -42 -4 -44 -76 -81 -74
// -39 -213 -79 -309 -90 l-53 -6 0 58 0 59 65 7 c82 8 237 47 295 73 71 32 82
// 30 78 -20z"/>
// <path d="M995 2216 c-5 -2 -43 -11 -82 -21 -211 -48 -397 -178 -523 -365 -195
// -288 -189 -700 14 -984 235 -329 663 -457 1038 -310 195 76 380 249 468 436
// 129 275 105 614 -60 858 -123 182 -297 306 -515 366 -55 15 -313 30 -340 20z
// m311 -116 c226 -58 403 -200 507 -405 118 -235 108 -512 -25 -740 -53 -90
// -183 -220 -273 -273 -244 -144 -546 -144 -790 0 -90 53 -220 183 -273 273
// -133 228 -143 505 -25 740 103 204 280 346 503 404 105 28 270 28 376 1z"/>
// <path d="M630 1401 l0 -331 80 0 80 0 0 125 0 125 28 0 c25 -1 31 -10 83 -123
// l56 -122 91 -3 c51 -1 92 0 92 3 0 3 -30 64 -66 136 l-66 132 41 41 c22 22 45
// 54 50 69 25 66 5 155 -47 210 -53 56 -73 61 -254 65 l-168 4 0 -331z m297 167
// c29 -27 29 -65 1 -95 -18 -19 -32 -23 -80 -23 l-58 0 0 70 0 70 57 0 c44 0 62
// -5 80 -22z"/>
// <path d="M1220 1240 l0 -330 75 0 75 0 0 96 c0 88 2 95 18 89 74 -32 132 -30
// 190 5 52 32 65 75 65 221 0 154 -13 192 -83 227 -54 27 -101 28 -157 2 -43
// -19 -43 -19 -43 0 0 18 -7 20 -70 20 l-70 0 0 -330z m252 183 c25 -23 27 -177
// 1 -205 -24 -27 -69 -23 -89 7 -20 31 -17 172 5 198 17 22 59 22 83 0z"/>
// </g>
// </svg>
// <p>{formatIncome(selectedItems?.report?.currentOutcome)}</p>
// <p>pengeluaran</p>
// </div>
// <div className={styles.cardImg}>
// <img
// src={selectedItems?.welcomePageConfig ?
// API_BASE_URL + "/" + (JSON.parse(selectedItems.welcomePageConfig)?.image || '') : 'https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg'
// }
// />
// <p>&nbsp;</p>
// <p>{selectedItems?.name}</p>
// </div>
// </div>
// )
// )}
// </div>
// </div>
// </div>
// <div className={styles.dashboardBody}>
// <button className={styles.goCafeButton} style={{ visibility: (selectedItems?.cafeId || selectedSubItems.find(cafe => cafe.cafeId == selectedSubItemId)?.cafeId) == null ? 'hidden' : 'visible' }} onClick={() => window.location.href = window.location.origin + '/' + (selectedItems?.cafeIdentifyName || selectedSubItems.find(cafe => cafe.cafeId == selectedSubItemId)?.cafeIdentifyName)}>Kunjungi kedai</button>
// <h3 style={{ color: 'black' }}>terlaku</h3>
// <div
// style={{
// display: "flex",
// alignItems: "center",
// justifyContent: "space-between",
// margin: '5px'
// }}
// >
// <div style={{ flex: 1 }}>
// <CircularDiagram segments={segments} />
// </div>
// <div style={{ flex: "1 1 20%" }}>
// {segments && segments.map((item, index) => (
// <div
// key={index}
// style={{
// display: "flex",
// alignItems: "center",
// }}
// >
// <div
// style={{
// marginRight: "5px",
// fontSize: "1.2em",
// color: colors[index],
// }}
// >
// ★
// </div>
// <h5 style={{ margin: 0, textAlign: "left", color: 'black' }}>{item.percentage == 'Infinity' || isNaN(item.percentage) ? 0 : item.percentage}% &nbsp; {item.value} </h5>
// </div>
// ))}
// {segments.length < 1 &&
// <>
// {Array.from({ length: 5 }).map((_, index) => (
// <div
// key={index}
// style={{
// display: "flex",
// alignItems: "center",
// }}
// >
// <h5
// style={{
// width: '100%',
// margin: 0,
// textAlign: "left",
// backgroundColor: 'gray',
// color: 'gray',
// borderRadius: '20px',
// marginBottom: '2px',
// }}
// >
// -
// </h5>
// </div>
// ))}
// </>
// }
// </div>
// </div>
// <h3>penambahan stok</h3>
// <DailyCharts Data={selectedItems?.report?.materialsPurchased || sortedMaterials} />
// {coupons && coupons.map((coupon) => {
// return <Coupon
// code={coupon?.code || null}
// value={coupon?.discountValue}
// period={coupon?.discountPeriods}
// expiration={coupon?.discountEndDate}
// />
// })}
// <button onClick={()=>setModal('claim-coupon')}></button>
// <div style={{ height: '24vh' }}></div>
// </div>
// </div>
// <div className={styles.cafeListWrapper}>
// <div className={styles.cafeListHeader}>
// Semua {user.roleId < 1 ? 'penyewa' : 'kedai anda'}
// </div>
// <div className={styles.cafeList}>
// </div>
// {user.roleId < 1 &&
// <div className={styles.rectangle}
// style={{ backgroundColor: selectedItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// onClick={() => {
// setSelectedItemId(selectedItemId === -1 ? 0 : -1);
// setModal('create_tenant');
// }}
// >
// Tambah penyewa
// </div>
// }
// {
// items?.items?.length > 0 ? (
// items.items.map((item) => {
// const isTenantSelected = selectedItemId === (item.userId || item.cafeId);
// const tenantBackgroundColor = isTenantSelected && !selectedSubItemId ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)';
// const hasSubItems = item?.subItems?.length > 0;
// return (
// <div key={item.userId || item.cafeId}>
// <div
// onClick={() => {
// setSelectedItemId(isTenantSelected && !selectedSubItemId ? 0 : (item.userId || item.cafeId));
// setSelectedSubItemId(0); // Reset subitem selection when changing tenant
// }}
// style={{ backgroundColor: tenantBackgroundColor }}
// className={isTenantSelected ? styles.rectangleNLine : styles.rectangle}
// >
// <h3>{item.username || item.name} &nbsp;</h3>
// <h3>
// Rp{formatIncome(item.totalIncome || item.report?.currentTotals.income) || 0}
// </h3>
// </div>
// {/* Only show cafes if the tenant is selected */}
// {selectedItemId === (item.userId || item.cafeId) && hasSubItems && item.subItems.map((subItem) => {
// const isCafeSelected = selectedSubItemId == (subItem.cafeId || subItem.userId);
// const cafeBackgroundColor = isCafeSelected ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)';
// return (
// <div
// key={subItem.cafeId || subItem.userId}
// className={styles.subRectangle}
// onClick={() => {
// setSelectedSubItemId(isCafeSelected ? 0 : (subItem.cafeId || subItem.userId)); // Toggle subitem selection
// setSelectedItemId(item.userId || item.cafeId); // Ensure tenant stays selected
// }}
// style={{ backgroundColor: cafeBackgroundColor }}
// >
// {subItem.name || subItem.username}
// {/* &nbsp;pendapatan {formatIncome(subItem.report?.totalIncome || 0)} */}
// </div>
// );
// })}
// {selectedItemId == item.cafeId &&
// <div
// className={styles.subRectangle}
// onClick={() => { setSelectedSubItemId(selectedSubItemId == -1 ? 0 : -1); setModal('create_clerk') }}
// style={{ backgroundColor: selectedItemId == item.cafeId && selectedSubItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// >
// tambah kasir
// </div>
// }
// </div>
// );
// })
// ) : (
// <div>No tenants available</div>
// )
// }
// {user.roleId > 0 &&
// <div className={styles.rectangle}
// style={{ backgroundColor: selectedItemId == -1 ? 'rgb(69, 69, 69)' : 'rgb(114, 114, 114)' }}
// onClick={() => { setSelectedItemId(selectedItemId == -1 ? 0 : -1); setModal('create_kedai') }}
// >
// Tambah kedai
// </div>
// }
// <div style={{ height: '2px' }}></div>
// </div>
// </>
<div>
<div className={styles.header}>
@@ -878,20 +250,7 @@ const LinktreePage = ({ user, setModal }) => {
/>
</div>
<Reports forCafe={false} otherCafes={items?.items} />
<div style={{ padding: '25px' }}>
<h2>Kupon</h2>
{coupons && coupons.map((coupon) => {
return <Coupon
code={coupon?.code || null}
value={coupon?.discountValue}
period={coupon?.discountPeriods}
expiration={coupon?.discountEndDate}
/>
})}
<button onClick={() => setModal('claim-coupon')}></button>
</div>
<Reports forCafe={false} otherCafes={items?.items} coupons={coupons} setModal={setModal} user={user}/>
</div>
) : (
<div className={styles.centeredLinktreePage}>

View File

@@ -97,16 +97,16 @@ const LinktreePage = ({ data, setModal }) => {
onClick={() => setIsUsingCoupon(true)}
className={styles.footerLink}
>
Gunakan kupon
Gunakan Voucher
</a>
</div>
</div>
</div>
) : (
<div className={styles.dashboardContainer}>
<div className={styles.mainHeading}>{isOnlyClaimCoupon ? 'Aktifkan Kupon' : 'Daftar Menggunakan Kupon'}</div>
<div className={styles.mainHeading}>{isOnlyClaimCoupon ? 'Aktifkan Voucher' : 'Daftar Menggunakan Voucher'}</div>
<div className={styles.subHeading}>
Kupon dapat digunakan untuk pembuatan akun penyewa maupun untuk memperpanjang masa berlangganan.
Voucher dapat digunakan untuk pembuatan akun penyewa maupun untuk memperpanjang masa berlangganan.
</div>
{couponStatus === 0 ? (
<form className={styles.linktreeForm} onSubmit={(e) => e.preventDefault()}>
@@ -115,7 +115,7 @@ const LinktreePage = ({ data, setModal }) => {
</label>
<input
id="coupon"
placeholder="kode kupon"
placeholder="Kode Voucher"
maxLength="30"
className={styles.usernameInput}
value={couponCode}
@@ -152,7 +152,7 @@ const LinktreePage = ({ data, setModal }) => {
}
}}
>
<span>{isOnlyClaimCoupon ? 'Aktifkan untuk akun ini' : 'Buat akun dengan kupon ini'}</span>
<span>{isOnlyClaimCoupon ? 'Aktifkan untuk akun ini' : 'Buat akun dengan voucher ini'}</span>
</button>
</div>

View File

@@ -3,6 +3,8 @@ import {
getReports,
getAnalytics
} from "../helpers/transactionHelpers.js";
import { createCafe } from "../helpers/cafeHelpers.js"
import { createCoupon } from "../helpers/couponHelpers.js"
import CircularDiagram from "./CircularDiagram";
import styles from "./Transactions.module.css";
import "./Switch.css";
@@ -11,6 +13,8 @@ import MultiSwitch from "react-multi-switch-toggle";
import DailyCharts from '../components/DailyCharts.js';
import PeriodCharts from '../components/PeriodCharts.js';
import Coupon from "../components/Coupon.js";
const RoundedRectangle = ({
onClick,
title,
@@ -105,12 +109,14 @@ const RoundedRectangle = ({
};
const App = ({ forCafe = true, cafeId = -1,
handleClose, otherCafes }) => {
handleClose, otherCafes, coupons, setModal, user }) => {
const [selectedCafeId, setSelectedCafeId] = useState(cafeId);
const [analytics, setAnalytics] = useState({});
const [loading, setLoading] = useState(true);
const [filter, setFilter] = useState("yesterday");
const [itemName, setItemName] = useState('');
const fetchData = async (filter) => {
if (selectedCafeId == '-1') return;
try {
@@ -246,29 +252,33 @@ const App = ({ forCafe = true, cafeId = -1,
filterTexts[["yesterday", "weekly", "monthly", "yearly"].indexOf(filter)];
const [resetKey, setResetKey] = useState(0); // A key to force re-render
const [texts, setTexts] = useState(['buat kedai']); // initially show only first 3 texts
const [texts, setTexts] = useState(['Buat bisnis']); // initially show only first 3 texts
const [fullTexts, setFullTexts] = useState(null); // initially show only first 3 texts
const [fullTextsVisible, setFullTextsVisible] = useState(null); // initially show only first 3 texts
useEffect(() => {
if (otherCafes != null) {
console.log(otherCafes)
let updatedFullTexts;
if (otherCafes.length === 0) {
updatedFullTexts = [["buat kedai", 0]];
updatedFullTexts = [["Buat bisnis", 0]];
setSelectedCafeId(0);
} else if (otherCafes.length === 1) {
updatedFullTexts = [
[otherCafes[0].name, otherCafes[0].cafeId],
["buat kedai", -1]
[otherCafes[0].name || otherCafes[0].username, otherCafes[0].cafeId || otherCafes[0].userId],
["Buat bisnis", -1]
];
setSelectedCafeId(otherCafes[0].cafeId); // Get the cafeId (second part of the pair)
} else {
updatedFullTexts = [
["semua", 0], // First entry is "semua"
...otherCafes.map(cafe => [cafe.name, cafe.cafeId]), // Map over cafes to get name and cafeId pairs
["tambah kedai +", -1] // Add the "+" entry
...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
];
setSelectedCafeId(0);
}
setFullTexts(updatedFullTexts); // Set fullTexts with the original structure
@@ -357,24 +367,7 @@ const App = ({ forCafe = true, cafeId = -1,
{forCafe && <div style={{ marginTop: '49px', marginRight: '10px' }} onClick={handleClose}><svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 512 512"><path d="M48,256c0,114.87,93.13,208,208,208s208-93.13,208-208S370.87,48,256,48,48,141.13,48,256Zm212.65-91.36a16,16,0,0,1,.09,22.63L208.42,240H342a16,16,0,0,1,0,32H208.42l52.32,52.73A16,16,0,1,1,238,347.27l-79.39-80a16,16,0,0,1,0-22.54l79.39-80A16,16,0,0,1,260.65,164.64Z" /></svg></div>}
<div style={{ marginTop: '10px' }}>
{!forCafe &&
// <MultiSwitch
// key={resetKey} // Add key to reset the component and force it to re-render
// texts={texts}
// selectedSwitch={selectedSwitch}
// bgColor={'#f4efe6'}
// borderColor={'transparent'}
// borderWidth={0.1}
// onToggleCallback={onItemToggle}
// fontColor={"#af9463"}
// selectedFontColor={"black"}
// selectedSwitchColor={"white"}
// eachSwitchWidth={70}
// height={"25px"}
// fontSize={"12px"}
// />
<div className={styles.dateSelectorWrapper} style={{ fontSize: '13px' }}>
<div className={styles.dateSelectorWrapper} style={{ fontSize: '12px' }}>
{texts.map((item, indexx) => {
return (
<div
@@ -401,7 +394,7 @@ const App = ({ forCafe = true, cafeId = -1,
marginTop: '30px'
}}>
<MultiSwitch
texts={["kemarin", "minggu ini", "bulan ini", "tahun ini"]}
texts={["Kemarin", "Minggu ini", "Bulan ini", "Tahun ini"]}
selectedSwitch={["yesterday", "weekly", "monthly", "yearly"].indexOf(
filter
)}
@@ -466,7 +459,7 @@ const App = ({ forCafe = true, cafeId = -1,
)}
{!forCafe && selectedCafeId != -1 && selectedCafeId != 0 && (
<RoundedRectangle
title={"Kunjungi kedai"}
title={"Kunjungi bisnis"}
loading={loading}
width="calc(100% - 10px)"
onClick={() => window.location.href = window.location.origin + '/' + otherCafes.find(item => item.cafeId === selectedCafeId).cafeIdentifyName}
@@ -477,8 +470,11 @@ const App = ({ forCafe = true, cafeId = -1,
>
<div style={{ marginRight: "5px", fontSize: "1.2em" }}></div>
<h6 style={{ margin: 0, textAlign: "left", fontSize: '10px', fontWeight: 500 }}>
Persentase pertumbuhan dihitung dengan membandingkan {" "}
{comparisonText} hari terakhir dengan {comparisonText} hari sebelumnya.
{(filter == 'yesterday' || filter == 'weekly') ?
`Data dihitung dengan membandingkan
${comparisonText} hari terakhir dengan ${comparisonText} hari sebelumnya, dengan penghitungan dimulai dari data kemarin.`
:
(filter == 'monthly') ? `Data dihitung dengan membandingkan antara awal hingga akhir bulan ini dan bulan lalu, dengan penghitungan dimulai dari data kemarin` : `Data dihitung dengan membandingkan antara awal hingga akhir tahun ini dan tahun lalu, dengan penghitungan dimulai dari data kemarin`}
</h6>
</div>
</div>
@@ -527,7 +523,6 @@ const App = ({ forCafe = true, cafeId = -1,
{!forCafe && selectedCafeId == -1 &&
<div style={{
textAlign: "center",
marginTop: '30px'
}}>
<div
style={{
@@ -537,18 +532,83 @@ const App = ({ forCafe = true, cafeId = -1,
padding: "20px",
}}
>
<RoundedRectangle
title={"Masukkan nama kedai"}
width="calc(100% - 10px)"
><input style={{width: '70%', fontSize: '25px'}}/></RoundedRectangle>
{user.roleId == 0 ?
<RoundedRectangle
title={"Buat kedai"}
width="calc(100% - 10px)"
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={() => (user.roleId === 0 ? createCoupon(itemName) : createCafe(itemName))}
/>
</div>
</div>
}
{user.roleId == 1 &&
<>
<div className={`${styles.couponContainer}`}>
{forCafe && <div style={{ marginTop: '49px', marginRight: '10px' }} onClick={handleClose}><svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 512 512"><path d="M48,256c0,114.87,93.13,208,208,208s208-93.13,208-208S370.87,48,256,48,48,141.13,48,256Zm212.65-91.36a16,16,0,0,1,.09,22.63L208.42,240H342a16,16,0,0,1,0,32H208.42l52.32,52.73A16,16,0,1,1,238,347.27l-79.39-80a16,16,0,0,1,0-22.54l79.39-80A16,16,0,0,1,260.65,164.64Z" /></svg></div>}
<div>
{!forCafe &&
<div className={styles.dateSelectorWrapper} style={{ fontSize: '13px' }}>
<div
className={`${styles.dateSelector} ${styles.dateSelectorActive}`} style={{ position: 'relative', width: 'calc(32vw - 30px)' }}
>
<div style={{ position: 'absolute', bottom: 0, left: '10%', right: '10%', borderBottom: `1px solid green` }}></div>
<div
style={{ color: 'black' }}>
Voucher
</div>
</div>
</div>
}
</div>
</div>
<div style={{ padding: '25px', paddingTop: '0', paddingBottom: '0' }}>
{coupons && coupons.map((coupon) => {
return <Coupon
code={coupon?.code || null}
value={coupon?.discountValue}
period={coupon?.discountPeriods}
expiration={coupon?.discountEndDate}
/>
})}
<button className={`${styles.addCoupon}`} onClick={() => setModal('claim-coupon')}>Tambahkan Voucher</button>
</div>
</>
}
</div>
);
};

View File

@@ -327,3 +327,19 @@
color: black;
z-index: 2;
}
.couponContainer {
padding: 25px;
transition: margin-top 0.3s ease;
}
.addCoupon {
border: 2px solid #ccc;
background-color: #f8f8f8;
border-radius: 8px;
font-family: Arial, sans-serif;
align-items: center;
margin-bottom: 10px;
width: 100%;
height: 52px;
}