1 of 29

UI Configuration

UI configuration for app

Overview

This page provides details about the MuktaSoft UI configuration required to enable it in any environment.

DevOps Configuration

In the DevOps repository of your organization, locate the following "deploy-as-code/helm/environments/works-dev.yaml". Inside the environment YAML file used to deploy the Works platform, please add the following block of code:


works-ui:
  custom-js-injection: |
    sub_filter.conf: "
      sub_filter  '<head>' '<head>
      <script src={{INSERT_YOUR_AWS_BUCKET_NAME}}/globalConfigsWorks.js type=text/javascript></script>';"

A dev environment sample file is linked here. Note that you will have to modify this for your deployment.

GlobalConfig

This section contains a config that is applicable globally to all UI modules. These need to be configured prior to service specific UI configurations.

Steps to create a globalconfig.js file:

Create a config file(globalconfigs.js) with below mentioned config (see code below).
Configure all the images/logo required in the S3 and add links as footerBWLogoURL , footerLogoURL
Mention the state tenant ID as stateTenantId
If any User roles have to be made invalid add as invalidEmployeeRoles
Then push this global config file into your S3 bucket as globalconfigs.js
Mention the globalconfig file URL into your Environment config

var globalConfigs = (function () {
  var stateTenantId = 'pg' // statetenantId
   var gmaps_api_key = '<<INSERT_GMAP_GENERATED_TOKEN>>';
   var contextPath = 'works-ui'; 
   var configModuleName = 'commonMuktaUiConfig'; 
   var centralInstanceEnabled = false;
   var footerBWLogoURL = '{{INSERT_YOUR_AWS_BUCKET_NAME}}/digit-footer-bw.png';
   var footerLogoURL = '{{INSERT_YOUR_AWS_BUCKET_NAME}}/digit-footer.png';
   var digitHomeURL = 'https://www.digit.org/';
   var xstateWebchatServices = 'wss://dev.digit.org/xstate-webchat/';
   var assetS3Bucket = '{{INSERT_YOUR_AWS_BUCKET_NAME}}';
   var invalidEmployeeRoles = ["CBO_ADMIN","STADMIN","ORG_ADMIN","ORG_STAFF","SYSTEM"] 

 
   var getConfig = function (key) {
     if (key === 'STATE_LEVEL_TENANT_ID') {
       return stateTenantId;
     }
     else if (key === 'GMAPS_API_KEY') {
       return gmaps_api_key;
     }
     else if (key === 'ENABLE_SINGLEINSTANCE') {
       return centralInstanceEnabled;
     } else if (key === 'DIGIT_FOOTER_BW') {
       return footerBWLogoURL;
     } else if (key === 'DIGIT_FOOTER') {
       return footerLogoURL;
     } else if (key === 'DIGIT_HOME_URL') {
       return digitHomeURL;
     } else if (key === 'xstate-webchat-services') {
       return xstateWebchatServices;
     } else if (key === 'S3BUCKET') {
       return assetS3Bucket;
     } else if (key === 'CONTEXT_PATH'){
	return contextPath;
     } else if (key === 'UICONFIG_MODULENAME'){
	return configModuleName;
     } else if (key === 'INVALIDROLES'){
	return invalidEmployeeRoles;
     }
   };
 
 
   return {
     getConfig
   };
 }());

MDMS configs

All the UI Screen configurations required for MUKTA are present in this folder commonMuktaUiConfig. For other MDMS configurations, please check here.

Roles Configuration

Please refer to the table in this document for screen-specific role configuration. Note that some of this will overlap with configurations done for the backend service modules. If already present in MDMS, please ignore it.

Localization Configs

All strings localized per module are provided in this sheet linked here. To translate the UI into other languages, please follow this sheet and provide appropriate translations in your language.

Reference Links

Figma screens for the UI are here. Please refer to them to understand the MUKTA UI.

Common Configurations

Overview

This section provides details for configuring modules or MDMS.

Role Configuration

This document contains details on the roles required to perform action in Works Frontend App

S.No

Module

Actions

Role Description

Roles

Note:

Employee Common (EMPLOYEE_COMMON) role is to be added for all the users since it provides them with all employees' common actions mentioned as in table SNo 22.
Bill Accountant and Mukta admin should not be added for any Employee who performs an action in Muster, Bill, Project,Estimate, or Contract Modules.
There are few restricted roles which should not be given to any Employees

MDMS Configuration

This document contains the module-wise required MDMS data.

Module

ModuleName

MasterName

MDMS link

Screens

APK Generation

Steps to generate APK

Overview

This document says how to generate APK and its configuration.

Steps To Generate APK

Add the .env file at the root of the project with the required config based on the env in the file.

Sample env config:

Run the below commands in your terminal from the root of the project

Run the below command in your terminal from the root of the project to generate the APK

Modules

Project

Project module frontend tech documentation

Overview

The Project module enables the Junior Engineer to capture the details of the project, search, view and modify the existing projects. This module is the initial step in starting the work.

The module has 4 associated screens :

Create
Search
Modify
View

MDMS Configurations

S.No.

Data

MDMS Link

Module Enablement Configuration

Set module code as “Project” in Module.js of Project Module. Refer https://github.com/egovernments/works-mdms-data/blob/DEV/data/pg/tenant/citymodule.json.

Enable module in App.js. Update the object ‘enabledModules’. Use the code “Project”. This code should match the code of cityModule.json, mentioned above.

PDF Configuration

The project created can be downloaded in PDF format from the View Project screen in the project module. The PDF contains the respective project descriptions, work details, and location details.

PDF URL : https://works-dev.digit.org/egov-pdf/download/project/project-details?projectId=<project-Id>&tenantId=<tenant-Id>

Role-action Mapping

Sidebar Configuration

Sample Configuration

Screen Configuration

Localisation Configuration & Modules

Workflow Configuration

Customisation

Create Screen:

Use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility returns a config that will run through the FormComposer.
Refer to docs for pre-process config in component comments.

Search Screen:

Use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility returns a config that will run through the RenderFormFields.
Refer to docs for pre-process config in component comments.

Custom Components Used in Projects:

Form Validations: Check if all form validations are added to the screen configurations. Add the populators for respective validations and mention the JSON path for the pre-process to work.

Estimate

Estimate module frontend tech documentation

Overview

The Estimate module helps in creating estimates based on projects created. This enables in deciding the Tendering, and Quotation.

The module has 5 associated screens :

Create Estimate
Search Estimate
Edit Estimate
View Estimate
Estimate Inbox

MDMS Configurations

S.No.

Data

MDMS Link

Module Enablement Configuration

Set module code as “Estimate” in Module.js of Estimate Module. Refer to the file

Enable Module in App.js. Update the object ‘enabledModules’. Use the code Estimate. This code should match the code of the cityModule.json, mentioned above.

Role-action Mapping

Sidebar Configuration

Sample object for a sidebar action define in MDMS( containing navigationUrl )

Screen Configuration

Localization Configuration & Modules

Workflow Configuration

For Workflow related actions, the View screens use two components:

Customisation

Custom Components used in Estimate:

Document Config -
- Used in Create Estimate Screen to capture Non-Sor line items.
- Used in Create Estimate Screen to capture Overhead items.
- Used in Create Estimate Screen to calculate and render Total Estimate Amount.
- Used in Create Estimate screen to capture labour and material costs. The total labour and material costs cannot be greater than the total Estimate Amount.

Create Estimate Screen:

Use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer to docs for Pre-Process config in Component comments.
UOM and Overheads captured in the create screen are MDMS data.

Inbox / Search Screen:

Use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer to docs for Pre-Process config in Component comments.

Workorder

Workorder/Contract UI Tech Documentation

Overview

This module helps in creating a work order for the Project based on the estimates designed. This enables in deciding the Tendering, Quotation and Nomination. Based on the nomination, CBO is being mapped to the respective Work Order.

This module has 5 associated screens :

Create
Search
Modify
View
Inbox

MDMS Configurations

Module enablement configuration

Set module code as “Contracts” in Module.js of Contracts Module. Refer https://github.com/egovernments/works-mdms-data/blob/DEV/data/pg/tenant/citymodule.json

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “Contracts”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

Sidebar configuration

Screen configuration

Localization Configuration and Modules

Workflow Configuration

Customization

1. API-based Data -

Name of CBO - This field is being captured on the Create screen and Modify screen. Data for this field comes from the backend.
CBO ID - This field is being set based on the value selected in the Name Of CBO.
Name of Officer In Charge - This field is being populated based on the HRMS Search. Here the role is hardcoded to ‘OFFICER_IN_CHARGE’.
Designation of Officer In Charge - This field is being set based on the value selected in the Name of Officer in charge.

2. Custom Components used in Projects :

Document Config -
Work Order Terms and Conditions -
This Component will help input description in the table. Users can add and delete the rows. First row won't be deleted, clicking on the delete button will empty the first row. Refer Component - WOTermsAndConditions.

3. Create Screen :

Please use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer docs for Pre-Process config in Component comments.

4. Inbox / Search Screen :

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer docs for Pre-Process config in Component comments.

UI Configuration

UI configuration for app

Overview

This page provides details about the MuktaSoft UI configuration required to enable it in any environment.

DevOps Configuration


works-ui:
  custom-js-injection: |
    sub_filter.conf: "
      sub_filter  '<head>' '<head>
      <script src={{INSERT_YOUR_AWS_BUCKET_NAME}}/globalConfigsWorks.js type=text/javascript></script>';"

A dev environment sample file is linked here. Note that you will have to modify this for your deployment.

GlobalConfig

This section contains a config that is applicable globally to all UI modules. These need to be configured prior to service specific UI configurations.

Steps to create a globalconfig.js file:

Create a config file(globalconfigs.js) with below mentioned config (see code below).
Configure all the images/logo required in the S3 and add links as footerBWLogoURL , footerLogoURL
Mention the state tenant ID as stateTenantId
If any User roles have to be made invalid add as invalidEmployeeRoles
Then push this global config file into your S3 bucket as globalconfigs.js
Mention the globalconfig file URL into your Environment config

var globalConfigs = (function () {
  var stateTenantId = 'pg' // statetenantId
   var gmaps_api_key = '<<INSERT_GMAP_GENERATED_TOKEN>>';
   var contextPath = 'works-ui'; 
   var configModuleName = 'commonMuktaUiConfig'; 
   var centralInstanceEnabled = false;
   var footerBWLogoURL = '{{INSERT_YOUR_AWS_BUCKET_NAME}}/digit-footer-bw.png';
   var footerLogoURL = '{{INSERT_YOUR_AWS_BUCKET_NAME}}/digit-footer.png';
   var digitHomeURL = 'https://www.digit.org/';
   var xstateWebchatServices = 'wss://dev.digit.org/xstate-webchat/';
   var assetS3Bucket = '{{INSERT_YOUR_AWS_BUCKET_NAME}}';
   var invalidEmployeeRoles = ["CBO_ADMIN","STADMIN","ORG_ADMIN","ORG_STAFF","SYSTEM"] 

 
   var getConfig = function (key) {
     if (key === 'STATE_LEVEL_TENANT_ID') {
       return stateTenantId;
     }
     else if (key === 'GMAPS_API_KEY') {
       return gmaps_api_key;
     }
     else if (key === 'ENABLE_SINGLEINSTANCE') {
       return centralInstanceEnabled;
     } else if (key === 'DIGIT_FOOTER_BW') {
       return footerBWLogoURL;
     } else if (key === 'DIGIT_FOOTER') {
       return footerLogoURL;
     } else if (key === 'DIGIT_HOME_URL') {
       return digitHomeURL;
     } else if (key === 'xstate-webchat-services') {
       return xstateWebchatServices;
     } else if (key === 'S3BUCKET') {
       return assetS3Bucket;
     } else if (key === 'CONTEXT_PATH'){
	return contextPath;
     } else if (key === 'UICONFIG_MODULENAME'){
	return configModuleName;
     } else if (key === 'INVALIDROLES'){
	return invalidEmployeeRoles;
     }
   };
 
 
   return {
     getConfig
   };
 }());

MDMS configs

All the UI Screen configurations required for MUKTA are present in this folder commonMuktaUiConfig. For other MDMS configurations, please check here.

Roles Configuration

Localization Configs

All strings localized per module are provided in this sheet linked here. To translate the UI into other languages, please follow this sheet and provide appropriate translations in your language.

Reference Links

Figma screens for the UI are here. Please refer to them to understand the MUKTA UI.

Estimate

Estimate module frontend tech documentation

Overview

The Estimate module helps in creating estimates based on projects created. This enables in deciding the Tendering, and Quotation.

The module has 5 associated screens :

Create Estimate
Search Estimate
Edit Estimate
View Estimate
Estimate Inbox

MDMS Configurations

S.No.

Data

MDMS Link

Module Enablement Configuration

Set module code as “Estimate” in Module.js of Estimate Module. Refer to the file

Enable Module in App.js. Update the object ‘enabledModules’. Use the code Estimate. This code should match the code of the cityModule.json, mentioned above.

Role-action Mapping

S.No.

API

Action ID

Roles

Sidebar Configuration

S.No.

Screen

Navigation URL

Left Icon Updates

Roles

Sample object for a sidebar action define in MDMS( containing navigationUrl )

Screen Configuration

S.No.

Screen

Configuration

Localization Configuration & Modules

TenantID

Module

Workflow Configuration

Business Service name - “mukta-estimate”. Refer to the MDMS file for workflow businessServices names -
For Workflow related actions, the View screens use two components:
- -> For calling the update API with appropriate workflow action (through the action bar rendered at the bottom of the view screen). This component has all the logic to show actions according to the logged-in user, showing relevant popups and calling the update API to execute an action.
Popups are rendered based on configMap defined in this config file .
- -> To show the workflow history on View screens.

Customisation

Custom Components used in Estimate:

Document Config -
- Based on the , respective documents will be rendered on the Create Screen. Please mention the validations, file type limits and file size limits in this config
NonSOR Table -
- Used in Create Estimate Screen to capture Non-Sor line items.
Overheads Table -
- Used in Create Estimate Screen to capture Overhead items.
Total Estimate Amount -
- Used in Create Estimate Screen to calculate and render Total Estimate Amount.
UploadFileComposer -
- Used in Create Estimate Screen to render document upload section using
Labour and Material Analysis-
- Used in Create Estimate screen to capture labour and material costs. The total labour and material costs cannot be greater than the total Estimate Amount.

Create Estimate Screen:

Use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer to docs for Pre-Process config in Component comments.
UOM and Overheads captured in the create screen are MDMS data.

Inbox / Search Screen:

Use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer to docs for Pre-Process config in Component comments.

All the Inbox and Search screens throughout the app are rendered using this component .

Workorder

Workorder/Contract UI Tech Documentation

Overview

This module has 5 associated screens :

Create
Search
Modify
View
Inbox

MDMS Configurations

Module enablement configuration

Set module code as “Contracts” in Module.js of Contracts Module. Refer https://github.com/egovernments/works-mdms-data/blob/DEV/data/pg/tenant/citymodule.json

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “Contracts”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

Sidebar configuration

Screen configuration

Localization Configuration and Modules

Workflow Configuration

Customization

1. API-based Data -

Name of CBO - This field is being captured on the Create screen and Modify screen. Data for this field comes from the backend.
CBO ID - This field is being set based on the value selected in the Name Of CBO.
Name of Officer In Charge - This field is being populated based on the HRMS Search. Here the role is hardcoded to ‘OFFICER_IN_CHARGE’.
Designation of Officer In Charge - This field is being set based on the value selected in the Name of Officer in charge.
Work Order Amount - This field shows the calculated amount of Total Estimated Cost minus the Overheads which has ‘isWorkOrderValue’ as true. Please refer OverHeads config for Amount calculation.
Role of CBO will be shown based on the calculated Work Order Amount. If the calculated Work Order Amount is less than ‘amount’ in RoleOfCBO Config, show Implementation Agency else show Implementation Partner. This logic will vary based on the updates in the .

2. Custom Components used in Projects :

Document Config -
Based on the , respective documents will be rendered on the Create Screen. Please mention the validations, file type limits and file size limits in this config.
Work Order Terms and Conditions -
This Component will help input description in the table. Users can add and delete the rows. First row won't be deleted, clicking on the delete button will empty the first row. Refer Component - WOTermsAndConditions.

3. Create Screen :

Please use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer docs for Pre-Process config in Component comments.

4. Inbox / Search Screen :

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer docs for Pre-Process config in Component comments.

WageSeeker (CBO Application)

Wageseeker TechDocument

Overview

This module helps create wage seekers.

ROLE: ORG_ADMIN

This module contains 4 linked forms

Individual Details
Address Details
Financial Details
Summary Details

Individual Details

S.No.

Fields

Mandatory

Validations

Aadhaar No.

Yes

Input: [0-9]

Max Length: 12

Min Length: 12

Name

Yes

Input: [A-Za-z ]

Max Length: 128

Min Length: 2

Guardian Name

Yes

Input: [A-Za-z ]

Max Length: 128

Min Length: 2

Relationship

Yes

None

Date of Birth

Yes

Age shouldn’t be less than 18 years

Gender

Yes

None

Social Category

None

Mobile Number

Yes

Input: [0-9]

Max Length: 10

Min Length: 10

Skills

Yes

Can not select multiple skills of same sub skill type

10.

Photograph

File size should be < 5 MB

Address Details

S.No.

Fields

Mandatory

Validations

Pincode

Input: [0-9]

Max Length: 6

Min Length: 6

City

Yes

None

Ward

Yes

None

Locality

Yes

None

Street Name

Max Length: 64

Min Length: 0

Door No

Max Length: 64

Min Length: 0

Financial Details

S.No.

Fields

Mandatory

Validations

Account Holder’s Name

Yes

Input: [A-Za-z ]

Max Length: 128

Min Length: 2

Account Number

Yes

Input: [0-9]

Max Length: 18

Min Length: 9

Re-enter Account Number

Yes

Input: [0-9]

Max Length: 18

Min Length: 9

Account Type

Yes

None

IFSC Code

Yes

Valid IFSC Code

Verified through

https://ifsc.razorpay.com

This form combines the details of the previous 3 forms, and users can tap on the respective edit icon to edit the particular details.

On submit, the wage seeker is created successfully.

API Details

S. no.

API

Body/Query Params

Description

'individual/v1/_create'

"Individual": {

"tenantId":,

"name": {"givenName": ,

"dateOfBirth":,

"gender":,

"mobileNumber":,

"address": [

{

"tenantId":,

"pincode":,

"street":,

"doorNo":,

"type": "PERMANENT",

"locality": {"code":

"fatherName":,

"husbandName":,

"relationship":,

"identifiers": [

{

"identifierType": "AADHAAR",

"identifierId":

}

"skills": [],

"photo":,

"additionalFields": {

"fields": [

{

"key": "SOCIAL_CATEGORY",

"value":

}

]

}

Create Individual/Wage seekers

'/bankaccount-service/bankaccount/v1/_create'

"bankAccounts": [

{

"tenantId":,

"serviceCode": "IND",

"referenceId": individualId,

"bankAccountDetails": [

{

"tenantId":,

"accountHolderName":

"accountNumber":,

"accountType":,

"isPrimary",

"bankBranchIdentifier": {

"type": "IFSC",

"code":,

"additionalDetails": {"ifsccode"}

"isActive": true,

"documents": [],

}

]

To create the bank details for the individual that was created

Muster Roll

Muster Roll UI Tech Documentation

Overview

This module helps in processing muster rolls through the workflow. Muster rolls created from SHG app end up in the web interface for workflow approval.

This module has 5 associated screens :

Inbox
Edit
View
Search

Module enablement configuration

Set module code as "AttendenceMgmt" in Module.js of AttendenceMgmt Module. Refer https://github.com/egovernments/works-mdms-data/blob/DEV/data/pg/tenant/citymodule.json

{
            "module": "AttendenceMgmt",
            "code": "AttendenceMgmt",
            "active": true,
            "order": 4,
            "tenants": [
                {
                    "code": "statea.citytwo"
                },
                {
                    "code": "statea.citythree"
                },
                {
                    "code": "statea.cityone"
                }
            ]
}

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “AttendenceMgmt”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

S.No

API

Action ID

Roles

/muster-roll/v1/_search

MUSTER_ROLL_VERIFIER,MUSTER_ROLL_APPROVER

/muster-roll/v1/_update

MUSTER_ROLL_VERIFIER,MUSTER_ROLL_APPROVER

/egov-pdf/download/musterRoll/muster-roll

104

MUSTER_ROLL_APPROVER,MUSTER_ROLL_VERIFIER

/egov-hrms/employees/_search

EMPLOYEE_COMMON

/expense-calculator/v1/_estimate

108

MUSTER_ROLL_APPROVER,MUSTER_ROLL_VERIFIER

/inbox/v2/_search

EMPLOYEE_COMMON

Sidebar configuration

S.No

Screen

Navigation URL

LeftIcon Updates

Roles

Muster Roll Search

/works-ui/employee/attendencemgmt/search-attendance

dynamic:AttendanceIcon

MUSTER_ROLL_APPROVER,MUSTER_ROLL_VERIFIER

Muster Roll Inbox

/works-ui/employee/attendencemgmt/inbox

dynamic:AttendanceIcon

EMPLOYEE_COMMON

{
      "id": 59,
      "name": "ATTENDENCEMGMT",
      "url": "url",
      "displayName": "ATTENDENCEMGMT Inbox",
      "orderNumber": 2,
      "parentModule": "",
      "enabled": true,
      "serviceCode": "ATTENDENCEMGMT",
      "code": "null",
      "navigationURL": "/works-ui/employee/attendencemgmt/inbox",
      "path": "4ATTENDENCEMGMT.Inbox",
      "leftIcon": "dynamic:AttendanceIcon"
}

Screen configuration

S.No

Screen

Configuration

Inbox

Localization Configuration and Modules

TenantID

Module

statea

rainmaker-attendencemgmt

Workflow Configuration

UI Component Name

Business Service

WorkflowActions

Customization

1. API-based Data -

The amountTotal Wage Amount - Amount shown in the view muster roll screen is fetched from expense-calculator

2. Inbox / Search Screen :

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config that will run through RenderFormFields.
Refer to docs for Pre-Process config in Component comments.

WageSeeker

Wageseeker Tech Document

Overview

This module helps in creating an individual(Wage Seeker) , it is needed in Mukta to assign work, track attendance and process DBTs.

This module has 3 associated screens :

Search
View
Modify

MDMS Configurations

S.No.

Data

MDMS Link

Relationship

GenderType

SocialCategory

WageSeekerSkills

TenantBoundary

Module enablement configuration

Set module code as “Masters” in Module.js for Masters (Organization) Module. Refer CityModule.json

 {
            "module": "Masters",
            "code": "Masters",
            "active": true,
            "order": 6,
            "tenants": [
                {
                    "code": "pg.cityb"
                },
                {
                    "code": "pg.cityc"
                },
                {
                    "code": "pg.citya"
                }
            ]
     }

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “Masters”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

S.No

API

Action ID

Roles

/individual/v1/_search

MUKTA_ADMIN, ORG_ADMIN

/individual/v1/_update

MUKTA_ADMIN, ORG_ADMIN

/individual/v1/_delete

MUKTA_ADMIN, ORG_ADMIN

Sidebar configuration

S.No

Screen

Navigation URL

LeftIcon Updates

Roles

Search Individual

/works-ui/employee/masters/search-wageseeker

dynamic:WageseekerIcon

MUKTA_ADMIN

Sample object for a sidebar action define in MDMS (containing navigationUrl)

{
      "id": 78,
      "name": "WAGESEEKER",
      "url": "url",
      "displayName": "Masters Search Wageseeker",
      "orderNumber": 10,
      "parentModule": "",
      "enabled": true,
      "serviceCode": "WageSeeker",
      "code": "null",
      "navigationURL": "/works-ui/employee/masters/search-wageseeker",
      "path": "8WageSeeker.Search",
      "leftIcon": "dynamic:WageseekerIcon"
    }

Screen configuration

S.No

Screen

Configuration

Create/Modify

Localization Configuration and Modules

TenantID

Module

rainmaker-masters

rainmaker-common-masters

rainmaker-common

pg.citya

rainmaker-pg.citya

Workflow Configuration

Customization

Modify Individual Screen

Please use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer docs for Pre-Process config in Component comments.

Search Individual Screen

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer docs for Pre-Process config in Component comments.
All the Inbox and Search Screens throughout the app are rendered using this component Inbox/Search Composer

Validations added

All Form validations are being added in the Screen Configurations. Add the populators for respective validations and mention the JSON path for the Pre-Process to work.

Delete API Usage

To update individual skills update Individual and delete individual APIs are being used
If skills already exist then those can be updated with update API, if any skills are to be removed then delete API is used, in this case whole skill object need to be send with ‘isDeleted’ flag equals to true.

Attendance (CBO Application)

Overview

This module helps in logging the attendance of each individual in a register and creating the muster roll for a particular week.

ROLE: ORG_ADMIN

This module has 2 associated screens : View Register Inbox Track Attendance Table Screen

MDMS Configurations

S.No.

Data

MDMS Link

AttendanceHours

WageSeekerSkills

CBOMusterSubmission

User actions

On this page, the following actions need to be performed: The CBO Admin needs to select the date range from the Date Picker.

On the Selection of any date from the Picker, the whole week gets selected by default. On Selecting the particular week, and Clicking on Apply, the user can view the pre-saved attendance log for the respective week User can change the attendance log for each individual, And then click on the Save as Draft button to save the attendance log,

The user can submit the muster roll, On Click of submit the muster roll, the user will be asked to fill in the skills for each individual, After filling skills of each individual, the user can submit the muster roll for that particular week

Validations If a Date range is not selected or cleared, the Save as Draft Button will throw an error to select the date range Submission of muster roll depends upon the CBOMusterSubmission MDMS Config

isEndOfWeek && selectedDateRange!.endDate > DateTime.now().millisecondsSinceEpoch


code": "END_OF_WEEK",            "value": "end of week",            "active": false

If END_OF_WEEK is false, the user can create the muster roll on any day of the week, else user can submit the muster roll on or after the last day of the week (i.e. Sunday) If there is an existing muster roll for the selected range, and the muster is in workflow,

Track Attendance page will be a view page, else it will allow to log attendance and submit muster roll Based on the Attendance Hours list, users will be allowed to mark the attendance as Full Day, Half Day, or absent. If the list is of length 2, users will be allowed to mark only Full and Absent, Else, users can mark half-day as well.

API Details

S.No

API

Body / Query Params

Description

attendance/v1/_search

{

"tenantId":””,

"ids":””

}

Gives the list of registers linked to the org

muster-roll/v1/_estimate

{

"musterRoll": {

"tenantId":,

"registerId":,

"startDate":,

"endDate":

}

To get the attendance log for the selected Date range

attendance/log/v1/_create

{"attendance": []}

To log the attendance of the individuals for the week

attendance/log/v1/_update

To update the attendance log of the individuals for Sent Back To CBO Muster Rolls

muster-roll/v1/_search

To check if any existing muster rolls present for the selected week

egov-workflow-v2/egov-wf/businessservice/_search

{

"tenantId":,

"businessServices": “musterRollId”,

}

To check the workflow status of the Muster Roll

Sidebar configuration

DIGIT Components and Custom Components Used

S.No

Component

Path

Description

DigitTable

Custom Table with fixed first column and other columns scrollable

DropDownDialog

A dialog with dropdown options

DateRangePicker

A custom Date Range picker to select a range of the month / year

DigitElevatedButton

An Elevated Submit Button

WorkDetailsCard

Details Card based on DIGIT Figma design

Localization Configuration and Modules

TenantID

Module

rainmaker-common

rainmaker-attendance

rainmaker-common-masters

rainmaker-workflow

pg.citya

rainmaker-pg.citya

Reference Files/Links

Blocs :

Models :

Repositories:

Screens

Bill

Overview

This module is used to handle all billing-related actions such as create, update and view Bills.

This module has 5 associated screens :

Create (Purchase Bill)
Search
View (Wage, Purchase, Supervision)
Modify (Purchase Bill)
Download Bills

MDMS Configurations

S.No.

Data

MDMS Link

BillType

TenantBoundary

Module enablement configuration

Set module code as “Expenditure” in Module.js for Billing Module. Refer CityModule.json

{
            "module": "Expenditure",
            "code": "Expenditure",
            "active": true,
            "order": 7,
            "tenants": [
                {
                    "code": "pg.cityb"
                },
                {
                    "code": "pg.cityc"
                },
                {
                    "code": "pg.citya"
                }
            ]
        }

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “Expenditure”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

S.No

API

Action ID

Roles

/expense-calculator/purchase/v1/_createbill

112

BILL_CREATOR

/expense-calculator/v1/_search

113

BILL_CREATOR BILL_VERIFIER BILL_VIEWER BILL_ACCOUNTANT

/expense/bill/v1/_search

106

BILL_CREATOR BILL_VERIFIER BILL_APPROVER BILL_ACCOUNTANT

/wms/expense/_search

110

BILL_CREATOR BILL_VERIFIER BILL_APPROVER BILL_ACCOUNTANT

/expense/payment/v1/_create

116

BILL_ACCOUNTANT

/egov-pdf/bill/_search

114

BILL_CREATOR

/expense/payment/v1/_search

122

BILL_ACCOUNTANT

/expense/payment/v1/_update

125

BILL_ACCOUNTANT

Sidebar configuration

S.No

Screen

Navigation URL

LeftIcon Updates

Roles

Search Bills

/works-ui/employee/expenditure/search-bill

dynamic:ExpenditureIcon

BILL_VIEWER

Sample object for a sidebar action define in MDMS (containing navigationUrl)

{
      "id": 56,
      "name": "BILLS",
      "url": "url",
      "displayName": "Bill Search",
      "orderNumber": 2,
      "parentModule": "",
      "enabled": true,
      "serviceCode": "BILLS",
      "code": "null",
      "navigationURL": "/works-ui/employee/expenditure/search-bill",
      "path": "BILLS.BillSearch",
      "leftIcon": "dynamic:ExpenditureIcon"
    }

Screen configuration

S.No

Screen

Configuration

Create/Modify Purchase bill

Localization Configuration and Modules

TenantID

Module

rainmaker-expenditure

rainmaker-common

rainmaker-common-masters

rainmaker-workflow

pg.citya

rainmaker-pg.citya

Workflow Configuration

Customization

Create Purchase Bill Screen

Please use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config which will run through FormComposer.
Refer docs for Pre-Process config in Component comments.

Search Bill Screen

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config which will run through RenderFormFields.
Refer docs for Pre-Process config in Component comments.
All the Inbox and Search Screens throughout the app are rendered using this component Inbox/Search Composer
Checkbox selection is added to results table displayed in search screen based on search config passed via MDMS

Download Bill Screen

DownloadBillConfig is used to render table to show bills where download link is provided to download respective bills

Organization

Organization Tech Document

This module helps in creating an organization which are business functions that work with ULB to execute projects. These can be typical contractors, SHGs or material vendors. All of them are registered under the same Organization Master.

This module has 4 associated screens :

Create
Search
View
Modify

MDMS Configurations

S.No.

Data

MDMS Link

OrgType

OrgFunctionCategory

OrgFunctionClass

OrgTaxIdentifier

BankAccType

OrgTransferCode

TenantBoundary

Module enablement configuration

Set module code as “Masters” in Module.js for Masters (Organization) Module. Refer CityModule.json

 {
            "module": "Masters",
            "code": "Masters",
            "active": true,
            "order": 6,
            "tenants": [
                {
                    "code": "pg.cityb"
                },
                {
                    "code": "pg.cityc"
                },
                {
                    "code": "pg.citya"
                }
            ]
     }

Enable Module in App.js. Update the object ‘enabledModules’. Use the code “Masters”. This code should match with the code of the cityModule.json, mentioned above.

Role-action mapping

S.No

API

Action ID

Roles

/org-services/organisation/v1/_create

100

MUKTA_ADMIN

/org-services/organisation/v1/_search

MUKTA_ADMIN, ORG_ADMIN, WORK_ORDER_CREATOR

/org-services/organisation/v1/_update

101

MUKTA_ADMIN

Sidebar configuration

S.No

Screen

Navigation URL

LeftIcon Updates

Roles

Create Organisation

/works-ui/employee/masters/create-organization

dynamic:OrganisationIcon

MUKTA_ADMIN

Search Organisation

/works-ui/employee/masters/search-organization

dynamic:OrganisationIcon

MUKTA_ADMIN

Screen configuration

S.No

Screen

Configuration

Create/Modify

Localization Configuration and Modules

TenantID

Module

rainmaker-masters

rainmaker-common-masters

rainmaker-common

pg.citya

rainmaker-pg.citya

Workflow Configuration

Customization

Custom Components used

TransferCodeTable -

This component is a common component used to show Tax identifiers and Transfer Codes input options in the ‘Financial Details’ section in Create screen
Dropdown options for tax identifiers and transfer codes are populated by MDMS data
Used can select type via dropdown and value needs to be entered for the corresponding type
Users can add and delete rows for tax identifiers since there can be multiple identifiers. First row won't be deleted.
Refer Component: TransferCodeComponent

2. Create Organization Screen

Please use the common Utility “PreProcessMDMSConfig”.
Pass the associated dependencies for the config.
The utility will return a config that will run through FormComposer.
Refer to docs for Pre-Process config in Component comments.
Tax Identifiers and Transfer Codes are MDMS data.

3. Search Organization Screen

Please use the common utility “preProcessMDMSConfigInboxSearch”.
Pass the associated dependencies for the config.
The utility will return a config that will run through RenderFormFields.
Refer to docs for Pre-Process config in Component comments.
All the Inbox and Search Screens throughout the app are rendered using this component Inbox/Search Composer
Validations added
All Form validations are being added in the Screen Configurations. Add the populators for respective validations and mention the JSON path for the Pre-Process to work.
IFSC code has 2 validations as below

Pattern validation (given in config)
Third-party API is being used to get band and branch name based on entered valid IFSC code, This API throws 404 if the code is not valid, in that case the valid error message is displayed below the input field
Tax identifiers are not mandatory while creating Organisation. But as per API implementation, it's required in payload hence we send a dummy identifier value if the user has not entered anything in Tax identifier input. In the View Organisation screen if the PAN value is above the dummy value then ‘NA’ is displayed on the screen.

Default value: Type => PAN, Value => XXXXX0123X

Contract Workflow

User should be able to create → Forward (or) check → Forward/Reject a contract.

Contracts will be created by contract_creator, Checked by contract_checker and approver by contract_approver. This will be linear workflow and rejected contracts at any point in lifecycle will come into inbox of creator.
Contracts counters on Home Screen will increase/decrease as the inbox items for checkers and approvers increase/decrease respectively.
Actions menu on view page of Work orders should have actions to be taken by respective Actors
For Work Orders (Non-Departmental)
1. WO is created by JE, Approved by ME. Checkers in between depends on Implementation and can vary from ULB to ULB
2. Approved WO goes into Work Order inbox of respective organisation.
3. Organisation can either accept or reject.
4. Rejected Work Orders will come back into inbox of creator and cycle repeats
For Work Orders (Departmental)
1. WO is created by JE, Approved by ME. Checkers in between depends on Implementation and can vary from ULB to ULB
2. Approved WO goes into Work Order inbox of respective organisation.
3. Organisation can either accept or reject.
4. Rejected Work Orders will come back into inbox of creator and cycle repeats
For Purchase Orders
1. PO is created by JE, Approved by ME. Checkers in between depends on Implementation and can vary from ULB to ULB. An Infra expert can be assigned to check PO.
2. Approved PO goes as SMS to registered Vendor
3. Vendor can click on the PO link & download approved PO’s PDF.

Once the Estimate are created they will move to the respective checker and approver's inbox as pending items.

View Contract

From Contract Proposal Inbox, User can come into Contract View Screen where Details of Contract present while creating the contract and Workflow history will be displayed.
User can take necessary actions by clicking on Actions Menu.

Taking Actions on Contract

An Action bar on the View Contract Screen shows the list of actions

Forward Contract
Reject Contract
Modify Contract
Approve Contract

When any action is clicked respective popup is rendered according to the selected action. We have created three popups for approve, forward and reject. They are shown below

When these popups are submitted, Update Contract API is called containing the relevant updates in the workflow object contained in the request body. The contract service internally calls the workflow service and updates the status of the application.

Response Screen

Upon successful update, a response screen is displayed as follows

Create Estimate

Create an Estimate Proposal

Add Module MDMS (Master Data Management Service) Configuration

When creating a works module, the module needs to be enabled in citymodule.json.Add the Following details in citymodule.json

{
    "tenantId": "pb",
    "moduleName": "tenant",
    "citymodule": [
        {
            "module": "Works",
            "code": "Works",
            "active": true,
            "order": 1,
            "tenants": [
                {
                    "code": "pb.jalandhar"
                },
                {
                    "code": "pb.nawanshahr"
                },
                {
                    "code": "pb.amritsar"
                }
            ]
        }
}

Estimate Creator will have link to create estimate from estimate inbox screen.

Clicking on this will open create estimate screen.

Add create Estimate mdms config

Add the following MDMS config to fetch the values of different dropdown filed of create estimate

MDMS config for Depatment
{
    tenant,   //pb
    "common-masters",
        [
            {
                "name": "Department"
            }
        ]
}

MDMS config for Beneficiary Type, Entrustment Mode, Nature Of Work, Type Of Work
{
     tenant,    //pb
        "works",
        [
            {
                "name": "BeneficiaryType"
            },
            {
                "name": "EntrustmentMode"
            },
            {
                "name": "NatureOfWork"
            },
            {
                "name": "TypeOfWork"
            },
        ]
}

MDMS config for Scheme, Budget Head, Functions, Fund
{
    tenant,
        "finance",
        [
            {
                "name": "Scheme"
            },
            {
                "name": "BudgetHead"
            },
            {
                "name": "Functions"
            },
            {
                "name": "Fund"
            }
        ]
}

MDMS config for location
{
    tenantId,  //pb.amritsar || pb.jalandhar etc.
        "egov-location",
        [
            {
                "name": "TenantBoundary"
            },
        ]
}

Once the above details are filled, user needs to forward estimate to concerned department and official for checking. Forwarding is considered as part of estimate creation.Fill in the details and click “Forward Estimate”.

Each Work detail will be referred to as Sub-Estimate & sub Estimate will back track to all details of Estimate as-is. At least 1 Sub-Estimate has to be created to create an Estimate. Sum of All Amounts of Sub-Estimates is the Estimate Amount.

Once Create Estimate API call is successful, an acknowledgement screen is shown.

API Call Roll action-mapping

API

Action Id

Roles

/estimate-service/estimate/v1/_create

EST_CREATOR

Sample Curl for Create API

jcurl 'https://works-dev.digit.org/estimate-service/estimate/v1/_create' \
  -H 'authority: works-dev.digit.org' \
  -H 'accept: application/json, text/plain, */*' \
  -H 'accept-language: en-US,en;q=0.9' \
  -H 'content-type: application/json;charset=UTF-8' \
  -H 'origin: https://works-dev.digit.org' \
  -H 'referer: https://works-dev.digit.org/works-ui/employee/works/create-estimate' \
  -H 'sec-ch-ua: "Google Chrome";v="107", "Chromium";v="107", "Not=A?Brand";v="24"' \
  -H 'sec-ch-ua-mobile: ?0' \
  -H 'sec-ch-ua-platform: "Linux"' \
  -H 'sec-fetch-dest: empty' \
  -H 'sec-fetch-mode: cors' \
  -H 'sec-fetch-site: same-origin' \
  -H 'user-agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36' \
  --data-raw '{
        "estimate": {
            "tenantId":"pb.amritsar",
            "status":"ACTIVE",
            "estimateStatus":"ACTIVE",
            "subject":"Construct new schools",
            "requirementNumber":"78960",
            "description":"Construct new schools",
            "department":"DEPT_3",
            "location":"pb.amritsar:ADMIN:pb.amritsar:Z1:B3:SUN08",
            "workCategory":"Engineering",
            "beneficiaryType":"Minority",
            "natureOfWork":"Operation & Maintenance",
            "typeOfWork":"Road",
            "subTypeOfWork":"RD02",
            "entrustmentMode":"Nomination",
            "fund":"01",
            "function":"0006",
            "budgetHead":"02",
            "scheme":"AMRUT",
            "subScheme":"AMRUT-01",
            "estimateDetails":[{
                "name":"Amrut Yojana",
                "amount":"90876"
            }],
            "additionalDetails":{
            "formData":{},
            "createdBy":"Est Super User",
            "owner":"Est Super User",
            },
        "workflow":{
            "action":"CREATE",
            "comment":"",
            "assignees":["88bd1b70-dd6d-45f7-bcf7-5aa7a6fae7d9"]
        },
        "RequestInfo":{
            "apiId":"Rainmaker",
            "authToken":"153c3161-55ce-4485-96fa-f67ea9757eea",
            "userInfo":{
                "id":110,
                "uuid":"c8d0093a-4d2b-495f-8bdf-fd9d3594e43f",
                "userName":"EST_SUPER",
                "name":"Est Super User",
                "mobileNumber":"9876543210",
                "emailId":"",
                "locale":null,
                "type":"EMPLOYEE",
                "roles":[{
                    "name":"Employee",
                    "code":"EMPLOYEE",
                    "tenantId":"pb.amritsar"
                    },{
                    "name":"EST CREATOR",
                    "code":"EST_CREATOR",
                    "tenantId":"pb.amritsar"
                }],
                "active":true,
                "tenantId":"pb.amritsar",
                "permanentCity":null
            },
        "msgId":"1667826119526|en_IN",
        "plainAccessRequest":{}
        }
    }'

Some of the dropdown data is fetched from mdms and hrms search API

PageComponent

Data Source

API

Executing Department

mdms

{

tenant,

"common-masters",

[ { "name": "Department" } ]

}

Ward, Location

mdms

{

"pb.amritsar",

"egov-location",

[ { "name": "TenantBoundary" }]

}

Beneficiary, Nature of Work, Type of Work

mdms

{

"pb,

"works",

[ { "name": "BeneficiaryType" },

{ "name": "EntrustmentMode" },

{ "name": "NatureOfWork" },

{ "name": "TypeOfWork" }, ]

}

Fund, Function, Budget Head,Scheme, subSchem

mdms

{

"pb",

"finance",

[ { "name": "BudgetHead" },

{ "name": "Functions" },

{ "name": "Fund" },

{ "name": "Scheme"} ]

}

Designation of officer in charge

hrms

/egov-hrms/employees/_search

Name of officer in charge

hrms

/egov-hrms/employees/_search

Localization keys are added under the ‘rainmaker-works’ locale module. In future if any new labels are implemented in works module that should also be pushed in the locale DB under rainmaker-works locale module. Below is the example of few locale labels for hindi and English.

{
    "code":"ACTION_TEST_CREATE_ESTIMATE",
    "message":"अनुमान बनाएँ",
    "module":"rainmaker-works",
    "locale":"hi_IN"
}

{
    "code":"ACTION_TEST_CREATE_ESTIMATE",
    "message":"Create Estimate",
    "module":"rainmaker-works",
    "locale":"en_IN"
}

Roles - Action

Role

Actions

Creator (EST_CREATOR)

Create/Edit(Rejected) Estimate and Forawrded

Checket1 (EST_CHECKER)

Checked Estimate and Forwarded

Checker2 (EST_TECH_SANC)

Checked Estimate and Forwarded

Admin Approver (EST_ADMIN_SANC)

Approved Estimate

Inbox

Inbox screen for Attendance Management Module

Overview:

Lists all the musters submitted by SHG
To search/filter the muster list based on various criteria
To navigate to Muster details/View Attendance page

Workflow Details

The employee home screen will have a link to navigate to the Attendance Inbox screen

The inbox screen consists of a list of muster rolls created/submitted by SHG in tabular format. This table supports pagination and the number of records displayed per page can be editable

A minimum of 1 search criterion is required based on which the list will be populated with search results. Search parameters are as below:

Name of the work
Implementing Agency/Partner

This list can be filtered based on below parameters:

Date range
Muster roll status

A ‘No results found’ message is displayed if no records are found for the given search/filter criteria.

Both search and filter criteria can be cleared using the ‘Clear Search’ and ‘refresh’ buttons respectively. Muster Roll ID is a clickable link that navigates the user to the View Attendance screen (Muster Details).

Technical Implementation Details

Inbox screen technical implementation can be found in the file below.

Hooks used

To fetch inbox details, ‘useCustomAPIHook’ is used which takes all the API details like URL, query params and body from config (defined in MDMS).

To fetch inbox config, ‘useCustomMDMS’ hook is used which takes the module name, master details and config.

APIs used

Endpoint:

/inbox/v2/_search

Sample curl for Inbox API:

curl --location --request POST 'https://works-dev.digit.org/inbox/v2/_search' \
--header 'Content-Type: application/json' \
--data-raw '{
    "RequestInfo": {
        "ts": 0,
        "action": "string",
        "key": "string",
        "msgId": "string",
        "authToken": "ea4069c7-c2a8-4def-a216-ce67352f980d",
        "userInfo": {
            "id": 107,
            "uuid": "c8d0093a-4d2b-495f-8bdf-fd9d3594e43f",
            "userName": "super",
            "name": "Super User",
            "mobileNumber": "1234567890",
            "emailId": null,
            "type": "EMPLOYEE",
            "roles": [
                {
                    "name": "SUPER USER",
                    "code": "SUPERUSER",
                    "tenantId": "pb"
                }
            ],
            "tenantId": "pb.amritsar"
        }
    },
    "inbox": {
        "tenantId": "pb.amritsar",
        "processSearchCriteria": {
            "tenantId": "pb.amritsar",
            "businessService": [
                "muster-roll-approval"
            ],
            "moduleName": "muster-roll-service"
        },
        "moduleSearchCriteria": {
            "tenantId":"pb.amritsar",
            "attendanceRegisterName":"Construct Roads",
            "musterRollStatus":"SUBMITTED",
            "startDate":1670178600000,
            "endDate":1670697000000
        },
        "limit": 10,
        "offset": 0
    }
}'

MDMS Used

Inbox screen config is fetched from MDMS using 'useCustomMDMS' hook.

const { isLoading, data } = Digit.Hooks.useCustomMDMS(
        tenant,
        "commonUiConfig",
        [
            {
                "name": "musterInboxConfig"
            }
        ]
    )

Localisation

Localisation keys are added under the ‘rainmaker-attendencemgmt’ locale module. In future, if any new labels are implemented in the attendance module they should be pushed to the locale DB under rainmaker-attendencemgmt locale module. Below is an example of a few locale labels for Hindi and English.

{
    "code": "ATM_ACTUAL_WORKING_DAYS",
    "message": "वास्तविक कार्य दिवस",
    "module": "rainmaker-attendencemgmt",
    "locale": "hi_IN"
}
{
    "code": "ATM_ACTUAL_WORKING_DAYS",
    "message": "Actual Working Days",
    "module": "rainmaker-attendencemgmt",
    "locale": "en_IN"
}

Customisation

The content on this screen is rendered based on configuration passed via MDMS. Its implementation can be found in the below file.

API Role Action Mapping

API

Role Code

Action Id

Actions

/inbox/v2/_search

JUNIOR_ENGINEER

View inbox for Muster Rolls

/inbox/v2/_search

MUNICIPAL_ENGINEER

View inbox for Muster Rolls

Estimate Worflow

User should be able to create → Forward (or) check → Forward/Reject an estimate.

Once the Estimate are created they will move to the respective checker and approver's inbox as pending items.

View Estimate

From Estimate Proposal Inbox, User can come into Estimate View Screen where Details of Estimate present while creating the estimate and Workflow history will be displayed.
User can take necessary actions by clicking on Actions Menu.

Sample ProcessInstance Worflow Object as given below:

{
    "RequestInfo": {
        "apiId": "estimate-service",
        "action": "",
        "did": 1,
        "key": "",
        "msgId": "20170310130900|en_IN",
        "requesterId": "",
        "ts": 1513579888683,
        "ver": "1.0.0",
        "authToken": "94ecb06f-8e5b-4798-af8f-56a987560209",
        "userInfo":{
            "uuid":"7e46e32c-187c-4fb4-9d6b-1ac70fa8f011"
        }
    },
    "BusinessServices": [
        {
            "tenantId": "pb",
            "businessService": "estimate-approval-2",
            "business": "estimate-service",
            "businessServiceSla": 432000000,
            "states": [
                {
                    "sla": null,
                    "state": null,
                    "applicationStatus": null,
                    "docUploadRequired": false,
                    "isStartState": true,
                    "isTerminateState": false,
                    "isStateUpdatable": true,
                    "actions": [
                        {
                            "action": "CREATE",
                            "nextState": "CREATED",
                            "roles": [
                                "EST_CREATOR"
                            ]
                        }
                    ]
                },
                {
                    "sla": null,
                    "state": "CREATED",
                    "applicationStatus": "CREATED",
                    "docUploadRequired": false,
                    "isStartState": true,
                    "isTerminateState": false,
                    "isStateUpdatable": true,
                    "actions": [
                        {
                            "action": "CHECK",
                            "nextState": "CHECKED",
                            "roles": [
                                "EST_CHECKER"
                            ]
                        },
                        {
                            "action": "REJECT",
                            "nextState": "REJECTED",
                            "roles": [
                                "EST_CHECKER"
                            ]
                        }
                    ]
                },
                {
                    "sla": null,
                    "state": "CHECKED",
                    "applicationStatus": "CHECKED",
                    "docUploadRequired": false,
                    "isStartState": false,
                    "isTerminateState": false,
                    "isStateUpdatable": true,
                    "actions": [
                        {
                            "action": "TECHNICALSANCATION",
                            "nextState": "TECHNICALSANCATIONDONE",
                            "roles": [
                                "EST_TECH_SANC"
                            ]
                        },
                        {
                            "action": "REJECT",
                            "nextState": "REJECTED",
                            "roles": [
                                "EST_TECH_SANC"
                            ]
                        }
                    ]
                },
                {
                    "sla": null,
                    "state": "TECHNICALSANCATIONDONE",
                    "applicationStatus": "TECHNICALSANCATIONDONE",
                    "docUploadRequired": false,
                    "isStartState": false,
                    "isTerminateState": false,
                    "isStateUpdatable": true,
                    "actions": [
                        {
                            "action": "ADMINSANCTION",
                            "nextState": "APPROVED",
                            "roles": [
                                "EST_ADMIN_SANC"
                            ]
                        },
                        {
                            "action": "REJECT",
                            "nextState": "REJECTED",
                            "roles": [
                                "EST_ADMIN_SANC"
                            ]
                        }
                    ]
                },
                {
                    "sla": null,
                    "state": "REJECTED",
                    "applicationStatus": "REJECTED",
                    "docUploadRequired": false,
                    "isStartState": false,
                    "isTerminateState": false,
                    "isStateUpdatable": true,
                    "actions": [
                        {
                            "action": "EDIT",
                            "nextState": "CREATED",
                            "roles": [
                                "EST_CREATOR"
                            ]
                        }
                    ]
                },
                {
                    "sla": null,
                    "state": "APPROVED",
                    "applicationStatus": "APPROVED",
                    "docUploadRequired": false,
                    "isStartState": false,
                    "isTerminateState": true,
                    "isStateUpdatable": false,
                    "actions": null
                }
            ]
        }
    ]
}

Sample Curl to fetch ProcessInstance

curl 'https://works-dev.digit.org/estimate-service/estimate/v1/_search?tenantId=pb.amritsar&department=DEPT_1&typeofwork=Road&fromProposalDate=1667241000000&toProposalDate=1667845799000&limit=10&sortBy=department&sortOrder=DESC&_=1667829358481' \
  -H 'authority: works-dev.digit.org' \
  -H 'accept: application/json, text/plain, */*' \
  -H 'accept-language: en-US,en;q=0.9' \
  -H 'content-type: application/json;charset=UTF-8' \
  -H 'origin: https://works-dev.digit.org' \
  -H 'referer: https://works-dev.digit.org/works-ui/employee/works/search-Estimate' \
  -H 'sec-ch-ua: "Google Chrome";v="107", "Chromium";v="107", "Not=A?Brand";v="24"' \
  -H 'sec-ch-ua-mobile: ?0' \
  -H 'sec-ch-ua-platform: "Linux"' \
  -H 'sec-fetch-dest: empty' \
  -H 'sec-fetch-mode: cors' \
  -H 'sec-fetch-site: same-origin' \
  -H 'user-agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36' \
  --data-raw '{
    "RequestInfo":{
      "apiId":"Rainmaker",
      "authToken":"153c3161-55ce-4485-96fa-f67ea9757eea",
      "msgId":"1667829358480|en_IN",
      "plainAccessRequest":{}
    }
  }'

Taking Actions on Estimate

An Action bar on the View Estimate Screen shows the list of actions

Forward Estimate
Reject Estimate
Modify Estimate
Approve Estimate

When any action is clicked respective popup is rendered according to the selected action. We have created three popups for approve, forward and reject. They are shown below

When these popups are submitted, Update Estimate API is called containing the relevant updates in the workflow object contained in request body. Estimate service internally calls the workflow service and updates the status of application.

Sample curl for Update Estimate

curl 'http://localhost:3000/estimate-service/estimate/v1/_update' \
  -H 'Accept: application/json, text/plain, */*' \
  -H 'Accept-Language: en-US,en;q=0.9' \
  -H 'Connection: keep-alive' \
  -H 'Content-Type: application/json;charset=UTF-8' \
  -H 'Origin: http://localhost:3000' \
  -H 'Referer: http://localhost:3000/works-ui/employee/works/view-estimate?tenantId=pb.amritsar&estimateNumber=EP/2022-23/11/000143&department=DEPT_1' \
  -H 'Sec-Fetch-Dest: empty' \
  -H 'Sec-Fetch-Mode: cors' \
  -H 'Sec-Fetch-Site: same-origin' \
  -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36' \
  -H 'sec-ch-ua: "Google Chrome";v="107", "Chromium";v="107", "Not=A?Brand";v="24"' \
  -H 'sec-ch-ua-mobile: ?0' \
  -H 'sec-ch-ua-platform: "Linux"' \
  --data-raw '{
      "estimate":{
          "id":"e9d1e26c-7231-4fad-97f0-297dab173c23",
          "tenantId":"pb.amritsar",
          "estimateNumber":"EP/2022-23/11/000143",
          "adminSanctionNumber":null,
          "proposalDate":1667824800917,
          "status":"ACTIVE",
          "estimateStatus":"CREATED",
          "subject":"Construct new schools",
          "requirementNumber":"88888999",
          "description":"Construct new schools",
          "department":"DEPT_1",
          "location":"pb.amritsar:ADMIN:pb.amritsar:Z1:B2:SUN40",
          "workCategory":"Engineering",
          "beneficiaryType":"SC",
          "natureOfWork":"Operation & Maintenance",
          "typeOfWork":"Road",
          "subTypeOfWork":"RD01",
          "entrustmentMode":"e-Procurement",
          "fund":"02",
          "function":"0003",
          "budgetHead":"03",
          "scheme":"AMRUT",
          "subScheme":"AMRUT-01",
          "totalAmount":null,
          "estimateDetails":[{
              "id":"4cbef8e4-aa3c-4c93-a954-a94f04ea8c96",
              "estimateDetailNumber":"EP/2022-23/11/000143/000124",
              "name":"Amrut Yojana",
              "amount":98760,
              "additionalDetails":null
          }],
          "auditDetails":{
              "createdBy":"c8d0093a-4d2b-495f-8bdf-fd9d3594e43f",
              "lastModifiedBy":"c8d0093a-4d2b-495f-8bdf-fd9d3594e43f",
              "createdTime":1667824800916,
              "lastModifiedTime":1667824800916
          },
          "additionalDetails":{
              "owner":"Est Super User",
              "formData":{},
              "createdBy":"Est Super User",
              "filesAttached":[]
          }
      },
      "workflow":{
              "action":"CHECK",
              "comment":"Okay",
              "assignees":["c8d0093a-4d2b-495f-8bdf-fd9d3594e43f"]
      },
      "RequestInfo":{
              "apiId":"Rainmaker",
              "authToken":"153c3161-55ce-4485-96fa-f67ea9757eea",
              "userInfo":{
                  "id":110,
                  "uuid":"c8d0093a-4d2b-495f-8bdf-fd9d3594e43f",
                  "userName":"EST_SUPER",
                  "name":"Est Super User",
                  "mobileNumber":"9876543210",
                  "emailId":"",
                  "locale":null,
                  "type":"EMPLOYEE",
                  "roles":[
                      {
                      "name":"Employee",
                      "code":"EMPLOYEE",
                      "tenantId":"pb.amritsar"
                      },{
                      "name":"EST_CHECKER",
                      "code":"EST_CHECKER",
                      "tenantId":"pb.amritsar"
                      },{
                      "name":"EST TECH SANC",
                      "code":"EST_TECH_SANC",
                      "tenantId":"pb.amritsar"
                      },{
                      "name":"EST FIN SANC",
                      "code":"EST_FIN_SANC",
                      "tenantId":"pb.amritsar"
                      }
                  ],
                  "active":true,
                  "tenantId":"pb.amritsar",
                  "permanentCity":null
              },
          "msgId":"1667833964561|en_IN","plainAccessRequest":{}
      }
      }'

Users must have the respective roles for taking actions on the Estimate, Otherwise the Action Bar will not be visible. And users can only take actions on the applications assigned to them.

Response Screen

Upon successful update a response screen is displayed as follows

Role-Action Mapping

Role

Action

EST_CHECKER

CHECK (Check and Forward) / REJECT

EST_TECH_SANC

TECHNICALSANCTION (Check and Forward) / REJECT

EST_ADMIN_SANC

ADMINSANCTION (Approve) / REJECT

Modify Attendance

Screen to update muster roll status based on different roles

Objective: To view and modify the attendance days and perform various actions like verify, reject and approve based on roles.

Workflow Details

Users can navigate to this screen by clicking on the muster roll id on the inbox page.

Initially, the muster has 'Submitted' status. Junior Engineer can view, Edit, Verify and Reject the Attendance.

Verify: Clicking on the ‘Verify’ action button verifies the existing muster and the user is redirected to the success page
Edit: Clicking on the ‘Edit’ action button displays the extra details in the table. The working days can be edited. Based on that ‘Modified Amount’ is updated dynamically.
As soon as the user updates anything ‘Action’ button changes to the ‘Save’ button. On click of Save, muster is verified with updated details and the user is redirected to the success page.
Reject: Clicking on the ‘Reject’ action displays a popup where the user can provide any comments and reject the muster.
On 'Confirm Reject', muster will be rejected and the user will be redirected to the success page.

The municipal Engineer can view, Approve, and Reject the attendance which is verified by Junior Engineer

Approve: Clicking on the ‘Approve action displays a popup where the user can provide any comments and approve the muster.
On 'Approve Attendance', the muster will be approved and the user will be redirected to the success page.
The municipal Engineer can also reject the attendance verified by Jr Engineer by clicking on the 'Reject' action.

Technical Implementation Details

Modify attendance technical implementation where all actions are handled can be found in the below file.

Hooks used

To update muster (modify, verify, reject, approve, resubmit), ‘useUpdateAttendance’ is used which updated muster roll details.

APIs used

Endpoint:

Sample curl for Update muster API:

MDMS Used

Wage seeker skills data is fetched from MDMS using 'getMultipleTypesWithFilter' service.

Localisation

Localisation keys are added under the ‘rainmaker-attendencemgmt’ locale module. In future, if any new labels are implemented in the attendance module they should also be pushed in the locale DB under rainmaker-attendencemgmt locale module. Below is an example of a few locale labels for Hindi and English.

Customisation

The content on this screen is rendered based on the configuration passed on ApplicationDetails template component. Its implementation can be found in the below file.