View Property Details
Objective:
View Property Details page created to display the details of the successfully created Property record. Properties created can be traced by their unique Property ID number. Property details page displays data entered while creating property, operations performed on the file, assessment information, payment dues, workflow information etc.
It also has download and print options where users can download or print the Application details in PDF format.
Technical Implementation Details:
View Property Details page uses a React Class component written in egov-ui-kit module. Below is the file link.
Employee application and citizen application both refers to this component to display property details information. User navigates to this page by providing PropertyID and TenantID in the Navigation url as parameters.
path: "property-tax/property/:propertyId/:tenantId"
When the user landed to this page, PropertyID and TenantID extracted from query params and supplied them to the fetchProperties function to get the property data.
Property component is a class based component and connected to redux. fetchProperties method is a redux action method. It sends the property details data to the reducer and reducer sets the data in states and returns the state. States are mapped to the props so the property details data captured in the props of the component.
Property details data received through captured in the props will be formatted into various formats via utility functions. After formatting these data, it will be supplied to the rendered component.
Property component renders two main components inside its render block.
<PTHeader />
<AssessmentList />
PTHeader: To display header data of the Property details page. Below is the file lik.
AssessmentList: To display the details of the property. Below is the file link.
It also renders footer buttons, EDIT Property and ASSESS Property. These footer buttons are configurable.
API Call Details:
After fetching properties, few more apis are called. Below is the details of such api calls.
fetchAssessments: This api returns the total no of assessment performed on the Property and the details about each assessment.
fetchReceipt: This api returns the receipt details related to the Property so that user can download or print it.
fetchTotalBillAmount: This api returns the data related to the total Bill amount to be paid by the user. It gives the complete breakup bill details that we are showing in the Estimate card component.
MDMS Call Details:
We have one MDMS call that returns the dropdown details used while creating the Property Tax file. This Dropdown details we are mapping to the dropdown keys present in Property data so that we display the meaningful information on the details page.
Localization Implementation:
This page uses the locales from the following locale module.
Rainmaker-common
Rainmaker-pt
Rainmaker-pgr
TenantID specific locale
While navigating to the details page; at the route authentication phase all the required locale calls are made and the data stored in localStorage.
While initializing the details page; locale keys from the localStorage are stored in the local variable in the component.
While formatting property data for each section, we are mapping these locale keys to their respective data.
getTranslatedLabel: This method is responsible for localization of labels. It accepts the label keys and localization keys as parameters and returns the translated label. This function is written at framework level and is being used across application.
Transfer Ownership
Objective:
Transfer ownership operation is responsible for transferring the property to another person. Property mutation flow starts from transfer ownership operation.
This operation checks below two conditions.
If the Total Due amount is more than zero then a notification popup opens up stating that the total dues amount with PROCEED TO PAY option. Once user clicks on the PROCEED TO PAY button it navigates to the common pay screen where user makes the payment.
If the Total Dues amount is zero then after clicking on TRANSFER OWNERSHIP button then user navigates to Mutation screens.
Technical Implementation Details:
TRANSFER OWNERSHIP is a component which is rendered by OwenerInfo card component.
Pending Amount Due popup is also a component rendered by OwnerInfo card component.
OwnerInfo card component file path:
Transfer Ownership button component file path:
Pending Amount Due dialog component file path:
API Call details:
No API call made.
MDMS Call Details:
No MDMS call made.
Localization Implementation:
This component uses the locale keys available in the rainmaker-pt locale module. For example:
{
"code": "PT_PENDING_AMOUNT_DUE",
"message": "Pending Amount Due",
"module": "rainmaker-pt",
"locale": "en_IN"
},
View History
Objective:
View history operation shows the details about the property being transferred to the owners. When property is created it adds the owner information from the create property details. When the same property is transferred to the different owners by doing TRANSFER OWNERSHIP operation, It adds the owner details to whom the property was transferred.
View History is a popup which opens when the user clicks on the VIEW HISTORY button. It shows Ownership History of the property.
Technical Implementation Details:
VIEW HISTORY is a component which is rendered by OwenerInfo card component.
OWNER HISTORY is a popup screen which is rendered by OwnerInfo card component.
OwnerInfo card component file path:
View History button component file path:
Owner History Dialog component file path:
Localization Implementation:
It uses rainmaker-pt locale module to show translated labels. For example:
{
"code": "PT_OWNER_HISTORY",
"message": "OWNER HISTORY",
"module": "rainmaker-pt",
"locale": "en_IN"
},
API Call Role Action mapping:
S.No. | API | Action id | Roles |
|---|---|---|---|
1 |
|
|
|
2 |
|
|
|
3 |
|
|
|
4 |
|
|
|
5 |
|
|
|
6 |
|
|
|
7 |
|
|
|
8 |
|
|
|
9 |
|
|
|