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

ok

Browse Source
This commit is contained in:
zadit
2025-02-15 12:21:47 +07:00
parent a7f350464c
commit 422398c65e
9 changed files with 241 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Item.js
View File

@@ -90,7 +90,7 @@ const Item = ({
};
return (
<div className={`${!last ? styles.notLast : ""}`}>
<div className={`${!last && !forInvoice ? styles.notLast : ""}`}>
<div className={`${styles.item} ${forInvoice ? styles.itemInvoice : ""} `}>
{!forInvoice && (
// <div className={styles.imageContainer}>
@@ -143,13 +143,14 @@ const Item = ({
/> */}
<h3 style={{
textTransform: 'capitalize',
margin: '5px 0px 10px 10px',
margin: `${forInvoice ? '13px 0px 10px 10px' : '5px 0px 10px 10px'}`,
fontSize: '16px',
display: '-webkit-box',
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
WebkitLineClamp: 2,
textOverflow: 'ellipsis'
textOverflow: 'ellipsis',
width: `${forInvoice? '160px' : 'unset'}`
}}>
{itemName}
</h3>

8
src/components/Item.module.css
View File

@@ -52,6 +52,7 @@
position: relative;
width: 26vw;
height: 26vw;
border-radius: 12px;
}
.overlay {
@@ -208,9 +209,12 @@
}
.plusNegative2 {
width: 100px;
height: 35px;
width: 84px;
height: 21px;
position: absolute;
transform: rotate(45deg);
left: -33px;
top: 21px;
}
.remove {
width: 25px;

2
src/components/MusicPlayer.css
View File

@@ -25,7 +25,7 @@
/* filter: blur(1.5px);
-webkit-filter: blur(1.5px); */
/* border-radius: 13px 13px 0 0; */
background-color: #6ec35a;
background-color: rgb(95 121 89);
/* Rounded corners at the top */
text-align: right;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);

129
src/components/TablesPage.js
View File

@@ -609,64 +609,59 @@ const SetPaymentQr = ({ shop }) => {
{!isconfigcafeidentityname ? <div
onClick={() => { setIsConfigCafeIdentityName(true); cafeIdentifyNameRef.current && cafeIdentifyNameRef.current.focus() }} // Open the config modal
style={{
backgroundColor: '#303034',
right: 0,
color: 'white',
borderRadius: '0 0 6px 6px',
fontFamily: 'Roboto',
fontSize: '13px',
padding: 3,
cursor: 'pointer',
marginBottom: '10px'
}}
>
Ganti alamat kedai
</div> : (
<div style={{
display: 'flex', justifyContent: 'space-between', width: '100%',
marginBottom: '10px'
}}>
<div
onClick={() => setIsConfigCafeIdentityName(false)} // Close the config modal
style={{
backgroundColor: '#303034',
width: '47%',
color: 'white',
borderRadius: '0 0 0px 6px',
fontFamily: 'Roboto',
fontSize: '13px',
padding: 3,
cursor: 'pointer',
}}
>
Batalkan
{!isconfigcafeidentityname ?
<>
<div style={styles.uploadMessage}>
<p>Klik untuk ganti alamat</p>
</div>
<div
onClick={() => {
setCafeIdentifyNameDefault(cafeIdentifyNameUpdate)
// Handle save functionality here
setIsConfigCafeIdentityName(false); // Close after saving
}}
style={{
backgroundColor: '#303034',
width: '47%',
color: 'white',
borderRadius: '0 0 6px 0px',
fontFamily: 'Roboto',
fontSize: '13px',
padding: 3,
cursor: 'pointer',
}}
>
Simpan
<div style={styles.resultMessage}>
<p onClick={() => { setIsConfigCafeIdentityName(true); cafeIdentifyNameRef.current && cafeIdentifyNameRef.current.focus() }}>-----------------</p>
<div
onClick={() => {setIsConfigCafeIdentityName(true); cafeIdentifyNameRef.current && cafeIdentifyNameRef.current.focus()}} style={styles.changeButton}>Ganti</div>
</div>
</div>
)}
</> : (
<div style={{
display: 'flex', justifyContent: 'space-between', width: '100%',
marginBottom: '10px'
}}>
<div
onClick={() => setIsConfigCafeIdentityName(false)} // Close the config modal
style={{
backgroundColor: '#303034',
width: '47%',
color: 'white',
borderRadius: '0 0 0px 6px',
fontFamily: 'Roboto',
fontSize: '13px',
padding: 3,
cursor: 'pointer',
}}
>
Batalkan
</div>
<div
onClick={() => {
setCafeIdentifyNameDefault(cafeIdentifyNameUpdate)
// Handle save functionality here
setIsConfigCafeIdentityName(false); // Close after saving
}}
style={{
backgroundColor: '#303034',
width: '47%',
color: 'white',
borderRadius: '0 0 6px 0px',
fontFamily: 'Roboto',
fontSize: '13px',
padding: 3,
cursor: 'pointer',
}}
>
Simpan
</div>
</div>
)}
<div
id="qr-code-container"
style={{
@@ -979,12 +974,12 @@ const styles = {
},
changeButton: {
paddingRight: '10px',
backgroundColor: 'green',
backgroundColor: 'rgb(40, 167, 69)',
borderRadius: '30px',
color: 'white',
fontWeight: 700,
height: '36px',
lineHeight: '36px',
height: '31px',
lineHeight: '32px',
paddingLeft: '10px',
paddingHeight: '10px',
},
@@ -1022,14 +1017,14 @@ const styles = {
justifyContent: 'space-evenly'
},
saveButton: {
padding: "10px 15px",
fontSize: "16px",
backgroundColor: "#28a745",
color: "#fff",
border: "none",
borderRadius: "30px",
cursor: "pointer",
transition: "background-color 0.3s",
padding: '6px 15px',
fontSize: '13px',
backgroundColor: 'rgb(40, 167, 69)',
color: 'rgb(255, 255, 255)',
border: ' none',
borderRadius: '30px',
cursor: 'pointer',
transition: 'background-color 0.3s',
},
switchContainer: {
textAlign: "left",

72
src/pages/CafePage.js
View File

@@ -47,9 +47,6 @@ function CafePage({
}) {
const {
goToCart
} = useNavigationHelpers(shopId, table.tableCode);
const location = useLocation();
const [searchParams] = useSearchParams();
@@ -57,6 +54,11 @@ function CafePage({
const { shopIdentifier, tableCode } = useParams();
sendParam({ shopIdentifier, tableCode });
const {
goToCart,
goToTransactions
} = useNavigationHelpers(shopIdentifier, table.tableCode);
const navigate = useNavigate();
const [screenMessage, setScreenMessage] = useState("");
@@ -292,22 +294,60 @@ function CafePage({
}
/>
))}
{ }
{cartItemsLength > 0 &&
{(user.username || cartItemsLength > 0) &&
<div style={{ marginTop: '10px', height: '40px', position: 'sticky', bottom: '40px', display: 'flex', justifyContent: 'center', alignItems: 'center', textAlign: 'center' }}>
<div onClick={goToCart} style={{ backgroundColor: '#6ec35a', width: '70vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'space-between', padding: '0 20px' }}>
<div style={{ display: 'flex', flexWrap: 'wrap', alignContent: 'center' }}>{cartItemsLength} item</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end', width: '130px' }}>
<span style={{ whiteSpace: 'nowrap' }}>Rp{totalPrice}</span>
<div style={{ display: 'flex', alignItems: 'center', marginLeft: '5px', width: '30px' }}>
<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>
{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' }}>{cartItemsLength} item</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end', width: '130px' }}>
<span style={{ whiteSpace: 'nowrap' }}>Rp{totalPrice}</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>
</div>
}
{user.username &&
<div onClick={goToTransactions} style={{ backgroundColor: '#73a585', width: '15vw', height: '40px', borderRadius: '30px', display: 'flex', justifyContent: 'center', marginLeft: 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
14 2238 0 2400 4 2243 -53 2303 -67 72 -160 81 -268 26 -52 -26 -89 -37 -138
-41 -99 -8 -161 13 -268 93 -119 89 -140 97 -248 98 -108 0 -129 -8 -249 -98
-107 -80 -168 -101 -267 -93 -79 7 -121 26 -231 108 -165 122 -309 119 -471
-9 -87 -69 -138 -92 -216 -99 -99 -8 -161 13 -268 93 -48 36 -104 73 -123 81
-49 20 -165 26 -221 10z m2274 -1226 c21 -13 50 -42 65 -64 22 -34 27 -52 27
-106 0 -79 -25 -128 -88 -169 l-41 -27 -1165 0 -1166 0 -38 24 c-76 47 -111
140 -88 229 14 52 76 117 123 131 20 6 475 9 1183 8 l1150 -2 38 -24z m0 -900
c21 -13 50 -42 65 -64 22 -34 27 -52 27 -106 0 -79 -25 -128 -88 -169 l-41
-27 -1165 0 -1166 0 -38 24 c-76 47 -111 140 -88 229 14 52 76 117 123 131
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
-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>
</div>
}
</div>
}
</div>

196
src/pages/Cart.js
View File

@@ -13,10 +13,19 @@ import {
import { getItemsByCafeId } from "../helpers/cartHelpers.js";
import { useNavigationHelpers } from "../helpers/navigationHelpers";
export default function Invoice({ shopId, table, sendParam, deviceType, socket }) {
const { shopIdentifier, tableCode } = useParams();
sendParam({ shopIdentifier, tableCode });
const {
goToShop
} = useNavigationHelpers(shopIdentifier, table.tableCode);
const [cartItems, setCartItems] = useState([]);
const [totalPrice, setTotalPrice] = useState(0);
const [isPaymentLoading, setIsPaymentLoading] = useState(false); // State for payment button loading animation
@@ -144,7 +153,7 @@ export default function Invoice({ shopId, table, sendParam, deviceType, socket }
console.log(localStorage.getItem('cart'))
console.log(cartItems)
if(localStorage.getItem('cart') == "[]") return;
if (localStorage.getItem('cart') == "[]") return;
// Parse the local storage cart
const localStorageCart = JSON.parse(localStorage.getItem('cart'));
@@ -154,8 +163,8 @@ export default function Invoice({ shopId, table, sendParam, deviceType, socket }
// Filter out items from cartItems that do not exist in the local storage cart
const updatedCartItems = cartItems.map(itemType => ({
...itemType,
itemList: itemType.itemList.filter(item => localStorageItemIds.has(item.itemId))
...itemType,
itemList: itemType.itemList.filter(item => localStorageItemIds.has(item.itemId))
}));
setCartItems(updatedCartItems);
@@ -189,39 +198,39 @@ export default function Invoice({ shopId, table, sendParam, deviceType, socket }
setEmail(event.target.value);
};
return (
<div className={styles.Invoice} style={{height: (getItemsByCafeId(shopId).length > 0 ? '': '100vh'), minHeight: (getItemsByCafeId(shopId).length > 0 ? 'calc(100vh - 210px)': '') }}>
<div style={{ marginTop: "50px" }}></div>
<h2 className={styles["Invoice-title"]}>Keranjang</h2>
{getItemsByCafeId(shopId) < 1 ?
<div style={{height: '75vh', display:'flex', justifyContent: 'center', flexDirection: 'column', alignContent: 'center', alignItems: 'center'}}>
<div style={{width: '50%'}}>
<svg
viewBox="0 0 32 32"
style={{ fill: "#8F8787" }}
>
<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" />
</svg>
</div>
<h1 style={{fontSize: '120%', color :'#8F8787' }}>Tidak ada item di keranjang</h1>
</div>
:
<>
<div className={styles.RoundedRectangle}>
{cartItems.map((itemType) => (
<ItemLister
shopId={shopId}
forInvoice={true}
key={itemType.id}
typeName={itemType.typeName}
itemList={itemType.itemList}
/>
))}
<div className={styles.Invoice} style={{ height: (getItemsByCafeId(shopId).length > 0 ? '' : '100vh'), minHeight: (getItemsByCafeId(shopId).length > 0 ? '100vh' : '') }}>
{table.tableNo != null && (
<div className={styles.OrderTypeContainer}>
<span htmlFor="orderType">Diantar ke {table.tableNo}</span>
{/* <select
<div onClick={goToShop} style={{ marginLeft: '22px', marginTop: '49px', marginRight: '10px', display: 'flex', flexWrap: 'nowrap', alignItems: 'center', fontSize: '25px' }} ><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>Keranjang</div>
{getItemsByCafeId(shopId) < 1 ?
<div style={{ height: '75vh', display: 'flex', justifyContent: 'center', flexDirection: 'column', alignContent: 'center', alignItems: 'center' }}>
<div style={{ width: '50%' }}>
<svg
viewBox="0 0 32 32"
style={{ fill: "#8F8787" }}
>
<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" />
</svg>
</div>
<h1 style={{ fontSize: '120%', color: '#8F8787' }}>Tidak ada item di keranjang</h1>
</div>
:
<>
<div className={styles.RoundedRectangle}>
{cartItems.map((itemType) => (
<ItemLister
shopId={shopId}
forInvoice={true}
key={itemType.id}
typeName={itemType.typeName}
itemList={itemType.itemList}
/>
))}
{table.tableNo != null && (
<div className={styles.OrderTypeContainer}>
<span htmlFor="orderType">Diantar ke {table.tableNo}</span>
{/* <select
id="orderType"
value={orderType}
onChange={handleOrderTypeChange}
@@ -232,66 +241,67 @@ export default function Invoice({ shopId, table, sendParam, deviceType, socket }
<option value="pickup">Pickup</option>
{table == null && <option value="serve">Serve</option>}
</select> */}
</div>
)}
{orderType === "serve" && table.length < 1 && (
<div className={styles.OrderTypeContainer}>
<span htmlFor="orderType">Serve to:</span>
<input
type="text"
placeholder="Table Number"
value={tableNumber}
onChange={handleTableNumberChange}
className={styles.TableNumberInput}
/>
</div>
)}
<div className={styles.NoteContainer}>
<span>Catatan :</span>
<span></span>
</div>
<div className={styles.NoteContainer}>
<textarea
ref={textareaRef}
className={styles.NoteInput}
placeholder="Tambahkan catatan..."
/>
</div>
</div>
<div className={styles.PaymentOption}>
<div className={styles.TotalContainer}>
<span>Pembayaran</span>
<span>
<select
style={{borderRadius: '6px', fontSize: '20px'}}
id="orderMethod"
value={orderMethod}
onChange={handleOrderMethodChange}
>
<option value="cash">&nbsp;Tunai</option>
<option value="cashless">&nbsp;Non Tunai&nbsp;</option>
</select>
</span>
</div>
<div style={{display: 'flex', paddingLeft: '25px', paddingRight: '25px'}}>
<button className={styles.PayButton} onClick={() => handlePay(orderMethod == 'cash' ? true : false)}>
{isPaymentLoading ? (
<ColorRing height="50" width="50" color="white" />
) : (
<div>
<span>Pesan</span>
<span>Rp{totalPrice}</span>
</div>
)}
</button>
</div>
</div>
<div className={styles.PaymentOptionMargin}></div>
</>
}
{orderType === "serve" && table.length < 1 && (
<div className={styles.OrderTypeContainer}>
<span htmlFor="orderType">Serve to:</span>
<input
type="text"
placeholder="Table Number"
value={tableNumber}
onChange={handleTableNumberChange}
className={styles.TableNumberInput}
/>
</div>
)}
<div className={styles.NoteContainer}>
<span>Catatan :</span>
<span></span>
</div>
<div className={styles.NoteContainer}>
<textarea
ref={textareaRef}
className={styles.NoteInput}
placeholder="Tambahkan catatan..."
/>
</div>
</div>
<div className={styles.PaymentOption}>
<div className={styles.TotalContainer}>
<span>Pembayaran</span>
<span>
<select
style={{ borderRadius: '6px', fontSize: '20px' }}
id="orderMethod"
value={orderMethod}
onChange={handleOrderMethodChange}
>
<option value="cash">&nbsp;Tunai</option>
<option value="cashless">&nbsp;Non Tunai&nbsp;</option>
</select>
</span>
</div>
<div style={{ display: 'flex', paddingLeft: '25px', paddingRight: '25px' }}>
<button className={styles.PayButton} onClick={() => handlePay(orderMethod == 'cash' ? true : false)}>
{isPaymentLoading ? (
<ColorRing height="50" width="50" color="white" />
) : (
<div>
<span>Pesan</span>
<span>Rp{totalPrice}</span>
</div>
)}
</button>
</div>
<div onClick={goToShop} style={{ textAlign: 'center', marginBottom: '20px' }}>Kembali</div>
</div>
<div className={styles.PaymentOptionMargin}></div>
</>
}
</div>
);
}

6
src/pages/Invoice.module.css
View File

@@ -42,7 +42,7 @@
border-radius: 15px 15px 0 0;
position: fixed;
bottom: 75px;
bottom: 0;
right: 0;
left: 0;
}
@@ -58,7 +58,7 @@
color: rgba(88, 55, 50, 1);
position: relative;
height: 180px;
height: 220px;
}
.TotalContainer {
@@ -173,7 +173,7 @@
border-radius: 20px;
margin: 0 auto;
padding: 10px;
font-size: 1.2em;
font-size: 15px;
border: 1px solid rgba(88, 55, 50, 0.5);
resize: none; /* Prevent resizing */
overflow-wrap: break-word; /* Ensure text wraps */

5
src/pages/MaterialList.module.css
View File

@@ -51,6 +51,11 @@
justify-content: space-between;
}
.resultMessage input {
padding-left: 8px;
width: 180px;
}
.stokContainer {
display: flex;
justify-content: space-evenly;

2
src/pages/Reports.js
View File

@@ -472,7 +472,7 @@ const App = ({ forCafe = true, cafeId = -1,
}}
>
<div style={{ display: 'flex', alignItems: 'center', padding: forCafe ? '0px 20px' : '0px 15px', justifyContent: forCafe ? 'flex-start' : 'space-between' }}>
{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>}
{forCafe && <div style={{ marginTop: '49px', marginRight: '10px', display: 'flex', flexWrap: 'nowrap', alignItems: 'center', fontSize: '25px' }} 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>Laporan</div>}
<div style={{ marginTop: '10px' }}>
{!forCafe &&
<div className={styles.dateSelectorWrapper} style={{ fontSize: '12px' }}>