├── public ├── favicon.ico ├── logo192.png ├── logo512.png ├── robots.txt ├── manifest.json └── index.html ├── src ├── styles │ ├── NavBar.scss │ ├── Profile.scss │ ├── Home.scss │ ├── MainStyles.css │ ├── AccountCreation.scss │ └── Login.scss ├── static │ ├── logo_bank.png │ └── on_success.jpg ├── components │ ├── Profile │ │ ├── Transactions.jsx │ │ ├── Transferences.jsx │ │ ├── MainContainerProfile.jsx │ │ ├── BankTransfersChart.jsx │ │ ├── AccountStatus.jsx │ │ └── ProfileDetail.jsx │ ├── Navegacion │ │ ├── ProfileCard.jsx │ │ ├── NavBar.jsx │ │ └── NavBarMenu.jsx │ ├── Dialogs │ │ └── DialogAlert.jsx │ └── AccountCreation │ │ ├── Step1AccountType.jsx │ │ ├── Step3AccountType.jsx │ │ ├── MainContainer.jsx │ │ └── Step2AccountType.jsx ├── setupTests.js ├── App.test.js ├── theme │ └── theme.js ├── index.css ├── reportWebVitals.js ├── conection │ ├── example.conection.js │ ├── aeditip.postman_environment.v10.json │ └── aeditip.postman_collection.v10.json ├── pages │ ├── AccountCreation.js │ ├── Usuario.js │ └── Login.js ├── index.js ├── App.css ├── MainApp.js ├── AppEjemplo.js └── logo.svg ├── .gitignore ├── package.json └── README.md /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JinSSJ3/ejemplo-react/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JinSSJ3/ejemplo-react/HEAD/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JinSSJ3/ejemplo-react/HEAD/public/logo512.png -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/styles/NavBar.scss: -------------------------------------------------------------------------------- 1 | .logo-container{ 2 | height: fit-content; 3 | width: auto; 4 | 5 | } -------------------------------------------------------------------------------- /src/static/logo_bank.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JinSSJ3/ejemplo-react/HEAD/src/static/logo_bank.png -------------------------------------------------------------------------------- /src/static/on_success.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JinSSJ3/ejemplo-react/HEAD/src/static/on_success.jpg -------------------------------------------------------------------------------- /src/styles/Profile.scss: -------------------------------------------------------------------------------- 1 | .profile-body{ 2 | background-color: 3 | rgba(255, 255, 255, 0.74); 4 | padding: 2% 4%; 5 | border-radius: 8px; 6 | } -------------------------------------------------------------------------------- /src/components/Profile/Transactions.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const Transactions = props =>{ 4 | return( 5 |
6 | Transacciones 7 |
8 | ) 9 | } 10 | export default Transactions; -------------------------------------------------------------------------------- /src/components/Profile/Transferences.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const Transferences = props =>{ 4 | return( 5 |
6 | Transferencias histoicas 7 |
8 | ) 9 | } 10 | export default Transferences; -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/styles/Home.scss: -------------------------------------------------------------------------------- 1 | .home-page-wrapper { 2 | min-height: 100vh; 3 | width: 100%; 4 | background-image: linear-gradient( 5 | to bottom, 6 | rgba(0, 0, 0, 0.55), 7 | rgba(0, 0, 0, 0.55) 8 | ), 9 | url("https://assets-global.website-files.com/5f4f67c5950db17954dd4f52/5f5b7704da8b97990b5107fa_tipos-de-banco.jpeg"); 10 | } 11 | -------------------------------------------------------------------------------- /src/theme/theme.js: -------------------------------------------------------------------------------- 1 | import { createTheme } from "@material-ui/core"; 2 | 3 | const mainTheme = createTheme({ 4 | palette:{ 5 | primary:{ 6 | light:"#EDF5E1", 7 | main:"#05386B" 8 | }, 9 | secondary:{ 10 | light:"#EDF5E1", 11 | main:"#5CDB95" 12 | } 13 | } 14 | }); 15 | export default mainTheme; -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/conection/example.conection.js: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | 3 | export const llamadaPaisesAPI = async() => { 4 | let response = undefined; 5 | 6 | try { 7 | const paisesVar = await axios.get("https://restcountries.eu/rest/v2/all"); 8 | if (paisesVar && paisesVar.data) { 9 | response = paisesVar.data; 10 | } else { 11 | response = undefined; 12 | } 13 | } catch (error) { 14 | console.error(error); 15 | } 16 | 17 | return response; 18 | }; 19 | -------------------------------------------------------------------------------- /src/styles/MainStyles.css: -------------------------------------------------------------------------------- 1 | .main-container { 2 | background-image: linear-gradient(to top, 3 | rgba(0, 0, 0, 0.65), 4 | rgba(0, 0, 0, 0.55)), 5 | url("https://assets-global.website-files.com/5f4f67c5950db17954dd4f52/5f5b7704da8b97990b5107fa_tipos-de-banco.jpeg"); 6 | background-repeat: no-repeat; 7 | background-size: cover; 8 | background-position: center; 9 | 10 | min-height: 600px; 11 | min-height: calc(100vh - 65px); 12 | } 13 | .main-container.profile{ 14 | min-height: 100vh; 15 | } -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /src/pages/AccountCreation.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "../styles/AccountCreation.scss"; 3 | import NavBar from "../components/Navegacion/NavBar"; 4 | import MainContainer from "../components/AccountCreation/MainContainer"; 5 | const AccountCreation = (props) => { 6 | //const [finalStage, setFinalStage] = useState(false); 7 | 8 | return ( 9 |
10 | 11 |
12 | 13 |
14 |
15 | ); 16 | }; 17 | export default AccountCreation; 18 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 14 | 15 | 16 | React App Ejemplo 17 | 18 | 19 | 20 |
21 | 22 |
23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /src/components/Profile/MainContainerProfile.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import HomeAccount from "./AccountStatus"; 3 | import ProfileDetail from "./ProfileDetail"; 4 | import Transactions from "./Transactions"; 5 | import Transferences from "./Transferences"; 6 | const OptionSelector = (id, props) => { 7 | switch (id) { 8 | case "home": 9 | return ; 10 | case "profile": 11 | return ; 12 | case "transactions": 13 | return ; 14 | case "transferences": 15 | return ; 16 | } 17 | }; 18 | const MainContainerProfile = (props) => { 19 | const { id } = props; 20 | return
{OptionSelector(id, props)}
; 21 | }; 22 | export default MainContainerProfile; 23 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | //import App from './AppEjemplo'; 5 | import reportWebVitals from './reportWebVitals'; 6 | import { ThemeProvider } from '@material-ui/core'; 7 | import mainTheme from './theme/theme'; 8 | import MainApp from './MainApp'; 9 | 10 | ReactDOM.render( 11 | 12 | 13 | 14 | 15 | 16 | , 17 | document.getElementById('ejemplo-react') 18 | ); 19 | 20 | // If you want to start measuring performance in your app, pass a function 21 | // to log results (for example: reportWebVitals(console.log)) 22 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 23 | reportWebVitals(); 24 | -------------------------------------------------------------------------------- /src/components/Profile/BankTransfersChart.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Line } from "react-chartjs-2"; 3 | import { useState } from "react"; 4 | 5 | import { useEffect } from "react"; 6 | //import { getFakeDataChart } from "../../Conexion/User/user"; 7 | 8 | const BankTransfersChart = (props) => { 9 | const [dataMovements, setDataMovements] = useState({}); 10 | 11 | useEffect(() => { 12 | callData(); 13 | }, []); 14 | 15 | const callData = async () => { 16 | 17 | let auxDatosGenerales = []; 18 | //await getFakeDataChart(); 19 | 20 | setDataMovements(auxDatosGenerales); 21 | }; 22 | 23 | return ( 24 |
25 |

Ingresos vs Egresos

26 | 27 |
28 | ); 29 | }; 30 | 31 | export default BankTransfersChart; 32 | -------------------------------------------------------------------------------- /src/styles/AccountCreation.scss: -------------------------------------------------------------------------------- 1 | .account-creation-container { 2 | padding: 3%; 3 | display: flex; 4 | align-items: center; 5 | justify-content: center; 6 | @media (max-width: 600px) { 7 | padding: 1%; 8 | 9 | } 10 | .step-container { 11 | padding: 1%; 12 | 13 | .step-instruction { 14 | font-size: 1.5em; 15 | } 16 | } 17 | .country-selection { 18 | display: flex; 19 | flex-direction: row; 20 | align-items: center; 21 | justify-content: space-around; 22 | } 23 | } 24 | .step-content { 25 | display: flex; 26 | flex-direction: row; 27 | align-items: center; 28 | justify-content: space-evenly; 29 | border-radius: 6px; 30 | padding: 2%; 31 | //background-color: rgba(255, 255, 255, 0.295); 32 | 33 | @media (max-width: 600px) { 34 | flex-direction: column; 35 | justify-content: stretch; 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /src/components/Navegacion/ProfileCard.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { makeStyles } from "@material-ui/core/styles"; 3 | import { red } from "@material-ui/core/colors"; 4 | 5 | import Card from "@material-ui/core/Card"; 6 | import CardHeader from "@material-ui/core/CardHeader"; 7 | 8 | import Avatar from "@material-ui/core/Avatar"; 9 | 10 | const useStyles = makeStyles((theme) => ({ 11 | root: { 12 | maxWidth: "100%", 13 | }, 14 | avatar: { 15 | backgroundColor: red[500], 16 | }, 17 | })); 18 | const ProfileCard = (props) => { 19 | const classes = useStyles(); 20 | return ( 21 | 22 | 25 | {props.nombre.charAt(0)} 26 | 27 | } 28 | title={props.nombre} 29 | subheader={(new Date()).toLocaleDateString()} 30 | /> 31 | 32 | ); 33 | }; 34 | export default ProfileCard; 35 | -------------------------------------------------------------------------------- /src/pages/Usuario.js: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import "../styles/Home.scss"; 3 | import NavBarMenu from "../components/Navegacion/NavBarMenu"; 4 | import "../styles/Profile.scss"; 5 | import MainContainerPage from "../components/Profile/MainContainerProfile"; 6 | 7 | const Usuario = (props) => { 8 | const handleCerrarSesion = () => { 9 | props.history.push("/"); 10 | }; 11 | const [idPage, setIdPage] = useState("home"); 12 | 13 | const handleSelectedOption = (id) => { 14 | setIdPage(id); 15 | }; 16 | return ( 17 |
18 |
19 | 24 | 25 | 26 | 27 |
28 |
29 | ); 30 | }; 31 | export default Usuario; 32 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ejemplo-react", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@material-ui/core": "^4.12.3", 7 | "@material-ui/icons": "^4.11.2", 8 | "@material-ui/lab": "^4.0.0-alpha.60", 9 | "@testing-library/jest-dom": "^5.14.1", 10 | "@testing-library/react": "^11.2.7", 11 | "@testing-library/user-event": "^12.8.3", 12 | "axios": "^0.21.1", 13 | "base-64": "^1.0.0", 14 | "chart.js": "^3.5.1", 15 | "node-sass": "^6.0.1", 16 | "react": "^17.0.2", 17 | "react-chartjs-2": "^3.0.4", 18 | "react-dom": "^17.0.2", 19 | "react-router-dom": "^5.2.0", 20 | "react-scripts": "4.0.3", 21 | "web-vitals": "^1.1.2" 22 | }, 23 | "scripts": { 24 | "start": "react-scripts start", 25 | "build": "react-scripts build", 26 | "test": "react-scripts test", 27 | "eject": "react-scripts eject" 28 | }, 29 | "eslintConfig": { 30 | "extends": [ 31 | "react-app", 32 | "react-app/jest" 33 | ] 34 | }, 35 | "browserslist": { 36 | "production": [ 37 | ">0.2%", 38 | "not dead", 39 | "not op_mini all" 40 | ], 41 | "development": [ 42 | "last 1 chrome version", 43 | "last 1 firefox version", 44 | "last 1 safari version" 45 | ] 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | height: 40vmin; 7 | pointer-events: none; 8 | } 9 | 10 | @media (prefers-reduced-motion: no-preference) { 11 | .App-logo { 12 | animation: App-logo-spin infinite 20s linear; 13 | } 14 | } 15 | 16 | .App-header { 17 | background-color: #282c34; 18 | min-height: 100vh; 19 | display: flex; 20 | flex-direction: column; 21 | align-items: center; 22 | justify-content: center; 23 | font-size: calc(10px + 2vmin); 24 | color: white; 25 | } 26 | 27 | .App-link { 28 | color: #61dafb; 29 | } 30 | 31 | @keyframes App-logo-spin { 32 | from { 33 | transform: rotate(0deg); 34 | } 35 | 36 | to { 37 | transform: rotate(360deg); 38 | } 39 | } 40 | 41 | .contenedor { 42 | min-height: 100vh; 43 | width: 100%; 44 | display: flex; 45 | flex-direction: column; 46 | align-items: center; 47 | justify-content: space-between; 48 | /* background-image: url("https://cnnespanol.cnn.com/wp-content/uploads/2016/01/bancos-precios-petrocc81leo-precc81stamos-bancarrota.jpeg?quality=100&strip=info"); 49 | */ 50 | background-color: #282c34; 51 | 52 | } 53 | 54 | .formulario { 55 | background-color: white; 56 | /* height: 150px; */ 57 | width: 180px; 58 | margin: 2%; 59 | padding: 1%; 60 | border-radius: 4px; 61 | 62 | } -------------------------------------------------------------------------------- /src/MainApp.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { BrowserRouter, Route } from "react-router-dom"; 3 | import AppEjemplo from "./AppEjemplo"; 4 | import AccountCreation from "./pages/AccountCreation"; 5 | import Login from "./pages/Login"; 6 | import Usuario from "./pages/Usuario"; 7 | 8 | const MainApp = (props) => { 9 | return ( 10 |
11 | 12 | ( 16 | 17 | )} 18 | /> 19 | ( 23 | 27 | )} 28 | /> 29 | ( 33 | 37 | )} 38 | /> 39 | } 43 | /> 44 | 45 |
46 | ); 47 | }; 48 | export default MainApp; 49 | -------------------------------------------------------------------------------- /src/components/Navegacion/NavBar.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { makeStyles } from "@material-ui/core/styles"; 3 | import AppBar from "@material-ui/core/AppBar"; 4 | import Toolbar from "@material-ui/core/Toolbar"; 5 | import Typography from "@material-ui/core/Typography"; 6 | import Button from "@material-ui/core/Button"; 7 | //import IconButton from "@material-ui/core/IconButton"; 8 | //import MenuIcon from "@material-ui/icons/Menu"; 9 | import logo from "./../../static/logo_bank.png"; 10 | const Estilos = makeStyles((theme) => ({ 11 | root: { 12 | flexGrow: 1, 13 | }, 14 | menuButton: { 15 | marginRight: theme.spacing(2), 16 | }, 17 | title: { 18 | flexGrow: 1, 19 | }, 20 | logo: { 21 | height: "65px", 22 | [theme.breakpoints.down("md")]: { 23 | height: "45px", 24 | }, 25 | }, 26 | logoImg: { 27 | width: "100%", 28 | height: "100%", 29 | }, 30 | })); 31 | 32 | const NavBar = (props) => { 33 | const { title } = props; 34 | const classes = Estilos(); 35 | 36 | return ( 37 |
38 | 39 | 40 |
41 | logo-bank 42 |
43 | 44 | {title || ""} 45 | 46 | 47 | 48 | 49 |
50 | ); 51 | }; 52 | export default NavBar; 53 | -------------------------------------------------------------------------------- /src/styles/Login.scss: -------------------------------------------------------------------------------- 1 | .login-container { 2 | display: flex; 3 | height: 100%; 4 | width: 100%; 5 | flex-direction: column; 6 | align-items: center; 7 | justify-content: flex-end; 8 | .login-form { 9 | background-color: rgba(255, 255, 255, 0.096); 10 | display: flex; 11 | flex-direction: column; 12 | } 13 | } 14 | 15 | .login.ccontainer { 16 | background-image: linear-gradient( 17 | to top, 18 | rgba(0, 0, 0, 0.65), 19 | rgba(0, 0, 0, 0.55) 20 | ), 21 | url("https://assets-global.website-files.com/5f4f67c5950db17954dd4f52/5f5b7704da8b97990b5107fa_tipos-de-banco.jpeg"); 22 | background-repeat: no-repeat; 23 | background-size: cover; 24 | background-position: center; 25 | display: flex; 26 | flex-direction: row; 27 | min-height: 600px; 28 | height: calc(100vh - 65px); 29 | align-items: center; 30 | justify-content: flex-end; 31 | //background-color: teal; 32 | } 33 | 34 | .login.ccontainer .form { 35 | margin: 7%; 36 | border-radius: 4px; 37 | padding: 2% 2%; 38 | display: flex; 39 | flex-direction: column; 40 | align-items: center; 41 | width: 400px; 42 | background-color: rgba(255, 255, 255, 0.6); 43 | .anchor { 44 | text-decoration: underline; 45 | cursor: pointer; 46 | color: blue; 47 | &:active { 48 | color: purple; 49 | } 50 | } 51 | img { 52 | border-radius: 4px; 53 | width: 87%; 54 | margin-bottom: 5%; 55 | } 56 | a { 57 | cursor: pointer; 58 | align-self: flex-end; 59 | margin-top: 3%; 60 | // text-decoration: line-through; 61 | } 62 | } 63 | 64 | //mobile 65 | @media screen and (max-width: 960px) { 66 | .login.ccontainer { 67 | justify-content: center; 68 | align-items: center; 69 | } 70 | 71 | .login.ccontainer .form { 72 | width: 80%; 73 | margin: 2%; 74 | img { 75 | width: 65%; 76 | margin-bottom: 5%; 77 | } 78 | } 79 | } 80 | -------------------------------------------------------------------------------- /src/AppEjemplo.js: -------------------------------------------------------------------------------- 1 | //import logo from "./logo.svg"; 2 | import "./App.css"; 3 | import { useEffect, useState } from "react"; 4 | import { Button } from "@material-ui/core"; 5 | //import axios from "axios"; 6 | import { llamadaPaisesAPI } from "./conection/example.conection"; 7 | 8 | function AppEjemplo(props) { 9 | const [paises, setPaises] = useState([]); 10 | const llamadaBackend = async (endpoint) => { 11 | const paisesVar = await llamadaPaisesAPI(); 12 | 13 | setPaises(paisesVar || []); 14 | console.log("Paises", paisesVar); 15 | }; 16 | useEffect(() => { 17 | llamadaBackend(); 18 | }, []); 19 | 20 | useEffect(() => { 21 | return () => { 22 | document.title = "--------"; 23 | }; 24 | }, []); 25 | const { history, owner } = props; 26 | 27 | const [nombre, setNombre] = useState(""); 28 | 29 | const recibirNombre = (event) => { 30 | setNombre(event.target.value); 31 | document.title = event.target.value; 32 | }; 33 | function clickRegistrar() { 34 | //setNombre(".-."); 35 | props.history.push("/"); 36 | } 37 | const mmmlll = () => { 38 | setNombre("Contained"); 39 | }; 40 | return ( 41 |
42 |
43 |

{`Owner: ${owner}`}

44 |

{nombre}

45 | 46 | 49 | 52 | 53 |
    54 | {paises.map((pais, index) => ( 55 |
  1. {pais.name + " - Poblacion:" + pais.population}
    2. 56 | ))} 57 |
58 |
59 |
60 | ); 61 | } 62 | 63 | export default AppEjemplo; 64 | -------------------------------------------------------------------------------- /src/components/Dialogs/DialogAlert.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Button from "@material-ui/core/Button"; 3 | import Dialog from "@material-ui/core/Dialog"; 4 | import DialogActions from "@material-ui/core/DialogActions"; 5 | import DialogContent from "@material-ui/core/DialogContent"; 6 | import DialogContentText from "@material-ui/core/DialogContentText"; 7 | import DialogTitle from "@material-ui/core/DialogTitle"; 8 | 9 | const DialogAlert = (props) => { 10 | const { 11 | onSuccess, 12 | onCancel, 13 | onClose, 14 | maxWidth, 15 | fullWidth, 16 | open, 17 | content, 18 | title, 19 | } = props; 20 | const handleSuccess = () => { 21 | if (onSuccess) { 22 | onSuccess(); 23 | } 24 | handleClose(); 25 | }; 26 | const handleCancel = () => { 27 | if (onCancel) { 28 | onCancel(); 29 | } 30 | handleClose(); 31 | }; 32 | const handleClose = () => { 33 | if (onClose) { 34 | onClose(); 35 | } 36 | }; 37 | return ( 38 | 39 | 49 | {title || ""} 50 | 51 | {content || ""} 52 | 53 | 54 | {onCancel && ( 55 | 58 | )} 59 | {onSuccess && ( 60 | 63 | )} 64 | 65 | 66 | 67 | ); 68 | }; 69 | export default DialogAlert; 70 | -------------------------------------------------------------------------------- /src/conection/aeditip.postman_environment.v10.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "893ff3e9-68ea-4124-8587-4ee254db300f", 3 | "name": "Banco AEDITIP", 4 | "values": [ 5 | { 6 | "key": "sector-laboral", 7 | "value": "03", 8 | "enabled": true 9 | }, 10 | { 11 | "key": "pais", 12 | "value": "PER", 13 | "enabled": true 14 | }, 15 | { 16 | "key": "ubigeo-nive1", 17 | "value": "PER-030000", 18 | "enabled": true 19 | }, 20 | { 21 | "key": "ubigeo-nive2", 22 | "value": "PER-030700", 23 | "enabled": true 24 | }, 25 | { 26 | "key": "cliente-documentoIdent", 27 | "value": "10203040", 28 | "enabled": true 29 | }, 30 | { 31 | "key": "cliente-apellidoPaterno", 32 | "value": "Quispe", 33 | "enabled": true 34 | }, 35 | { 36 | "key": "cliente-apellidoMaterno", 37 | "value": "Vera", 38 | "enabled": true 39 | }, 40 | { 41 | "key": "cliente-prenombre", 42 | "value": "Justiniano", 43 | "enabled": true 44 | }, 45 | { 46 | "key": "cliente-fechaNac", 47 | "value": "1984-12-08", 48 | "enabled": true 49 | }, 50 | { 51 | "key": "cliente-direccion", 52 | "value": "Jr. San Cristóbal 1058", 53 | "enabled": true 54 | }, 55 | { 56 | "key": "cliente-ubigeo", 57 | "value": "PER-030708", 58 | "enabled": true 59 | }, 60 | { 61 | "key": "cliente-codigoPostal", 62 | "value": "03830", 63 | "enabled": true 64 | }, 65 | { 66 | "key": "cliente-ocupacion", 67 | "value": "0301", 68 | "enabled": true 69 | }, 70 | { 71 | "key": "cliente-correoElectr", 72 | "value": "jquispev@gmail.com", 73 | "enabled": true 74 | }, 75 | { 76 | "key": "cliente-telefono", 77 | "value": "+51903851415", 78 | "enabled": true 79 | }, 80 | { 81 | "key": "cliente-contrasena", 82 | "value": "$Prueba202108!", 83 | "enabled": true 84 | }, 85 | { 86 | "key": "cuenta-tipo", 87 | "value": "1", 88 | "enabled": true 89 | }, 90 | { 91 | "key": "cuenta-numero", 92 | "value": "405123654845421", 93 | "enabled": true 94 | } 95 | ], 96 | "_postman_variable_scope": "environment", 97 | "_postman_exported_at": "2021-08-12T05:03:44.034Z", 98 | "_postman_exported_using": "Postman/8.10.0" 99 | } -------------------------------------------------------------------------------- /src/logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Getting Started with Create React App 2 | 3 | This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). 4 | 5 | ## Available Scripts 6 | 7 | In the project directory, you can run: 8 | 9 | ### `npm start` 10 | 11 | Runs the app in the development mode.\ 12 | Open [http://localhost:3000](http://localhost:3000) to view it in the browser. 13 | 14 | The page will reload if you make edits.\ 15 | You will also see any lint errors in the console. 16 | 17 | ### `npm test` 18 | 19 | Launches the test runner in the interactive watch mode.\ 20 | See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. 21 | 22 | ### `npm run build` 23 | 24 | Builds the app for production to the `build` folder.\ 25 | It correctly bundles React in production mode and optimizes the build for the best performance. 26 | 27 | The build is minified and the filenames include the hashes.\ 28 | Your app is ready to be deployed! 29 | 30 | See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. 31 | 32 | ### `npm run eject` 33 | 34 | **Note: this is a one-way operation. Once you `eject`, you can’t go back!** 35 | 36 | If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project. 37 | 38 | Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own. 39 | 40 | You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. 41 | 42 | ## Learn More 43 | 44 | You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). 45 | 46 | To learn React, check out the [React documentation](https://reactjs.org/). 47 | 48 | ### Code Splitting 49 | 50 | This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting) 51 | 52 | ### Analyzing the Bundle Size 53 | 54 | This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size) 55 | 56 | ### Making a Progressive Web App 57 | 58 | This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app) 59 | 60 | ### Advanced Configuration 61 | 62 | This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration) 63 | 64 | ### Deployment 65 | 66 | This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment) 67 | 68 | ### `npm run build` fails to minify 69 | 70 | This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify) 71 | -------------------------------------------------------------------------------- /src/components/AccountCreation/Step1AccountType.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Card from "@material-ui/core/Card"; 3 | import CardContent from "@material-ui/core/CardContent"; 4 | import Typography from "@material-ui/core/Typography"; 5 | import { makeStyles } from "@material-ui/core/styles"; 6 | import InputLabel from "@material-ui/core/InputLabel"; 7 | import MenuItem from "@material-ui/core/MenuItem"; 8 | import FormHelperText from "@material-ui/core/FormHelperText"; 9 | import FormControl from "@material-ui/core/FormControl"; 10 | import Select from "@material-ui/core/Select"; 11 | import { Grid } from "@material-ui/core"; 12 | import PaymentIcon from '@material-ui/icons/Payment'; 13 | const useStyles = makeStyles((theme) => ({ 14 | 15 | formControl: { 16 | margin: theme.spacing(1), 17 | minWidth: 120, 18 | width: "100%", 19 | }, 20 | selectEmpty: { 21 | marginTop: theme.spacing(2), 22 | }, 23 | })); 24 | const accounts = [ 25 | { name: "0 Costos", rate: 0.0005, beneficios: true }, 26 | { name: "Cuentas Transf.", rate: 1.5, beneficios: false }, 27 | ]; 28 | const Step1AccountType = (props) => { 29 | const classes = useStyles(); 30 | const [country, setCountry] = React.useState(""); 31 | const handleChange = (event) => { 32 | setCountry(event.target.value); 33 | }; 34 | return ( 35 |
36 | {" "} 37 | 38 | Elije un tipo de cuenta 39 | 40 |
41 | {accounts.map((account, index) => ( 42 | 43 | 44 | 45 | {account.name} 46 | 47 | 48 | {account.rate + "% interés"} 49 | 50 | 51 | {account.beneficios ? "Con beneficios" : "Sin beneficios"} 52 | 53 | 54 | 55 | ))} 56 |
57 | 58 | 59 | 60 | Seleccione su país de origen 61 | 62 | 63 | 64 | 65 | 66 | Pais 67 | 68 | 69 | 83 | Label + placeholder 84 | 85 | 86 | 87 | 88 | 89 | {"Acontinuación se le preguntara sobre ss datos personales para la" + 90 | "creación de la cuenta"} 91 | 92 | 93 | 94 | 95 |
96 | ); 97 | }; 98 | export default Step1AccountType; 99 | -------------------------------------------------------------------------------- /src/components/AccountCreation/Step3AccountType.jsx: -------------------------------------------------------------------------------- 1 | import { Grid, TextField, Typography } from "@material-ui/core"; 2 | import React from "react"; 3 | import Checkbox from "@material-ui/core/Checkbox"; 4 | import FormGroup from "@material-ui/core/FormGroup"; 5 | import FormControlLabel from "@material-ui/core/FormControlLabel"; 6 | import FormControl from "@material-ui/core/FormControl"; 7 | //import FormLabel from "@material-ui/core/FormLabel"; 8 | const Step3AccountType = (props) => { 9 | return ( 10 |
11 | 12 | Datos de contacto 13 | 14 | 15 | 16 | 29 | 30 | 31 | 32 | 45 | 46 | 47 | 60 | 61 | 62 | 63 | {" "} 64 | 65 | Contreseña 66 | 67 | 84 | 100 | 101 | 102 | 103 | Confirmación de consentimiento 104 | 105 | 106 | {/* Label Placement */} 107 | 108 | alert(e.target.value)} 110 | value={0} 111 | control={} 112 | label="He leído y acepto los términos y condiciones." 113 | labelPlacement="He leído y acepto los términos y condiciones." 114 | /> 115 | alert("presed")} 117 | value={1} 118 | control={} 119 | label="Estoy de acuerdo con brindar mis datos personales." 120 | labelPlacement="Estoy de acuerdo con brindar mis datos personales." 121 | /> 122 | 123 | 124 | 125 | 126 |
127 | ); 128 | }; 129 | export default Step3AccountType; 130 | -------------------------------------------------------------------------------- /src/components/AccountCreation/MainContainer.jsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment, useState } from "react"; 2 | import { makeStyles } from "@material-ui/core/styles"; 3 | import Stepper from "@material-ui/core/Stepper"; 4 | import Step from "@material-ui/core/Step"; 5 | import StepLabel from "@material-ui/core/StepLabel"; 6 | import Button from "@material-ui/core/Button"; 7 | import Typography from "@material-ui/core/Typography"; 8 | import Step1AccountType from "./Step1AccountType"; 9 | import { Grid } from "@material-ui/core"; 10 | import Step2AccountType from "./Step2AccountType"; 11 | import Step3AccountType from "./Step3AccountType"; 12 | import onSuccessImage from "./.././../static/on_success.jpg"; 13 | import DialogAlert from "../Dialogs/DialogAlert"; 14 | const useStyles = makeStyles((theme) => ({ 15 | root: { 16 | width: "80%", 17 | backgroundColor: "rgba(255, 255, 255, 0.795)", 18 | }, 19 | backButton: { 20 | marginRight: theme.spacing(1), 21 | }, 22 | instructions: { 23 | marginTop: theme.spacing(1), 24 | marginBottom: theme.spacing(1), 25 | //backgroundColor: "rgba(255, 255, 255, 0.295)", 26 | }, 27 | })); 28 | 29 | function getSteps() { 30 | return ["Tipo de cuenta", "Datos personales", "Datos de contacto"]; 31 | } 32 | 33 | function getStepContent(stepIndex, props) { 34 | switch (stepIndex) { 35 | case 0: 36 | return ; 37 | case 1: 38 | return ; 39 | case 2: 40 | return ; 41 | default: 42 | return "--"; 43 | } 44 | } 45 | const consultarCuenta = () => { 46 | return new Promise((resolve, reject) => { 47 | try { 48 | setTimeout(() => { 49 | resolve("561-6132-165-635165-635130"); 50 | }, 2000); 51 | } catch (error) { 52 | reject(""); 53 | } 54 | }); 55 | }; 56 | const contentOk = (numCuentaCreada) => ( 57 | 58 | onSuccness 66 | {`Felicitaciones su cuenta ha sido creada satisfactoriamente ${numCuentaCreada}`} 67 | 68 | ); 69 | const contentBad = ( 70 | 71 | {`Lo sentimos, su cuenta no fue creada satisfactoriamente`} 72 | 73 | ); 74 | const MainContainer = (props) => { 75 | const classes = useStyles(); 76 | //const [data,setData] = React.useState({}); 77 | const [activeStep, setActiveStep] = React.useState(0); 78 | const [openDialog, setOpenDialog] = React.useState(false); 79 | const [numCuentaCreada, setnumCuentaCreada] = React.useState(""); 80 | const [contentDialog, setContentDialog] = useState(<>); 81 | 82 | const crearCuenta = async (data) => { 83 | 84 | 85 | 86 | const result = await consultarCuenta(); 87 | if (result === "") { 88 | setContentDialog(contentBad); 89 | } else { 90 | setnumCuentaCreada(result); 91 | setContentDialog(contentOk(numCuentaCreada)); 92 | } 93 | handleOpenDialog(); 94 | }; 95 | const handleCloseDialog = () => { 96 | setOpenDialog(false); 97 | }; 98 | const handleOpenDialog = () => { 99 | setOpenDialog(true); 100 | }; 101 | const steps = getSteps(); 102 | 103 | const handleNext = () => { 104 | setActiveStep((prevActiveStep) => prevActiveStep + 1); 105 | }; 106 | 107 | const handleBack = () => { 108 | setActiveStep((prevActiveStep) => prevActiveStep - 1); 109 | }; 110 | 111 | return ( 112 |
113 | 118 | {steps.map((label) => ( 119 | 120 | {label} 121 | 122 | ))} 123 | 124 | 125 |
126 | 127 | {getStepContent(activeStep, props)} 128 | 129 | 135 | 136 | 146 | 147 | 148 | 149 | 157 | 166 | 167 | 168 |
169 | 170 | { 173 | if (numCuentaCreada !== "") props.history.push("/"); 174 | }} 175 | /* onCancel={() => { 176 | alert("Se canceló la operación"); 177 | }} */ 178 | maxWidth={"xs"} 179 | fullWidth={true} 180 | open={openDialog} 181 | content={contentDialog} 182 | title={numCuentaCreada === "" ? "Lo sentimos :(" : "Felicitaciones"} 183 | /> 184 |
185 | ); 186 | }; 187 | export default MainContainer; 188 | -------------------------------------------------------------------------------- /src/pages/Login.js: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import "../styles/Home.scss"; 3 | import { Button, makeStyles, TextField } from "@material-ui/core"; 4 | import NavBar from "../components/Navegacion/NavBar"; 5 | import "../styles/Login.scss"; 6 | import logo from "../static/logo_bank.png"; 7 | import axios from "axios"; 8 | let base64 = require("base-64"); 9 | const useStyles = makeStyles((theme) => ({ 10 | logo: { 11 | height: "165px", 12 | 13 | [theme.breakpoints.down("sm")]: { 14 | height: "100px", 15 | }, 16 | }, 17 | logoImg: { 18 | width: "100%", 19 | height: "100%", 20 | }, 21 | })); 22 | 23 | const Login = (props) => { 24 | const classes = useStyles(); 25 | const [usuarioLogin, setUsuario] = useState({ 26 | email: "", 27 | password: "", 28 | }); 29 | function ingresoDeCorreooo(event) { 30 | setUsuario({ 31 | ...usuarioLogin, 32 | ...{ email: event.target.value }, 33 | }); 34 | console.log("login", event.target.value); 35 | } 36 | const handleChangePassword = (event) => { 37 | setUsuario({ ...usuarioLogin, ...{ password: event.target.value } }); 38 | console.log("login pass", event.target.value); 39 | }; 40 | const handleIniciarSesion = async () => { 41 | const body = { 42 | usuario: usuarioLogin.email, 43 | clave: usuarioLogin.password, 44 | }; 45 | try { 46 | const response = await axios.post( 47 | "http://ec2-44-193-230-143.compute-1.amazonaws.com:8081/logueo", 48 | body 49 | ); 50 | 51 | console.log("LOGIN:", response.data); 52 | if (response.data.exito) { 53 | alert("Iniciar sesion correcto"); 54 | 55 | props.history.push("/user"); 56 | } else { 57 | alert("Error"); 58 | } 59 | 60 | //localStorage("credenciales"); 61 | 62 | /* const headers = { 63 | Authorization: 64 | "Basic " + 65 | base64.encode(usuarioLogin.email + ":" + usuarioLogin.password), 66 | }; */ 67 | /* let config = { 68 | headers: { 69 | Authorization: 70 | "Basic " + 71 | base64.encode(usuarioLogin.email + ":" + usuarioLogin.password), 72 | }, 73 | }; */ 74 | /* const response2 = await axios.get( 75 | "http://ec2-44-193-230-143.compute-1.amazonaws.com:8081/api/transferencias/verificar-cuenta?numero=405123654845421" 76 | //,config 77 | ); 78 | */ 79 | //console.log("LOGIN:", response2); 80 | } catch (error) { 81 | console.log("LOGIN:", "No conection"); 82 | } 83 | 84 | //props.history.push("/user"); 85 | }; 86 | const handleCrearCuenta = () => { 87 | props.history.push("/account-creation"); 88 | }; 89 | const iniciarSesion = async (props) => { 90 | console.log("Iniciar sesion"); 91 | }; 92 | return ( 93 |
94 | 95 |
96 |
97 |
98 | logo-banco-login 103 |
104 | { 106 | if (event.keyCode === 13) { 107 | // Cancel the default action, if needed 108 | event.preventDefault(); 109 | // Trigger the button element with a click 110 | iniciarSesion(); 111 | } 112 | }} 113 | fullWidth 114 | style={{ margin: "4% 2%" }} 115 | id="outlined-email-input" 116 | label="Correo" 117 | type="email" 118 | autoComplete="current-password" 119 | variant="outlined" 120 | onChange={ingresoDeCorreooo} 121 | value={usuarioLogin.email} 122 | /> 123 | 124 | { 126 | if (event.keyCode === 13) { 127 | // Cancel the default action, if needed 128 | event.preventDefault(); 129 | // Trigger the button element with a click 130 | iniciarSesion(); 131 | } 132 | }} 133 | fullWidth 134 | style={{ margin: "4% 2%" }} 135 | id="outlined-password-input" 136 | label="Password" 137 | type="password" 138 | autoComplete="current-password" 139 | variant="outlined" 140 | onChange={handleChangePassword} 141 | value={usuarioLogin.password} 142 | /> 143 | 144 |
alert("Recuperar password")} 148 | > 149 | Recuperar contraseña 150 |
151 | 152 | 161 |
o
162 | 171 |
172 |
173 | {/* ESTE es el LOGIN CTV 174 | 175 | 176 | 177 | */} 178 |
179 | ); 180 | }; 181 | export default Login; 182 | -------------------------------------------------------------------------------- /src/components/Profile/AccountStatus.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Button, 3 | Card, 4 | CardContent, 5 | FormControl, 6 | FormHelperText, 7 | Grid, 8 | InputLabel, 9 | makeStyles, 10 | MenuItem, 11 | Paper, 12 | Select, 13 | Typography, 14 | } from "@material-ui/core"; 15 | import React, { useEffect, useState } from "react"; 16 | import BankTransfersChart from "./BankTransfersChart"; 17 | import PaymentIcon from "@material-ui/icons/Payment"; 18 | import VisibilityIcon from "@material-ui/icons/Visibility"; 19 | const now = new Date(); 20 | const useStyles = makeStyles((theme) => ({ 21 | formControl: { 22 | margin: theme.spacing(1), 23 | minWidth: 120, 24 | width: "100%", 25 | }, 26 | button: { 27 | margin: theme.spacing(1), 28 | minWidth: 120, 29 | width: "100%", 30 | }, 31 | selectEmpty: { 32 | marginTop: theme.spacing(2), 33 | }, 34 | root: { 35 | minWidth: 270, 36 | border: "2px solid teal", 37 | }, 38 | 39 | pos: { 40 | marginBottom: 0, 41 | }, 42 | })); 43 | const getAccounts = () => { 44 | return new Promise((resolve, reject) => { 45 | try { 46 | setTimeout(() => { 47 | resolve([ 48 | { name: "0 Costos", rate: 0.0005, beneficios: true }, 49 | { name: "Cuentas Transf.", rate: 1.5, beneficios: false }, 50 | ]); 51 | }, 3000); 52 | } catch (error) { 53 | reject([]); 54 | } 55 | }); 56 | }; 57 | 58 | const AccountStatus = (props) => { 59 | const classes = useStyles(); 60 | const [selectedAccount, setSelectedAccount] = useState(""); 61 | const [accountList, setAccountList] = useState([]); 62 | const getData = async () => { 63 | const accounts = await getAccounts(); 64 | setAccountList(accounts); 65 | 66 | console.log("accounts", accounts[0].name); 67 | }; 68 | 69 | useEffect(() => { 70 | getData(); 71 | }, []); 72 | 73 | useEffect(() => { 74 | if (accountList && accountList.length > 0) { 75 | console.log("lista", accountList[0]); 76 | setSelectedAccount(accountList[0]); 77 | } 78 | }, [accountList]); 79 | const handleSelectedAccount = (event) => { 80 | setSelectedAccount(event.target.value); 81 | console.log("accounts sel", event.target.value.name); 82 | }; 83 | return ( 84 | 85 | 92 | 93 | 94 | {`Estado de Cuenta al ${now.toLocaleDateString()}:`} 95 | 96 | 97 | 98 | 99 | 100 | 101 | 105 | Seleccione su cuenta 106 | 107 | 108 | 121 | Lista de Cuentas 122 | 123 | 124 | 125 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | {selectedAccount.name || "..."} 144 | 145 | 146 | {selectedAccount.rate + "% interés"} 147 | 148 | 149 | {selectedAccount.beneficios 150 | ? "Con beneficios" 151 | : "Sin beneficios"} 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | Saldo disponible 160 | 161 | 162 | 163 | $ 20.00 164 | 165 | 166 | 167 | 168 | Ultima operacion 169 | 170 | 171 | {now.toLocaleTimeString()} 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | Account ststus 182 | 183 | ); 184 | }; 185 | export default AccountStatus; 186 | -------------------------------------------------------------------------------- /src/components/Profile/ProfileDetail.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Button, 3 | FormControl, 4 | FormHelperText, 5 | Grid, 6 | InputLabel, 7 | makeStyles, 8 | MenuItem, 9 | Paper, 10 | Select, 11 | TextField, 12 | Typography, 13 | } from "@material-ui/core"; 14 | import React, { Fragment } from "react"; 15 | const useStyles = makeStyles((theme) => ({ 16 | formControl: { 17 | margin: theme.spacing(1), 18 | minWidth: 120, 19 | width: "100%", 20 | }, 21 | selectEmpty: { 22 | marginTop: theme.spacing(2), 23 | }, 24 | })); 25 | const ProfileDetail = (props) => { 26 | const [sectorLaboral, setSectorLaboral] = React.useState(""); 27 | const [ocupacion, setOcupacion] = React.useState(""); 28 | const [editMode, seteditMode] = React.useState(false); 29 | const handlesector = (event) => { 30 | setSectorLaboral(event.target.value); 31 | }; 32 | const handleOcupacion = (event) => { 33 | setOcupacion(event.target.value); 34 | }; 35 | const classes = useStyles(); 36 | const handleEditProfile = () => { 37 | alert("datos editados"); 38 | seteditMode(false); 39 | }; 40 | return ( 41 | 42 | 43 | 44 | Perfil 45 | 46 | 47 | 48 | 61 | 74 | 87 | 100 | 101 | 102 | 115 | 128 | 129 | 130 | 134 | Sector Laboral 135 | 136 | 150 | Label + placeholder 151 | 152 | 153 | 154 | 158 | Ocupacion 159 | 160 | 174 | Label + placeholder 175 | 176 | 177 | 178 | 179 | 180 | 187 | 188 | 195 | 196 | 197 | ); 198 | }; 199 | export default ProfileDetail; 200 | -------------------------------------------------------------------------------- /src/components/Navegacion/NavBarMenu.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AppBar from "@material-ui/core/AppBar"; 3 | import CssBaseline from "@material-ui/core/CssBaseline"; 4 | import Divider from "@material-ui/core/Divider"; 5 | import Drawer from "@material-ui/core/Drawer"; 6 | import Hidden from "@material-ui/core/Hidden"; 7 | import IconButton from "@material-ui/core/IconButton"; 8 | import List from "@material-ui/core/List"; 9 | import ListItem from "@material-ui/core/ListItem"; 10 | import ListItemIcon from "@material-ui/core/ListItemIcon"; 11 | import ListItemText from "@material-ui/core/ListItemText"; 12 | import MenuIcon from "@material-ui/icons/Menu"; 13 | import Toolbar from "@material-ui/core/Toolbar"; 14 | import Typography from "@material-ui/core/Typography"; 15 | import { makeStyles, useTheme } from "@material-ui/core/styles"; 16 | import logo from "../../static/logo_bank.png"; 17 | import HomeIcon from "@material-ui/icons/Home"; 18 | import AccountCircleIcon from "@material-ui/icons/AccountCircle"; 19 | import CreditCardIcon from "@material-ui/icons/CreditCard"; 20 | import SyncAltIcon from "@material-ui/icons/SyncAlt"; 21 | import ExitToAppIcon from "@material-ui/icons/ExitToApp"; 22 | import ProfileCard from "./ProfileCard"; 23 | const drawerWidth = 240; 24 | 25 | const useStyles = makeStyles((theme) => ({ 26 | root: { 27 | display: "flex", 28 | }, 29 | drawer: { 30 | [theme.breakpoints.up("sm")]: { 31 | width: drawerWidth, 32 | flexShrink: 0, 33 | }, 34 | }, 35 | appBar: { 36 | [theme.breakpoints.up("sm")]: { 37 | width: `calc(100% - ${drawerWidth}px)`, 38 | marginLeft: drawerWidth, 39 | }, 40 | }, 41 | menuButton: { 42 | marginRight: theme.spacing(2), 43 | [theme.breakpoints.up("sm")]: { 44 | display: "none", 45 | }, 46 | }, 47 | // necessary for content to be below app bar 48 | toolbar: theme.mixins.toolbar, 49 | drawerPaper: { 50 | width: drawerWidth, 51 | }, 52 | content: { 53 | flexGrow: 1, 54 | padding: theme.spacing(7), 55 | }, 56 | logo: { 57 | height: "65px", 58 | 59 | [theme.breakpoints.down("sm")]: { 60 | height: "45px", 61 | }, 62 | }, 63 | logoImg: { 64 | width: "100%", 65 | height: "100%", 66 | }, 67 | })); 68 | const NavBarMenu = (props) => { 69 | const { window, children, handleSelectedOption, handleCerrarSesion } = props; 70 | const classes = useStyles(); 71 | const theme = useTheme(); 72 | const [mobileOpen, setMobileOpen] = React.useState(false); 73 | 74 | const handleCerrarSesionNavBar = () => { 75 | if (handleCerrarSesion) { 76 | handleCerrarSesion(); 77 | } 78 | }; 79 | const handleDrawerToggle = () => { 80 | setMobileOpen(!mobileOpen); 81 | }; 82 | 83 | const drawer = ( 84 |
85 | 86 | 87 | 88 | { 92 | handleSelectedOption("home"); 93 | }} 94 | > 95 | 96 | 97 | 98 | 99 | 100 | 101 | { 105 | handleSelectedOption("profile"); 106 | }} 107 | > 108 | 109 | 110 | 111 | 112 | 113 | 114 | { 118 | handleSelectedOption("transactions"); 119 | }} 120 | > 121 | 122 | 123 | 124 | 125 | 126 | { 130 | handleSelectedOption("transferences"); 131 | }} 132 | > 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 146 | 147 | 148 | 149 | 150 | 151 | 152 |
153 | ); 154 | 155 | const container = 156 | window !== undefined ? () => window().document.body : undefined; 157 | 158 | return ( 159 |
160 | 161 | 162 | 163 | 170 | 171 | 172 |
173 | banco-aeditip-logo 178 |
179 | 180 | Banco Latinoamericano AEDITIP 181 | 182 | 183 | 184 | 185 | 216 |
217 |
218 | {children} 219 |
220 |
221 | ); 222 | }; 223 | export default NavBarMenu; 224 | -------------------------------------------------------------------------------- /src/components/AccountCreation/Step2AccountType.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | FormControl, 3 | FormHelperText, 4 | Grid, 5 | InputLabel, 6 | makeStyles, 7 | MenuItem, 8 | Select, 9 | TextField, 10 | Typography, 11 | } from "@material-ui/core"; 12 | import React from "react"; 13 | const useStyles = makeStyles((theme) => ({ 14 | root: { 15 | minWidth: 275, 16 | border: "2px solid teal", 17 | }, 18 | bullet: { 19 | display: "inline-block", 20 | margin: "0 2px", 21 | transform: "scale(0.8)", 22 | }, 23 | title: { 24 | fontSize: 14, 25 | }, 26 | pos: { 27 | marginBottom: 0, 28 | }, 29 | formControl: { 30 | margin: theme.spacing(1), 31 | minWidth: 120, 32 | width: "100%", 33 | }, 34 | selectEmpty: { 35 | marginTop: theme.spacing(2), 36 | }, 37 | })); 38 | const Step2AccountType = (props) => { 39 | const classes = useStyles(); 40 | 41 | const [region, setRegion] = React.useState(""); 42 | const [provincia, setProvincia] = React.useState(""); 43 | const [distrito, setDistrito] = React.useState(""); 44 | const [sectorLaboral, setSectorLaboral] = React.useState(""); 45 | const [ocupacion, setOcupacion] = React.useState(""); 46 | const handlesector = (event) => { 47 | setSectorLaboral(event.target.value); 48 | }; 49 | const handleOcupacion = (event) => { 50 | setOcupacion(event.target.value); 51 | }; 52 | const handleRegion = (event) => { 53 | setRegion(event.target.value); 54 | }; 55 | const handleProv = (event) => { 56 | setProvincia(event.target.value); 57 | }; 58 | const handleDistrito = (event) => { 59 | setDistrito(event.target.value); 60 | }; 61 | return ( 62 |
63 | 64 | Datos Personales 65 | 66 | 67 | 68 | 69 | 82 | 83 | 84 | 97 | 98 | 99 | 112 | 113 | 114 | 115 | 116 | {" "} 117 | 130 | 131 | 132 | 145 | 146 | 147 | 148 | 149 | 150 | 154 | Region 155 | 156 | 170 | Label + placeholder 171 | 172 | 173 | 174 | 175 | {/** */} 176 | 180 | Provincia 181 | 182 | 183 | 197 | Label + placeholder 198 | {/** */} 199 | 200 | 201 | 202 | 203 | 207 | Distrito 208 | 209 | 210 | 224 | Label + placeholder 225 | 226 | 227 | 228 | 229 | 230 | 243 | 244 | 245 | 258 | 259 | 260 | 261 | 262 | 263 | 267 | Sector Laboral 268 | 269 | 283 | Label + placeholder 284 | 285 | 286 | 287 | 288 | 292 | Ocupacion 293 | 294 | 308 | Label + placeholder 309 | 310 | 311 | 312 | 313 |
314 | ); 315 | }; 316 | export default Step2AccountType; 317 | -------------------------------------------------------------------------------- /src/conection/aeditip.postman_collection.v10.json: -------------------------------------------------------------------------------- 1 | { 2 | "info": { 3 | "_postman_id": "94bcb73c-9e70-47af-ba81-1e04f6b23cf7", 4 | "name": "Banco Latinoamericano AEDITIP", 5 | "schema": "https://schema.getpostman.com/json/collection/v2.1.0/collection.json" 6 | }, 7 | "item": [ 8 | { 9 | "name": "Administración de Usuarios", 10 | "item": [ 11 | { 12 | "name": "Inicio de sesión", 13 | "item": [ 14 | { 15 | "name": "Iniciar sesión", 16 | "request": { 17 | "method": "POST", 18 | "header": [], 19 | "body": { 20 | "mode": "raw", 21 | "raw": "{\r\n \"cliente\": \"[Usuario del Cliente (Dirección de Correo Electrónico)]\",\r\n \"contrasena\": \"[Contraseña del Cliente]\"\r\n}", 22 | "options": { 23 | "raw": { 24 | "language": "json" 25 | } 26 | } 27 | }, 28 | "url": { 29 | "raw": "{{servidor}}/api/logueo", 30 | "host": [ 31 | "{{servidor}}" 32 | ], 33 | "path": [ 34 | "api", 35 | "logueo" 36 | ] 37 | } 38 | }, 39 | "response": [ 40 | { 41 | "name": "Inicio de sesión exitoso", 42 | "originalRequest": { 43 | "method": "POST", 44 | "header": [], 45 | "body": { 46 | "mode": "raw", 47 | "raw": "{\r\n \"cliente\": \"jorge.fatama@pucp.edu.pe\",\r\n \"contrasena\": \"Banc4Segur4$\"\r\n}", 48 | "options": { 49 | "raw": { 50 | "language": "json" 51 | } 52 | } 53 | }, 54 | "url": { 55 | "raw": "{{servidor}}/api/logueo", 56 | "host": [ 57 | "{{servidor}}" 58 | ], 59 | "path": [ 60 | "api", 61 | "logueo" 62 | ] 63 | } 64 | }, 65 | "_postman_previewlanguage": "json", 66 | "header": null, 67 | "cookie": [], 68 | "body": "{\r\n \"codigo\": 400,\r\n \"token\": \"[Token de sesión]\"\r\n}" 69 | } 70 | ] 71 | } 72 | ] 73 | }, 74 | { 75 | "name": "Creación de usuario", 76 | "item": [ 77 | { 78 | "name": "Validaciones", 79 | "item": [ 80 | { 81 | "name": "Regionalización", 82 | "item": [ 83 | { 84 | "name": "Obtener divisiones regionales - Nivel 1", 85 | "request": { 86 | "method": "GET", 87 | "header": [], 88 | "url": { 89 | "raw": "{{servidor}}/api/validaciones/division-nacional?pais={{pais}}", 90 | "host": [ 91 | "{{servidor}}" 92 | ], 93 | "path": [ 94 | "api", 95 | "validaciones", 96 | "division-nacional" 97 | ], 98 | "query": [ 99 | { 100 | "key": "pais", 101 | "value": "{{pais}}" 102 | } 103 | ] 104 | } 105 | }, 106 | "response": [ 107 | { 108 | "name": "Perú", 109 | "originalRequest": { 110 | "method": "GET", 111 | "header": [], 112 | "url": { 113 | "raw": "{{servidor}}/api/validaciones/division-nacional?pais=PER", 114 | "host": [ 115 | "{{servidor}}" 116 | ], 117 | "path": [ 118 | "api", 119 | "validaciones", 120 | "division-nacional" 121 | ], 122 | "query": [ 123 | { 124 | "key": "pais", 125 | "value": "PER" 126 | } 127 | ] 128 | } 129 | }, 130 | "_postman_previewlanguage": "json", 131 | "header": null, 132 | "cookie": [], 133 | "body": "{\r\n \"nombres\": [\r\n \"Región\",\r\n \"Provincia\",\r\n \"Distrito\"\r\n ],\r\n \"divisiones\": [\r\n {\r\n \"clave\": \"PER-010000\",\r\n \"valor\": \"Amazonas\"\r\n },\r\n {\r\n \"clave\": \"PER-020000\",\r\n \"valor\": \"Áncash\"\r\n },\r\n {\r\n \"clave\": \"PER-030000\",\r\n \"valor\": \"Apurímac\"\r\n }\r\n ]\r\n}" 134 | }, 135 | { 136 | "name": "Ecuador", 137 | "originalRequest": { 138 | "method": "GET", 139 | "header": [], 140 | "url": { 141 | "raw": "{{servidor}}/api/validaciones/division-nacional?pais=ECU", 142 | "host": [ 143 | "{{servidor}}" 144 | ], 145 | "path": [ 146 | "api", 147 | "validaciones", 148 | "division-nacional" 149 | ], 150 | "query": [ 151 | { 152 | "key": "pais", 153 | "value": "ECU" 154 | } 155 | ] 156 | } 157 | }, 158 | "_postman_previewlanguage": "json", 159 | "header": null, 160 | "cookie": [], 161 | "body": "{\r\n \"nombres\":{\r\n \"division1\": \"Provincia\",\r\n \"division2\": \"Cantón\",\r\n \"division3\": \"Parroquia\"\r\n },\r\n \"divisiones\": [\r\n {\"codigo\": \"ECU-01\", \"nombre\": \"Azuay\"},\r\n {\"codigo\": \"ECU-02\", \"nombre\": \"Bolívar\"},\r\n {\"codigo\": \"ECU-03\", \"nombre\": \"Cañar\"}\r\n //[...]\r\n ]\r\n}" 162 | }, 163 | { 164 | "name": "Bolivia", 165 | "originalRequest": { 166 | "method": "GET", 167 | "header": [], 168 | "url": { 169 | "raw": "{{servidor}}/api/validaciones/division-nacional?pais=BOL", 170 | "host": [ 171 | "{{servidor}}" 172 | ], 173 | "path": [ 174 | "api", 175 | "validaciones", 176 | "division-nacional" 177 | ], 178 | "query": [ 179 | { 180 | "key": "pais", 181 | "value": "BOL" 182 | } 183 | ] 184 | } 185 | }, 186 | "_postman_previewlanguage": "json", 187 | "header": null, 188 | "cookie": [], 189 | "body": "{\r\n \"nombres\": [\r\n \"Departamento\",\r\n \"Provincia\",\r\n \"Municipio\"\r\n ],\r\n \"divisiones\": [\r\n {\r\n \"clave\": \"BOL-01\",\r\n \"valor\": \"Chuquisaca\"\r\n },\r\n {\r\n \"clave\": \"BOL-02\",\r\n \"valor\": \"La Paz\"\r\n },\r\n {\r\n \"clave\": \"BOL-03\",\r\n \"valor\": \"Cochabamba\"\r\n },\r\n {\r\n \"clave\": \"BOL-04\",\r\n \"valor\": \"Oruro\"\r\n },\r\n {\r\n \"clave\": \"BOL-05\",\r\n \"valor\": \"Potosí\"\r\n },\r\n {\r\n \"clave\": \"BOL-06\",\r\n \"valor\": \"Tarija\"\r\n },\r\n {\r\n \"clave\": \"BOL-07\",\r\n \"valor\": \"Santa Cruz\"\r\n },\r\n {\r\n \"clave\": \"BOL-08\",\r\n \"valor\": \"Beni\"\r\n },\r\n {\r\n \"clave\": \"BOL-09\",\r\n \"valor\": \"Pando\"\r\n }\r\n ]\r\n}" 190 | } 191 | ] 192 | }, 193 | { 194 | "name": "Obtener divisiones regionales - Nivel 2", 195 | "request": { 196 | "method": "GET", 197 | "header": [], 198 | "url": { 199 | "raw": "{{servidor}}/api/validaciones/division-regional?nivel=2&codigo={{ubigeo-nive1}}", 200 | "host": [ 201 | "{{servidor}}" 202 | ], 203 | "path": [ 204 | "api", 205 | "validaciones", 206 | "division-regional" 207 | ], 208 | "query": [ 209 | { 210 | "key": "nivel", 211 | "value": "2" 212 | }, 213 | { 214 | "key": "codigo", 215 | "value": "{{ubigeo-nive1}}" 216 | } 217 | ] 218 | } 219 | }, 220 | "response": [ 221 | { 222 | "name": "Apurímac - Perú", 223 | "originalRequest": { 224 | "method": "GET", 225 | "header": [], 226 | "url": { 227 | "raw": "{{servidor}}/api/general/division-regional?nivel=2&codigo=PER-030000", 228 | "host": [ 229 | "{{servidor}}" 230 | ], 231 | "path": [ 232 | "api", 233 | "general", 234 | "division-regional" 235 | ], 236 | "query": [ 237 | { 238 | "key": "nivel", 239 | "value": "2" 240 | }, 241 | { 242 | "key": "codigo", 243 | "value": "PER-030000" 244 | } 245 | ] 246 | } 247 | }, 248 | "_postman_previewlanguage": "json", 249 | "header": null, 250 | "cookie": [], 251 | "body": "[\r\n {\r\n \"clave\": \"PER-030100\",\r\n \"valor\": \"Abancay\"\r\n },\r\n {\r\n \"clave\": \"PER-030200\",\r\n \"valor\": \"Aymaraes\"\r\n },\r\n {\r\n \"clave\": \"PER-030300\",\r\n \"valor\": \"Andahuaylas\"\r\n },\r\n {\r\n \"clave\": \"PER-030400\",\r\n \"valor\": \"Antabamba\"\r\n },\r\n {\r\n \"clave\": \"PER-030500\",\r\n \"valor\": \"Cotabambas\"\r\n },\r\n {\r\n \"clave\": \"PER-030600\",\r\n \"valor\": \"Grau\"\r\n },\r\n {\r\n \"clave\": \"PER-030700\",\r\n \"valor\": \"Chincheros\"\r\n }\r\n]" 252 | }, 253 | { 254 | "name": "Chimborazo - Ecuador", 255 | "originalRequest": { 256 | "method": "GET", 257 | "header": [], 258 | "url": { 259 | "raw": "{{servidor}}/api/general/division-regional?nivel=2&codigo=ECU-06", 260 | "host": [ 261 | "{{servidor}}" 262 | ], 263 | "path": [ 264 | "api", 265 | "general", 266 | "division-regional" 267 | ], 268 | "query": [ 269 | { 270 | "key": "nivel", 271 | "value": "2" 272 | }, 273 | { 274 | "key": "codigo", 275 | "value": "ECU-06" 276 | } 277 | ] 278 | } 279 | }, 280 | "_postman_previewlanguage": "json", 281 | "header": null, 282 | "cookie": [], 283 | "body": "[\r\n {\"codigo\": \"ECU-0601\", \"nombre\": \"Riobamba\"},\r\n {\"codigo\": \"ECU-0602\", \"nombre\": \"Alausi\"},\r\n {\"codigo\": \"ECU-0603\", \"nombre\": \"Colta\"},\r\n {\"codigo\": \"ECU-0604\", \"nombre\": \"Chambo\"},\r\n {\"codigo\": \"ECU-0605\", \"nombre\": \"Chunchi\"},\r\n {\"codigo\": \"ECU-0606\", \"nombre\": \"Guamote\"},\r\n {\"codigo\": \"ECU-0607\", \"nombre\": \"Guano\"},\r\n {\"codigo\": \"ECU-0608\", \"nombre\": \"Pallatanga\"},\r\n {\"codigo\": \"ECU-0609\", \"nombre\": \"Penipe\"},\r\n {\"codigo\": \"ECU-0610\", \"nombre\": \"Cumanda\"}\r\n]" 284 | }, 285 | { 286 | "name": "Beni - Bolivia", 287 | "originalRequest": { 288 | "method": "GET", 289 | "header": [], 290 | "url": { 291 | "raw": "{{servidor}}/api/general/division-regional?nivel=2&codigo=BOL-08", 292 | "host": [ 293 | "{{servidor}}" 294 | ], 295 | "path": [ 296 | "api", 297 | "general", 298 | "division-regional" 299 | ], 300 | "query": [ 301 | { 302 | "key": "nivel", 303 | "value": "2" 304 | }, 305 | { 306 | "key": "codigo", 307 | "value": "BOL-08" 308 | } 309 | ] 310 | } 311 | }, 312 | "_postman_previewlanguage": "json", 313 | "header": null, 314 | "cookie": [], 315 | "body": "[\r\n {\r\n \"clave\": \"BOL-802\",\r\n \"valor\": \"Antonio Vaca Diez\"\r\n },\r\n {\r\n \"clave\": \"BOL-803\",\r\n \"valor\": \"Gral. José Ballivián\"\r\n },\r\n {\r\n \"clave\": \"BOL-804\",\r\n \"valor\": \"Yacuma\"\r\n },\r\n {\r\n \"clave\": \"BOL-805\",\r\n \"valor\": \"Moxos\"\r\n },\r\n {\r\n \"clave\": \"BOL-806\",\r\n \"valor\": \"Marban\"\r\n },\r\n {\r\n \"clave\": \"BOL-807\",\r\n \"valor\": \"Mamoré\"\r\n },\r\n {\r\n \"clave\": \"BOL-808\",\r\n \"valor\": \"Iténez\"\r\n }\r\n]" 316 | } 317 | ] 318 | }, 319 | { 320 | "name": "Obtener divisiones regionales - Nivel 3", 321 | "request": { 322 | "method": "GET", 323 | "header": [], 324 | "url": { 325 | "raw": "{{servidor}}/api/validaciones/division-regional?nivel=3&codigo={{ubigeo-nive2}}", 326 | "host": [ 327 | "{{servidor}}" 328 | ], 329 | "path": [ 330 | "api", 331 | "validaciones", 332 | "division-regional" 333 | ], 334 | "query": [ 335 | { 336 | "key": "nivel", 337 | "value": "3" 338 | }, 339 | { 340 | "key": "codigo", 341 | "value": "{{ubigeo-nive2}}" 342 | } 343 | ] 344 | } 345 | }, 346 | "response": [ 347 | { 348 | "name": "Chincheros - Apurímac - Perú", 349 | "originalRequest": { 350 | "method": "GET", 351 | "header": [], 352 | "url": { 353 | "raw": "{{servidor}}/api/validaciones/division-regional?nivel=3&codigo=PER-030700", 354 | "host": [ 355 | "{{servidor}}" 356 | ], 357 | "path": [ 358 | "api", 359 | "validaciones", 360 | "division-regional" 361 | ], 362 | "query": [ 363 | { 364 | "key": "nivel", 365 | "value": "3" 366 | }, 367 | { 368 | "key": "codigo", 369 | "value": "PER-030700" 370 | } 371 | ] 372 | } 373 | }, 374 | "_postman_previewlanguage": "json", 375 | "header": null, 376 | "cookie": [], 377 | "body": "[\r\n {\r\n \"clave\": \"PER-030701\",\r\n \"valor\": \"Chincheros\"\r\n },\r\n {\r\n \"clave\": \"PER-030702\",\r\n \"valor\": \"Ongoy\"\r\n },\r\n {\r\n \"clave\": \"PER-030703\",\r\n \"valor\": \"Ocobamba\"\r\n },\r\n {\r\n \"clave\": \"PER-030704\",\r\n \"valor\": \"Cocharcas\"\r\n },\r\n {\r\n \"clave\": \"PER-030705\",\r\n \"valor\": \"Anco-Huallo\"\r\n },\r\n {\r\n \"clave\": \"PER-030706\",\r\n \"valor\": \"Huaccana\"\r\n },\r\n {\r\n \"clave\": \"PER-030707\",\r\n \"valor\": \"Uranmarca\"\r\n },\r\n {\r\n \"clave\": \"PER-030708\",\r\n \"valor\": \"Ranracancha\"\r\n },\r\n {\r\n \"clave\": \"PER-030709\",\r\n \"valor\": \"Rocchacc\"\r\n },\r\n {\r\n \"clave\": \"PER-030710\",\r\n \"valor\": \"El Porvenir\"\r\n },\r\n {\r\n \"clave\": \"PER-030711\",\r\n \"valor\": \"Los Chankas\"\r\n }\r\n]" 378 | }, 379 | { 380 | "name": "Aluasi - Chimborazo - Ecuador", 381 | "originalRequest": { 382 | "method": "GET", 383 | "header": [], 384 | "url": { 385 | "raw": "{{servidor}}/api/general/division-regional?nivel=3&codigo=ECU-0602", 386 | "host": [ 387 | "{{servidor}}" 388 | ], 389 | "path": [ 390 | "api", 391 | "general", 392 | "division-regional" 393 | ], 394 | "query": [ 395 | { 396 | "key": "nivel", 397 | "value": "3" 398 | }, 399 | { 400 | "key": "codigo", 401 | "value": "ECU-0602" 402 | } 403 | ] 404 | } 405 | }, 406 | "_postman_previewlanguage": "json", 407 | "header": null, 408 | "cookie": [], 409 | "body": "[\r\n {\"codigo\": \"ECU-060250\", \"nombre\": \"Alausi\"},\r\n {\"codigo\": \"ECU-060251\", \"nombre\": \"Achupallas\"},\r\n {\"codigo\": \"ECU-060252\", \"nombre\": \"Guasuntos\"},\r\n {\"codigo\": \"ECU-060253\", \"nombre\": \"Huigra\"},\r\n {\"codigo\": \"ECU-060254\", \"nombre\": \"Multitud\"},\r\n {\"codigo\": \"ECU-060255\", \"nombre\": \"Pistishi\"},\r\n {\"codigo\": \"ECU-060256\", \"nombre\": \"Pumallacta\"},\r\n {\"codigo\": \"ECU-060257\", \"nombre\": \"Pallatanga\"},\r\n {\"codigo\": \"ECU-060258\", \"nombre\": \"Sevilla\"},\r\n {\"codigo\": \"ECU-060259\", \"nombre\": \"Sibambe\"},\r\n {\"codigo\": \"ECU-060260\", \"nombre\": \"Tixan\"}\r\n]" 410 | }, 411 | { 412 | "name": "Iténez - Beni - Bolivia", 413 | "originalRequest": { 414 | "method": "GET", 415 | "header": [], 416 | "url": { 417 | "raw": "{{servidor}}/api/validaciones/division-regional?nivel=3&codigo=BOL-808", 418 | "host": [ 419 | "{{servidor}}" 420 | ], 421 | "path": [ 422 | "api", 423 | "validaciones", 424 | "division-regional" 425 | ], 426 | "query": [ 427 | { 428 | "key": "nivel", 429 | "value": "3" 430 | }, 431 | { 432 | "key": "codigo", 433 | "value": "BOL-808" 434 | } 435 | ] 436 | } 437 | }, 438 | "_postman_previewlanguage": "json", 439 | "header": null, 440 | "cookie": [], 441 | "body": "[\r\n {\r\n \"clave\": \"BOL-80801\",\r\n \"valor\": \"Magdalena\"\r\n },\r\n {\r\n \"clave\": \"BOL-80802\",\r\n \"valor\": \"Baures\"\r\n },\r\n {\r\n \"clave\": \"BOL-80803\",\r\n \"valor\": \"Huacaraje\"\r\n }\r\n]" 442 | } 443 | ] 444 | } 445 | ] 446 | }, 447 | { 448 | "name": "Datos Laborales", 449 | "item": [ 450 | { 451 | "name": "Obtener Sectores de trabajo", 452 | "request": { 453 | "method": "GET", 454 | "header": [], 455 | "url": { 456 | "raw": "{{servidor}}/api/validaciones/sectores-laborales", 457 | "host": [ 458 | "{{servidor}}" 459 | ], 460 | "path": [ 461 | "api", 462 | "validaciones", 463 | "sectores-laborales" 464 | ] 465 | } 466 | }, 467 | "response": [ 468 | { 469 | "name": "Listado", 470 | "originalRequest": { 471 | "method": "GET", 472 | "header": [], 473 | "url": { 474 | "raw": "{{servidor}}/api/validaciones/sectores", 475 | "host": [ 476 | "{{servidor}}" 477 | ], 478 | "path": [ 479 | "api", 480 | "validaciones", 481 | "sectores" 482 | ] 483 | } 484 | }, 485 | "_postman_previewlanguage": "json", 486 | "header": null, 487 | "cookie": [], 488 | "body": "[\r\n {\r\n \"clave\": \"01\",\r\n \"valor\": \"Salud\"\r\n },\r\n {\r\n \"clave\": \"02\",\r\n \"valor\": \"Educación\"\r\n },\r\n {\r\n \"clave\": \"03\",\r\n \"valor\": \"Comercio\"\r\n },\r\n {\r\n \"clave\": \"04\",\r\n \"valor\": \"Transporte\"\r\n }\r\n]" 489 | } 490 | ] 491 | }, 492 | { 493 | "name": "Obtener Ocupaciones por Sector de Trabajo", 494 | "request": { 495 | "method": "GET", 496 | "header": [], 497 | "url": { 498 | "raw": "{{servidor}}/api/validaciones/ocupaciones?sector={{sector-laboral}}", 499 | "host": [ 500 | "{{servidor}}" 501 | ], 502 | "path": [ 503 | "api", 504 | "validaciones", 505 | "ocupaciones" 506 | ], 507 | "query": [ 508 | { 509 | "key": "sector", 510 | "value": "{{sector-laboral}}" 511 | } 512 | ] 513 | } 514 | }, 515 | "response": [ 516 | { 517 | "name": "Listado Exitoso", 518 | "originalRequest": { 519 | "method": "GET", 520 | "header": [], 521 | "url": { 522 | "raw": "{{servidor}}/api/validaciones/ocupaciones?sector=03", 523 | "host": [ 524 | "{{servidor}}" 525 | ], 526 | "path": [ 527 | "api", 528 | "validaciones", 529 | "ocupaciones" 530 | ], 531 | "query": [ 532 | { 533 | "key": "sector", 534 | "value": "03" 535 | } 536 | ] 537 | } 538 | }, 539 | "_postman_previewlanguage": "json", 540 | "header": null, 541 | "cookie": [], 542 | "body": "[\r\n {\r\n \"clave\": \"0301\",\r\n \"valor\": \"Comerciante\"\r\n },\r\n {\r\n \"clave\": \"0302\",\r\n \"valor\": \"Vendedor\"\r\n },\r\n {\r\n \"clave\": \"0303\",\r\n \"valor\": \"Asistente de Tienda\"\r\n }\r\n]" 543 | } 544 | ] 545 | } 546 | ] 547 | }, 548 | { 549 | "name": "Obtener Información de Inicio para el Formulario de Creación de Cuenta", 550 | "request": { 551 | "method": "GET", 552 | "header": [], 553 | "url": { 554 | "raw": "{{servidor}}/api/validaciones/inicio-registro", 555 | "host": [ 556 | "{{servidor}}" 557 | ], 558 | "path": [ 559 | "api", 560 | "validaciones", 561 | "inicio-registro" 562 | ] 563 | } 564 | }, 565 | "response": [ 566 | { 567 | "name": "Listado", 568 | "originalRequest": { 569 | "method": "GET", 570 | "header": [], 571 | "url": { 572 | "raw": "{{servidor}}/api/validaciones/inicio-registro", 573 | "host": [ 574 | "{{servidor}}" 575 | ], 576 | "path": [ 577 | "api", 578 | "validaciones", 579 | "inicio-registro" 580 | ] 581 | } 582 | }, 583 | "_postman_previewlanguage": "json", 584 | "header": null, 585 | "cookie": [], 586 | "body": "{\r\n \"tiposCuenta\": [\r\n {\r\n \"id\": 1,\r\n \"nombre\": \"Libertad\",\r\n \"descripcion\": \"Empieza tu historial crediticio con una cuenta sin costo de mantenimiento\",\r\n \"cuotaMantenimiento\": 0.0,\r\n \"tasaInteres\": 0.005,\r\n \"beneficios\": false\r\n },\r\n {\r\n \"id\": 2,\r\n \"nombre\": \"Premium\",\r\n \"descripcion\": \"Apretura tu cuenta premium y disfruta de los beneficios que tenemos para ti\",\r\n \"cuotaMantenimiento\": 30.0,\r\n \"tasaInteres\": 1.5,\r\n \"beneficios\": true\r\n }\r\n ],\r\n \"paises\": [\r\n {\r\n \"clave\": \"BOL\",\r\n \"valor\": \"Bolivia\"\r\n },\r\n {\r\n \"clave\": \"ECU\",\r\n \"valor\": \"Ecuador\"\r\n },\r\n {\r\n \"clave\": \"PER\",\r\n \"valor\": \"Perú\"\r\n }\r\n ]\r\n}" 587 | } 588 | ] 589 | } 590 | ] 591 | }, 592 | { 593 | "name": "Crear Cliente", 594 | "request": { 595 | "method": "POST", 596 | "header": [], 597 | "body": { 598 | "mode": "raw", 599 | "raw": "{\r\n \"documentoIdentidad\": \"{{cliente-documentoIdent}}\",\r\n \"apellidoPaterno\": \"{{cliente-apellidoPaterno}}\",\r\n \"apellidoMaterno\": \"{{cliente-apellidoMaterno}}\",\r\n \"prenombres\": \"{{cliente-prenombre}}\",\r\n \"fechaNacimiento\": \"{{cliente-fechaNac}}\",\r\n \"direccion\": \"{{cliente-direccion}}\",\r\n \"ubigeo\": \"{{cliente-ubigeo}}\",\r\n \"postal\": \"{{cliente-codigoPostal}}\",\r\n \"ocupacion\": \"{{cliente-ocupacion}}\",\r\n \"correo\": \"{{cliente-correoElectr}}\",\r\n \"telefono\": \"{{cliente-telefono}}\",\r\n \"contrasena\": \"{{cliente-contrasena}}\"\r\n}", 600 | "options": { 601 | "raw": { 602 | "language": "json" 603 | } 604 | } 605 | }, 606 | "url": { 607 | "raw": "{{servidor}}/api/cliente/crear?tipoCuenta={{cuenta-tipo}}", 608 | "host": [ 609 | "{{servidor}}" 610 | ], 611 | "path": [ 612 | "api", 613 | "cliente", 614 | "crear" 615 | ], 616 | "query": [ 617 | { 618 | "key": "tipoCuenta", 619 | "value": "{{cuenta-tipo}}" 620 | } 621 | ] 622 | } 623 | }, 624 | "response": [ 625 | { 626 | "name": "Creación Exitosa", 627 | "originalRequest": { 628 | "method": "POST", 629 | "header": [], 630 | "body": { 631 | "mode": "raw", 632 | "raw": "{\r\n \"documentoIdentidad\": \"10203040\",\r\n \"apellidoPaterno\": \"Quispe\",\r\n \"apellidoMaterno\": \"Vera\",\r\n \"prenombres\": \"Justiniano\",\r\n \"fechaNacimiento\": \"1984-12-08\",\r\n \"direccion\": \"Jr. San Cristóbal 1058\",\r\n \"ubigeo\": \"PER-030708\",\r\n \"postal\": \"03830\",\r\n \"ocupacion\": \"0301\",\r\n \"correo\": \"jquispev@gmail.com\",\r\n \"telefono\": \"+51 903851415\",\r\n \"contrasena\": \"$Prueba202108!\" \r\n}", 633 | "options": { 634 | "raw": { 635 | "language": "json" 636 | } 637 | } 638 | }, 639 | "url": { 640 | "raw": "{{servidor}}/api/cliente/crear?tipoCuenta=1", 641 | "host": [ 642 | "{{servidor}}" 643 | ], 644 | "path": [ 645 | "api", 646 | "cliente", 647 | "crear" 648 | ], 649 | "query": [ 650 | { 651 | "key": "tipoCuenta", 652 | "value": "1" 653 | } 654 | ] 655 | } 656 | }, 657 | "_postman_previewlanguage": "json", 658 | "header": null, 659 | "cookie": [], 660 | "body": "{\n \"exito\": true,\n \"valor\": \"Pronto Hash\"\n}" 661 | } 662 | ] 663 | } 664 | ] 665 | } 666 | ] 667 | }, 668 | { 669 | "name": "Transacciones", 670 | "item": [ 671 | { 672 | "name": "Transacciones", 673 | "item": [ 674 | { 675 | "name": "Verificar cuenta a transferir", 676 | "request": { 677 | "method": "GET", 678 | "header": [], 679 | "url": { 680 | "raw": "{{servidor}}/api/transferencias/verificar-cuenta?numero={{cuenta-numero}}", 681 | "host": [ 682 | "{{servidor}}" 683 | ], 684 | "path": [ 685 | "api", 686 | "transferencias", 687 | "verificar-cuenta" 688 | ], 689 | "query": [ 690 | { 691 | "key": "numero", 692 | "value": "{{cuenta-numero}}" 693 | } 694 | ] 695 | } 696 | }, 697 | "response": [] 698 | }, 699 | { 700 | "name": "Transferir", 701 | "request": { 702 | "method": "POST", 703 | "header": [], 704 | "body": { 705 | "mode": "raw", 706 | "raw": "{\r\n \"emisor\": \"Pronto Hash\",\r\n \"receptor\": \"405123654845421\",\r\n \"monto\": 15.01\r\n}", 707 | "options": { 708 | "raw": { 709 | "language": "json" 710 | } 711 | } 712 | }, 713 | "url": { 714 | "raw": "{{servidor}}/api/transferencias/transferir", 715 | "host": [ 716 | "{{servidor}}" 717 | ], 718 | "path": [ 719 | "api", 720 | "transferencias", 721 | "transferir" 722 | ] 723 | } 724 | }, 725 | "response": [] 726 | } 727 | ] 728 | } 729 | ] 730 | } 731 | ], 732 | "event": [ 733 | { 734 | "listen": "prerequest", 735 | "script": { 736 | "type": "text/javascript", 737 | "exec": [ 738 | "" 739 | ] 740 | } 741 | }, 742 | { 743 | "listen": "test", 744 | "script": { 745 | "type": "text/javascript", 746 | "exec": [ 747 | "" 748 | ] 749 | } 750 | } 751 | ], 752 | "variable": [ 753 | { 754 | "key": "servidor", 755 | "value": "http://localhost:8081" 756 | } 757 | ] 758 | } --------------------------------------------------------------------------------