This commit is contained in:
insvrgent
2025-02-10 16:00:27 +07:00
parent 49f6b37905
commit 2a762a9610
4 changed files with 42 additions and 33 deletions

View File

@@ -5,6 +5,7 @@ const Item = ({
forCart,
forInvoice,
name: initialName,
description: initialDescription,
price: initialPrice,
qty: initialQty,
imageUrl,
@@ -23,6 +24,7 @@ const Item = ({
const [itemQty, setItemQty] = useState(blank ? 0 : initialQty);
const [itemName, setItemName] = useState(initialName);
const [itemPrice, setItemPrice] = useState(initialPrice);
const [itemDescription, setItemDescription] = useState(initialDescription);
const fileInputRef = useRef(null);
useEffect(() => {
@@ -89,6 +91,7 @@ const Item = ({
};
return (
<div>
<div className={`${styles.item} ${forInvoice ? styles.itemInvoice : ""}`}>
{!forInvoice && (
<div className={styles.imageContainer}>
@@ -113,7 +116,7 @@ const Item = ({
{(isBeingEdit || blank) && (
<div className={styles.overlay} onClick={handleImageClick}>
<span>
{previewUrl ? "Click To Change Image" : "Click To Add Image"}
{previewUrl ? "Ganti gambar" : "Tambah gambar"}
</span>
</div>
)}
@@ -153,7 +156,7 @@ const Item = ({
!isAvailable ? styles.disabled : ""
}`}
value={itemName}
placeholder="name"
placeholder="Nama item"
onChange={handleNameChange}
disabled={!blank && !isBeingEdit}
/>
@@ -170,7 +173,7 @@ const Item = ({
isBeingEdit || blank ? styles.blank : styles.notblank
} ${!isAvailable ? styles.disabled : ""}`}
value={itemPrice}
placeholder="price"
placeholder="Harga"
onChange={handlePriceChange}
disabled={!blank && !isBeingEdit}
/>
@@ -242,7 +245,7 @@ const Item = ({
}}
onClick={isBeingEdit ? handleUpdate : handleCreate}
>
{isBeingEdit ? "save" : "+"}
{isBeingEdit ? "Simpan" : "Buat"}
</button>
</div>
))}
@@ -262,6 +265,12 @@ const Item = ({
</button>
)} */}
</div>
{itemDescription?.length &&
<div>
<p style={{color: '#5f5f5f', fontSize: '3.2vw', padding: '5px'}}>{itemDescription}</p>
</div>
}
</div>
);
};

View File

@@ -39,8 +39,8 @@
}
.itemImage {
width: 119px;
height: 129px;
width: 100%;
height: 100%;
border-radius: 10px;
margin-right: 10px;
object-fit: cover;
@@ -49,16 +49,16 @@
.imageContainer {
position: relative;
width: 119px;
height: 129px;
width: 26vw;
height: 26vw;
}
.overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
top: 15px;
left: 8px;
right: 8px;
bottom: 15px;
background-color: rgba(0, 0, 0, 0.5);
color: white;
display: flex;
@@ -67,6 +67,7 @@
border-radius: 20px;
cursor: pointer;
transition: background-color 0.3s ease;
font-size: 3.3vw;
}
.overlay:hover {
@@ -99,7 +100,7 @@
font-family: "Plus Jakarta Sans", sans-serif;
font-style: normal;
width: calc(100% - 15px); /* Adjust the width to prevent overflow */
font-size: 1.4rem;
font-size: 5vw;
font-weight: 500;
margin-top: 0;
margin: 0 5px;
@@ -128,10 +129,10 @@
font-style: normal;
font-weight: 600;
width: calc(100% - 15px); /* Adjust the width to prevent overflow */
font-size: 0.9rem;
font-size: 3.3vw;
/* margin-bottom: 35px; */
margin-left: 5px;
color: #d9c61c;
color: #3a3a3a;
background-color: transparent;
}
@@ -184,11 +185,11 @@
border: 2px solid #73a585;
/* border: none; */
display: inline-block;
font-size: 16px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
width: 95px;
height: 35px;
width: 87px;
height: 32px;
margin-left: 5px;
margin-top: 5px;
border-radius: 20px;

View File

@@ -496,7 +496,7 @@ const ItemLister = ({
key={itemTypeId}
className={`${styles["item-lister"]} ${isEdit ? styles["fullscreen"] : ""
}`}
style={{ paddingBottom: isEdit ? "28vh" : "" }}
style={{ paddingBottom: isEdit ? "258px" : "" }}
>
{(isEdit && isFirstStep || !isEdit) &&
@@ -769,11 +769,11 @@ const ItemLister = ({
onClick={toggleAddNewItem}
style={{
display: "inline-block",
height: "159px",
fontSize: "50px",
height: "120px",
fontSize: "20px",
}}
>
+
Tambah item +
</button>
)}
{isAddingNewItem && (
@@ -813,7 +813,7 @@ const ItemLister = ({
/>
)}
<h3>
&nbsp;{item.availability ? "tersedia" : "tidak tersedia"} &nbsp;
&nbsp;{item.availability ? "Tersedia" : "Tidak tersedia"} &nbsp;
</h3>
<div
style={{
@@ -885,7 +885,7 @@ const ItemLister = ({
<div className={styles["itemWrapper"]}>
{isEditMode && isEditItem != item.itemId && (
<div className={styles["editModeLayout"]}>
<div style={{display: 'flex', alignItems: 'center'}}>
<div style={{display: 'flex', alignItems: 'center', height: '40px', marginLeft: '7.5vw'}}>
{isEditMode && (
<Switch
onChange={() => handleChange(item.itemId)}
@@ -893,11 +893,11 @@ const ItemLister = ({
/>
)}
<h3>
&nbsp;{item.availability ? "tersedia" : "tidak tersedia"}
&nbsp;{item.availability ? "Tersedia" : "Tidak tersedia"}
</h3>
</div>
<div style={{display: 'flex', alignItems: 'center'}}>
<div onClick={() => editItem(item.itemId)} style={{display: 'flex', alignItems: 'center', height: '40px', marginRight: '7.5vw'}}>
<div
style={{
width: '32px',
@@ -907,7 +907,6 @@ const ItemLister = ({
alignItems: 'center', // Center vertically
cursor: 'pointer'
}}
onClick={() => editItem(item.itemId)}
>
<svg
fill="white"

View File

@@ -143,11 +143,11 @@
width: 100%;
top: 7px;
bottom: -4px;
display: flex
;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
flex-direction: column;
justify-content: space-between;
font-size: 14px;
}
.PaymentOption {
@@ -197,7 +197,7 @@
font-size: 32px;
width: 80vw;
height: 18vw;
height: 70px;
border-radius: 50px;
background-color: rgba(88, 55, 50, 1);
color: white;