From 37777926e099a9d010c3930041a529b05698d424 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Moreira?= Date: Sun, 4 Aug 2024 12:58:29 +0200 Subject: [PATCH] Add manual product --- app.json | 4 +- .../orders/active/CustomProduct.tsx | 125 ++++++++++++++++++ src/components/orders/active/OrderStack.tsx | 3 + src/components/orders/active/ProductsList.tsx | 18 ++- src/components/products/Product.tsx | 2 - src/services/orderService.ts | 25 +++- src/types/stack/OrderStack.ts | 11 ++ 7 files changed, 182 insertions(+), 6 deletions(-) create mode 100644 src/components/orders/active/CustomProduct.tsx diff --git a/app.json b/app.json index ab3cea8..3804beb 100644 --- a/app.json +++ b/app.json @@ -1,7 +1,7 @@ { "expo": { "name": "Resty", - "slug": "Resty", + "slug": "restApp", "version": "2.0.0", "orientation": "portrait", "icon": "./assets/coro.jpg", @@ -19,7 +19,7 @@ }, "android": { "adaptiveIcon": { - "foregroundImage": "./assets/adaptive-icon.png", + "foregroundImage": "./assets/coro.jpg", "backgroundColor": "#ffffff" }, "package": "com.andremoreira9.restApp" diff --git a/src/components/orders/active/CustomProduct.tsx b/src/components/orders/active/CustomProduct.tsx new file mode 100644 index 0000000..fe969f2 --- /dev/null +++ b/src/components/orders/active/CustomProduct.tsx @@ -0,0 +1,125 @@ +import React, { useState } from "react"; +import Text from "../../Text"; +import { NewProductProps } from "../../../types/stack/ProductStack"; +import DropDownPicker from "react-native-dropdown-picker"; +import theme from "../../../theme"; +import { Formik } from "formik"; +import * as Yup from "yup"; +import { View, StyleSheet, TextInput } from "react-native"; +import ContainerStyle from "../../../styles/Containers"; +import Header from "../../headers/Header"; +import Divider from "../../Divider"; +import Button from "../../Button"; +import { + createManualProduct, + createProduct, +} from "../../../services/orderService"; +import useCategories from "../../../hooks/useCategories"; +import { getCategoryNameById } from "../../../config/helpers"; +import { Product } from "../../../types/Product"; +import { OrderAddCustomProps } from "../../../types/stack/OrderStack"; + +const Styles = StyleSheet.create({ + rowContainer: { + paddingVertical: 5, + paddingHorizontal: 0, + }, +}); + +const ProductSchema = Yup.object().shape({ + name: Yup.string().required("Product name is required"), + price: Yup.number().required("Product price is required"), +}); + +const CustomProduct = ({ navigation, route }: OrderAddCustomProps) => { + const { id } = route.params; + const [open, setOpen] = useState(false); + const [loading, setLoading] = useState(false); + + const onCreateProduct = async (name: string, price: string) => { + setLoading(true); + const product = await createManualProduct(name, Number(price), id); + + navigation.goBack(); + setLoading(false); + }; + return ( + +
navigation.goBack()} /> + + + + { + onCreateProduct(values.name, values.price); + }} + > + {({ + handleChange, + handleBlur, + handleSubmit, + setFieldValue, + errors, + touched, + values, + }) => ( + + + + Product name + + + {touched.name && errors.name && ( + {errors.name} + )} + + + + + + + Price + + { + const cleanedText = text.replace(",", "."); + setFieldValue("price", cleanedText); + handleChange("price")(cleanedText); + }} + onBlur={handleBlur("price")} + value={values.price} + keyboardType="numeric" + style={{ paddingTop: 5 }} + > + {touched.price && errors.price && ( + + {errors.price} + + )} + + + + + + + )} + + + ); +}; + +export default CustomProduct; diff --git a/src/components/orders/active/OrderStack.tsx b/src/components/orders/active/OrderStack.tsx index 4ca59e7..90b800a 100644 --- a/src/components/orders/active/OrderStack.tsx +++ b/src/components/orders/active/OrderStack.tsx @@ -7,6 +7,8 @@ import ProductsList from "./ProductsList"; import PrintOrderPage from "./PrintOrder"; import EditOrder from "../EditOrder"; import HistoryOrderList from "../history/HistoryOrderList"; +import NewProduct from "../../products/NewProduct"; +import CustomProduct from "./CustomProduct"; const Stack = createStackNavigator(); @@ -21,6 +23,7 @@ const OrdersStack = () => { + ); diff --git a/src/components/orders/active/ProductsList.tsx b/src/components/orders/active/ProductsList.tsx index 6bc2efe..d8fbde5 100644 --- a/src/components/orders/active/ProductsList.tsx +++ b/src/components/orders/active/ProductsList.tsx @@ -6,7 +6,11 @@ import ContainerStyle from "../../../styles/Containers"; import useLiveOrder from "../../../hooks/orders/useLiveOrder"; import React, { useEffect, useMemo, useState } from "react"; import LoadingComponent from "../../LoadingComponent"; -import { CategoryProducts, ProductWithAmount } from "../../../types/Order"; +import { + CategoryProducts, + Order, + ProductWithAmount, +} from "../../../types/Order"; import { MaterialIcons } from "@expo/vector-icons"; import Text from "../../Text"; import { OrderProduct } from "../../../types/OrderProduct"; @@ -17,15 +21,18 @@ import { Category } from "../../../types/Category"; import theme from "../../../theme"; import { ScrollView } from "react-native-gesture-handler"; import useSnackbar from "../../../hooks/useSnackbar"; +import Button from "../../Button"; const Products = ({ navigation, id, products, + order, }: { navigation: OrderAddProps["navigation"]; id: string; products: ProductWithAmount[]; + order: Order; }) => { return ( @@ -42,6 +49,7 @@ const Products = ({ product={orderProduct} key={product.id} deletable={false} + orderClosed={order.closed} /> ); })} @@ -144,8 +152,16 @@ export default function ProductsList({ navigation, route }: OrderAddProps) { navigation={navigation} id={id} products={selectedCategory.products} + order={order} /> )} + +