Track time between process management statuses

Introduction

Tracking the progress of business processes with Process Management is one of Kintone's strongest features. To add on to that, it would help even more to be able to see how long certain stages of a business process are taking so that bottlenecks can be fixed and to optimize overall process time from start to finish. This customization introduces how to track the amount of time taken between process management statuses to visualize which sections are taking the longest or shortest and assist with business optimization and decision making. 

Sample Image

The below image shows a table with Status Name, Status Datetime, and Status Days. The current status is "Collect provider responses and summarize".

 

sample_1.png

 

Clicking the "Provider Responses Summarized" action shows the confirmation for proceeding the status to "Review provider options with client".

 

sample_2.png

 

Clicking Confirm proceeds the status and adds a new row to the table with the new current status, the current datetime, and how many days were in between now and the last status change.

 

sample_3.png

 

Implementation

Set Up the App

In terms of App set up, this customization only requires a table to input the process management information into. Therefore, it is very easy to implement into any App that would benefit from a visualization of the process management. The field settings are as follows.

Field Type Field Name Field Code Notes
Table Log Table Status_Log   -
Text Status Name Status_Name Part of Log Table table
Datetime Status Datetime Status_Datetime Part of Log Table table
Number Status Days Status_Days Part of Log Table table

 

The completed table should look like the following.

 

Log_Table.png

Implement the JavaScript Files

This customization uses the following JavaScript code as well as the Luxon library to handle dates and time. Refer to the following Luxon documentation for more information on Luxon.

 

Save the following code as a JavaScript file. This tutorial has named the file process_management_log.js.

 

 

From the JavaScript and CSS Customization settings, add the following files. Refer to the Customizing an App with JavaScript and CSS article from the Kintone Help Center for more information on uploading JavaScript and CSS files to an App.

The uploaded files should look as follows within the App. Make sure that the Luxon link is positioned above the customization file.

 

JS_CSS.png

Code Explanation

This section will explain the sample code.

The defaultRow variable specifies a blank row in the process management table. This variable is used in the functions declared afterward.

 

The handleAddProcessLog function retrieves the next status and calculates the time in days that it took to get from the previous status to the current status. The information is then added as a new row to the table.

 

 

The resetTableRow function is used in the case that a record is reused that already has process management information in the table. It will reset the table information using the defaultRow variable information.

 

 

The handleInitialLog function is used to input the initial row in the process management table containing the Not started status when the record is initially created.

 

 

Finally, the applicable Kintone events are declared and each function is assigned to the Kintone events they should be executed at. In this case, handleAddProcessLog is executed when the process management is proceeded. resetTableRow is executed at the create record and edit record events. Finally, handleInitialLog is executed when a new record is created.

 

Customization Variation

This customization can be further improved by making the process management table uneditable through the GUI. An example of the uneditable table is shown below. 

 

no_edit.png

 

The edited code is shown below.

 

 

Code Explanation

The main change to the code is the addition of the disableTableEdits function. This function goes through each row in the table and sets the disabled property of each field to true.

 

 

The other change is in the events declarations. disableTableEdits is added to the three events that resetTableRow is executed at, and the event is returned within the event declaration instead of within each individual function.

 

Finally

Customizations can build upon native Kintone features to create a solution that is specific to the company. In this case, the created process management logging solution can help with analysis of bottlenecks and improve efficiency. When a problem in a business process arises, it may be worthwhile to see if a Kintone customization would help solve or recognize the problem.

Was this article helpful?
0 out of 0 found this helpful
Do you have any questions or issues related to this article?
Please share your views with us in the Community forums!