Current Bill Cancellation UI Flow
Frontend Repo
Once the user login with WS_CEMP
or SW_CEMP
Roles, then the User will get the BillGenie tree option on the left side.

on click on BillGenie will get two options like below

on clicking on bill Cancellation, it will route to the search bill screen.
Search Bill
Objective
Provide Employee to search active bill, download bill and Cancel bill.
if tax head information can be wrong in a bill. So the bill needs to be cancelled.
Route - mSeva

Technical Implementation Details
Initial page -
frontend/billSearch.js at master · egovernments/frontend
Initial MDMS call is being made on page load

example:
{
"code": "WS",
"headerBandLabel": "PAYMENT_COMMON_CONSUMER_CODE",
"pdfModule":"WNS",
"receiptKey": "ws-onetime-receipt",
"cancelReceipt":false,
"cancelBill": true,
"billKey": "ws-bill",
"arrears": true,
"buttons": [
{
"label": "COMMON_BUTTON_HOME",
"citizenUrl": "/wns-citizen/home",
"employeeUrl": "/wns/search"
}
]
}
Form rendering is taken care of in
frontend/billSearchCard.js at master · egovernments/frontend
Table rendering is taken care of in
frontend/searchResults.js at master · egovernments/frontend
The Bill search API and formatting data is in done in
frontend/function.js at master · egovernments/frontend
Table Structure
MUIDataTable
is used to implement the Table componentEvery column entry is given as an Object
{
labelName: "Bill No.",
labelKey: "ABG_COMMON_TABLE_COL_BILL_NO"
}
Any customizations at column level are by
customBodyRender
hook available in all the columns ‘option’ property.

Data fetch, load and render
Once the data is fetched using egov-searcher/bill-genie/billswithaddranduser/_get
API, the returned data is formatted and dispatched to redux
frontend/function.js at master · egovernments/frontend

As we can see from the image above, the data is put to a specific path inside props.
frontend/searchResults.js at master · egovernments/frontend

The table component now fetches the data from its props as shown below.

For employee Action as “cancel bill “ so that employee can cancel the active bill on click of cancel bill, it will navigate to the Bill details page where we can see the bill amount and other details from there we can do the Cancel. frontend/viewBill.js at master · egovernments/frontend
Bill details document is available here Bill Details
API Used
egov-mdms-service/v1/_search,
egov-searcher/bill-genie/billswithaddranduser/_get
Role Action Mapping
1
egov-mdms-service/v1/_search
954
2
egov-searcher/bill-genie/billswithaddranduser/_get
SUPERUSER
, EMPLOYEE
1804
Last updated
Was this helpful?