Student Payment Information Tracker

once a student pays fees, uses only a transaction ID to generate and display all related information (amount paid, time, student names

flowchart TD
%% Payment Process
A[Student initiates payment] --> B[Payment Gateway processes payment]
B --> C[Transaction ID generated]
C --> D[Payment Gateway sends confirmation (Webhook)]
D --> E[Webhook Listener receives notification]
E --> F[Validate & extract payment data]
F --> G[Backend API processes data]
G --> H[Store payment details in Database]

%% Query Process
I[Student/Administrator enters Transaction ID] --> J[Frontend/UI]
J --> K[API Call to Backend]
K --> L[Backend API retrieves transaction details from Database]
L --> M[Return payment details to Frontend]
M --> N[Display payment details on UI]
Explanation
Payment Process:

A to B: The process starts when a student initiates a payment.
B to C: The payment gateway processes the payment and generates a unique transaction ID.
C to D: The gateway then sends a payment confirmation (via webhook) that includes all relevant details (amount, time, student info).
D to E: The webhook listener receives the confirmation.
E to F: The system validates the data and extracts key payment details.
F to G: The backend API further processes the data.
G to H: Payment details are stored securely in the database.
Query Process:

I to J: When a student or administrator wants to view details, they enter the transaction ID on the frontend/UI.
J to K: The UI makes an API call to the backend.
K to L: The backend API retrieves the corresponding transaction details from the database.
L to M: The details are sent back to the UI.
M to N: Finally, the payment details (amount, time, student name, etc.) are displayed to the user.