TimeSheet Project Using ASP.NET MVC 5

In this article, we are going to go through the entire Timesheet Project process in detail, step by step. 

Link to download the source code here.

Note
This Project is for only learning purposes. It cannot be summited to any College or High School.

Process

This project focuses completely on the timesheet process in which there are three roles:

1. User

2. Admin

3. SuperAdmin.

Let’s start with “Super Admin” Role. “Super Admin” has access to create a New “Admin” and “User”. First, “Super Admin” creates “Admin” and after creating the “Admin”, “Super Admin” creates a “User” and then assigns User to a particular “Admin”.

After assigning a user to particular “Admin”, the “Admin” has right to view User Profile and has rights to “Approve” or “Reject” the Timesheet and Expenses which the User has submitted. “Admin” can export the Timesheet according to the Date and Users and in a similar way, the expense can be exported according to the date.

Next, let’s have a look at “User” Role. User has a right to fill in and submit Timesheet and Expenses. After submitting it can be viewed by Admin who can  then “Approve” or “Reject” Timesheet and Expense.

About the Platform Used

I had developed the entire application using Microsoft Visual Studio 2015 with SQL Server 2008 R2.

Frame work used is ASP.NET MVC 5 and the language is C# and Dapper, Entity Framework as ORM and Repository Pattern.

Microsoft Visual Studio 2015 with Update 3

Link to download here,

Microsoft SQL Server 2008 R2.

Link to download here,

Database Details

For this application, I have created a database with the name “Timesheet”.

Roles

This table contains Roles.

ProjectMaster

This Table contains all Project Names and Project Code.

Registration

This table contains Registration Details of Users, Admin, and SuperAdmin.

Contains RoleID which is Foreign Key

AssignedRoles

This table contains Assigned Roles.

Super Admin can assign Users to a particular Admin. All mapping is stored in this table.

AuditTB

This Table contains all detailed logs of page access by User, Admin and SuperAdmin 

TimeSheetMaster

This Table contains all Summary Timesheet data which the User fills in.

TimeSheetDetails

This Table contains all Details of the Timesheet data which User fills in.

This TimeSheetDetails table has Foreign key TimeSheetMasterID.

DescriptionTB

This Table contains all descriptions which the user enters while filling in the timesheet data.

This DescriptionTB table has Foreign key TimeSheetMasterID.

TimeSheetAuditTB

This Table contains all Approval, Submitted and Rejection details for Timesheet.

If Admin has rejected Data then Status will be “3”, if User has Submitted Timesheet then Status will be ”1”, finally if Timesheet has been Approved then its Status is “2”.

Expense

This Table contains Expense Details.

ExpenseAuditTB

This Table contains all Approval, Submitted and Rejection Details for Expenses.

If Admin has to reject Expenses then Status will be “3”, if User has submitted Expenses then Status will be ”1”, finally if Expenses have been Approved then its Status is “2”.

Documents

This Table contains all Documents Related to Expenses.

NotificationsTB

This Table contains all Notifications which SuperAdmin wants to send to Users.

ELMAH_Error

This Table contains all Errors that have occurred in the application.

After completing database details now let’s have a look at the project structure in Visual Studio.

Project structure

Project Contains a Main ASP.NET MVC Web Application along with 3 Class Libraries.

1. Concrete
2. Interface
3. Model

External packages which are used in this Project

I have also added some packages from NuGet, here is the list:

1. CaptchaMvc
2. ClosedXML
3. Dapper
4. ELMAH

Design Templates

1. SB Admin 2

A Bootstrap admin theme, dashboard, or web app UI featuring powerful jQuery plugins for extended functionality.

Link: - https://startbootstrap.com/template-overviews/sb-admin-2/ 

JavaScript Libraries

1. Toastr
   Link: - http://www.toastrjs.com/

2. DateTimePicker
   Link: - https://xdsoft.net/jqplugins/datetimepicker/

3. Datatables
   Link: - https://datatables.net/

Encryption Library

1. AES 256

Structure Details

Note: - It is a half Snapshot of Folder Structure.

Models Class

Interfaces

Concrete

The above shows how the directory and folder structure look, now let’s check out the application screens.

Application Screens

1. SuperAdmin screens
2. User screens
3. Admin screens

All Super Admin Screens

Login Screens

After Login we are first going to see Super Admin Dashboard.

Super Admin Dashboard

After that, we are going to create a New User.

Create Users

In this part, a Super Admin can create a new User.

After creating a New User, next, we are going to create Admin User.

Create Admin User

In this part, a Super Admin can create a new Admin.

After creating a New Admin User, next, we are going to assign an Admin to Users.

Assign Admin to Users

After creating User, we can see all users in the below Users checklist and you will see Admin Dropdown list which contains all admins. To assign role to User just choose Admin from Admin dropdown and from a checklist, choose User and click on Assign Role Button.

After assigning Admin to Users, next, we are going to assign Roles to User.

Roles Assigned to Users

If you want to remove the role of the user and reassign again to another admin then you can click on “Remove Role” button.

After assigning Roles, next, we are going to have a look at how to add a Project.

Add Project

In this part, we can add a new Project.

After adding a Project, next, we are going to see how to reset the password.

Reset Password

In this part, Super Admin has the right to Reset Password of All Users.

After  resetting password, next, we are going to have a look at how to export all Timesheets.

Export All Timesheets

In this part, Super Admin has the right to download Timesheets of all Users according to date.

After exporting all Timesheets, next, let’s see how to export all Expenses.

Export All Expenses

In this part, Super Admin has the right to download Expenses of all Users according to date.

After exporting all Expenses, next, let’s see how to set Notifications.

Setting Notifications

In this part, Super Admin has the right to send Notifications to all Users.

All User Screens

User Dashboard

Its shows a summary of submitted  timesheets and expenses to the User.

Timesheet

In this part, we are going to choose Project Name and fill in the hours according to days and click on Save Details button to save Timesheet.

All Timesheet

After filling in the timesheet, all details will be displayed in this view.

After clicking on View, you will see details of Timesheet which you had filled in.

Expense

In this part, User is going to fill in all his Expenses, along with this, he is going to attach documents such as bills from restaurants and cabs.

After filling in Expenses all details will be displayed in this view.

After clicking on View, you will see details of Expenses which you had filled in.

Change Password

Admin Screens

Admin Dashboard

Its shows a summary of timesheets and expenses to Admin which have been submitted by Users.

All Timesheets Submitted by Users

Will show all timesheets submitted by Users to a particular Admin.

Now to approve or reject timesheets,  admin needs to click on View button which will display details of timesheets along with buttons to approve or reject timesheets, and along which that Admin needs to enter Comment for completing the process.

All Expenses Submitted by Users

Will show all expenses submitted by Users to a particular Admin.

Now to approve or reject expenses admin needs to click on View button which will display details of expenses along with buttons to approve or reject timesheets, and along which that Admin needs to enter Comments for completing the process.

Team Members

In this part if the admin wants to see the team under him then admin user can choose this menu. It will display all team members and their details.

Export Timesheet

In this part, admin can export data of a particular user's Timesheet according to the date he chooses.

Finally, after completing View, now let’s move to the report.

Exported Timesheet Report 

Exported Expense Report    

Finally, we have completed the project successfully and I believe that people who are new to MVC have learned a lot from this project.