ok banget

This commit is contained in:
zadit
2024-10-30 03:32:48 +07:00
parent 1ecc6db645
commit 5a2b9b2f86
18 changed files with 244 additions and 130 deletions

View File

@@ -8,6 +8,7 @@ const Item = ({
price: initialPrice,
qty: initialQty,
imageUrl,
imageFile,
id,
onPlusClick,
onNegativeClick,
@@ -17,7 +18,7 @@ const Item = ({
isAvailable,
isBeingEdit,
}) => {
const [selectedImage, setSelectedImage] = useState(null);
const [selectedImage, setSelectedImage] = useState(imageFile);
const [previewUrl, setPreviewUrl] = useState(imageUrl);
const [itemQty, setItemQty] = useState(blank ? 0 : initialQty);
const [itemName, setItemName] = useState(initialName);
@@ -219,6 +220,7 @@ const Item = ({
style={{
backgroundColor: "white",
width: "150px",
color: '#73a585'
}}
onClick={isBeingEdit ? handleUpdate : handleCreate}
>

View File

@@ -143,12 +143,15 @@
.itemQty {
display: flex;
align-items: center;
align-items: end;
font-size: 0.9rem;
margin-left: 5px;
color: rgb(115, 165, 133);
fill: rgb(115, 165, 133);
}
.itemQtyValue {
margin-bottom: 8px;
font-family: "Poppins", sans-serif;
font-style: normal;
font-weight: 600;
@@ -174,7 +177,6 @@
background-color: #ffffff;
border: 2px solid #73a585;
/* border: none; */
color: #73a585;
display: inline-block;
font-size: 16px;
font-weight: 600;

View File

@@ -188,6 +188,7 @@ const ItemLister = ({
: item
)
);
setisEditItem(0);
};
const onUpdateItem = (itemId, name, price, image) => {
if (isEdit)
@@ -350,17 +351,41 @@ const ItemLister = ({
isEdit ? styles.border : styles.noborder
}`}
value={editedTypeName}
placeholder="type name"
onChange={(e) => setEditedTypeName(e.target.value)}
disabled={!isEdit}
/>
{isEditMode && !isEdit && (
<>
<button
className={styles["edit-typeItem-button"]}
onClick={toggleEditTypeItem}
>
Edit
</button>
<><div
style={{
width: '32px',
height: '32px', // Add a height to the div
display: 'flex', // Use flexbox
justifyContent: 'center', // Center horizontally
alignItems: 'center', // Center vertically
cursor: 'pointer'
}}
onClick={toggleEditTypeItem} // Move onClick here for the whole div
>
<svg
fill="#000000"
viewBox="0 0 32 32"
style={{ fillRule: 'evenodd', clipRule: 'evenodd', strokeLinejoin: 'round', strokeMiterlimit: 2 }}
version="1.1"
xmlSpace="preserve"
xmlns="http://www.w3.org/2000/svg"
xmlnsSerif="http://www.serif.com/"
xmlnsXlink="http://www.w3.org/1999/xlink"
>
<g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
<g id="SVGRepo_tracerCarrier" strokeLinecap="round" strokeLinejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M12.965,5.462c0,-0 -2.584,0.004 -4.979,0.008c-3.034,0.006 -5.49,2.467 -5.49,5.5l0,13.03c0,1.459 0.579,2.858 1.611,3.889c1.031,1.032 2.43,1.611 3.889,1.611l13.003,0c3.038,-0 5.5,-2.462 5.5,-5.5c0,-2.405 0,-5.004 0,-5.004c0,-0.828 -0.672,-1.5 -1.5,-1.5c-0.827,-0 -1.5,0.672 -1.5,1.5l0,5.004c0,1.381 -1.119,2.5 -2.5,2.5l-13.003,0c-0.663,-0 -1.299,-0.263 -1.768,-0.732c-0.469,-0.469 -0.732,-1.105 -0.732,-1.768l0,-13.03c0,-1.379 1.117,-2.497 2.496,-2.5c2.394,-0.004 4.979,-0.008 4.979,-0.008c0.828,-0.002 1.498,-0.675 1.497,-1.503c-0.001,-0.828 -0.675,-1.499 -1.503,-1.497Z"></path>
<path d="M20.046,6.411l-6.845,6.846c-0.137,0.137 -0.232,0.311 -0.271,0.501l-1.081,5.152c-0.069,0.329 0.032,0.671 0.268,0.909c0.237,0.239 0.577,0.343 0.907,0.277l5.194,-1.038c0.193,-0.039 0.371,-0.134 0.511,-0.274l6.845,-6.845l-5.528,-5.528Zm1.415,-1.414l5.527,5.528l1.112,-1.111c1.526,-1.527 1.526,-4.001 -0,-5.527c-0.001,-0 -0.001,-0.001 -0.001,-0.001c-1.527,-1.526 -4.001,-1.526 -5.527,-0l-1.111,1.111Z"></path>
</g>
</svg>
</div>
</>
)}
</div>
@@ -562,11 +587,37 @@ const ItemLister = ({
/>
)}
<h3>
{item.availability ? "available" : "unavailable"}
&nbsp;{item.availability ? "available" : "unavailable"} &nbsp;
</h3>
<button onClick={() => editItem(item.itemId)}>
edit
</button>
<div
style={{
width: '32px',
height: '32px', // Add a height to the div
display: 'flex', // Use flexbox
justifyContent: 'center', // Center horizontally
alignItems: 'center', // Center vertically
cursor: 'pointer'
}}
onClick={() => editItem(item.itemId)}
>
<svg
fill="white"
viewBox="0 0 32 32"
style={{ fillRule: 'evenodd', clipRule: 'evenodd', strokeLinejoin: 'round', strokeMiterlimit: 2 }}
version="1.1"
xmlSpace="preserve"
xmlns="http://www.w3.org/2000/svg"
xmlnsSerif="http://www.serif.com/"
xmlnsXlink="http://www.w3.org/1999/xlink"
>
<g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
<g id="SVGRepo_tracerCarrier" strokeLinecap="round" strokeLinejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M12.965,5.462c0,-0 -2.584,0.004 -4.979,0.008c-3.034,0.006 -5.49,2.467 -5.49,5.5l0,13.03c0,1.459 0.579,2.858 1.611,3.889c1.031,1.032 2.43,1.611 3.889,1.611l13.003,0c3.038,-0 5.5,-2.462 5.5,-5.5c0,-2.405 0,-5.004 0,-5.004c0,-0.828 -0.672,-1.5 -1.5,-1.5c-0.827,-0 -1.5,0.672 -1.5,1.5l0,5.004c0,1.381 -1.119,2.5 -2.5,2.5l-13.003,0c-0.663,-0 -1.299,-0.263 -1.768,-0.732c-0.469,-0.469 -0.732,-1.105 -0.732,-1.768l0,-13.03c0,-1.379 1.117,-2.497 2.496,-2.5c2.394,-0.004 4.979,-0.008 4.979,-0.008c0.828,-0.002 1.498,-0.675 1.497,-1.503c-0.001,-0.828 -0.675,-1.499 -1.503,-1.497Z"></path>
<path d="M20.046,6.411l-6.845,6.846c-0.137,0.137 -0.232,0.311 -0.271,0.501l-1.081,5.152c-0.069,0.329 0.032,0.671 0.268,0.909c0.237,0.239 0.577,0.343 0.907,0.277l5.194,-1.038c0.193,-0.039 0.371,-0.134 0.511,-0.274l6.845,-6.845l-5.528,-5.528Zm1.415,-1.414l5.527,5.528l1.112,-1.111c1.526,-1.527 1.526,-4.001 -0,-5.527c-0.001,-0 -0.001,-0.001 -0.001,-0.001c-1.527,-1.526 -4.001,-1.526 -5.527,-0l-1.111,1.111Z"></path>
</g>
</svg>
</div>
</div>
)}
@@ -578,6 +629,7 @@ const ItemLister = ({
price={item.price}
qty={item.qty}
imageUrl={item.image}
imageFile={item.selectedImage}
onPlusClick={() => handlePlusClick(item.itemId)}
onNegativeClick={() => handleNegativeClick(item.itemId)}
onRemoveClick={() => handleRemoveClick(item.itemId)}
@@ -614,11 +666,37 @@ const ItemLister = ({
/>
)}
<h3>
{item.availability ? "available" : "unavailable"}
&nbsp;{item.availability ? "available" : "unavailable"}&nbsp;
</h3>
<button onClick={() => editItem(item.itemId)}>
edit
</button>
<div
style={{
width: '32px',
height: '32px', // Add a height to the div
display: 'flex', // Use flexbox
justifyContent: 'center', // Center horizontally
alignItems: 'center', // Center vertically
cursor: 'pointer'
}}
onClick={() => editItem(item.itemId)}
>
<svg
fill="white"
viewBox="0 0 32 32"
style={{ fillRule: 'evenodd', clipRule: 'evenodd', strokeLinejoin: 'round', strokeMiterlimit: 2 }}
version="1.1"
xmlSpace="preserve"
xmlns="http://www.w3.org/2000/svg"
xmlnsSerif="http://www.serif.com/"
xmlnsXlink="http://www.w3.org/1999/xlink"
>
<g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
<g id="SVGRepo_tracerCarrier" strokeLinecap="round" strokeLinejoin="round"></g>
<g id="SVGRepo_iconCarrier">
<path d="M12.965,5.462c0,-0 -2.584,0.004 -4.979,0.008c-3.034,0.006 -5.49,2.467 -5.49,5.5l0,13.03c0,1.459 0.579,2.858 1.611,3.889c1.031,1.032 2.43,1.611 3.889,1.611l13.003,0c3.038,-0 5.5,-2.462 5.5,-5.5c0,-2.405 0,-5.004 0,-5.004c0,-0.828 -0.672,-1.5 -1.5,-1.5c-0.827,-0 -1.5,0.672 -1.5,1.5l0,5.004c0,1.381 -1.119,2.5 -2.5,2.5l-13.003,0c-0.663,-0 -1.299,-0.263 -1.768,-0.732c-0.469,-0.469 -0.732,-1.105 -0.732,-1.768l0,-13.03c0,-1.379 1.117,-2.497 2.496,-2.5c2.394,-0.004 4.979,-0.008 4.979,-0.008c0.828,-0.002 1.498,-0.675 1.497,-1.503c-0.001,-0.828 -0.675,-1.499 -1.503,-1.497Z"></path>
<path d="M20.046,6.411l-6.845,6.846c-0.137,0.137 -0.232,0.311 -0.271,0.501l-1.081,5.152c-0.069,0.329 0.032,0.671 0.268,0.909c0.237,0.239 0.577,0.343 0.907,0.277l5.194,-1.038c0.193,-0.039 0.371,-0.134 0.511,-0.274l6.845,-6.845l-5.528,-5.528Zm1.415,-1.414l5.527,5.528l1.112,-1.111c1.526,-1.527 1.526,-4.001 -0,-5.527c-0.001,-0 -0.001,-0.001 -0.001,-0.001c-1.527,-1.526 -4.001,-1.526 -5.527,-0l-1.111,1.111Z"></path>
</g>
</svg>
</div>
</div>
)}

View File

@@ -114,7 +114,7 @@ const ItemTypeLister = ({
shopId={shopId}
shopOwnerId={shopOwnerId}
user={user}
typeName={"add new"}
typeName={""}
itemList={items}
isEditMode={true}
handleCreateItem={(itemTypeId, name, price, selectedImage) => createItem(shopId, name, price, selectedImage,itemTypeId)}

View File

@@ -62,13 +62,13 @@ const Modal = ({ shop, isOpen, onClose, modalContent, setModal }) => {
<PaymentOptions shopId={shop.cafeId} />
)}
{modalContent === "add_material" && (
<MaterialList cafeId={shop.cafeId} />
<MaterialList handleClose={handleOverlayClick} cafeId={shop.cafeId} />
)}
{modalContent === "update_stock" && (
<MaterialMutationsPage cafeId={shop.cafeId} />
<MaterialMutationsPage handleClose={handleOverlayClick} cafeId={shop.cafeId} />
)}
{modalContent === "welcome_config" && <WelcomePageEditor cafeId={shop.cafeId} welcomePageConfig={shop.welcomePageConfig} />}
{modalContent === "reports" && <Reports cafeId={shop.cafeId} />}
{modalContent === "reports" && <Reports handleClose={handleOverlayClick} cafeId={shop.cafeId} />}
</div>
</div>
);