kediritechnopark/groovee
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
Vassshhh
2025-08-27 02:53:44 +07:00
parent e039fc8acc
commit ba896106d4
12 changed files with 292 additions and 283 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
src/components/DailyCharts.js
View File

@@ -23,41 +23,50 @@ const DailyCharts = ({ incomeGraph, transactionGraph, materialGraph, colors, typ
"21-24",
];
console.log(dayData)
const sumSold = (transactions) =>
Array.isArray(transactions) ? transactions.reduce((acc, t) => acc + t.sold, 0) : transactions.transaction || 0;
const sumTotal = (transactions) =>
Array.isArray(transactions) ? transactions.reduce((acc, t) => acc + t.totalPrice, 0) : transactions.income || 0;
const sumOutcome = (transactions) =>
Array.isArray(transactions) ? transactions.reduce((acc, t) => acc + t.materialOutcome || t.price, 0) : transactions.outcome || 0;
let seriesData = []
if(graphFilter == 'transactions'){
seriesData = [
dayData.hour0To3Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour3To6Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour6To9Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour9To12Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour12To15Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour15To18Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour18To21Transactions.reduce((acc, t) => acc + t.sold, 0),
dayData.hour21To24Transactions.reduce((acc, t) => acc + t.sold, 0),
];
}
else if(graphFilter == 'income'){
if (graphFilter == 'transactions') {
seriesData = [
dayData.hour0To3Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour3To6Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour6To9Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour9To12Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour12To15Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour15To18Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour18To21Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
dayData.hour21To24Transactions.reduce((acc, t) => acc + t.totalPrice, 0),
sumSold(dayData?.hour0To3Transactions),
sumSold(dayData?.hour3To6Transactions),
sumSold(dayData?.hour6To9Transactions),
sumSold(dayData?.hour9To12Transactions),
sumSold(dayData?.hour12To15Transactions),
sumSold(dayData?.hour15To18Transactions),
sumSold(dayData?.hour18To21Transactions),
sumSold(dayData?.hour21To24Transactions),
];
}
else if(graphFilter == 'outcome'){
else if (graphFilter == 'income') {
seriesData = [
dayData.hour3To6MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour6To9MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour0To3MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour9To12MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour12To15MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour15To18MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour18To21MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
dayData.hour21To24MaterialIds.reduce((acc, t) => acc + t.materialOutcome, 0),
sumTotal(dayData?.hour0To3Transactions),
sumTotal(dayData?.hour3To6Transactions),
sumTotal(dayData?.hour6To9Transactions),
sumTotal(dayData?.hour9To12Transactions),
sumTotal(dayData?.hour12To15Transactions),
sumTotal(dayData?.hour15To18Transactions),
sumTotal(dayData?.hour18To21Transactions),
sumTotal(dayData?.hour21To24Transactions),
];
}
else if (graphFilter == 'outcome') {
seriesData = [
sumOutcome(dayData?.hour0To3MaterialIds),
sumOutcome(dayData?.hour3To6MaterialIds),
sumOutcome(dayData?.hour6To9MaterialIds),
sumOutcome(dayData?.hour9To12MaterialIds),
sumOutcome(dayData?.hour12To15MaterialIds),
sumOutcome(dayData?.hour15To18MaterialIds),
sumOutcome(dayData?.hour18To21MaterialIds),
sumOutcome(dayData?.hour21To24MaterialIds),
];
}
return {
@@ -85,21 +94,21 @@ const DailyCharts = ({ incomeGraph, transactionGraph, materialGraph, colors, typ
0
);
const formatDate = (dateString) => {
const date = new Date(dateString); // Parse the date string
// Create an array of month names (use the same names you had earlier)
const monthNames = [
"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
];
// Get the month and day
const month = monthNames[date.getMonth()]; // Month is 0-indexed (January = 0)
const day = date.getDate(); // Get the day of the month
return { month, day }; // Return the result
};
const formatDate = (dateString) => {
const date = new Date(dateString); // Parse the date string
// Create an array of month names (use the same names you had earlier)
const monthNames = [
"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
];
// Get the month and day
const month = monthNames[date.getMonth()]; // Month is 0-indexed (January = 0)
const day = date.getDate(); // Get the day of the month
return { month, day }; // Return the result
};
return (
<div className={`${styles.chartItemContainer} ${selectedIndex !== -1 ? styles.expanded : ''}`}>
{chartData &&
@@ -119,22 +128,22 @@ const DailyCharts = ({ incomeGraph, transactionGraph, materialGraph, colors, typ
key={indexx}
className={`${styles.dateSelector} ${index === indexx ? styles.dateSelectorActive : styles.dateSelectorInactive
}`}
style={{position: 'relative' }}
style={{ position: 'relative' }}
onClick={() =>
type == 'yesterday' && selectedIndex == -1 || type != 'yesterday' && selectedIndex !== index ? setSelectedIndex(index) : setSelectedIndex(-1)
}
// style={{ backgroundColor: index === indexx ? colors[index % colors.length] : 'transparent' }}
// style={{ backgroundColor: index === indexx ? colors[index % colors.length] : 'transparent' }}
>
<div style={{position: 'absolute', bottom: 0, left: '10%', right: '10%', borderBottom: index == indexx ? `2px solid ${colors[index % colors.length]}` : 'none'}}></div>
<div
style={{ color: index === indexx ? 'black' : 'transparent' }}>
<div style={{ position: 'absolute', bottom: 0, left: '10%', right: '10%', borderBottom: index == indexx ? `2px solid ${colors[index % colors.length]}` : 'none' }}></div>
<div
style={{ color: index === indexx ? 'black' : 'transparent' }}>
{indexx !== chartData.length - 1 ? (
<>
{day}{" "}
{(indexx === 0 || (formatDate(chartData[indexx - 1].date).month !== month && type != 'weekly')) && month}
</>
) : (
'Kemarin'
'Hari ini'
)}
</div>

8
src/components/Header.js
View File

@@ -368,7 +368,7 @@ const Header = ({
{shopName}
</Child>
<Child>
Mode pengembangan &nbsp;
Mode Edit &nbsp;
<Switch
borderRadius={0}
checked={isEditMode}
@@ -377,7 +377,7 @@ const Header = ({
</Child>
<Child onClick={() => setModal("reports")}>Lihat laporan</Child>
<Child onClick={() => setModal("add_material")}>
Kelola bahan baku
Kelola stok
</Child>
<Child hasChildren>
@@ -423,7 +423,7 @@ const Header = ({
<Child>{shopName}</Child>
<Child>
Mode pengembangan&nbsp;
Mode Edit&nbsp;
<Switch
borderRadius={0}
checked={isEditMode}
@@ -431,7 +431,7 @@ const Header = ({
/>
</Child>
<Child onClick={() => setModal("add_material")}>
Kelola bahan baku
Kelola stok
</Child>
<Child hasChildren>

2
src/components/Item.js
View File

@@ -200,7 +200,7 @@ const Item = ({
lineHeight: '1rem',
justifyContent: 'center'
}}>
Promo {(((initialPrice - promoPrice) / initialPrice) * 100).toFixed(0)}%
Promo
</div>
<div style={{ display: 'flex' }}>

74
src/components/ItemConfig.js
View File

@@ -1,6 +1,7 @@
import React, { useState, useEffect, useRef } from "react";
import styles from "./Modal.module.css";
import { getImageUrl } from "../helpers/itemHelper.js";
import { ThreeDots } from "react-loader-spinner";
const ItemConfig = ({
name: initialName,
@@ -24,11 +25,14 @@ const ItemConfig = ({
const fileInputRef = useRef(null);
const textareaRef = useRef(null);
const [isSaving, setIsSaving] = useState(false);
useEffect(() => {
// Prevent scrolling when modal is open
document.body.style.overflow = "hidden";
if(selectedImage){
if (selectedImage) {
const reader = new FileReader();
reader.onloadend = () => {
setPreviewUrl(reader.result);
@@ -79,18 +83,27 @@ const ItemConfig = ({
return () => textarea.removeEventListener("input", handleResize);
}
}, [textareaRef.current]);
const handleCreate = async () => {
setIsSaving(true);
try {
await handleCreateItem(itemName, itemPrice, selectedImage, previewUrl, itemDescription, itemPromoPrice);
document.body.style.overflow = "auto";
} finally {
setIsSaving(false);
}
};
const handleCreate = () => {
console.log(itemPromoPrice)
handleCreateItem(itemName, itemPrice, selectedImage, previewUrl, itemDescription, itemPromoPrice);
document.body.style.overflow = "auto";
};
const handleUpdate = () => {
console.log(itemName, itemPrice, selectedImage, itemDescription, itemPromoPrice)
handleUpdateItem(itemName, itemPrice, selectedImage, itemDescription, itemPromoPrice);
document.body.style.overflow = "auto";
const handleUpdate = async () => {
setIsSaving(true);
try {
await handleUpdateItem(itemName, itemPrice, selectedImage, itemDescription, itemPromoPrice);
document.body.style.overflow = "auto";
} finally {
setIsSaving(false);
}
};
return (
<div onClick={handleOverlayClick} style={{ position: 'fixed', width: '100vw', height: '100vh', left: 0, bottom: 0, display: 'flex', flexDirection: 'column-reverse', zIndex: 301, backgroundColor: '#00000061' }}>
<div onClick={handleContentClick} style={{ display: 'flex', flexDirection: 'column', padding: '15px', backgroundColor: 'white', borderRadius: '20px 20px 0 0', overflowY: 'auto' }}>
@@ -131,7 +144,7 @@ const ItemConfig = ({
transition: 'all 0.3s ease',
boxSizing: 'border-box', // Make sure the padding doesn't cause overflow
}}
onChange={(e)=>setItemName(e.target.value)}
onChange={(e) => setItemName(e.target.value)}
onFocus={(e) => e.target.style.borderColor = '#60d37e'}
onBlur={(e) => e.target.style.borderColor = '#ccc'}
/>
@@ -153,7 +166,7 @@ const ItemConfig = ({
transition: 'all 0.3s ease',
boxSizing: 'border-box',
}}
onChange={(e)=>setItemPrice(e.target.value)}
onChange={(e) => setItemPrice(e.target.value)}
onFocus={(e) => e.target.style.borderColor = '#60d37e'}
onBlur={(e) => e.target.style.borderColor = '#ccc'}
/>
@@ -174,7 +187,7 @@ const ItemConfig = ({
transition: 'all 0.3s ease',
boxSizing: 'border-box',
}}
onChange={(e)=>setItemPromoPrice(e.target.value)}
onChange={(e) => setItemPromoPrice(e.target.value)}
onFocus={(e) => e.target.style.borderColor = '#60d37e'}
onBlur={(e) => e.target.style.borderColor = '#ccc'}
/>
@@ -200,17 +213,40 @@ const ItemConfig = ({
}}
placeholder="Tambah deskripsi..."
value={itemDescription}
onChange={(e)=>setItemDescription(e.target.value)}
onChange={(e) => setItemDescription(e.target.value)}
onFocus={(e) => e.target.style.borderColor = '#60d37e'}
onBlur={(e) => e.target.style.borderColor = '#ccc'}
/>
</div>
<div
onClick={() => {
if (!isSaving) {
isBeingEdit ? handleUpdate() : handleCreate();
}
}}
style={{
width: '100%',
height: '40px',
alignContent: 'center',
textAlign: 'center',
borderRadius: '10px',
border: '1px solid #60d37e',
color: isSaving ? '#aaa' : '#60d37e',
backgroundColor: 'white',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
cursor: isSaving ? 'not-allowed' : 'pointer'
}}
>
{isSaving ? (
<div style={{ width: '100%', height: '35px', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
<div onClick={() => {isBeingEdit ? handleUpdate() : handleCreate()} } style={{ width: '100%', height: '40px', alignContent: 'center', textAlign: 'center', borderRadius: '10px', border: '1px solid #60d37e', color: '#60d37e', backgroundColor: 'white', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
{isBeingEdit? 'Simpan' : 'Buat Item'}
</div>
<ThreeDots height={20} width={20} />
) : (
isBeingEdit ? 'Simpan' : 'Buat Item'
)}
</div>
</div>
</div>
);

10
src/components/ItemLister.js
View File

@@ -713,15 +713,6 @@ const ItemLister = ({
}
imageUrl={getImageUrl("uploads/assets/addnew.png")}
/>
{/* {typeImage != null && !previewUrl.includes(typeImage) && (
<ItemType
rectangular={true}
onClick={(previewUrl, selectedImage) =>
handleImageChange(previewUrl, selectedImage)
}
imageUrl={getImageUrl(typeImage)}
/>
)} */}
<ItemType
rectangular={true}
@@ -857,7 +848,6 @@ const ItemLister = ({
);
})}
</div>
<button onClick={() => setIsFirstStep(false)} style={{ width: '100%', height: '40px', borderRadius: '20px' }}>selanjutnya</button>
</>
)}
{(isEdit && !isFirstStep || !isEdit) &&

52
src/components/ItemLister.module.css
View File

@@ -24,60 +24,8 @@
/* padding: 10px; */
/* max-height: calc(3 * (25vw - 20px) + 20px); */
overflow-y: auto;
height: calc(49vw - 20px);
}
@media (min-height: 0px) {
.grid-container {
height: 27vh;
}
}
@media (min-height: 630px) {
.grid-container {
height: 27vh;
}
}
@media (min-height: 636px) {
.grid-container {
height: 29vh;
}
}
@media (min-height: 650px) {
.grid-container {
height: 34vh;
}
}
@media (min-height: 705px) {
.grid-container {
height: 37vh;
}
}
@media (min-height: 735px) {
.grid-container {
height: 38vh;
}
}
@media (min-height: 759px) {
.grid-container {
height: 40vh;
}
}
@media (min-height: 819px) {
.grid-container {
height: 44vh;
}
}
@media (min-height: 830px) {
.grid-container {
height: 47vh;
}
}
@media (min-height: 892px) {
.grid-container {
height: 49vh;
}
}
.title-container {
display: flex;

1
src/components/Modal.module.css
View File

@@ -36,3 +36,4 @@
.closeButton:hover {
color: #f44336; /* Change color on hover for better UX */
}

299
src/pages/CafePage.js
View File

@@ -19,6 +19,8 @@ import { MusicPlayer } from "../components/MusicPlayer";
import ItemLister from "../components/ItemLister";
import Header from "../components/Header";
import Switch from "react-switch";
import { ThreeDots } from "react-loader-spinner";
import { getLocalStorage, updateLocalStorage, removeLocalStorage } from "../helpers/localStorageHelpers";
@@ -152,7 +154,7 @@ function CafePage({
socket.on("joined-room", (response) => {
const { isSpotifyNeedLogin, isExceededDeadline } = response;
setNeedSpotifyLogin(isSpotifyNeedLogin);
if (isExceededDeadline) setModal("message",{captMessage:'Kafe sedang tidak tersedia'});
if (isExceededDeadline) setModal("message", { captMessage: 'Kafe sedang tidak tersedia' });
setIsExceededDeadline(isExceededDeadline);
});
}
@@ -222,133 +224,156 @@ function CafePage({
isFullscreen={true}
/>
) : ( */}
<div className={`Cafe ${isExceededDeadline ? 'grayscale' : ''}`}>
{API_BASE_URL != 'https://dev.api.kedaimaster.com' && API_BASE_URL != 'https://api.kedaimaster.com' &&
<div className="Watermark"></div>
}
<div className="App-header">
<Header
HeaderText={"Menu"}
showProfile={true}
setModal={setModal}
isLogout={handleLogout}
shopId={shopId}
shopName={shopName}
shopImage={config.image}
shopOwnerId={shopOwnerId}
shopClerks={shopClerks}
tableCode={table.tableCode}
user={user}
guestSides={guestSides}
guestSideOfClerk={guestSideOfClerk}
removeConnectedGuestSides={removeConnectedGuestSides}
setIsEditMode={(e) => setIsEditMode(e)}
isEditMode={isEditMode}
/>
<MusicPlayer
socket={socket}
shopId={shopId}
user={user}
shopOwnerId={shopOwnerId}
isSpotifyNeedLogin={isSpotifyNeedLogin}
queue={queue}
setModal={setModal}
/>
<div></div>
<ItemTypeLister
user={user}
shopOwnerId={shopOwnerId}
shopId={shopId}
itemTypes={shopItems}
setShopItems={setShopItems}
isEditMode={isEditMode}
onFilterChange={(e) => setFilterId(e)}
filterId={filterId}
beingEditedType={beingEditedType}
setBeingEditedType={setBeingEditedType}
/>
{/* <div style={{ marginTop: "15px" }}></div> */}
<div>
{shopItems
.filter(
(itemType) =>
filterId == 0 || itemType.itemTypeId === filterId
)
.map((itemType, index) => (
<ItemLister
index={index}
indexTotal={shopItems.length}
shopId={shopId}
shopOwnerId={shopOwnerId}
user={user}
key={itemType.itemTypeId}
itemTypeId={itemType.itemTypeId}
typeName={itemType.name}
typeImage={itemType.image}
setShopItems={setShopItems}
itemList={itemType.itemList}
typeVisibility={itemType.visibility}
moveItemTypeUp={(e) => moveItemTypeHandler(e, 'up', index)}
moveItemTypeDown={(e) => moveItemTypeHandler(e, 'down', index)}
isEditMode={isEditMode}
beingEditedType={beingEditedType}
setBeingEditedType={setBeingEditedType}
raw={isEditMode || filterId == 0 ? false : true}
handleCreateItem={(
itemTypeID,
name,
price,
selectedImage,
description,
promoPrice,
) =>
createItem(
shopId,
name,
price,
selectedImage,
itemTypeID,
description,
promoPrice,
)
<div className={`Cafe ${isExceededDeadline ? 'grayscale' : ''}`}>
{API_BASE_URL != 'https://dev.api.kedaimaster.com' && API_BASE_URL != 'https://api.kedaimaster.com' &&
<div className="Watermark"></div>
}
<div className="App-header">
<Header
HeaderText={"Menu"}
showProfile={true}
setModal={setModal}
isLogout={handleLogout}
shopId={shopId}
shopName={shopName}
shopImage={config.image}
shopOwnerId={shopOwnerId}
shopClerks={shopClerks}
tableCode={table.tableCode}
user={user}
guestSides={guestSides}
guestSideOfClerk={guestSideOfClerk}
removeConnectedGuestSides={removeConnectedGuestSides}
setIsEditMode={(e) => setIsEditMode(e)}
isEditMode={isEditMode}
/>
<MusicPlayer
socket={socket}
shopId={shopId}
user={user}
shopOwnerId={shopOwnerId}
isSpotifyNeedLogin={isSpotifyNeedLogin}
queue={queue}
setModal={setModal}
/>{
user.username !== undefined &&
(user.cafeId === shopId || user.user_id === shopOwnerId) &&
(user.roleId === 1 || user.roleId === 2) && (
<div style={{
backgroundColor: '#5c7c5c',
padding: '7px 28px',
margin: '0 10px',
borderRadius: '15px',
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
textShadow: '2px 2px 4px rgba(0, 0, 0, 0.7)',
fontSize: '16px'
}}>
Mode Edit&nbsp;
<Switch
borderRadius={0}
checked={isEditMode}
onChange={() => setIsEditMode(!isEditMode)}
/>
</div>
)
}
<ItemTypeLister
user={user}
shopOwnerId={shopOwnerId}
shopId={shopId}
itemTypes={shopItems}
setShopItems={setShopItems}
isEditMode={isEditMode}
onFilterChange={(e) => setFilterId(e)}
filterId={filterId}
beingEditedType={beingEditedType}
setBeingEditedType={setBeingEditedType}
/>
{/* <div style={{ marginTop: "15px" }}></div> */}
<div>
{shopItems
.filter(
(itemType) =>
filterId == 0 || itemType.itemTypeId === filterId
)
.map((itemType, index) => (
<ItemLister
index={index}
indexTotal={shopItems.length}
shopId={shopId}
shopOwnerId={shopOwnerId}
user={user}
key={itemType.itemTypeId}
itemTypeId={itemType.itemTypeId}
typeName={itemType.name}
typeImage={itemType.image}
setShopItems={setShopItems}
itemList={itemType.itemList}
typeVisibility={itemType.visibility}
moveItemTypeUp={(e) => moveItemTypeHandler(e, 'up', index)}
moveItemTypeDown={(e) => moveItemTypeHandler(e, 'down', index)}
isEditMode={isEditMode}
beingEditedType={beingEditedType}
setBeingEditedType={setBeingEditedType}
raw={isEditMode || filterId == 0 ? false : true}
handleCreateItem={(
itemTypeID,
name,
price,
selectedImage,
description,
promoPrice,
) =>
createItem(
shopId,
name,
price,
selectedImage,
itemTypeID,
description,
promoPrice,
)
}
handleUpdateItem={(itemId, name, price, selectedImage, description, promoPrice) =>
updateItem(itemId, name, price, selectedImage, description, promoPrice)
}
/>
))}
{!isEditMode && (user.username || cartItemsLength > 0) &&
<div style={{ marginTop: '10px', height: '40px', position: 'sticky', bottom: '40px', display: 'flex', justifyContent: 'center', alignItems: 'center', textAlign: 'center' }}>
{(lastTransaction != null || cartItemsLength > 0) &&
<div onClick={goToCart} style={{ backgroundColor: '#73a585', width: user.username ? '55vw' : '70vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'space-between', padding: '0 20px' }}>
<div style={{ display: 'flex', flexWrap: 'wrap', alignContent: 'center' }}>{lastTransaction != null && '+'}{cartItemsLength} item</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end', width: '130px' }}>
{((lastTransaction == null || lastTransaction?.payment_type != 'paylater')) ?
<span style={{ whiteSpace: 'nowrap' }}>Rp{totalPrice}</span>
:
<span style={{ whiteSpace: 'nowrap' }}>Open bill</span>
}
handleUpdateItem={(itemId, name, price, selectedImage, description, promoPrice) =>
updateItem(itemId, name, price, selectedImage, description, promoPrice)
}
/>
))}
{!isEditMode && (user.username || cartItemsLength > 0) &&
<div style={{ marginTop: '10px', height: '40px', position: 'sticky', bottom: '40px', display: 'flex', justifyContent: 'center', alignItems: 'center', textAlign: 'center' }}>
{(lastTransaction != null || cartItemsLength > 0) &&
<div onClick={goToCart} style={{ backgroundColor: '#73a585', width: user.username ? '55vw' : '70vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'space-between', padding: '0 20px' }}>
<div style={{ display: 'flex', flexWrap: 'wrap', alignContent: 'center' }}>{lastTransaction != null && '+'}{cartItemsLength} item</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end', width: '130px' }}>
{((lastTransaction == null || lastTransaction?.payment_type != 'paylater')) ?
<span style={{ whiteSpace: 'nowrap' }}>Rp{totalPrice}</span>
:
<span style={{ whiteSpace: 'nowrap' }}>Open bill</span>
}
<div style={{ display: 'flex', alignItems: 'center', marginLeft: '5px', width: '20px' }}>
<svg viewBox="0 0 34 34" style={{ fill: 'white', marginTop: '4px' }}>
<path d="M9.79175 24.75C8.09591 24.75 6.72383 26.1375 6.72383 27.8333C6.72383 29.5292 8.09591 30.9167 9.79175 30.9167C11.4876 30.9167 12.8751 29.5292 12.8751 27.8333C12.8751 26.1375 11.4876 24.75 9.79175 24.75ZM0.541748 0.0833435V3.16668H3.62508L9.17508 14.8679L7.09383 18.645C6.84717 19.0767 6.70842 19.5854 6.70842 20.125C6.70842 21.8208 8.09591 23.2083 9.79175 23.2083H28.2917V20.125H10.4392C10.2234 20.125 10.0538 19.9554 10.0538 19.7396L10.1001 19.5546L11.4876 17.0417H22.973C24.1292 17.0417 25.1467 16.4096 25.6709 15.4538L31.1901 5.44834C31.3134 5.23251 31.3751 4.97043 31.3751 4.70834C31.3751 3.86043 30.6813 3.16668 29.8334 3.16668H7.03217L5.583 0.0833435H0.541748ZM25.2084 24.75C23.5126 24.75 22.1405 26.1375 22.1405 27.8333C22.1405 29.5292 23.5126 30.9167 25.2084 30.9167C26.9042 30.9167 28.2917 29.5292 28.2917 27.8333C28.2917 26.1375 26.9042 24.75 25.2084 24.75Z"></path>
</svg>
</div>
</div>
<div style={{ display: 'flex', alignItems: 'center', marginLeft: '5px', width: '20px' }}>
<svg viewBox="0 0 34 34" style={{ fill: 'white', marginTop: '4px' }}>
<path d="M9.79175 24.75C8.09591 24.75 6.72383 26.1375 6.72383 27.8333C6.72383 29.5292 8.09591 30.9167 9.79175 30.9167C11.4876 30.9167 12.8751 29.5292 12.8751 27.8333C12.8751 26.1375 11.4876 24.75 9.79175 24.75ZM0.541748 0.0833435V3.16668H3.62508L9.17508 14.8679L7.09383 18.645C6.84717 19.0767 6.70842 19.5854 6.70842 20.125C6.70842 21.8208 8.09591 23.2083 9.79175 23.2083H28.2917V20.125H10.4392C10.2234 20.125 10.0538 19.9554 10.0538 19.7396L10.1001 19.5546L11.4876 17.0417H22.973C24.1292 17.0417 25.1467 16.4096 25.6709 15.4538L31.1901 5.44834C31.3134 5.23251 31.3751 4.97043 31.3751 4.70834C31.3751 3.86043 30.6813 3.16668 29.8334 3.16668H7.03217L5.583 0.0833435H0.541748ZM25.2084 24.75C23.5126 24.75 22.1405 26.1375 22.1405 27.8333C22.1405 29.5292 23.5126 30.9167 25.2084 30.9167C26.9042 30.9167 28.2917 29.5292 28.2917 27.8333C28.2917 26.1375 26.9042 24.75 25.2084 24.75Z"></path>
</svg>
</div>
}
{user.username &&
<div onClick={goToTransactions} style={{ backgroundColor: '#73a585', width: '15vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'center', marginLeft: lastTransaction != null || cartItemsLength > 0 ? '6px' : '0px' }}>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: '38px', marginRight: '5px' }}>
<div style={{ display: 'flex', alignItems: 'center', marginLeft: '5px', width: '20px' }}>
<svg viewBox="0 0 512 512">
<g
transform="translate(0 460) scale(0.09 -0.09)"
style={{ fill: 'white', marginTop: '4px' }}
stroke="none"
>
<path
d="M1639 5107 c-47 -13 -70 -28 -177 -109 -119 -90 -246 -102 -381 -34
</div>
</div>
}
{user.username &&
<div onClick={goToTransactions} style={{ backgroundColor: '#73a585', width: '15vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'center', marginLeft: lastTransaction != null || cartItemsLength > 0 ? '6px' : '0px' }}>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: '38px', marginRight: '5px' }}>
<div style={{ display: 'flex', alignItems: 'center', marginLeft: '5px', width: '20px' }}>
<svg viewBox="0 0 512 512">
<g
transform="translate(0 460) scale(0.09 -0.09)"
style={{ fill: 'white', marginTop: '4px' }}
stroke="none"
>
<path
d="M1639 5107 c-47 -13 -70 -28 -177 -109 -119 -90 -246 -102 -381 -34
-53 27 -83 36 -121 36 -88 0 -167 -57 -190 -138 -8 -26 -10 -620 -8 -1982 l3
-1945 24 -38 c13 -21 42 -50 64 -65 l41 -27 1535 -5 1536 -5 58 -22 c158 -60
291 -205 322 -352 10 -45 74 -108 119 -117 78 -14 154 25 182 93 12 27 14 398
@@ -364,24 +389,24 @@ function CafePage({
20 6 475 9 1183 8 l1150 -2 38 -24z m4 -903 c62 -41 88 -90 88 -168 0 -78 -26
-127 -88 -168 l-41 -27 -665 0 -666 0 -38 24 c-76 47 -111 140 -88 229 14 51
76 117 123 131 20 6 291 9 684 8 l650 -2 41 -27z"
/>
<path
d="M592 489 c-47 -14 -109 -79 -123 -131 -33 -122 37 -265 159 -325 l57
/>
<path
d="M592 489 c-47 -14 -109 -79 -123 -131 -33 -122 37 -265 159 -325 l57
-28 1815 -2 c1736 -2 1813 -2 1765 15 -125 43 -186 126 -205 279 -12 89
-39 138 -97 174 l-38 24 -1650 2 c-1023 1 -1662 -2 -1683 -8z"
/>
</g>
</svg>
</div>
</div>
/>
</g>
</svg>
</div>
}
</div>
</div>
}
</div>
</div>
<Watermark/>
}
</div>
</div>
<Watermark />
</div>
{/* )} */}
</>
);

2
src/pages/CreateClerk.js
View File

@@ -28,7 +28,7 @@ const CreateClerk = ({ shopId }) => {
try {
const create = await createClerks(shopId || cafeIdParam, username, password);
if (create) setMessage('Clerk created successfully');
if (create) {setMessage('Clerk created successfully');}
else setMessage('Failed to create clerk');
} catch (error) {
setMessage('Error creating clerk');

2
src/pages/Dashboard.js
View File

@@ -100,7 +100,7 @@ const LinktreePage = ({ user, setModal }) => {
const modal = "product";
const productId = 1;
const authorizedUri = "http://localhost:3000?token=";
const authorizedUri = "https://kedaimaster.com?token=";
const unauthorizedUri = `${baseUrl}?modal=${modal}&product_id=${productId}`;
const url =

2
src/pages/MaterialList.js
View File

@@ -231,7 +231,7 @@ const SetPaymentQr = ({ cafeId }) => {
<></>
) : (
<>
<h3 className={styles.title}>Bahan baku</h3>
<h3 className={styles.title}>Stok</h3>
<Carousel items={materials} onSelect={(e) => setSelectedMaterialIndex(e)} selectedIndex={selectedMaterialIndex} />
{selectedMaterialIndex !== -1 ? (
<>

12
src/pages/Reports.js
View File

@@ -323,8 +323,6 @@ const App = ({ forCafe = true, cafeId = -1,
} else if (otherCafes.length === 1) {
updatedFullTexts = [
[otherCafes[0].cafeIdentifyName || otherCafes[0].username, otherCafes[0].cafeId || otherCafes[0].user_id],
...(user.roleId == 1 ? [[-1]] : [])
];
setSelectedCafeId(otherCafes[0].cafeId); // Get the cafeId (second part of the pair)
@@ -507,7 +505,7 @@ const App = ({ forCafe = true, cafeId = -1,
marginTop: '30px'
}}>
<MultiSwitch
texts={["Kemarin", "Minggu ini", "Bulan ini", "Tahun ini"]}
texts={["Hari ini", "Minggu ini", "Bulan ini", "Tahun ini"]}
selectedSwitch={["yesterday", "weekly", "monthly", "yearly"].indexOf(
filter
)}
@@ -611,9 +609,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 }}>
{(filter == 'yesterday' || filter == 'weekly') ?
{(filter == 'weekly') ?
`Data dihitung dengan membandingkan
${comparisonText} hari terakhir dengan ${comparisonText} hari sebelumnya, dengan penghitungan dimulai dari data kemarin.`
7 hari terakhir dengan 7 hari sebelumnya, dengan penghitungan dimulai dari data kemarin.`
:
(filter == 'yesterday') ? `Data dihitung dengan membandingkan antara hari ini dan kemarin.`
:
(filter == 'monthly') ? `Data dihitung dengan membandingkan antara awal hingga akhir bulan ini dan bulan lalu, dengan penghitungan berakhir pada data kemarin.` : `Data dihitung dengan membandingkan antara awal hingga akhir tahun ini dan tahun lalu, dengan penghitungan berakhir pada data kemarin.`}
</h6>
@@ -628,7 +628,7 @@ const App = ({ forCafe = true, cafeId = -1,
}
style={{ color: 'black', position: 'relative' }}
>
<div>Item laku</div>
<div>Penjualan</div>
</div>
<div
className={`${styles.filterSelector} ${circularFilter == 'material' ? '' : styles.filterSelectorInactive}