Page Comparison

Once the user login with WS_CEMP or SW_CEMPRoles, then the User will get the BillGenie tree option of left side.

...

on click on BillGenie will get two options like below.

...

onClick on bill Cancellation, it will route to search bill screen.

Search Bill

Objective

Provide Citizen/ Employee to search existing Bill , generate expired bill , pay for the active bill , download bill , download receipt (if paid ) and its current statusand Cancel bill.

if tax head information can be wrong in a bill. So the bill needs to be cancelled.

Route - https://qa.digit.org/employee/bills/billSearch

...

• Initial page.https://github.com/egovernments/frontend/blob/master/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/bills/billSearch.js

• Initial MDMS call is being made on page load.

  

Note: only for the enabled service we can search, cancel the bill and serviceCategory drop downs options .it can be configured in uiCommonPay config by setting true to cancelBill  this path https://github.com/egovernments/egov-mdms-data/blob/QA/data/pb/common-masters/uiCommonPay.json

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 in https://github.com/egovernments/frontend/blob/master/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/bills/billSearchResources/billSearchCard.js

• Table rendering is taken care in https://github.com/egovernments/frontend/blob/80c5bff5b0869ba44f1626fabe4a5a6133afa558master/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/abgbills/billSearchResources/searchResults.js

• The Bill search API and formatting data is in done in https://github.com/egovernments/frontend/blob/63e2295cf784b937c296078dc8bdb27efc85513emaster/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/abgbills/billSearchResources/function.js

Table Structure

• MUIDataTable is used to implement Table component.

• Every columns are entry given as an Object

...

Once the data is fetched using egov-searcher/bill-genie/billswithaddranduser/_get API, the returned data is formatted and dispatched to redux

https://github.com/egovernments/frontend/blob/63e2295cf784b937c296078dc8bdb27efc85513emaster/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/abgbills/billSearchResources/function.js

...

As we can see from the image above, the data is put to specific path inside props.

https://github.com/egovernments/frontend/blob/80c5bff5b0869ba44f1626fabe4a5a6133afa558master/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/abgbills/billSearchResources/searchResults.js

...

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 onclick 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 Cancell. https://github.com/egovernments/frontend/blob/master/web/rainmaker/dev-packages/egov-abg-dev/src/ui-config/screens/specs/bills/viewBill.

...

js

Bill details document is available here Bill Details

Api Used :

1.   egovegov-mdms-service/v1/_search,

2. egov-searcher/bill-genie/billswithaddranduser/_get

...