You are on page 1of 40

MAJOR PROJECT

ESPRESSO

MAHARISHI DAYANAND UNIVERSITY(MDU),


ROHTAK-124001, HARYANA

Submitted To: Submitted by:

CHIRAG KATHPALIA
B.TECH. – CSE 7th Sem
Reg. No:191380195

Delhi Global Institute Of Technology

(College Of Engineering)

CHIRAG KATHPALIA 191380195


CERTIFICATE

This is to certify that the minor project entitled “ESPRESSO” submitted


by “CHIRAG KATHPALIA” to Maharishi Dayanand University (MDU),
Rohtak-124001,Haryana in partial fulfilment of the requirement for the award of
semester 7th of the degree of B. Tech in Computer Science Engineering. This
project work carried out by him under my guidance. The project fulfils the
requirement as per the regulation of the institute of university and in my opinion
meets the necessary standards for submission. The contents of this report have not
been submitted and will not be submitted either in part or in full, for the award of
any other degreeor diploma in this institute or any other institute or university to
the best of my knowledge and belief.

Date: Mentor Signature

CHIRAG KATHPALIA 191380195


DECLARATION

This is to certify that the work being presented in the Major project entitled
“ESPRESSO” submitted by undersigned student of Bachelor of Technology in
Computer Science Engineering to Maharishi Dayanand University (MDU),
Rohtak-124001, Haryana in the fulfilment for award of semester 7th is a record
of my own work carried out by me under guidance and supervision of concerned
faculty and staff of the college. I certify the content of this work has not submitted
elsewhere for award of any other degree.

Date: Signature of Student

CHIIRAG KATHPALIA

B.Tech.- CSE ,7th Sem

191380195

CHIRAG KATHPALIA 191380195


ACKNOWLEDGMENT

I am thankful to my faculty and coordinators, for their most valuable and


significant guidance throughout the course of the project and in elaborating our
view of studying the project’s details and getting the right vision for its
implementation.

Also, I would like to thank the Department of Computer Science Engineering,


that has played an important role in strengthening my career by providing full
cooperation and encouragement throughout the tenure of the project.

CHIRAG KATHPALIA 191380195


Contents

S. no. Topics Page no.


1 Certificate 2
2 Declaration 3
3 Acknowledgement 4
4 Introduction 5
5 Problem statement 7
6 Why we need ERP? 8,9
7 Features, Methodology 10, 11
Implementation, 14
Identification and Viewpoint 15, 16

8 Flowchart 17
9 Requirements 18
 Hardware 18
 Software 18
18
 Language
19
 Libraries
10 Procedures, Codes and UI 21
 Installation 21
 views 22
24
 urls.py
28
 settings.py
29
 models.py
30
 database 31
 templates 32
39
 UI
11 References 40

CHIRAG KATHPALIA 191380195


Introduction

ERP stands for Enterprise Resource Planning. ERP for colleges are ERP solutions
that are created specifically to cater to the needs of colleges. Educational
institutions, in general, are in need of ERP software for the simple reason that
they have specific managerial needs. The management of an educational
institution is a complex affair that involves several departments working together
in tandem.

The objective of College Information Management System is to allow the


administrator of any organization the ability to edit and find out the personal
details of a student and allows the student to keep up to date his profile.

It’ll also facilitate keeping all the records of students, such as their id, name,
mailing address, phone number, DOB etc. So all the information about a student
will be available in a few seconds.

Overall, it’ll make Student Information an easier job for the administrator and the
student of any organization. The main purpose of this project is to illustrate the
requirements of the project College Information Management System and is
intended to help any organization to maintain and manage personal data.

It is a comprehensive project developed from the ground up to fulfill the needs of


colleges as they guide their students. This integrated information management
system connects daily operations in the college environment ranging from
Attendance management to communicational means among students and
teachers.

This reduces data error and ensures that information is always up-to-date
throughout the college. It provides a single source of data repository for
streamlining your processes and for all reporting purposes. It has a simple user
interface and is intuitive. This insures that the users spend less time in learning
the system and hence, increase their productivity. Efficient security features
provide data privacy and hence, increase their productivity

CHIRAG KATHPALIA 191380195


Problem statement

In the past we used to collect all the data in files and pages which were hard to
maintain and were also difficult to access, also there was the problem of
redundant data and lots of time used to get wasted in sorting, we had to make a
storage room where all the files needed to be maintained in order so we could
easily access it.

It used to take a lot of time and lots of effort. Then we started to maintain the
same things in our computers for easy accessibility and less effort, it is also a very
time taking thing and also the problem of redundancy still stands.

In addition to that it's hard if we want to remove or edit anything from the
required data as it can create a mess with the order of things and also can take a
lot of time to maintain it back. And the accessibility from everyone is still a bigger
hole which is needed to be filled, because everyone is unable to access the data
and every time they want to know something they have to enquire from the
administration which creates a lot of ruckus for both users and Admin.

So to fulfill those requirements, we worked on something known as ERP which


fulfils all the required conditions and gives accessibility to the individual's data at
the ease of his/her fingertips. It also reduces the workload of staff and
administration and creates a smoothness into the whole system.

CHIRAG KATHPALIA 191380195


WHY WE NEED ERP

In today’s world, where all teaching, learning, and grading are online, the ERP
could act as a facilitator for the teacher, replacing most physical tasks with the
clicks of buttons. Sharing lesson plans, course materials, and grades are easier
with an ERP platform. Most data captured from students are recorded for future
reference and the risks of human error are reduced to a minimum.

Additionally, educators can access specific student data across departments that
will help them understand the student journey better and provide personalized
learning experiences. For example, enrolments in extra-curricular courses, etc. As
educators, the onus of delivering lessons per the curriculum is made easier with
an ERP platform and tracking progress is faster. The other uses of an ERP to the
educator are:

1. Automates repetitive tasks


2. Eases submissions and grading
3. Allows for better collaboration with students and other departments
4. Easy uploads of course materials
5. Access to a repository of teacher trainings

Student

If used well, a good ERP solution eases the learning process for the student. The
shift to virtual classrooms has not been easy for some students, even though they
are considered to be digital natives. With automated assignment reminders,
lesson query resolutions, submissions, and grades, the process of interaction with
the teachers is made easy.

Access to individual portals for notifications, information, updates,


download/upload assignments, timetable, exam notifications, fee reminders and
more, makes for easier task management and completion. Whether it is
institution policies or learning guides, students can also access information

CHIRAG KATHPALIA 191380195


whenever and wherever they choose to. This makes the learning process a
seamless and streamlined experience. The other uses of an ERP to the student
are:

1. Anytime, anywhere access to updated course materials


2. Paced learning
3. Faster resolution of lesson queries
4. Peer-to-peer learning
5. Progress updates in a single view

CHIRAG KATHPALIA 191380195


Features For College ERP System

Following are the must have functioning features for college ERP
System:

1. Attendance management
2. Staff Management and Supervision
3. Fees Management and Accounting
4. Time Table or Schedule Management
5. Library Management
6. Exams Management
7. Performance monitoring for Parents
8. SMS and Email Alert

CHIRAG KATHPALIA 191380195


Methodology

1. Get Information about the ERPs

If you are an institute looking for implementing ERP, you should take a look at
all the options available and check what they have to offer. The best way to
know about it is by listening to what the software company has to present.
The management, as well as employees, should be present to know the
features of ERP software.

The team should check functionality of the software and see if it is suitable to
cater to their daily activities and processes. The team should list down if
anything is missing or if they need any customizations in the system.

2. ERP Installation

Once you have checked all the available options, choose the one which is best
suited for your institute. The choice should be made based on all the details
and statistics that are gathered by the team during the demonstration.

The employees and faculty members of the institute work on the system to
understand how it functions. They try to carry out the normal processes using
the system and then decide if it is the right fit for the institute or they need
any changes.

3. Analysing Problems

The ERP system is minutely evaluated by the institute to understand if any


gaps are present in the processes. The software has a different usage for
every department. Hence everyone’s experience and approval are necessary
to implement ERP software.

CHIRAG KATHPALIA 191380195


To analyze the gaps, sample data is collected from all the teams and it is tested
on various masters and aspects of the ERP system. Any changes can be made
to the system at this stage.

After considering everyone’s viewpoints, a module-wise software


requirement specification is created by the team. This is shown to the users
and they give their viewpoints on it.

4. Making Customizations

If there are any minor changes to be made in the system, they are taken care
of by the software providers as soon as they are addressed. But in case of
major changes, there is a requirement of written approval by the institute.
These include customizations that need changes in the codes of the software.

The software is made in such a way that it fits clean with the existing
processes of the institute. The software providers make sure that no function
is disturbed. They put several teams to work for faster results.

5. Testing All Modules

Sample data is tested on the system by various teams. Everyone’s comfort for
the usage of the system is considered before approving any aspect of the ERP
software. The live reports of tests are generated and presented to the
institute. If there are any problems, they are solved there and then
themselves. The institute operates the system to see if they understand its
operability level.

They make sure that the system is fully functional and easy to use for their
employees. After taking approval from all the departments, the software is
approved by the institute.

CHIRAG KATHPALIA 191380195


6. ERP Implementation

The client decides whether they want a cloud ERP or an on-premise system.
They can choose the one which is best suitable for their requirements.

After the approval of the system, the real data of the institute is imported into
the system and it is made ready to use for the institute. The module is made
live. Login credentials are shared with the employees and they can begin their
work using the ERP software.

7. Maintenance And Help

Just like implementation, maintenance is an important part of ERP


implementation. The requirement of maintenance is dependent on the
hosting of the ERP software. If the ERP is could based, the maintenance is
taken care of by the ERP provider. However, the on-premise ERP requires
higher maintenance from the institute as compared to cloud software.

CHIRAG KATHPALIA 191380195


Implementation stages

CHIRAG KATHPALIA 191380195


Identification

Head of Department (HOD)

The head of department is a part of the teaching staff but has special privileges. They
manage the operations of each department. The HOD could still conduct courses for
students. So, they will have all the features given to a teacher. Also, as the HOD, they
will have access to the records of every teacher, courses, students who belong to the
same department.

Teachers

Teachers are the key stakeholders of the college ERP. Because they are the one who
manage, edit, update the contents of the database of students such as attendance,
internal marks, CGPA etc...It also helps them to assign their class to other teachers when
they are on leave. This makes it easier to identify who among them are free to take the
class at that time. So this software help them reduce their overhead and make their
tasks easier and simple.

Students

Students are end users of ERP software. The attendance, internals marks uploaded by
the teachers are viewed by students. It helps them track their attendance status. It also
helps them to communicate with teachers and their classmates. So students make up
another set of stakeholders of this software.

Administrator
College administrator is responsible for maintaining the database of the college. They
will have the privilege to modify the database i.e., to add/remove
students/teachers/staff, update information regarding each of these. It is their
responsibility to maintain the database of students who pass out from the college and
who freshly get admission to the college. So the Administrator play a major role in the
ERP.

CHIRAG KATHPALIA 191380195


Viewpoints

HOD viewpoint

For HOD, they can view, add and edit all the information about teacher’s and student’s,
Courses, batches, subjects, etc. Hod can also approve staff leave’s.

Teacher’s viewpoint

For a teacher, this software must be easy to use. It should be easy to find different
modules like attendance, leave module, internals marks, result etc...Teachers are the
one who update the contents of the student’s database.

Student’s viewpoint

A student can only view the information about himself, other than that everything will
be hidden from them. They will not have the option to edit anything. So the graphical
user interface must be good. They expect it to be functional.

Administrator’s viewpoint
Administrator will have the privilege to view all the information about the college. They
will have the option to track goals like, Average marks of all the students in a subject,
Average attendance of all the students of a class etc...

CHIRAG KATHPALIA 191380195


Data Flow Diagram

CHIRAG KATHPALIA 191380195


Requirements

1. Hardware Requirement
i. 4 systems (4 GB RAM, 25 GB storage, 1.6Ghz processor)
ii. Clouds server for database
iii. Hosting, domain & SSL Certification

2. Software Requirement
i. PyCharm
ii. Postgres Stack builder
iii. VS code
iv. PostgreSQL
v. Amazon S3 bucket
vi. Heroku

3. Languages Used
i. Frontend (HTML, CSS, JS, tailwind, bootstrap)
ii. Backend (Java, Python (Django, Rest, Postman))
iii. Database (SQL, Python)
iv. Server-side languages (Python, JavaScript)

CHIRAG KATHPALIA 191380195


Libraries

i. Django==4.1.1
Django is a web development python framework that makes it
easy to build powerful web applications.

ii. django-binary-database-files==1.0.17
This is a storage system for Django that stores uploaded files in
binary fields in the database.Files can be served from the database
(usually a bad idea), the file system, or a CDN.

iii. django-imagekit==4.1.0
ImageKit is a Django app for processing images

iv. djangorestframework==3.13.1
Django REST framework is a powerful and flexible toolkit for
building Web APIs.

v. easygui==0.98.3
EasyGUI is a module for very simple, very easy GUI programming in
Python

vi. mysql-connector-python==8.0.30
Python needs a MySQL driver to access the MySQL database

CHIRAG KATHPALIA 191380195


vii. mysqlclient==2.1.1
mysqlclient is a fork of MySQL-python. It add Python 3.3 support and
merges some pull requests.

viii. redmail==0.4.1
Red Mail is an advanced email sender library. It is a sister library for
Red Box, advanced email reader.

ix. sqlparse==0.4.2
sqlparse is a non-validating SQL parser for Python. It provides support
for parsing, splitting and formatting SQL statement.

CHIRAG KATHPALIA 191380195


Procedures

1. Installation and creating project ,app in django

i. Install pycharm community edition

ii. Install django in pycharm using command in terminal

pip install django

iii. Creating a project

iv. Creating apps using command

CHIRAG KATHPALIA 191380195


Views.py

from django.http import HttpResponse, HttpResponseRedirect


from django.contrib.auth import login, logout, authenticate
from django.shortcuts import render, redirect
from Esetup.emailbackend import EmailBackend
from django.contrib import messages
from django.contrib.auth.decorators import login_required
from Esetup.models import CustomUser
# Create your views here.
def loginpage(request):
return render(request, 'login.html')

def dologin(request):
if request.method != 'POST':
return HttpResponse("<h1>Error 404</h1>")
else:
user = EmailBackend.authenticate(request,
username=request.POST.get("email"),

password=request.POST.get("password"))
if user != None:
login(request, user)
user_type= user.user_type
if user_type == '1':
return HttpResponseRedirect('/adminhome')
elif user_type == '2':
pass
elif user_type == '3':
return HttpResponseRedirect('/studenthome')
else:
messages.error(request, "Email and password are
not identified")
return render('loginpage')
# return HttpResponse("Email :" +
request.POST.get("email") + ", Password :" +
request.POST.get("password"))
else:
messages.error( request, "Invalid Login Details")
return HttpResponseRedirect("/")

def userdetails(request):

CHIRAG KATHPALIA 191380195


if request.user != None:
return HttpResponse("Username :" + request.user.email +
"usertype :" + request.user.user_type)
else:
return HttpResponse("login first")

def dologout(request):
logout(request)
return HttpResponseRedirect("/")

# def temp(req):
# return render(req, "base.html")

@login_required(login_url='/')
def userprofile(request):
return render (request, 'profile.html')
@login_required(login_url='/')
def editprofile(request):
user= CustomUser.objects.get(id= request.user.id)
# print(user)
context= {
"user":user,
}
return render(request, "editprofile.html", context)
@login_required(login_url='/')
def updateprofile(request):
if request.method == "POST":
profile_pic= request.FILES.get('profile_pic')
first_name= request.POST.get('first_name')
last_name= request.POST.get('last_name')
# email= request.POST.get('email')
# username= request.POST.get('username')
password= request.POST.get('password')
# aboutme= request.POST.get('about')
# print(profile_pic, first_name, last_name, password,
email, username)
try:
customuser = CustomUser.objects.get(id =
request.user.id)
customuser.first_name = first_name
customuser.last_name= last_name
# customuser.username = username
# customuser.email = email
if password != None and password != "":
customuser.set_password(password)

CHIRAG KATHPALIA 191380195


if profile_pic != None and profile_pic != "":
customuser.display_pic = profile_pic
customuser.save()
messages.success(request, "Your profile updated
successfully")
# return render(request, "profile.html")
return redirect('user_profile')
# used redirect to update image instantly, render
failed to update the image
except:
messages.error(request, "Failed to update profile")
return redirect(request, 'editprofile.html')

CHIRAG KATHPALIA 191380195


Creating HOD view

I. from django.shortcuts import render, redirect


from django.contrib.auth.decorators import
login_required
from Esetup.models import Courses, Session,
CustomUser, students
from django.contrib import messages

# used taki cookie ki wajha se logout baad login na ho


as saved info
@login_required(login_url='/')
def adminhome(request):
return render(request, "hod/hodbase.html")

@login_required(login_url='/')
def addstudent(request):
course = Courses.object.all()
session = Session.object.all()
if request.method == 'POST':
profile_pic = request.FILES.get('profile_pic')
first_name = request.POST.get('first_name')
last_name = request.POST.get('last_name')
email = request.POST.get('email')
address = request.POST.get('address')
username = request.POST.get('username')
password_var = request.POST.get('password')
gender_var = request.POST.get('gender')
course_selected = request.POST.get('course')
# session_selected =
request.POST.get('session')

if
CustomUser.objects.filter(email=email).exists():
messages.warning(request, "email exists
for another user")
return redirect('addstudent')
if
CustomUser.objects.filter(username=username).exists():
messages.warning(request, "email exists
for another user")
return redirect('addstudent')
else:
user = CustomUser(

CHIRAG KATHPALIA 191380195


first_name=first_name,
last_name=last_name,
email=email,
username=username,
# password= password,
display_pic=profile_pic,
user_type=3
)

user.set_password(password_var)
user.save()

course_var =
Courses.object.get(id=course_selected)
# session_var =
Session.object.get(id=session_selected)

student = students(
admin=user,
address=address,
# session_id = session_var,
course_id=course_var,
gender=gender_var
)

# print('accessing student model')


student.save()
messages.success(request, 'Successfully
added student')
return redirect("addstudent")

# print(address, session, password, course)

context = {
"course": course,
'session': session,
}
return render(request, 'hod/addstudent.html',
context)

@login_required(login_url='/')
def addstaff(request):
return render(request, 'hod/addstaff.html')

@login_required(login_url='/')

CHIRAG KATHPALIA 191380195


def addsubject(request):
return render(request, 'hod/addsubject.html')

@login_required(login_url='/')
def addcourse(request):
return render(request, 'hod/addcourse.html')

CHIRAG KATHPALIA 191380195


Settings.py

INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
# 'livereload',
'django.contrib.staticfiles',
'Esetup'

TEMPLATES = [
{
'BACKEND':
'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',

'django.contrib.messages.context_processors.messages',
],
},
},
]

DATABASES = {
'default': {
'ENGINE': 'django.db.backends.postgresql_psycopg2',
'NAME': 'sms',
'USER': 'postgres',
'PASSWORD': 'root',
'HOST': '127.0.0.1',
'PORT': '5432',
}
}

CHIRAG KATHPALIA 191380195


urls.py

from django.contrib import admin


from django.urls import path

from django.conf.urls.static import static


from django.conf import settings
from Esetup import views, hodviews, staffviews, studentviews
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.loginpage, name='loginpage'),
path('dologin', views.dologin),
path('usersdetails', views.userdetails),
path('logout', views.dologout),
# path('temp', views.temp),
#profie functions
path('profile', views.userprofile, name= 'user_profile'),
path('editprofile', views.editprofile, name= 'editprofile'),
path('updateprofile', views.updateprofile, name=
'updateprofile'),
# admin functions
path('adminhome', hodviews.adminhome, name= 'adminhome'),
path('addstudent', hodviews.addstudent, name= 'addstudent'),
path('addstaff', hodviews.addstaff, name= 'addstaff'),
path('addsubject', hodviews.addsubject, name= 'addsubject'),
path('addcourse', hodviews.addcourse, name= 'addcourse'),
#student functions
path('studenthome', studentviews.studenthome,
name='studenthome'),

#teacher function
path('staffhome', staffviews.studenthome, name='staffhome'),
]
urlpatterns += static(settings.MEDIA_URL,
document_root=settings.MEDIA_ROOT)
urlpatterns += static(settings.STATIC_URL,
document_root=settings.STATIC_ROOT)

CHIRAG KATHPALIA 191380195


models.py

from django.db.models.signals import post_save


# from django.dispatch import receiver
from secrets import choice
from django.contrib.auth.models import AbstractUser
from django.db import models
from django.dispatch import receiver

class CustomUser(AbstractUser):
user_data = ((1, "Hod"), (2, "staff"), (3, "student"))
user_type = models.CharField(default=1, choices=user_data,
max_length=10)
# gender_data = ((1, "Male"), (2, "Female"))
# user_gender = models.CharField(default = 1, choices=
gender_data, max_length= 10)
# user_address= models.CharField(default ="Not defined",
max_length= 300)
display_pic= models.ImageField(default= "",
upload_to='displaypic')

class students(models.Model):
id = models.AutoField(primary_key=True)
admin = models.OneToOneField(CustomUser,
on_delete=models.CASCADE)
address = models.TextField()
gender = models.CharField(max_length=255)
course_id = models.ForeignKey(Courses,
on_delete=models.DO_NOTHING)
created_at = models.DateTimeField(auto_now=True)
updated_at = models.DateTimeField(auto_now=True)
objects = models.Manager()

class attendence(models.Model):
id = models.AutoField(primary_key=True)
Student_id = models.ForeignKey(students,
on_delete=models.DO_NOTHING)
attendence_date = models.DateTimeField(blank=True)
created_at = models.DateTimeField(blank=True)
updated_at = models.DateTimeField(blank=True)
objects = models.Manager(

CHIRAG KATHPALIA 191380195


Database

CHIRAG KATHPALIA 191380195


Templates

{% extends "commonbase.html" %}
{% block content %}
<div class="page-header">
<div class="row">
<div class="col-sm-12">
<h3 class="page-title">Welcome
<span>{{user.first_name}} {{user.last_name}}</span></h3>
<ul class="breadcrumb">
<li class="breadcrumb-item active">Dashboard</li>
</ul>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-sm-6 col-12 d-flex">
<div class="card bg-one w-100">
<div class="card-body">
<div class="db-widgets d-flex justify-content-
between align-items-center">
<div class="db-icon">
<i class="fas fa-user-graduate"></i>
</div>
<div class="db-info">
<h3>45</h3>
<h6>Students</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-sm-6 col-12 d-flex">
<div class="card bg-two w-100">
<div class="card-body">
<div class="db-widgets d-flex justify-content-
between align-items-center">
<div class="db-icon">
<i class="fas fa-crown"></i>
</div>
<div class="db-info">
<h3>8+</h3>
<h6>Awards</h6>
</div>
</div>
</div>

CHIRAG KATHPALIA 191380195


</div>
</div>
<div class="col-xl-3 col-sm-6 col-12 d-flex">
<div class="card bg-three w-100">
<div class="card-body">
<div class="db-widgets d-flex justify-content-
between align-items-center">
<div class="db-icon">
<i class="fas fa-building"></i>
</div>
<div class="db-info">
<h3>7</h3>
<h6>Department</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-sm-6 col-12 d-flex">
<div class="card bg-four w-100">
<div class="card-body">
<div class="db-widgets d-flex justify-content-
between align-items-center">
<div class="db-icon">
<i class="fas fa-file-invoice-dollar"></i>
</div>
<div class="db-info">
<h3>290000</h3>
<h6>Revenue</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 col-lg-6">
<div class="card card-chart">
<div class="card-header">
<div class="row align-items-center">
<div class="col-6">
<h5 class="card-title">Revenue</h5>
</div>
<div class="col-6">
<ul class="list-inline-group text-right mb-0
pl-0">
<li class="list-inline-item">

CHIRAG KATHPALIA 191380195


<div class="form-group mb-0 amount-
spent-select">
<select class="form-control form-
control-sm">
<option>Today</option>
<option>Last Week</option>
<option>Last Month</option>
</select>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="card-body">
<div id="apexcharts-area"></div>
</div>
</div>
</div>
<div class="col-md-12 col-lg-6">
<div class="card card-chart">
<div class="card-header">
<div class="row align-items-center">
<div class="col-6">
<h5 class="card-title">Number of Students</h5>
</div>
<div class="col-6">
<ul class="list-inline-group text-right mb-0
pl-0">
<li class="list-inline-item">
<div class="form-group mb-0 amount-
spent-select">
<select class="form-control form-
control-sm">
<option>Today</option>
<option>Last Week</option>
<option>Last Month</option>
</select>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="card-body">
<div id="bar"></div>
</div>

CHIRAG KATHPALIA 191380195


</div>
</div>
</div>
<div class="row">
<div class="col-md-6 d-flex">
<div class="card flex-fill">
<div class="card-header">
<h5 class="card-title">Star Students</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover table-center">
<thead class="thead-light">
<tr>
<th>ID</th>
<th>Name</th>
<th class="text-center">Marks</th>
<th class="text-center">Percentage</th>
<th class="text-right">Year</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-nowrap">
<div>PRE2209</div>
</td>
<td class="text-nowrap">John Smith</td>
<td class="text-center">1185</td>
<td class="text-center">98%</td>
<td class="text-right">
<div>2019</div>
</td>
</tr>
<tr>
<td class="text-nowrap">
<div>PRE1245</div>
</td>
<td class="text-nowrap">Jolie
Hoskins</td>
<td class="text-center">1195</td>
<td class="text-center">99.5%</td>
<td class="text-right">
<div>2018</div>
</td>
</tr>
<tr>
<td class="text-nowrap">

CHIRAG KATHPALIA 191380195


<div>PRE1625</div>
</td>
<td class="text-nowrap">Pennington
Joy</td>
<td class="text-center">1196</td>
<td class="text-center">99.6%</td>
<td class="text-right">
<div>2017</div>
</td>
</tr>
<tr>
<td class="text-nowrap">
<div>PRE2516</div>
</td>
<td class="text-nowrap">Millie
Marsden</td>
<td class="text-center">1187</td>
<td class="text-center">98.2%</td>
<td class="text-right">
<div>2016</div>
</td>
</tr>
<tr>
<td class="text-nowrap">
<div>PRE2209</div>
</td>
<td class="text-nowrap">John Smith</td>
<td class="text-center">1185</td>
<td class="text-center">98%</td>
<td class="text-right">
<div>2015</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="col-md-6 d-flex">
<div class="card flex-fill">
<div class="card-header">
<h5 class="card-title">Student Activity</h5>
</div>
<div class="card-body">
<ul class="activity-feed">
<li class="feed-item">

CHIRAG KATHPALIA 191380195


<div class="feed-date">Apr 13</div>
<span class="feed-text"><a>John Doe</a> won
1st place in <a>"Chess"</a></span>
</li>
<li class="feed-item">
<div class="feed-date">Mar 21</div>
<span class="feed-text"><a>Justin Lee</a>
participated in <a href="invoice.html">"Carrom"</a></span>
</li>
<li class="feed-item">
<div class="feed-date">Feb 2</div>
<span class="feed-text"><a>Justin
Lee</a>attended internation conference in <a
href="profile.html">"St.John School"</a></span>
</li>
<li class="feed-item">
<div class="feed-date">Apr 13</div>
<span class="feed-text"><a>John Doe</a> won
1st place in <a>"Chess"</a></span>
</li>
<li class="feed-item">
<div class="feed-date">Mar 21</div>
<span class="feed-text"><a>Justin Lee</a>
participated in <a href="invoice.html">"Carrom"</a></span>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-sm-6 col-12">
<div class="card flex-fill fb sm-box">
<i class="fab fa-facebook"></i>
<h6>50,095</h6>
<p>Likes</p>
</div>
</div>
<div class="col-xl-3 col-sm-6 col-12">
<div class="card flex-fill twitter sm-box">
<i class="fab fa-twitter"></i>
<h6>48,596</h6>
<p>Follows</p>
</div>
</div>
<div class="col-xl-3 col-sm-6 col-12">
<div class="card flex-fill insta sm-box">

CHIRAG KATHPALIA 191380195


<i class="fab fa-instagram"></i>
<h6>52,085</h6>
<p>Follows</p>
</div>
</div>
<div class="col-xl-3 col-sm-6 col-12">
<div class="card flex-fill linkedin sm-box">
<i class="fab fa-linkedin-in"></i>
<h6>69,050</h6>
<p>Follows</p>
</div>
</div>
</div>
{% endblock %}

CHIRAG KATHPALIA 191380195


User interface

CHIRAG KATHPALIA 191380195


References

1. https://stackoverflow.com/
2. https://www.w3schools.com/
3. https://getbootstrap.com/

CHIRAG KATHPALIA 191380195

You might also like