Example #2: The Timesheet Application
Analysis and Design
In our virtual company, an employee is required to fill out a weekly timesheet – see Figure 114. Their manager will either approve the hours worked for that week or reject the timesheet. If a timesheet is rejected the employee will need to amend their hours and resubmit it for approval.
|
Figure 114. |
Step 1: Design User Roles:
The first step is to work out how many different roles are at work here in our process;
The employee that is submitting the timesheet.
The manager of the employee approves the timesheet.
So, there are two different roles in this work process.
Step 1: Design User Roles – Summary:
For this example, the need for two distinct user roles has been identified; Employee and Manager.
Step 2: Design Forms:
The next step in the analysis phase is to work out what the screens in our final system will look like. As all the relevant information in our process is represented on the existing timesheet itself, this will be the model for our forms.
Step 2: Design Forms – Summary:
For this example, the need for three screens has been identified. All the employees in our virtual company will be able to create a timesheet. Only managers will be able to approve or reject those timesheets.
Step 3: Design Workflow:
The final step in our analysis phase is to define the workflow itself.
In this example, the workflow is as follows:
|
Figure 115. |
Step 3: Design Workflow – Summary:
For this example, the workflow is a loop with an ‘Hours Approved?’ decision. If the decision is ‘Yes’ the workflow ends and becomes locked. If ‘No’, the workflow iterates through another pass allowing the employee to make changes to the timesheet.
This completes the analysis phase for the Timesheet system.
Implementation
Step 4: Implement User Types and Users:
For this example, the existing ‘Employee’ and ‘Manager’ user types from the previous example will be used. However, the ‘Employee’ user type needs some additional permissions:
|
To change the existing properties of the ‘Employee’ user type, click on ‘Employee’ and select ‘Properties’ in the context-sensitive menu that appears: |
Figure 116. |
|
|
|
|
The ‘User Types’ maintenance screen will appear in the right-hand pane of the browser. Add ‘Task List’ and ‘Item List’ permissions to the existing ‘Create New Instances’ permission by clicking on the checkboxes.
Click on the ‘Submit’ button.
Note: ‘Task List’ and ‘Items List’ will allow in-process workflows to be shown to the user. |
Figure 117. |
The access permissions already granted to the ‘Manager’ user type are adequate for this new example and remain unchanged. The users ‘Chris’ and ‘Paul’ will be reused for this example in their respective roles of ‘Employee’ and ‘Manager’.
Step 4: Implement User Types and Users – Summary:
At this point, the two user types have been defined and a single user exists under each of those types.
Note:
See previous example ‘Leave Form Application’ for a detailed description of adding user types and users.
Step 5: Implement Forms:
|
Select Admin → Forms from the top menu bar: |
Figure 118. |
|
|
|
|
Kontinuum’s form maintenance section will be displayed. Click on the ‘Forms’ node in the tree control in the left-hand pane of the browser. Select ‘Add Folder’ in the context-sensitive menu that appears: |
Figure 119. |
|
The ‘Folders’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button. |
Figure 120. |
|
Click on the newly created ‘Timesheets’ folder node in the tree control in the left-hand pane of the browser. Select ‘Add Folder’ in the context-sensitive menu that appears: |
Figure 121. |
Note:
The timesheet application requires three simple forms for the maintenance of ‘look-up codes’ for projects, activities and time types. These forms will be grouped under the sub-folder ‘Codes Maintenance’ within the main folder ‘Timesheets’.
|
The ‘Folders’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button. |
Figure 122. |
Under this folder, create a form called ‘Project Code Maintenance’ using the attributes listed in the tables below:
Form Name: Project Code Maintenance
Form Database Name: ProjectCodeMaintenance
Subform Details:
|
Subform |
Type |
Subform Name |
Subform Order |
Appear In Column |
Use data from Auxiliary Form |
HideDeleteButton |
Uneditable |
|
|
|
|
|
|
|
|
|
|
Project Code Details |
One |
ProjectCodeDetails |
1 |
1 |
|
|
|
Question Details:
|
Question |
Type |
Name |
PK |
Show In Task List |
Question Order |
Appear Column |
Column Width |
Data Type |
Size |
Input Mask |
Pixels from Left |
Pixels from Top |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Project Code |
Text Box |
ProjectCode |
Yes |
Yes |
1 |
1 |
5 |
VARCHAR |
5 |
None |
|
|
|
Project Description |
Text Box |
ProjectDescription |
No |
Yes |
2 |
1 |
|
VARCHAR |
50 |
None |
|
|
Note:
See previous example ‘Leave Form Application’ for a detailed description of adding forms, subforms and questions.
Under the ‘Codes Maintenance’ folder, create two more forms called ‘Activity Code Maintenance’ and ‘Time Type Code Maintenance’ using the attributes listed in the tables below:
Form Name: Activity Code Maintenance
Form Database Name: ActivityCodeMaintenance
Subform Details:
|
Subform |
Type |
Subform Name |
Subform Order |
Appear In Column |
Use data from Auxiliary Form |
HideDeleteButton |
Uneditable |
|
|
|
|
|
|
|
|
|
|
Activity Code Details |
One |
ActivityCodeDetails |
1 |
1 |
|
|
|
Question Details:
|
Question |
Type |
Name |
PK |
Show In Task List |
Question Order |
Appear Column |
Column Width |
Data Type |
Size |
Input Mask |
Pixels from Left |
Pixels from Top |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Activity Code |
Text Box |
Activity Code |
Yes |
Yes |
1 |
1 |
5 |
VARCHAR |
5 |
None |
|
|
|
Activity Description |
Text Box |
ActivityDescription |
No |
Yes |
2 |
1 |
|
VARCHAR |
50 |
None |
|
|
Form Name: Time Type Code Maintenance
Form Database Name: TimeTypeCodeMaintenance
Subform Details:
|
Subform |
Type |
Subform Name |
Subform Order |
Appear In Column |
Use data from Auxiliary Form |
HideDeleteButton |
Uneditable |
|
|
|
|
|
|
|
|
|
|
Time Type Code Details |
One |
TimeTypeCodeDetails |
1 |
1 |
|
|
|
Question Details:
|
Question |
Type |
Name |
PK |
Show In Task List |
Question Order |
Appear Column |
Column Width |
Data Type |
Size |
Input Mask |
Pixels from Left |
Pixels from Top |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Time Type Code |
Text Box |
TimeTypeCode |
Yes |
Yes |
1 |
1 |
5 |
VARCHAR |
5 |
None |
|
|
|
Time Type Description |
Text Box |
TimeTypeDescription |
No |
Yes |
2 |
1 |
|
VARCHAR |
50 |
None |
|
|
|
At this point, the ‘look-up code’ maintenance screens have been completed and the forms designer tree control should look similar to Figure 123: |
Figure 123. |
Under the ‘Timesheets’ folder, create the three main forms using the attributes listed in the tables below:
Form Name: Timesheet Header
Form Database Name: TimesheetHeader
Subform Details:
|
Subform |
Type |
Subform Name |
Subform Order |
Appear In Column |
Use data from Auxiliary Form |
HideDeleteButton |
Uneditable |
|
|
|
|
|
|
|
|
|
|
Header |
One |
Header |
1 |
1 |
|
|
|
Question Details:
|
Question |
Type |
Name |
PK |
Show In Task List |
Question Order |
Appear Column |
Column Width |
Data Type |
Size |
Input Mask |
Pixels from Left |
Pixels from Top |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Employee Name |
Text Box |
EmployeeName |
Yes |
Yes |
1 |
1 |
50 |
VARCHAR |
50 |
None |
|
|
|
Week Ending |
Input Mask Box Calendar |
WeekEnding |
Yes |
Yes |
2 |
1 |
|
DATETIME |
|
Australian Date Format |
|
|
Question Rules:
|
Question Name |
Default Value / Selection |
Required |
Uneditable |
|
|
|
|
|
|
EmployeeName |
@@User.FullName |
1 |
1 |
|
WeekEnding |
|
1 |
|
Form Name: Timesheet Line Items
Form Database Name: TimesheetLineItems
Subform Details:
|
Subform |
Type |
Subform Name |
Subform Order |
Appear In Column |
Use data from Auxiliary Form |
HideDeleteButton |
Uneditable |
|
|
|
|
|
|