keannu125/Ivy-Frontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Ivy-Frontend.git synced 2024-11-17 06:39:25 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Edit Product final

Browse source
This commit is contained in:
jurenroy 2023-02-27 15:11:24 +08:00
parent 88049d0367
commit f45170d215
2 changed files with 7 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/routes/Products/AddProduct/AddProduct.tsx
View file

@ -47,9 +47,8 @@ export default function AddProduct() {
<div style={{ margin: 32, height: "100%" }}> <div style={{ margin: 32, height: "100%" }}>
<div style={styles.content_row}> <div style={styles.content_row}>
<ProductsIcon size={8} color="white" /> <ProductsIcon size={8} color="white" />
<h1 style={styles.text_large}>Products</h1> <h1 style={styles.text_large}>Add Product</h1>
</div> </div>
<h1>Add Product</h1>
<TableContainer> <TableContainer>
<Table> <Table>
<TableBody> <TableBody>

15
src/routes/Products/EditProduct/EditProduct.tsx
View file

@ -8,10 +8,10 @@ import {
TableHead, TableHead,
TableRow, TableRow,
TextField, TextField,
IconButton,
} from "@mui/material"; } from "@mui/material";
import { ProductType } from "../../../Components/ProductType/ProductType"; import { ProductType } from "../../../Components/ProductType/ProductType";
import ProductsLists from "../../../Components/ProductsLists/ProductsLists"; import ProductsLists from "../../../Components/ProductsLists/ProductsLists";
import ProductsIcon from "../../../Components/Icons/ProductsIcon/ProductsIcon";
import styles from "../../../styles"; import styles from "../../../styles";
type EditProductParams = { type EditProductParams = {
@ -26,30 +26,26 @@ export default function EditProduct() {
const [stocks, setStocks] = useState(""); const [stocks, setStocks] = useState("");
useEffect(() => { useEffect(() => {
const product = ProductsLists.find((product) => product.id.toString() === id); const product = ProductsLists.find((product) => product.id.toString().padStart(3, '0') === id);
if (product) { if (product) {
setName(product.name); setName(product.name);
setStocks(product.stocks.toString()); setStocks(product.stocks.toString());
} }
}, [id]); }, [id]);
const handleNameChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setName(event.target.value);
};
const handleStocksChange = (event: React.ChangeEvent<HTMLInputElement>) => { const handleStocksChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setStocks(event.target.value); setStocks(event.target.value);
}; };
const handleUpdateProduct = () => { const handleUpdateProduct = () => {
const updatedProduct: ProductType = { const updatedProduct: ProductType = {
id: parseInt(id || "0"), // add a default value of "0" for id if it's undefined id: parseInt(id || "0"), // add a default value of "0" for id if it's undefined and pad with leading zeros
name: name, name: name,
stocks: parseInt(stocks), stocks: parseInt(stocks),
lastModified: new Date().toLocaleString(), lastModified: new Date().toLocaleString(),
}; };
const index = ProductsLists.findIndex((product) => product.id.toString() === id); const index = ProductsLists.findIndex((product) => product.id.toString().padStart(3, '0') === id);
ProductsLists.splice(index, 1, updatedProduct); ProductsLists.splice(index, 1, updatedProduct);
navigate("/Products"); navigate("/Products");
@ -60,8 +56,9 @@ export default function EditProduct() {
}; };
return ( return (
<div style={{ margin: 32 }}> <div style={{ margin: 32, height: "100%" }}>
<div style={styles.content_row}> <div style={styles.content_row}>
<ProductsIcon size={8} color="white" />
<h1 style={styles.text_large}>Edit Product</h1> <h1 style={styles.text_large}>Edit Product</h1>
</div> </div>
<TableContainer> <TableContainer>