From f1591b1a2af6bc5c49733e6fbaeedf4c0cf32e29 Mon Sep 17 00:00:00 2001 From: zadit <75159257+insvrgent@users.noreply.github.com> Date: Sun, 26 Jan 2025 23:45:42 +0700 Subject: [PATCH] ok --- src/components/BarChart.module.css | 1 + src/components/Coupon.css | 12 +- src/components/ItemLister.js | 876 +++++++++++++-------------- src/components/ItemLister.module.css | 11 + src/pages/Dashboard.js | 30 +- src/pages/Join.module.css | 4 +- src/pages/LinktreePage.module.css | 2 +- src/pages/Login.module.css | 2 +- src/pages/Reports.js | 60 +- src/pages/WelcomePage.css | 4 +- 10 files changed, 532 insertions(+), 470 deletions(-) diff --git a/src/components/BarChart.module.css b/src/components/BarChart.module.css index 82556fc..2ed60c4 100644 --- a/src/components/BarChart.module.css +++ b/src/components/BarChart.module.css @@ -1,5 +1,6 @@ .chartItemContainer{ position: relative; + font-size: 14px; } .chartItemWrapper { position: absolute; diff --git a/src/components/Coupon.css b/src/components/Coupon.css index ec750d9..516013d 100644 --- a/src/components/Coupon.css +++ b/src/components/Coupon.css @@ -62,9 +62,9 @@ pointer-events: none; position: absolute; top: -38px; - width: 200px; - height: 200px; - right: -35px; + width: 170px; + height: 170px; + right: -30px; transform: scale(-0.8,0.8); } @@ -76,11 +76,11 @@ .RibbonBannerInverted h1 { margin: 0; /* Remove default margin */ - font-size: 20px; /* Adjust font size as needed */ + font-size: 18px; /* Adjust font size as needed */ transform: rotate(-44.7deg)scale(-1,1); /* Rotate the text */ transform-origin: center; /* Rotate around its center */ white-space: nowrap; /* Prevent text wrapping */ position: absolute; - top: 68px; - left: -9px; + top: 57px; + left: -12px; } \ No newline at end of file diff --git a/src/components/ItemLister.js b/src/components/ItemLister.js index 8327873..11dc83e 100644 --- a/src/components/ItemLister.js +++ b/src/components/ItemLister.js @@ -493,121 +493,121 @@ const ItemLister = ({ {(items.length > 0 || (user && (user.cafeId == shopId || user.userId == shopOwnerId))) && (
- - { (isEdit && isFirstStep || !isEdit) && -
- {isEdit && } - setEditedTypeName(e.target.value)} - disabled={!isEdit} - /> - {isEditMode && !isEdit && ( - <> -
moveItemTypeUp(itemTypeId)} // Move onClick here for the whole div - > - - - - - - - -
-
moveItemTypeDown(itemTypeId)} // Move onClick here for the whole div - > - - - - - - - -
-
- + {isEdit && } +
moveItemTypeUp(itemTypeId)} // Move onClick here for the whole div > - - - - - - - -
+ + + + + + + +
+
moveItemTypeDown(itemTypeId)} // Move onClick here for the whole div + > + + + + + + + +
- - )} -
-} +
+ + + + + + + + +
+ + + )} +
+ } {isEdit && isFirstStep && ( <> -
- - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/addnew.png")} - /> - {/* {typeImage != null && !previewUrl.includes(typeImage) && ( +
+ + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/addnew.png")} + /> + {/* {typeImage != null && !previewUrl.includes(typeImage) && ( @@ -617,355 +617,355 @@ const ItemLister = ({ /> )} */} - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/beverage4.jpg")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/beverage1.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/beverage2.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/beverage3.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/snack5.jpg")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/dessert1.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/dessert2.jpg")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/food4.jpg")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/food1.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/food2.jpg")} - /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/beverage4.jpg")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/beverage1.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/beverage2.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/beverage3.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/snack5.jpg")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/dessert1.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/dessert2.jpg")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/food4.jpg")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/food1.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/food2.jpg")} + /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/food3.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/packet1.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/packet2.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/snack1.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/snack2.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/snack3.png")} - /> - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl("uploads/snack4.png")} - /> - {Array.from({ length: 16 }, (_, index) => { - const sampleNumber = index + 1; // To get numbers from 1 to 16 - return ( - - handleImageChange(previewUrl, selectedImage) - } - imageUrl={getImageUrl(`uploads/samples/sample (${sampleNumber}).png`)} - /> - ); - })} -
- + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/food3.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/packet1.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/packet2.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/snack1.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/snack2.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/snack3.png")} + /> + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl("uploads/snack4.png")} + /> + {Array.from({ length: 16 }, (_, index) => { + const sampleNumber = index + 1; // To get numbers from 1 to 16 + return ( + + handleImageChange(previewUrl, selectedImage) + } + imageUrl={getImageUrl(`uploads/samples/sample (${sampleNumber}).png`)} + /> + ); + })} +
+ )} - { (isEdit && !isFirstStep || !isEdit) && - <> - {isEdit &&
setIsFirstStep(true)}style={{color: 'black', fontSize: '50px', width: '30px'}}>←
-

Daftar item

} -
- {user && ( - user.userId == shopOwnerId || user.cafeId == shopId) && - isEditMode && ( - <> - {!isAddingNewItem && ( - - )} - {isAddingNewItem && ( + {(isEdit && !isFirstStep || !isEdit) && + <> + {isEdit &&
setIsFirstStep(true)}>
+

{items && items.length < 1 ? 'Buat item' :'Daftar item'}

} +
+ {user && ( + user.userId == shopOwnerId || user.cafeId == shopId) && + isEditMode && ( <> - - + {!isAddingNewItem && ( + + )} + {isAddingNewItem && ( + <> + + + + )} )} - - )} - {itemsToCreate.map((item) => { - return !forCart || (forCart && item.qty > 0) ? ( - <> - {isEditItem == item.itemId && ( - - )} -
- {isEditMode && isEditItem != item.itemId && ( -
- {isEditMode && ( - handleChange(item.itemId)} - checked={item.availability} - /> - )} -

-  {item.availability ? "tersedia" : "tidak tersedia"}   -

-
editItem(item.itemId)} + {itemsToCreate.map((item) => { + return !forCart || (forCart && item.qty > 0) ? ( + <> + {isEditItem == item.itemId && ( +
-
- )} - - handlePlusClick(item.itemId)} - onNegativeClick={() => handleNegativeClick(item.itemId)} - onRemoveClick={() => handleRemoveClick(item.itemId)} - isBeingEdit={isEditItem == item.itemId} - isAvailable={item.availability} - handleUpdateItem={(name, price, image) => - updateItemInCreate(item.itemId, name, price, image) - } - /> -
- - ) : null; - })} - - {items.map((item) => { - return !forCart || (forCart && item.qty > 0) ? ( - <> - {isEditItem == item.itemId && ( - - )} -
- {isEditMode && isEditItem != item.itemId && ( -
- {isEditMode && ( - handleChange(item.itemId)} - checked={item.availability} - /> + batal + + )} +
+ {isEditMode && isEditItem != item.itemId && ( +
+ {isEditMode && ( + handleChange(item.itemId)} + checked={item.availability} + /> + )} +

+  {item.availability ? "tersedia" : "tidak tersedia"}   +

+
editItem(item.itemId)} + > + + + + + + + + +
+
)} -

-  {item.availability ? "tersedia" : "tidak tersedia"}  -

-
editItem(item.itemId)} - > - - - - - - - - -
+ + handlePlusClick(item.itemId)} + onNegativeClick={() => handleNegativeClick(item.itemId)} + onRemoveClick={() => handleRemoveClick(item.itemId)} + isBeingEdit={isEditItem == item.itemId} + isAvailable={item.availability} + handleUpdateItem={(name, price, image) => + updateItemInCreate(item.itemId, name, price, image) + } + />
- )} + + ) : null; + })} - handlePlusClick(item.itemId)} - onNegativeClick={() => handleNegativeClick(item.itemId)} - onRemoveClick={() => handleRemoveClick(item.itemId)} - isBeingEdit={isEditItem == item.itemId} - isAvailable={item.availability} - handleUpdateItem={(name, price, image) => - onUpdateItem(item.itemId, name, price, image) - } - /> -
- - ) : null; - })} + {items.map((item) => { + return !forCart || (forCart && item.qty > 0) ? ( + <> + {isEditItem == item.itemId && ( + + )} +
+ {isEditMode && isEditItem != item.itemId && ( +
+ {isEditMode && ( + handleChange(item.itemId)} + checked={item.availability} + /> + )} +

+  {item.availability ? "tersedia" : "tidak tersedia"}  +

+
editItem(item.itemId)} + > + + + + + + + + +
+
+ )} - {user && - user.roleId == 1 && - user.userId == shopOwnerId && - isEdit && ( - <> - {/*
+ + ) : null; + })} + + {user && + user.roleId == 1 && + user.userId == shopOwnerId && + isEdit && ( + <> + {/* */} - - )} - -
- + + )} + +
+ } {isEdit && (
diff --git a/src/components/ItemLister.module.css b/src/components/ItemLister.module.css index 63bc1a7..020330b 100644 --- a/src/components/ItemLister.module.css +++ b/src/components/ItemLister.module.css @@ -212,3 +212,14 @@ margin-bottom: 25px; cursor: pointer; } + +.item-list-title { + margin-top: 46px; + margin-left: 0px; + font-family: "Plus Jakarta Sans", sans-serif; + font-weight: 500; + font-style: normal; + font-size: 6vw; + color: black; + text-align: left; +} \ No newline at end of file diff --git a/src/pages/Dashboard.js b/src/pages/Dashboard.js index 896536d..9d8e87b 100644 --- a/src/pages/Dashboard.js +++ b/src/pages/Dashboard.js @@ -864,7 +864,35 @@ const LinktreePage = ({ user, setModal }) => { //
//
// - +
+
+ +
setIsModalOpen(true)} + isLogout={handleLogout} + user={user} + showProfile={true} + setModal={setModal} + HeaderMargin='0px' + /> +
+ + + +
+

Kupon

+ {coupons && coupons.map((coupon) => { + return + })} + +
+
) : (
diff --git a/src/pages/Join.module.css b/src/pages/Join.module.css index 6ca4c93..4f8dca6 100644 --- a/src/pages/Join.module.css +++ b/src/pages/Join.module.css @@ -68,7 +68,7 @@ font-weight: 400; line-height: 1.5rem; font-size: 14px; - font-family: 'poppins'; + font-family: "Plus Jakarta Sans", sans-serif; color: black; margin-bottom: 1.5rem; } @@ -77,7 +77,7 @@ font-weight: 400; line-height: 1.5rem; font-size: 14px; - font-family: 'poppins'; + font-family: "Plus Jakarta Sans", sans-serif; color: transparent; margin-bottom: -2.5rem; } diff --git a/src/pages/LinktreePage.module.css b/src/pages/LinktreePage.module.css index bcbc000..77db6eb 100644 --- a/src/pages/LinktreePage.module.css +++ b/src/pages/LinktreePage.module.css @@ -150,7 +150,7 @@ font-weight: 400; line-height: 1.5rem; font-size: 14px; - font-family: 'poppins'; + font-family: "Plus Jakarta Sans", sans-serif; color: black; margin-bottom: 1.5rem; } diff --git a/src/pages/Login.module.css b/src/pages/Login.module.css index 4f84aa3..d223193 100644 --- a/src/pages/Login.module.css +++ b/src/pages/Login.module.css @@ -77,7 +77,7 @@ font-weight: 400; line-height: 1.5rem; font-size: 14px; - font-family: 'poppins'; + font-family: "Plus Jakarta Sans", sans-serif; color: black; margin-bottom: 1.5rem; } diff --git a/src/pages/Reports.js b/src/pages/Reports.js index e1dd2fd..68233bd 100644 --- a/src/pages/Reports.js +++ b/src/pages/Reports.js @@ -1,6 +1,7 @@ import React, { useEffect, useState } from "react"; import { getReports, + getAnalytics } from "../helpers/transactionHelpers.js"; import CircularDiagram from "./CircularDiagram"; import styles from "./Transactions.module.css"; @@ -20,13 +21,14 @@ const RoundedRectangle = ({ loading = false, children, // Assuming this is a React component or JSX isChildren, + width='calc(100% / 2 - 10px)' }) => { const containerStyle = { display: "flex", flexDirection: "column", alignItems: "flex-start", justifyContent: "center", - width: !children && !isChildren && "calc(100% / 2 - 10px)", + width: !children && !isChildren && width, height: "auto", borderRadius: "15px", padding: "20px", @@ -102,17 +104,22 @@ const RoundedRectangle = ({ ); }; -const App = ({ cafeId, +const App = ({ forCafe = true, cafeId="", handleClose, otherCafes }) => { + const [selectedCafeId, setSelectedCafeId] = useState(cafeId); const [analytics, setAnalytics] = useState({}); const [loading, setLoading] = useState(true); const [filter, setFilter] = useState("yesterday"); const fetchData = async (filter) => { + if(selectedCafeId == '-1') return; try { setLoading(true); // Fetch the analytics data with the selected filter - const analyticsData = await getReports(cafeId, filter); + const analyticsData = (selectedCafeId !== '' && selectedCafeId !== 0) + ? await getReports(selectedCafeId, filter) + : await getAnalytics(filter); + console.log(analyticsData); if (analyticsData) setAnalytics(analyticsData); } catch (error) { @@ -122,9 +129,13 @@ const App = ({ cafeId, } }; + useEffect(() => { + setSelectedCafeId(cafeId) + }, [cafeId]); + useEffect(() => { fetchData(filter); // Fetch data when filter changes - }, [filter]); + }, [filter, selectedCafeId]); const filteredItems = analytics.itemSales || []; @@ -193,6 +204,7 @@ const App = ({ cafeId, const [texts, setTexts] = useState(['buat kedai']); // 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) { let updatedFullTexts; @@ -204,6 +216,8 @@ const App = ({ cafeId, [otherCafes[0].name, otherCafes[0].cafeId], ["buat kedai", -1] ]; + + setSelectedCafeId(otherCafes[0].cafeId); // Get the cafeId (second part of the pair) } else { updatedFullTexts = [ ["semua", 0], // First entry is "semua" @@ -231,15 +245,15 @@ const App = ({ cafeId, const [selectedSwitch, setSelectedSwitch] = useState(0); const onItemToggle = (index) => { - let selectedCafeId = null; // When user clicks the last visible option (index === 2 in the current view) if (index === 2) { console.log(fullTexts); - if (fullTexts.indexOf(texts[2]) < fullTexts.length - 1) { + if (fullTexts.findIndex(item => item[0] === texts[2]) < fullTexts.length - 1) { setTexts((prevTexts) => { const newTexts = [...prevTexts]; - const nextText = fullTexts[prevTexts.length]; // Get the next item in the full list + console.log(prevTexts.length) + const nextText = fullTexts[fullTexts.findIndex(item => item[0] === texts[2])+1][0]; // Get the next item in the full list newTexts.shift(); // Remove the first element newTexts.push(nextText); // Add the next item to the end setSelectedSwitch(1); // Change the selected index @@ -256,7 +270,7 @@ const App = ({ cafeId, const newTexts = [...prevTexts]; const prevText = fullTexts[fullTexts.findIndex(item => item[0] === newTexts[0]) - 1]; // Get the previous item newTexts.pop(); // Remove the last element - newTexts.unshift(prevText); // Add the previous item to the start + newTexts.unshift(prevText[0]); // Add the previous item to the start setSelectedSwitch(1); // Change the selected index return newTexts; }); @@ -270,11 +284,9 @@ const App = ({ cafeId, const selectedText = texts[index]; // Get the selected name from the texts array const selectedItem = fullTexts.find(item => item[0] === selectedText); // Find the corresponding full item if (selectedItem) { - selectedCafeId = selectedItem[1]; // Get the cafeId (second part of the pair) + setSelectedCafeId(selectedItem[1]); // Get the cafeId (second part of the pair) } - console.log('Selected cafeId:', selectedCafeId); // Log the selected cafeId - setResetKey((prevKey) => prevKey + 1); // Increase the key to force re-render }; @@ -285,19 +297,22 @@ const App = ({ cafeId, return (
-
-

Laporan

+
+ {forCafe &&
} +

Laporan

- {otherCafes && )} + {!forCafe && selectedCafeId != -1 && selectedCafeId != 0 && ( + window.location.href = window.location.origin + '/' + otherCafes.find(item => item.cafeId === selectedCafeId).cafeIdentifyName} + /> + )}
-
+
Persentase pertumbuhan dihitung dengan membandingkan {" "} {comparisonText} hari terakhir dengan {comparisonText} hari sebelumnya.
@@ -428,12 +451,11 @@ const App = ({ cafeId,
{filter == 'yesterday' || filter == 'weekly' ? - + : }
-
Kembali
); }; diff --git a/src/pages/WelcomePage.css b/src/pages/WelcomePage.css index 3f04067..4dc61a3 100644 --- a/src/pages/WelcomePage.css +++ b/src/pages/WelcomePage.css @@ -30,7 +30,7 @@ .welcoming-text { font-size: 24px; margin-bottom: 20px; - font-family: poppins; + font-family: "Plus Jakarta Sans", sans-serif; } .get-started-button { @@ -42,7 +42,7 @@ cursor: pointer; font-size: 16px; transition: background-color 0.3s; - font-family: poppins; + font-family: "Plus Jakarta Sans", sans-serif; } .get-started-button:hover {