Table of Contents1General Information11.1System Overview11.2Organization of the Manual12System Summary22.1Installation Guide22.2System Configuration52.3User Access Levels62.4Contingencies63Getting Started73.1User Interface74Using the System94.1User Tasks94.1.1Punching In94.1.2Punching Out94.1.3View Attendance104.1.4View Payroll104.2Administrator Tasks114.2.1Adding Employees114.2.2Listing Employees124.2.3Updating Employee134.2.4Attendance Management135Reporting155.1Attendance Report155.2Department Payroll Report16

General InformationSystem OverviewAttendance 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.Organization of the ManualThe 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.

System SummaryInstallation GuideBefore 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 file from the compact disc.Step 2: Extract the zip file to the desired safe location in the computer hard disk.e.g. Step 3: Download Xampp from.Step 4: Install XamppBy default Xampp will be installed in Step 5: After Xampp installation, browse to and open file with notepad. And add the following lines of code at the end of file.

Step 6: Next, open file with no extension located in directory with notepad with administrator privilege and add following line of code at the end of file.

Step 7: Now Open and start Apache and MySQL modules.

Click these start buttons to run Apache and MySQL Modules

Step 8: Now open an internet browser, preferably , and navigate to , click on link.

Click on Databases link

Step 9: Now, create a database named from the databases.Click create to create databaseInsert database name here payrollapp

Step 10: Now open the database.Click payrollapp to open it

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

Click to import payrollapp.sqlClick and choose payrollapp.sql from CD

Step 12: Wait for few minutes, and the database gets imported.

Step 13: Now navigate to , the system is up and running.

System ConfigurationAttendance 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.User Access LevelsEvery 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.

Getting StartedUser Interface

LoginFigure 1: Login Interface

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 2: Example of Invalid Login

Invalid LoginIf 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.

DashboardIf 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.

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 websiteFunction PanelOn 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

Using the SystemUser TasksThe 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. Punching InFigure 5: Example of Punch In Attendance

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 .

Punching OutPunch In success notification

Figure 3: Example of Punch Out AttendanceIf employees are late and havent registered their attendance on time, the green button changes to . Employees are marked absent for that day.View AttendanceEmployees 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 ViewView PayrollEmployees can view their payroll by selecting a desired year and month.Click View Report after selecting year and month.

Figure 6: View Payroll PageAdministrator TasksThe 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.Adding EmployeesOn clicking the Employee tab in the left panel, the option for adding an employee drops down.

Figure 7: Entering Create Employee FormThe 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

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

Figure 9: Invalid Employee Creation FormListing EmployeesAdmin 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

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

Figure 11: Employee Detail ViewBy 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.Attendance ManagementAdmin have privileges to update attendance records.

Figure 12: Manage Attendance PageClicking 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 PageOn clicking button, a form pops up that allows admins to update attendance record of that specific day.

Figure 14: Update Attendance Form

ReportingAttendance Report

Only the administrator has the authority to generate department wise attendance report.Figure 15: Attendance Report in Left Panel

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.

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 SampleDepartment Payroll ReportOnly the administrator has the authority to generate department wise payroll report.Figure 18: Payroll Report in Left Panel

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.

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 Page3 | Page

Figure 20: Payroll Report Sample