├── public ├── favicon.ico ├── logo192.png ├── logo512.png ├── robots.txt ├── manifest.json └── index.html ├── Loan Predict Flask update ├── model.pkl └── main.py ├── src ├── index.js ├── api │ └── firebase.js ├── App.js ├── ThemeProvider.js └── components │ ├── Navbar.jsx │ ├── Dashboard.jsx │ ├── TableContent.jsx │ ├── Signin.jsx │ ├── Home.jsx │ ├── SignUp.jsx │ └── AddLoan.jsx ├── .gitignore ├── package.json └── README.md /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hash-debug/Loan_System/master/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hash-debug/Loan_System/master/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hash-debug/Loan_System/master/public/logo512.png -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /Loan Predict Flask update/model.pkl: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hash-debug/Loan_System/master/Loan Predict Flask update/model.pkl -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom/client' 3 | import App from './App' 4 | import ThemeProvider from './ThemeProvider' 5 | 6 | const root = ReactDOM.createRoot(document.getElementById('root')) 7 | root.render( 8 | 9 | 10 | 11 | ) 12 | -------------------------------------------------------------------------------- /.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 | 25 | .env 26 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "", 3 | "name": "", 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 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | -------------------------------------------------------------------------------- /src/api/firebase.js: -------------------------------------------------------------------------------- 1 | import { initializeApp } from "firebase/app"; 2 | import { getFirestore } from "firebase/firestore"; 3 | import { getAuth } from "firebase/auth"; 4 | 5 | const firebaseConfig = { 6 | apiKey: process.env.REACT_APP_apiKey, 7 | authDomain: process.env.REACT_APP_authDomain, 8 | projectId: process.env.REACT_APP_projectId, 9 | storageBucket: process.env.REACT_APP_projectId, 10 | messagingSenderId: process.env.REACT_APP_messagingSenderId, 11 | appId: process.env.REACT_APP_appId, 12 | }; 13 | 14 | 15 | // Initialize Firebase and Firestore 16 | const app = initializeApp(firebaseConfig); 17 | const db = getFirestore(app); 18 | const auth = getAuth(app); 19 | 20 | export { db, auth }; 21 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "loan", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@emotion/react": "^11.10.5", 7 | "@emotion/styled": "^11.10.5", 8 | "@mui/icons-material": "^5.11.0", 9 | "@mui/material": "^5.11.4", 10 | "firebase": "^9.15.0", 11 | "react": "^18.2.0", 12 | "react-dom": "^18.2.0", 13 | "react-router-dom": "^6.6.2", 14 | "react-scripts": "5.0.1" 15 | }, 16 | "scripts": { 17 | "start": "react-scripts start", 18 | "build": "react-scripts build", 19 | "test": "react-scripts test", 20 | "eject": "react-scripts eject" 21 | }, 22 | "eslintConfig": { 23 | "extends": "react-app" 24 | }, 25 | "browserslist": { 26 | "production": [ 27 | ">0.2%", 28 | "not dead", 29 | "not op_mini all" 30 | ], 31 | "development": [ 32 | "last 1 chrome version", 33 | "last 1 firefox version", 34 | "last 1 safari version" 35 | ] 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import React, {useState} from "react"; 2 | import Navbar from "./components/Navbar"; 3 | import SignIn from "./components/Signin"; 4 | import { BrowserRouter, Routes, Route } from "react-router-dom"; 5 | import Home from "./components/Home"; 6 | import SignUp from "./components/SignUp"; 7 | import Dashboard from "./components/Dashboard"; 8 | import { onAuthStateChanged } from 'firebase/auth' 9 | import { auth } from "./api/firebase"; 10 | export default function App() { 11 | 12 | const [user, setuser] = useState(null) 13 | 14 | onAuthStateChanged(auth, (user) => { 15 | if (user) { 16 | setuser(user) 17 | } 18 | }); 19 | 20 | return ( 21 | <> 22 | 23 | 24 | 25 | } /> 26 | } /> 27 | } /> 28 | } /> 29 | 30 | 31 | 32 | ); 33 | } 34 | -------------------------------------------------------------------------------- /Loan Predict Flask update/main.py: -------------------------------------------------------------------------------- 1 | from flask import Flask,redirect,url_for,render_template,request, jsonify 2 | from flask_cors import CORS 3 | import joblib 4 | 5 | app=Flask(__name__) 6 | cors=CORS(app, resources={r"/api/*":{"origins":"*"}}) 7 | 8 | @app.route('/api/approveLoan',methods=['GET','POST']) 9 | def approveLoan(): 10 | print(request.json['married']) 11 | married = request.json['married'] 12 | dependents = request.json['dependents'] 13 | education = request.json['education'] 14 | selfEmployed = request.json['selfEmployed'] 15 | applicantIncome = request.json['applicantIncome'] 16 | loanAmount = request.json['loanAmount'] 17 | creditHistory = request.json['creditHistory'] 18 | 19 | print(loanAmount) 20 | 21 | modal=joblib.load("./model.pkl") 22 | 23 | own_pred = modal.predict([[married,dependents,education,selfEmployed,applicantIncome,loanAmount,creditHistory]]) 24 | if own_pred[0] == 1: 25 | return "Loan Approved" 26 | else : 27 | return "Loan Rejected" 28 | 29 | 30 | 31 | 32 | if __name__ == '__main__': 33 | #DEBUG is SET to TRUE. CHANGE FOR PROD 34 | app.run(port=5000,debug=True) 35 | -------------------------------------------------------------------------------- /src/ThemeProvider.js: -------------------------------------------------------------------------------- 1 | import { blue, pink, grey } from '@mui/material/colors' 2 | import CssBaseline from '@mui/material/CssBaseline' 3 | import { createTheme, ThemeProvider as MuiThemeProvider } from '@mui/material/styles' 4 | 5 | const theme = createTheme({ 6 | palette: { 7 | primary: blue, 8 | secondary: pink, 9 | text: { 10 | primary: grey[900], 11 | secondary: grey[700], 12 | }, 13 | background: { 14 | default: '#eee', 15 | paper: '#fff', 16 | }, 17 | divider: grey[300], 18 | }, 19 | spacing: 8, 20 | typography: { 21 | fontFamily: [ 22 | '"Hiragino Sans"', 23 | '-apple-system', 24 | 'BlinkMacSystemFont', 25 | '"Segoe UI"', 26 | 'Roboto', 27 | 'Helvetica', 28 | 'Arial', 29 | 'sans-serif', 30 | ].join(','), 31 | }, 32 | components: { 33 | MuiButton: { 34 | defaultProps: { 35 | disableElevation: true, 36 | }, 37 | styleOverrides: {}, 38 | }, 39 | MuiTextField: { 40 | defaultProps: { 41 | variant: 'filled', 42 | }, 43 | }, 44 | }, 45 | }) 46 | 47 | export default function ThemeProvider({ children }) { 48 | return ( 49 | 50 | 51 | {children} 52 | 53 | ) 54 | } 55 | -------------------------------------------------------------------------------- /src/components/Navbar.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import AppBar from '@mui/material/AppBar' 3 | import Box from '@mui/material/Box' 4 | import Toolbar from '@mui/material/Toolbar' 5 | import Typography from '@mui/material/Typography' 6 | import { Button } from '@mui/material' 7 | import { Link } from 'react-router-dom' 8 | import { auth } from '../api/firebase' 9 | 10 | 11 | 12 | function Navbar({ user }) { 13 | 14 | 15 | return ( 16 | 17 | 18 | 19 | 20 | 21 | Loan App 22 | 23 | 24 | 25 | { 26 | user ? <> 27 | 28 |

 

29 | 30 | 31 | 32 | : 33 | <> 34 | 35 | 36 | 37 |

 

38 | 39 | 40 | 41 | 42 | } 43 | 44 |
45 |
46 |
47 | ) 48 | } 49 | 50 | export default Navbar -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). 2 | 3 | ## Available Scripts 4 | 5 | In the project directory, you can run: 6 | 7 | ### `yarn start` 8 | 9 | Runs the app in the development mode.
10 | Open [http://localhost:3000](http://localhost:3000) to view it in the browser. 11 | 12 | The page will reload if you make edits.
13 | You will also see any lint errors in the console. 14 | 15 | ### `yarn test` 16 | 17 | Launches the test runner in the interactive watch mode.
18 | See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. 19 | 20 | ### `yarn build` 21 | 22 | Builds the app for production to the `build` folder.
23 | It correctly bundles React in production mode and optimizes the build for the best performance. 24 | 25 | The build is minified and the filenames include the hashes.
26 | Your app is ready to be deployed! 27 | 28 | See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. 29 | 30 | ### `yarn eject` 31 | 32 | **Note: this is a one-way operation. Once you `eject`, you can’t go back!** 33 | 34 | 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. 35 | 36 | 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. 37 | 38 | 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. 39 | 40 | ## Learn More 41 | 42 | You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). 43 | 44 | To learn React, check out the [React documentation](https://reactjs.org/). 45 | 46 | ### Code Splitting 47 | 48 | This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting 49 | 50 | ### Analyzing the Bundle Size 51 | 52 | This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size 53 | 54 | ### Making a Progressive Web App 55 | 56 | This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app 57 | 58 | ### Advanced Configuration 59 | 60 | This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration 61 | 62 | ### Deployment 63 | 64 | This section has moved here: https://facebook.github.io/create-react-app/docs/deployment 65 | 66 | ### `yarn build` fails to minify 67 | 68 | This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify 69 | -------------------------------------------------------------------------------- /src/components/Dashboard.jsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | 3 | import { Typography, ListItemButton, List, ListItemIcon, ListItem, ListItemText, Grid, CircularProgress, Button } from '@mui/material'; 4 | import { AccountBalance, AlternateEmail, Person, PhoneAndroid } from '@mui/icons-material'; 5 | import { collection, query, where, getDocs } from "firebase/firestore"; 6 | import { db } from '../api/firebase'; 7 | import AddLoan from './AddLoan'; 8 | import Table from './TableContent'; 9 | 10 | 11 | 12 | export default function Dashboard() { 13 | 14 | const [user, setuser] = React.useState(null) 15 | const [docid, setdocid] = React.useState(null) 16 | 17 | // const [uid, setuid] = React.useState(null) 18 | 19 | 20 | 21 | React.useEffect(() => { 22 | async function fetchUserData() { 23 | 24 | 25 | const q = await query(collection(db, "users"), where("userdata.uid", "==", window.localStorage.getItem('uid'))); 26 | // console.log(q); 27 | 28 | const querySnapshot = await getDocs(q); 29 | console.log(querySnapshot); 30 | querySnapshot.forEach((doc) => { 31 | // doc.data() is never undefined for query doc snapshots 32 | console.log(doc.id, " => ", doc.data()); 33 | setuser(doc.data().userdata) 34 | setdocid(doc.id) 35 | }); 36 | } 37 | fetchUserData() 38 | }, []) 39 | // console.log(); 40 | 41 | const sendReq = ()=>{ 42 | const data = { 43 | "married": 0, 44 | "dependents": 2, 45 | "education": 1, 46 | "selfEmployed": 0, 47 | "applicantIncome": 20000, 48 | "loanAmount": 500, 49 | "creditHistory": 1 50 | } 51 | fetch("http://127.0.0.1:5000/api/approveLoan",{ 52 | method: "POST", 53 | mode: "cors", 54 | headers: { 55 | "Content-Type": "application/json", 56 | }, 57 | body: JSON.stringify(data), 58 | }).then((res)=>{res.text().then((res2)=>{ 59 | console.log(res2); 60 | }) 61 | }) 62 | 63 | } 64 | 65 | 66 | return ( 67 |
68 | 69 | 70 | 71 | Dashboard 72 |

73 | 74 | 75 | 76 | 77 | 78 | 83 | 84 | 85 | 86 | 87 | 88 | } /> 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | } /> 98 | 99 | 100 | 101 | 102 | 103 | 104 | 109 | 110 | 111 | 112 | 113 | 114 | } /> 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | } /> 124 | 125 | 126 | 127 | 128 | 129 | 130 |
131 | 132 | 133 | 134 | ); 135 | } 136 | -------------------------------------------------------------------------------- /src/components/TableContent.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Table from '@mui/material/Table'; 3 | import TableBody from '@mui/material/TableBody'; 4 | import TableCell from '@mui/material/TableCell'; 5 | import TableContainer from '@mui/material/TableContainer'; 6 | import TableHead from '@mui/material/TableHead'; 7 | import TableRow from '@mui/material/TableRow'; 8 | import Paper from '@mui/material/Paper'; 9 | import { AccessTime, Clear, Done, } from '@mui/icons-material'; 10 | import { Chip, CircularProgress } from '@mui/material'; 11 | import { collection, query, where, getDocs } from "firebase/firestore"; 12 | import { db } from '../api/firebase'; 13 | 14 | 15 | 16 | 17 | function TableContent() { 18 | 19 | const [loan, setloan] = React.useState(null) 20 | // const [docid, setdocid] = React.useState(null) 21 | 22 | React.useEffect(() => { 23 | async function fetchUserData() { 24 | 25 | 26 | const q = await query(collection(db, "users"), where("userdata.uid", "==", window.localStorage.getItem('uid'))); 27 | // console.log(q); 28 | 29 | const querySnapshot = await getDocs(q); 30 | console.log(querySnapshot); 31 | querySnapshot.forEach((doc) => { 32 | // here we are getting the user data and loan from it 33 | // doc.data() is never undefined for query doc snapshots 34 | console.log(doc.id, " => ", doc.data().Loan); 35 | setloan(doc.data().Loan) 36 | // setdocid(doc.id) 37 | }); 38 | } 39 | fetchUserData() 40 | }, []) 41 | 42 | const status= { 43 | 1: } />, 44 | 2: } />, 45 | 3: } /> 46 | } 47 | 48 | 49 | 50 | // const rows = [ 51 | // createData('Frozen yoghurt', 159, 6.0, 24, } />), 52 | // createData('Cupcake', 305, 3.7, 67, } />), 53 | // createData('Eclair', 262, 16.0, 24, } />), 54 | // createData('Cupca', 305, 3.7, 67, } />), 55 | // createData('Ice cream sandwich', 237, 9.0, 37, } />), 56 | // createData('Gingerbread', 356, 16.0, 49, } />), 57 | // ]; 58 | 59 | // function createData(name, amount, duration, interest, status) { 60 | // return { name, amount, duration, interest, status }; 61 | // } 62 | 63 | 64 | 65 | return ( 66 | 67 |
68 | 69 | 70 | Loan Type 71 | Amount 72 | Duration 73 | Interest 74 | Status 75 | 76 | 77 | 78 | {loan ? loan.map((row,key) => ( 79 | 83 | 84 | {row.LoanType} 85 | 86 | {row.LoanAmnt} 87 | {row.Duration} 88 | {row.Interest}% 89 | {status[row.Status]} 90 | 91 | )) : 92 | 93 | 94 | 95 | 96 | 97 | 98 | } 99 | 100 |
101 | 102 | ) 103 | } 104 | 105 | export default TableContent -------------------------------------------------------------------------------- /src/components/Signin.jsx: -------------------------------------------------------------------------------- 1 | import Avatar from '@mui/material/Avatar'; 2 | import Button from '@mui/material/Button'; 3 | import CssBaseline from '@mui/material/CssBaseline'; 4 | import TextField from '@mui/material/TextField'; 5 | import Box from '@mui/material/Box'; 6 | import LockOutlinedIcon from '@mui/icons-material/LockOutlined'; 7 | import Typography from '@mui/material/Typography'; 8 | import Container from '@mui/material/Container'; 9 | import { createTheme, ThemeProvider } from '@mui/material/styles'; 10 | import { useState } from 'react'; 11 | import { auth } from '../api/firebase'; 12 | import { signInWithEmailAndPassword } from 'firebase/auth'; 13 | import { Alert, Snackbar } from '@mui/material'; 14 | 15 | 16 | const theme = createTheme(); 17 | 18 | export default function SignIn() { 19 | 20 | 21 | const [password, setpassword] = useState('') 22 | const [email, setemail] = useState('') 23 | const [open, setOpen] = useState(false); 24 | 25 | const handleClick = () => { 26 | setOpen(true); 27 | }; 28 | const handleClose = (event, reason) => { 29 | if (reason === 'clickaway') { 30 | return; 31 | } 32 | 33 | setOpen(false); 34 | }; 35 | const handleSubmit = (event) => { 36 | event.preventDefault(); 37 | signInWithEmailAndPassword(auth, email, password) 38 | .then(async(userCredential) => { 39 | // Signed in 40 | const user = userCredential.user; 41 | await console.log(user); 42 | window.localStorage.setItem('uid', user.uid) 43 | window.location = '/dashboard' 44 | // ... 45 | }) 46 | .catch((error) => { 47 | const errorCode = error.code; 48 | const errorMessage = error.message; 49 | console.log(errorCode, errorMessage); 50 | handleClick() 51 | }); 52 | }; 53 | 54 | return ( 55 | 56 | 57 | 58 | Invalid username or password 59 | 60 | 61 | 62 | 63 | 64 | 72 | 73 | 74 | 75 | 76 | Sign in 77 | 78 | 79 | { 89 | setemail(e.target.value); 90 | }} 91 | autoFocus 92 | /> 93 | { 103 | setpassword(e.target.value); 104 | }} 105 | /> 106 | 107 | 115 | 116 | 117 | 118 | 119 | 120 | ); 121 | } -------------------------------------------------------------------------------- /src/components/Home.jsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import Button from '@mui/material/Button'; 3 | import Card from '@mui/material/Card'; 4 | import CardActions from '@mui/material/CardActions'; 5 | import CardContent from '@mui/material/CardContent'; 6 | import CardMedia from '@mui/material/CardMedia'; 7 | import CssBaseline from '@mui/material/CssBaseline'; 8 | import Grid from '@mui/material/Grid'; 9 | import Box from '@mui/material/Box'; 10 | import Typography from '@mui/material/Typography'; 11 | import Container from '@mui/material/Container'; 12 | import { createTheme, ThemeProvider } from '@mui/material/styles'; 13 | import { CircularProgress } from '@mui/material'; 14 | 15 | 16 | const theme = createTheme(); 17 | 18 | export default function Home() { 19 | 20 | const cards = { 21 | items: [ 22 | 23 | { ImgUrl: "https://tfipost.com/wp-content/uploads/2022/04/Shinchan_in_hindi_dubbed_show-1024x571.jpg", Title: "ShinChan", Description: "Shin Chan needed loan to go on a trip to Goa with his friends. His loan was approved, and he had great adventures with Action Comin." }, 24 | { ImgUrl: "https://wallpapers.com/images/featured/6ag1ry72uy2s9jmg.jpg", Title: "Doreamon", Description: "Doreamon's time machine was broken due to Nobitas carelessness so he decided to use loaner, now he is having fun in the 24th century. " }, 25 | { ImgUrl: "https://cdn.sonicgang.com/wp-content/uploads/2019/05/Seesheemaru-large-min.jpg", Title: "Sishimaru", Description: "Sishimaru was put on a strict diet by Hatori, so he needed personal loan to buy chocolate roll, 🤫 why fear when loaner is here" } 26 | ] 27 | }; 28 | return ( 29 | 30 | 31 | 32 |
33 | {/* Hero unit */} 34 | 41 | 42 | 49 | Loaner 50 | 51 | 52 | Loaner - makes loan approval system easier. Wanna see if your loan application gets approved? Hop in, enter your details and get the status. 53 | 54 | 55 | 56 | 57 | 58 | 65 | Our Happy Customers 66 | 67 | {/* End hero unit */} 68 | 69 | {cards ? cards.items.map((card, key) => ( 70 | 71 | 72 | 78 | 79 | 80 | {card.Title} 81 | 82 | 83 | {card.Description} 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | )) : } 92 | 93 | 94 |
95 | 96 |
97 | ); 98 | } -------------------------------------------------------------------------------- /src/components/SignUp.jsx: -------------------------------------------------------------------------------- 1 | import Avatar from '@mui/material/Avatar'; 2 | import Button from '@mui/material/Button'; 3 | import CssBaseline from '@mui/material/CssBaseline'; 4 | import TextField from '@mui/material/TextField'; 5 | import Box from '@mui/material/Box'; 6 | import LockOutlinedIcon from '@mui/icons-material/LockOutlined'; 7 | import Typography from '@mui/material/Typography'; 8 | import Container from '@mui/material/Container'; 9 | import { createTheme, ThemeProvider } from '@mui/material/styles'; 10 | import { createUserWithEmailAndPassword } from "firebase/auth"; 11 | import { auth, db } from '../api/firebase'; 12 | import { addDoc, collection } from "firebase/firestore"; 13 | import { useState } from 'react'; 14 | 15 | const theme = createTheme(); 16 | 17 | 18 | export default function SignUp() { 19 | const [email, setemail] = useState('') 20 | const [password, setpassword] = useState('') 21 | const [name, setname] = useState('') 22 | const [phone, setphone] = useState('') 23 | const [account, setaccount] = useState('') 24 | 25 | 26 | const handleSubmit = (event) => { 27 | 28 | 29 | event.preventDefault(); 30 | createUserWithEmailAndPassword(auth, email, password) 31 | .then(async (userCredential) => { 32 | // Signed in 33 | const user = userCredential.user; 34 | console.log(user); 35 | const userdata = { 36 | uid: user.uid, 37 | email: user.email, 38 | name: name, 39 | phone: phone, 40 | accountNo: account, 41 | } 42 | 43 | try { 44 | const docRef = await addDoc(collection(db, "users"), { 45 | userdata 46 | }); 47 | 48 | console.log("Document written with ID: ", docRef.id); 49 | window.localStorage.setItem('uid', user.uid) 50 | window.location='/dashboard' 51 | } catch (e) { 52 | console.error("Error adding document: ", e); 53 | } 54 | 55 | 56 | }) 57 | .catch((error) => { 58 | const errorCode = error.code; 59 | const errorMessage = error.message; 60 | console.log(errorCode, errorMessage); 61 | }); 62 | 63 | 64 | }; 65 | 66 | return ( 67 | 68 | 69 | 70 | 78 | 79 | 80 | 81 | 82 | Sign up 83 | 84 | 85 | { 96 | setemail(e.target.value); 97 | }} 98 | /> 99 | { 109 | setname(e.target.value); 110 | }} 111 | /> 112 | { 122 | setphone(e.target.value); 123 | }} 124 | autoFocus 125 | /> 126 | { 136 | setaccount(e.target.value); 137 | }} 138 | /> 139 | { 149 | setpassword(e.target.value); 150 | }} 151 | /> 152 | 153 | 154 | 162 | 163 | 164 | 165 | 166 | 167 | ); 168 | } -------------------------------------------------------------------------------- /src/components/AddLoan.jsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import Button from '@mui/material/Button'; 3 | import TextField from '@mui/material/TextField'; 4 | import Dialog from '@mui/material/Dialog'; 5 | import DialogContent from '@mui/material/DialogContent'; 6 | import DialogContentText from '@mui/material/DialogContentText'; 7 | import DialogTitle from '@mui/material/DialogTitle'; 8 | import { Box, FormControlLabel, FormLabel, Radio, RadioGroup, SpeedDial } from '@mui/material'; 9 | import { Add } from '@mui/icons-material'; 10 | import { useTheme } from '@mui/material/styles'; 11 | import useMediaQuery from '@mui/material/useMediaQuery'; 12 | import { doc, getDoc, updateDoc } from 'firebase/firestore'; 13 | import { db } from '../api/firebase'; 14 | 15 | 16 | 17 | export default function AddLoan({docid}) { 18 | 19 | const [LoanAmnt, setLoanAmnt] = React.useState(null) 20 | const [LoanType, setLoanType] = React.useState(null) 21 | const [Income, setIncome] = React.useState(null) 22 | const [Cibil, setCibil] = React.useState(null) 23 | const [Employment, setEmployment] = React.useState(null) 24 | const [Duration, setDuration] = React.useState(null) 25 | 26 | const Interest=(loantype)=>{ 27 | if(loantype==='Home') 28 | return 7 29 | if(loantype==='Personal') 30 | return 24 31 | if(loantype==='Vehicle') 32 | return 14 33 | if(loantype==='Education') 34 | return 8 35 | } 36 | 37 | 38 | 39 | const handleSubmit = async(e) => { 40 | e.preventDefault() 41 | const loanData = { 42 | LoanAmnt: LoanAmnt, 43 | LoanType: LoanType, 44 | Income: Income, 45 | Cibil: Cibil, 46 | Employment: Employment, 47 | Duration: Duration, 48 | Status: 2, 49 | Interest: Interest(LoanType) 50 | } 51 | console.log(loanData); 52 | 53 | const userRef= doc(db, "users", docid) 54 | console.log(userRef); 55 | let loans= (await getDoc(userRef)).data().Loan || [] 56 | loans.push(loanData) 57 | updateDoc(userRef,{Loan : loans}).then(()=>{ 58 | handleClose() 59 | window.location='/dashboard' 60 | 61 | }).catch((error)=>{ 62 | alert("some error occured", error) 63 | }) 64 | // await setDoc(userRef,{ 65 | // Loans : [loanData] 66 | 67 | // },{ merge: true }).then(console.log("updated successfully")) 68 | } 69 | const [open, setOpen] = React.useState(false); 70 | const theme = useTheme(); 71 | 72 | 73 | const handleClickOpen = () => { 74 | setOpen(true); 75 | }; 76 | 77 | const handleClose = () => { 78 | setOpen(false); 79 | }; 80 | 81 | return ( 82 |
83 | } 96 | /> 97 | 98 | 99 | 100 | Apply For Loan 101 | 102 | 103 | Fill in the following details to apply for new loan 104 | 105 | 106 | 107 | { 117 | setLoanAmnt(e.target.value); 118 | }} 119 | /> 120 |


121 | Loan Type 122 | { 128 | setLoanType(e.target.value); 129 | }} 130 | > 131 | 132 | } 136 | label="Home" 137 | /> 138 | } 142 | label="Personal" 143 | /> 144 | } 148 | label="Vehicle" 149 | /> 150 | } 154 | label="Education" 155 | /> 156 | 157 | 158 | { 168 | setIncome(e.target.value); 169 | }} 170 | /> 171 | { 181 | setCibil(e.target.value); 182 | }} 183 | /> 184 | 185 | { 195 | setEmployment(e.target.value); 196 | }} 197 | /> 198 | { 208 | setDuration(e.target.value); 209 | }} 210 | /> 211 | 212 | 213 | 214 |
215 |
216 |
217 |
218 | ); 219 | } --------------------------------------------------------------------------------