Thrift Financial

1
INTRODUCTION
THRIFT (“the quality of using money and other resources carefully and not wastefully.”) is an expense
tracking and management system designed to help individuals and businesses track,
manage, and analyse their expenses conveniently and efficiently. It provides a user-friendly
interface and a range of features to simplify the process of expense tracking on
smartphones, tablets & computers.
This system allows users to record their expenses on-the-go. It ensures that expenses are
captured in real-time and hence minimizing the chance of forgetting or missing any
transactions.
It enables users to categorize expenses based on predefined categories or by creating

custom categories. Users can assign tags or labels to expenses, making it easier to search
and analyse spending patterns. It helps users gain a holistic view of their expenditure and
identify areas where they can optimize their spending. It will help users to stay within their
allocated budgets which will promote responsible spending, aids in achieving financial
targets, and encourages better financial discipline.
Expense tracking system generate reports and analytics that provide insights into spending
patterns. Users can view summaries, charts, and graphs that depict their expenses by
category, time period, or other criteria. These visual representations enable users to
understand their financial habits, identify trends, and make data-driven decisions to
improve their financial well-being.
In summery Expense tracking apps provide individuals and businesses with a convenient
and efficient way to manage their expenses. With their intuitive interfaces, comprehensive
features, and analytical capabilities, these apps empower users to gain control over their
finances, make informed decisions, and work towards achieving their financial goals.
Whether it is personal finance management or business expense tracking, this system offers
a portable and user-friendly solution for effective expense management.
2
OBJECTIVE
The main objective of Expense tracking and management system is to provide an effective
method of keeping track of an individual or business’s expenditure in order to take a firm
and stable decision in the upcoming days or years and to manage their budget as peer there
need by analysing them using data visualisation charts and graphs.
• Generating reports and analytics to provide insights into spending patterns.

• Provide convenient and efficient way to manage their expenses.
• Enables users to categorize expenses based on predefined categories or by creating
custom categories
• Budget management
• Provide Financial Transparency
• Efficiency and Time Savings
3
SYSTEM REQUIREMENT
The general hardware and software requirements to consider for an expense tracking
system are as follow:
Hardware Requirements:
1. Device: Users typically require a computer, smartphone, or tablet to access the

expense tracking system. The device should have sufficient processing power,
memory, and storage capacity to run the application smoothly.
2.Processor: THRIFT (EXPENSE TRACKING SYSTEM) can be operated

on various devices having any of the below processors
• AMD Athlon Gold 3150U with Radeon Graphics 2.40GHz

• intel Core i7-2xxxQM/XM processor and above
Software Requirements:
1. Operating System: The expense tracking system (THRIFT) is compatible with
all operating systems. Common options include
• Windows 7 and above
• macOS
• web-based applications that are accessible through standard web browsers.
2. Database Management System: The expense tracking system employ
a database management system to store and manage expense data. The
database system depends on the scalability, performance, and security
requirements of the application.
• MySQL Workbench
3.Web-Technology: expense tracking system is developed using a
framework and markup language.
• Python version- 3.9.2 (64 bit (AMD64)
• HTML (Hypertext markup language)
• CSS (Cascading style sheet)
• FLASK(Python)
4
ADVANTAGES
An expense tracking and management system offers numerous advantages for individuals
and businesses. Here are some key benefits:
1. Financial Awareness:
An expense tracking system provides users with a clear understanding of their
spending habits. By recording and categorizing expenses, users gain insight into where
their money is being spent, helping them make informed financial decisions. This
awareness enables better control over personal or business finances and promotes
responsible spending.
2. Budget Management:
Effective budget management is crucial for financial stability. An expense tracking
system allows users to set budgets for different expense categories and monitor their
spending against those budgets. Users receive alerts when they exceed their budgeted
amounts, helping them stay on track and avoid overspending.
3. Expense Analysis:
An expense tracking system generates reports, charts, and graphs that analyse spending
patterns over time. Users can identify trends, compare expenses across categories, and
gain a comprehensive overview of their financial situation. This analysis helps users
make informed decisions on where to cut costs, optimize spending, and allocate
resources more effectively.
4. Efficiency and Time Savings:
Manual expense tracking can be time-consuming and prone to errors. An automated
expense tracking system streamlines the process by allowing users to quickly enter
expenses, capture receipts, and categorize transactions. This automation saves time,
reduces human error, and eliminates the need for manual data entry.
5. Financial Transparency:
An expense tracking system promotes transparency within organizations. It allows
business owners, managers, or financial advisors to access real-time expense data,
monitor spending across departments or projects, and ensure compliance with financial
policies. This transparency enhances financial control, accountability, and decision-
making.
5
DISADVANTAGES OF EXISTING SYSTEM
While manual or traditional methods of tracking expenditure comes with several

disadvantages. Here are some drawbacks of manual/traditional expense tracking systems:
1. Time-consuming:
Manual expense tracking requires significant time and effort. Users need to
manually record each expense, gather receipts, and organize them accordingly. This
process can be tedious and time-consuming, especially when dealing with a large
volume of expenses.
2. Prone to Errors:
Manual data entry is susceptible to human errors. From incorrect calculations to
data entry mistakes, the chances of errors are higher in manual expense tracking
systems. These errors can lead to inaccurate financial records and reporting,
potentially impacting budgeting, tax filings, and decision-making.
3. Lack of Real-time Visibility:
Manual expense tracking systems often lack real-time visibility into financial data.
Users need to wait until they have compiled and organized all the expenses before
they can assess their spending patterns and financial situation. This delay can hinder
proactive financial management and timely decision-making.
4. Limited Reporting and Analysis:
Traditional expense tracking methods may not offer sophisticated reporting and
analysis capabilities. Users might have to manually aggregate data from multiple
sources to generate reports or analyze spending patterns. This limitation can hinder
the ability to gain meaningful insights and make informed financial decisions.
5. Difficulties in Retrieval and Storage:
Storing and retrieving expense records in manual systems can be challenging. Paper
receipts and documents can be misplaced, damaged, or lost over time. Locating
specific records when needed can become time-consuming and cumbersome,
leading to inefficiencies and potential compliance issues.
6. Reduced Mobility and Accessibility:
6
Manual systems are typically location-dependent and require physical access to

expense records. This limitation can be problematic for individuals or businesses
that need to track expenses while on the go or across multiple locations. It restricts
mobility and can hinder timely decision-making.
7. Difficulty in Scalability:
Manual expense tracking systems may struggle to handle increased volumes of
expenses. As the number of transactions grows, the process becomes more complex
and time-consuming. It may require additional resources and manpower to manage
the expanding workload effectively.
8. Security Risks:
Manual systems pose security risks to sensitive financial data. Paper receipts or
documents can be easily lost, stolen, or accessed by unauthorized individuals. This
increases the vulnerability of financial information and raises concerns about data
privacy and compliance.
7
DATA FLOW DIAGRAM

8
9
ENTITY RELATIONSHIP DIAGRAM

10
SCREENSHORTS
11
12
13
14
15
16
17
18
19
1. Layout.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>THRIFT</title>
<meta content="" name="description">
<meta content="" name="keywords">

<link href="/static/icons/dashboard-icon.png" rel="icon">
<link href="/static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">

<link href="https://fonts.gstatic.com" rel="preconnect">

<link href="/static/assets/css/style.css" rel="stylesheet">
</head>
<body>
{% block content %}
{% endblock %}


<header id="header" class="header fixed-top d-flex align-items-center">
<div class="d-flex align-items-center justify-content-between">
<a href="/" class="logo d-flex align-items-center">
<img src="/static/icons/dashboard-icon.png" alt="thrift-logo">
<span class="d-none d-lg-block">THRIFT</span>
</a>
<i class="bi bi-list toggle-sidebar-btn"></i>
</div>
20


<div class="search-bar">
<form class="search-form d-flex align-items-center" method="POST"
action="#">
<input type="text" name="query" placeholder="Search" title="Enter search
keyword">
<button type="submit" title="Search"><i class="bi bi-search"></i></button>
</form>
</div>

<nav class="header-nav ms-auto">
<ul class="d-flex align-items-center">
<li class="nav-item d-block d-lg-none">
<a class="nav-link nav-icon search-bar-toggle " href="#">
<i class="bi bi-search"></i>
</a>
</li>
<li class="nav-item dropdown pe-3">
<a class="nav-link nav-profile d-flex align-items-center pe-0" href="#"
data-bs-toggle="dropdown">
<i class="bi bi-person-fill"></i>
{% if "user_email" in session %}
<span class="d-none d-md-block dropdown-toggle ps-
2">{{session['first_name']}}</span>
</a>
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow
profile">
<li class="dropdown-header">
<h6> {{session['first_name']}} </h6>
</li>
<li> <hr class="dropdown-divider"> </li>
<li><a class="dropdown-item d-flex align-items-center"
href="/user_profile">
21
<i class="bi bi-person"></i>

<span>My Profile</span> </a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<a class="dropdown-item d-flex align-items-center" href="/user_logout">
<i class="bi bi-box-arrow-right"></i>
<span>Sign Out</span>
</a>
</li>
{%else%}
<a class="nav-link nav-profile d-flex align-items-center pe-0"
href="/user_login">
<span class="d-none d-md-block dropdown-toggle ps-2">LOGIN</span>
</a>
{%endif%}
</ul>
</li>
</ul>
</nav>
</header>

<aside id="sidebar" class="sidebar">
<ul class="sidebar-nav" id="sidebar-nav">
<li class="nav-item">
<a class="nav-link " href="/user_dashboard">
<i class="bi bi-grid"></i>
<span>Dashboard</span>
</a>
</li>
22
<a class="nav-link collapsed" href="/add_income">
<i class="bi bi-bank2"></i>
<span>Add income</span>
</a>
</li>
<a class="nav-link collapsed" href="/add_expense">
<i class="bi bi-layout-text-window-reverse"></i>
<span>Add expense</span>
</a>
</li>

<a class="nav-link collapsed" href="/lpg_cylinder">
<i class="bi bi-fire"></i>
<span>LGP Cylinder</span>
</a>
</li>
<a class="nav-link collapsed" href="##">
<i class="bi bi-house"></i>
<span>Rent Details</span>
</a>
</li>
<a class="nav-link collapsed" data-bs-target="#tables-nav" data-bs-
toggle="collapse" href="#">
<i class="bi bi-cash-coin"></i><span>Transactions</span><i class="bi bi-
chevron-down ms-auto"></i>
</a>
<ul id="tables-nav" class="nav-content collapse " data-bs-parent="#sidebar-
nav">
23
<li>
<a href="/expense_transaction">
<i class="bi bi-circle"></i><span>All Expenses</span>
</a>
</li>
<li>
<a href="/income_transaction">
<i class="bi bi-circle"></i><span>All Income</span>
</a> </li>
</ul>
</li>
<a class="nav-link collapsed" href="/add_budget">
<i class="bi bi-command"></i>
<span>Set Budget</span>
</a>
</li>
<a class="nav-link collapsed" href="/user_profile">
<i class="bi bi-person"></i>
<span>Profile</span>
</a>
</li>
<a class="nav-link collapsed" href="/user_logout">
<i class="bi bi-dash-circle"></i>
<span>Log Out</span>
</a>
</li>
{%endif%}
{% if (session['user_email'] == undefined ) %}
<a class="nav-link collapsed" href="/user_registration">
24
<i class="bi bi-card-list"></i>

<span>Register</span>
</a>
</li>
<a class="nav-link collapsed" href="/user_login">
<i class="bi bi-box-arrow-in-right"></i>
<span>Login</span>
</a>
</li>
{% else %} {% endif %}
</ul>
</aside>

<footer id="footer" class="footer">
<div class="credits">
Designed by <a href="#####">VIRAJ II</a>
</div>
</footer>

<script src="/static/assets/js/main.js"></script>
</body>
25
2. Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>THRIFT</title>

<link href="/static/icons/dashboard-icon.png" rel="apple-touch-icon">

<link href="/static/assets/vendor/bootstrap/css/bootstrap.min.css"
rel="stylesheet">
<link href="/static/assets/vendor/bootstrap-icons/bootstrap-icons.css"
rel="stylesheet">
<link href="/static/assets/css/index_style.css" rel="stylesheet">
</head>
<body>

<header id="header" class="fixed-top d-flex align-items-center">
<div class="container d-flex justify-content-between align-items-center">
<div class="logo">
<a href="/" class="logo">
<h1><a href="/">THRIFT</a></h1>
</div>
26
{% with messages = get_flashed_messages() %} 
{% if messages %} 
{% for message in messages %} 
<div class="alert alert-success" role="success">
{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<nav id="navbar" class="navbar">

<ul>
<li><a href="/">Home</a></li>
<li><a href="/">About</a></li>
<li class="dropdown">
<a href="#"><span>Register</span>
<i class="bi bi-chevron-down"></i>
</a>
<ul>
<li><a href="/user_registration">user_registration</a></li>
<li><a href="#">Admin_registration</a></li>
</ul>
<li class="dropdown"><a href="#"><span>Login</span> <i class="bi bi-
chevron-down"></i></a>
<ul>
<li><a href="/user_login">user_login</a></li>
<li><a href="#">Admin_login</a></li>
</ul>
</li>
<li><a href="contact.html">Contact Us</a></li>
27
<li><a href="/user_dashboard">Dashboard</a></li>
</ul>
<ul><h6>
<li class="dropdown"><a href="##">{{session['first_name']}}</a>
<ul>
<li><a href="/user_profile">Profile</a></li>
<li><a href="/user_logout">Log out</a></li>
</ul> </li>
</h6> </ul>
{% endif %}
</nav>
</div>
</header>

<section class="hero-section" id="hero">
<div class="wave">
</div>
<div class="container">
<div class="row align-items-center">
<div class="col-12 hero-text-image">
<div class="row">
<div class="col-lg-8 text-center text-lg-start">
<h1>Your personal expense tracker</h1>
<p class="mb-5" >The active management of your finances.</p>
<p><a
href="/user_dashboard" class="btn btn-outline-white">Dashboard</a></p>
{% else %}
28
<p ><a href="/user_registration" class="btn btn-outline-white">Get

started</a></p>
{%endif%}
</div>
<div class="col-lg-4 iphone-wrap">
<img src="/static/assets/img/phone_1.jpg" alt="Image" class="phone-1" >
<img src="/static/assets/img/phone_2.jpg" alt="Image" class="phone-2" >
</div> </div>
</div> </div>
</div>
</section>

<main id="main">


<section class="section">
<div class="row justify-content-center text-center mb-5">
<div class="col-md-5" data-aos="fade-up">
<h2 class="section-heading">
Features and Insights
</h2>
</div>
</div>
<div class="row">
<div class="col-md-4" data-aos="fade-up" data-aos-delay="">
<div class="feature-1 text-center">
<div class="wrap-icon icon-1">
<i class="bi bi-journal-check"></i>
</div>
29
<h3 class="mb-3">Expense Recording</h3>

<p>Track every penny you spend all in one place</p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up" data-aos-delay="100">
<i class="bi bi-collection"></i>
</div>
<h3 class="mb-3">Categorization and Tagging</h3>
<p>catagorize your spending for better analysis.</p>
</div>
</div>
<div class="col-md-4" data-aos="fade-up" data-aos-delay="200">
<i class="bi bi-bar-chart"></i>
</div>
<h3 class="mb-3">Real-Time Expense Analysis</h3>
<p>generates real-time reports and analytics that offer valuable insights into
spending patterns.</p>
</div>
</div>
</div>
</div>
</section>
<div class="col-md-4 ms-auto order-2">
<h2 class="mb-4">Why THRIFT</h2>
<p class="mb-4">
When you track your expenses, you take control of your finances.
30
It empowers you to control spending impulses and eliminate frivolous

spending, thereby avoiding debt.
You can, instead, work to create financial security for yourself by spending
your money more wisely.
</p>
<p><a href="/user_dashboard" class="btn btn-primary">Dashboard</a></p>
{%else%}
<p><a href="/user_registration" class="btn btn-primary">Get started</a></p>
{%endif%}
</div>
<div class="col-md-6" data-aos="fade-right">
<img src="/static/assets/img/undraw_svg_3.svg" alt="Image" class="img-fluid">
</div> </div>
</div>
</section>

<section class="section cta-section">
<div class="col-md-6 me-auto text-center text-md-start mb-5 mb-md-0">
<h2>Lets get started with THRIFT</h2>
</div>
<div class="col-md-5 text-center text-md-end">
<p><a href="#" class="btn d-inline-flex align-items-center"><i class="bx bxl-
apple"></i><span>App store</span></a> <a href="#" class="btn d-inline-flex align-
items-center"><i class="bx bxl-play-store"></i><span>Google play</span></a></p>
</div> </div>
</div>
</section>
</main>

<footer class="footer" role="contentinfo">
31
<div class="row">
<div class="col-md-4 mb-4 mb-md-0">
<h3>About THRIFT</h3>
<p>A tool designed to help individuals or businesses track and manage their
expenses efficiently. It allows users to record, categorize, and analyze their spending,
providing valuable insights into their financial habits. </p>
<p class="social">
<a href="#"><span class="bi bi-twitter"></span></a>
<a href="#"><span class="bi bi-facebook"></span></a>
<a href="#"><span class="bi bi-instagram"></span></a>
<a href="{{session['linkdin']}}"><span class="bi bi-linkedin"></span></a>
</p>
</div>
<div class="row justify-content-center text-center">
<div class="col-md-7">
Designed by <a href="##">Viraj II</a>
</div> </div>
</div> </div>
</footer>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
class="bi bi-arrow-up-short"></i></a>

<script src="/static/assets/vendor/aos/aos.js"></script>
<script src="/static/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="/static/assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="/static/assets/vendor/php-email-form/validate.js"></script>

<script src="/static/assets/js/index_main.js"></script>
</body>
</html>
32
3. user_dashboard.html
{% extends "layout.html" %}
<body>
{% block content %}
<main id="main" class="main">
<div class="pagetitle">
<h1>Dashboard</h1>
<nav>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/">Home</a></li>
<li class="breadcrumb-item active"><a
href="/user_dashboard">Dashboard</a></li>
</ol>
</nav>
</div>
<section class="section dashboard">
<div class="row">

<div class="col-lg-8">
<div class="row">


<div class="col-xxl-4 col-md-6">
<div class="card info-card sales-card">
<div class="filter">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-
dots"></i></a>
33
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">

<li class="dropdown-header text-start">
<h6>Filter</h6>
</li>
<li><a class="dropdown-item" action="/total_income">Today</a></li>
<li><a class="dropdown-item" href="#">This Month</a></li>
<li><a class="dropdown-item" href="#">This Year</a></li>
</ul>
</div>
<div class="card-body">
<h5 class="card-title">Total income <span>| Today</span></h5>
<div class="d-flex align-items-center">

<div class="card-icon rounded-circle d-flex align-items-center justify-
content-center">
<i class="bi bi-currency-rupee" style="color: hwb(110 19% 19%);"></i>
</div>
<div class="ps-3">
<h6>{% if income[0][0]!=None%}{{income[0][0]}}{% else %} 0{%
endif %}
</h6>
</div>
</div>
</div>
</div>
</div>

<div class="card info-card revenue-card">
34
dots"></i></a>
<h6>Filter</h6>
</li>
<li><a class="dropdown-item" href="#">Today</a></li>
</ul>
</div>
<h5 class="card-title">Total spent </h5>

content-center">
<i class="bi bi-currency-rupee" style="color: hwb(0 9% 11%)"></i>
</div>
<div class="ps-3">
<h6>{% if expense[0][0]!=None%}{{expense[0][0]}}{% else %}0 {%
endif %}
</h6>
<span class="text-success small pt-1 fw-bold">8%</span> <span class="text-
muted
small pt-2 ps-1">
increase
</span>
</div>
</div>
</div>
</div>
</div>
35


<div class="card info-card revenue-card">
<h5 class="card-title">Amount left</h5>
content-center">
<i class="bi bi-currency-rupee"></i>
</div>
<div class="ps-3">
<h6> {{rest}}</h6>
<span class="text-success small pt-1 fw-bold">8%</span> <span
class="text-muted
small pt-2 ps-1">increase</span>
</div>
</div>
</div>
</div>
</div>

<div class="col-12">
<div class="card">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-three-dots">
</i></a>
<h6>Filter</h6>
</li>
36

</ul>
</div>
<h5 class="card-title">Reports <span>/Today</span></h5>
</div>
</div>
</div>

<div class="card top-selling overflow-auto">
dots"></i></a>
<h6>Filter</h6>
</li>
</ul> </div>
<div class="card-body pb-0">
<h5 class="card-title">Most Expenses<span>| Today</span></h5>
<table class="table table-borderless">
<thead>
<tr>
<th scope="col">category</th>
<th scope="col">number</th>
<th scope="col">total amount</th>
</tr>
37
</thead>
<tbody>
{% for m in most %}
<tr>
<th scope="row">{{m[0]}}</th>
<td><a href="#" class="text-primary fw-bold">{{m[1]}}</a></td>
<td>{{m[2]}}</td>
<td class="fw-bold">{{m[3]}}</td>
<td>{{m[4]}}</td>
</tr>
{%endfor%}
</tbody>
</table> </div>
</div> </div>
</div>
</div>


<div class="card">
<h5 class="card-title">Recent Expenditure<span>|(last 5 expense)</span></h5>
<div class="activity">
{% for a in recent %}
<div class="activity-item d-flex">
<div class="activite-label">{{a[0]}}&ensp;</div>
<i class='bi bi-circle-fill activity-badge text-danger align-self-start'></i>
<div class="activity-content">
( {{a[1]}} )&ensp;<a href="#" class="fw-bold text-dark">{{a[2]}}</a>&ensp;
({{a[3]}} )
</div> </div>
{%endfor%}
38
</div>
</div>
</div>

<div class="card">
<a class="icon" href="#" data-bs-toggle="dropdown"><i class="bi bi-
three-dots"></i></a>
<h6>Filter</h6>
</li>
</ul>
</div>
</div>
</div>
</section>


{% endblock %}
</body>
</html>
39
4. user_registration.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Pages / Register </title>



<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">



<link href="/static/assets/vendor/bootstrap/css/bootstrap.min.css"
rel="stylesheet">
<link href="/static/assets/vendor/bootstrap-icons/bootstrap-icons.css"
rel="stylesheet">
<link href="/static/assets/vendor/boxicons/css/boxicons.min.css"
rel="stylesheet">
<link href="/static/assets/vendor/quill/quill.snow.css" rel="stylesheet">
<link href="/static/assets/vendor/quill/quill.bubble.css" rel="stylesheet">
<link href="/static/assets/vendor/remixicon/remixicon.css" rel="stylesheet">
40
<link href="/static/assets/vendor/simple-datatables/style.css" rel="stylesheet">

</head>
<body>
<main>
<section class="section register min-vh-100 d-flex flex-column align-items-

center justify-
content-center py-4">
<div class="row justify-content-center">
<div class="col-lg-4 col-md-6 d-flex flex-column align-items-center justify-
content-center">
<div class="d-flex justify-content-center py-4">

<a href="index.html" class="logo d-flex align-items-center w-auto">
<img src="assets/img/logo.png" alt="">
</a>
</div>
<div class="card mb-3">
{% with messages = get_flashed_messages() %}


41
<div class="alert alert-danger" role="alert">

{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<div class="pt-4 pb-2">
<h5 class="card-title text-center pb-0 fs-4">Create an Account</h5>
<p class="text-center small">Enter your personal details to create account</p>
</div>
<form action="/user_registration_insert" method="POST" class="row

g-3 needs-
validation" novalidate>
<div class="col-6">
<label for="first_name" class="form-label">First Name</label>
<input type="text" name="first_name" class="form-control"
id="first_name" required>
<div class="invalid-feedback">Please, enter your name!</div>
</div>
<div class="col-6">
<label for="last_Name" class="form-label">Last Name</label>
<input type="text" name="last_name" class="form-control"
id="last_Name" required>
<div class="invalid-feedback">Please, enter your name!</div>
</div>
<label for="Email" class="form-label">Your Email</label>
42
<input type="email" name="email" class="form-control" id="Email" required>

<div class="invalid-feedback">Please enter a valid Email adddress!</div>
</div>
<label for="contact" class="form-label">Mobile</label>
<div class="input-group has-validation">
<span class="input-group-text" id="inputGroupPrepend">+91</span>
<input type="text" name="mobile" class="form-control"
id="mobile" required>
<div class="invalid-feedback">Please enter mobile number</div>
</div>
</div>
<label for="Password" class="form-label">Password</label>
<input type="password" name="password" class="form-control"
id="Password" required>
<div class="invalid-feedback">Please enter your password!</div>
</div>
<div class="col-5 row g-3">
<imgsrc="../static/captcha/user_captcha.png" width="170px"
height="60px"><br>
</div>
<div class="col-6">
<label for="captcha" class="form-label">Enter the text(case sensitive)</label>
<input type="captcha" name="captcha" class="form-control" id="captcha"
required>
</div>
43
<div class="form-check">
<input class="form-check-input" name="terms" type="checkbox"
value="" id="acceptTerms" required>
<label class="form-check-label" for="acceptTerms">I agree and accept
the
<a href="#">terms and conditions</a></label>
<div class="invalid-feedback">You must agree before submitting.</div>
</div>
</div>
<button class="btn btn-primary w-100" type="submit">Create Account</button>
</div>
<p class="small mb-0">Already have an account? <a href="/user_login">Log in
</a></p>
</div>
</form>
</div>
</div>
Designed by <a href="######">VIRAJ II</a>
</div>
</div>
</div>
</div>
</section>
</div>
</form>
44



<script src="/static/assets/vendor/apexcharts/apexcharts.min.js"></script>
<script src="/static/assets/vendor/chart.js/chart.umd.js"></script>
<script src="assets/vendor/echarts/echarts.min.js"></script>
<script src="/static/assets/vendor/quill/quill.min.js"></script>
<script src="/static/assets/vendor/simple-datatables/simple-datatables.js"></script>
<script src="/static/assets/vendor/tinymce/tinymce.min.js"></script>

</body>
</html>
45
5. user_login.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>user_Login-THRIFT</title>

<link
href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,7
00,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i
,600,600i,700,700i" rel="stylesheet">

<link href="/static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="/static/assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="/static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
46

</head>
<body>
{% block content %}
<main>
<section class="section register min-vh-100 d-flex flex-column align-items-center
justify-content-
center py-4">
content-center">
</a>
<div class="alert alert-danger" role="alert">
{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
47

<h5 class="card-title text-center pb-0 fs-4">Login to Your Account</h5>
<p class="text-center small">Enter your registered Email & password to
login</p>
</div>
<form action="/user_login_verify" method="POST" class="row g-3 needs-

validation"
novalidate>
<label for="email" class="form-label">Email_ID</label>
<input type="text" name="email" class="form-control" id="email" required>
<div class="invalid-feedback">Please enter your username.</div>
</div>
</div>
<label for="Password" class="form-label">Password</label>
<input type="password" name="password" class="form-control" id="Password"
required>
<div class="invalid-feedback">Please enter your password!</div>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="remember" value="true"
id="rememberMe">
<label class="form-check-label" for="rememberMe">Remember me</label>
</div>
</div>
48
<button class="btn btn-primary w-100" type="submit">Login</button>

</div>
<p class="small mb-0">Don't have account? <a href="/user_registration">
Create an account</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<script src="assets/vendor/apexcharts/apexcharts.min.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/chart.js/chart.umd.js"></script>
<script src="assets/vendor/quill/quill.min.js"></script>
<script src="assets/vendor/simple-datatables/simple-datatables.js"></script>
<script src="assets/vendor/tinymce/tinymce.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
{% endblock %}
</body>
</html>
49
6. user_profile.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Users_Profile</title>


<link href="/static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">

<link

50


</head>
<body>
{% block content %}
<h1>Profile</h1>
<nav>
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
<li class="breadcrumb-item">Users</li>
<li class="breadcrumb-item active">Profile</li>
</ol>
</nav>
<section class="section profile">

<div class="row">
<div class="col-xl-4">
<div class="card">
<div class="card-body profile-card pt-4 d-flex flex-column align-items-center">
{% for r in record %}
51
<img src="/static/profile_image/{{r[4]}}" alt="Profile" class="rounded-circle">

{% endfor %}
<h2>{{session['first_name']}}</h2>
<div class="social-links mt-2">

<a href="{{session['twitter']}}" class="twitter"><i class="bi bi-twitter"></i></a>
<a href="{{session['facebook']}}" class="facebook"><i class="bi bi-
facebook"></i></a>
<a href="{{session['instagram']}}" class="instagram"><i class="bi bi-
instagram"></i></a>
<a href="{{session['linkdin']}}" class="linkedin"><i class="bi bi-
linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="col-xl-8">
{% with messages = get_flashed_messages() %} 
{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<div class="card">
<div class="card-body pt-3">
52


<ul class="nav nav-tabs nav-tabs-bordered">
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#profile-
overview">Overview</button>
</li>
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile-
edit">Edit Profile</button>
</li>
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile-change-
password">Change Password</button>
</li>
</ul>
<div class="tab-content pt-2">
<div class="tab-pane fade show active profile-overview" id="profile-overview">
<h5 class="card-title">Profile Details</h5>
<div class="row">
<div class="col-lg-3 col-md-4 label ">Full Name</div>
<div class="col-lg-9 col-md-
8">{{session['first_name']}} {{session['last_name']}}</div>
</div>
<div class="row">
53
<div class="col-lg-3 col-md-4 label">Phone</div>

<div class="col-lg-9 col-md-8">{{session['mobile']}}</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-4 label">Email</div>
<div class="col-lg-9 col-md-8">{{session['user_email']}}</div>
</div>
</div>
<div class="tab-pane fade profile-edit pt-3" id="profile-edit">

<form action="/user_photo_update" method="post" enctype="multipart/form-

data">
<div >
<label for="profileImage" class="col-md-4 col-lg-3 col-form-label">Profile
Image</label>
<div class="col">
<input type="file" name="photo" class="form-control" placeholder="choose
" style="width:300px"><br>
<button type="submit" class="btn btn-primary">upload</button>
</div>
<div class="text-center">
</div>
</form>
54
<form action="/user_profile_update" method="post" >

</div>
</div>
<div class="row mb-3">

<label for="first_name" class="col-md-4 col-lg-3 col-form-
label">First Name</label>
<div class="col-md-8 col-lg-9">
<input type="text" name="first_name" class="form-control"
id="first_name" value="{{session['first_name']}}">
</div>
</div>

<label for="last_name" class="col-md-4 col-lg-3 col-form-
label">Last_name</label>
<input type="text" name="last_name" class="form-control"
id="last_name" value="{{session['last_name']}}">
</div>
</div>

<label for="Phone" class="col-md-4 col-lg-3 col-form-label">mobile</label>
<input type="text" name="mobile" class="form-control" id="mobile"
value="{{session['mobile']}}">
</div>
</div>
55

<label for="Twitter" class="col-md-4 col-lg-3 col-form-label">Twitter
Profile</label>
<input name="twitter" type="text" class="form-control" id="Twitter"
value="{{session['twitter']}}">
</div>
</div>

<label for="Facebook" class="col-md-4 col-lg-3 col-form-
label">Facebook Profile</label>
<input name="facebook" type="text" class="form-control"
id="Facebook" value="{{session['facebook']}}">
</div>
</div>

<label for="Instagram" class="col-md-4 col-lg-3 col-form-
label">Instagram Profile</label>
<input name="instagram" type="text" class="form-control"
id="Instagram" value="{{session['instagram']}}">
</div>
</div>

<label for="linkdin" class="col-md-4 col-lg-3 col-form-
label">Linkedin Profile</label>
56
<input name="linkdin" type="text" class="form-control" id="linkdin"

value="{{session['linkdin']}}">
</div>
</div>
<button type="submit" class="btn btn-primary">Save Changes</button>
</div>
</form>
</div>
<div class="tab-pane fade pt-3" id="profile-change-password">


<form action="/user_password_change" method="POST">

<label for="currentPassword" class="col-md-4 col-lg-3 col-form-
label">Current Password</label>
<input name="oldpassword" type="password" class="form-control"
id="currentPassword">
</div>
</div>

<label for="newPassword" class="col-md-4 col-lg-3 col-form-
label">New Password</label>
<input name="newpassword" type="password" class="form-control"
id="newPassword">
</div>
57
</div>

<label for="renewPassword" class="col-md-4 col-lg-3 col-form-
label">Re-enter New Password</label>
<input name="renewpassword" type="password" class="form-
control" id="renewPassword">
</div>
</div>
<button type="submit" class="btn btn-primary">Change Password</button>
</div>
</form>
</div>
</div>

</div>
</div>
</div>
</div>
</section>


<footer id="footer" class="footer">
Designed by <a href="###########">VIRAJ II</a>
</div>
58
</footer>
<a href="#" class="back-to-top d-flex align-items-center justify-content-

center"><i class="bi bi-arrow-up-short"></i></a>

<script src="/static/assets/vendor/echarts/echarts.min.js"></script>
<script src="/static/assets/vendor/simple-datatables/simple-
datatables.js"></script>

{% endblock %}
</body>
</html>
59
7. add_income.html
<!DOCTYPE html>
<html lang="en">
<body>
{% block content %}
<h1>INCOME</h1>
<nav>
<li class="breadcrumb-item"><a href="/add_income">Add
income</a></li>
</ol>
</nav>
<div class="row">
<div class="card">
<h5 class="card-title">ADD INCOME</h5>
{% with messages = get_flashed_messages() %} 
{{message}}
60
</div>
{% endfor %}
{% endif %}
{% endwith %}

<form action="/add_income_insert" method="POST" class="row g-3">
<label for="floatingName">DATE</label>
<div class="form-floating">
<input type="date" name="date" class="form-control" id="date"
onfocus="this.max=new Date().toISOString().split('T')[0]"
required>
</div>
</div>
<label for="floatingSelect">source OF INCOME</label>
<div class="form-floating mb-3">
<input type="text" name="source" class="form-control"
id="source"required>

</div>
</div>
<label for="floatingPassword">Amount</label>
61
<input type="text" name="amount" class="form-control" id="amount"

required>
</div>
</div>
<label for="floatingTextarea">Remarks</label>
<textarea class="form-control" name="remarks" id="remarks"
style="height: 100px;"></textarea>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
<div class="card">
<h5 class="card-title">Recent income<span>|(last 5 income)</span></h5>
<div class="activity">
{% for i in income %}
<div class="activity-item d-flex">
<div class="activite-label">{{ i[0]}} &ensp; </div>
<i class='bi bi-circle-fill activity-badge text-success align-self-start'></i>&ensp;
<div class="activity-content">
62
( {{i[1]}} )&ensp;<a href="#" class="fw-bold text-dark">{{i[2]}}</a> &ensp;

( {{i[3]}} )
</div>
</div>
{%endfor%}
</div>
</div>
</div>
</div>
</div>
</div>
</section><div class="col-lg-6">
</div></main>
<script src="/static/assets/vendor/echarts/echarts.min.js"></script>
<script src="/static/assets/vendor/simple-datatables/simple-datatables.js"></script>

{% endblock %}
</body>
</html>
63
8. add expense.html
<!DOCTYPE html>
<html lang="en">
<body>
{% block content %}
<h1>ADD EXPENSE</h1>
<nav>
<li class="breadcrumb-item"><a href="/add_expense"></a>add_expense</li>
</ol>
</nav>
<div class="row">
</div>
</div>
<div class="card">
64

{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<h5 class="card-title">ADD EXPENSE</h5>

<form action="/add_expense_insert" method="post" class="row g-3">
<label for="date" class="form-label">Date</label>
onfocus="this.max=new Date().toISOString().split('T')[0]">
</div>
<label for="category" class="form-label">category</label>
<select id="inputState" class="form-select" name="category">
<option selected>.....</option>
<option>food & dining</option>
<option>shopping</option>
<option>medical</option>
<option>travelling</option>
<option>entertainment</option>
<option>personal care</option>
<option>Education</option>
<option>bills & utilities</option>
<option>Rent</option>
<option>Taxes</option>
<option>gifts</option>
<option>Donation</option>
</select>
</div>
65
<label for="item" class="form-label">item</label>
<input type="text" class="form-control" id="item" name="item">
</div>
<label for="inputAddress" class="form-label">amount</label>
<input type="int" class="form-control" id="amount" name="amount">
</div>
<textarea class="form-control" name="remarks" id="remarks" style="height:
100px;" name="remarks"></textarea>
</div>
</div>
<button type="reset" class="btn btn-secondary">Reset</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
{% endblock %}
</body>
</html>
66
9. expense_transaction.html
<!DOCTYPE html>
<html lang="en">
<body>
{% block content %}
<h1>ADD EXPENSE</h1>
<nav>
<li class="breadcrumb-item"><a href="/add_expense"></a>add_expense</li>
</ol>
</nav>
<div class="row">
</div>
</div>
<div class="card">
67

{{message}}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<h5 class="card-title">ADD EXPENSE</h5>

<form action="/add_expense_insert" method="post" class="row g-3">
<label for="date" class="form-label">Date</label>
onfocus="this.max=new Date().toISOString().split('T')[0]">
</div>
<label for="category" class="form-label">category</label>
<select id="inputState" class="form-select" name="category">
<option selected>.....</option>
<option>food & dining</option>
<option>shopping</option>
<option>medical</option>
<option>travelling</option>
<option>entertainment</option>
<option>personal care</option>
<option>Education</option>
<option>bills & utilities</option>
<option>Rent</option>
<option>Taxes</option>
<option>gifts</option>
<option>Donation</option>
</select>
</div>
68
<label for="item" class="form-label">item</label>
<input type="text" class="form-control" id="item" name="item">
</div>
<label for="inputAddress" class="form-label">amount</label>
<input type="int" class="form-control" id="amount" name="amount">
</div>
<textarea class="form-control" name="remarks" id="remarks" style="height:
100px;" name="remarks"></textarea>
</div>
</div>
<button type="reset" class="btn btn-secondary">Reset</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
{% endblock %}
</body>
</html>
69
10. income_transaction.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>THRIFT-Dashboard</title>



<link

70

</head>
<body>
{% block content %}
<h1>TRANSACTIONS</h1>
<nav>
<li class="breadcrumb-item"><a href="/user_dashboard">Dashboard</a></li>
<li class="breadcrumb-item"><a href="/transaction">Transaction</a></li>
<li class="breadcrumb-item"><a href="/income_transaction">all_income</a></li>
</ol>
</nav>
<div class="row">
<div class="card">
<h5 class="card-title">All Income</h5>
<p>All of your tracsaction will be shown here<a href="#" target="_blank">....</p>

<table class="table datatable">
<thead>
<tr>
<th scope="col">Income_ID</th>
<th scope="col">Date</th>
<th scope="col">Source</th>
<th scope="col">Amount</th>
71
<th scope="col">Remarks</th>
</tr>
</thead>
<tbody>
{% for i in income %}
<tr>
<th scope="row">{{i[4]}}</th>
<td>{{i[0]}}</td>
<td>{{i[1]}}</td>
<td>{{i[2]}}</td>
<td>{{i[3]}}</td>
</tr>
{%endfor%}
</tbody>
</table>

</div>
</div>
</div>
</div>
</section>

{% endblock %}
</body>
</html>
72
11.user_email_verify.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>user_verify-THRIFT</title>



<link

73

</head>
<body>
<main>
<section class="section register d-flex flex-column align-items-center justify-content-

center py-4">
content-center">

</a>
<h5 class="card-title text-center pb-0 fs-4">Email verification</h5>
<p class="text-center small">Enter the OTP sent to your registered Email</p>
</div>
74
<form action="/user_email_otp_verify" method="POST" class="row g-3 needs-

validation" novalidate>
<label for="otp" class="form-label" style="text-align: center; color:
#f00909;">O T P</label>
<input type="text" name="otp" class="form-control" id="otp" required>
<div class="invalid-feedback">Please enter your OTP</div>
</div> </div>
<button class="btn btn-primary w-100" type="submit">Verify</button>
</div> </form>
</div> </div>
Designed by <a href="#####">VIRAJ II</a>
</div> </div>
</div> </div>
</section> </div>
<script src="assets/vendor/quill/quill.min.js"></script>
<script src="assets/vendor/simple-datatables/simple-datatables.js"></script>
<script src="assets/vendor/tinymce/tinymce.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
</body>
</html>
75
12. app.py
from flask import Flask, render_template, request, redirect, url_for, flash, session
from user import user_operation # importing from user.py
import hashlib # importing password encription module
from captcha.image import ImageCaptcha
# import flash from redirect,url_for
from flask_mail import *
import random
app = Flask(__name__) # creating object of Flask class

app.secret_key = "qwertyuiop"
# ...............mail configuration...............
app.config["MAIL_SERVER"] = 'smtp.office365.com'
app.config["MAIL_PORT"] = '587'
app.config["MAIL_USERNAME"] = 'pythonproject2023@outlook.com'
app.config["MAIL_PASSWORD"] = 'Viraj@123'
app.config["MAIL_USE_TLS"] = True
app.config["MAIL_USE_SSL"] = False
mail = Mail(app) # mail object
# creating index page route

@app.route("/") # routing/linking the page
def index(): # creating index function
# linking index.html to local server / rendering it from templet folder in
"project_python" folder
return render_template("index.html")
@app.route("/user_dashboard") # routing/linking the page

76
def user_dashboard():
if "user_email" in session: # creating index function
# linking index.html to local server / rendering it from templet folder in
"project_python" folder
op=user_operation()
r = op.total_income()
op=user_operation()
e= op.total_expense()
if(r[0][0]==None and e[0][0]==None):#when both income and expene
rest = 0
elif(r[0][0]==None):
rest = 0 - int(e[0][0])
elif(e[0][0]==None):
rest = int(r[0][0]) - 0
else:
rest=int(r[0][0])- int(e[0][0])
op=user_operation()
a= op.recent_expense() # a is variable reciving data from user.py
op=user_operation()
m= op.most_expense()
return
render_template("user_dashboard.html",income=r,expense=e,rest=rest,rec
ent=a,most=m) #recent will be used in html page as data holder from
database
else:
flash("You are not authorised.... login now!!")
return redirect(url_for('user_login'))
@app.route("/user_registration")
77
def user_registration():
num = random.randrange(1000, 9999)
# create an image instance of given size range
img = ImageCaptcha(width=280, height=90)
# image captcha text
global captcha_text
captcha_text = str(num) # convert int into string
img.write(captcha_text, "static/captcha/user_captcha.png")
return render_template("user_registration.html")
# getting post from form to server
@app.route("/user_registration_insert", methods=['GET', 'POST'])
def user_registration_insert():
if request.method == "POST": # button is clicked
if (captcha_text != request.form['captcha']): # varifying captcha
flash("invalid captcha")
return redirect(url_for("user_registration"))
first_name = request.form['first_name']
last_name = request.form['last_name']
email = request.form['email']
mobile = request.form['mobile']
password = request.form['password']
# ..............password encription........
pas = hashlib.md5(password.encode())
password = pas.hexdigest()
op= user_operation() # creating object to get data from user.py

op.user_registration_insert(first_name, last_name, email, mobile,
password)
#flash("sucessfully registered!!")
# return render_template("user_signup.html")
78
# .............email verification..............
global otp
otp = random.randint(1000, 99999)
msg = Message('viraj''s'' project email
verification',sender='pythonproject2023@outlook.com', recipients =
[email])
msg.body = "hello " + first_name + "\n welcome to my project in
python \n your otp for email verification is :" + str(otp)
mail.send(msg)
# return "data submitted"
return render_template("user_email_verify.html", email=email)
#data retrive from get and post method

@app.route("/user_email_otp_verify",methods=["GET","POST"])
def user_email_otp_verify():
if request.method=="POST":
user_otp = request.form['otp']
if otp == int(user_otp):
flash("Your Email is Verified.. You can Login Now!!!")
email=request.form['email']
op = user_operation() # object create
op.user_delete(email)
flash("Your Email verification is failed... Register with Valid
Email!!!")
return redirect(url_for('user_registration'))
@app.route("/user_login")
def user_login():
return render_template("user_login.html")
79
@app.route("/user_login_verify",methods=["GET","POST"])
def user_login_verify():
email=request.form['email']
password=request.form['password']
#--- password encryption----------------
pas = hashlib.md5(password.encode())
password = pas.hexdigest()

r = op.user_login_verify(email,password)
if(r==0):
flash("Invalid user email and password!!")
else:
return redirect(url_for('user_dashboard')) #dashboard
@app.route("/user_profile")
def user_profile():
if "user_email" in session:
r=op.user_profile()
# op=user_operation() ################################
# p = op.profile_update_insert()
return render_template("user_profile.html",record=r)
else:
#user password form
@app.route("/user_password_form")
def user_password_form():
80
return render_template("user_password_form.html")
else:
@app.route("/user_password_change",methods=['POST','GET'])
def user_password_change():
if 'user_email' in session: #check wether user is login or not
if request.method=='POST':
oldpassword=request.form['oldpassword']
newpassword=request.form['newpassword']
#--- password encryption----------------

pas = hashlib.md5(oldpassword.encode())
oldpassword = pas.hexdigest()
pas = hashlib.md5(newpassword.encode())
newpassword = pas.hexdigest()

r=op.user_password_change(oldpassword,newpassword)
if(r==0): #return check and display fron user.py
flash("Your old password is invalid!!")
return redirect(url_for('user_profile'))
else:
session.clear()
flash("Your password is updated successfully..login now!!")
else:
flash("kindly login to access this page!!")
81
#updating user profile after password change

@app.route("/user_profile_update",methods=["GET","POST"])
def user_profile_update():
first_name=request.form['first_name']
last_name=request.form['last_name']
mobile=request.form['mobile']
twitter=request.form['twitter']
facebook=request.form['facebook']
instagram=request.form['instagram']
linkdin=request.form['linkdin']
# photo=request.files["photo"]
# photo_name = photo.filename
# photo.save("static/profile_image/" + photo_name)
ob = user_operation() #object
ob.profile_update_insert(first_name,last_name,mobile,twitter,faceb
ook,instagram,linkdin)#photo_name
flash("Your Profile updated successfully!!!")
else:
@app.route("/user_photo_update",methods=["GET","POST"])
def user_photo_update():
photo=request.files["photo"]
82
photo_name = photo.filename
photo.save("static/profile_image/" + photo_name)
ob = user_operation() #object
ob.profile_photo_insert(photo_name)
flash("Your Profile updated successfully!!!")

@app.route("/user_logout")
def user_logout():
session.clear()
flash("Logged out successfully.... :)")
return render_template("index.html")
@app.route("/add_income")
def add_income():
op=user_operation()
i= op.recent_income()
return render_template("add_income.html",income=i)
else:
#return redirect(url_for('add_income'))
@app.route("/add_income_insert",methods=["GET","POST"])
def add_income_insert():
date = request.form['date']
source = request.form['source']
amount = request.form['amount']
83
remarks = request.form['remarks']

record = op.add_income_insert(date,source,amount,remarks)
for r in record:
flash("Amount added sucessfully : ")
op=user_operation()
i= op.recent_income()
return render_template("add_income.html",income=i)
@app.route("/add_expense")
def add_expense():
return render_template("add_expense.html")
else:
@app.route("/add_expense_insert",methods=["GET","POST"])
def add_expense_insert():
date = request.form['date']
category = request.form['category']
item = request.form['item']
amount = request.form['amount']

record = op.add_expense_insert(date,category,item,amount,remarks)
for r in record:
flash("Expense added sucessfully : ")
return render_template("add_expense.html")
84
@app.route("/lpg_cylinder")
def lpg_cylinder():
op=user_operation()
l= op.recent_lpg_cylinder()
return render_template("update_lpg.html",lpg=l)
else:
@app.route("/lpg_cylinder_insert",methods=["GET","POST"])
def lpg_cylinder_insert():
end_date = request.form['end_date']

record = op.lpg_cylinder_insert(end_date,remarks)
for r in record:
flash("LPG data updated sucessfully : ")
op=user_operation()
l= op.recent_lpg_cylinder()
return render_template("update_lpg.html",lpg=l)
@app.route("/expense_transaction")
def expense_transaction():
op=user_operation()
all= op.all_expense()
return render_template("expense_transaction.html",recent=all)
85
@app.route("/income_transaction")
def income_transaction():
op=user_operation()
i= op.all_income()
return render_template("income_transaction.html",income=i)
@app.route("/add_budget")
def add_budget():
return render_template("add_budget.html")#record=r
@app.route("/add_budget_insert")
def add_budget_insert():
budget = request.form['budget']

record = op.add_budget_insert(budget)
for r in record:
flash("budget set sucessfully : ")
return render_template("add_budget.html")
if __name__ == "__main__":
# to activate server // debug=true to always keep server active
app.run(debug=True)
86
13.user.py
import mysql.connector
from flask import session
class user_operation:
def connection(self):
db=mysql.connector.connect(host="localhost",port="3306",user="root",
password="root",db="thrift")
return db
def user_registration_insert(self,first_name,last_name,email,mobile,password):
db = self.connection() #con
mycursor=db.cursor()
sq="insert into user (first_name,last_name,email,mobile,password)
values(%s,%s,%s,%s,%s)"
record=[first_name,last_name,email,mobile,password]
mycursor.execute(sq,record) # essential for every data connection
db.commit()
mycursor.close()
db.close()
return
def user_delete(self,email):
db = self.connection()
mycursor = db.cursor()
sq="delete from user where email=%s"
record=[email]
mycursor.execute(sq,record)
db.commit()
87
mycursor.close()
db.close()
return
def user_login_verify(self,email,password):
sq="select
first_name,email,last_name,mobile,twitter,facebook,instagram,linkdin,photo,budg
et from user where email=%s and password=%s"
record=[email,password]
row = mycursor.fetchall()
r=mycursor.rowcount
mycursor.close()
db.close()
if(r==0):
return 0
else:
for rec in row:
session['first_name']=rec[0] #retriving records from sql as per above array
sequence
session['user_email']=rec[1]
session['last_name']=rec[2]
session['mobile']=rec[3]
session['twitter']=rec[4]
session['facebook']=rec[5]
session['instagram']=rec[6]
session['linkdin']=rec[7]
session['photo']=rec[8]
session['budget']=rec[9]
88
return 1
def user_profile(self):
sq ="select first_name,last_name,email,mobile,photo from user where
email=%s"
record=[session['user_email']]
r = mycursor.fetchall()
mycursor.close()
db.close()
return r
def user_password_change(self,oldpassword,newpassword):
sq="select password from user where password=%s and email=%s"
record=[oldpassword,session['user_email']]
rc = mycursor.rowcount
if(rc==0):
return 0
else:
sq="update user set password=%s where email=%s"
record=[newpassword,session['user_email']]
db.commit()
mycursor.close()
db.close()
89
return 1
def add_income_insert(self, date, source, amount, remarks):

sq="insert into income (email,date,source,amount,remarks) values
(%s,%s,%s,%s,%s)"
record=[session['user_email'],date, source, amount, remarks] #session['user_email'],
db.commit()
sq ="select income_id from income order by income_id desc limit 1"
mycursor.execute(sq)
mycursor.close()
db.close()
return row
def add_expense_insert(self, date,category,item,amount,remarks):

sq="insert into
expense(email,date,category,item,amount,remarks)values(%s,%s,%s,%s,%s,%s)"
record=[session['user_email'],date,category,item,amount,remarks] #session['
user_email'],
db.commit()
sq ="select expenditure_id from expense order by expenditure_id desc limit 1"
mycursor.close()
db.close()
return row
90
def lpg_cylinder_insert(self,end_date,remarks):
sq="insert into lpg_cylinder(email,end_date,remarks)values(%s,%s,%s)"
record=[session['user_email'],end_date,remarks]
db.commit()
sq ="select lpg_id from lpg_cylinder order by lpg_id desc limit 1"
mycursor.close()
db.close()
return row
def recent_lpg_cylinder(self):
sq = "SELECT start_date,end_date,remarks,DATEDIFF(end_date, start_date)
AS life_span FROM lpg_cylinder where email=%s order by lpg_id desc limit 5"
l = mycursor.fetchall() # "i" will store array value fetched by above query
mycursor.close()
db.close()
return l
def
profile_update_insert(self,first_name,last_name,mobile,twitter,facebook,instagra
m,linkdin):
91
sq ="update user set

first_name=%s,last_name=%s,mobile=%s,twitter=%s,facebook=%s,instagram=%
s,linkdin=%s where email=%s"
record=[first_name,last_name,mobile,twitter,facebook,instagram,linkdin,sess
ion['user_email'],]
db.commit()
mycursor.close()
db.close()
session['first_name']=first_name #updating session
session['last_name']=last_name
session['mobile']=mobile
session['twitter']=twitter
session['facebook']=facebook
session['instagram']=instagram
session['linkdin']=linkdin
return
def profile_photo_insert(self,photo_name):
sq ="update user set photo=%s where email=%s"
record=[photo_name,session['user_email']]
db.commit()
mycursor.close()
db.close()
session['photo']=photo_name
return
def user_password_change(self,oldpassword,newpassword):
92
sq="select password from user where password=%s and email=%s"
record=[oldpassword,session['user_email']]
rc = mycursor.rowcount
if(rc==0):
return 0
else:
sq="update user set password=%s where email=%s"
record=[newpassword,session['user_email']]
db.commit()
mycursor.close()
db.close()
return 1
def total_income(self):
sq = "SELECT sum(amount) FROM income where email=%s"
r = mycursor.fetchall()
mycursor.close()
db.close()
return r
def total_expense(self):
sq = "SELECT sum(amount) FROM expense where email=%s"
93
e = mycursor.fetchall()
mycursor.close()
db.close()
return e
def recent_expense(self):
sq = "SELECT date,category,item,amount FROM expense where email=%s
order by expenditure_id desc limit 5"
a = mycursor.fetchall() # "a" will store array value fetched by above query
mycursor.close()
db.close()
return a
def recent_income(self):
sq = "SELECT date,source,amount,remarks FROM income where email=%s
order by income_id desc limit 5"
i = mycursor.fetchall() # "i" will store array value fetched by above query
mycursor.close()
db.close()
return i
def all_income(self):
94
sq = "SELECT date,source,amount,remarks,income_id FROM income where
email=%s order by income_id desc"
i = mycursor.fetchall() # "i" will store array value fetched by above query
mycursor.close()
db.close()
return i
def all_expense(self):
sq = "SELECT date,category,item,amount FROM expense where email=%s
order by expenditure_id desc"
all = mycursor.fetchall() # "a" will store array value fetched by above query
mycursor.close()
db.close()
return all
def most_expense(self):
sq = "SELECT category,count(*),sum(amount) FROM expense where
email=%s GROUP BY category ORDER BY sum(amount) DESC"
m = mycursor.fetchall() # "a" will store array value fetched by above query
mycursor.close()
95
db.close()
return m
def add_budget_insert(self,budget):
sq ="update user set budget=%s where email=%s"
record=[budget ,session['user_email']]
db.commit()
mycursor.close()
db.close()
session['budget']=budget
return
96
14.INDEX.CSS
html {
overflow-x: hidden;
}
body {
font-family: "Roboto", sans-serif;
color: #9fa1a4;
line-height: 1.5;
}
a{
color: #777;
text-decoration: none;
transition: 0.3s all ease;
}
a:hover {
color: #000;
}
h1,h2,h3,h4,h5,h6,.font-heading
{
font-family: "Poppins", sans-serif;
color: #000;
}
.container
{
z-index: 2;
97
position: relative;
}
.text-black {
color: #000 !important;
}
.text-primary {
color: #2d71a1 !important;
}
.border-top {
border-top: 1px solid #f2f2f2 !important;
}
.border-bottom {
border-bottom: 1px solid #f2f2f2 !important;
}
figure figcaption {
margin-top: 0.5rem;
font-style: italic;
font-size: 0.8rem;
}
section {
overflow: hidden;
}
.section {
padding: 7rem 0;
}
98
.section-heading {
font-size: 3rem;
font-weight: 700;
background: linear-gradient(-45deg, #3db3c5, #274685);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
# Back to top button
.back-to-top {
position: fixed;
visibility: hidden;
opacity: 0;
right: 15px;
bottom: 15px;
z-index: 996;
background: #2d71a1;
width: 40px;
height: 40px;
border-radius: 50px;
transition: all 0.4s;
}
.back-to-top i {
font-size: 28px;
color: #fff;
line-height: 0;
}
.back-to-top:hover {
background: #3687c1;
color: #fff;
}
99
.back-to-top.active {
visibility: visible;
opacity: 1;
}
/* Default btn sre-tyling */
.btn {
border: none;
padding: 15px 30px !important;
}
.btn.btn-outline-white {
border: 2px solid #fff;
background: none;
color: #fff;
}
.btn.btn-outline-white:hover {
background: #fff;
color: #2d71a1;
}
.btn.btn-primary {
background: linear-gradient(-45deg, #1391a5, #274685);
color: #fff;
box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.15);
}
/* Feature 1 */
.feature-1 .wrap-icon {
margin: 0 auto;
height: 100px;
width: 100px;
border-radius: 50%;
position: relative;
margin-bottom: 30px;
100

display: inline-flex;
align-items: center;
justify-content: center;
}
.feature-1 .wrap-icon.icon-1 {
background: linear-gradient(-45deg, #3b87bd, #2d71a2);
}
.feature-1 .wrap-icon i {
font-size: 40px;
line-height: 0;
color: #fff;
}
.feature-1 h3 {
font-size: 20px;
}
.feature-1 p {
color: #b1b1b1;
}
/* Step */
.step {
box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.1);
background: #fff;
padding: 40px;
}
.review h3 {
font-size: 20px;
}
.review p {
line-height: 1.8;
font-style: italic;
color: #333333;
}
101
.review .stars span {

color: #FF8803;
}
.review .stars .muted {
color: #ccc;
}
.review .review-user img {
width: 70px;
margin: 0 auto;
}
/* Testimonial Carousel */
.testimonials-slider .swiper-pagination {
margin-top: 20px;
position: relative;
}
.testimonials-slider .swiper-pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
background-color: #fff;
opacity: 1;
border: 1px solid #2d71a1;
}
.testimonials-slider .swiper-pagination .swiper-pagination-bullet-active {
background-color: #2d71a1;
}
.pricing h3 {
color: #2d71a1;
}
.pricing .price-cta {
position: absolute;
bottom: 50px;
width: 100%;
102
text-align: center;
left: 0;
}
.pricing .price-cta .price {
display: block;
font-size: 2rem;
font-weight: 300;
}
.pricing .popularity {
text-transform: uppercase;
font-size: 12px;
letter-spacing: 0.2rem;
display: block;
}
.pricing ul {
}.pricing ul li {
}
.pricing .btn-white {
background: #fff;
border: 2px solid rgb(241, 241, 241);
border-radius: 4px;
}
.pricing .btn-white:hover {
color: #2d71a1;
}
.pricing.popular {
background: #fff;
103
color: #000000;
background: linear-gradient(-45deg, #1391a5, #274685);
color: #fff;
box-shadow: none;
}
.pricing.popular .popularity {
color: #b3b3b3;
}.pricing.popular h3 {
color: #fff;
background: none;
}
.pricing.popular .btn-white {
}
/* CTA Section */
.cta-section {
background: linear-gradient(to right, rgb(39, 70, 133) 0%, rgb(61, 179, 197)
100%);
color: #fff;
}
.cta-section h2 {
color: #fff;
font-size: 3rem;
font-weight: 700;
}
@media screen and (max-width: 768px) {
.cta-section h2 {
font-size: 2rem;
}
}
.cta-section .btn {
background: #000000;
color: #fff;
104
}
.cta-section .btn i
{
margin-right: 5px;
font-size: 24px;
line-height: 0;
}
/* Contact Form */
.form-control {
height: 48px;
border-radius: 0;
border: 1px solid #dae0e5;
}
.form-control:active,
.form-control:focus {
outline: none;
box-shadow: none;
}
.php-email-form .validate {
display: none;
color: red;
margin: 0 0 15px 0;
font-weight: 400;
font-size: 13px;
}
.php-email-form .error-message {
display: none;
color: #fff;
105
background: #ed3c0d;
text-align: left;
padding: 15px;
font-weight: 600;
}
.php-email-form .error-message br+br {

margin-top: 25px;
}
.php-email-form .sent-message {
display: none;
color: #fff;
background: #18d26e;
text-align: center;
padding: 15px;
font-weight: 600;
}
.php-email-form .loading {
display: none;
background: #fff;
text-align: center;
padding: 15px;
}
.php-email-form .loading:before {
content: "";
display: inline-block;
border-radius: 50%;
width: 24px;
height: 24px;
margin: 0 10px -6px 0;
106
border: 3px solid #18d26e;

border-top-color: #eee;
animation: animate-loading 1s linear infinite;
}
.php-email-form textarea {
min-height: 160px;
}
@keyframes animate-loading {
0% {
transform: rotate(0deg);
}
100% {
}
}
/* Blog */
.post-entry {
}
.post-entry .post-text .post-meta {

color: #ccc;
font-size: 13px;
display: block;
}
.post-entry .post-text h3 {
107
font-size: 20px;
color: #000000;
}
.post-entry .post-text h3 a {
color: #000000;
}
.post-entry .post-text h3 a:hover {

color: #2d71a1;
}
.post-entry .post-text .readmore {

color: #2d71a1;
}
.sidebar-box {
padding: 25px;
font-size: 15px;
width: 100%;
float: left;
background: #fff;
}
.sidebar-box *:last-child {
margin-bottom: 0;
}
.sidebar-box h3 {
font-size: 18px;
108
}
.categories li,
.sidelink li {
position: relative;
padding-bottom: 10px;
border-bottom: 1px dotted gray("300");
list-style: none;
}
.categories li:last-child,
.sidelink li:last-child {
margin-bottom: 0;
border-bottom: none;
padding-bottom: 0;
}
.categories li a,
.sidelink li a {
display: block;
}
.categories li a span,
.sidelink li a span {
position: absolute;
right: 0;
top: 0;
color: #ccc;
}
109
.categories li.active a,
.sidelink li.active a {
color: #000000;
font-style: italic;
}
.comment-form-wrap {
clear: both;
}
.comment-list {
padding: 0;
margin: 0;
}
.comment-list .children {
padding: 50px 0 0 40px;
margin: 0;
float: left;
width: 100%;
}
.comment-list li {
padding: 0;
margin: 0 0 30px 0;
float: left;
width: 100%;
clear: both;
list-style: none;
}
.comment-list li .vcard {
110
width: 80px;
float: left;
}
.comment-list li .vcard img {

width: 50px;
border-radius: 50%;
}
.comment-list li .comment-body {
float: right;
width: calc(100% - 80px);
}
.comment-list li .comment-body h3 {
font-size: 20px;
}
.comment-list li .comment-body .meta {

font-size: 13px;
letter-spacing: 0.1em;
color: #ccc;
}
.comment-list li .comment-body .reply {

padding: 5px 10px;
background: #e6e6e6;
color: #000000;
font-size: 14px;
}
111
.comment-list li .comment-body .reply:hover {

color: #000000;
background: #e3e3e3;
}
.search-form {
background: #f7f7f7;
padding: 10px;
}
.search-form .form-group {
position: relative;
}
.search-form .form-group input {

padding-right: 50px;
}
.search-form .icon {
position: absolute;
top: 50%;
right: 20px;
transform: translateY(-50%);
}
……………..# Header…………….
#header {
height: 80px;
z-index: 997;
}
112
#header.header-scrolled {
background: rgba(39, 70, 133, 0.8);
height: 60px;
}
#header .logo h1 {
font-size: 28px;
margin: 0;
padding: 4px 0;
line-height: 1;
font-weight: 500;
}
#header .logo h1 a,
#header .logo h1 a:hover {
color: #fff;
}
#header .logo img {

padding: 0;
margin: 0;
max-height: 40px;
}
/*-----------# Navigation Menu-----------------*/

Desktop Navigation */
.navbar {
padding: 0;
}
.navbar ul {
margin: 0;
113
padding: 0;
display: flex;
list-style: none;
}
.navbar a,
.navbar a:focus {
display: flex;
justify-content: space-between;
padding: 10px 0 10px 30px;
font-size: 16px;
font-weight: 400;
color: rgba(255, 255, 255, 0.65);
white-space: nowrap;
transition: 0.3s;
}
.navbar a i,
.navbar a:focus i {
font-size: 12px;
line-height: 0;
margin-left: 5px;
}
.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a {
color: #fcfafa;
}
114
.navbar .dropdown ul {
display: block;
position: absolute;
left: 14px;
top: calc(100% + 30px);
margin: 0;
padding: 10px 0;
z-index: 99;
opacity: 0;
visibility: hidden;
background: #fff;
box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
transition: 0.3s;
border-radius: 4px;
}
.navbar .dropdown ul li {
min-width: 200px;
}
.navbar .dropdown ul a {
padding: 10px 20px;
font-size: 15px;
color: #101c36;
}
.navbar .dropdown ul a i {
font-size: 12px;
}
.navbar .dropdown ul a:hover,

.navbar .dropdown ul .active:hover,
.navbar .dropdown ul li:hover>a {
115
color: #10acdb;
}
.navbar .dropdown:hover>ul {
opacity: 1;
top: 100%;
}
.navbar .dropdown .dropdown ul {

top: 0;
left: calc(100% - 30px);
visibility: hidden;
}
.navbar .dropdown .dropdown:hover>ul {

opacity: 1;
top: 0;
left: 100%;
}
@media (max-width: 1366px) {

.navbar .dropdown .dropdown ul {
left: -90%;
}
.navbar .dropdown .dropdown:hover>ul {

left: -100%;
}
}
/**
116
* Mobile Navigation
*/
.mobile-nav-toggle {
color: #fff;
font-size: 28px;
cursor: pointer;
display: none;
line-height: 0;
transition: 0.5s;
}

.mobile-nav-toggle {
display: block;
}
.navbar ul {
display: none;
}
}
.navbar-mobile {
position: fixed;
overflow: hidden;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(27, 49, 94, 0.9);
transition: 0.3s;
z-index: 999;
}
117
.navbar-mobile .mobile-nav-toggle {
position: absolute;
top: 15px;
right: 15px;
}
.navbar-mobile ul {
display: block;
position: absolute;
top: 55px;
right: 15px;
bottom: 15px;
left: 15px;
padding: 10px 0;
overflow-y: auto;
transition: 0.3s;
}
.navbar-mobile a,
.navbar-mobile a:focus {
padding: 10px 20px;
font-size: 15px;
color: #101c36;
}
.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
color: #2d71a1;
}
118
.navbar-mobile .dropdown ul {
position: static;
display: none;
margin: 10px 20px;
padding: 10px 0;
z-index: 99;
opacity: 1;
background: #fff;
}
.navbar-mobile .dropdown ul li {
min-width: 200px;
}
.navbar-mobile .dropdown ul a {
padding: 10px 20px;
}
.navbar-mobile .dropdown ul a i {
font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover,
.navbar-mobile .dropdown ul .active:hover,
.navbar-mobile .dropdown ul li:hover>a {
color: #2d71a1;
}
.navbar-mobile .dropdown>.dropdown-active {
display: block;
}
.hero-section {
background: linear-gradient(to right, rgba(39, 70, 133, 0.8) 0%, rgba(61,
179, 197, 0.8) 100%), url(../img/hero-bg.jpg);
119
position: relative;
}
.hero-section .wave {
width: 100%;
overflow: hidden;
position: absolute;
z-index: 1;
bottom: -150px;
}

.hero-section .wave {
bottom: -180px;
}
}
.hero-section .wave svg {
width: 100%;
}
.hero-section,
.hero-section>.container>.row {
height: 100vh;
min-height: 880px;
}
.hero-section.inner-page {
height: 60vh;
min-height: 0;
}
.hero-section.inner-page .hero-text {
transform: translateY(-150px);
margin-top: -120px;
}
120

.hero-section.inner-page .hero-text {
margin-top: -80px;
}
}
.hero-section h1 {
font-size: 3.5rem;
color: #fff;
font-weight: 700;
}
.hero-section h1 {
font-size: 2.5rem;
text-align: center;
margin-top: 40px;
}
}
.hero-section .hero-text-image {
margin-top: 4rem;
}
}
.hero-section p {
font-size: 18px;
color: #fff;
}
.hero-section .iphone-wrap {
position: relative;
}
.hero-section .iphone-wrap {
121
text-align: center;
}
}
.hero-section .iphone-wrap .phone-2,
.hero-section .iphone-wrap .phone-1 {
position: absolute;
top: -50%;
overflow: hidden;
left: 0;
}

position: relative;
top: 0;
max-width: 100%;
}
}

width: 250px;
}
margin-left: -150px;
}
}
margin-top: 50px;
122
margin-left: 100px;
width: 250px;
}
width: 250px;
position: absolute;
margin-top: 0px;
margin-left: 100px;
}
}
# Footer
.footer {
padding: 5rem 0 2.5rem 0;
}
.footer h3 {
font-size: 18px;
}
.footer ul li {
}
.footer a {
color: #000;
}
.footer .copyright {
margin-bottom: 0px;
}
.footer .copyright,
.footer .credits {
font-size: 14px;
}
.social a {
123
width: 50px;
height: 50px;
border-radius: 50%;
background: #f8f9fa;
position: relative;
text-align: center;
transition: 0.3s background ease;
color: #0d1e2d;
line-height: 0;
}
.social a span {
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
}
.social a:hover {
color: #fff;
}
.social a i {
line-height: 0;
}
124
15.STYLE.CSS
# General
--------------------------------------------------------------*/
:root {
scroll-behavior: smooth;
}
body {
font-family: "Open Sans", sans-serif;
background: #f6f9ff;
color: #444444;
}
a{
color: #4154f1;
}
a:hover {
color: #717ff5;
}
h1,h2,h3,h4,h5,h6 {
font-family: "Nunito", sans-serif;
}
# Main
---------------------------------------------------
#main {
125
margin-top: 60px;
padding: 20px 30px;
}

#main {
padding: 20px;
}
}
/*--------------------------------------------------------------
# Page Title
--------------------------------------------------------------*/
.pagetitle {
}
.pagetitle h1 {
font-size: 24px;
margin-bottom: 0;
font-weight: 600;
color: #012970;
}
/*--------------------------------------------------------------
# Override some default Bootstrap stylings
--------------------------------------------------------------*/
/* Dropdown menus */
.dropdown-menu {
border-radius: 4px;
padding: 10px 0;
animation-name: dropdown-animate;
animation-duration: 0.2s;
126
animation-fill-mode: both;
border: 0;
}
.dropdown-menu .dropdown-header,
.dropdown-menu .dropdown-footer {
text-align: center;
font-size: 15px;
padding: 10px 25px;
}
.dropdown-menu .dropdown-footer a {
color: #444444;
text-decoration: underline;
}
.dropdown-menu .dropdown-footer a:hover {

}
.dropdown-menu .dropdown-divider {
color: #a5c5fe;
margin: 0;
}
.dropdown-menu .dropdown-item {
font-size: 14px;
padding: 10px 15px;
transition: 0.3s;
}
.dropdown-menu .dropdown-item i {
127
margin-right: 10px;
font-size: 18px;
line-height: 0;
}
.dropdown-menu .dropdown-item:hover {
background-color: #f6f9ff;
}
@media (min-width: 768px) {

.dropdown-menu-arrow::before {
content: "";
width: 13px;
height: 13px;
background: #fff;
position: absolute;
top: -7px;
right: 20px;
border-top: 1px solid #eaedf1;
border-left: 1px solid #eaedf1;
}
}
@keyframes dropdown-animate {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
128
0% {
opacity: 0;
}
}
/* Light Backgrounds */
.bg-primary-light {
background-color: #cfe2ff;
border-color: #cfe2ff;
}
.bg-secondary-light {
background-color: #e2e3e5;
border-color: #e2e3e5;
}
.bg-success-light {
background-color: #d1e7dd;
border-color: #d1e7dd;
}
.bg-danger-light {
background-color: #f8d7da;
border-color: #f8d7da;
}
.bg-warning-light {
background-color: #fff3cd;
border-color: #fff3cd;
}
.bg-info-light {
background-color: #cff4fc;
129
border-color: #cff4fc;
}
.bg-dark-light {
background-color: #d3d3d4;
border-color: #d3d3d4;
}
/* Card */
.card {
border: none;
border-radius: 5px;
box-shadow: 0px 0 30px rgba(1, 41, 112, 0.1);
}
.card-header,
.card-footer {
border-color: #ebeef4;
color: #798eb3;
padding: 15px;
}
.card-title {
padding: 20px 0 15px 0;
font-size: 18px;
font-weight: 500;
color: #012970;
}
.card-title span {
130
color: #899bbd;
font-size: 14px;
font-weight: 400;
}
.card-body {
padding: 0 20px 20px 20px;
}
.card-img-overlay {
background-color: rgba(255, 255, 255, 0.6);
}
/* Alerts */
.alert-heading {
font-weight: 500;
font-size: 20px;
}
/* Close Button */
.btn-close {
background-size: 25%;
}
.btn-close:focus {
outline: 0;
box-shadow: none;
}
/* Accordion */
.accordion-item {
border: 1px solid #ebeef4;
131
.accordion-button:focus {
outline: 0;
box-shadow: none;
}
.accordion-button:not(.collapsed) {
color: #012970;
}
.accordion-flush .accordion-button {
padding: 15px 0;
background: none;
border: 0;
}
.accordion-flush .accordion-button:not(.collapsed) {
box-shadow: none;
color: #4154f1;
}
.accordion-flush .accordion-body {
padding: 0 0 15px 0;
color: #3e4f6f;
font-size: 15px;
}
/* Breadcrumbs */
.breadcrumb {
font-size: 14px;
132
color: #899bbd;
font-weight: 600;
}
.breadcrumb a {
color: #899bbd;
transition: 0.3s;
}
.breadcrumb a:hover {
color: #51678f;
}
.breadcrumb .breadcrumb-item::before {
color: #899bbd;
}
.breadcrumb .active {
color: #51678f;
font-weight: 600;
}
/* Bordered Tabs */
.nav-tabs-bordered {
border-bottom: 2px solid #ebeef4;
}
.nav-tabs-bordered .nav-link {
margin-bottom: -2px;
border: none;
color: #2c384e;
}
133
.nav-tabs-bordered .nav-link:hover,
.nav-tabs-bordered .nav-link:focus {
color: #4154f1;
}
.nav-tabs-bordered .nav-link.active {
color: #4154f1;
border-bottom: 2px solid #4154f1;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.logo {
line-height: 1;
}

.logo {
width: 280px;
}
}
.logo img {
max-height: 26px;
margin-right: 6px;
}
.logo span {
font-size: 26px;
font-weight: 700;
color: #012970;
134

}
.header {
z-index: 997;
height: 60px;
padding-left: 20px;
/* Toggle Sidebar Button */
/* Search Bar */
}
.header .toggle-sidebar-btn {
font-size: 32px;
padding-left: 10px;
cursor: pointer;
color: #012970;
}
.header .search-bar {
min-width: 360px;
padding: 0 20px;
}

.header .search-bar {
position: fixed;
top: 50px;
left: 0;
right: 0;
padding: 20px;
135
box-shadow: 0px 0px 15px 0px rgba(1, 41, 112, 0.1);

background: white;
z-index: 9999;
transition: 0.3s;
visibility: hidden;
opacity: 0;
}
.header .search-bar-show {
top: 60px;
opacity: 1;
}
}
.header .search-form {
width: 100%;
}
.header .search-form input {

border: 0;
font-size: 14px;
color: #012970;
border: 1px solid rgba(1, 41, 112, 0.2);
padding: 7px 38px 7px 8px;
border-radius: 3px;
transition: 0.3s;
width: 100%;
}
.header .search-form input:focus,

.header .search-form input:hover {
outline: none;
136
box-shadow: 0 0 10px 0 rgba(1, 41, 112, 0.15);

border: 1px solid rgba(1, 41, 112, 0.3);
}
.header .search-form button {

border: 0;
padding: 0;
margin-left: -30px;
background: none;
}
.header .search-form button i {

color: #012970;
}
/*--------------------------------------------------------------
# Header Nav
--------------------------------------------------------------*/
.header-nav ul {
list-style: none;
}
.header-nav>ul {
margin: 0;
padding: 0;
}
.header-nav .nav-icon {
font-size: 22px;
color: #012970;
margin-right: 25px;
position: relative;
}
137
.header-nav .nav-profile {
color: #012970;
}
.header-nav .nav-profile img {

max-height: 36px;
}
.header-nav .nav-profile span {

font-size: 14px;
font-weight: 600;
}
.header-nav .badge-number {
position: absolute;
inset: -2px -5px auto auto;
font-weight: normal;
font-size: 12px;
padding: 3px 6px;
}
.header-nav .notifications {
inset: 8px -15px auto auto !important;
}
.header-nav .notifications .notification-item {

display: flex;
padding: 15px 10px;
transition: 0.3s;
}
138
.header-nav .notifications .notification-item i {

margin: 0 20px 0 10px;
font-size: 24px;
}
.header-nav .notifications .notification-item h4 {

font-size: 16px;
font-weight: 600;
margin-bottom: 5px;
}
.header-nav .notifications .notification-item p {

font-size: 13px;
margin-bottom: 3px;
color: #919191;
}
.header-nav .notifications .notification-item:hover {

}
.header-nav .messages {
inset: 8px -15px auto auto !important;
}
.header-nav .messages .message-item {

padding: 15px 10px;
transition: 0.3s;
}
.header-nav .messages .message-item a {

display: flex;
}
139
.header-nav .messages .message-item img {

margin: 0 20px 0 10px;
max-height: 40px;
}
.header-nav .messages .message-item h4 {

font-size: 16px;
font-weight: 600;
margin-bottom: 5px;
color: #444444;
}
.header-nav .messages .message-item p {

font-size: 13px;
margin-bottom: 3px;
color: #919191;
}
.header-nav .messages .message-item:hover {

}
.header-nav .profile {
min-width: 240px;
padding-bottom: 0;
top: 8px !important;
}
.header-nav .profile .dropdown-header h6 {

font-size: 18px;
margin-bottom: 0;
font-weight: 600;
140
color: #444444;
}
.header-nav .profile .dropdown-header span {

font-size: 14px;
}
.header-nav .profile .dropdown-item {

font-size: 14px;
padding: 10px 15px;
transition: 0.3s;
}
.header-nav .profile .dropdown-item i {

margin-right: 10px;
font-size: 18px;
line-height: 0;
}
.header-nav .profile .dropdown-item:hover {

}
/*--------------------------------------------------------------
# Sidebar
--------------------------------------------------------------*/
.sidebar {
position: fixed;
top: 60px;
left: 0;
bottom: 0;
width: 300px;
z-index: 996;
141

padding: 20px;
overflow-y: auto;
scrollbar-width: thin;
scrollbar-color: #aab7cf transparent;
}

.sidebar {
left: -300px;
}
}
.sidebar::-webkit-scrollbar {
width: 5px;
height: 8px;
}
.sidebar::-webkit-scrollbar-thumb {
background-color: #aab7cf;
}
#main,
#footer {
margin-left: 300px;
}
}
142

.toggle-sidebar .sidebar {
left: 0;
}
}
.toggle-sidebar #main,
.toggle-sidebar #footer {
margin-left: 0;
}
.toggle-sidebar .sidebar {
left: -300px;
}
}
.sidebar-nav {
padding: 0;
margin: 0;
list-style: none;
}
.sidebar-nav li {
padding: 0;
margin: 0;
list-style: none;
}
.sidebar-nav .nav-item {
margin-bottom: 5px;
}
143
.sidebar-nav .nav-heading {
font-size: 11px;
color: #899bbd;
font-weight: 600;
margin: 10px 0 5px 15px;
}
.sidebar-nav .nav-link {
display: flex;
font-size: 15px;
font-weight: 600;
color: #4154f1;
transition: 0.3;
padding: 10px 15px;
border-radius: 4px;
}
.sidebar-nav .nav-link i {
font-size: 16px;
margin-right: 10px;
color: #4154f1;
}
.sidebar-nav .nav-link.collapsed {
color: #012970;
background: #fff;
}
.sidebar-nav .nav-link.collapsed i {
144
color: #899bbd;
}
.sidebar-nav .nav-link:hover {
color: #4154f1;
}
.sidebar-nav .nav-link:hover i {
color: #4154f1;
}
.sidebar-nav .nav-link .bi-chevron-down {

margin-right: 0;
transition: transform 0.2s ease-in-out;
}
.sidebar-nav .nav-link:not(.collapsed) .bi-chevron-down {

}
.sidebar-nav .nav-content {
padding: 5px 0 0 0;
margin: 0;
list-style: none;
}
.sidebar-nav .nav-content a {
display: flex;
font-size: 14px;
font-weight: 600;
color: #012970;
145
transition: 0.3;
padding: 10px 0 10px 40px;
transition: 0.3s;
}
.sidebar-nav .nav-content a i {
font-size: 6px;
margin-right: 8px;
line-height: 0;
border-radius: 50%;
}
.sidebar-nav .nav-content a:hover,

.sidebar-nav .nav-content a.active {
color: #4154f1;
}
.sidebar-nav .nav-content a.active i {

background-color: #4154f1;
}
/*--------------------------------------------------------------
# Dashboard
--------------------------------------------------------------*/
/* Filter dropdown */
.dashboard .filter {
position: absolute;
right: 0px;
top: 15px;
}
.dashboard .filter .icon {

color: #aab7cf;
146
padding-right: 20px;
transition: 0.3s;
font-size: 16px;
}
.dashboard .filter .icon:hover,

.dashboard .filter .icon:focus {
color: #4154f1;
}
.dashboard .filter .dropdown-header {

padding: 8px 15px;
}
.dashboard .filter .dropdown-header h6 {

font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
color: #aab7cf;
margin-bottom: 0;
padding: 0;
}
.dashboard .filter .dropdown-item {

padding: 8px 15px;
}
/* Info Cards */
.dashboard .info-card {
}
147
.dashboard .info-card h6 {
font-size: 28px;
color: #012970;
font-weight: 700;
margin: 0;
padding: 0;
}
.dashboard .card-icon {
font-size: 32px;
line-height: 0;
width: 64px;
height: 64px;
flex-shrink: 0;
flex-grow: 0;
}
.dashboard .sales-card .card-icon {

color: #4154f1;
background: #f6f6fe;
}
.dashboard .revenue-card .card-icon {

color: #2eca6a;
background: #e0f8e9;
}
.dashboard .customers-card .card-icon {

color: #ff771d;
background: #ffecdf;
}
148
/* Activity */
.dashboard .activity {
font-size: 14px;
}
.dashboard .activity .activity-item .activite-label {

color: #888;
position: relative;
flex-shrink: 0;
flex-grow: 0;
min-width: 64px;
}
.dashboard .activity .activity-item .activite-label::before {

content: "";
position: absolute;
right: -11px;
width: 4px;
top: 0;
bottom: 0;
background-color: #eceefe;
}
.dashboard .activity .activity-item .activity-badge {

margin-top: 3px;
z-index: 1;
font-size: 11px;
line-height: 0;
border-radius: 50%;
flex-shrink: 0;
border: 3px solid #fff;
flex-grow: 0;
}
149
.dashboard .activity .activity-item .activity-content {

padding-left: 10px;
}
.dashboard .activity .activity-item:first-child .activite-label::before {

top: 5px;
}
.dashboard .activity .activity-item:last-child .activity-content {

padding-bottom: 0;
}
/* News & Updates */
.dashboard .news .post-item+.post-item {
margin-top: 15px;
}
.dashboard .news img {

width: 80px;
float: left;
border-radius: 5px;
}
.dashboard .news h4 {
font-size: 15px;
margin-left: 95px;
font-weight: bold;
margin-bottom: 5px;
}
.dashboard .news h4 a {
150
color: #012970;
transition: 0.3s;
}
.dashboard .news h4 a:hover {
color: #4154f1;
}
.dashboard .news p {
font-size: 14px;
color: #777777;
margin-left: 95px;
}
/* Recent Sales */
.dashboard .recent-sales {
font-size: 14px;
}
.dashboard .recent-sales .table thead {
}
.dashboard .recent-sales .table thead th {
border: 0;
}
.dashboard .recent-sales .dataTable-top {
padding: 0 0 10px 0;
}
.dashboard .recent-sales .dataTable-bottom {
padding: 10px 0 0 0;
}
/* Top Selling */
.dashboard .top-selling {
font-size: 14px;
}
151
.dashboard .top-selling .table thead {

}
.dashboard .top-selling .table thead th {
border: 0;
}
.dashboard .top-selling .table tbody td {
vertical-align: middle;
}
.dashboard .top-selling img {
border-radius: 5px;
max-width: 60px;
}
# Footer
--------------------------------------------------------------*/
.footer {
padding: 20px 0;
font-size: 14px;
border-top: 1px solid #cddfff;
}
.footer .copyright {
text-align: center;
color: #012970;
}
.footer .credits {
padding-top: 5px;
text-align: center;
font-size: 13px;
color: #012970;
}
152
FUTURE SCOPE
The future scope of expense tracking and management systems is promising, driven by
ongoing advancements in technology and the increasing need for efficient financial
management. Some potential developments and future applications for expense tracking
systems are :
1. Integration with AI and Machine Learning:

Expense tracking systems can leverage AI and machine learning algorithms to provide
more intelligent insights and automation. For example, AI can help predict future
expenses based on historical data, recommend cost-saving measures, or automate
categorization based on transaction patterns.
2. Enhanced Mobile Features:

Mobile devices are becoming the primary means of accessing information and conducting
transactions. Future expense tracking systems are likely to focus on optimizing mobile
apps, enabling users to track expenses on the go, capture receipts through augmented
reality, and receive real-time spending alerts.
3. Blockchain Integration:
Blockchain technology offers enhanced security, transparency, and immutability of data.
By integrating blockchain, expense tracking systems can provide a tamper-proof audit
trail of financial transactions, increasing trust and reliability for both individuals and
businesses.
4. Personalized Financial Recommendations:

Expense tracking systems can use data analytics and machine learning to offer
personalized financial recommendations based on individual spending habits. Users may
receive tailored advice on budgeting, investment options, and financial planning based on
their unique financial situations.
153
5. Integration with Digital Payment Solutions:

As digital payment methods continue to evolve, expense tracking systems can integrate
with various payment platforms, such as mobile wallets, digital currencies, and
cryptocurrencies. This integration simplifies the process of tracking expenses made
through these digital channels.
6. IoT (Internet of Things) Integration:

With the growing adoption of IoT devices, expense tracking systems can integrate with
smart home appliances and other connected devices. For instance, tracking utility
expenses can be automated through IoT devices that measure energy consumption.
7. Expense Tracking for Sustainability:

With increasing focus on environmental sustainability, expense tracking systems may
incorporate features to help users track and reduce their carbon footprint. This could
involve tracking eco-friendly purchases, carbon emissions, or encouraging
environmentally responsible spending habits.
8. Expansion to New Industries:

While expense tracking systems are already widely used in personal finance and business
sectors, they could potentially expand to other industries like healthcare, education, and
government. For instance, healthcare expense tracking systems can help patients manage
medical expenses, insurance claims, and prescription costs.
9. Compliance and Regulatory Features:

Expense tracking systems may integrate features to ensure compliance with financial
regulations and tax laws. For businesses, this could mean automated expense reporting
that adheres to specific regulatory requirements.
10. Use in Smart Cities and Urban Planning:

In smart city initiatives, expense tracking systems can contribute to urban planning by
analyzing transportation expenses, public service spending, and infrastructure costs. Such
insights can aid in optimizing city budgets and resource allocation.
154
CONCLUSION
In conclusion, expense tracking systems offer a myriad of advantages that empower

individuals and businesses to gain control over their finances, make informed decisions,
and work towards their financial goals. These systems provide financial awareness by
recording and categorizing expenses, enabling users to understand their spending habits
and identify areas for improvement. Budget management becomes more effective as users
can set spending limits, monitor their progress, and receive alerts when exceeding budgets,
promoting responsible spending and financial discipline.
Expense analysis and reporting features provide valuable insights into spending patterns,
enabling users to make data-driven decisions, optimize their financial resources, and
allocate funds efficiently. By setting financial goals and monitoring progress, users stay
motivated and focused on achieving their objectives, whether it's saving for a vacation,
paying off debt, or investing in a business venture.
For businesses, expense tracking systems streamline the reimbursement process, simplify
financial reporting, and enhance financial transparency and control within the organization.
Integrations with other financial tools and platforms reduce manual data entry, enhance
data accuracy, and facilitate collaboration among different stakeholders.
Despite the advantages, manual expense tracking systems or traditional methods also come
with significant disadvantages. They are time-consuming, prone to human errors, lack real-
time visibility, offer limited reporting capabilities, and can be challenging to retrieve and
store expense records efficiently. Additionally, manual systems may struggle to scale with
increased volumes of expenses and pose security risks to sensitive financial data.
155
To overcome these drawbacks, automated expense tracking systems present a compelling

solution. By leveraging technology, these systems provide efficiency, accuracy, and real-
time insights into financial data. They reduce the burden of manual data entry, offer
sophisticated reporting and analysis tools, and provide secure storage and retrieval of
expense records. Mobile accessibility and cloud integration allow users to track expenses
on the go and access their financial information from various devices.
Overall, expense tracking systems play a crucial role in personal and business financial
management. They serve as powerful tools that empower users with financial awareness,
budget management, goal setting, and financial optimization. By adopting automated
expense tracking systems, individuals and businesses can harness the advantages of
technology to streamline their financial processes, achieve better financial control, and
work towards long-term financial stability and success.
156
BIBLIOGRAPHY
Website: -
• https://stackoverflow.com/
• https://flask.palletsprojects.com/en/2.3.x/
• https://www.w3schools.com/python/default.asp
• https://bootstrapmade.com/
• https://www.youtube.com/
Books: -
• Programming with Python for Dummies - by John Paul Mueller
• Fundamentals of Database Systems "Ramez Elmasri", Pearson
Education
• Alex Martelli- PYTHON IN A NUTSHELL,2ND Edition, O’REILLY

Thrift Financial

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Thrift Financial

Uploaded by

Copyright:

Available Formats

1

It enables users to categorize expenses based on predefined categories or by creating

• Generating reports and analytics to provide insights into spending patterns.

1. Device: Users typically require a computer, smartphone, or tablet to access the

2.Processor: THRIFT (EXPENSE TRACKING SYSTEM) can be operated

• AMD Athlon Gold 3150U with Radeon Graphics 2.40GHz

DISADVANTAGES OF EXISTING SYSTEM

While manual or traditional methods of tracking expenditure comes with several

Manual systems are typically location-dependent and require physical access to

DATA FLOW DIAGRAM

ENTITY RELATIONSHIP DIAGRAM

<i class="bi bi-person"></i>

<i class="bi bi-card-list"></i>

{% with messages = get_flashed_messages() %} <!--jinja codes to get message

<nav id="navbar" class="navbar">

<p ><a href="/user_registration" class="btn btn-outline-white">Get

</section>

<h3 class="mb-3">Expense Recording</h3>

It empowers you to control spending impulses and eliminate frivolous

<main id="main" class="main">

<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">

<div class="d-flex align-items-center">

<div class="d-flex align-items-center">

<li><a class="dropdown-item" href="#">This Year</a></li>

<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i

<title>Pages / Register </title>

<link href="/static/assets/vendor/simple-datatables/style.css" rel="stylesheet">

<section class="section register min-vh-100 d-flex flex-column align-items-

<div class="d-flex justify-content-center py-4">

<div class="card mb-3">

{% with messages = get_flashed_messages() %}

<div class="alert alert-danger" role="alert">

<form action="/user_registration_insert" method="POST" class="row

<input type="email" name="email" class="form-control" id="Email" required>

<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i

<link href="/static/assets/vendor/simple-datatables/style.css" rel="stylesheet">

<div class="pt-4 pb-2">

<form action="/user_login_verify" method="POST" class="row g-3 needs-

<button class="btn btn-primary w-100" type="submit">Login</button>

<link href="/static/assets/vendor/remixicon/remixicon.css" rel="stylesheet">

<main id="main" class="main">

<section class="section profile">

<img src="/static/profile_image/{{r[4]}}" alt="Profile" class="rounded-circle">

<div class="social-links mt-2">

app = Flask(name) # creating object of Flask class