Table of Contents

General Information....................................................................................................1
1.1

System Overview..................................................................................................1

1.2

Organization of the Manual..................................................................................1

System Summary........................................................................................................2
2.1

Installation Guide..................................................................................................2

2.2

System Configuration...........................................................................................5

2.3

User Access Levels..............................................................................................6

2.4

Contingencies.......................................................................................................6

Getting Started............................................................................................................7
3.1

Using the System........................................................................................................9

4.1

User Tasks............................................................................................................9

4.1.1

Punching In....................................................................................................9

4.1.2

Punching Out.................................................................................................9

4.1.3

View Attendance..........................................................................................10

4.1.4

View Payroll.................................................................................................10

4.2

User Interface.......................................................................................................7

Administrator Tasks............................................................................................11

4.2.1

Adding Employees.......................................................................................11

4.2.2

Listing Employees........................................................................................12

4.2.3

Updating Employee.....................................................................................13

4.2.4

Attendance Management............................................................................13

Reporting...................................................................................................................15
5.1

Attendance Report.............................................................................................15

5.2

Department Payroll Report.................................................................................16

1 GENERAL INFORMATION
1.1 SYSTEM OVERVIEW
Attendance and Payroll System is a web application which allows recording
attendance, managing account details, managing payroll, and generating attendance
report and payroll report of the employees of the organization. This system is installed
on server computer and can be accessed from any computer under the same intranet of
the Third Pole Connects Company.

1.2 ORGANIZATION OF THE MANUAL

The user manual has five sections;
General Information section provides information about the system in general
terms and its purpose.
System Summary section provides the installation guide of the system along with
the hardware and software requirement, systems configuration, user access
level and contingencies.
Getting started section explains the various user interfaces, alert messages, and
hints provided in the system.
Using the system section provides a detailed description of the system functions.
Reporting section describes in what way information collected by the application
are presented and how to access the information.

1|Page

2 SYSTEM SUMMARY
2.1 INSTALLATION GUIDE
Before the Payroll and Attendance system can be used, the system needs to be
properly installed to the server computer through which it can be accessed via intranet.
Below is the required steps for the system installation in windows 7 and above.
Step 1: Copy the payroll . zip file from the compact disc.
Step 2: Extract the zip file to the desired safe location in the computer hard disk.

e.g. C :
Step 3: Download Xampp from
Step 4: Install Xampp

By default Xampp will be installed in

C:

Step 5: After Xampp installation, browse to

C : apache extra

and open

VirtualHost: 80>

DocumentRoot C: \payroll \public

ServerName payroll . dev

ServerAlias www . payroll. dev

Directory C: \payroll \public >

AllowOverride All
httpdvhosts .conf

Require all Granted

file with notepad. And add the following lines of code at

the end of file.

Step 6: Next, open host file with no extension located in directory

C : System 32 etc with notepad with administrator privilege and add following
line of code at the end of file.
XAMPP Control Panel
Step 7: Now Open
modules.

2|Page
127.0.0 .1 www . payroll .dev

and start Apache and MySQL

Click these start

buttons to run
Apache and MySQL
Modules

Step 8: Now open an internet browser, preferably Google Chrome , and navigate
to http :/ localhost / phpmyadmin / , click on Databases link.

Click on Databases link

Step 9: Now, create a database named

payrollapp from the databases.

Insert database name here payrollapp

Click create to create database

3|Page

Step 10:

Now open the

payrollapp database.

Click payrollapp to open it

Step 11:
Now, click on import
compact disc.
Click on import link

link and import

Click and choose payrollapp.sql from CD

Click to import

4|Page

payrollapp . sql

file from

Step 12:

Wait for few minutes, and the database gets imported.

Step 13:

Now navigate to

, the system is up and running.

2.2 SYSTEM CONFIGURATION

Attendance and Payroll System is web application which can be accessed in
computer browsers through tcpip/http protocol. The system provide view to clients side
with modern html5 elements, css3 attributes, media queries, etc. so modern browsers
are required to access the system the way it was intended. In server side the php
framework used is Laravel which has its own requirement i.e. php v5.3 and later, it
utilizes mcrypt for password hashing (encrypting). The system requires Apache server
to handle php files and MySQL server to store system users records or data.
5|Page

2.3 USER ACCESS LEVELS

Every employees of the company Third Pole Connects is eligible to use the
system but cannot sign up to the system. The user account is managed by admin
employees (i.e. Director of HR Department and member of ExCo department). Different
functionalities of the system is used by normal system user and admin system user. All
the features of employee management, attendance management, payroll management,
and report generation modules are available to admin users where as normal user can
only recorded and view attendance, update their personal account details, view own
attendance, and view payroll of selected month.

6|Page

3 GETTING STARTED
3.1 USER INTERFACE
Login
On entering the system, employees are
required to login by entering their email or
username and password.
Each employee is provided a username
and password by the system admin.
Enter your assigned username or email
and password.
After youve entered your credentials,
press the Login button or enter key.

Figure 1: Login Interface

Invalid Login
If the employee has entered invalid
credentials, then an error message is
displayed as shown in Figure 3.
Employees are allowed to change their
login credentials after theyve logged in.
Employees can re-enter their credentials
and try again.

Figure 2: Example of Invalid Login

Dashboard
If the login is successful, each user is presented with a dashboard displaying the
employees personal details. Employees can edit their personal details and login
credentials by clicking the Edit button as seen in figure 3 on the next page.

7|Page

Figure 2 is an example of an admin users dashboard. General information about each

page is displayed as Info on top.

Figure 3: Dashboard view of the website

Function Panel
On the left side of the website, users can perform
various tasks by clicking on the panel list.
Some tasks are limited to specific users and the panel
may vary depending on the level of clearance that a
user has.
Figure 1 is an example of function panel of an admin
user.
On the top right corner of any page, users can logout by
pressing the
button.

Figure 4: Example of Function

Panel of an Admin User

8|Page

4 USING THE SYSTEM

4.1 USER TASKS
The procedures for performing various user tasks are demonstrated in this section.
Every user is entitled to register their attendance and view their individual attendance
and payroll records.
4.1.1 Punching In
After an employee has logged in, they are
presented with a dashboard.
Click
to record your login time
for employee attendance.
After an employee has punched in, a
notification is displayed on top.
As soon as an employees attendance has
been recorded, the Punch In button
changes to
.

Figure 5: Example of Punch In Attendance

4.1.2 Punching Out

Punch In success
notification

Figure 3: Example of Punch Out Attendance

If employees are late and havent registered their attendance on time, the green button
changes to
. Employees are marked absent for that day.

9|Page

4.1.3 View Attendance

Employees can view their individual attendance by
clicking on the Attendance option in the left panel.
On entering the attendance page, employees are
presented with a list of attendance record of current
week.
Index for present, absent and late is indicated on the top
right corner of attendance record table.
Figure 4: Attendance in Left Panel

Employees must fill in the dates in order to view attendance report of specific time
periods. The date format is month/date and year as represented in figure 6.
Select dates then click show.

Figure 5: Attendance Record View

4.1.4 View Payroll

Employees can view their payroll by selecting a desired year and month.

Click View Report after

selecting year and month.
Figure 6: View Payroll Page

10 | P a g e

4.2 ADMINISTRATOR TASKS

The administrator of the system is responsible for adding, updating and deleting
employees in the database. They are also responsible for updating attendance details if
it is needed.
4.2.1 Adding Employees
On clicking the Employee tab in the left panel, the option for adding an employee
drops down.

Figure 7: Entering Create Employee Form

The figure below represents the create employee form of the system. The admin is
required to fill all fields in order to create a new employee.

Figure 8: Create Employee Form

11 | P a g e

If required fields are unfilled then an error message is displayed as shown in figure 5.

Figure 9: Invalid Employee Creation Form

4.2.2 Listing Employees

Admin can also generate a list of existing employees by clicking on the List Employees
tab in the left panel. Clicking View Details button displays the details of an employee.

Figure 10: Employee List View

12 | P a g e

4.2.3 Updating Employee

After clicking on View Details button, a list of employee details is displayed.

Figure 11: Employee Detail View

By pressing the Update button, admin is redirected to an update form similar to

employee creation form and on pressing Delete button, employee records are
removed from employee list.
4.2.4 Attendance Management
Admin have privileges to update attendance records.

Figure 12: Manage Attendance Page

13 | P a g e

Clicking on Manage Attendance displays a page where the admin has to select a
department before selecting an employee in order to modify attendance.
After selecting an employee, the attendance record is listed as shown in figure 9.

Employee can only be

selected after department.

Figure 13: Example of Manage Attendance Page

On clicking
button, a form pops up that allows admins to update attendance record
of that specific day.

Figure 14: Update Attendance Form

14 | P a g e

5 REPORTING
5.1 ATTENDANCE REPORT
Only the administrator has the authority to generate
department wise attendance report.
Admin needs to at first select the Attendance Report
option in the left panel.
After that a page is displayed where they have to pick a
department before selecting a time period.
Figure 15: Attendance Report in
Left Panel

After picking a department, admin can select desired employees for report generation.

Pick a department, select time period then click View Report.

Figure 16: Attendance Report Page

Figure 17: Attendance Report Sample

15 | P a g e

5.2 DEPARTMENT PAYROLL REPORT

Only the administrator has the authority to generate
department wise payroll report.
Admin needs to at first select the Payroll Report option in
the left panel.
After that a page is displayed where they have to pick a
department before selecting a time period.
Figure 18: Payroll Report in Left
Panel

After picking a department, admin can select desired employees for report generation.

Pick a department, select a month then click View Report.

Figure 19: Payroll Report Page

16 | P a g e

Figure 20: Payroll Report Sample

17 | P a g e

18 | P a g e