Skip to content

Commit 1c6ba4a

Browse files
author
Logic
committed
updated addpath
2 parents 5c2abe0 + 1ceaa1c commit 1c6ba4a

File tree

9 files changed

+320
-162
lines changed

9 files changed

+320
-162
lines changed

‎front-end/src/App.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,10 @@ function App() {
2020

2121
<Route path="/login/patient" element={<Login />} />
2222

23-
<Route path="/login/doctor" element={<LoginDoc />} />
24-
25-
<Route path="/canvas" element={<Canvas />} />
23+
<Route path="/login/admin" element={<LoginDoc />} />
2624

27-
28-
</Routes>
25+
<Route path="/canvas" element={<Canvas />} />
26+
</Routes>
2927
</BrowserRouter>
3028
</div>
3129
);

‎front-end/src/Components/Admin/Canvas.js

Lines changed: 103 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,118 @@
1-
import React, {useState, useRef} from 'react';
2-
import { ReactSketchCanvas } from 'react-sketch-canvas';
3-
import logo1 from "../../assets/logo1.svg"
1+
import React, { useState, useRef } from "react";
2+
import { ReactSketchCanvas } from "react-sketch-canvas";
3+
import logo1 from "../../assets/logo1.svg";
44
import { ColorPicker, useColor } from "react-color-palette";
55
import "react-color-palette/lib/css/styles.css";
6+
import axios from "axios";
67
const styles = {
7-
border: '0.5rem solid #23776E',
8-
borderRadius: '1rem',
8+
border: "0.5rem solid #23776E",
9+
borderRadius: "1rem",
910
};
1011

1112
const Canvas = () => {
12-
const [erase,seterase] = useState(false)
13-
const [prescription,setprescription] = useState("")
13+
const [erase, seterase] = useState(false);
14+
const [prescription, setprescription] = useState("");
1415
const thiscanvas = useRef();
1516
const [color, setColor] = useColor("hex", "#121212");
17+
const email = localStorage.getItem("email");
1618

17-
return (
18-
<div className='bg-[#E5FFFE]'>
19-
<img src={logo1} className="p-4"/>
20-
<div className='h-[100vh] w-[80vw] m-auto mt-4 overflow '>
21-
<div className='flex'>
22-
<div className='h-[100vh] w-[80vw] m-2'>
23-
<ReactSketchCanvas
24-
style={styles}
25-
ref={thiscanvas}
26-
strokeWidth={4}
27-
strokeColor={color.hex}
28-
/></div>
29-
<div className='mt-4'>
30-
<ColorPicker width={400} height={200}
31-
color={color}
32-
onChange={setColor} />
33-
<button className='ml-6 bg-[#23776E] rounded-sm p-4 text-white' onClick={()=>{
34-
erase ? seterase(false) : seterase(true)
35-
thiscanvas.current.eraseMode(erase)
36-
console.log(erase)
37-
}}>Erase</button>
38-
39-
<button className='ml-6 bg-[#23776E] rounded-sm p-4 text-white' onClick={()=>{
40-
thiscanvas.current.undo()
41-
}}>Undo</button>
42-
43-
<button className='ml-6 mt-6 bg-[#23776E] rounded-sm p-4 text-white' onClick={()=>{
44-
thiscanvas.current.clearCanvas()
45-
}}>Clear</button>
46-
47-
<button className='bg-[#23776E] ml-16 rounded-sm my-4 p-4 text-white m-auto' onClick={()=>{thiscanvas.current.
48-
exportImage("png")
49-
.then(data => {
50-
setprescription(data)
19+
const presData = new FormData();
20+
presData.append("email", email);
21+
presData.append("path", prescription);
22+
23+
const exportImage = () => {
24+
thiscanvas.current
25+
.exportImage("png")
26+
.then((data) => {
27+
setprescription(data);
5128
})
52-
.catch(e => {
29+
.catch((e) => {
5330
console.log(e);
54-
})}}>Save Prescription</button>
55-
</div>
56-
</div>
57-
</div>
31+
});
32+
console.log(prescription);
33+
34+
axios({
35+
method: "post",
36+
url: "http://20.204.137.225:5000/addpath",
37+
headers: { "Content-Type": "multipart/form-data" },
38+
data: presData,
39+
})
40+
.then((response) => {
41+
console.log(response);
42+
})
43+
.catch((err) => console.log(err));
44+
};
45+
46+
return (
47+
<div className="bg-[#E5FFFE]">
48+
<img src={logo1} className="p-4" />
49+
<div className="h-[100vh] w-[80vw] m-auto mt-4 overflow ">
50+
<div className="flex">
51+
<div className="h-[100vh] w-[80vw] m-2">
52+
<ReactSketchCanvas
53+
style={styles}
54+
ref={thiscanvas}
55+
strokeWidth={4}
56+
strokeColor={color.hex}
57+
/>
58+
</div>
59+
<div className="mt-4">
60+
<ColorPicker
61+
width={400}
62+
height={200}
63+
color={color}
64+
onChange={setColor}
65+
/>
66+
<button
67+
className="ml-6 bg-[#23776E] rounded-sm p-4 text-white"
68+
onClick={() => {
69+
erase ? seterase(false) : seterase(true);
70+
thiscanvas.current.eraseMode(erase);
71+
console.log(erase);
72+
}}
73+
>
74+
Erase
75+
</button>
76+
77+
<button
78+
className="ml-6 bg-[#23776E] rounded-sm p-4 text-white"
79+
onClick={() => {
80+
thiscanvas.current.undo();
81+
}}
82+
>
83+
Undo
84+
</button>
85+
86+
<button
87+
className="ml-6 mt-6 bg-[#23776E] rounded-sm p-4 text-white"
88+
onClick={() => {
89+
thiscanvas.current.clearCanvas();
90+
}}
91+
>
92+
Clear
93+
</button>
94+
95+
<button
96+
className="bg-[#23776E] ml-16 rounded-sm my-4 p-4 text-white m-auto"
97+
// onClick={() => {
98+
// thiscanvas.current
99+
// .exportImage("png")
100+
// .then((data) => {
101+
// setprescription(data);
102+
// })
103+
// .catch((e) => {
104+
// console.log(e);
105+
// });
106+
// }}
107+
onClick={exportImage}
108+
>
109+
Save Prescription
110+
</button>
111+
</div>
112+
</div>
58113
</div>
114+
</div>
59115
);
60116
};
61117

62-
export default Canvas;
118+
export default Canvas;

‎front-end/src/Components/Dashboard/Dashboard.js

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,26 @@ function Dashboard() {
2020
<div className="flex">
2121
{/* SIDEBAR */}
2222
<div className="bg-[#499189] h-screen w-56 px-4 py-5">
23-
<div className="mb-36">
23+
<motion.div
24+
initial={{ opacity: 0 }}
25+
animate={{ opacity: 1 }}
26+
transition={{
27+
delay: 1,
28+
29+
default: { duration: 1 },
30+
}}
31+
className="mb-36"
32+
>
2433
<img src={Logo} alt="Logo" className="w-36 mx-auto" />
25-
</div>
26-
<div className="px-2 flex flex-col justify-center">
34+
</motion.div>
35+
<motion.div
36+
initial={{ x: -30, opacity: 0 }}
37+
animate={{ x: 0, opacity: 1 }}
38+
transition={{
39+
default: { duration: 1.5 },
40+
}}
41+
className="px-2 flex flex-col justify-center"
42+
>
2743
<div
2844
className={
2945
homeActive
@@ -69,7 +85,7 @@ function Dashboard() {
6985
<img src={Doctor} alt="Doctors" className="mr-4" />
7086
<h6 className="text-white">My Doctors</h6>
7187
</div>
72-
</div>
88+
</motion.div>
7389
</div>
7490
<div className="bg-[#E5FFFE] w-[83.5vw] px-8 py-5">
7591
{/* HEADER */}

‎front-end/src/Components/Dashboard/Header.js

Lines changed: 26 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,29 @@
1-
import React, { useState,useEffect } from "react";
1+
import React, { useState, useEffect } from "react";
22
import Calendar from "../../assets/calendar.svg";
33
import Clock from "../../assets/clock.svg";
44
import Search from "../../assets/search.svg";
55
import User from "../../assets/User 2.svg";
6+
import { motion } from "framer-motion";
67

78
function Header() {
89
const [input, setInput] = useState("");
910
const date = new Date().toLocaleDateString();
10-
var [time,setTime] = useState(new Date());
11+
var [time, setTime] = useState(new Date());
1112

1213
useEffect(() => {
13-
var timer = setInterval(()=>setTime(new Date()), 1000 )
14+
var timer = setInterval(() => setTime(new Date()), 1000);
1415
return function cleanup() {
15-
clearInterval(timer)
16-
}
17-
18-
});
16+
clearInterval(timer);
17+
};
18+
});
1919
return (
20-
<div>
20+
<motion.div
21+
initial={{ y: -20, opacity: 0 }}
22+
animate={{ y: 0, opacity: 1 }}
23+
transition={{
24+
default: { duration: 1 },
25+
}}
26+
>
2127
<div className="flex justify-between mb-6">
2228
<div class="relative px-4 py-2 bg-[#499189] rounded-2xl flex justify-center w-[25vw]">
2329
<img src={Search} alt="search" className="h-5 mr-2" />
@@ -29,10 +35,19 @@ function Header() {
2935
/>
3036
</div>
3137

32-
<div className="flex justify-center items-center">
38+
<motion.div
39+
initial={{ x: 30 }}
40+
animate={{ x: 0 }}
41+
transition={{
42+
delay: 1,
43+
44+
default: { duration: 2 },
45+
}}
46+
className="flex justify-center items-center"
47+
>
3348
<img className="mr-3 w-8" alt="User" src={User} />
3449
<h2 className="font-bold">Bruh Singh</h2>
35-
</div>
50+
</motion.div>
3651
</div>
3752
<div className="flex">
3853
<div className="flex mx-4">
@@ -44,7 +59,7 @@ function Header() {
4459
<h3 className="font-extrabold text-[#23776E]">{time.toLocaleTimeString()}</h3>
4560
</div>
4661
</div>
47-
</div>
62+
</motion.div>
4863
);
4964
}
5065

‎front-end/src/Components/Dashboard/Home.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,21 @@
11
import React from "react";
2-
2+
import { motion } from "framer-motion";
33
function Home() {
44
return (
5-
<div>
5+
<motion.div
6+
initial={{ opacity: 0 }}
7+
animate={{ opacity: 1 }}
8+
transition={{
9+
default: { duration: 1 },
10+
}}
11+
>
612
<div className="bg-[#75c6bc7e] w-[50vw] h-[30vh] p-10 m-10 rounded-xl">
713
Home Content
814
</div>
915
<div className="bg-[#75c6bc7e] w-[50vw] h-[30vh] p-10 m-10 rounded-xl">
1016
Home Content
1117
</div>
12-
</div>
18+
</motion.div>
1319
);
1420
}
1521

‎front-end/src/Components/Dashboard/Prescription.js

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,34 @@
1-
import React from "react";
2-
1+
import React, { useState } from "react";
2+
import { useEffect } from "react";
3+
import axios from "axios";
34
function Prescription() {
5+
const email = localStorage.getItem("email");
6+
const emailData = new FormData();
7+
emailData.append("email", email);
8+
const [pres, setPres] = useState();
9+
10+
useEffect(() => {
11+
axios({
12+
method: "post",
13+
url: "http://20.204.137.225:5000/getpath",
14+
headers: { "Content-Type": "multipart/form-data" },
15+
data: emailData,
16+
})
17+
.then((response) => {
18+
console.log(response.data.path);
19+
setPres(response.data.path);
20+
})
21+
.catch((err) => console.log(err));
22+
}, []);
423
return (
524
<div className="w-[70vw] h-[70vh] p-4 m-4 bg-[#75c6bc7e] overflow-y-scroll rounded-2xl">
625
<div className="mb-2 font-extrabold text-[#499189] ">Prescription</div>
726
<div className="mb-6 font-extrabold text-[#499189]">John Doe</div>
27+
<div>
28+
{pres.map((p) => {
29+
return <img src={p} alt="Prescription" />;
30+
})}
31+
</div>
832
</div>
933
);
1034
}

‎front-end/src/Components/Loginin.js

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { useState } from "react";
22
import SignUp from "../assets/signup.svg";
33
import logo from "../assets/logo1.svg";
44
import emailicon from "../assets/icons/email.svg";
5-
import user from "../assets/icons/user.svg";
5+
66
import passwordicon from "../assets/icons/password.svg";
77
import showpasswordicon from "../assets/icons/showpassword.svg";
88
import AOS from "aos";
@@ -16,6 +16,7 @@ const Login = () => {
1616
const [password, setpassword] = useState("");
1717
const [show, setshow] = useState(false);
1818

19+
localStorage.setItem("email", email);
1920
const handleSubmit = (e) => {
2021
e.preventDefault();
2122
const signUpData = new FormData();
@@ -30,10 +31,12 @@ const Login = () => {
3031
data: signUpData,
3132
})
3233
.then((response) => {
33-
console.log(response);
34-
// if (response.data.code === 200) {
35-
// setToken(true);
36-
// }
34+
console.log(response.data);
35+
if (response.data.success) {
36+
window.location.href = "/dashboard";
37+
} else {
38+
alert("Wrong Credentials");
39+
}
3740
})
3841
.catch((err) => {
3942
console.log(err);
@@ -128,9 +131,9 @@ const Login = () => {
128131
</strong>
129132
</div>
130133
<div className="justify-center mt-4 text-sm flex">
131-
<p className="mr-1">Are you a doctor? </p>
134+
<p className="mr-1">Are you Admin? </p>
132135
<strong>
133-
<a href="/login/doctor" className="text-[#23776E]">
136+
<a href="/login/admin" className="text-[#23776E]">
134137
Login Here
135138
</a>
136139
</strong>

0 commit comments

Comments
 (0)