diff --git a/asset/apreton-de-manos.png b/asset/apreton-de-manos.png new file mode 100644 index 0000000..4779679 Binary files /dev/null and b/asset/apreton-de-manos.png differ diff --git a/asset/logo.png b/asset/logo.png new file mode 100644 index 0000000..d986590 Binary files /dev/null and b/asset/logo.png differ diff --git a/asset/tienda-alt.png b/asset/tienda-alt.png new file mode 100644 index 0000000..912d87d Binary files /dev/null and b/asset/tienda-alt.png differ diff --git a/metro.config.js b/metro.config.js index e91aba9..eca9b10 100644 --- a/metro.config.js +++ b/metro.config.js @@ -11,7 +11,8 @@ module.exports = { transform: { experimentalImportSupport: false, inlineRequires: true, - }, + + } }), }, }; diff --git a/package-lock.json b/package-lock.json index 9513e32..81a1b9b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.0.1", "dependencies": { "@react-native-async-storage/async-storage": "^1.18.2", + "@react-navigation/bottom-tabs": "^6.5.7", "@react-navigation/native-stack": "^6.9.12", "@react-navigation/stack": "^6.3.16", "buffer": "^6.0.3", @@ -21,6 +22,7 @@ "react-native-linear-gradient": "^2.6.2", "react-native-safe-area-context": "^4.5.0", "react-native-screens": "^3.20.0", + "react-native-vector-icons": "^9.2.0", "tailwindcss": "^3.3.0" }, "devDependencies": { @@ -32,6 +34,7 @@ "@types/jest": "^29.2.1", "@types/node": "^18.15.11", "@types/react": "^18.0.24", + "@types/react-native-vector-icons": "^6.4.13", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.2.1", "eslint": "^8.19.0", @@ -4446,6 +4449,23 @@ "resolved": "https://registry.npmjs.org/@react-native/polyfills/-/polyfills-2.0.0.tgz", "integrity": "sha512-K0aGNn1TjalKj+65D7ycc1//H9roAQ51GJVk5ZJQFb2teECGmzd86bYDC0aYdbRf7gtovescq4Zt6FR0tgXiHQ==" }, + "node_modules/@react-navigation/bottom-tabs": { + "version": "6.5.7", + "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-6.5.7.tgz", + "integrity": "sha512-9oZYyRu2z7+1pr2dX5V54rHFPmlj4ztwQxFe85zwpnGcPtGIsXj7VCIdlHnjRHJBBFCszvJGQpYY6/G2+DfD+A==", + "dependencies": { + "@react-navigation/elements": "^1.3.17", + "color": "^4.2.3", + "warn-once": "^0.1.0" + }, + "peerDependencies": { + "@react-navigation/native": "^6.0.0", + "react": "*", + "react-native": "*", + "react-native-safe-area-context": ">= 3.0.0", + "react-native-screens": ">= 3.0.0" + } + }, "node_modules/@react-navigation/core": { "version": "6.4.8", "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-6.4.8.tgz", @@ -4728,6 +4748,25 @@ "csstype": "^3.0.2" } }, + "node_modules/@types/react-native": { + "version": "0.70.13", + "resolved": "https://registry.npmjs.org/@types/react-native/-/react-native-0.70.13.tgz", + "integrity": "sha512-VnC/ny8Eynk3fvY4cnNKXpo/0zUhA2gO64RX51yzVofblOP6TR6jciga0kIjI4c+2eUyWNGrahmiolNm+QU6Cw==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, + "node_modules/@types/react-native-vector-icons": { + "version": "6.4.13", + "resolved": "https://registry.npmjs.org/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.13.tgz", + "integrity": "sha512-1PqFoKuXTSzMHwGMAr+REdYJBQAbe9xrww3ecZR0FsHcD1K+vGS/rxuAriL4rsI6+p69sZQjDzpEVAbDQcjSwA==", + "dev": true, + "dependencies": { + "@types/react": "*", + "@types/react-native": "^0.70" + } + }, "node_modules/@types/react-test-renderer": { "version": "18.0.0", "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-18.0.0.tgz", @@ -13573,6 +13612,54 @@ "react-native": "*" } }, + "node_modules/react-native-vector-icons": { + "version": "9.2.0", + "resolved": "https://registry.npmjs.org/react-native-vector-icons/-/react-native-vector-icons-9.2.0.tgz", + "integrity": "sha512-wKYLaFuQST/chH3AJRjmOLoLy3JEs1JR6zMNgTaemFpNoXs0ztRnTxcxFD9xhX7cJe1/zoN5BpQYe7kL0m5yyA==", + "dependencies": { + "prop-types": "^15.7.2", + "yargs": "^16.1.1" + }, + "bin": { + "fa5-upgrade": "bin/fa5-upgrade.sh", + "generate-icon": "bin/generate-icon.js" + } + }, + "node_modules/react-native-vector-icons/node_modules/cliui": { + "version": "7.0.4", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz", + "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==", + "dependencies": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.0", + "wrap-ansi": "^7.0.0" + } + }, + "node_modules/react-native-vector-icons/node_modules/yargs": { + "version": "16.2.0", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz", + "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==", + "dependencies": { + "cliui": "^7.0.2", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "require-directory": "^2.1.1", + "string-width": "^4.2.0", + "y18n": "^5.0.5", + "yargs-parser": "^20.2.2" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/react-native-vector-icons/node_modules/yargs-parser": { + "version": "20.2.9", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz", + "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==", + "engines": { + "node": ">=10" + } + }, "node_modules/react-native/node_modules/@jest/types": { "version": "26.6.2", "resolved": "https://registry.npmjs.org/@jest/types/-/types-26.6.2.tgz", diff --git a/package.json b/package.json index 333ef08..c8f93a1 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ }, "dependencies": { "@react-native-async-storage/async-storage": "^1.18.2", + "@react-navigation/bottom-tabs": "^6.5.7", "@react-navigation/native-stack": "^6.9.12", "@react-navigation/stack": "^6.3.16", "buffer": "^6.0.3", @@ -23,6 +24,7 @@ "react-native-linear-gradient": "^2.6.2", "react-native-safe-area-context": "^4.5.0", "react-native-screens": "^3.20.0", + "react-native-vector-icons": "^9.2.0", "tailwindcss": "^3.3.0" }, "devDependencies": { @@ -34,6 +36,7 @@ "@types/jest": "^29.2.1", "@types/node": "^18.15.11", "@types/react": "^18.0.24", + "@types/react-native-vector-icons": "^6.4.13", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.2.1", "eslint": "^8.19.0", diff --git a/src/asset/tienda-alt.png b/src/asset/tienda-alt.png new file mode 100644 index 0000000..912d87d Binary files /dev/null and b/src/asset/tienda-alt.png differ diff --git a/src/components/Background.tsx b/src/components/Background.tsx index efe099f..4ef547a 100644 --- a/src/components/Background.tsx +++ b/src/components/Background.tsx @@ -1,12 +1,24 @@ import React from 'react'; -import { View } from 'react-native' +import { SafeAreaView, ScrollView} from 'react-native' + export const Background = ({ children }: {children: JSX.Element | JSX.Element[]}) => { return ( <> - - {children} - + + + + {children} + + + + + - ) -} \ No newline at end of file + ) +} diff --git a/src/components/Card.tsx b/src/components/Card.tsx index e4ebe52..013bc95 100644 --- a/src/components/Card.tsx +++ b/src/components/Card.tsx @@ -8,7 +8,7 @@ type CardType = { export const Card:FC = ({ children , addClassName}) => { - let className = 'flex grow w-5/6 p-4 m-4 bg-white rounded-xl shadow-2xl shadow-slate-500'; + let className = 'w-5/6 p-4 m-4 bg-white rounded-xl shadow-2xl shadow-slate-500'; className = className + " " + addClassName; return ( <> diff --git a/src/components/navbar/MenuItem.tsx b/src/components/navbar/MenuItem.tsx new file mode 100644 index 0000000..9bda6fa --- /dev/null +++ b/src/components/navbar/MenuItem.tsx @@ -0,0 +1,30 @@ +import { FC } from 'react' +import { View, TouchableOpacity, Image, Text, ImageSourcePropType } from 'react-native' +import { useNavigation } from '@react-navigation/native'; + +interface Props { + require: (id: string) => any , + label: string, + destino:string +} + +export const MenuItem:FC = ({require,label, destino}) => { + const navitation = useNavigation(); + return ( + <> + + navitation.navigate(destino as never)} + > + + + + {/*{label}*/} + + + ) +} \ No newline at end of file diff --git a/src/components/navbar/NavBar.tsx b/src/components/navbar/NavBar.tsx new file mode 100644 index 0000000..146c860 --- /dev/null +++ b/src/components/navbar/NavBar.tsx @@ -0,0 +1,38 @@ +import { FC } from 'react' +import { Image, Text, TouchableOpacity, View } from 'react-native' +import { Card } from '../Card'; +import { MenuItem } from './MenuItem'; +import { useNavigation } from '@react-navigation/native'; + + +interface Props { +} + +export const NavBar:FC = () => { + + const navigation = useNavigation(); + return ( + + + + + + + + navigation.navigate("SalesOrderScreen" as never) } + > + + + + Pedidos + + + + + ) +} \ No newline at end of file diff --git a/src/components/navbar/TabItem.tsx b/src/components/navbar/TabItem.tsx new file mode 100644 index 0000000..509b61b --- /dev/null +++ b/src/components/navbar/TabItem.tsx @@ -0,0 +1,26 @@ +import { FC } from 'react' +import { View, TouchableOpacity, Image, Text, ImageSourcePropType } from 'react-native' +import { useNavigation } from '@react-navigation/native'; + +interface Props { + require: (id: string) => any, + focused?: boolean, + +} + +export const TabItem:FC = ({require,focused}) => { + let className = "w-8 h-8 "; + if (focused){ + + } + + return ( + + + + + ) +} \ No newline at end of file diff --git a/src/components/navbar/apreton-de-manos.png b/src/components/navbar/apreton-de-manos.png new file mode 100644 index 0000000..4779679 Binary files /dev/null and b/src/components/navbar/apreton-de-manos.png differ diff --git a/src/components/navbar/caja-abierta.png b/src/components/navbar/caja-abierta.png new file mode 100644 index 0000000..cd6fe57 Binary files /dev/null and b/src/components/navbar/caja-abierta.png differ diff --git a/src/components/navbar/lista.png b/src/components/navbar/lista.png new file mode 100644 index 0000000..dac2ecc Binary files /dev/null and b/src/components/navbar/lista.png differ diff --git a/src/components/navbar/menu-puntos.png b/src/components/navbar/menu-puntos.png new file mode 100644 index 0000000..c04fd5a Binary files /dev/null and b/src/components/navbar/menu-puntos.png differ diff --git a/src/components/navbar/tienda-alt.png b/src/components/navbar/tienda-alt.png new file mode 100644 index 0000000..912d87d Binary files /dev/null and b/src/components/navbar/tienda-alt.png differ diff --git a/src/navigator/MainStackNavigator.tsx b/src/navigator/MainStackNavigator.tsx index ae1b85b..d419cd2 100644 --- a/src/navigator/MainStackNavigator.tsx +++ b/src/navigator/MainStackNavigator.tsx @@ -2,21 +2,16 @@ import { FC, useContext, useState } from 'react' import AsyncStorage from '@react-native-async-storage/async-storage'; import { LoginScreen } from '../screens/login/LoginScreen'; -import { HomeScreen } from '../screens/home/HomeScreen'; -import { SalesOrderScreen } from '../screens/salesorder/SalesOrderScreen'; -import { ProductScreen } from '../screens/product/ProductScreen'; -import { CompanyScreen } from '../screens/company/CompanyScreen'; -import { CustomerScreen } from '../screens/customer/CustomerScreen'; +import { TabScreen } from './TabScreen'; + import { createNativeStackNavigator } from '@react-navigation/native-stack'; import { AuthContext } from '../screens/login/AuthContext'; -interface Props { -} const Stack = createNativeStackNavigator(); -export const MainStackNavitagor:FC = () => { +export const MainStackNavitagor:FC = () => { const {isAuthenticated} = useContext(AuthContext) @@ -28,18 +23,14 @@ export const MainStackNavitagor:FC = () => { headerShown: false, }} > - {isAuthenticated==false?( + {isAuthenticated==true?( <> ):( <> - - - - - + )} diff --git a/src/navigator/TabScreen.tsx b/src/navigator/TabScreen.tsx new file mode 100644 index 0000000..3004c50 --- /dev/null +++ b/src/navigator/TabScreen.tsx @@ -0,0 +1,93 @@ +import { FC } from 'react' +import { Dimensions, Text, View } from 'react-native' +import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; +import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'; + +import { CompanyScreen } from '../screens/company/CompanyScreen'; +import { MenuItem } from '../components/navbar/MenuItem'; +import { TabItem } from '../components/navbar/TabItem'; +import { SalesOrderScreen } from '../screens/salesorder/SalesOrderScreen'; +import { ProductScreen } from '../screens/product/ProductScreen'; +import { ExitScreen } from '../screens/exit/ExitScreen'; +import { CustomerListScreen } from '../screens/customer/CustomerListScreen'; +import { CustomerStack } from '../screens/customer/CustomerStack'; + + +interface Props { +} + +export const TabScreen:FC = () => { + const Tab = createBottomTabNavigator(); + const { width, height } = Dimensions.get("window") + return ( + + + ( + + ), + }} + /> + ( + + ), + }} + /> + ( + + ), + }} + /> + ( + + ), + }} + /> + ( + + ), + }} + /> + + + ) +} \ No newline at end of file diff --git a/src/navigator/apreton-de-manos.png b/src/navigator/apreton-de-manos.png new file mode 100644 index 0000000..4779679 Binary files /dev/null and b/src/navigator/apreton-de-manos.png differ diff --git a/src/navigator/caja-abierta.png b/src/navigator/caja-abierta.png new file mode 100644 index 0000000..cd6fe57 Binary files /dev/null and b/src/navigator/caja-abierta.png differ diff --git a/src/navigator/lista.png b/src/navigator/lista.png new file mode 100644 index 0000000..dac2ecc Binary files /dev/null and b/src/navigator/lista.png differ diff --git a/src/navigator/salida.png b/src/navigator/salida.png new file mode 100644 index 0000000..1e42767 Binary files /dev/null and b/src/navigator/salida.png differ diff --git a/src/navigator/tienda-alt.png b/src/navigator/tienda-alt.png new file mode 100644 index 0000000..912d87d Binary files /dev/null and b/src/navigator/tienda-alt.png differ diff --git a/src/screens/company/CompanyScreen.tsx b/src/screens/company/CompanyScreen.tsx index 05015ef..e07d889 100644 --- a/src/screens/company/CompanyScreen.tsx +++ b/src/screens/company/CompanyScreen.tsx @@ -1,4 +1,5 @@ import { FC } from 'react' +import { Text } from 'react-native' interface Props { } @@ -6,7 +7,7 @@ interface Props { export const CompanyScreen:FC = () => { return ( <> - + Compañia ) } \ No newline at end of file diff --git a/src/screens/customer/CustomerFormScreen.tsx b/src/screens/customer/CustomerFormScreen.tsx new file mode 100644 index 0000000..5b61afa --- /dev/null +++ b/src/screens/customer/CustomerFormScreen.tsx @@ -0,0 +1,33 @@ +import { FC } from 'react' +import { Text } from 'react-native' +import { NavBar } from '../../components/navbar/NavBar' +import { Background } from '../../components/Background' +import { useNavigation } from '@react-navigation/native'; +import { Button } from '../../components/Button'; +import { Card } from '../../components/Card'; +import { Input } from '../../components/Input'; +import { useForm } from 'react-hook-form'; +interface Props { +} + +export const CustomerFormScreen:FC = () => { + const { control, handleSubmit, getValues, formState: { errors } } = useForm(); + const navigation = useNavigation(); + return ( + <> + + + Registro de clientes + + +