This commit is contained in:
zadit
2024-11-01 11:33:26 +07:00
parent 5a2b9b2f86
commit 32e8ebd69b
20 changed files with 812 additions and 509 deletions

View File

@@ -63,14 +63,14 @@ export default function Footer({
</div>
{/* Search Icon */}
<div onClick={goToSearch} className={styles["footer-icon"]}>
{/* <div onClick={goToSearch} className={styles["footer-icon"]}>
<svg
viewBox="0 0 34 34"
style={{ fill: selectedPage === 1 ? "black" : "#8F8787" }}
>
<path d="M20.8333 18.3333H19.5167L19.05 17.8833C20.6833 15.9833 21.6667 13.5167 21.6667 10.8333C21.6667 4.85 16.8167 0 10.8333 0C4.85 0 0 4.85 0 10.8333C0 16.8167 4.85 21.6667 10.8333 21.6667C13.5167 21.6667 15.9833 20.6833 17.8833 19.05L18.3333 19.5167V20.8333L26.6667 29.15L29.15 26.6667L20.8333 18.3333ZM10.8333 18.3333C6.68333 18.3333 3.33333 14.9833 3.33333 10.8333C3.33333 6.68333 6.68333 3.33333 10.8333 3.33333C14.9833 3.33333 18.3333 6.68333 18.3333 10.8333C18.3333 14.9833 14.9833 18.3333 10.8333 18.3333Z" />
</svg>
</div>
</div> */}
{/* Cart Icon */}
<div onClick={goToCart} className={styles["footer-icon"]}>

View File

@@ -330,11 +330,11 @@ const Header = ({
)}
{user.username !== undefined && (
<Child onClick={() => setModal("edit_account")}>
Edit profile
Ubah profil
</Child>
)}
{shopId && user.roleId == 1 && (
<Child onClick={goToAdminCafes}>see your {user.userId == shopOwnerId ? 'other' : ''} cafes</Child>)}
<Child onClick={goToAdminCafes}>Dashboard</Child>)}
{shopId &&
user.userId == shopOwnerId &&
user.username !== undefined &&
@@ -349,7 +349,7 @@ const Header = ({
<div class="toggle-switch">
<label class="toggle-switch-label" for="toggleSwitch">
Edit Mode
Mode edit
</label>
<Switch
checked={isEditMode}
@@ -358,18 +358,18 @@ const Header = ({
</div>
<Child onClick={() => setModal("welcome_config")}>
welcoming page
Halaman sambutan
</Child>
<Child onClick={() => setModal("add_material")}>
stock
Stok
</Child>
<Child onClick={() => setModal("edit_tables")}>
table maps
Denah meja
</Child>
<Child hasChildren>
clerks
Kasir
<Child onClick={() => setModal("create_clerk")}>
+ Add clerk
+ Tambah
</Child>
{shopClerks &&
shopClerks.map((key, index) => (
@@ -388,10 +388,10 @@ const Header = ({
))}
</Child>
<Child onClick={() => setModal("payment_option")}>
payment options
Opsi pembayaran
</Child>
<Child onClick={() => setModal("reports")}>reports</Child>
<Child onClick={() => setModal("reports")}>Laporan</Child>
</Child>
</>
)}
@@ -403,7 +403,7 @@ const Header = ({
<div class="toggle-switch">
<label class="toggle-switch-label" for="toggleSwitch">
Edit Mode
Mode edit
</label>
<Switch
checked={isEditMode}
@@ -411,15 +411,15 @@ const Header = ({
/>
</div>
<Child onClick={() => setModal("add_material")}>
stock
stok
</Child>
{user.username !== undefined &&
user.roleId == 2 &&
user.cafeId == shopId && (
<Child hasChildren>
connected guest sides
Tablet tamu
<Child onClick={goToGuestSideLogin}>
+ Add guest side
+ Tambah
</Child>
{guestSides &&
guestSides.map((key, index) => (
@@ -439,7 +439,7 @@ const Header = ({
</Child>
)}
<Child onClick={() => setModal("reports")}>reports</Child>
<Child onClick={() => setModal("reports")}>Laporan</Child>
</Child>
)}
{user.username !== undefined && (

View File

@@ -87,7 +87,7 @@ const Item = ({
const handleNameChange = (event) => {
setItemName(event.target.value);
};
return (
<div className={`${styles.item} ${forInvoice ? styles.itemInvoice : ""}`}>
{!forInvoice && (

View File

@@ -35,8 +35,8 @@
}
.itemImage {
width: 139px;
height: 149px;
width: 119px;
height: 129px;
border-radius: 10px;
margin-right: 10px;
object-fit: cover;
@@ -45,8 +45,8 @@
.imageContainer {
position: relative;
width: 139px;
height: 149px;
width: 119px;
height: 129px;
}
.overlay {
@@ -124,7 +124,7 @@
font-weight: 600;
width: calc(100% - 15px); /* Adjust the width to prevent overflow */
font-size: 0.9rem;
margin-bottom: 35px;
/* margin-bottom: 35px; */
margin-left: 5px;
color: #d9c61c;
background-color: transparent;
@@ -143,19 +143,19 @@
.itemQty {
display: flex;
align-items: end;
align-items: center;
font-size: 0.9rem;
margin-left: 5px;
color: rgb(115, 165, 133);
fill: rgb(115, 165, 133);
height: 40px;
}
.itemQtyValue {
margin-bottom: 8px;
font-family: "Poppins", sans-serif;
font-style: normal;
font-weight: 600;
margin-top: 5px;
margin-top: 19px;
margin-left: 5px;
margin-right: 5px;
width: 25px;
@@ -197,7 +197,7 @@
.plusNegative {
width: 35px;
height: 35px;
margin-top: -10px;
margin: 2.5px 0 -0.5px 0px;
}
.remove {

File diff suppressed because it is too large Load Diff

View File

@@ -35,15 +35,15 @@
.title {
background-color: transparent;
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 28px;
color: rgba(88, 55, 50, 1);
text-align: left;
width: calc(70% - 10px);
padding-left: 10px;
text-transform: capitalize;
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 22px;
color: rgba(88, 55, 50, 1);
text-align: left;
width: calc(70% - 10px);
padding-left: 10px;
text-transform: capitalize;
}
.edit-typeItem-button {

View File

@@ -5,16 +5,21 @@ export default function ItemType({
onClick,
onCreate,
blank,
name: initialName = "",
name,
imageUrl,
selected,
rectangular,
}) {
const inputRef = useRef(null);
const [name, setName] = useState(initialName);
const [namee, setName] = useState(name);
const [selectedImage, setSelectedImage] = useState(null);
const [previewUrl, setPreviewUrl] = useState(imageUrl);
// Effect to update local state when name prop changes
useEffect(() => {
setName(name);
}, [name]);
useEffect(() => {
if (blank && inputRef.current) {
inputRef.current.focus();
@@ -26,12 +31,10 @@ export default function ItemType({
const reader = new FileReader();
reader.onloadend = () => {
onClick(reader.result, selectedImage);
// setPreviewUrl(reader.result);
};
reader.readAsDataURL(selectedImage);
} else {
setPreviewUrl(imageUrl);
// onClick(getImageUrl(imageUrl));
}
}, [selectedImage, imageUrl]);
@@ -51,14 +54,14 @@ export default function ItemType({
return;
}
onCreate(name, selectedImage);
onCreate(namee, selectedImage);
};
return (
<div
className={
styles[
name
namee
? "item-type"
: rectangular
? "item-type-rectangular"
@@ -78,10 +81,10 @@ export default function ItemType({
>
<img
src={previewUrl}
alt={name}
alt={namee}
className={styles["item-type-image"]}
/>
{blank && (
{blank && rectangular && (
<div className={styles["item-type-image-container"]}>
<input
type="file"
@@ -97,7 +100,7 @@ export default function ItemType({
<input
ref={inputRef}
className={`${styles["item-type-name"]} ${styles.noborder}`}
value={name}
value={namee}
onChange={handleNameChange}
disabled={true}
style={{
@@ -106,11 +109,6 @@ export default function ItemType({
}}
/>
)}
{/* {blank && (
<button className={styles["item-type-create"]} onClick={handleCreate}>
create
</button>
)} */}
</div>
);
}

View File

@@ -1,14 +1,14 @@
.item-type {
width: calc(25vw - 20px);
height: calc(39vw - 20px);
margin: 1px 10px -5px;
height: calc(30vw - 20px);
margin: 1px 10px 0px;
overflow: visible;
text-align: center;
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative; /* Ensure absolute positioning inside works */
position: relative;
}
.item-type-rectangular {
width: calc(25vw - 20px);
@@ -34,8 +34,8 @@
}
.item-type-rect {
position: relative;
height: 20vw;
width: 20vw;
height: 13vw;
width: 13vw;
object-fit: cover;
border-radius: 15px;
background-color: #fff;
@@ -46,7 +46,6 @@
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;
margin-bottom: 10px; /* Adjust margin for spacing */
font-size: 14px;
color: #333;
width: calc(25vw - 30px);

View File

@@ -3,6 +3,7 @@
overflow-x: auto;
white-space: nowrap;
padding: 3px 0px;
margin-bottom: -5px;
}
.item-type-list {

View File

@@ -9,6 +9,7 @@ const ItemTypeLister = ({
shopId,
shopOwnerId,
user,
setShopItems,
itemTypes,
onFilterChange,
filterId,
@@ -102,7 +103,7 @@ const ItemTypeLister = ({
user.userId == shopOwnerId || user.cafeId == shopId) && (
<ItemType
onClick={toggleAddNewItem}
name={"create"}
name={"buat baru"}
imageUrl={getImageUrl("uploads/addnew.png")}
/>
)}
@@ -115,6 +116,7 @@ const ItemTypeLister = ({
shopOwnerId={shopOwnerId}
user={user}
typeName={""}
setShopItems={setShopItems}
itemList={items}
isEditMode={true}
handleCreateItem={(itemTypeId, name, price, selectedImage) => createItem(shopId, name, price, selectedImage,itemTypeId)}
@@ -127,9 +129,9 @@ const ItemTypeLister = ({
)}
{itemTypes && itemTypes.length > 0 && (
<ItemType
name={"All"}
name={"semua"}
onClick={() => onFilterChange(0)}
imageUrl={getImageUrl("uploads/1718732420960.png")}
imageUrl={getImageUrl("uploads/assets/All.png")}
/>
)}
{itemTypes &&

View File

@@ -106,7 +106,7 @@ const SetPaymentQr = ({ shopId }) => {
return (
<div style={styles.container}>
<h2 style={styles.title}>Payment QRIS</h2>
<h2 style={styles.title}>QR pembayaran</h2>
<div
id="qr-code-container"
ref={qrCodeContainerRef}
@@ -133,7 +133,7 @@ const SetPaymentQr = ({ shopId }) => {
/>
</div>
<div style={styles.resultMessage}>
{qrCodeDetected ? <p>QR Code Detected</p> : <p>No QR Code Detected</p>}
{qrCodeDetected ? <p>QR Code Detected</p> : <p>Tidak ada qr yang terdeteksi</p>}
</div>
<div style={styles.buttonContainer}>
<button onClick={handleSave} style={styles.saveButton}>
@@ -141,9 +141,9 @@ const SetPaymentQr = ({ shopId }) => {
</button>
</div>
<div style={styles.switchContainer}>
<h1>Double Check tem Availability</h1>
<h1>Pengecekan ketersediaan ganda</h1>
<p style={styles.description}>
Turn on the switch for the clerk to double check before customer pay.
Nyalakan agar kasir memeriksa kembali ketersediaan produk sebelum pelanggan membayar.
</p>
<Switch onChange={handleChange} checked={isNeedConfirmation} />
</div>

View File

@@ -120,7 +120,7 @@ export default function SearchInput({
<Searchinput
ref={inputRef}
type="text"
placeholder="Search..."
placeholder="Cari apa ?"
value={songName}
onChange={handleChange}
onBlur={handleBlur}