diff --git a/Frontend/package-lock.json b/Frontend/package-lock.json
index 95fdf99..ad40ec2 100644
--- a/Frontend/package-lock.json
+++ b/Frontend/package-lock.json
@@ -1844,6 +1844,7 @@
"version": "1.7.7",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.7.tgz",
"integrity": "sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==",
+ "license": "MIT",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
diff --git a/Frontend/src/components/Appointments.jsx b/Frontend/src/components/Appointments.jsx
index 93aed3f..6f9172d 100644
--- a/Frontend/src/components/Appointments.jsx
+++ b/Frontend/src/components/Appointments.jsx
@@ -6,193 +6,208 @@ import "react-datepicker/dist/react-datepicker.css";
import { useLocation } from 'react-router-dom';
const Appointments = () => {
- const [appointments, setAppointments] = useState([]);
- const [doctors, setDoctors] = useState([]);
- const [showForm, setShowForm] = useState(false);
- const [searchTerm, setSearchTerm] = useState('');
- const [newAppointment, setNewAppointment] = useState({
- patientName: '',
- doctorId: '',
- appointmentDate: new Date(),
- notes: ''
- });
-
- const location = useLocation();
- const queryParams = new URLSearchParams(location.search);
- const selectedDoctorId = queryParams.get('doctorId');
-
- useEffect(() => {
- // Simulating fetching doctors from an API
- setDoctors([
- { id: 1, name: "Dr. Smith", specialty: "Cardiology" },
- { id: 2, name: "Dr. Johnson", specialty: "Pediatrics" },
- { id: 3, name: "Dr. Williams", specialty: "Orthopedics" },
- ]);
-
- // Simulating fetching appointments from an API
- setAppointments([
- { id: 1, patientName: "John Doe", doctorId: 1, appointmentDate: new Date(), notes: "Regular checkup", status: "Scheduled" },
- { id: 2, patientName: "Jane Smith", doctorId: 2, appointmentDate: new Date(Date.now() + 86400000), notes: "Follow-up", status: "Scheduled" },
- ]);
-
- if (selectedDoctorId) {
- setNewAppointment(prev => ({ ...prev, doctorId: selectedDoctorId }));
- setShowForm(true);
- }
- }, [selectedDoctorId]);
-
- const handleInputChange = (e) => {
- const { name, value } = e.target;
- setNewAppointment(prev => ({ ...prev, [name]: value }));
- };
-
- const handleDateChange = (date) => {
- setNewAppointment(prev => ({ ...prev, appointmentDate: date }));
- };
-
- const handleSubmit = (e) => {
- e.preventDefault();
- const appointment = {
- id: appointments.length + 1,
- ...newAppointment,
- status: "Scheduled"
- };
- setAppointments([...appointments, appointment]);
- setNewAppointment({ patientName: '', doctorId: '', appointmentDate: new Date(), notes: '' });
- setShowForm(false);
- };
-
- const deleteAppointment = (id) => {
- setAppointments(appointments.filter(appointment => appointment.id !== id));
- };
-
- const completeAppointment = (id) => {
- setAppointments(appointments.map(appointment =>
- appointment.id === id ? { ...appointment, status: "Completed" } : appointment
- ));
- };
-
- const filteredAppointments = appointments.filter(appointment =>
- appointment.patientName.toLowerCase().includes(searchTerm.toLowerCase()) ||
- doctors.find(d => d.id === appointment.doctorId)?.name.toLowerCase().includes(searchTerm.toLowerCase())
- );
-
- return (
-
-
Appointment Management
-
-
-
setShowForm(!showForm)}
- >
-
- {showForm ? 'Cancel' : 'New Appointment'}
-
-
-
- setSearchTerm(e.target.value)}
- />
-
-
-
- {showForm && (
-
-
-
-
-
-
-
-
-
- )}
-
-
- {filteredAppointments.map((appointment) => (
-
- {appointment.patientName}
- Doctor: {doctors.find(d => d.id === appointment.doctorId)?.name}
- Date: {appointment.appointmentDate.toLocaleString()}
- Notes: {appointment.notes}
-
-
- {appointment.status}
-
-
-
-
- {appointment.status !== 'Completed' && (
-
- )}
-
-
-
- ))}
-
-
- );
+ const [appointments, setAppointments] = useState([]);
+ const [doctors, setDoctors] = useState([]);
+ const [showForm, setShowForm] = useState(false);
+ const [searchTerm, setSearchTerm] = useState('');
+ const [newAppointment, setNewAppointment] = useState({
+ patientName: '',
+ doctorId: '',
+ appointmentDate: new Date(),
+ notes: ''
+ });
+
+ const location = useLocation();
+ const queryParams = new URLSearchParams(location.search);
+ const selectedDoctorId = queryParams.get('doctorId');
+
+ useEffect(() => {
+ setDoctors([
+ { id: 1, name: "Dr. Smith", specialty: "Cardiology" },
+ { id: 2, name: "Dr. Johnson", specialty: "Pediatrics" },
+ { id: 3, name: "Dr. Williams", specialty: "Orthopedics" },
+ ]);
+
+ setAppointments([
+ { id: 1, patientName: "John Doe", doctorId: 1, appointmentDate: new Date(), notes: "Regular checkup", status: "Scheduled" },
+ { id: 2, patientName: "Jane Smith", doctorId: 2, appointmentDate: new Date(Date.now() + 86400000), notes: "Follow-up", status: "Scheduled" },
+ ]);
+
+ if (selectedDoctorId) {
+ setNewAppointment(prev => ({ ...prev, doctorId: selectedDoctorId }));
+ setShowForm(true);
+ }
+ }, [selectedDoctorId]);
+
+ const handleInputChange = (e) => {
+ const { name, value } = e.target;
+ setNewAppointment(prev => ({ ...prev, [name]: value }));
+ };
+
+ const handleDateChange = (date) => {
+ setNewAppointment(prev => ({ ...prev, appointmentDate: date }));
+ };
+
+ const validateName = (name) => {
+ const namePattern = /^[A-Za-z][A-Za-z\s]{3,}$/;
+ return namePattern.test(name);
+ };
+
+ const validateDate = (date) => {
+ return date > new Date();
+ };
+
+ const handleSubmit = (e) => {
+ e.preventDefault();
+ if (!validateName(newAppointment.patientName)) {
+ alert("Patient name must start with a letter and be at least 4 characters long.");
+ return;
+ }
+ if (!validateDate(newAppointment.appointmentDate)) {
+ alert("Appointment date must be in the future.");
+ return;
+ }
+ const appointment = {
+ id: appointments.length + 1,
+ ...newAppointment,
+ status: "Scheduled"
+ };
+ setAppointments([...appointments, appointment]);
+ setNewAppointment({ patientName: '', doctorId: '', appointmentDate: new Date(), notes: '' });
+ setShowForm(false);
+ };
+
+ const deleteAppointment = (id) => {
+ setAppointments(appointments.filter(appointment => appointment.id !== id));
+ };
+
+ const completeAppointment = (id) => {
+ setAppointments(appointments.map(appointment =>
+ appointment.id === id ? { ...appointment, status: "Completed" } : appointment
+ ));
+ };
+
+ const filteredAppointments = appointments.filter(appointment =>
+ appointment.patientName.toLowerCase().includes(searchTerm.toLowerCase()) ||
+ doctors.find(d => d.id === appointment.doctorId)?.name.toLowerCase().includes(searchTerm.toLowerCase())
+ );
+
+ return (
+
+
Appointment Management
+
+
+
setShowForm(!showForm)}
+ >
+
+ {showForm ? 'Cancel' : 'New Appointment'}
+
+
+
+ setSearchTerm(e.target.value)}
+ />
+
+
+
+ {showForm && (
+
+
+
+
+
+
+
+
+
+ )}
+
+
+ {filteredAppointments.map((appointment) => (
+
+ {appointment.patientName}
+ Doctor: {doctors.find(d => d.id === appointment.doctorId)?.name}
+ Date: {appointment.appointmentDate.toLocaleString()}
+ Notes: {appointment.notes}
+
+
+ {appointment.status}
+
+
+
+
+ {appointment.status !== 'Completed' && (
+
+ )}
+
+
+
+ ))}
+
+
+ );
};
export default Appointments;
diff --git a/Frontend/src/components/Patients.jsx b/Frontend/src/components/Patients.jsx
index 160c3fd..a2996b0 100644
--- a/Frontend/src/components/Patients.jsx
+++ b/Frontend/src/components/Patients.jsx
@@ -15,11 +15,35 @@ const Patients = () => {
setNewPatient({ ...newPatient, [e.target.name]: e.target.value });
};
+ const validateForm = () => {
+ const nameRegex = /^[A-Za-z][A-Za-z0-9 ]{3,}$/;
+ const contactRegex = /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/;
+
+ if (!nameRegex.test(newPatient.name)) {
+ alert('Invalid name. Name should start with a letter and be at least 4 characters long.');
+ return false;
+ }
+
+ if (newPatient.age < 1 || newPatient.age > 120) {
+ alert('Age should be a number between 1 and 120.');
+ return false;
+ }
+
+ if (!contactRegex.test(newPatient.contact)) {
+ alert('Invalid contact number. It should follow the format XXX-XXX-XXXX.');
+ return false;
+ }
+
+ return true;
+ };
+
const handleSubmit = (e) => {
e.preventDefault();
- setPatients([...patients, { id: patients.length + 1, ...newPatient }]);
- setNewPatient({ name: '', age: '', gender: '', contact: '' });
- setShowForm(false);
+ if (validateForm()) {
+ setPatients([...patients, { id: patients.length + 1, ...newPatient }]);
+ setNewPatient({ name: '', age: '', gender: '', contact: '' });
+ setShowForm(false);
+ }
};
const deletePatient = (id) => {