├── 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 | You need to enable JavaScript to run this app.
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 | Dashboard
28 |
29 |
30 | { auth.signOut(); window.localStorage.removeItem('uid') ; window.location = "/" }} >Sign Out
31 | >
32 | :
33 | <>
34 |
35 | Sign in
36 |
37 |
38 |
39 | Sign up
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 |
hi
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 |
113 | Sign In
114 |
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 | Apply Loan Now
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 |
160 | Sign Up
161 |
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 | Cancel
213 | Apply
214 |
215 |
216 |
217 |
218 | );
219 | }
--------------------------------------------------------------------------------