Online Financial Management System Project in Django with Source Code

Online Financial Management System Project in Django with Source Code

This Online Financial Management System Project in Django created based on python, Django, and MYSQL Database. The Online Financial Management System which can help you manage your companies affairs, salary, taxes, receipts and etc. The purpose of this system is to avoid any duplicity or manipulation of records and thus stop corruption.

A Online Financial Management System in Django is an easy project for beginners to learn how to build a web-based python Django project. We will provide you with the complete source code and database for the python project so that you can easily install it on your machine and learn how to program in Python Django.

To start creating a Online Financial Management System Project in Python Django, makes sure that you have PyCharm Professional IDE Installed in your computer.

This Online Financial Management System in Django Framework, Also includes a Download Source Code for free, just find the downloadable source code below and click download now.

Admin Features: Online Financial Management System Project in Django

  • Login Page – The page where the system administrator enters their system credentials in order to gain access to the system’s administrative side.
  • New Company Page-This is the page where an administrator can add a new company.
  • Company List– The page with a list of companies that can be navigated to change or delete a company.
  • New Items – The page to which an administrator can add new items.
  • Items List– The page on which the list of items can be viewed, modified, or deleted.
  • New receipt – The page to which an administrator can add new receipt.
  • receipt List– The page on which the list of receipt can be viewed.
  • New Salary – The page to which an administrator can add new salary for their employee.
  • Salary List– The page on which the list of salary can be viewed.
  • New User Page – The page where a new admin credentials are created by an admin.
  • Users list – This is the page that lists and manages the added users.
About ProjectProject DetailsDefinition
Project Name Online Financial Management System Project in DjangoThe software and techniques that a business employs to manage assets, revenue, and spending are referred to as a financial management system (FMS). Reduce accounting mistakes, preserve audit trails, and ensure compliance with relevant accounting standards are all responsibilities performed by an FMS.
Python version (Recommended)3.8 VersionPython 3.8 introduces some new syntax to the language, as well as a few small modifications to existing behavior and, most importantly, a slew of performance improvements, following in the footsteps of the previous 3.7 version.
Programming Language UsedPython Django LanguageDjango is a high-level Python web framework for building safe and maintainable websites quickly. Django is a web framework built by experienced developers that takes care of a lot of the heavy lifting so you can focus on developing your app instead of reinventing the wheel.
Developer Name itsourcecode.comFree projects containing source code in Java, PHP, Python, Django, VB.Net, Visual Basic, C, C++, C#, Javascript, and other languages are available on this website.
IDE Tool (Recommended)Sublime, Visual Studio, PyCharmSublime Text is a source code editor that is available for purchase. It comes with built-in support for a variety of programming and markup languages. Plugins, which are often community-built and maintained under free-software licenses, allow users to extend the functionality of the system. Sublime Text has a Python API to help with plugins.
Project Type Web ApplicationA web application, unlike computer-based software programs that operate locally on the device’s operating system, is application software that runs on a web server. The user uses a web browser with an active network connection to access web apps.
DatabaseSQLiteSQLite is a programming language that is used to create embedded software for devices such as televisions, cell phones, and cameras. It can handle HTTP requests with low to medium traffic. SQLite has the ability to compress files into smaller bundles with less metadata. SQLite is a temporary dataset that is used within an application to process data.
Online Financial Management System Project in Django Overview

Online Financial Management System Project in Django Steps on How to Create a Project

Time needed: 5 minutes

Here’s the step’s on how to create a Online Financial Management System Project in Django with Source Code.

  • Step 1: Open file.

    First , open “pycharm professional” after that click “file” and click “new project“.
    Create new Project for Online Financial Management System Project in Django with Source Code

  • Step 2: Choose Django.

    Next, after click “new project“, choose “Django” and click.
    choose django for Online Financial Management System Project in Django with Source Code

  • Step 3: Select file location.

    Then, select a file location wherever you want.
    Create Location Name for Online Financial Management System Project in Django with Source Code

  • Step 4: Create application name.

    After that, name your application.

  • Step 5: Click create.

    Lastly, finish creating project by clicking “create” button.
    Finish Creating Project Name for Online Financial Management System Project in Django with Source Code

  • Step 6: Start Coding.

    Finally, we will now start adding functionality to our Django Framework by adding some functional codes.

Functionality and Codes of the Online Financial Management System Project in Django with Source Code

  • Create template for the salary form in Online Financial Management System Project in Django.

In this section, we will learn on how create a templates for the salary form. To start with, add the following code in your create.html under the folder of /templates/.

{% extends 'apps_base.html' %}

{% block title %}Create receipt{% endblock %}

{% block apps_base_title %}Create a new salary record{% endblock %}

{% block apps_base_content %}
    {% if company_payees %}
        <form action="{% url 'create_salary' %}" method="post" class="form-block">
            {% csrf_token %}
            <input name="company_uuid" type="hidden" value="{{ company_uuid }}" readonly required/>
            <div class="form-group">
                <label for="create-salary-payee">Select a staff in {{ company_name }}</label>
                <select id="create-salary-payee" class="custom-select form-control" name="payee_id" required>
                    <option value="">None</option>
                    {% for payee in company_payees %}
                        <option value="{{ payee.id }}">{{ payee.full_name }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group">
                <label for="create-salary-base-salary">Base Salary</label>
                <input id="create-salary-base-salary" name="base_salary" class="form-control" type="number" min="0"
                       step="0.01"
                       required/>
            </div>
            <div class="form-group">
                <label for="create-salary-bonus">Bonus</label>
                <input id="create-salary-bonus" name="bonus" class="form-control" type="number" min="0" step="0.01"
                       required/>
            </div>
            <div class="form-group">
                <label for="create-salary-total-salary">Total</label>
                <input id="create-salary-total-salary" name="total" class="form-control" type="number" readonly
                       required/>
            </div>
            <div class="form-group">
                <label for="create-salary-date">Date</label>
                <input id="create-salary-date" name="date" class="form-control auto-set-to-today" type="date" required/>
            </div>
            <button class="btn btn-lg btn-primary btn-block" type="submit">Create</button>
        </form>
    {% else %}
        <div class="alert alert-warning" role="alert">
            <strong>No staff to be paid!</strong>
            <p>All staff in your company are paid.</p>
        </div>
    {% endif %}
{% endblock %}

{% block apps_base_scripts %}
    <script>
        {# Auto calculate total cost #}
        var a, b;
        $(document).ready(function () {
            $("#create-salary-base-salary").change(function () {
                a = Number(this.value);
                document.getElementById("create-salary-total-salary").value = a + b;
            });

            $("#create-salary-bonus").change(function () {
                b = Number(this.value);
                document.getElementById("create-salary-total-salary").value = a + b;
            });
        });
    </script>
{% endblock %}

  • Create template for the homepage in Online Financial Management System Project in Django.

In this section, we will learn on how create a templates for the homepage. To start with, add the following code in your base.html under the folder of /templates/.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
    <meta charset="UTF-8">

    {% load static %}
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="{% static "css/bootstrap.min.css" %}"/>

    <!-- Font Awesome -->
    <link rel="stylesheet" href="{% static "css/font-awesome.min.css" %}"/>
    <link rel="stylesheet" href="{% static "css/custom-fa-font-style.css" %}"/>

    <!-- Global Custom Style -->
    <link rel="stylesheet" href="{% static "css/custom-style.css" %}"/>

    <!-- Additional Style -->
    {% block base_stylesheets %}{% endblock %}

    <link rel="icon" href="{% static "img/favicon.png" %}">
    <title>{% block title %}{% endblock %}</title>
</head>
<body>
<!-- Navigation Bar -->
<nav class="navbar navbar-expand-md navbar-dark" style="background-color: black" id="navbar">
    <a class="navbar-brand" href="{% url 'index' %}">Financial Management System</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample04"
            aria-controls="navbarsExample04" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarsExample04">
        <ul class="navbar-nav mr-auto">
            <!-- For Right Alignment -->
        </ul>
        <ul class="navbar-nav">
            <li class="nav-item">
                {% if user.is_authenticated %}
                    <div class="dropdown">
                        <a class="nav-link dropdown-toggle" id="user-btn" data-toggle="dropdown" aria-haspopup="true"
                           aria-expanded="false">
                            <i class="fa fa-user" aria-hidden="true"></i>
                            {{ user.get_username }}
                        </a>
                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
                            <a class="dropdown-item" href="{% url 'info' %}">My financial affairs</a>
                            <a class="dropdown-item" href="{% url 'change_password' %}">Change password</a>
                            <a class="dropdown-item" href="{% url 'logout' %}">Logout</a>
                        </div>
                    </div>
                {% else %}
                    <a class="nav-link"
                       href="{% url 'login' %}">
                        <i class="fa fa-sign-in" aria-hidden="true"></i>Login
                    </a>
                {% endif %}
            </li>
        </ul>
    </div>
</nav>

<div class="main-content">
    <!-- Global Alerts Area -->
    <div class="container text-center mt-3" id="global-alerts">
        {% block alerts_area %}
            {% for alert in alerts %}
                {% if alert.0 == 'success' %}
                    <div class="alert alert-success my-2">
                        <strong>{{ alert.1 }}</strong>
                        <p class="my-0">{{ alert.2 }}</p>
                    </div>
                {% elif alert.0 == 'info' %}
                    <div class="alert alert-info my-2">
                        <strong>{{ alert.1 }}</strong>
                        <p class="my-0">{{ alert.2 }}</p>
                    </div>
                {% elif alert.0 == 'warning' %}
                    <div class="alert alert-warning my-2">
                        <strong>{{ alert.1 }}</strong>
                        <p class="my-0">{{ alert.2 }}</p>
                    </div>
                {% elif alert.0 == 'error' %}
                    <div class="alert alert-danger my-2">
                        <strong>{{ alert.1 }}</strong>
                        <p class="my-0">{{ alert.2 }}</p>
                    </div>
                {% endif %}
            {% endfor %}
            {% block additional_alerts_area %}
            {% endblock %}
        {% endblock %}
    </div>
    {% block base_content %}{% endblock %}
</div>


<!-- Footer -->
<footer class="footer text-muted">
    <div class="container">
        <p class="float-right">Constructed in <a href="http://getbootstrap.com/">Bootstrap</a></p>
        <p>© Online Financial Management System 2021
            </a>
        </p>
    </div>
</footer>

<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="{% static "js/jquery-3.2.1.slim.min.js" %}"></script>
<script src="{% static "js/popper.min.js" %}"></script>
<script src="{% static "js/bootstrap.min.js" %}"></script>
<script>
    {# Initialize tooltips #}
    $(document).ready(function () {
        $('[data-toggle="tooltip"]').tooltip();
    });

    {# Get tooltips on disabled buttons #}
    var disabledButton = $('.disabled-button-container > div');

    disabledButton.hover(function (e) {
        if ($(this).prev('button').is(':disabled')) {
            $(this).prev('button').tooltip('toggle');
            $(this).parent().css("cursor", "not-allowed");
        } else {
            $(this).parent().css("cursor", "pointer");
        }
    });

    disabledButton.click(function (e) {
        if (!$(this).prev('button').is(':disabled')) {
            $(this).prev('button').trigger('click');
        }
    });

    {# Make date input field auto set to today #}
    Date.prototype.toDateInputValue = (function () {
        var local = new Date(this);
        local.setMinutes(this.getMinutes() - this.getTimezoneOffset());
        return local.toJSON().slice(0, 10);
    });
    $(document).ready(function () {
        $('.auto-set-to-today').val(new Date().toDateInputValue());
    });
</script>
{% block base_scripts %}{% endblock %}
</body>
</html>

  • Create template for the company details form in Online Financial Management System Project in Django.

In this section, we will learn on how create a templates for the company details form. To start with, add the following code in your details.html under the folder of /templates/.

{% extends 'apps_base.html' %}

{% block title %}Details of Company{% endblock %}

{% block apps_base_title %}Details of Company{% endblock %}

{% block apps_base_content %}
    <table class="table table-striped text-center table-responsive">
        <thead class="thead-inverse">
        <tr>
            <th class="text-center">Name</th>
            <th class="text-center">Owner</th>
            <th class="text-center">Number of Staff</th>
            <th class="text-center">UUID</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>{{ company.name }}</td>
            <td>{{ company.owner.full_name }}</td>
            <td>{{ staff_number }}</td>
            <td>{{ company.unique_id }}</td>
        </tr>
        </tbody>
    </table>

    <div class="text-center">
        {% if is_owner %}
            <a href="{% url 'manage_staff' company_uuid=company.unique_id %}"  class="btn btn-info"
               role="button">Manage</a>
            <a href="{% url 'update_company' company_uuid=company.unique_id %}" class="btn btn-primary"
               role="button">Update</a>
        {% endif %}
        <!-- Delete Modal Trigger Button -->
        <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#delete-or-quit-confirmation">
            {% if is_owner %}
                DELETE
            {% else %}
                QUIT
            {% endif %}
        </button>
    </div>
    <!-- Delete Modal -->
    <div class="modal fade" id="delete-or-quit-confirmation" tabindex="-1" role="dialog"
         aria-labelledby="delete-or-quit-confirmation-label"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Confirmation</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    {% if is_owner %}
                        Delete this company?
                    {% else %}
                        Quit this company?
                    {% endif %}
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <div class="text-center">
                        {% if is_owner %}
                            <div class="text-center">
                                <form action="{% url 'delete_company' %}" method="post">
                                    {% csrf_token %}
                                    <input type="hidden" name="unique_id" value="{{ company.unique_id }}"/>
                                    <button class="btn btn-danger" data-toggle="confirmation" type="submit">Confirm
                                    </button>
                                </form>
                            </div>
                        {% else %}
                            <div class="text-center">
                                <form action="{% url 'quit_company' %}" method="post">
                                    {% csrf_token %}
                                    <input type="hidden" name="unique_id" value="{{ company.unique_id }}"/>
                                    <button class="btn btn-danger" data-toggle="confirmation" type="submit">Confirm
                                    </button>
                                </form>
                            </div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

Downloadable Source Code Below.

Anyway, if you want to level up your programming knowledge, especially python, try this new article I’ve made for you Best Python Projects with source code for Beginners. But If you’re going to focus on web development using Django, you can download here from our list of Best Django Projects with source code based on real-world projects.

How To Run The Online Financial Management System Project in Django?

  • Step 1: Extract/unzip the file
  • Step 2: Go inside the project folder, open cmd and type the following commands to install Django Framework and run the webserver:
  • pip install -r requirements.txt
  • python manage.py migrate
  • python manage.py runserver
  • Step 3: Finally, open the browser and go to http://127.0.0.1:8000/

Summary

In summary, this 2021 Online Financial Management System Project in Django with Source Code can be useful to students or professional who wants to learn python programming language. This project can also be modified to fit your personal requirements. Hope this project will help you to improve your skills. Happy Coding!

Inquiries

If you have any questions or suggestions about Online Financial Management System Project in Django with Source Code, please feel free to leave a comment below.

Leave a Comment