https://github.com/thaokvu/clinical-data-capture-system
A Flask-powered web application for managing clinical trial patient data. Features include adding, editing, viewing, and deleting patient information. This project focuses on user-friendly interaction and clean design, with data stored in an SQLite database.
https://github.com/thaokvu/clinical-data-capture-system
clincal-data-management css flask html jinja2 python sqlachemy sqlite web-development
Last synced: about 1 year ago
JSON representation
A Flask-powered web application for managing clinical trial patient data. Features include adding, editing, viewing, and deleting patient information. This project focuses on user-friendly interaction and clean design, with data stored in an SQLite database.
- Host: GitHub
- URL: https://github.com/thaokvu/clinical-data-capture-system
- Owner: thaokvu
- Created: 2024-12-21T05:48:11.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-24T04:35:55.000Z (over 1 year ago)
- Last Synced: 2025-01-05T17:13:54.607Z (over 1 year ago)
- Topics: clincal-data-management, css, flask, html, jinja2, python, sqlachemy, sqlite, web-development
- Language: HTML
- Homepage:
- Size: 2.74 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Clincial Data Capture System
## Overview
A web-based application for managing patient information in clinical trials. This system allows users to add, view, edit, and delete patient records while ensuring a user-friendly interface and robust backend functionality. Built using Flask, SQLAlchemy, and Jinja2, the project seamlessly integrates front-end design and back-end logic for managing clinical data efficiently.
## Features
- Add Patients - Input patient details such as name, age, medical condition, and trial status
- Edit Existing Patient Data - Modify existing patient details dynamically
- Delete Patient - Remove patient data with a confirmation prompt to prevent accidental deletion
- View Patient List - Display all patient records in a table format
- Responsive Design - User-friendly interface with a clean and modern design
## Technologies Used
### Backend
- **Python** - Core programming language for backend logic
- **Flask** - Framework for routing, handling HTTP requests, and managing server-side logic
- **SQLite** - Lightweight database for storing and managing patient data
- **SQLAlchemy** - Object-Relational Mapping (ORM) library for interacting with SQLite database
### Frontend
- **HTML** - Structuring the web pages for displaying patient information and forms
- **CSS** - Styling the interface to make it visually appealing and user-friendly
- **JavaScript** - Adding interactivity, such as the confirmation dialog for deleting a patient
- **Jinja2** - Template engine for dynamically rendering HTML content based on backend data
### Prerequisites
- Python 3.10+
- Flask
- **Flask-SQLAlchemy**
### Installation
1. **Clone the Repository**
```bash
git clone https://github.com/thaokvu/clinical-data-capture.git
cd clinical-data-capture
```
2. **Install Dependencies**
```bash
pip install -r requirements.txt
# If you don't have a requirements.txt, manually install the dependencies
pip install flask flask-sqlalchemy
```
3. **Set up the Database**
```bash
from main import db, app
with app.app_context():
db.create_all()
# You can manually create the database tables by ensuring the db.create_all() function is executed in the app.py file
```
4. **Start the Application**
```bash
python main.py
```
5. **Access the Application**
Open a web browser and go to the following URL -
`http://127.0.0.1:5000/`
## Project Structure
This project follows a simple and organized structure to make the codebase easy to understand and maintain.
### Layout
### Folder and File Description
- **`static/style.css`** - Contains custom CSS to style the web pages and improve the user interface
- **`templates/`** - Holds all the HTML templates for the web application
- **`add_patient.html`** - Displays the form for adding a new patient
- **`index_html`** - The main page that lists all patients in the database
- **`edit_patient.html`** - Displays the form for editing patient details
- **`clinical_data.db`** - The SQLite database file where patient information is stored; it is auto-generated when the application is run for the first time
- **`main.py`** - The main Flask application file that contains the app routes and logic
- **`requirements.txt`** - Lists all the Python dependencies required to run the project
- **README.md** - Project documentation that explains how to set up and use the application
### Usage
1. **Add a Patient**
- Fill in the patient's name, age, medical condition, and trial status
- Click the "Add Patient" button on the homepage to submit the form to add the patient to the database.
2. **Edit Patient Data**
- Click the "Edit" button in the patient's row on the homepage
- Update the details in the form and save changes
3. **Delete a Patient**
- Click the "Delete" button in the patient's row on the homepage
4. **View All Patient**
- The homepage displays a list of all patients in a table format, including their details and actions
## Screenshots
### **Homepage - List of Patients**
`http://127.0.0.1:5000/`
- The table should display patient details (name, age, condition, trial status) with action buttons for "Edit" and "Delete".
### **Add Patient Page**
`http://127.0.0.1:5000/add_patient`
- Users can input details for a new patient.
### **Edit Patient Page**
`http://127.0.0.1:5000/edit_patient/1`
- Users can update patient information. The form is pre-filled with existing patient details for easy editing.
### **Delete Patient Confirmation Dialog**
- Confirmation dialog that appears when the "Delete" button is pressed. The dialog helps prevent accidental deletions by asking the user for confirmation before proceeding.
### Clinical Data Capture System Demo
https://github.com/user-attachments/assets/23a67082-1c91-4942-888f-bba7465ab1e7