diff --git a/.github/workflows/publishAllPackages.yml b/.github/workflows/publishAllPackages.yml index 3b13e25f7c0..4b4ad8651da 100644 --- a/.github/workflows/publishAllPackages.yml +++ b/.github/workflows/publishAllPackages.yml @@ -2,7 +2,7 @@ name: Node.js Publish UI Packages on: push: - branches: [ 'digit2.9' ] + branches: [ 'digit2.9-merge' ] paths: - 'frontend/micro-ui/web/micro-ui-internals/**' diff --git a/frontend/micro-ui/web/docker/Dockerfile b/frontend/micro-ui/web/docker/Dockerfile index b392968cc70..50b94cb7bd6 100644 --- a/frontend/micro-ui/web/docker/Dockerfile +++ b/frontend/micro-ui/web/docker/Dockerfile @@ -6,17 +6,17 @@ RUN yarn add @egovernments/digit-ui-libraries RUN yarn add @upyog/digit-ui-module-pt RUN yarn add @upyog/digit-ui-module-fsm RUN yarn add @upyog/digit-ui-module-tl -RUN yarn add @egovernments/digit-ui-module-dss -RUN yarn add @egovernments/digit-ui-module-mcollect -RUN yarn add @egovernments/digit-ui-module-pgr -RUN yarn add @egovernments/digit-ui-module-noc -RUN yarn add @egovernments/digit-ui-module-engagement -RUN yarn add @egovernments/digit-ui-module-hrms +RUN yarn add @upyog/digit-ui-module-dss +RUN yarn add @upyog/digit-ui-module-mcollect +RUN yarn add @upyog/digit-ui-module-pgr +RUN yarn add @upyog/digit-ui-module-noc +RUN yarn add @upyog/digit-ui-module-engagement +RUN yarn add @upyog/digit-ui-module-hrms RUN yarn add @egovernments/digit-ui-module-core RUN yarn add @upyog/digit-ui-module-obps RUN yarn add @egovernments/digit-ui-module-common RUN yarn add @upyog/digit-ui-module-ws -RUN yarn add @egovernments/digit-ui-module-commonpt +RUN yarn add @upyog/digit-ui-module-commonpt ARG WORK_DIR WORKDIR /app ENV NODE_OPTIONS "--max-old-space-size=4096" diff --git a/frontend/micro-ui/web/micro-ui-internals/.prettierrc.json b/frontend/micro-ui/web/micro-ui-internals/.prettierrc.json index b975008d6f8..42a87f7e191 100644 --- a/frontend/micro-ui/web/micro-ui-internals/.prettierrc.json +++ b/frontend/micro-ui/web/micro-ui-internals/.prettierrc.json @@ -1,3 +1,4 @@ { + "printWidth": 150 } diff --git a/frontend/micro-ui/web/micro-ui-internals/example/package.json b/frontend/micro-ui/web/micro-ui-internals/example/package.json index 51349d524f9..1bf3f27daf8 100644 --- a/frontend/micro-ui/web/micro-ui-internals/example/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/example/package.json @@ -11,22 +11,18 @@ "devDependencies": { "@egovernments/digit-ui-module-bills": "1.7.2", "@egovernments/digit-ui-module-common": "1.7.2", - "@egovernments/digit-ui-module-core": "1.7.2", - "@egovernments/digit-ui-module-engagement": "1.7.0-beta.2", - "@egovernments/digit-ui-module-dss": "1.7.2", - "@egovernments/digit-ui-module-hrms": "1.7.2", - "@egovernments/digit-ui-module-commonpt":"1.7.2", - "@egovernments/digit-ui-react-components": "1.7.2", - "@egovernments/digit-ui-libraries": "1.7.2", - "@upyog/digit-ui-module-fsm": "1.7.2", - "@egovernments/digit-ui-module-mcollect": "1.7.2", - "@egovernments/digit-ui-module-noc": "1.7.2", + "@upyog/digit-ui-module-engagement": "1.7.2", + "@upyog/digit-ui-module-fsm": "1.7.3", + "@upyog/digit-ui-module-mcollect": "1.7.3", + "@upyog/digit-ui-module-noc": "1.7.3", "@upyog/digit-ui-module-obps": "1.7.2", - "@egovernments/digit-ui-module-pgr": "1.7.2", - "@upyog/digit-ui-module-pt": "1.7.2", - "@egovernments/digit-ui-module-receipts": "1.7.2", + "@upyog/digit-ui-module-pgr": "1.7.5", + "@upyog/digit-ui-module-pt": "1.7.4", + "@upyog/digit-ui-module-receipts": "1.7.3", "@upyog/digit-ui-module-tl": "1.7.2", - "@upyog/digit-ui-module-ws": "1.7.2", + "@upyog/digit-ui-module-ws": "1.7.3", + "@upyog/digit-ui-module-bills": "1.7.2", + "@upyog/digit-ui-module-commonpt": "1.7.2", "http-proxy-middleware": "^1.0.5", "react": "17.0.2", "react-dom": "17.0.2", diff --git a/frontend/micro-ui/web/micro-ui-internals/example/src/index.js b/frontend/micro-ui/web/micro-ui-internals/example/src/index.js index afe1ef3ac87..2e2fd2c3073 100644 --- a/frontend/micro-ui/web/micro-ui-internals/example/src/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/example/src/index.js @@ -2,31 +2,31 @@ import React from "react"; import ReactDOM from "react-dom"; import { initLibraries } from "@egovernments/digit-ui-libraries"; -import { PGRReducers } from "@egovernments/digit-ui-module-pgr"; +import { PGRReducers } from "@upyog/digit-ui-module-pgr"; import { PTModule, PTLinks, PTComponents } from "@upyog/digit-ui-module-pt"; -import { MCollectModule, MCollectLinks } from "@egovernments/digit-ui-module-mcollect"; +import { MCollectModule, MCollectLinks } from "@upyog/digit-ui-module-mcollect"; // import { TLModule, TLLinks } from "@upyog/digit-ui-module-tl"; import { initFSMComponents } from "@upyog/digit-ui-module-fsm"; -import { initPGRComponents } from "@egovernments/digit-ui-module-pgr"; -import { initDSSComponents } from "@egovernments/digit-ui-module-dss"; -import { initHRMSComponents } from "@egovernments/digit-ui-module-hrms"; -import { initReceiptsComponents, ReceiptsModule } from "@egovernments/digit-ui-module-receipts"; +import { initPGRComponents } from "@upyog/digit-ui-module-pgr"; +import { initDSSComponents } from "@upyog/digit-ui-module-dss"; +import { initHRMSComponents } from "@upyog/digit-ui-module-hrms"; +import { initReceiptsComponents, ReceiptsModule } from "@upyog/digit-ui-module-receipts"; // import { initReportsComponents } from "@egovernments/digit-ui-module-reports"; -import { initMCollectComponents } from "@egovernments/digit-ui-module-mcollect"; +import { initMCollectComponents } from "@upyog/digit-ui-module-mcollect"; import { initTLComponents } from "@upyog/digit-ui-module-tl"; import { PaymentModule, PaymentLinks, paymentConfigs } from "@egovernments/digit-ui-module-common"; -import { HRMSModule } from "@egovernments/digit-ui-module-hrms"; +import { HRMSModule } from "@upyog/digit-ui-module-hrms"; import { initOBPSComponents } from "@upyog/digit-ui-module-obps"; -import { initEngagementComponents } from "@egovernments/digit-ui-module-engagement"; -import { initNOCComponents } from "@egovernments/digit-ui-module-noc"; +import { initEngagementComponents } from "@upyog/digit-ui-module-engagement"; +import { initNOCComponents } from "@upyog/digit-ui-module-noc"; import { initWSComponents } from "@upyog/digit-ui-module-ws"; import { DigitUI } from "@egovernments/digit-ui-module-core"; -import { initCommonPTComponents } from "@egovernments/digit-ui-module-commonpt"; -import { initBillsComponents, BillsModule } from "@egovernments/digit-ui-module-bills"; +import { initCommonPTComponents } from "@upyog/digit-ui-module-commonpt"; +import { initBillsComponents, BillsModule } from "@upyog/digit-ui-module-bills"; // import {initCustomisationComponents} from "./customisations"; -// import { PGRModule, PGRLinks } from "@egovernments/digit-ui-module-pgr"; +// import { PGRModule, PGRLinks } from "@upyog/digit-ui-module-pgr"; // import { Body, TopBar } from "@egovernments/digit-ui-react-components"; import "@upyog-niua/upyog-css/example/index.css"; // import * as comps from "@egovernments/digit-ui-react-components"; diff --git a/frontend/micro-ui/web/micro-ui-internals/package.json b/frontend/micro-ui/web/micro-ui-internals/package.json index b6ffa6d9cb3..4403a297861 100644 --- a/frontend/micro-ui/web/micro-ui-internals/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/package.json @@ -2,11 +2,12 @@ "name": "egovernments", "version": "1.5.4", "main": "index.js", - "workspaces": [ + "workspaces": [ "packages/libraries", "packages/css", "example", - "packages/react-components" + "packages/react-components", + "packages/modules/*" ], "license": "MIT", "private": true, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/css/README.md deleted file mode 100644 index 1933a492bf6..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/README.md +++ /dev/null @@ -1,55 +0,0 @@ - -# digit-ui-css - -## Install - -```bash -npm install --save @egovernments/digit-ui-css -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -It is the base css for all Digit UI's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-css":"^1.5.0", -``` - -then navigate to App.js - -```bash -frontend/micro-ui/web/public/index.html -``` - -```jsx -/** add this import **/ - - - -``` -### Changelog - -```bash -1.0.3 UPYOG Base -``` -## Contributors - -[jagankumar-egov] [nipunarora-eGov] [Tulika-eGov] [Ramkrishna-egov] [nabeelmd-eGov] [anil-egov] [vamshikrishnakole-wtt-egov] - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/egovernments/Digit-Frontend/tree/develop) - -## License - -MIT © [jagankumar-egov](https://github.com/jagankumar-egov) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json index 0d46a042907..8bbbd406544 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json @@ -1,6 +1,6 @@ { "name": "@upyog-niua/upyog-css", - "version": "1.0.11", + "version": "1.8.0", "license": "MIT", "main": "dist/index.css", "author": "Jagankumar ", @@ -12,7 +12,7 @@ }, "scripts": { "start": "gulp build", - "build:prod": "NODE_ENV=production gulp build", + "build:prod": "gulp build", "prepublish": "yarn build:prod", "deploy": "gulp && cp -R svg example && cp -R img example && gh-pages -d example" }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/postcss.config.js b/frontend/micro-ui/web/micro-ui-internals/packages/css/postcss.config.js index 8291877a8d3..18485de221e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/postcss.config.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/postcss.config.js @@ -52,4 +52,4 @@ module.exports = { // }, // }, // }; -// }; \ No newline at end of file +// }; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/fsm/useMDMS.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/fsm/useMDMS.js index a8ed40e0605..72210e8db12 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/fsm/useMDMS.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/fsm/useMDMS.js @@ -24,6 +24,10 @@ const useMDMS = (tenantId, moduleCode, type, config = {}, payload = []) => { return useQuery("FSM_APPLICATION_EDIT_APPLICATION_CHANNEL", () => onlyEmployeeChannels(), queryConfig); }; + const useUrcConfig = () => { + return useQuery("FSM_APPLICATION_NEW_URC_CONFIG", () => MdmsService.getUrcConfig(tenantId, moduleCode, type), queryConfig); + }; + const usePropertyType = () => { return useQuery("FSM_PROPERTY_TYPE", () => MdmsService.getPropertyType(tenantId, moduleCode, type), queryConfig); }; @@ -146,7 +150,9 @@ const useMDMS = (tenantId, moduleCode, type, config = {}, payload = []) => { case "ReceivedPaymentType": return useReceivedPaymentType(); case "WSTaxHeadMaster": - return useWSTaxHeadMaster() + return useWSTaxHeadMaster(); + case "UrcConfig": + return useUrcConfig(); default: return null; } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js index 3d0647df055..43ca8727c06 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js @@ -195,6 +195,12 @@ import useSurveySearch from "./surveys/useSearch"; import useSurveyShowResults from "./surveys/useShowResults"; import useSurveySubmitResponse from "./surveys/useSubmitResponse"; import useSurveyInbox from "./surveys/useSurveyInbox"; +import useServeyCreateDef from "./surveys/useCreateSurvey"; +import useCfdefinitionsearch from "./surveys/useCfdefinitionsearch"; +import useSubmitSurveyResponse from "./surveys/useSubmitSurveyResponse"; +import useSelectedSurveySearch from "./surveys/useSelectedSurveySearch"; +import useCfdefinitionsearchresult from "./surveys/useCfdefinitionsearchresult"; +import useUpdateSurvey from "./surveys/useSurveyUpdate"; import useNOCDetails from "./noc/useNOCDetails"; import useNOCInbox from "./noc/useInbox"; @@ -440,6 +446,12 @@ const survey = { useSubmitResponse: useSurveySubmitResponse, useShowResults: useSurveyShowResults, useSurveyInbox, + useServeyCreateDef:useServeyCreateDef, + useCfdefinitionsearch:useCfdefinitionsearch, + useSubmitSurveyResponse:useSubmitSurveyResponse, + useSelectedSurveySearch:useSelectedSurveySearch, + useCfdefinitionsearchresult:useCfdefinitionsearchresult, + useUpdateSurvey:useUpdateSurvey, }; const noc = { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearch.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearch.js new file mode 100644 index 00000000000..c5ce4208771 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearch.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useQuery } from "react-query"; + +const useCfdefinitionsearch = (filters, config) => { + return useQuery([`search_surveys`,filters.Pagination,filters.ServiceDefinitionCriteria], () => Surveys.cfdefinitionsearch(filters), { ...config }); +}; + +export default useCfdefinitionsearch; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearchresult.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearchresult.js new file mode 100644 index 00000000000..118c375f363 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCfdefinitionsearchresult.js @@ -0,0 +1,9 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useQuery } from "react-query"; + +const useCfdefinitionsearchresult = (filters, config) => { + console.log(config,"useCfdefinitionsearchresult") + return useQuery(`useCfdefinitionsearchresult_search_surveys_${new Date()}`, () => Surveys.cfdefinitionsearch(filters), { ...config }); +}; + +export default useCfdefinitionsearchresult; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreateSurvey.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreateSurvey.js new file mode 100644 index 00000000000..39ff08bd6bd --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreateSurvey.js @@ -0,0 +1,10 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useCreateSurveysDef = (filters, config) => { + console.log("useCreateSurveysDef"); + + return useMutation((filters) => Surveys.createSurvey(filters)); +}; + +export default useCreateSurveysDef; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSelectedSurveySearch.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSelectedSurveySearch.js new file mode 100644 index 00000000000..f905b977798 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSelectedSurveySearch.js @@ -0,0 +1,9 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useQuery } from "react-query"; + +const useSelectedSurveySearch = (filters, config) => { + console.log(config,"useSelectedSurveySearch") + return useQuery(`search_selected_survey_${new Date()}`, () => Surveys.selectedSurveySearch(filters), { ...config }); +}; + +export default useSelectedSurveySearch; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitSurveyResponse.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitSurveyResponse.js new file mode 100644 index 00000000000..8f27ee9d60b --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitSurveyResponse.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useSubmitSurveyResponse = (filters, config) => { + return useMutation((filters) => Surveys.submitSurveyResponse(filters)); +}; + +export default useSubmitSurveyResponse; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyUpdate.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyUpdate.js new file mode 100644 index 00000000000..e81de679ca2 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyUpdate.js @@ -0,0 +1,9 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useUpdateSurvey = (filters, config) => { + console.log("updateSurvey") + return useMutation((filters) => Surveys.updateSurvey(filters)); +}; + +export default useUpdateSurvey; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js index 17ca01a0477..da43eae0617 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js @@ -198,6 +198,11 @@ const Urls = { delete: "/egov-survey-services/egov-ss/survey/_delete", submitResponse: "/egov-survey-services/egov-ss/survey/response/_submit", showResults: "/egov-survey-services/egov-ss/survey/response/_results", + createSurvey: "/service-request/service/definition/v1/_create", + cfdefinitionsearch: "/service-request/service/definition/v1/_search", + submitSurveyResponse: "/service-request/service/v1/_create", + selectedSurveySearch: "/service-request/service/v1/_search", + updateSurvey:"/service-request/service/definition/v1/_update", }, }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js index 31850ae0944..b4de3a3d14f 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js @@ -1004,6 +1004,8 @@ const GetApplicationChannel = (MdmsRes) => i18nKey: `ES_APPLICATION_DETAILS_APPLICATION_CHANNEL_${channel.code}`, })); +const getUrcConfig = (MdmsRes) => MdmsRes["FSM"].UrcConfig; + const GetPropertyType = (MdmsRes) => MdmsRes["FSM"].PropertyType.filter((property) => property.active && !property.propertyType).map((item) => ({ ...item, @@ -1407,6 +1409,8 @@ const transformResponse = (type, MdmsRes, moduleCode, tenantId) => { return GetTripNumber(MdmsRes); case "ReceivedPaymentType": return GetReceivedPaymentType(MdmsRes); + case "UrcConfig": + return getUrcConfig(MdmsRes); default: return MdmsRes; } @@ -1522,6 +1526,9 @@ export const MdmsService = { getApplicationChannel: (tenantId, moduleCode) => { return MdmsService.getDataByCriteria(tenantId, getApplicationChannelCriteria(tenantId, moduleCode), moduleCode); }, + getUrcConfig: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getUrcConfigCriteria(tenantId, moduleCode, type), moduleCode); + }, getPropertyType: (tenantId, moduleCode, type) => { return MdmsService.getDataByCriteria(tenantId, getPropertyTypeCriteria(tenantId, moduleCode, type), moduleCode); }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js index e887d760cf8..70f6f9b63a8 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js @@ -51,7 +51,56 @@ export const Surveys = { showResults: (details) => Request({ url: Urls.engagement.surveys.showResults, - // data: details, + // data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + params: { surveyId: details.surveyId } + }), + createSurvey: (details) => + Request({ + url: Urls.engagement.surveys.createSurvey, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + locale: true + }), + cfdefinitionsearch: (filters = {}) => + Request({ + url: Urls.engagement.surveys.cfdefinitionsearch, + useCache: false, + method: "POST", + auth: false, + userService: false, + params: {}, + data: filters + }), + submitSurveyResponse: (details) => + Request({ + url: Urls.engagement.surveys.submitSurveyResponse, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), + selectedSurveySearch: (filters = {}) => + Request({ + url: Urls.engagement.surveys.selectedSurveySearch, + useCache: false, + method: "POST", + auth: false, + userService: false, + params: {}, + data: filters + }), + updateSurvey: (details) => + Request({ + url: Urls.engagement.surveys.updateSurvey, + data: details, useCache: true, userService: true, method: "POST", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/README.md deleted file mode 100644 index f73ff925373..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-bills - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-bills -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-bills":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initbillsComponents } from "@egovernments/digit-ui-module-bills"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["Payment"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initbillsComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/package.json index 993961736dc..3890365a7da 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/bills/package.json @@ -1,5 +1,5 @@ { - "name": "@egovernments/digit-ui-module-bills", + "name": "@upyog/digit-ui-module-bills", "version": "1.7.2", "description": "BILLS", "license": "MIT", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/README.md index 6f52374dc74..671327fc78d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/README.md +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/README.md @@ -4,7 +4,7 @@ ## Install ```bash -npm install --save @egovernments/digit-ui-module-commonpt +npm install --save @upyog/digit-ui-module-commonpt ``` ## Limitation @@ -22,7 +22,7 @@ frontend/micro-ui/web/package.json ``` ```json -"@egovernments/digit-ui-module-commonpt":"^1.5.0", +"@upyog/digit-ui-module-commonpt":"^1.5.0", ``` then navigate to App.js @@ -35,7 +35,7 @@ then navigate to App.js ```jsx /** add this import **/ -import { initcommonptComponents } from "@egovernments/digit-ui-module-commonpt"; +import { initcommonptComponents } from "@upyog/digit-ui-module-commonpt"; /** inside enabledModules add this new module key **/ diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/package.json index d8c25f247e6..d527f5199be 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/commonPt/package.json @@ -1,5 +1,5 @@ { - "name": "@egovernments/digit-ui-module-commonpt", + "name": "@upyog/digit-ui-module-commonpt", "version": "1.7.2", "license": "MIT", "description": "Digit PT Light weight Module", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/README.md deleted file mode 100644 index db5837a3502..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/README.md +++ /dev/null @@ -1,76 +0,0 @@ - -# digit-ui-module-dss - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-dss -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-dss":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initDSSComponents } from "@egovernments/digit-ui-module-dss"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["DSS"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initDSSComponents(); -}; -``` - - - -### Changelog - -```bash -1.7.1 UPYOG base version -``` - -### Contributors - -[jagankumar-egov] [nipunarora-eGov] [Tulika-eGov] [Ramkrishna-egov] [nabeelmd-eGov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/master) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/package.json index 4eabea2f00a..9bf06766b92 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-dss", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-dss", + "version": "1.7.3", "license": "MIT", "description": "Digit Dashboard Module", "main": "dist/index.js", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomAreaChart.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomAreaChart.js index d3e34dcfbde..883f34d50da 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomAreaChart.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomAreaChart.js @@ -57,7 +57,7 @@ const renderUnits = (t, denomination, symbol) => { } }; -const CustomAreaChart = ({ xDataKey = "name", yDataKey = getValue, data, setChartDenomination }) => { +const CustomAreaChart = ({ xDataKey = "name", yDataKey = getValue, data, setChartDenomination, moduleCode }) => { const lineLegend = { margin: "10px", }; @@ -428,4 +428,4 @@ else { ); }; -export default CustomAreaChart; \ No newline at end of file +export default CustomAreaChart; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomBarChart.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomBarChart.js index 209de10a03d..a0790d76560 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomBarChart.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomBarChart.js @@ -251,7 +251,7 @@ const CustomBarChart = ({ {chartData?.length > 3 && showDrillDown && (

- {t("DSS_SHOW_MORE")} + {window.location.href.includes("fsm") ? "" : t("DSS_SHOW_MORE")}

)} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomTable.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomTable.js index 4bc820f921b..5d548808b42 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomTable.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/CustomTable.js @@ -85,24 +85,26 @@ const CustomTable = ({ data = {}, onSearch, setChartData, setChartDenomination, } let prevData = lyData?.plots?.[currentIndex]?.value; let insight = null; - if (row?.name === "CapacityUtilization" && chartKey !== "fsmVehicleLogReportByVehicleNo") { - const { range } = value; - const { startDate, endDate } = range; - const numberOfDays = differenceInCalendarDays(endDate, startDate) + 1; - const ulbs = dssTenants - .filter((tenant) => tenant?.city?.ddrName === rows?.headerName || tenant?.code === rows?.headerName) - .map((tenant) => tenant?.code); - const totalCapacity = fstpMdmsData - ?.filter((plant) => ulbs.find((ulb) => plant?.ULBS?.includes(ulb))) - .reduce((acc, plant) => acc + Number(plant?.PlantOperationalCapacityKLD), 0); - cellValue = calculateFSTPCapacityUtilization(cellValue, totalCapacity, numberOfDays); - prevData = calculateFSTPCapacityUtilization(prevData, totalCapacity, numberOfDays); - } - if (row?.name === "CapacityUtilization" && chartKey === "fsmVehicleLogReportByVehicleNo") { - const tankCapcity = rows?.plots.find((plot) => plot?.name === "TankCapacity"); - cellValue = calculateFSTPCapacityUtilization(cellValue, tankCapcity?.value); - prevData = calculateFSTPCapacityUtilization(prevData, tankCapcity?.value); - } + //Commented since it was causing mismatch data for the Capacity FSM: SM-1282 + // if (row?.name === "CapacityUtilization" && chartKey !== "fsmVehicleLogReportByVehicleNo") { + // const { range } = value; + // const { startDate, endDate } = range; + // const numberOfDays = differenceInCalendarDays(endDate, startDate) + 1; + // const ulbs = dssTenants + // .filter((tenant) => tenant?.city?.ddrName === rows?.headerName || tenant?.code === rows?.headerName) + // .map((tenant) => tenant?.code); + // const totalCapacity = fstpMdmsData + // ?.filter((plant) => ulbs.find((ulb) => plant?.ULBS?.includes(ulb))) + // .reduce((acc, plant) => acc + Number(plant?.PlantOperationalCapacityKLD), 0); + // cellValue = calculateFSTPCapacityUtilization(cellValue, totalCapacity, numberOfDays); + // prevData = calculateFSTPCapacityUtilization(prevData, totalCapacity, numberOfDays); + // } + // if (row?.name === "CapacityUtilization" && chartKey === "fsmVehicleLogReportByVehicleNo") { + // const tankCapcity = rows?.plots.find((plot) => plot?.name === "TankCapacity"); + // cellValue = calculateFSTPCapacityUtilization(cellValue, tankCapcity?.value); + // prevData = calculateFSTPCapacityUtilization(prevData, tankCapcity?.value); + + // } if ( (row?.symbol === "number" || row?.symbol === "percentage" || row?.symbol === "amount") && row?.name !== "CitizenAverageRating" && @@ -448,6 +450,11 @@ else { )} )} + {filterStack?.length > 2 && data?.showOptionalInfo && ( + + {t(data?.optionalInfo)} + + )} {!tableColumns || !tableData ? ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/MapChart.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/MapChart.js index f3ada1e41e5..5f52591b730 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/MapChart.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/MapChart.js @@ -40,6 +40,8 @@ const getColor = (current) => { return COLOR_RANGE[0]; case "OnBoarded": return COLOR_RANGE[1]; + case "UnderImplementation": + return COLOR_RANGE[2]; case "None": return DEFAULT_COLOR; default: diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Home.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Home.js index 840a3c38071..96ea0ecddcd 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Home.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Home.js @@ -209,7 +209,6 @@ const renderLegend = (value) => { } const bars = response?.responseData?.data?.map((bar) => bar?.headerName); - return ( { ) : null} {dashboardConfig?.[0]?.visualizations.map((row, key) => { - console.log("visualizations",row,key) return (
{row.vizArray.map((item, index) => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Overview.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Overview.js index 26ca9c1b5f2..0325245fca1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Overview.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/Overview.js @@ -7,7 +7,6 @@ const Overview = () => { const { t } = useTranslation(); const moduleCode = "home"; const { data: response, isLoading } = Digit.Hooks.dss.useDashboardConfig(moduleCode); -console.log("") if (isLoading) { return ; } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/package.json index 4e0601694d7..0fb2821d237 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/package.json @@ -1,5 +1,5 @@ { - "name": "@egovernments/digit-ui-module-engagement", + "name": "@upyog/digit-ui-module-engagement", "version": "1.7.2", "license": "MIT", "main": "dist/index.js", @@ -26,6 +26,6 @@ "react-query": "3.6.1", "react-router-dom": "5.3.0", "react-time-picker": "4.2.1", - "recharts": "^2.0.9" + "recharts": "2.0.9" } } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/EngagementCard.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/EngagementCard.js index acdb588b6ed..449cd54f387 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/EngagementCard.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/EngagementCard.js @@ -46,15 +46,18 @@ const EngagementCard = () => { } ); - const { data: surveysCount, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useSearch( - { tenantIds: tenantId }, - { select: (data) => data?.TotalCount } - ); + const ServiceDefinitionCriteria = { + "tenantId": tenantId, + "code": [], + "module": ["engagement"], + } + + const { data: surveysCount, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useCfdefinitionsearch({ServiceDefinitionCriteria}); const totalDocsCount = useMemo(() => (isLoadingDocs ? "-" : documentsCount), [isLoadingDocs, documentsCount]); const totalEventsCount = useMemo(() => (isLoadingEvents ? "-" : totalEvents), [isLoadingEvents, totalEvents]); const totalMessagesCount = useMemo(() => (isLoadingMessages ? "-" : MessagesCount), [isLoadingMessages, MessagesCount]); - const totalSurveysCount = useMemo(() => (isLoadingSurveys ? "-" : surveysCount), [isLoadingSurveys, surveysCount]); + const totalSurveysCount = useMemo(() => (isLoadingSurveys ? "-" : surveysCount.TotalCount), [isLoadingSurveys, surveysCount]); const { t } = useTranslation(); let result = null; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/Delete.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/Delete.js index 3236cde7240..19fac453055 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/Delete.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/Delete.js @@ -24,7 +24,7 @@ const ConfirmationQuestion = ({ t, title }) => (
{" "} - {t("CONFIRM_DELETE_MSG_NEW")} {` ${title}`}{t("COMPLETELY_DELETE")}

{t("COMPLETELY_DELETE_WARN_MSG")} + {t("CONFIRM_DELETE_MSG_NEW")} {` ${title} `}{t("COMPLETELY_DELETE")}

{t("COMPLETELY_DELETE_WARN_MSG")}
); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/MarkInActive.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/MarkInActive.js index bd5ab77be61..e6fcd75c398 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/MarkInActive.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Modal/Surveys/MarkInActive.js @@ -24,7 +24,7 @@ const ConfirmationQuestion = ({ t, title }) => (
{" "} - {t("CONFIRM_INACTIVE_SURVEY_MSG_NEW")} {` ${title}`}{t("CONFIRM_INACTIVE_SURVEY_MSG_TO_INACTIVE")} + {t("CONFIRM_INACTIVE_SURVEY_MSG_NEW")} {` ${title} `}{t("CONFIRM_INACTIVE_SURVEY_MSG_TO_INACTIVE")}

{t("CONFIRM_INACTIVE_SURVEY_WARN_MSG")} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/CitizenSurveyDisplayForm.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/CitizenSurveyDisplayForm.js new file mode 100644 index 00000000000..318291feea7 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/CitizenSurveyDisplayForm.js @@ -0,0 +1,182 @@ +import React from "react"; +import { useForm } from "react-hook-form"; +import { ActionBar, Header, Loader, SubmitBar, Toast } from "@egovernments/digit-ui-react-components"; + +import CitizenSurveyQuestion from "./CitizenSurveyQuestion"; +import { useTranslation } from "react-i18next"; + + +const CitizenSurveyDisplayForm = ({ surveyData, onFormSubmit,submitDisabled,formDisabled,formDefaultValues,isLoading, showToast, isSubmitDisabled }) => { + //need to disable this form and fill with default values if formDisabled is true + const { + register: registerRef, + control: controlSurveyForm, + handleSubmit: handleSurveyFormSubmit, + setValue: setSurveyFormValue, + getValues: getSurveyFormValues, + reset: resetSurveyForm, + formState: surveyFormState, + clearErrors: clearSurveyFormsErrors, + } = useForm({ + defaultValues:formDefaultValues + }); + + let surveyQuestion = {...surveyData}; + surveyQuestion.title = surveyData.code; + surveyQuestion.questions = []; + surveyQuestion?.attributes?.map((element, index) => { + surveyQuestion.questions.push( + { + "uuid": element.code, + // "surveyId": element.code, + "questionStatement": element.code, + "options": [ + ...element.additionalDetails.options + ], + "auditDetails": element.auditDetails, + "status": element.isActive?"ACTIVE":"INACTIVE", + "type": element.additionalDetails.type, + "required": element.required, + "qorder": element.order++, + "value": "12345" + } + ); + + }) + +// surveyQuestion.questions = [ +// { +// "uuid": "7d2aee5b-7ff5-4bda-9128-d3bd59e7a388", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "short", +// "options": [ +// "NA" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066437, +// "lastModifiedTime": 1689934066437 +// }, +// "status": "ACTIVE", +// "type": "SHORT_ANSWER_TYPE", +// "required": false, +// "qorder": 1 +// }, +// { +// "uuid": "22b8763a-3cb0-4c57-b794-ad1f88eafe49", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "mul", +// "options": [ +// "1", +// "2", +// "3", +// "4" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066437, +// "lastModifiedTime": 1689934066437 +// }, +// "status": "ACTIVE", +// "type": "MULTIPLE_ANSWER_TYPE", +// "required": false, +// "qorder": 2 +// }, +// { +// "uuid": "d6641081-2c08-49e7-b850-2efb13043b17", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "check", +// "options": [ +// "1", +// "2", +// "3", +// "4" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066438, +// "lastModifiedTime": 1689934066438 +// }, +// "status": "ACTIVE", +// "type": "CHECKBOX_ANSWER_TYPE", +// "required": false, +// "qorder": 3 +// }, +// { +// "uuid": "03cf1483-d2ca-4e97-a58c-a3a730de16a0", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "para", +// "options": [ +// "NA" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066438, +// "lastModifiedTime": 1689934066438 +// }, +// "status": "ACTIVE", +// "type": "LONG_ANSWER_TYPE", +// "required": false, +// "qorder": 4 +// }, +// { +// "uuid": "acc77cf9-fcab-4198-be66-da23e5227627", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "date", +// "options": [ +// "NA" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066438, +// "lastModifiedTime": 1689934066438 +// }, +// "status": "ACTIVE", +// "type": "DATE_ANSWER_TYPE", +// "required": false, +// "qorder": 5 +// }, +// { +// "uuid": "b2461bff-e893-499d-9b24-e32eef51865b", +// "surveyId": "SY-2023-07-21-000034", +// "questionStatement": "time", +// "options": [ +// "NA" +// ], +// "auditDetails": { +// "createdBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "lastModifiedBy": "1fd992e1-7d43-43bb-9666-29d32af6697f", +// "createdTime": 1689934066438, +// "lastModifiedTime": 1689934066438 +// }, +// "status": "ACTIVE", +// "type": "TIME_ANSWER_TYPE", +// "required": false, +// "qorder": 6 +// } +// ] + + const {t} = useTranslation() + if(isLoading){ + return + } + return ( +
+
{surveyData?.title?.toUpperCase()}
+
+ {surveyQuestion?.questions?.length ? surveyQuestion.questions.map((config, index) => ) : null} + {showToast && } + + {!submitDisabled && } + + +
+ ); +}; + +export default CitizenSurveyDisplayForm; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyDetailsView.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyDetailsView.js index 47c39e03ca8..7609e90e727 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyDetailsView.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyDetailsView.js @@ -40,7 +40,7 @@ const SurveyDetailsView = ({surveyTitle,surveyDesc,t,surveyId}) => { >
{t("SURVEY_QUESTIONS")}
*/} - history.push(`/digit-ui/employee/engagement/surveys/inbox/details/${surveyId}`)}> + history.push(`/digit-ui/employee/engagement/surveys/inbox/details/${surveyTitle}`)}> {t("VIEW_SURVEY_QUESTIONS")} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyResultsView.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyResultsView.js index b7df3b2866e..262225a36b2 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyResultsView.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/ResultsView/SurveyResultsView.js @@ -17,7 +17,7 @@ const transformDate = (date) => { ] return { day, - date:`${monthNames[month-1]} ${year}` + date:date?`${monthNames[month-1]} ${year}`:date } // return (

// {`${monthNames[month-1]} ${year} ${day}`} @@ -179,20 +179,20 @@ const displayResult = (ques,ans,type,resCount=0,t) => { } } -const SurveyResultsView = ({surveyInfo,responsesInfoMutation}) => { +const SurveyResultsView = ({surveyInfo,selecedSurveyresults}) => { const { t } = useTranslation(); const [data,setData]=useState(null); const [userInfo,setUserInfo] = useState({}) const tenant = Digit.ULBService.getCurrentTenantId(); useEffect( async() => { - if(responsesInfoMutation.isSuccess){ - const dp = bindQuesWithAns(surveyInfo?.questions,responsesInfoMutation.data.answers) + if(selecedSurveyresults?.answers?.length){ + const dp = bindQuesWithAns(surveyInfo?.questions,selecedSurveyresults.answers) setData(dp) - const ue = await getUserData(responsesInfoMutation.data.answers,tenant.split(".")[0]) + const ue = await getUserData(selecedSurveyresults.answers,tenant.split(".")[0]) setUserInfo(ue); } - },[responsesInfoMutation]) + },[selecedSurveyresults]) // const dp = bindQuesWithAns(surveyInfo?.questions,responsesInfoMutation.data.answers); // setData(dp) @@ -201,7 +201,7 @@ const SurveyResultsView = ({surveyInfo,responsesInfoMutation}) => { const generateExcelObj = (ques,ans) => { const countResponses = parseInt(ans.length/ques.length) - const dp = bindQuesWithAns(surveyInfo?.questions, responsesInfoMutation.data.answers) + const dp = bindQuesWithAns(surveyInfo?.questions, selecedSurveyresults.answers) const result = [] //now in a loop fill all the sampleObj (3 times) and use it to download report @@ -232,11 +232,11 @@ const SurveyResultsView = ({surveyInfo,responsesInfoMutation}) => { } const handleReportDownload = () => { - const result = generateExcelObj(surveyInfo?.questions, responsesInfoMutation.data.answers) - return Digit.Download.Excel(result, responsesInfoMutation.data.title); + const result = generateExcelObj(surveyInfo?.questions, selecedSurveyresults.answers) + return Digit.Download.Excel(result, selecedSurveyresults.Service[0].referenceId); } - if(!data) return + // if(!data) return return (

diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/SurveyForms/SurveyDetailsForms.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/SurveyForms/SurveyDetailsForms.js index f0c7c2f5277..42130f61bf8 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/SurveyForms/SurveyDetailsForms.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/components/Surveys/SurveyForms/SurveyDetailsForms.js @@ -28,7 +28,6 @@ const SurveyDetailsForms = ({ t, registerRef, controlSurveyForm, surveyFormState return false } - return (
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/FillSurvey.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/FillSurvey.js index a38c05ea2df..fc170f59574 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/FillSurvey.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/FillSurvey.js @@ -1,60 +1,113 @@ import React from "react"; import { useHistory } from "react-router-dom"; import { useState, useEffect } from "react"; -import CitizenSurveyForm from "../../../components/Surveys/CitizenSurveyForm"; +import CitizenSurveyDisplayForm from "../../../components/Surveys/CitizenSurveyDisplayForm"; import NoSurveyFoundPage from "../../../components/Surveys/NoSurveyFoundPage"; import { useTranslation } from "react-i18next"; -const transformSurveyResponseData = (data) => { +const transformSurveyResponseData = (data,surveyData) => { /** * TODO : handle checkbox */ if (!data) return; const questions = []; + // for (const key in data) { + // questions.push({ + // questionId: key, + // answer: [data[key]], + // }); + // } for (const key in data) { questions.push({ - questionId: key, - answer: [data[key]], + attributeCode: key, + value:data[key]===""? "\"NA\"":JSON.stringify(data[key]) || "\"\"" , + additionalDetails: { + questionId: getQuestionID(key,surveyData) + } }); } return questions; }; +const getQuestionID = (key,surveyData) =>{ + let questionId = ""; + surveyData.attributes.map((ele)=>{ + if (ele.code === key){ + questionId = ele.id + } + }) + return questionId; +} + const FillSurvey = ({ location }) => { - //const surveyData = location?.state; + const user = Digit.UserService.getUser(); const { applicationNumber: surveyId, tenantId } = Digit.Hooks.useQueryParams(); const { data, isLoading } = Digit.Hooks.survey.useSearch({uuid:surveyId,tenantId},{}) - const surveyData = data?.Surveys?.[0] ? data?.Surveys?.[0] : {} + const tenantIds = Digit.ULBService.getCitizenCurrentTenant(); + let ServiceDefinitionCriteria = { + "tenantId": tenantId, + "code": [], + "module": ["engagement"], + } + + const { data: surveyQuestionData, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useCfdefinitionsearch({ServiceDefinitionCriteria},{}) + const surveyData = location?.state?location.state:surveyQuestionData?.ServiceDefinition?.[0] ? surveyQuestionData?.ServiceDefinition?.[0] : {} + let ServiceCriteria = { + tenantId: tenantIds, + ids: [], + serviceDefIds: [], + referenceIds: [surveyData.code], + accountId: user?.info?.uuid || "dda30b0a-ae2d-4f87-8b52-d1fc73ed7643", + } + const { data: selecedSurveyData, } = Digit.Hooks.survey.useSelectedSurveySearch({ServiceCriteria},{}) + const surveyDataOld = data?.Surveys?.[0] ? data?.Surveys?.[0] : {} const {t} = useTranslation(); let initialData = data; const [showToast, setShowToast] = useState(null); //sort survey questions based on qorder field, in surveyData.questions array, here and then render - surveyData?.questions?.sort((a,b)=>a.qorder-b.qorder) + surveyData?.attributes?.sort((a,b)=>a.order-b.order) const history = useHistory(); - useEffect(() => { - if(data && initialData?.Surveys?.[0]?.hasResponded == true || initialData?.Surveys?.[0]?.hasResponded === "true") - setShowToast({ key: true, label: "SURVEY_FORM_IS_ALREADY_SUBMITTED" }); - else if(data && initialData?.Surveys?.[0]?.status == "INACTIVE") - setShowToast({ key: true, label: "SURVEY_FORM_IS_ALREADY_INACTIVE" }); - },[data?.Surveys?.[0]?.hasResponded,initialData?.Surveys?.[0]?.hasResponded]) + // useEffect(() => { + // if(data && initialData?.Surveys?.[0]?.hasResponded == true || initialData?.Surveys?.[0]?.hasResponded === "true") + // setShowToast({ key: true, label: "SURVEY_FORM_IS_ALREADY_SUBMITTED" }); + // else if(data && initialData?.Surveys?.[0]?.status == "INACTIVE") + // setShowToast({ key: true, label: "SURVEY_FORM_IS_ALREADY_INACTIVE" }); + // },[data?.Surveys?.[0]?.hasResponded,initialData?.Surveys?.[0]?.hasResponded]) const onSubmit = (data) => { - const details = { - AnswerEntity: { - surveyId: surveyData.uuid, - answers: transformSurveyResponseData(data), - surveyTitle:surveyData.title, - hasResponded:surveyData.hasResponded, - }, - }; - history.push("/digit-ui/citizen/engagement/surveys/submit-response", details); + const user = Digit.UserService.getUser(); + if (selecedSurveyData.Service[0]){ + setShowToast({ key: true, label: "SURVEY_FORM_IS_ALREADY_SUBMITTED" }); + }else{ + const details = { + // AnswerEntity: { + // surveyId: surveyData.uuid, + // answers: transformSurveyResponseData(data), + // surveyTitle:surveyData.title, + // hasResponded:surveyData.hasResponded, + // }, + "Service": { + "tenantId": tenantId, + "serviceDefId": location.state.id, + "isActive": true, + "referenceId": location.state.code, + "attributes":transformSurveyResponseData(data,surveyData), + "additionalDetails": {}, + "accountId" : user?.info?.uuid || "dda30b0a-ae2d-4f87-8b52-d1fc73ed7643", + } + }; + + history.push("/digit-ui/citizen/engagement/surveys/submit-response", details); + } + + }; - if(Object.keys(surveyData)?.length > 0 || isLoading) - return ; + if(Object.keys(surveyData)?.length > 0 || isLoadingSurveys) + return ; else return }; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/Response.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/Response.js index ecf13c978f0..d9048609e1f 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/Response.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/Response.js @@ -30,7 +30,8 @@ const Acknowledgement = (props) => { const queryClient = useQueryClient(); const { t } = useTranslation(); const tenantId = Digit.ULBService.getCurrentTenantId(); - const mutation = Digit.Hooks.survey.useSubmitResponse(); + // const mutation = Digit.Hooks.survey.useSubmitResponse(); + let mutation = Digit.Hooks.survey.useSubmitSurveyResponse(); const { state } = props.location; const surveyTitlev1 = state?.AnswerEntity?.surveyTitle; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/ShowSurvey.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/ShowSurvey.js index 682e1e19ebb..ec02e15c57a 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/ShowSurvey.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/ShowSurvey.js @@ -2,37 +2,53 @@ import { Loader } from "@egovernments/digit-ui-react-components"; import React, { useEffect } from "react"; import { useQueryClient } from "react-query"; import CitizenSurveyForm from "../../../components/Surveys/CitizenSurveyForm"; +import CitizenSurveyDisplayForm from "../../../components/Surveys/CitizenSurveyDisplayForm"; const ShowSurvey = ({ location }) => { const surveyData = location?.state; const questions = surveyData?.questions; const tenantIds = Digit.ULBService.getCitizenCurrentTenant(); + const user = Digit.UserService.getUser(); const mutation = Digit.Hooks.survey.useShowResults(); - const queryClient = useQueryClient(); + let ServiceCriteria = { + tenantId: tenantIds, + ids: [], + serviceDefIds: [], + referenceIds: [surveyData.code], + accountId: user?.info?.uuid || "dda30b0a-ae2d-4f87-8b52-d1fc73ed7643", + } + const { data: selecedSurveyData, isLoading } = Digit.Hooks.survey.useSelectedSurveySearch({ServiceCriteria},{}) + const queryClient = useQueryClient(); useEffect(() => { - const onSuccess = () => { - queryClient.clear(); - }; - mutation.mutate( - { - surveyId: surveyData.uuid, - }, - { - onSuccess, - } - ); + // const onSuccess = () => { + // queryClient.clear(); + // }; + // mutation.mutate( + // { + // surveyId: surveyData.uuid, + // }, + // { + // onSuccess, + // } + // ); }, []); - if (mutation.isLoading && !mutation.isIdle) { + if (isLoading) { return ; } - if (mutation.isError) return
An error occured...
; + // if (mutation.isError) return
An error occured...
; //questionid in answers uuid in surveys needs to be matched - const answers = mutation?.data?.answers; + const answers = selecedSurveyData.Service[0].attributes; + answers?.map((element)=>{ + element.uuid = element.id; + element.questionId = element.attributeCode; + element.answer = [JSON.parse(element.value)]; + element.citizenId = selecedSurveyData.Service.accountId; + }) const formDefaultValues = {}; answers?.map((ans) => { if (ans?.answer.length === 1) formDefaultValues[ans?.questionId] = ans?.answer[0]; @@ -48,7 +64,7 @@ const ShowSurvey = ({ location }) => { // } // }) - return ; + return ; }; export default ShowSurvey; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/SurveyList.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/SurveyList.js index c8565cc8031..a9b4866a039 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/SurveyList.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/citizen/CitizenSurvey/SurveyList.js @@ -1,5 +1,5 @@ import { Header, Loader } from "@egovernments/digit-ui-react-components"; -import React from "react"; +import React, { useState, useEffect } from "react"; import { useTranslation } from "react-i18next"; import { useHistory } from "react-router-dom"; import SurveyListCard from "../../../components/Surveys/SurveyListCard"; @@ -15,39 +15,143 @@ const SurveyList = () => { const { t } = useTranslation(); const history = useHistory(); const tenantIds = Digit.ULBService.getCitizenCurrentTenant(); + const user = Digit.UserService.getUser(); + + let ServiceDefinitionCriteria = { + "tenantId": tenantIds, + "code": [], + "module": ["engagement"], + } + + let Pagination = { + "limit": 100, + "offSet": 0, + "sortBy": "string", + "order": "asc" + } - const { data, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useSearch( - { tenantIds }, + let ServiceCriteria = { + tenantId: tenantIds, + ids: [], + serviceDefIds: [], + referenceIds: [], + accountId: user?.info?.uuid || "dda30b0a-ae2d-4f87-8b52-d1fc73ed7643", + } + const { data: selecedSurveyData } = Digit.Hooks.survey.useSelectedSurveySearch({ServiceCriteria},{}) + const { data, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useCfdefinitionsearch( + { ServiceDefinitionCriteria, Pagination }, { - select: ({ Surveys }) => { + select: ({ ServiceDefinition }) => { // const allSurveys = Surveys.map((survey) => ({ hasResponded: false, responseStatus: "CS_SURVEY_YT_TO_RESPOND", ...survey })); - - const allSurveys = Surveys.map((survey) => { - const isSurveyActive = isActive(survey.startDate, survey.endDate); - let resStatus = ""; - if (isSurveyActive && survey.hasResponded) resStatus = "CS_SURVEY_RESPONDED"; - else if (isSurveyActive) resStatus = "CS_SURVEY_YT_TO_RESPOND"; - else resStatus = "CANNOT_RESPOND_MSG"; - return { hasResponded: false, responseStatus: resStatus, ...survey }; - }); - //why hasResoponded always set to false here + // const allSurveys = Surveys.map((survey) => { + // const isSurveyActive = isActive(survey.startDate, survey.endDate); + // let resStatus = ""; + // if (isSurveyActive && survey.hasResponded) resStatus = "CS_SURVEY_RESPONDED"; + // else if (isSurveyActive) resStatus = "CS_SURVEY_YT_TO_RESPOND"; + // else resStatus = "CANNOT_RESPOND_MSG"; + // return { hasResponded: false, responseStatus: resStatus, ...survey }; + // }); const activeSurveysList = []; const inactiveSurveysList = []; - for (let survey of allSurveys) { - if (survey.status === "ACTIVE" && isActive(survey.startDate, survey.endDate)) { - activeSurveysList.push(survey); - } else { - inactiveSurveysList.push(survey); + let surveyListId = []; + ServiceDefinition?.map((element, index) => { + surveyListId.push(element.code) + if (element.isActive && isActive(element.additionalDetails.startDate, element.additionalDetails.endDate)) { + element.hasResponded = false; + element.responseStatus = "CS_SURVEY_YT_TO_RESPOND"; + activeSurveysList.push(element); + } else if (element.additionalDetails.endDate) { + element.hasResponded = false; + element.responseStatus = "CANNOT_RESPOND_MSG"; + inactiveSurveysList.push(element) } - } + }) + + activeSurveysList.reverse(); + inactiveSurveysList.reverse(); + return { activeSurveysList, inactiveSurveysList, + surveyListId }; }, } ); + ( async() => { + if (data?.surveyListId && selecedSurveyData){ + data?.activeSurveysList.map((element,index)=>{ + selecedSurveyData.Service.map((ele)=>{ + if (element.code === ele.referenceId ){ + data.activeSurveysList[index].hasResponded = true; + data.activeSurveysList[index].responseStatus = "CS_SURVEY_RESPONDED"; + } + }) + }) + + // data?.inactiveSurveysList.map((element,index)=>{ + // selecedSurveyData.Service.map((ele)=>{ + // if (element.code === ele.referenceId ){ + // data.inactiveSurveysList[index].hasResponded = true; + // data.inactiveSurveysList[index].responseStatus = "CS_SURVEY_RESPONDED"; + // } + // }) + // }) + } + })(); + + // useEffect(()=>{ + // if (data?.surveyListId && selecedSurveyData){ + // data?.surveyListId.map((element,index)=>{ + // selecedSurveyData.Service.map((ele)=>{ + // if (element === ele.referenceId && data?.activeSurveysList[index]?.responseStatus){ + // data.activeSurveysList[index].hasResponded = true; + // data.activeSurveysList[index].responseStatus = "CS_SURVEY_RESPONDED"; + // } + + // }) + + // }) + // } + // },[data,selecedSurveyData]) + + + + // const { data, isLoading: isLoadingSurveys } = Digit.Hooks.survey.useSearch( + // { tenantIds }, + // { + // select: ({ Surveys }) => { + // // const allSurveys = Surveys.map((survey) => ({ hasResponded: false, responseStatus: "CS_SURVEY_YT_TO_RESPOND", ...survey })); + + // const allSurveys = Surveys.map((survey) => { + // const isSurveyActive = isActive(survey.startDate, survey.endDate); + // let resStatus = ""; + // if (isSurveyActive && survey.hasResponded) resStatus = "CS_SURVEY_RESPONDED"; + // else if (isSurveyActive) resStatus = "CS_SURVEY_YT_TO_RESPOND"; + // else resStatus = "CANNOT_RESPOND_MSG"; + // return { hasResponded: false, responseStatus: resStatus, ...survey }; + // }); + // //why hasResoponded always set to false here + // const activeSurveysList = []; + // const inactiveSurveysList = []; + // for (let survey of allSurveys) { + // if (survey.status === "ACTIVE" && isActive(survey.startDate, survey.endDate)) { + // activeSurveysList.push(survey); + // } else { + // inactiveSurveysList.push(survey); + // } + // } + // return { + // activeSurveysList, + // inactiveSurveysList, + // }; + // }, + // } + // ); + + + // const handleCardClick = (details) => { // history.push("/digit-ui/citizen/engagement/surveys/fill-survey", details); // }; @@ -56,7 +160,7 @@ const SurveyList = () => { const handleCardClick = (details) => { if (!details.hasResponded) { - history.push(`/digit-ui/citizen/engagement/surveys/fill-survey?applicationNumber=${details?.uuid}&tenantId=${details?.tenantId}`, details); + history.push(`/digit-ui/citizen/engagement/surveys/fill-survey?applicationNumber=${details?.code}&tenantId=${details?.tenantId}`, details); } else { history.push("/digit-ui/citizen/engagement/surveys/show-survey", details); } @@ -68,19 +172,19 @@ const SurveyList = () => { return (
-
{`${t("CS_COMMON_SURVEYS")} (${data?.activeSurveysList.length})`}
+
{`${t("CS_COMMON_SURVEYS")} (${data?.activeSurveysList?.length})`}
{data?.activeSurveysList && data.activeSurveysList.length ? ( data.activeSurveysList.map((data, index) => { return (
handleCardClick(data)} /> @@ -93,19 +197,19 @@ const SurveyList = () => {
)} -
{`${t("CS_COMMON_INACTIVE_SURVEYS")} (${data.inactiveSurveysList.length})`}
+
{`${t("CS_COMMON_INACTIVE_SURVEYS")} (${data?.inactiveSurveysList?.length})`}
{data?.inactiveSurveysList && data.inactiveSurveysList.length ? ( data.inactiveSurveysList.map((data, index) => { return (
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/index.js index 007447839d2..0a74d65916a 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/index.js @@ -17,11 +17,19 @@ const Inbox = ({ parentRoute }) => { .filter((ulb) => userInfo?.roles?.some((role) => role?.tenantId === ulb?.code)) const statuses = [ - { code: "ALL", name: `${t("ES_COMMON_ALL")}` }, - { code: "ACTIVE", name: `${t("ES_COMMON_ACTIVE")}` }, - { code: "INACTIVE", name: `${t("ES_COMMON_INACTIVE")}` } + { code: "All", name: `${t("ES_COMMON_ALL")}` }, + { code: "Active", name: `${t("ES_COMMON_ACTIVE")}` }, + { code: "Inactive", name: `${t("ES_COMMON_INACTIVE")}` } ] + const isActive = (startDate, endDate) => { + const currentDate = new Date().getTime(); + if (startDate < currentDate && currentDate <= endDate) { + return true; + } + return false; + }; + const searchFormDefaultValues = { // tenantIds: tenantId, tenantIds:userUlbs[0], @@ -39,23 +47,58 @@ const Inbox = ({ parentRoute }) => { sortOrder: "DESC" } + const ServiceDefinitionCriteria = { + "tenantId": tenantId, + "code": [], + "module": ["engagement"], + "postedBy":"" + } + function formReducer(state, payload) { switch (payload.action) { case "mutateSearchForm": - Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, searchForm: payload.data }) - return { ...state, searchForm: payload.data }; + Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, searchForm: payload.data , ServiceDefinitionCriteria:{ + "code": [], + "postedBy": null, + "module": ["engagement"], + }}) + return { ...state, searchForm: payload.data,ServiceDefinitionCriteria: {"tenantId": tenantId, + "code": [], + "postedBy": null, + "module": ["engagement"], + } }; case "mutateFilterForm": - Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, filterForm: payload.data }) - return { ...state, filterForm: payload.data }; + // Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, filterForm: payload.data }) + // return { ...state, filterForm: payload.data }; + Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, filterForm: payload.data, ServiceDefinitionCriteria:{ + "code": [state.searchForm.title], + "postedBy": state.searchForm.postedBy, + "module": ["engagement"], + "status": payload.data.status.code + }}) + return { ...state, filterForm: payload.data, ServiceDefinitionCriteria: {"tenantId": tenantId, + "code": [state.searchForm.title], + "postedBy": state.searchForm.postedBy, + "module": ["engagement"], + "status": payload.data.status.code + } }; case "mutateTableForm": Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, tableForm: payload.data }) return { ...state, tableForm: payload.data }; + case "mutateSearchDefinationForm": + Digit.SessionStorage.set("CITIZENSURVEY.INBOX", { ...state, searchForm: payload.data, ServiceDefinitionCriteria: {"tenantId": tenantId, + "code": [payload.data.title], + "postedBy": payload.data.postedBy, + "module": ["engagement"]} }) + return { ...state, searchForm: payload.data, ServiceDefinitionCriteria: {"tenantId": tenantId, + "code": [payload.data.title], + "postedBy": payload.data.postedBy, + "module": ["engagement"]} }; default: break; } } const InboxObjectInSessionStorage = Digit.SessionStorage.get("CITIZENSURVEY.INBOX") - const onSearchFormReset = (setSearchFormValue) => { setSearchFormValue("postedBy", "") setSearchFormValue("title", "") @@ -72,18 +115,61 @@ const Inbox = ({ parentRoute }) => { return InboxObjectInSessionStorage || { filterForm: filterFormDefaultValues, searchForm: searchFormDefaultValues, - tableForm: tableOrderFormDefaultValues + tableForm: tableOrderFormDefaultValues, + ServiceDefinitionCriteria:ServiceDefinitionCriteria, } } - , [Object.values(InboxObjectInSessionStorage?.filterForm || {}), Object.values(InboxObjectInSessionStorage?.searchForm || {}), Object.values(InboxObjectInSessionStorage?.tableForm || {})]) + , [Object.values(InboxObjectInSessionStorage?.ServiceDefinitionCriteria || {}),Object.values(InboxObjectInSessionStorage?.filterForm || {}), Object.values(InboxObjectInSessionStorage?.searchForm || {}), Object.values(InboxObjectInSessionStorage?.tableForm || {})]) const [formState, dispatch] = useReducer(formReducer, formInitValue) + const onPageSizeChange = (e) => { dispatch({ action: "mutateTableForm", data: { ...formState.tableForm, limit: e.target.value } }) } + let ServiceCriteria = { + tenantId: userUlbs[0].code, + ids: [], + serviceDefIds: [], + referenceIds: [], + } + const { data: selecedSurveyData } = Digit.Hooks.survey.useSelectedSurveySearch({ServiceCriteria},{}) - const { data: { Surveys, TotalCount } = {}, isLoading: isInboxLoading, } = Digit.Hooks.survey.useSurveyInbox(formState) + // const { data: { Surveys, TotalCount } = {}, isLoading: isInboxLoading, } = Digit.Hooks.survey.useSurveyInbox(formState) + const { data: surveyList, isLoading: isSurveyListLoading } = Digit.Hooks.survey.useCfdefinitionsearch({ServiceDefinitionCriteria:formState.ServiceDefinitionCriteria, Pagination:formState.tableForm}) + + if (surveyList?.ServiceDefinition){ + surveyList?.ServiceDefinition.map((element,index)=>{ + element.uuid = element.code; + element.tenantIds = null; + element.title = element.code; + element.status = isActive(element.additionalDetails.startDate,element.additionalDetails.endDate)?"ACTIVE":"INACTIVE";; + element.description = element.additionalDetails.description; + element.startDate = element.additionalDetails.startDate || null; + element.endDate = element.additionalDetails.endDate || null; + element.active = true; + element.insertQuestionsForUpdate = null; + element.postedBy = element.postedBy || ""; + element.answersCount = 0; + element.hasResponded = ""; + + }) + } + + ( async() => { + if (surveyList && selecedSurveyData){ + surveyList?.ServiceDefinition?.map((element)=>{ + selecedSurveyData?.Service?.map((ele)=>{ + if (element.code === ele.referenceId){ + element.answersCount ++; + } + }) + }) + } + + + })(); + const PropsForInboxLinks = { logoIcon: , @@ -111,26 +197,30 @@ const Inbox = ({ parentRoute }) => { const onSearchFormSubmit = (data) => { //setting the offset to 0(In case searched from page other than 1) - dispatch({ action: "mutateTableForm", data: { ...formState.tableForm, offset:0 } }) + // dispatch({ action: "mutateTableForm", data: { ...formState.tableForm, offset:0 } }) + + // data.hasOwnProperty("") ? delete data?.[""] : null + // dispatch({ action: "mutateSearchForm", data }) + dispatch({ action: "mutateSearchDefinationForm", data }); - data.hasOwnProperty("") ? delete data?.[""] : null - dispatch({ action: "mutateSearchForm", data }) - } + } const onFilterFormSubmit = (data) => { - data.hasOwnProperty("") ? delete data?.[""] : null - dispatch({ action: "mutateFilterForm", data }) + // data.hasOwnProperty("") ? delete data?.[""] : null + // dispatch({ action: "mutateFilterForm", data }) + dispatch({ action: "mutateFilterForm", data }); } - const propsForSearchForm = { SearchFormFields, onSearchFormSubmit, searchFormDefaultValues: formState?.searchForm, resetSearchFormDefaultValues: searchFormDefaultValues, onSearchFormReset } + + const propsForSearchForm = { SearchFormFields, onSearchFormSubmit, searchFormDefaultValues: formState?.ServiceDefinitionCriteria?.code[0], resetSearchFormDefaultValues: searchFormDefaultValues, onSearchFormReset } const propsForFilterForm = { FilterFormFields, onFilterFormSubmit, filterFormDefaultValues: formState?.filterForm, resetFilterFormDefaultValues: filterFormDefaultValues, onFilterFormReset } - const propsForInboxTable = useInboxTableConfig({ ...{ parentRoute, onPageSizeChange, formState, totalCount: TotalCount, table: Surveys, noResultsMessage: "CS_SURVEYS_NOT_FOUND", dispatch, inboxStyles:{overflowX:"scroll", overflowY:"hidden"} } }) + const propsForInboxTable = useInboxTableConfig({ ...{ parentRoute, onPageSizeChange, formState, totalCount: "", table: surveyList?.ServiceDefinition||[], noResultsMessage: "CS_SURVEYS_NOT_FOUND", dispatch, inboxStyles:{overflowX:"scroll", overflowY:"hidden"} } }) - const propsForInboxMobileCards = useInboxMobileCardsData({parentRoute, table:Surveys}) + const propsForInboxMobileCards = useInboxMobileCardsData({parentRoute, table:surveyList?.ServiceDefinition||[]}) - return + return } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxMobileDataCard.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxMobileDataCard.js index 1962cd67755..cb4d405c300 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxMobileDataCard.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxMobileDataCard.js @@ -15,7 +15,9 @@ const useInboxMobileCardsData = ({parentRoute, table }) => { [t("EVENTS_POSTEDBY_LABEL")]: postedBy, })) - return ({ data:dataForMobileInboxCards, linkPrefix:`${parentRoute}/inbox/`, serviceRequestIdKey:t("TL_COMMON_TABLE_COL_APP_NO")}) + + + return ({ data:dataForMobileInboxCards, linkPrefix:`${parentRoute}/surveys/inbox/details/`, serviceRequestIdKey:t("CS_SURVEY_TITLE")}) } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxTableConfig.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxTableConfig.js index 7fe37529e5e..6c2787ff956 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxTableConfig.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/Inbox/useInboxTableConfig.js @@ -58,7 +58,7 @@ const useInboxTableConfig = ({ parentRoute, onPageSizeChange, formState, totalCo }, { Header: t("EVENTS_POSTEDBY_LABEL"), - accessor: (row) => row.postedBy, + accessor: (row) => row.additionalDetails.postedBy, }, { Header: t("CS_SURVEY_RESULTS"), diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/NewSurvey.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/NewSurvey.js index dbd9663e177..fd16d51db42 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/NewSurvey.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/NewSurvey.js @@ -62,21 +62,66 @@ const NewSurveys = () => { const onSubmit = (data) => { const { collectCitizenInfo, title, description, tenantIds, fromDate, toDate, fromTime, toTime, questions } = data; const mappedQuestions = mapQuestions(questions); + let serveyMappedQuestions = []; + let userToken = window.localStorage.getItem("token"); + let userInfo = JSON.parse(window.localStorage.getItem("user-info")); + questions && questions.length && questions.map((element,index)=>{ + serveyMappedQuestions.push({ + "tenantId": tenantIds?.[0]?.code, + "code": element.formConfig.questionStatement, + "dataType": "String", + "values": null, + "required": element.formConfig.required, + "isActive": true, + "reGex": null, + "order": index++, + "additionalDetails": { + type: element.formConfig.type.i18Key, + options: element.formConfig.options || ["NA"] + } + }) + }) const details = { - SurveyEntity: { - tenantIds: tenantIds.map(({code})=>(code)), - title, - description, - startDate: new Date(`${fromDate} ${fromTime}`).getTime(), - endDate: new Date(`${toDate} ${toTime}`).getTime(), - questions:mappedQuestions + // SurveyEntity: { + // tenantIds: tenantIds.map(({code})=>(code)), + // title, + // description, + // startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + // endDate: new Date(`${toDate} ${toTime}`).getTime(), + // questions:mappedQuestions + // }, + + ServiceDefinition: { + tenantId:tenantIds?.[0]?.code, + module:"engagement", + code: title, + isActive: true, + additionalDetails:{ + title: title, + description: description, + startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + endDate: new Date(`${toDate} ${toTime}`).getTime(), + postedBy: userInfo.name, + }, + clientId:userInfo.uuid, + attributes:serveyMappedQuestions }, + }; - + try{ - let filters = {tenantIds : tenantIds?.[0]?.code, title : title} - Digit.Surveys.search(filters).then((ob) => { - if(ob?.Surveys?.length>0) + // let filters = {tenantIds : tenantIds?.[0]?.code, title : title} + let searchDetails = { + ServiceDefinitionCriteria:{ + "tenantId": tenantId, + "code": [title], + "module": ["engagement"] + } + + } + + Digit.Surveys.cfdefinitionsearch(searchDetails).then((ob) => { + if(ob?.ServiceDefinition?.length>0) { setShowToast({ key: true, label: "SURVEY_SAME_NAME_SURVEY_ALREADY_PRESENT" }); } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyDetails.js index 308bf79ed49..f83c413530f 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyDetails.js @@ -31,6 +31,30 @@ const TypeAnswerEnum = { TIME_ANSWER_TYPE: "Time", }; +const isActive = (startDate, endDate) => { + const currentDate = new Date().getTime(); + if (startDate < currentDate && currentDate <= endDate) { + return true; + } + return false; +}; + +const setSurveyQuestion = (surveyObj) =>{ + let questions = []; + surveyObj.attributes.map((element)=>{ + questions.push({ + questionStatement : element.code, + type : element.additionalDetails.type, + required : element.required, + options : element.additionalDetails.options, + uuid : element.code, + surveyId : surveyObj.code, + status: "ACTIVE" + }) + }) + return questions; +} + const SurveyDetails = ({ location, match }) => { let isMobile = window.Digit.Utils.browser.isMobile(); const { id } = useParams(); @@ -65,36 +89,66 @@ const SurveyDetails = ({ location, match }) => { return (sHours + ":" + sMinutes); } - const { isLoading, data: surveyData } = Digit.Hooks.survey.useSearch( - { tenantIds: tenantIdForInboxSearch, uuid: id }, - { - select: (data) => { - const surveyObj = data?.Surveys?.[0]; - return { - //tenantIds: { code: surveyObj.tenantId }, - uuid: surveyObj.uuid, - title: surveyObj.title, - description: surveyObj.description, - fromDate: format(new Date(surveyObj.startDate), "yyyy-MM-dd"), - toDate: format(new Date(surveyObj.endDate), "yyyy-MM-dd"), - fromTime: convertTime12To24(new Date(surveyObj.startDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), - toTime: convertTime12To24(new Date(surveyObj.endDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), - questions: surveyObj.questions.map(({ questionStatement, type, required, options, uuid, surveyId, qorder, status }) => ({ - questionStatement, - type: /*TypeAnswerEnum[type]*/type, - required, - options, - uuid, - surveyId, - qorder, - status - })), - status: surveyObj.status, - tenantId: { code: surveyObj.tenantId }, - }; - }, - } - ); + let ServiceDefinitionCriteria = { + tenantId: Digit.ULBService.getCurrentTenantId(), + code: [id], + // code:["test 2406231131"], + module: ["engagement"] + } + + const { isLoading, data: surveyData } = Digit.Hooks.survey.useCfdefinitionsearchresult({ServiceDefinitionCriteria},{ + select: (data) => { + const surveyObj = data?.ServiceDefinition?.[0]; + return { + uuid: surveyObj.code, + title: surveyObj.code, + description: surveyObj.additionalDetails.description, + fromDate: format(new Date(surveyObj.additionalDetails.startDate), "yyyy-MM-dd"), + toDate: format(new Date(surveyObj.additionalDetails.endDate), "yyyy-MM-dd"), + fromTime: convertTime12To24(new Date(surveyObj.additionalDetails.startDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), + toTime: convertTime12To24(new Date(surveyObj.additionalDetails.endDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), + questions: setSurveyQuestion(surveyObj), + status: isActive(surveyObj.additionalDetails.startDate,surveyObj.additionalDetails.endDate)?"ACTIVE":"INACTIVE", + tenantId: { code: surveyObj.tenantId }, + additionalDetails: surveyObj.additionalDetails, + attributes: surveyObj.attributes, + clientId: surveyObj.clientId, + code: surveyObj.code, + id: surveyObj.id + }; + }, + }) + + // const { data: surveyData } = Digit.Hooks.survey.useSearch( + // { tenantIds: tenantIdForInboxSearch, uuid: id }, + // { + // select: (data) => { + // const surveyObj = data?.Surveys?.[0]; + // return { + // //tenantIds: { code: surveyObj.tenantId }, + // uuid: surveyObj.uuid, + // title: surveyObj.title, + // description: surveyObj.description, + // fromDate: format(new Date(surveyObj.startDate), "yyyy-MM-dd"), + // toDate: format(new Date(surveyObj.endDate), "yyyy-MM-dd"), + // fromTime: convertTime12To24(new Date(surveyObj.startDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), + // toTime: convertTime12To24(new Date(surveyObj.endDate).toLocaleString("en-IN",{hour: "numeric", minute:"numeric",hour12:true})), + // questions: surveyObj.questions.map(({ questionStatement, type, required, options, uuid, surveyId, qorder, status }) => ({ + // questionStatement, + // type: /*TypeAnswerEnum[type]*/type, + // required, + // options, + // uuid, + // surveyId, + // qorder, + // status + // })), + // status: surveyObj.status, + // tenantId: { code: surveyObj.tenantId }, + // }; + // }, + // } + // ); const isSurveyActive = useMemo(() => { const surveyStartTime = new Date(`${surveyData?.fromDate} ${surveyData?.fromTime}`).getTime(); @@ -133,24 +187,59 @@ const SurveyDetails = ({ location, match }) => { const onEdit = (data) => { const { collectCitizenInfo, title, description, tenantIds, fromDate, toDate, fromTime, toTime, questions } = data; const mappedQuestions = mapQuestions(questions,surveyData); + let serveyMappedQuestions = []; + let userToken = window.localStorage.getItem("token") + questions && questions.length && questions.map((element,index)=>{ + serveyMappedQuestions.push({ + "tenantId": tenantIds?.[0]?.code, + "code": element.formConfig.questionStatement, + "dataType": "String", + "values": null, + "required": element.formConfig.required, + "isActive": true, + "reGex": null, + "order": index++, + "additionalDetails": { + type: element.formConfig.type.i18Key, + options: element.formConfig.options || ["NA"] + } + }) + }) const details = { - SurveyEntity: { - uuid: surveyData.uuid, - //tenantIds: tenantIds.map(({ code }) => code), - tenantId: tenantIds[0]?.code ? tenantIds[0]?.code : surveyData.tenantId.code, - title, - description, - startDate: new Date(`${fromDate} ${fromTime}`).getTime(), - endDate: new Date(`${toDate} ${toTime}`).getTime(), - questions: mappedQuestions, - status:isSurveyActive?"ACTIVE":"INACTIVE", - // active:true, - // answersCount:0, - // postedBy:"BPAREG Approver", - //lastmodifiedby:"BPAREG Approver", - //lastmodifiedtime:"1645074240234" - //These are not required to update, only status was required that we were not sending.. - }, + // SurveyEntity: { + // uuid: surveyData.uuid, + // //tenantIds: tenantIds.map(({ code }) => code), + // tenantId: tenantIds[0]?.code ? tenantIds[0]?.code : surveyData.tenantId.code, + // title, + // description, + // startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + // endDate: new Date(`${toDate} ${toTime}`).getTime(), + // questions: mappedQuestions, + // status:isSurveyActive?"ACTIVE":"INACTIVE", + // // active:true, + // // answersCount:0, + // // postedBy:"BPAREG Approver", + // //lastmodifiedby:"BPAREG Approver", + // //lastmodifiedtime:"1645074240234" + // //These are not required to update, only status was required that we were not sending.. + // }, + + ServiceDefinition: { + tenantId: surveyData.tenantId.code, + code: title, + module: "engagement", + isActive: true, + attributes:serveyMappedQuestions, + additionalDetails:{ + title: title, + description: description, + startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + endDate: new Date(`${toDate} ${toTime}`).getTime(), + postedBy: surveyData.additionalDetails.postedBy + }, + clientId: surveyData.clientId, + id: surveyData.id, + } }; try{ @@ -171,8 +260,29 @@ const SurveyDetails = ({ location, match }) => { }; const handleDelete = () => { + // const details = { + // SurveyEntity: { ...surveyData, tenantId: tenantId?.code ? tenantId?.code : tenantId }, + // }; + // history.push("/digit-ui/employee/engagement/surveys/delete-response", details); const details = { - SurveyEntity: { ...surveyData, tenantId: tenantId?.code ? tenantId?.code : tenantId }, + // SurveyEntity: { ...surveyData, + // tenantId, + // questions: surveyData.questions.map(filterQuestion), + // status: "INACTIVE", + // }, + ServiceDefinition: { + tenantId: surveyData.tenantId.code, + code: surveyData.code, + module: "engagement", + isActive: false, + attributes: surveyData.attributes, + additionalDetails: { + ...surveyData.additionalDetails, + }, + clientId: surveyData.clientId, + id: surveyData.id + + } }; history.push("/digit-ui/employee/engagement/surveys/delete-response", details); }; @@ -181,25 +291,55 @@ const SurveyDetails = ({ location, match }) => { const handleMarkActive = (data) => { const { fromDate, toDate, fromTime, toTime } = data; const details = { - SurveyEntity: { - ...surveyData, - status: "ACTIVE", - startDate: new Date(`${fromDate} ${fromTime}`).getTime(), - endDate: new Date(`${toDate} ${toTime}`).getTime(), - questions: surveyData.questions.map(filterQuestion), - tenantId, - }, + // SurveyEntity: { + // ...surveyData, + // status: "ACTIVE", + // startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + // endDate: new Date(`${toDate} ${toTime}`).getTime(), + // questions: surveyData.questions.map(filterQuestion), + // tenantId, + // }, + ServiceDefinition: { + tenantId: surveyData.tenantId.code, + code: surveyData.code, + module: "engagement", + isActive: true, + attributes: surveyData.attributes, + additionalDetails: { + ...surveyData.additionalDetails, + endDate: new Date(`${toDate} ${toTime}`).getTime(), + startDate: new Date(`${fromDate} ${fromTime}`).getTime(), + }, + clientId: surveyData.clientId, + id: surveyData.id, + } + }; history.push("/digit-ui/employee/engagement/surveys/update-response", details); }; const handleMarkInactive = () => { const details = { - SurveyEntity: { ...surveyData, - tenantId, - questions: surveyData.questions.map(filterQuestion), - status: "INACTIVE", - }, + // SurveyEntity: { ...surveyData, + // tenantId, + // questions: surveyData.questions.map(filterQuestion), + // status: "INACTIVE", + // }, + ServiceDefinition: { + tenantId: surveyData.tenantId.code, + code: surveyData.code, + module: "engagement", + isActive: true, + attributes: surveyData.attributes, + additionalDetails: { + ...surveyData.additionalDetails, + startDate:null, + endDate:null + + }, + clientId: surveyData.clientId, + id: surveyData.id, + } }; history.push("/digit-ui/employee/engagement/surveys/update-response", details); }; @@ -216,7 +356,6 @@ const SurveyDetails = ({ location, match }) => { if (isLoading) return ; - return (
{t("CS_COMMON_SURVEYS")}
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyResults.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyResults.js index 05750696848..a907bfebdea 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyResults.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/SurveyResults.js @@ -6,6 +6,28 @@ import { ActionBar, Card, SubmitBar, Menu,Loader } from "@egovernments/digit-ui- import { format } from "date-fns"; import SurveyResultsView from '../../../components/Surveys/ResultsView/SurveyResultsView'; +const isActive = (startDate, endDate) => { + const currentDate = new Date().getTime(); + if (startDate < currentDate && currentDate <= endDate) { + return true; + } + return false; +}; + +const setSurveyQuestion = (surveyObj) =>{ + let questions = []; + surveyObj.attributes.map((element)=>{ + questions.push({ + questionStatement : element.code, + type : TypeAnswerEnum[element.additionalDetails.type], + required : element.required, + options : element?.additionalDetails?.options || ["NA"], + uuid : element.code, + surveyId : surveyObj.code + }) + }) + return questions; +} const TypeAnswerEnum = { SHORT_ANSWER_TYPE: "Short Answer", @@ -19,54 +41,108 @@ const TypeAnswerEnum = { const SurveyResults = () => { const tenantId = Digit.ULBService.getCurrentTenantId(); const params = useParams(); - const mutation = Digit.Hooks.survey.useShowResults(); + // const mutation = Digit.Hooks.survey.useShowResults(); const queryClient = useQueryClient(); + const user = Digit.UserService.getUser(); + + let ServiceDefinitionCriteria = { + tenantId: Digit.ULBService.getCurrentTenantId(), + code: [params.id], + module: ["engagement"] + } + + let ServiceCriteria = { + tenantId: Digit.ULBService.getCurrentTenantId(), + ids: [], + serviceDefIds: [], + referenceIds: [params.id], + } + + const { data: selecedSurveyresults } = Digit.Hooks.survey.useSelectedSurveySearch({ServiceCriteria},{}) + if (selecedSurveyresults?.Service?.length){ + let questions = [] + selecedSurveyresults?.Service.map((element)=>{ + element.attributes.map((ele)=>{ + questions.push({ + answer: typeof(JSON.parse(ele.value)) === "string" ? [JSON.parse(ele.value)] : JSON.parse(ele.value), + citizenId: element.accountId, + questionId: ele.attributeCode, + uuid: ele.id, + auditDetails: element.auditDetails + }) + }) + + }) + selecedSurveyresults.answers = questions; + + } + + const { data: selecedSurveyData, isLoading } = Digit.Hooks.survey.useCfdefinitionsearchresult({ServiceDefinitionCriteria},{ + select: (data) => { + const surveyObj = data?.ServiceDefinition?.[0]; + return{ + // uuid: surveyObj.code, + title: surveyObj.code, + description: surveyObj.additionalDetails.description, + fromDate: format(new Date(surveyObj.additionalDetails.startDate), "yyyy-MM-dd"), + toDate: format(new Date(surveyObj.additionalDetails.endDate), "yyyy-MM-dd"), + fromTime: format(new Date(surveyObj.additionalDetails.startDate), "hh:mm"), + toTime: format(new Date(surveyObj.additionalDetails.endDate), "hh:mm"), + questions:setSurveyQuestion(surveyObj), + status: isActive(surveyObj.additionalDetails.startDate,surveyObj.additionalDetails.endDate)?"ACTIVE":"INACTIVE", + answersCount:1, + } + + } + }) + + useEffect(() => { - const onSuccess = () => { - queryClient.clear(); - }; - mutation.mutate({ - surveyId:params.id - }, { - onSuccess, - }); + // const onSuccess = () => { + // queryClient.clear(); + // }; + // mutation.mutate({ + // surveyId:params.id + // }, { + // onSuccess, + // }); }, []); - const { isLoading, data: surveyData } = Digit.Hooks.survey.useSearch( - { tenantIds: tenantId, uuid: params.id }, - { - select: (data) => { - const surveyObj = data?.Surveys?.[0]; - return { - //tenantIds: { code: surveyObj.tenantId }, - uuid: surveyObj.uuid, - title: surveyObj.title, - description: surveyObj.description, - fromDate: format(new Date(surveyObj.startDate), "yyyy-MM-dd"), - toDate: format(new Date(surveyObj.endDate), "yyyy-MM-dd"), - fromTime: format(new Date(surveyObj.startDate), "hh:mm"), - toTime: format(new Date(surveyObj.endDate), "hh:mm"), - questions: surveyObj.questions.map(({ questionStatement, type, required, options, uuid, surveyId }) => ({ - questionStatement, - type: TypeAnswerEnum[type], - required, - options, - uuid, - surveyId - })), - status: surveyObj.status, - answersCount:surveyObj.answersCount, - }; - }, - } - ); + // const { data: surveyData } = Digit.Hooks.survey.useSearch( + // { tenantIds: tenantId, uuid: params.id }, + // { + // select: (data) => { + // const surveyObj = data?.Surveys?.[0]; + // return { + // //tenantIds: { code: surveyObj.tenantId }, + // // uuid: surveyObj.uuid, + // title: surveyObj.title, + // description: surveyObj.description, + // fromDate: format(new Date(surveyObj.startDate), "yyyy-MM-dd"), + // toDate: format(new Date(surveyObj.endDate), "yyyy-MM-dd"), + // fromTime: format(new Date(surveyObj.startDate), "hh:mm"), + // toTime: format(new Date(surveyObj.endDate), "hh:mm"), + // questions: surveyObj.questions.map(({ questionStatement, type, required, options, uuid, surveyId }) => ({ + // questionStatement, + // type: TypeAnswerEnum[type], + // required, + // options, + // uuid, + // surveyId + // })), + // status: surveyObj.status, + // answersCount:surveyObj.answersCount, + // }; + // }, + // } + // ); + if(isLoading) return // else if(mutation.isLoading) return // //if(mutation.isError) return
An error occured...
- - return + return } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/create.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/create.js index 32d6e8be529..d177932def1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/create.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/create.js @@ -4,7 +4,7 @@ import React, { useEffect,useState } from "react"; import { useTranslation } from "react-i18next"; import { Link,useHistory } from "react-router-dom"; const getMessage = (mutation) => { - if (mutation.isSuccess) return mutation.data?.Surveys?.[0]?.uuid; + if (mutation.isSuccess) return mutation.data?.ServiceDefinition?.[0]?.id; return ""; }; @@ -24,7 +24,7 @@ const Acknowledgement = (props) => { const queryClient = useQueryClient(); const { t } = useTranslation(); const tenantId = Digit.ULBService.getCurrentTenantId(); - const mutation = Digit.Hooks.survey.useCreate(); + const mutation = Digit.Hooks.survey.useServeyCreateDef(); const { state } = props.location; const history = useHistory(); const [isActionClicked,setIsActionClicked] = useState(false) diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/delete.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/delete.js index 15cba08d0ed..9ff39c9d5a1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/delete.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/delete.js @@ -34,7 +34,8 @@ const Response = (props) => { const queryClient = useQueryClient(); const { t } = useTranslation(); const tenantId = Digit.ULBService.getCurrentTenantId(); - const mutation = Digit.Hooks.survey.useDelete(); + // const mutation = Digit.Hooks.survey.useDelete(); + const mutation = Digit.Hooks.survey.useUpdateSurvey(); const { state } = props.location; useEffect(() => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/update.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/update.js index 00f5e1f22a8..9085106fe79 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/update.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/engagement/src/pages/employee/CitizenSurveys/responses/update.js @@ -5,10 +5,7 @@ import { useTranslation } from "react-i18next"; import { Link } from "react-router-dom"; const getMessage = (mutation) => { - if (mutation.isSuccess && mutation?.data?.Surveys?.[0]?.uuid){ - return mutation?.data?.Surveys?.[0]?.uuid - } - if (mutation.isSuccess) return mutation.data?.Documents?.[0]?.uuid; + if (mutation.isSuccess) return mutation.data?.ServiceDefinition?.[0]?.id; return ""; }; @@ -16,10 +13,10 @@ const BannerPicker = (props) => { const { t } = useTranslation(); return ( ); }; @@ -28,7 +25,7 @@ const Response = (props) => { const queryClient = useQueryClient(); const { t } = useTranslation(); const tenantId = Digit.ULBService.getCurrentTenantId(); - const mutation = Digit.Hooks.survey.useUpdate(); + const mutation = Digit.Hooks.survey.useUpdateSurvey(); const { state } = props.location; useEffect(() => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/README.md deleted file mode 100644 index a8831d99042..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-fsm - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-fsm -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-fsm":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initfsmComponents } from "@egovernments/digit-ui-module-fsm"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["fsm"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initfsmComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/package.json index 41a0afc746b..72ead973433 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/package.json @@ -1,6 +1,6 @@ { "name": "@upyog/digit-ui-module-fsm", - "version": "1.7.2", + "version": "1.7.3", "license": "MIT", "main": "dist/index.js", "description": "Digit FSM Module", @@ -19,8 +19,8 @@ "react-router-dom": "5.3.0" }, "dependencies": { - "@egovernments/digit-ui-react-components": "1.7.2", - "microbundle-crl": "0.13.11", + "@egovernments/digit-ui-react-components": "^1.7.0-beta.2", + "microbundle-crl": "0.13.11", "react": "17.0.2", "react-dom": "17.0.2", "react-hook-form": "6.15.8", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/Module.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/Module.js index b77e725dd76..ec6be4dfc49 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/Module.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/Module.js @@ -21,12 +21,13 @@ import SelectRoadDetails from "./pageComponents/SelectRoadDetails"; import SelectPropertySubtype from "./pageComponents/SelectPropertySubtype"; import SelectPropertyType from "./pageComponents/SelectPropertyType"; import SelectPropertyID from "./pageComponents/SelectPropertyID"; +import SelectTripNo from "./pageComponents/SelectTripNo"; import SelectSlumName from "./pageComponents/SelectSlumName"; // import SelectStreet from "./pageComponents/SelectStreet"; import FSMSelectStreet from "./pageComponents/FSMSelectStreet"; import SelectTankSize from "./pageComponents/SelectTankSize"; import SelectTripData from "./pageComponents/SelectTripData"; -import SelectTripNo from "./pageComponents/SelectTripNo"; +// import SelectTripNo from "./pageComponents/SelectTripNo"; import SelectPaymentPreference from "./pageComponents/SelectPaymentPreference"; import SelectVehicle from "./pageComponents/SelectVehicleType"; import CitizenApp from "./pages/citizen"; @@ -60,6 +61,7 @@ import AdvanceCollection from "./pageComponents/AdvanceCollection"; import SelectTrips from "./pageComponents/SelectTrips"; import PlusMinusInput from "./pageComponents/PlusMinusInput"; import ConfirmationBox from "./components/Confirmation"; +import SelectLocalityOrGramPanchayat from "./pageComponents/SelectLocalityOrGramPanchayat"; const FSMModule = ({ stateCode, userType, tenants }) => { const moduleCode = "FSM"; @@ -216,6 +218,7 @@ const componentsToRegister = { SelectTrips, PlusMinusInput, ConfirmationBox, + SelectLocalityOrGramPanchayat, }; export const initFSMComponents = () => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/ApplicationTimeline.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/ApplicationTimeline.js index 476133bc5cf..61e49d3bb69 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/ApplicationTimeline.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/ApplicationTimeline.js @@ -2,19 +2,19 @@ import React, { Fragment } from "react"; import { useTranslation } from "react-i18next"; import { Link, useHistory, useParams } from "react-router-dom"; import { - Header, + // Header, ActionLinks, - Card, + // Card, CardSectionHeader, ConnectingCheckPoints, CheckPoint, - KeyNote, + // KeyNote, SubmitBar, - LinkButton, + // LinkButton, Loader, Rating, } from "@egovernments/digit-ui-react-components"; -import _ from "lodash"; +// import _ from "lodash"; import TLCaption from "./TLCaption"; export const ApplicationTimeline = (props) => { @@ -85,15 +85,15 @@ export const ApplicationTimeline = (props) => { if (checkpoint?.numberOfTrips) caption.comment = `${t("NUMBER_OF_TRIPS")}: ${checkpoint?.numberOfTrips}`; return ; } - else if (checkpoint.status === "PENDING_PAYYY") { + /* else if (checkpoint.status === "PENDING_PAYYY") { const caption = { name: checkpoint?.assigner, mobileNumber: checkpoint?.assigner?.mobileNumber, date: `${t("CS_FSM_EXPECTED_DATE")} ${Digit.DateUtils.ConvertTimestampToDate(props.application?.possibleServiceDate)}`, }; - return ; + return ; */ }; -} +// } const showNextActions = (nextAction) => { switch (nextAction?.action) { @@ -106,7 +106,7 @@ export const ApplicationTimeline = (props) => { state: { tenantId: props.application.tenantId }, }} > - {window.location.href.includes("citizen/fsm/") && } +
); @@ -125,7 +125,7 @@ export const ApplicationTimeline = (props) => { return ; } - +/* let deepCopy = _.cloneDeep( data ) let index1 =0 deepCopy?.timeline.map((check,index) => { @@ -137,7 +137,7 @@ deepCopy?.timeline.map((check,index) => { data.timeline[index].status ="ASSING_DSO_PAY" data.timeline.splice(index, 0, obj); } -}) +}) */ return ( {!isLoading && ( @@ -148,7 +148,8 @@ deepCopy?.timeline.map((check,index) => { )} {data?.timeline && data?.timeline?.length === 1 ? ( - + + ) : ( {data?.timeline && @@ -158,7 +159,7 @@ deepCopy?.timeline.map((check,index) => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/DesktopInbox.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/DesktopInbox.js index 170819ecc0e..7d322a63806 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/DesktopInbox.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/DesktopInbox.js @@ -135,7 +135,7 @@ const DesktopInbox = (props) => { let citizen_info = props?.fstprequest?.find((i) => row.original.tripDetails[0].referenceNo === i.applicationNo); return (
- {t(`${citizen_info?.address?.locality?.code}`)} + {t(`${citizen_info?.address?.locality?.name}`)}
); }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/FsmCard.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/FsmCard.js index 6e0e69b516e..d7753817547 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/FsmCard.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/FsmCard.js @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import { Link } from "react-router-dom"; import { useTranslation } from "react-i18next"; import { ArrowRightInbox, ShippingTruck, EmployeeModuleCard, AddNewIcon, ViewReportIcon, InboxIcon } from "@egovernments/digit-ui-react-components"; -import { checkForEmployee } from "../utils"; +// import { checkForEmployee } from "../utils"; const ArrowRight = ({ to }) => ( @@ -18,6 +18,8 @@ const FSMCard = () => { const FSM_CREATOR = Digit.UserService.hasAccess("FSM_CREATOR_EMP") || false; const isFSTPOperator = Digit.UserService.hasAccess("FSM_EMP_FSTPO") || false; + const [total, setTotal] = useState("-"); + // Septage ready for Disposal ( 10 KL) // Septage disposed today ( 50 KL) const tenantId = Digit.ULBService.getCurrentTenantId(); @@ -61,7 +63,7 @@ const FSMCard = () => { else return { uuid: { code: "ASSIGNED_TO_ME", name: t("ES_INBOX_ASSIGNED_TO_ME") } }; }; - const { data: inbox, isFetching: pendingApprovalRefetching, isLoading: isInboxLoading } = Digit.Hooks.fsm.useInbox( + const { data: inbox, isFetching: pendingApprovalRefetching } = Digit.Hooks.fsm.useInbox( tenantId, { ...filters, limit: 10, offset: 0, ...getUUIDFilter() }, { @@ -69,16 +71,33 @@ const FSMCard = () => { } ); + useEffect(() => { + if (inbox) { + const total = inbox?.totalCount || 0; + setTotal(total); + } + }, [inbox]); + + const moduleForSomeFSMAdmin = FSM_ADMIN + ? [ + { + link: "/digit-ui/employee/fsm/registry", + label: t("ES_TITLE_FSM_REGISTRY"), + icon: , + }, + ] + : []; + const propsForFSTPO = { Icon: , - moduleName: t("ES_COMMON_FSTP_OPERATION"), + moduleName: t("ES_TITLE_VEHICLE_LOG"), // kpis: isSuccess ? Object.keys(info).map((key, index) => ({ // label: t(key), // count: t(info[key]), // link: "/digit-ui/employee/fsm/fstp-inbox" // })): [], links: [ - { + /*{ label: t("ES_COMMON_INBOX"), link: "/digit-ui/employee/fsm/fstp-inbox", }, @@ -90,64 +109,69 @@ const FSMCard = () => { label: t("ES_FSM_VIEW_REPORTS_BUTTON"), link: "/employee/report/fsm/FSMFSTPPlantWithVehicleLogReport", hyperlink: true, + }, */ + { + label: t("ES_COMMON_HOME"), + link: "/digit-ui/employee/fsm/fstp-operations", }, ], }; - let links = [ - { - link: "/employee/report/fsm/FSMDailyDesludingReport", - hyperlink: true, - label: t("ES_FSM_VIEW_REPORTS_BUTTON"), - roles: ["FSM_ADMIN"], - }, - { - label: t("ES_TITLE_FSM_REGISTRY"), - link: `/digit-ui/employee/fsm/registry`, - roles: ["FSM_ADMIN"], - }, - { - label: t("ES_TITLE_NEW_DESULDGING_APPLICATION"), - link: `/digit-ui/employee/fsm/new-application`, - roles: ["FSM_CREATOR_EMP", "FSM_ADMIN"], - }, - { - label: t("ES_TITILE_SEARCH_APPLICATION"), - link: `/digit-ui/employee/fsm/search`, - }, - ]; + if (isFSTPOperator && isSuccess) { + return ; + } - links = links.filter((link) => (link.roles ? checkForEmployee(link.roles) : true)); + const linksForSomeFSMEmployees = + !DSO && !COLLECTOR && !FSM_EDITOR + ? [ + { + label: t("ES_TITLE_NEW_DESULDGING_APPLICATION"), + link: `/digit-ui/employee/fsm/new-application`, + }, + ] + : []; - const propsForModuleCard = { - Icon: , - moduleName: t("ES_TITLE_FAECAL_SLUDGE_MGMT"), - kpis: [ - { - count: isInboxLoading ? "-" : inbox?.totalCount, - label: t("TOTAL_FSM"), - link: `/digit-ui/employee/fsm/inbox`, - }, - { - count: isInboxLoading ? "-" : inbox?.nearingSlaCount, - label: t("TOTAL_NEARING_SLA"), - link: `/digit-ui/employee/fsm/inbox`, - }, - ], - links: [ - { - count: isInboxLoading ? "-" : inbox?.totalCount, - link: "/digit-ui/employee/fsm/inbox", - label: t("ES_COMMON_INBOX"), - }, - ...links, - ], - }; + const propsForModuleCard = isFSTPOperator + ? { + Icon: , + moduleName: t("ES_TITLE_VEHICLE_LOG"), + // kpis: isSuccess ? Object.keys(info).map((key, index) => ({ + // label: t(key), + // count: t(info[key]), + // link: "/digit-ui/employee/fsm/fstp-inbox" + // })): [], + links: [ + { + label: t("ES_COMMON_HOME"), + link: "/digit-ui/employee/fsm/fstp-operations", + }, + ], + } + : { + Icon: , + moduleName: t("ES_TITLE_FAECAL_SLUDGE_MGMT"), + kpis: [ + { + count: total, + label: t("TOTAL_FSM"), + link: `/digit-ui/employee/fsm/inbox`, + }, + { + label: t("TOTAL_NEARING_SLA"), + link: `/digit-ui/employee/fsm/inbox`, + }, + ], + links: [ + { + count: total, + label: t("ES_COMMON_INBOX"), + link: `/digit-ui/employee/fsm/inbox`, + }, + ...linksForSomeFSMEmployees, + ...moduleForSomeFSMAdmin, + ], + }; - return isFSTPOperator ? ( - - ) : ( - - ); + return ; }; export default FSMCard; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistryInbox.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistryInbox.js index d429fd76e42..e1a63964a36 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistryInbox.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistryInbox.js @@ -200,6 +200,47 @@ const RegisryInbox = (props) => { }); }; + const onVendorVehicleSelect = (row, selectedOption) => { + let vehicleData = row.original; + let formDetails = row.original.dsoDetails; + let existingVendor = vehicleData?.vendor; + let selectedVendor = selectedOption; + delete vehicleData.vendor; + vehicleData.vendorVehicleStatus = "ACTIVE"; + if (existingVendor) { + const vehicles = existingVendor?.vehicles; + vehicles.splice( + vehicles.findIndex((ele) => ele.id === vehicleData.id), + 1 + ); + const formData = { + vendor: { + ...formDetails, + vehicles: vehicles, + }, + }; + } + const formData = { + vendor: { + ...selectedVendor, + vehicles: selectedVendor.vehicles ? [...selectedVendor.vehicles, vehicleData] : [vehicleData], + }, + }; + + mutateVendor(formData, { + onError: (error, variables) => { + setShowToast({ key: "error", action: error }); + setTimeout(closeToast, 5000); + }, + onSuccess: (data, variables) => { + setShowToast({ key: "success", action: "VENDOR" }); + queryClient.invalidateQueries("DSO_SEARCH"); + props.refetchData(); + setTimeout(closeToast, 3000); + }, + }); + }; + const onCellClick = (row, column, length) => { setTableData((old) => old.map((data, index) => { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistrySearch.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistrySearch.js index 2c94330e716..b5891626081 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistrySearch.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/RegistrySearch.js @@ -182,14 +182,14 @@ const SearchApplication = ({ onSearch, type, onClose, onTabChange, isFstpOperato
{showAddMenu && ( - + )}
{searchFields?.map((input, index) => ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/TLTimelineInFSM.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/TLTimelineInFSM.js index f3bc3234a53..46368270571 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/TLTimelineInFSM.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/TLTimelineInFSM.js @@ -10,7 +10,7 @@ const getAction = (flow) => { break; case "APPLY": actions = [ 'FSM_TIMELINE_PROPERTY_DETAILS', - // 'FSM_GENDER_DETAILS', + 'FSM_GENDER_DETAILS', 'FSM_PAYMENT_DETAILS', 'FSM_TIMELINE_SUMMARY', ] diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/FSMLink.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/FSMLink.js index fcd4fe0b1ba..6e854af7a02 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/FSMLink.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/FSMLink.js @@ -60,7 +60,7 @@ const FSMLink = ({ parentRoute, isMobile, data }) => { {links.map(({ link, text, hyperlink = false, accessTo = [] }, index) => { return ( - {hyperlink ? {text} : {text}} + {hyperlink ? {t(text)} : {t(text)}} ); })} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/Filter.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/Filter.js index b2b9166f6d7..a2806b67d6f 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/Filter.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/Filter.js @@ -46,16 +46,13 @@ const Filter = ({ searchParams, paginationParms, onFilterChange, onSearch, remov const clearAll = () => { if (isFstpOperator) return onFilterChange(); - onFilterChange({ applicationStatus: [], locality: [] }); + // onFilterChange({ applicationStatus: [], locality: [] }); // props?.onClose?.(); }; return ( - {((!DSO && !isFstpOperator && searchParams && (searchParams?.applicationStatus?.length > 0 || searchParams?.locality?.length > 0)) || - mergedRoleDetails?.statuses?.length > 0 || - isFstpOperatorRequest) && ( -
+ {((!DSO && !isFstpOperator && searchParams) || (mergedRoleDetails?.statuses?.length > 0) || (isFstpOperatorRequest)) &&
{t("ES_COMMON_FILTER_BY")}:
@@ -73,15 +70,15 @@ const Filter = ({ searchParams, paginationParms, onFilterChange, onSearch, remov )}
- {/*
+
{!DSO && !isFstpOperator && searchParams && ( )} -
*/} - {/* {GetSelectOptions(t("ES_INBOX_LOCALITY"), localities, selectedLocality, onSelectLocality, "code", onRemove, "locality", "name")} */} - {/*
*/} +
+ {/* {GetSelectOptions(t("ES_INBOX_LOCALITY"), localities, selectedLocality, onSelectLocality, "code", onRemove, "locality", "name")} */} +
{/* */} - {/*
*/} +
{mergedRoleDetails?.statuses?.length > 0 || isFstpOperatorRequest ? (
@@ -119,8 +116,8 @@ const Filter = ({ searchParams, paginationParms, onFilterChange, onSearch, remov
- )} - {props.type === "mobile" && ( + } + {props.type === "mobile" && props.onClose && ( { - onSearch(); + if (props.type === "mobile") onSearch({ delete: ["applicationNos"] }); + else onSearch(); }} style={{ flex: 1 }} /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/search.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/search.js index 7f9b866dc98..fbee5fa218f 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/search.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/inbox/search.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState,useEffect } from "react"; import { useForm, Controller } from "react-hook-form"; import { TextInput, @@ -27,6 +27,8 @@ const SearchApplication = ({ onSearch, type, onClose, isFstpOperator, searchFiel const mobileView = innerWidth <= 640; const FSTP = Digit.UserService.hasAccess("FSM_EMP_FSTPO") || false; const watchSearch = watch(["applicationNos", "mobileNumber", "fromDate", "toDate"]); + const [isReady, setIsReady] = useState(false); + const onSubmitInput = (data) => { if (!data.mobileNumber) { @@ -131,10 +133,12 @@ const SearchApplication = ({ onSearch, type, onClose, isFstpOperator, searchFiel
)} -
+
{searchFields?.map((input, index) => ( - + {getFields(input)}{" "} ))} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/getPDFData.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/getPDFData.js index 2bee8d7d134..02728f7e06a 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/getPDFData.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/getPDFData.js @@ -9,6 +9,17 @@ const getSlumName = (application, t) => { } return application?.slum?.i18nKey ? t(`${application?.slum?.i18nKey}`) : "N/A"; }; +/* +const getDistanceofPitFromRoad = (distancefromroad) => { + if (!distancefromroad) + return "N/A"; + return distancefromroad;}; + +const getRoadWidth = (roadWidth) => { + if (!roadWidth) + return "N/A"; + return roadWidth;}; +*/ const getApplicationVehicleCapacity = (vehicleCapacity) => { if (!vehicleCapacity) return "N/A"; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/AdvanceCollection.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/AdvanceCollection.js index 7ee2f3ab84b..42c53147432 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/AdvanceCollection.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/AdvanceCollection.js @@ -38,7 +38,7 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie title: t("ES_NEW_APPLICATION_AMOUNT_INVALID"), }, - default: formData?.advanceAmount, + default: url.includes("modify") ? applicationData?.advanceAmount : formData?.advanceAmount, isMandatory: true, }, ]; @@ -56,7 +56,13 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie setVehicle({ label: formData?.tripData?.vehicleType?.capacity }); } - if (formData?.propertyType && formData?.subtype && formData?.address && formData?.tripData?.vehicleType?.capacity) { + if ( + formData?.propertyType && + formData?.subtype && + formData?.address && + formData?.tripData?.vehicleType?.capacity && + formData?.address?.propertyLocation?.code === "WITHIN_ULB_LIMITS" + ) { const capacity = formData?.tripData?.vehicleType.capacity; const { slum: slumDetails } = formData.address; const slum = slumDetails ? "YES" : "NO"; @@ -78,11 +84,11 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie Digit.SessionStorage.set("advance_amount", advanceBalanceAmount); setTotalAmount(totaltripAmount); setAdvanceAmounts(advanceBalanceAmount); - !url.includes("modify") || (url.includes("modify") && advanceBalanceAmount > formData?.advancepaymentPreference?.advanceAmount) - ? setValue({ - advanceAmount: advanceBalanceAmount, - }) - : null; + if (!url.includes("modify") || (url.includes("modify") && advanceBalanceAmount > formData?.advancepaymentPreference?.advanceAmount)) { + setValue({ + advanceAmount: advanceBalanceAmount, + }); + } setError(false); } else { sessionStorage.removeItem("Digit.total_amount"); @@ -92,6 +98,37 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie } })(); }, [formData?.propertyType, formData?.subtype, formData?.address?.slum, formData?.tripData?.vehicleType?.capacity, formData?.tripData?.noOfTrips]); + + useEffect(() => { + (async () => { + if (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && formData.tripData.noOfTrips && formData.tripData.amountPerTrip) { + const totaltripAmount = formData.tripData.amountPerTrip * formData.tripData.noOfTrips; + + const { advanceAmount: advanceBalanceAmount } = await Digit.FSMService.advanceBalanceCalculate(tenantId, { + totalTripAmount: totaltripAmount, + }); + Digit.SessionStorage.set("total_amount", totaltripAmount); + Digit.SessionStorage.set("advance_amount", advanceBalanceAmount); + setTotalAmount(totaltripAmount); + setAdvanceAmounts(advanceBalanceAmount); + if (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && url.includes("modify")) { + setValue({ + advanceAmount: 0, + }); + } else if ( + !url.includes("modify") || + url.includes("modify") || + (formData?.advancepaymentPreference?.advanceAmount > 0 && advanceBalanceAmount > formData?.advancepaymentPreference?.advanceAmount) + ) { + setValue({ + advanceAmount: advanceBalanceAmount, + }); + } + + setError(false); + } + })(); + }, [formData.tripData.noOfTrips, formData.tripData.amountPerTrip]); return isVehicleMenuLoading && isDsoLoading ? ( ) : ( @@ -99,7 +136,6 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie {formData?.tripData?.amountPerTrip !== 0 && inputs?.map((input, index) => { let currentValue = formData && formData[config.key] && formData[config.key][input.name]; - return ( @@ -110,15 +146,17 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie
0 + ? false + : true : false } type={input.type} key={input.name} style={FSMTextFieldStyle} onChange={(e) => setAdvanceAmount(e.target.value)} - value={input.default ? input.default : formData && formData[config.key] ? formData[config.key][input.name] : null} + value={formData && formData[config.key] ? formData[config.key][input.name] : applicationData?.advanceAmount} {...input.validation} /> {currentValue > TotalAmount && ( @@ -132,11 +170,11 @@ const AdvanceCollection = ({ t, config, onSelect, formData, userType, FSMTextFie )} {url.includes("modify-application") && - Number(AdvanceAmount) === 0 && applicationData?.advanceAmount > 0 && + Number(formData?.tripData?.amountPerTrip) > 0 && Number(currentValue) === 0 && ( - {t("FSM_ADVANCE_AMOUNT_NOT_ZERO")} + {t("FSM_ADVANCE_AMOUNT_LESS_THAN_AMOUNT_PER_TRIP")} )}
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/CheckSlum.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/CheckSlum.js index 9f0eed0a632..841104b71a2 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/CheckSlum.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/CheckSlum.js @@ -13,9 +13,12 @@ const CheckSlum = ({ t, config, onSelect, userType, formData }) => { const onSkip = () => onSelect(); function goNext() { - sessionStorage.removeItem("Digit.total_amount") + sessionStorage.removeItem("Digit.total_amount"); onSelect(config.key, { slumArea }); } + useEffect(() => { + if (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT") onSkip(); + }, [formData]); return ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectAddress.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectAddress.js index 7f14a804c36..4464a06ec60 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectAddress.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectAddress.js @@ -1,11 +1,33 @@ import React, { useEffect, useState } from "react"; import { FormStep, CardLabel, Dropdown, RadioButtons, LabelFieldPair, RadioOrSelect } from "@egovernments/digit-ui-react-components"; import Timeline from "../components/TLTimelineInFSM"; +import { useLocation } from "react-router-dom"; const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { const allCities = Digit.Hooks.fsm.useTenants(); let tenantId = Digit.ULBService.getCurrentTenantId(); + if (userType !== "employee") { + tenantId = Digit.SessionStorage.get("CITIZEN.COMMON.HOME.CITY")?.code; + } + const location = useLocation(); + const isNewVendor = location.pathname.includes("new-vendor"); + const isEditVendor = location.pathname.includes("modify-vendor"); + const inputs = [ + { + active: true, + code: "WITHIN_ULB_LIMITS", + i18nKey: "WITHIN_ULB_LIMITS", + name: "Witnin ULB Limits", + }, + { + active: true, + code: "FROM_GRAM_PANCHAYAT", + i18nKey: "FROM_GRAM_PANCHAYAT", + name: "From Gram Panchayat", + }, + ]; + const { pincode, city } = formData?.address || ""; const cities = userType === "employee" @@ -14,7 +36,10 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { ? allCities.filter((city) => city?.pincode?.some((pin) => pin == pincode)) : allCities; - const [selectedCity, setSelectedCity] = useState(() => formData?.address?.city || Digit.SessionStorage.get("fsm.file.address.city") || null); + const [selectedCity, setSelectedCity] = useState( + () => formData?.address?.city || Digit.SessionStorage.get("fsm.file.address.city") || Digit.SessionStorage.get("CITIZEN.COMMON.HOME.CITY") + ); + const [newLocality, setNewLocality] = useState(); const { data: fetchedLocalities } = Digit.Hooks.useBoundaryLocalities( selectedCity?.code, "revenue", @@ -23,6 +48,17 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { }, t ); + + const { data: urcConfig } = Digit.Hooks.fsm.useMDMS(tenantId, "FSM", "UrcConfig"); + const isUrcEnable = urcConfig && urcConfig.length > 0 && urcConfig[0].URCEnable; + const [selectLocation, setSelectLocation] = useState(() => + formData?.address?.propertyLocation + ? formData?.address?.propertyLocation + : Digit.SessionStorage.get("locationType") + ? Digit.SessionStorage.get("locationType") + : inputs[0] + ); + const [localities, setLocalities] = useState(); const [selectedLocality, setSelectedLocality] = useState(); @@ -35,7 +71,16 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { }, [cities]); useEffect(() => { - if (selectedCity && fetchedLocalities) { + if (selectedCity && selectLocation) { + if (userType === "employee") { + onSelect(config.key, { + ...formData[config.key], + city: selectedCity, + propertyLocation: selectLocation, + }); + } + } + if ((!isUrcEnable || isNewVendor || isEditVendor) && selectedCity && fetchedLocalities) { let __localityList = fetchedLocalities; let filteredLocalityList = []; @@ -59,7 +104,7 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { } } } - }, [selectedCity, formData?.address?.pincode, fetchedLocalities]); + }, [selectedCity, selectLocation, fetchedLocalities]); function selectCity(city) { setSelectedLocality(null); @@ -68,6 +113,29 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { setSelectedCity(city); } + function selectedValue(value) { + setSelectLocation(value); + Digit.SessionStorage.set("locationType", value); + if (userType === "employee") { + if (value.code === "FROM_GRAM_PANCHAYAT") { + onSelect("tripData", { + ...formData["tripData"], + amountPerTrip: "", + amount: "", + }); + onSelect(config.key, { + ...formData[config.key], + propertyLocation: value, + }); + } else { + onSelect(config.key, { + ...formData[config.key], + propertyLocation: value, + }); + } + } + } + function selectLocality(locality) { setSelectedLocality(locality); if (userType === "employee") { @@ -75,8 +143,18 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { } } + const onNewLocality = (value) => { + setNewLocality(value); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], newLocality: value }); + } + }; + function onSubmit() { - onSelect(config.key, { city: selectedCity, locality: selectedLocality }); + onSelect(config.key, { + city: selectedCity, + propertyLocation: Digit.SessionStorage.get("locationType") ? Digit.SessionStorage.get("locationType") : selectLocation, + }); } if (userType === "employee") { @@ -98,41 +176,70 @@ const FSMSelectAddress = ({ t, config, onSelect, userType, formData }) => { t={t} />
- - - {t("ES_NEW_APPLICATION_LOCATION_MOHALLA")} - {config.isMandatory ? " * " : null} - - - + {!isUrcEnable || isNewVendor || isEditVendor ? ( +
+ + + {t("ES_NEW_APPLICATION_LOCATION_MOHALLA")} + {config.isMandatory ? " * " : null} + + + + {!isNewVendor && !isEditVendor && !isUrcEnable && formData?.address?.locality?.name === "Other" && ( + + {`${t("ES_INBOX_PLEASE_SPECIFY_LOCALITY")} *`} +
+ onNewLocality(e.target.value)} /> +
+
+ )} +
+ ) : ( + + {`${t("CS_PROPERTY_LOCATION")} *`} +
+ +
+
+ )}
); } return ( - + + {isUrcEnable && ( + + {`${t("CS_PROPERTY_LOCATION")} *`} + + + )} {`${t("MYCITY_CODE_LABEL")} *`} - {selectedCity && localities && {`${t("CS_CREATECOMPLAINT_MOHALLA")} *`}} - {selectedCity && localities && ( - - )} ); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectStreet.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectStreet.js index 4aaf07aafef..ba718c1dafd 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectStreet.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/FSMSelectStreet.js @@ -208,6 +208,7 @@ const FSMSelectStreet = ({ t, config, onSelect, userType, formData, formState, s _defaultValues={{ street: formData?.address.street, doorNo: formData?.address.doorNo }} onChange={handleSkip} onSelect={(data) => onSelect(config.key, data)} + onSkip={onSkip} isDisabled={doorNo || street ? false : true} t={t} /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectGender.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectGender.js index 8c2467c7f8e..83f6281d478 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectGender.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectGender.js @@ -44,7 +44,7 @@ const SelectGender = ({ config, onSelect, t, userType, formData }) => { className="payment-form-text-input-correction" isMandatory={config.isMandatory} selected={genderType} - option={GenderData} + option={GenderData?.sort((a, b) => a.code.localeCompare(b.code))} select={selectGenderType} optionKey="i18nKey" disable={config.disable} @@ -58,7 +58,7 @@ const SelectGender = ({ config, onSelect, t, userType, formData }) => { a.code.localeCompare(b.code))} selectedOption={genderType} optionKey="i18nKey" onSelect={selectGenderType} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectLocalityOrGramPanchayat.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectLocalityOrGramPanchayat.js new file mode 100644 index 00000000000..144d413b404 --- /dev/null +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectLocalityOrGramPanchayat.js @@ -0,0 +1,369 @@ +import { CardLabel, Dropdown, FormStep, LabelFieldPair, TextInput } from "@egovernments/digit-ui-react-components"; +import _ from "lodash"; +import React, { useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import Timeline from "../components/TLTimelineInFSM"; + +const SelectLocalityOrGramPanchayat = ({ t, config, onSelect, userType, formData, formState }) => { + const allCities = Digit.Hooks.fsm.useTenants(); + let tenantId = Digit.ULBService.getCurrentTenantId(); + if (userType !== "employee") { + tenantId = Digit.SessionStorage.get("CITIZEN.COMMON.HOME.CITY")?.code; + } + const { data: urcConfig } = Digit.Hooks.fsm.useMDMS(tenantId, "FSM", "UrcConfig"); + const isUrcEnable = urcConfig && urcConfig.length > 0 && urcConfig[0].URCEnable; + const { pincode, city, propertyLocation } = formData?.address || ""; + const cities = + userType === "employee" + ? allCities.filter((city) => city?.code === tenantId) + : pincode + ? allCities.filter((city) => city?.pincode?.some((pin) => pin == pincode)) + : allCities; + const [selectedLocality, setSelectedLocality] = useState(); + const [localities, setLocalities] = useState(); + const [gramPanchayats, setGramPanchayats] = useState(); + const [selectedGp, setSelectedGp] = useState(() => + formData?.address?.additionalDetails?.gramPanchayat ? formData?.address?.additionalDetails?.gramPanchayat : {} + ); + const [villages, setVillages] = useState([]); + const [selectedVillage, setSelectedVillage] = useState(() => + formData?.address?.additionalDetails?.village ? formData?.address?.additionalDetails?.village : {} + ); + const [newVillage, setNewVillage] = useState(); + const [newGp, setNewGp] = useState(); + const [newLocality, setNewLocality] = useState(); + const [selectedCity, setSelectedCity] = useState(() => formData?.address?.city || Digit.SessionStorage.get("fsm.file.address.city") || null); + useEffect(() => { + if (cities) { + if (cities.length === 1) { + setSelectedCity(cities[0]); + } + } + }, [cities]); + var { data: fetchedGramPanchayats } = Digit.Hooks.useBoundaryLocalities( + selectedCity?.code, + "gramPanchayats", + { + enabled: !!selectedCity, + }, + t + ); + + var { data: fetchedLocalities } = Digit.Hooks.useBoundaryLocalities( + selectedCity?.code, + "revenue", + { + enabled: !!selectedCity, + }, + t + ); + + useEffect(() => { + if (selectedCity && fetchedLocalities) { + let __localityList = fetchedLocalities; + let filteredLocalityList = []; + + if (formData?.address?.locality && formData?.address?.additionalDetails?.boundaryType === "Locality") { + setSelectedLocality(formData.address.locality); + setNewLocality(formData?.address?.additionalDetails?.newLocality); + } + + if (formData?.address?.pincode) { + filteredLocalityList = __localityList.filter((obj) => obj.pincode?.find((item) => item == formData.address.pincode)); + if (!formData?.address?.locality) setSelectedLocality(); + } + setLocalities(() => (filteredLocalityList.length > 0 ? filteredLocalityList : __localityList)); + + if (filteredLocalityList.length === 1) { + setSelectedLocality(filteredLocalityList[0]); + if (userType === "employee") { + onSelect(config.key, { + ...formData[config.key], + locality: filteredLocalityList[0], + }); + } + } + } + }, [selectedCity, fetchedLocalities]); + + useEffect(() => { + if (fetchedGramPanchayats) { + if (fetchedGramPanchayats && fetchedGramPanchayats.length > 0) { + setGramPanchayats(fetchedGramPanchayats); + } + if (formData?.address?.additionalDetails?.gramPanchayat?.code) { + const filteredGramPanchayat = fetchedGramPanchayats.filter( + (obj) => obj?.code === formData?.address?.additionalDetails?.gramPanchayat?.code + )[0]; + setSelectedGp(filteredGramPanchayat); + setNewGp(formData?.address?.additionalDetails?.newGp); + var villageUnderGp = filteredGramPanchayat?.children.filter((obj) => obj?.code === formData?.address?.additionalDetails?.village?.code); + if (villageUnderGp.length > 0) { + villageUnderGp[0].i18nkey = tenantId.replace(".", "_").toUpperCase() + "_REVENUE_" + villageUnderGp[0]?.code; + setSelectedVillage(villageUnderGp[0]); + setVillages(villageUnderGp); + } else { + setNewVillage(typeof formData?.address?.additionalDetails?.village === "string" ? formData?.address?.additionalDetails?.village : ""); + } + } + } + }, [fetchedGramPanchayats, formData?.address?.additionalDetails?.gramPanchayat?.code]); + if (userType !== "employee" && propertyLocation?.code === "FROM_GRAM_PANCHAYAT") { + config.texts.cardText = "CS_FILE_APPLICATION_PROPERTY_LOCATION_GRAM_PANCHAYAT_TEXT"; + } + + function selectLocality(locality) { + setSelectedLocality(locality); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], locality: locality }); + } + } + + function selectGramPanchayat(value) { + setSelectedGp(value); + const filteredVillages = fetchedGramPanchayats.filter((items) => items?.code === value?.code)[0].children; + const localitiesWithLocalizationKeys = filteredVillages?.map((obj) => ({ + ...obj, + i18nkey: tenantId.replace(".", "_").toUpperCase() + "_REVENUE_" + obj?.code, + })); + if (localitiesWithLocalizationKeys?.length > 0) { + setVillages(localitiesWithLocalizationKeys); + } + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], gramPanchayat: value }); + } + Digit.SessionStorage.del("locationType"); + } + + function selectVillage(value) { + setSelectedVillage(value); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], village: value }); + } + } + + const onChangeVillage = (value) => { + setNewVillage(value); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], newVillage: value }); + } + }; + const onNewGpChange = (value) => { + setNewGp(value); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], newGp: value }); + } + }; + const onNewLocality = (value) => { + setNewLocality(value); + if (userType === "employee") { + onSelect(config.key, { ...formData[config.key], newLocality: value }); + } + }; + function onSubmit() { + if (propertyLocation?.code === "FROM_GRAM_PANCHAYAT") { + onSelect(config.key, { + gramPanchayat: selectedGp, + village: selectedVillage, + newGramPanchayat: newGp, + newVillage: newVillage, + }); + } else { + onSelect(config.key, { + locality: selectedLocality, + newLocality: newLocality, + }); + } + } + if (userType === "employee") { + return ( +
+ {propertyLocation?.code === "FROM_GRAM_PANCHAYAT" ? ( +
+ + + {t("CS_GRAM_PANCHAYAT")} + {config.isMandatory ? " * " : null} + + a.name.localeCompare(b.name))} + select={selectGramPanchayat} + optionKey="i18nkey" + t={t} + /> + + {selectedGp?.name === "Other" && ( + + {`${t("ES_INBOX_PLEASE_SPECIFY_GRAM_PANCHAYAT")} *`} +
+ onNewGpChange(e.target.value)} /> +
+
+ )} + {villages.length > 0 && ( + + {t("CS_VILLAGE_NAME")} + a.name.localeCompare(b.name))} + select={selectVillage} + optionKey="i18nkey" + t={t} + /> + + )} + {villages.length === 0 && ( + + {t("CS_VILLAGE_NAME")} +
+ onChangeVillage(e.target.value)} /> +
+
+ )} +
+ ) : ( + isUrcEnable && ( +
+ + + {t("CS_CREATECOMPLAINT_MOHALLA")} + {config.isMandatory ? " * " : null} + + a.name.localeCompare(b.name))} + select={selectLocality} + optionKey="i18nkey" + t={t} + /> + + {formData?.address?.locality?.name === "Other" && ( + + {`${t("ES_INBOX_PLEASE_SPECIFY_LOCALITY")} *`} +
+ onNewLocality(e.target.value)} /> +
+
+ )} +
+ ) + )} +
+ ); + } + return ( + + + + {propertyLocation?.code === "WITHIN_ULB_LIMITS" ? ( +
+ + + {`${t("CS_CREATECOMPLAINT_MOHALLA")} *`} + {/* {config.isMandatory ? " * " : null} */} + + a.name.localeCompare(b.name))} + select={selectLocality} + optionKey="i18nkey" + t={t} + /> + + {selectedLocality?.name === "Other" && ( + + {`${t("ES_INBOX_PLEASE_SPECIFY_LOCALITY")} *`} + onNewLocality(e.target.value)} + /> + + )} +
+ ) : ( +
+ + + {`${t("CS_GRAM_PANCHAYAT")} *`} + {/* {config.isMandatory ? " * " : null} */} + + a.name.localeCompare(b.name))} + select={selectGramPanchayat} + optionKey="i18nkey" + t={t} + /> + + {selectedGp?.name === "Other" && ( + + {`${t("ES_INBOX_PLEASE_SPECIFY_GRAM_PANCHAYAT")} *`} + onNewGpChange(e.target.value)} + /> + + )} + {villages.length > 0 && ( + + {t("CS_VILLAGE_NAME")} + a.name.localeCompare(b.name))} + select={selectVillage} + optionKey="i18nkey" + t={t} + /> + + )} + {villages.length === 0 && ( + + {t("CS_VILLAGE_NAME")} + onChangeVillage(e.target.value)} + /> + + )} +
+ )} +
+
+ ); +}; + +export default SelectLocalityOrGramPanchayat; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectName.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectName.js index a1413119307..a2e379ebe8b 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectName.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectName.js @@ -33,7 +33,14 @@ const SelectName = ({ t, config, onSelect, formData = {}, userType, register, er }, componentInFront:
+91
, isMandatory: true, - } + }, + { + label: "COMMON_APPLICANT_GENDER", + type: "dropdown", + name: "applicantGender", + options: genderTypes, + isMandatory: false, + }, ]; useEffect(() => { @@ -84,7 +91,7 @@ const SelectName = ({ t, config, onSelect, formData = {}, userType, register, er
a.code.localeCompare(b.code))} optionKey="i18nKey" id="dropdown" selected={formData && formData[config.key] ? input.options.find((data) => data.code === formData[config.key][input.name]) : null} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPaymentPreference.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPaymentPreference.js index e81896e27f9..218958e515c 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPaymentPreference.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPaymentPreference.js @@ -49,24 +49,34 @@ const SelectPaymentPreference = ({ config, formData, t, onSelect, userType }) => useEffect(() => { (async () => { - if (formData?.propertyType && formData?.subtype && formData?.address && formData?.selectTripNo?.vehicleCapacity.capacity) { + if (formData?.propertyType && formData?.subtype && formData?.address && formData?.selectTripNo?.vehicleCapacity.capacity && + formData?.address?.propertyLocation?.code === "WITHIN_ULB_LIMITS") { const capacity = formData?.selectTripNo?.vehicleCapacity.capacity; const { slum: slumDetails } = formData.address; const slum = slumDetails ? "YES" : "NO"; - const billingDetails = await Digit.FSMService.billingSlabSearch(tenantId, { - propertyType: formData?.subtype?.code, - capacity, - slum, - }); + const billingDetails = await Digit.FSMService.billingSlabSearch( + tenantId === formData?.address?.city?.code + ? tenantId + : formData?.address?.city?.code, + { + propertyType: formData?.subtype?.code, + capacity, + slum, + }); const billSlab = billingDetails?.billingSlab?.length && billingDetails?.billingSlab[0]; Digit.SessionStorage.set("amount_per_trip", billSlab.price); if (billSlab?.price) { let totaltripAmount = billSlab.price * formData?.selectTripNo?.tripNo?.code; - const { advanceAmount: advanceBalanceAmount } = await Digit.FSMService.advanceBalanceCalculate(tenantId, { - totalTripAmount: totaltripAmount, - }); + const { advanceAmount: advanceBalanceAmount } = + await Digit.FSMService.advanceBalanceCalculate( + tenantId === formData?.address?.city?.code + ? tenantId + : formData?.address?.city?.code, + { + totalTripAmount: totaltripAmount, + }); setMinAmount(advanceBalanceAmount); setTotalAmount(totaltripAmount); Digit.SessionStorage.set("total_amount", totaltripAmount); @@ -84,6 +94,10 @@ const SelectPaymentPreference = ({ config, formData, t, onSelect, userType }) => sessionStorage.removeItem("Digit.advance_amount"); setError(true); } + } else { + setAdvanceAmount(0); + Digit.SessionStorage.set("advance_amount", 0); + Digit.SessionStorage.set("amount_per_trip", null); } })(); }, [ @@ -115,7 +129,27 @@ const SelectPaymentPreference = ({ config, formData, t, onSelect, userType }) => isDisabled={currentValue > max ? true : false || currentValue < min ? true : false} t={t} > - + + {formData?.address?.propertyLocation?.code === + "FROM_GRAM_PANCHAYAT" && ( + + {t("FSM_TOTAL_AMOUNT_NOTE")} + + )} {inputs?.map((input, index) => { return ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPincode.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPincode.js index 51e92511cfa..8984065b620 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPincode.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPincode.js @@ -23,6 +23,7 @@ const SelectPincode = ({ t, config, onSelect, formData = {}, userType, register, max: "9999999", title: t("CORE_COMMON_PINCODE_INVALID"), }, + disable: true, }, ]; @@ -79,7 +80,7 @@ const SelectPincode = ({ t, config, onSelect, formData = {}, userType, register, {config.isMandatory ? " * " : null}
- +
{pincodeServicability && ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPitType.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPitType.js index 187a5c1eb28..bc7af913d00 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPitType.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPitType.js @@ -29,7 +29,16 @@ const SelectPitType = ({ t, formData, config, onSelect, userType }) => { return ; } if (userType === "employee") { - return ; + return ( + a.name.localeCompare(b.name))} + optionKey="i18nKey" + select={selectPitType} + selected={pitType} + t={t} + /> + ); } return ( @@ -38,7 +47,7 @@ const SelectPitType = ({ t, formData, config, onSelect, userType }) => { {t("CS_FILE_APPLICATION_PIT_TYPE_LABEL")} a.name.localeCompare(b.name))} selectedOption={pitType} optionKey="i18nKey" onSelect={selectPitType} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyID.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyID.js index 663792097ea..3acb6dbdb12 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyID.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyID.js @@ -3,8 +3,7 @@ import { TextArea, LabelFieldPair, CardLabel, TextInput } from "@egovernments/di import FormStep from "../../../../react-components/src/molecules/FormStep" import Timeline from "../components/TLTimelineInFSM"; const SelectPropertyID = ({ t, config, onSelect, formData, userType, setError: setFormError, clearErrors: clearFormErrors }) => { -const [propertyID, setPropertyID] = useState(formData?.propertyID?.propertyID|| formData.propertyID ||""); -const [disable,setDisable]=useState(false) +const [propertyID, setPropertyID] = useState(formData?.propertyID?.propertyID|| ""); const [error, setError] = useState(""); const inputs = [ { @@ -13,23 +12,13 @@ const inputs = [ placeholder:"Enter a valid property ID", validation: { maxLength: 256, + }, }, ]; const goNext=()=>{ onSelect(config.key, { ...formData[config.key], ...data }) } - useEffect(()=>{ - -if(window.location.href.includes("employee/fsm/new-application")) -{ - setDisable(false) -} -else if(window.location.href.includes("employee")) -{ - setDisable(true) -} - },[]) useEffect(() => { setPropertyID(formData?.additionalDetails?.propertyID); }, [formData?.additionalDetails?.propertyID]); @@ -41,7 +30,7 @@ else if(window.location.href.includes("employee")) } if (userType === "employee") { return ( - + ); } const onSkip = () => onSelect(); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertySubtype.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertySubtype.js index 05f00aa3cf0..64a9db85ea1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertySubtype.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertySubtype.js @@ -60,14 +60,30 @@ const SelectPropertySubtype = ({ config, onSelect, t, userType, formData }) => { // }, [propertyType]) if (userType === "employee") { - return ; + return ( + a.name.localeCompare(b.name))} + optionKey="i18nKey" + id="propertySubType" + selected={subtype} + select={selectedSubType} + t={t} + disable={url.includes("/modify-application/") || url.includes("/new-application") ? false : true} + /> + ); } else { return ( {`${t("CS_FILE_APPLICATION_PROPERTY_SUBTYPE_LABEL")} *`} - + a.name.localeCompare(b.name))} + selectedOption={subtype} + optionKey="i18nKey" + onSelect={selectedValue} + t={t} + /> ); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyType.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyType.js index ec4ccdf4c59..8937d5d7ef3 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyType.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectPropertyType.js @@ -33,23 +33,55 @@ const SelectPropertyType = ({ config, onSelect, t, userType, formData }) => { onSelect(config.key, value.code); } + const getInfoContent = () => { + let content = t("CS_DEFAULT_INFO_TEXT"); + if (formData && formData.selectPaymentPreference && formData.selectPaymentPreference.code === "PRE_PAY") { + content = t("CS_CHECK_INFO_PAY_NOW"); + } else { + content = t("CS_CHECK_INFO_PAY_LATER"); + } + return content; + }; + if (propertyTypesData.isLoading) { return ; } if (userType === "employee") { - return ; + return ( + a.name.localeCompare(b.name))} + optionKey="i18nKey" + id="propertyType" + selected={propertyType} + select={selectedType} + t={t} + disable={url.includes("/modify-application/") || url.includes("/new-application") ? false : true} + /> + ); } else { return ( {`${t("CS_FILE_APPLICATION_PROPERTY_LABEL")} *`} - + a.name.localeCompare(b.name))} + selectedOption={propertyType} + optionKey="i18nKey" + onSelect={selectedValue} + t={t} + /> - {propertyType && } + {propertyType && ( + + )} ); } }; export default SelectPropertyType; + diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectRoadDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectRoadDetails.js index e988a5ed161..0df0d9dd83e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectRoadDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectRoadDetails.js @@ -102,6 +102,7 @@ console.log("formData",formData) onSelect={(data) => onSelect(config.key, data)} isDisabled={roadWidth && distance ? false : true} t={t} + onSkip={onSkip} /> ); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectSlumName.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectSlumName.js index c190ecdd968..fca3dbbe30e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectSlumName.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectSlumName.js @@ -66,6 +66,11 @@ const SelectSlumName = ({ config, onSelect, t, userType, formData }) => { } }, [slumDataLoading, formData?.address?.locality?.code]); + useEffect(() => { + if (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT") + onSkip(); + }, [formData?.address?.propertyLocation?.code]); + function selectSlum(value) { setSlum(value); onSelect(config.key, { ...formData[config.key], slum: value.code }); @@ -83,10 +88,12 @@ const SelectSlumName = ({ config, onSelect, t, userType, formData }) => { if (slumDataLoading) return ; return userType === "employee" ? ( + formData?.address?.propertyLocation !== "FROM_GRAM_PANCHAYAT" && ( {t("ES_NEW_APPLICATION_SLUM_NAME")} + ) ) : ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectStreet.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectStreet.js index 75745167896..44c681ddce5 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectStreet.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectStreet.js @@ -78,10 +78,28 @@ const SelectStreet = ({ t, config, onSelect, userType, formData, formState, setE return {}; }; + useEffect(() => { + if(window.location.href.includes("employee/tl/") && formData?.cpt?.details) + { + setValue("doorNo", formData?.cpt?.details?.address?.doorNo); + setValue("street", formData?.cpt?.details?.address?.street); + } + },[formData]) + useEffect(() => { trigger(); }, []); + useEffect(()=>{ + if(formData?.address?.doorNo) setDoorNo(formData?.address?.doorNo) + if(formData?.address?.street) setStreet(formData?.address?.street) + },[formData?.address]) + + useEffect(() => { + if (formData?.address?.doorNo) setDoorNo(formData?.address?.doorNo); + if (formData?.address?.street) setStreet(formData?.address?.street); + }, [formData?.address]); + useEffect(() => { if (formData?.address?.doorNo) setDoorNo(formData?.address?.doorNo); if (formData?.address?.street) setStreet(formData?.address?.street); @@ -199,6 +217,7 @@ const SelectStreet = ({ t, config, onSelect, userType, formData, formState, setE _defaultValues={{ street: formData?.address.street, doorNo: formData?.address.doorNo }} onChange={handleSkip} onSelect={(data) => onSelect(config.key, data)} + onSkip={onSkip} isDisabled={doorNo || street ? false : true} t={t} /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripData.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripData.js index 7016d596a69..f1a7d4755b8 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripData.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripData.js @@ -54,7 +54,9 @@ const SelectTripData = ({ t, config, onSelect, formData = {}, userType }) => { title: t("ES_APPLICATION_BILL_SLAB_ERROR"), }, default: formData?.tripData?.amountPerTrip, - disable: true, + disable: formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" + ? false + : true, isMandatory: true, }, { @@ -75,6 +77,14 @@ const SelectTripData = ({ t, config, onSelect, formData = {}, userType }) => { onSelect(config.key, { ...formData[config.key], noOfTrips: value }); } + function setAmount(value) { + onSelect(config.key, { + ...formData[config.key], + amountPerTrip: value, + amount: value * formData.tripData.noOfTrips, + }); + } + function selectVehicle(value) { setVehicle({ label: value.capacity }); onSelect(config.key, { ...formData[config.key], vehicleType: value }); @@ -89,7 +99,8 @@ const SelectTripData = ({ t, config, onSelect, formData = {}, userType }) => { setVehicle({ label: formData?.tripData?.vehicleType?.capacity }); } - if (formData?.propertyType && formData?.subtype && formData?.address && formData?.tripData?.vehicleType?.capacity) { + if (formData?.propertyType && formData?.subtype && formData?.address && formData?.tripData?.vehicleType?.capacity && + formData?.address?.propertyLocation?.code === "WITHIN_ULB_LIMITS") { const capacity = formData?.tripData?.vehicleType.capacity; const { slum: slumDetails } = formData.address; const slum = slumDetails ? "YES" : "NO"; @@ -112,10 +123,18 @@ const SelectTripData = ({ t, config, onSelect, formData = {}, userType }) => { amount: "", }); setError(true); - } + } + } else if ( + formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && + formData.tripData.noOfTrips && + formData.tripData.amountPerTrip + ) { + setValue({ + amount: formData.tripData.amountPerTrip * formData.tripData.noOfTrips, + }); } })(); - }, [formData?.propertyType, formData?.subtype, formData?.address?.slum, formData?.tripData?.vehicleType?.capacity, formData?.tripData?.noOfTrips]); + }, [formData?.propertyType, formData?.subtype, formData?.address?.slum, formData?.tripData?.vehicleType?.capacity, formData?.tripData?.noOfTrips && formData?.address?.propertyLocation?.code]); return isVehicleMenuLoading && isDsoLoading ? ( @@ -130,7 +149,13 @@ const SelectTripData = ({ t, config, onSelect, formData = {}, userType }) => {
setTripNum(e.target.value)} + onChange={(e) => + index === 0 && + formData.address.propertyLocation?.code === + "FROM_GRAM_PANCHAYAT" + ? setAmount(e.target.value) + : setTripNum(e.target.value) + } key={input.name} value={input.default ? input.default : formData && formData[config.key] ? formData[config.key][input.name] : null} {...input.validation} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripNo.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripNo.js index dbb84a5bdc8..3149b69ad12 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripNo.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTripNo.js @@ -5,12 +5,15 @@ const SelectTripNo = ({ config, formData, t, onSelect, userType }) => { const state = Digit.ULBService.getStateId(); const tenantId = Digit.ULBService.getCurrentTenantId(); const stateId = Digit.ULBService.getStateId(); + const selectedCity = Digit.SessionStorage.get("CITIZEN.COMMON.HOME.CITY")?.code; const { data: tripNumberData, isLoading } = Digit.Hooks.fsm.useMDMS(stateId, "FSM", "TripNumber"); - const { data: dsoData, isLoading: isDsoLoading, isSuccess: isDsoSuccess, error: dsoError } = Digit.Hooks.fsm.useDsoSearch(tenantId, { + const { data: dsoData, isLoading: isDsoLoading, isSuccess: isDsoSuccess, error: dsoError } = Digit.Hooks.fsm.useDsoSearch(selectedCity, { limit: -1, status: "ACTIVE", }); - const { isLoading: isVehicleMenuLoading, data: vehicleData } = Digit.Hooks.fsm.useMDMS(state, "Vehicle", "VehicleType", { staleTime: Infinity }); + const { isLoading: isVehicleMenuLoading, data: vehicleData } = Digit.Hooks.fsm.useMDMS(state, "Vehicle", "VehicleType", { + staleTime: Infinity, + }); const [tripNo, setTripNo] = useState(formData?.tripNo); const [vehicleCapacity, setVehicleCapacity] = useState(formData?.capacity); const [vehicleMenu, setVehicleMenu] = useState([]); @@ -47,14 +50,14 @@ const SelectTripNo = ({ config, formData, t, onSelect, userType }) => { const SelectTrip = (value) => { setTripNo(value); if (userType === "employee") { - null; + return null; } }; const selectVehicle = (value) => { setVehicleCapacity(value); if (userType === "employee") { - null; + return null; } }; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTrips.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTrips.js index e4fd2ecbee2..23de5a1837d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTrips.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectTrips.js @@ -82,7 +82,7 @@ const SelectTrips = ({ t, config, onSelect, formData = {}, userType, styles, FSM } //console.log(formdata) function setValue(value, input) { - onSelect(config.key, { ...formData[config.key], [input]: value }); + value && input && onSelect(config.key, { ...formData[config.key], [input]: value }); } useEffect(() => { (async () => { @@ -90,7 +90,21 @@ const SelectTrips = ({ t, config, onSelect, formData = {}, userType, styles, FSM setVehicle({ label: formData?.tripData?.vehicleType?.capacity }); } - if (formData?.propertyType && formData?.subtype && formData?.address && formData?.tripData?.vehicleType?.capacity) { + if ( + formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && + formData.tripData.noOfTrips && + formData.tripData.amountPerTrip + ) { + setValue({ + amount: formData.tripData.amountPerTrip * formData.tripData.noOfTrips, + }); + } else if ( + formData?.propertyType && + formData?.subtype && + formData?.address && + formData?.tripData?.vehicleType?.capacity && + formData?.address?.propertyLocation?.code === "WITHIN_ULB_LIMITS" + ) { const capacity = formData?.tripData?.vehicleType.capacity; const { slum: slumDetails } = formData.address; const slum = slumDetails ? "YES" : "NO"; @@ -116,7 +130,7 @@ const SelectTrips = ({ t, config, onSelect, formData = {}, userType, styles, FSM } } })(); - }, [formData?.propertyType, formData?.subtype, formData?.address, formData?.tripData?.vehicleType?.capacity, formData?.tripData?.noOfTrips]); + }, [formData?.propertyType, formData?.subtype, formData?.address, formData?.tripData?.vehicleType?.capacity, formData?.tripData?.noOfTrips, formData?.address?.propertyLocation?.code]); return isVehicleMenuLoading && isDsoLoading ? ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectVehicleType.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectVehicleType.js index 210f516b574..3d705f281a6 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectVehicleType.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pageComponents/SelectVehicleType.js @@ -20,7 +20,7 @@ const SelectVehicleType = ({ t, config, onSelect, userType, formData, setValue } setSelectedType(...vehicleType); setSelectedCapacity(formData?.vehicle?.tankCapacity); } - }, [formData?.vehicle, vehicleData]); + }, [vehicleData]); useEffect(() => { if (selectedModal?.code && selectedModal?.code !== formData?.vehicle?.modal) { @@ -37,6 +37,8 @@ const SelectVehicleType = ({ t, config, onSelect, userType, formData, setValue } useEffect(() => { if (vehicleData) { const vehicleModals = vehicleData.filter((vehicle) => vehicle.make === undefined); + const types = vehicleData.filter((vehicle) => formData?.vehicle?.modal != undefined && vehicle?.make === formData?.vehicle?.modal?.code); + setTypes(types); setModals(vehicleModals); } }, [vehicleData]); @@ -66,7 +68,7 @@ const SelectVehicleType = ({ t, config, onSelect, userType, formData, setValue } isMandatory selected={selectedModal} disable={false} - option={modals} + option={modals?.sort((a, b) => a.name.localeCompare(b.name))} select={selectModal} optionKey="name" t={t} @@ -77,7 +79,15 @@ const SelectVehicleType = ({ t, config, onSelect, userType, formData, setValue } {t("ES_FSM_REGISTRY_VEHICLE_TYPE")} {config.isMandatory ? " * " : null} - + a.name.localeCompare(b.name))} + select={selectType} + optionKey="name" + t={t} + /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/Response.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/Response.js index dca73360a50..e350c7d6a8e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/Response.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/Response.js @@ -29,7 +29,7 @@ const DisplayText = (action, isSuccess, isEmployee, t, data) => { }; const BannerPicker = (props) => { - let actionMessage = props?.action ? props.action : "CREATE"; + let actionMessage = props?.action ? props.action : props.data?.fsm?.[0].applicationStatus; let labelMessage = GetLabel(props.data?.fsm?.[0].applicationStatus || props.action, props.isSuccess, props.isEmployee, props.t); if (props.errorInfo && props.errorInfo !== null && props.errorInfo !== "" && typeof props.errorInfo === "string" && props.action !== "SCHEDULE") { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/ApplicationDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/ApplicationDetails.js index 91f60fdb6f1..86a1924641a 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/ApplicationDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/ApplicationDetails.js @@ -101,4 +101,4 @@ const ApplicationDetails = () => { ); }; -export default ApplicationDetails; \ No newline at end of file +export default ApplicationDetails; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/MyApplications/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/MyApplications/index.js index d2201406f77..f640cb4c195 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/MyApplications/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/MyApplications/index.js @@ -1,5 +1,5 @@ import React from "react"; -import { Header, Loader } from "@egovernments/digit-ui-react-components"; +import { Header, Loader, Card } from "@egovernments/digit-ui-react-components"; import MyApplication from "./MyApplication"; import { useTranslation } from "react-i18next"; @@ -27,6 +27,11 @@ export const MyApplications = () => {
))} + {applicationsList.length === 0 && ( + +

{`${t("FSM_NO_APPLICATION")} ${userInfo.mobileNumber}`}

+
+ )}
); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/CheckPage.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/CheckPage.js index 235fee85fe2..4951ad39837 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/CheckPage.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/CheckPage.js @@ -43,7 +43,6 @@ const CheckPage = ({ onSubmit, value }) => { return previous + current + "m x "; } }, ""); - return ( @@ -69,7 +68,7 @@ const CheckPage = ({ onSubmit, value }) => { {selectGender && ( } /> )} @@ -80,19 +79,19 @@ const CheckPage = ({ onSubmit, value }) => { /> } /> } /> } /> {address?.landmark?.trim() && ( @@ -157,4 +156,4 @@ const CheckPage = ({ onSubmit, value }) => { ); }; -export default CheckPage; \ No newline at end of file +export default CheckPage; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/Response.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/Response.js index 4c72f53c897..c45af3d50a3 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/Response.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/NewApplication/Response.js @@ -14,7 +14,7 @@ const BannerPicker = (props) => { return ( @@ -52,13 +52,27 @@ const Response = ({ data, onSuccess }) => { }, [mutation.data]); useEffect(() => { - console.log("errorInfoerrorInfo",errorInfo) if (!mutationHappened && !errorInfo) { try { const amount = Digit.SessionStorage.get("total_amount"); const amountPerTrip = Digit.SessionStorage.get("amount_per_trip"); const { subtype, propertyID, pitDetail, address, pitType, source, selectGender, selectPaymentPreference, selectTripNo } = data; - const { city, locality, geoLocation, pincode, street, doorNo, landmark, slum } = address; + const { + city, + locality, + geoLocation, + pincode, + street, + doorNo, + landmark, + slum, + gramPanchayat, + village, + propertyLocation, + newLocality, + newGramPanchayat, + newVillage, + } = address; setPaymentPreference(selectPaymentPreference?.code); const advanceAmount = amount === 0 ? null : selectPaymentPreference?.advanceAmount; amount === 0 ? setZeroPay(true) : setZeroPay(false); @@ -68,21 +82,35 @@ const Response = ({ data, onSuccess }) => { citizen: { gender: selectGender?.code, }, - tenantId: city.code, + tenantId: city?.code, additionalDetails: {}, - propertyUsage: subtype.code, + propertyUsage: subtype?.code, address: { - tenantId: city.code, - additionalDetails: null, + tenantId: city?.code, + additionalDetails: { + boundaryType: propertyLocation?.code === "FROM_GRAM_PANCHAYAT" ? "GP" : "Locality", + gramPanchayat: { + code: gramPanchayat?.code, + name: gramPanchayat?.name, + }, + village: village?.code + ? { + code: village?.code ? village?.code : "", + name: village?.name ? village?.name : "", + } + : newVillage, + newLocality: newLocality, + newGramPanchayat: newGramPanchayat, + }, street: street?.trim(), doorNo: doorNo?.trim(), landmark: landmark?.trim(), slumName: slum, - city: city.name, + city: city?.name, pincode, locality: { - code: locality.code, - name: locality.name, + code: propertyLocation?.code === "WITHIN_ULB_LIMITS" ? locality?.code : gramPanchayat?.code, + name: propertyLocation?.code === "WITHIN_ULB_LIMITS" ? locality?.name : gramPanchayat?.name, }, geoLocation: { latitude: geoLocation?.latitude, @@ -104,12 +132,12 @@ const Response = ({ data, onSuccess }) => { vehicleCapacity: selectTripNo ? selectTripNo?.vehicleCapacity?.capacity : "", additionalDetails: { totalAmount: amount, - tripAmount: amountPerTrip, + tripAmount: typeof amountPerTrip === "number" ? JSON.stringify(amountPerTrip) : amountPerTrip, propertyID : propertyID?.propertyID, - distancefromroad : data.roadWidth.distancefromroad, - roadWidth: data.roadWidth.roadWidth, + distancefromroad : data?.roadWidth?.distancefromroad, + roadWidth: data?.roadWidth?.roadWidth, }, - advanceAmount, + advanceAmount: typeof advanceAmount === "number" ? JSON.stringify(advanceAmount) : advanceAmount, }, workflow: null, }; @@ -121,6 +149,7 @@ const Response = ({ data, onSuccess }) => { }, }); sessionStorage.removeItem("Digit.total_amount"); + sessionStorage.removeItem("Digit.fsm.file.address.city"); } catch (err) {} } }, []); @@ -134,14 +163,20 @@ const Response = ({ data, onSuccess }) => { Digit.Utils.pdf.generate(data); }; const isSuccess = !successData ? mutation?.isSuccess : true; -console.log("mutation",mutation,mutationHappened) + return mutation.isLoading || (mutation.isIdle && !mutationHappened) ? ( ) : ( - {t((paymentPreference && paymentPreference == "POST_PAY") || advancePay ? "CS_FILE_PROPERTY_RESPONSE_POST_PAY" : zeroPay ? "CS_FSM_RESPONSE_CREATE_DISPLAY_ZERO_PAY" : "CS_FILE_PROPERTY_RESPONSE")} + {t( + (paymentPreference && paymentPreference == "POST_PAY") || advancePay + ? "CS_FILE_PROPERTY_RESPONSE_POST_PAY" + : zeroPay + ? "CS_FSM_RESPONSE_CREATE_DISPLAY_ZERO_PAY" + : "CS_FILE_PROPERTY_RESPONSE" + )} {isSuccess && ( { configs = [...config] configs.indexRoute = "select-trip-number"; -let newConfig=[ - { - "label": "ES_NEW_APPLICATION_PROPERTY_ID", - "isMandatory": true, - "type": "component", - "route": "property-id", - "key": "propertyID", - "component": "SelectPropertyID", - "texts": { - "headerCaption": "", - "header": "CS_FILE_APPLICATION_PROPERTY_ID_LABEL", - "cardText": "CS_FILE_APPLICATION_PROPERTY_ID_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "nextStep": "property-type" - }, - { - "label": "ES_NEW_APPLICATION_PROPERTY_TYPE", - "isMandatory": true, - "type": "component", - "route": "property-type", - "key": "propertyType", - "component": "SelectPropertyType", - "texts": { - "headerCaption": "", - "header": "CS_FILE_APPLICATION_PROPERTY_LABEL", - "cardText": "CS_FILE_APPLICATION_PROPERTY_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "nextStep": "property-subtype" - }, - { - "label": "ES_NEW_APPLICATION_PROPERTY_SUB-TYPE", - "isMandatory": true, - "type": "component", - "route": "property-subtype", - "key": "subtype", - "component": "SelectPropertySubtype", - "texts": { - "headerCaption": "", - "header": "CS_FILE_APPLICATION_PROPERTY_SUBTYPE_LABEL", - "cardText": "CS_FILE_APPLICATION_PROPERTY_SUBTYPE_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "nextStep": "map" - }, - { - "route": "map", - "component": "FSMSelectGeolocation", - "nextStep": "pincode", - "hideInEmployee": true, - "key": "address" - }, - { - "route": "pincode", - "component": "FSMSelectPincode", - "texts": { - "headerCaption": "", - "header": "CS_FILE_APPLICATION_PINCODE_LABEL", - "cardText": "CS_FILE_APPLICATION_PINCODE_TEXT", - "submitBarLabel": "CS_COMMON_NEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE" - }, - "withoutLabel": true, - "key": "address", - "nextStep": "address", - "type": "component" - }, - { - "route": "address", - "component": "FSMSelectAddress", - "withoutLabel": true, - "texts": { - "headerCaption": "CS_FILE_APPLICATION_PROPERTY_LOCATION_LABEL", - "header": "CS_FILE_APPLICATION_PROPERTY_LOCATION_ADDRESS_TEXT", - "cardText": "CS_FILE_APPLICATION_PROPERTY_LOCATION_CITY_MOHALLA_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "key": "address", - "nextStep": "check-slum", - "isMandatory": true, - "type": "component" - }, - { - "type": "component", - "route": "check-slum", - "isMandatory": true, - "component": "CheckSlum", - "texts": { - "header": "ES_NEW_APPLICATION_SLUM_CHECK", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "key": "address", - "withoutLabel": true, - "nextStep": "slum-details", - "hideInEmployee": true - }, - { - "type": "component", - "route": "slum-details", - "isMandatory": true, - "component": "SelectSlumName", - "texts": { - "header": "CS_NEW_APPLICATION_SLUM_NAME", - "cardText": "CS_NEW_APPLICATION_SLUM_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "withoutLabel": true, - "key": "address", - "nextStep": "street" - }, - { - "type": "component", - "route": "street", - "component": "FSMSelectStreet", - "key": "address", - "withoutLabel": true, - "texts": { - "headerCaption": "CS_FILE_APPLICATION_PROPERTY_LOCATION_LABEL", - "header": "CS_FILE_APPLICATION_PROPERTY_LOCATION_ADDRESS_TEXT", - "cardText": "CS_FILE_APPLICATION_PROPERTY_LOCATION_STREET_DOOR_NO_LABEL", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "nextStep": "landmark" - }, - { - "type": "component", - "route": "landmark", - "component": "FSMSelectLandmark", - "withoutLabel": true, - "texts": { - "headerCaption": "CS_FILE_APPLICATION_PROPERTY_LOCATION_LABEL", - "header": "CS_FILE_APPLICATION_PROPERTY_LOCATION_PROVIDE_LANDMARK_TITLE", - "cardText": "CS_FILE_APPLICATION_PROPERTY_LOCATION_PROVIDE_LANDMARK_TEXT", - "submitBarLabel": "CS_COMMON_NEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE" - }, - "key": "address", - "nextStep": "pit-type" - }, - { - "label": "ES_NEW_APPLICATION_ROAD_WIDTH", - "isMandatory": true, - "type": "component", - "route": "road-details", - "key": "roadWidth", - "hideInEmployee": true, - "component": "SelectRoadDetails", - "texts": { - "header": "CS_FILE_PROPERTY_ROAD_WIDTH", - "cardText": "CS_FILE_PROPERTY_ROAD_WIDTH_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - - }, - "nextStep": "tank-size" - }, - { - "label": "ES_NEW_APPLICATION_PIT_TYPE", - "isMandatory": true, - "type": "component", - "route": "pit-type", - "key": "pitType", - "component": "SelectPitType", - "texts": { - "header": "CS_FILE_PROPERTY_PIT_TYPE", - "cardText": "CS_FILE_PROPERTY_PIT_TYPE_TEXT", - "submitBarLabel": "CS_COMMON_NEXT" - }, - "nextStep": "road-details" - }, - { - "route": "tank-size", - "component": "SelectTankSize", - "isMandatory": false, - "texts": { - "headerCaption": "", - "header": "CS_FILE_APPLICATION_PIT_SEPTIC_TANK_SIZE_TITLE", - "cardText": "CS_FILE_APPLICATION_PIT_SEPTIC_TANK_SIZE_TEXT", - "submitBarLabel": "CS_COMMON_NEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE" - }, - "type": "component", - "key": "pitDetail", - "nextStep": "select-payment-preference", - "label": "ES_NEW_APPLICATION_PIT_DIMENSION" - }, - { - "type": "component", - "key": "tripData", - "withoutLabel": true, - "component": "SelectTrips" - }, - { - "label": "a", - "isMandatory": true, - "type": "component", - "route": "select-trip-number", - "key": "selectTripNo", - "component": "SelectTripNo", - "hideInEmployee": true, - "texts": { - "headerCaption": "", - "header": "ES_FSM_SERVICE_REQUEST", - "cardText": "ES_FSM_SERVICE_REQUEST_TEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE", - "submitBarLabel": "CS_COMMON_NEXT", - "skipLabel": "CS_COMMON_SERVICE_SKIP_INFO" - }, - "nextStep": "property-id" - }, - { - "label": "a", - "isMandatory": false, - "type": "component", - "route": "select-gender", - "hideInEmployee": true, - "key": "selectGender", - "component": "SelectGender", - "texts": { - "headerCaption": "", - "header": "CS_COMMON_CHOOSE_GENDER", - "cardText": "CS_COMMON_SELECT_GENDER", - "submitBarLabel": "CS_COMMON_NEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE" - }, - "nextStep": "select-payment-preference" - }, - { - "label": "a", - "isMandatory": false, - "type": "component", - "route": "select-payment-preference", - "key": "selectPaymentPreference", - "hideInEmployee": true, - "component": "SelectPaymentPreference", - "texts": { - "headerCaption": "", - "header": "ES_FSM_PAYMENT_PREFERENCE_LABEL", - "cardText": "ES_FSM_PAYMENT_PREFERENCE_TEXT", - "submitBarLabel": "CS_COMMON_NEXT", - "skipText": "CORE_COMMON_SKIP_CONTINUE" - }, - "nextStep": null - }, - { - "type": "component", - "key": "tripData", - "withoutLabel": true, - "component": "SelectTripData" - }, - { - "type": "component", - "key": "advancepaymentPreference", - "withoutLabel": true, - "component": "AdvanceCollection" - } -] + return ( - {newConfig.map((routeObj, index) => { + {configs.map((routeObj, index) => { const { component, texts, inputs, key } = routeObj; const Component = typeof component === "string" ? Digit.ComponentRegistryService.getComponent(component) : component; return ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/Rating/SelectRating.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/Rating/SelectRating.js index a7b317f238c..ff3b856f0e8 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/Rating/SelectRating.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/Rating/SelectRating.js @@ -140,12 +140,6 @@ const SelectRating = ({ parentRoute }) => { name: "comments", className: "Hello", }, - { - type: "text", - label: t("CS_NO_TRIPS"), - name: "noOfTrips", - className: "Hello", - }, ], }; return ( diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/index.js index 179fa3174d0..0f60d94c0a9 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/citizen/index.js @@ -19,7 +19,11 @@ const CitizenApp = ({ path }) => { return (
- {location.pathname.includes("/response") || location.pathname.split("/").includes("check") ? null : {t("CS_COMMON_BACK")}} + {location.pathname.includes("/response") || location.pathname.split("/").includes("check") ? null : location.pathname.includes("/street") ? ( + -4}>{t("CS_COMMON_BACK")} + ) : ( + {t("CS_COMMON_BACK")} + )} { const uuids = auditResponse?.fsmAudit?.map((e) => e.who); const userList = Digit.Hooks.useUserSearch( - // tenantId.includes(".") ? tenantId.split(".")[0] : tenantId, null, { uuid: uuids }, {}, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/Modal/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/Modal/index.js index 90977c59f0f..f182881a6f4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/Modal/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/Modal/index.js @@ -63,8 +63,6 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, const client = useQueryClient(); const stateCode = Digit.ULBService.getStateId(); - const { data: ReceivedPaymentTypeData, isLoading: receivedPaymentLoad } = Digit.Hooks.fsm.useMDMS(stateCode, "FSM", "ReceivedPaymentType"); - const { data: vehicleList, isLoading: isVehicleData, isSuccess: isVehicleDataLoaded } = Digit.Hooks.fsm.useMDMS( stateCode, "Vehicle", @@ -131,25 +129,16 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, const [pitDetail, setPitDetail] = useState(); const [fstpoRejectionReason, setFstpoRejectionReason] = useState(); const [noOfTrips, setNoOfTrips] = useState(null); - const [receivedPaymentType, setReceivedPaymentType] = useState(null); + const [defaultValues, setDefautValue] = useState({ capacity: vehicle?.capacity, wasteCollected: vehicle?.capacity, - propertyID : applicationData?.additionalDetails?.propertyID, - distancefromroad: applicationData?.additionalDetails?.distancefromroad, - roadWidth: applicationData?.additionalDetails?.roadWidth, propertyType: applicationData?.propertyUsage.split('.')[0], subtype: applicationData?.propertyUsage, pitType: applicationData?.sanitationtype, pitDetail: applicationData?.pitDetail, }); - useEffect(() => { - if (!receivedPaymentLoad) { - setReceivedPaymentType(ReceivedPaymentTypeData) - } - }, [receivedPaymentLoad, ReceivedPaymentTypeData]); - useEffect(() => { if (isSuccess && isVehicleDataLoaded && applicationData) { const [vehicle] = vehicleList.filter((item) => item.code === applicationData.vehicleType); @@ -207,7 +196,8 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, useEffect(() => { if (isSuccess && isDsoSuccess && applicationData && applicationData.dsoId) { const [dso] = dsoData.filter((dso) => dso.id === applicationData.dsoId); - const vehicleNoList = dso?.vehicles?.filter((vehicle) => vehicle.capacity == applicationData?.vehicleCapacity); + const tempList = dso?.vehicles?.filter((vehicle) => vehicle.capacity == applicationData?.vehicleCapacity); + const vehicleNoList = tempList.sort((a,b) => (a.registrationNumber > b.registrationNumber ? 1 : -1 )); setVehicleNoList(vehicleNoList); } }, [isSuccess, isDsoSuccess]); @@ -287,7 +277,6 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, if (data.subtype && typeof (data.subtype) === "object") applicationData.propertyUsage = data.subtype.code; if (data.subtype && typeof (data.subtype) === "string") applicationData.propertyUsage = data.subtype; if (data.noOfTrips) applicationData.noOfTrips = data.noOfTrips; - if (data.paymentMode) applicationData.additionalDetails.receivedPayment = data.paymentMode.code; if (fileStoreId) { if (applicationData.pitDetail.additionalDetails && applicationData.pitDetail.additionalDetails.fileStoreId) { @@ -305,13 +294,14 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, if (cancelReason) addCommentToWorkflow(cancelReason, workflow, data); if (fstpoRejectionReason && data.comments) workflow.comments = data.comments; if (fstpoRejectionReason) workflow.fstpoRejectionReason = fstpoRejectionReason?.code; - if (data.distancefromroad) applicationData.additionalDetails.distancefromroad = data?.distancefromroad; - if (data.roadWidth) applicationData.additionalDetails.roadWidth = data?.roadWidth; + submitAction({ fsm: applicationData, workflow }); } useEffect(() => { switch (action) { case "UPDATE": + case "SCHEDULE": + case "ES_FSM_SCHEDULE": setFormValve(true); return setConfig( configUpdateTrips({ @@ -384,7 +374,7 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, case "COMPLETE": case "COMPLETED": setFormValve(true); - return setConfig(configCompleteApplication({ t, vehicle, vehicleCapacity: applicationData?.vehicleCapacity, noOfTrips: applicationData?.noOfTrips, applicationCreatedTime: applicationData?.auditDetails?.createdTime, receivedPaymentType: ReceivedPaymentTypeData, action, module })); + return setConfig(configCompleteApplication({ t, vehicle, vehicleCapacity: applicationData?.vehicleCapacity, noOfTrips: applicationData?.noOfTrips, applicationCreatedTime: applicationData?.auditDetails?.createdTime, action, module })); case "SUBMIT": case "FSM_SUBMIT": return history.push("/digit-ui/employee/fsm/modify-application/" + applicationNumber); @@ -427,22 +417,22 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, action, }) ); - case "SCHEDULE": - case "ES_FSM_SCHEDULE": - setFormValve(true); - return setConfig( - configScheduleDso({ - t, - rejectMenu: Reason?.DeclineReason, - setReason: setDeclineReason, - reason: declineReason, - applicationCreatedTime: applicationData?.auditDetails?.createdTime, - vehicle, - vehicleCapacity: applicationData?.vehicleCapacity, - action, - noOfTrips: applicationData?.noOfTrips - }) - ); + // case "SCHEDULE": + // case "ES_FSM_SCHEDULE": + // setFormValve(true); + // return setConfig( + // configScheduleDso({ + // t, + // rejectMenu: Reason?.DeclineReason, + // setReason: setDeclineReason, + // reason: declineReason, + // applicationCreatedTime: applicationData?.auditDetails?.createdTime, + // vehicle, + // vehicleCapacity: applicationData?.vehicleCapacity, + // action, + // noOfTrips: applicationData?.noOfTrips + // }) + // ); case "PAY": case "ADDITIONAL_PAY_REQUEST": diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/AssignDso.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/AssignDso.js index aecbdc14e61..89fd250e111 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/AssignDso.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/AssignDso.js @@ -104,7 +104,10 @@ export const configAssignDso = ({ t, dsoData, dso, selectDSO, vehicleMenu, vehic validation: { required: true, }, - customProps: { min: Digit.Utils.date.getDate() }, + customProps: { + min: Digit.Utils.date.getDate(), + max: Digit.Utils.date.getDate(Date.now() + 10 * 24 * 60 * 60 * 1000), + }, defaultValue: Digit.Utils.date.getDate(), component: (props, customProps) => , }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/CompleteApplication.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/CompleteApplication.js index 7be1c215f01..01244431bca 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/CompleteApplication.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/CompleteApplication.js @@ -3,10 +3,9 @@ import { DatePicker } from "@egovernments/digit-ui-react-components"; import { RadioButtons } from "@egovernments/digit-ui-react-components"; -export const configCompleteApplication = ({ t, vehicle, vehicleCapacity, noOfTrips, applicationCreatedTime = 0, receivedPaymentType, action, module }) => ({ +export const configCompleteApplication = ({ t, vehicle, vehicleCapacity, noOfTrips, applicationCreatedTime = 0, action, module }) => ({ label: { - heading: `ES_FSM_ACTION_TITLE_${action}`, submit: `CS_COMMON_${action}`, cancel: "CS_COMMON_CLOSE", }, @@ -71,30 +70,6 @@ export const configCompleteApplication = ({ t, vehicle, vehicleCapacity, noOfTri }, nextStep: "property-type", }, - { - label: t("ES_FSM_ACTION_ROAD_WIDTH"), - type: "number", - isMandatory: true, - populators: { - name: "roadWidth", - validation: { - required: true, - }, - }, - disable: false, - }, - { - label: t("ES_FSM_ACTION_DISTANCE_FROM_ROAD"), - type: "number", - isMandatory: true, - populators: { - name: "distancefromroad", - validation: { - required: true, - }, - }, - disable: false, - }, { label: "ES_NEW_APPLICATION_PROPERTY_TYPE", isMandatory: true, @@ -172,7 +147,7 @@ export const configCompleteApplication = ({ t, vehicle, vehicleCapacity, noOfTri disable: true, // disable: customizationConfig ? !customizationConfig?.noOfTrips?.override : true, }, - module !== "FSM_ZERO_PAY_SERVICE" && { + /*module !== "FSM_ZERO_PAY_SERVICE" && { label: "FSM_PAYMENT_RECEIVED", isMandatory: true, type: "custom", @@ -199,7 +174,7 @@ export const configCompleteApplication = ({ t, vehicle, vehicleCapacity, noOfTri /> ), }, - }, + }, */ ], }, ], diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectApplication.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectApplication.js index d6a41117ed8..c706cdc0992 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectApplication.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectApplication.js @@ -14,7 +14,16 @@ export const configRejectApplication = ({ t, rejectMenu, setReason, reason, acti { label: t(`ES_FSM_ACTION_${action.toUpperCase()}_REASON`), type: "dropdown", - populators: , + populators: ( + a.name.localeCompare(b.name))} + id="reason" + optionKey="i18nKey" + selected={reason} + select={setReason} + /> + ), isMandatory: true, }, { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectFstpo.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectFstpo.js index 75d099111f3..86a641c5b2e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectFstpo.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/config/RejectFstpo.js @@ -17,7 +17,7 @@ export const configRejectFstpo = ({ t, rejectMenu, selectReason, reason, action type: "dropdown", populators: ( a.name.localeCompare(b.name))} autoComplete="off" optionKey="i18nKey" id="Reason" diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/index.js index af4a1aa6632..9cf9adfeaf4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/ApplicationDetails/index.js @@ -20,6 +20,7 @@ import { ActionLinks, Header, ImageViewer, + MultiLink, } from "@egovernments/digit-ui-react-components"; import ActionModal from "./Modal"; @@ -29,7 +30,8 @@ import { useQueryClient } from "react-query"; import { Link, useHistory, useParams } from "react-router-dom"; import { ViewImages } from "../../../components/ViewImages"; -import _ from "lodash"; +import getPDFData from "../../../getPDFData"; + const ApplicationDetails = (props) => { const tenantId = Digit.ULBService.getCurrentTenantId(); const state = Digit.ULBService.getStateId(); @@ -44,6 +46,12 @@ const ApplicationDetails = (props) => { const [showToast, setShowToast] = useState(null); const [imageZoom, setImageZoom] = useState(null); const DSO = Digit.UserService.hasAccess(["FSM_DSO"]) || false; + const [showOptions, setShowOptions] = useState(false); + const { data: storeData } = Digit.Hooks.useStore.getInitData(); + + const { tenants } = storeData || {}; + + const { data: paymentsHistory } = Digit.Hooks.fsm.usePaymentHistory(tenantId, applicationNumber); const { isLoading, isError, data: applicationDetails, error } = Digit.Hooks.fsm.useApplicationDetail( t, @@ -75,10 +83,9 @@ const ApplicationDetails = (props) => { : applicationData?.advanceAmount === 0 ? "PAY_LATER_SERVICE" : applicationData?.advanceAmount > 0 - ? "FSM_ADVANCE_PAY_SERVICE_V1" + ? "FSM_ADVANCE_PAY_SERVICE" : applicationData?.paymentPreference === null && applicationData?.additionalDetails?.tripAmount === 0 && - applicationData?.additionalDetails?.propertyID===0 && applicationData?.advanceAmount === null ? "FSM_ZERO_PAY_SERVICE" : "FSM", @@ -100,7 +107,7 @@ const ApplicationDetails = (props) => { useEffect(() => { switch (selectedAction) { - case DSO && "SCHEDULE": + case "SCHEDULE": case "DSO_ACCEPT": case "ACCEPT": case "ASSIGN": @@ -119,7 +126,7 @@ const ApplicationDetails = (props) => { return setShowModal(true); case "SUBMIT": case "FSM_SUBMIT": - case !DSO && "SCHEDULE": + // case !DSO && "SCHEDULE": return history.push("/digit-ui/employee/fsm/modify-application/" + applicationNumber); case "PAY": case "FSM_PAY": @@ -196,15 +203,7 @@ const ApplicationDetails = (props) => { date: `${t("CS_FSM_EXPECTED_DATE")} ${Digit.DateUtils.ConvertTimestampToDate(applicationData?.possibleServiceDate)}`, }; return ; - } - else if (checkpoint.status === "PENDING_PAYYY") { - const caption = { - name: checkpoint?.assigner, - mobileNumber: checkpoint?.assigner?.mobileNumber, - date: `${t("CS_FSM_EXPECTED_DATE")} ${Digit.DateUtils.ConvertTimestampToDate(applicationData?.possibleServiceDate)}`, - }; - return ; - }else if (checkpoint.status === "COMPLETED") { + } else if (checkpoint.status === "COMPLETED") { return (
@@ -227,42 +226,84 @@ const ApplicationDetails = (props) => { if (checkpoint?.numberOfTrips) caption.comment = `${t("NUMBER_OF_TRIPS")}: ${checkpoint?.numberOfTrips}`; return ; } - else if(checkpoint.status === "ASSING_DSO_PAY") - { - const caption = { - name: checkpoint?.assigner, - mobileNumber: checkpoint?.assigner?.mobileNumber, - date: `${t("CS_FSM_EXPECTED_DATE")} ${Digit.DateUtils.ConvertTimestampToDate(applicationData?.possibleServiceDate)}`, - }; - return ; - } }; + const handleDownloadPdf = async () => { + const tenantInfo = tenants.find((tenant) => tenant.code === applicationDetails?.tenantId); + const data = getPDFData({ ...applicationDetails?.applicationDetailsResponse }, tenantInfo, t); + Digit.Utils.pdf.generate(data); + setShowOptions(false); + }; + + const downloadPaymentReceipt = async () => { + const receiptFile = { + filestoreIds: [paymentsHistory.Payments[0]?.fileStoreId], + }; + + if (!receiptFile?.fileStoreIds?.[0]) { + const newResponse = await Digit.PaymentService.generatePdf(state, { Payments: [paymentsHistory.Payments[0]] }, "fsm-receipt"); + const fileStore = await Digit.PaymentService.printReciept(state, { + fileStoreIds: newResponse.filestoreIds[0], + }); + window.open(fileStore[newResponse.filestoreIds[0]], "_blank"); + setShowOptions(false); + } else { + const fileStore = await Digit.PaymentService.printReciept(state, { + fileStoreIds: receiptFile.filestoreIds[0], + }); + window.open(fileStore[receiptFile.filestoreIds[0]], "_blank"); + setShowOptions(false); + } + }; + const [isDisplayDownloadMenu, setIsDisplayDownloadMenu] = useState(false); + + let dowloadOptions = + paymentsHistory?.Payments?.length > 0 + ? [ + { + label: t("CS_COMMON_APPLICATION_ACKNOWLEDGEMENT"), + onClick: handleDownloadPdf, + }, + { + label: t("CS_DOWNLOAD_RECEIPT"), + onClick: downloadPaymentReceipt, + }, + ] + : [ + { + label: t("CS_COMMON_APPLICATION_ACKNOWLEDGEMENT"), + onClick: handleDownloadPdf, + }, + ]; + if (isLoading) { return ; } -let deepCopy = _.cloneDeep( workflowDetails ) -let index1 =0 -deepCopy?.data?.timeline.map((check,index) => { - if (check.status == "ASSING_DSO" && index1 ==0) - { - let obj= check - obj.status = "PENDING_PAYYY" - index1 +=1 - workflowDetails.data.timeline[index].status ="ASSING_DSO_PAY" - workflowDetails.data.timeline.splice(index, 0, obj); - } -}) return ( {!isLoading ? ( -
{t("ES_TITLE_APPLICATION_DETAILS")}
+
+
{t("ES_TITLE_APPLICATION_DETAILS")}
+ setIsDisplayDownloadMenu(!isDisplayDownloadMenu)} + style={{ marginTop: "10px" }} + downloadBtnClassName={"employee-download-btn-className"} + optionsClassName={"employee-options-btn-className"} + options={dowloadOptions} + displayOptions={isDisplayDownloadMenu} + + // displayOptions={showOptions} + // options={dowloadOptions} + /> +
+ {/* {!DSO && ( {t("ES_APPLICATION_DETAILS_VIEW_AUDIT_TRAIL")}} + label={{t("ES_APPLICATION_DETAILS_VIEW_AUDIT_TRAIL")}} style={{ position: "absolute", top: 0, right: 20 }} onClick={() => { history.push(props.parentRoute + "/application-audit/" + applicationNumber); @@ -369,7 +410,7 @@ deepCopy?.data?.timeline.map((check,index) => { onClose={closeToast} /> )} - {!workflowDetails?.isLoading && workflowDetails?.data?.nextActions?.length === 1 && ( + {!workflowDetails?.isLoading && workflowDetails?.data?.nextActions?.length === 1 && workflowDetails?.data?.nextActions?.[0]?.action !== "RATE" && ( { ); }; -export default ApplicationDetails; \ No newline at end of file +export default ApplicationDetails; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/EditApplication/EditForm.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/EditApplication/EditForm.js index 67ead7e8999..c79adecc714 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/EditApplication/EditForm.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/EditApplication/EditForm.js @@ -1,6 +1,6 @@ -import React, { useState, useEffect, Fragment } from "react"; +import React, { useState, useEffect } from "react"; import { useHistory } from "react-router-dom"; -import { FormComposer, Header, Loader } from "@egovernments/digit-ui-react-components"; +import { FormComposer, Loader } from "@egovernments/digit-ui-react-components"; import { useTranslation } from "react-i18next"; const isConventionalSpecticTank = (tankDimension) => tankDimension === "lbd"; @@ -22,8 +22,7 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat clearSuccessData(); clearError(); }, []); - - const defaultValues = { + var defaultValues = { channel: channelMenu.filter((channel) => channel.code === applicationData.source)[0], applicationData: { applicantName: applicationData.citizen.name, @@ -32,21 +31,21 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat }, tripData: { noOfTrips: applicationData.noOfTrips, - amountPerTrip: applicationData.additionalDetails.tripAmount, - amount: applicationData.noOfTrips * applicationData.additionalDetails.tripAmount || undefined, + amountPerTrip: applicationData.additionalDetails.tripAmount !== "null" ? applicationData.additionalDetails.tripAmount : "", + amount: + applicationData.additionalDetails.tripAmount !== "null" + ? applicationData.noOfTrips * applicationData.additionalDetails.tripAmount + : undefined, vehicleType: { capacity: applicationData?.vehicleCapacity }, vehicleCapacity: applicationData?.vehicleCapacity, - distancefromroad:applicationData.additionalDetails.distancefromroad, - roadWidth:applicationData.additionalDetails.roadWidth, }, propertyType: applicationData.propertyUsage.split(".")[0], subtype: applicationData.propertyUsage, - propertyID : applicationData.additionalDetails.propertyID, address: { pincode: applicationData.address.pincode, locality: { ...applicationData.address.locality, - i18nkey: `${applicationData.tenantId.toUpperCase().split(".").join("_")}_REVENUE_${applicationData.address.locality.code}`, + i18nkey: `${applicationData.tenantId.toUpperCase().split(".").join("_")}_REVENUE_${applicationData?.address?.locality?.code}`, }, slum: applicationData.address.slumName, street: applicationData.address.street, @@ -56,20 +55,57 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat pitType: sanitationMenu.filter((type) => type.code === applicationData.sanitationtype)[0], pitDetail: applicationData.pitDetail, paymentPreference: applicationData.paymentPreference, - advancepaymentPreference: { advanceAmount: applicationData?.advanceAmount }, + advanceAmount: applicationData.advanceAmount, }; - console.log("applicationData",defaultValues) + + if ( + (applicationData && applicationData?.address?.additionalDetails?.boundaryType === "Village") || + applicationData?.address?.additionalDetails?.boundaryType === "GP" + ) { + defaultValues.address = { + ...defaultValues.address, + propertyLocation: { + active: true, + code: "FROM_GRAM_PANCHAYAT", + i18nKey: "FROM_GRAM_PANCHAYAT", + name: "From Gram Panchayat", + }, + additionalDetails: { + boundaryType: applicationData?.address?.additionalDetails?.boundaryType, + gramPanchayat: applicationData?.address?.additionalDetails?.gramPanchayat, + village: applicationData?.address?.additionalDetails?.village, + newGp: applicationData?.address?.additionalDetails?.newGramPanchayat, + }, + }; + } else if (applicationData && applicationData?.address?.additionalDetails?.boundaryType === "Locality") { + defaultValues.address = { + ...defaultValues.address, + propertyLocation: { + active: true, + code: "WITHIN_ULB_LIMITS", + i18nKey: "WITHIN_ULB_LIMITS", + name: "Witnin ULB Limits", + }, + additionalDetails: { + boundaryType: applicationData?.address?.additionalDetails?.boundaryType, + newLocality: applicationData?.address?.additionalDetails?.newLocality, + }, + }; + } + const onFormValueChange = (setValue, formData) => { if ( formData?.propertyType && formData?.subtype && - formData?.address?.locality?.code && + (formData?.address?.locality?.code || + (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && + (formData?.address?.gramPanchayat?.code || formData?.address?.additionalDetails?.gramPanchayat?.code))) && formData?.tripData?.vehicleType && (formData?.tripData?.amountPerTrip || formData?.tripData?.amountPerTrip === 0) ) { setSubmitValve(true); const pitDetailValues = formData?.pitDetail ? Object.values(formData?.pitDetail).filter((value) => value > 0) : null; - let min = Digit.SessionStorage.get("advance_amount"); + // let min = Digit.SessionStorage.get("advance_amount"); if (formData?.pitType) { if (pitDetailValues === null || pitDetailValues?.length === 0) { setSubmitValve(true); @@ -79,12 +115,12 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat setSubmitValve(true); } else setSubmitValve(false); } - if (formData?.tripData?.amountPerTrip !== 0 && (formData?.advancepaymentPreference?.advanceAmount > formData?.tripData?.amount || formData?.advancepaymentPreference?.advanceAmount < min)) { + /*if (formData?.tripData?.amountPerTrip !== 0 && (formData?.advancepaymentPreference?.advanceAmount > formData?.tripData?.amount || formData?.advancepaymentPreference?.advanceAmount < min)) { setSubmitValve(false); } if (applicationData?.advanceAmount > 0 && formData?.advancepaymentPreference?.advanceAmount <= 0) { setSubmitValve(false); - } + } */ } else { setSubmitValve(false); } @@ -115,18 +151,32 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat const localityCode = data?.address?.locality?.code; const localityName = data?.address?.locality?.name; const propertyUsage = data?.subtype; - const advanceAmount = amount === 0 ? null : data?.advancepaymentPreference?.advanceAmount; + // const advanceAmount = amount === 0 ? null : data?.advancepaymentPreference?.advanceAmount; const { height, length, width, diameter } = pitDimension; + const advanceAmount = + amount === 0 + ? null + : data?.advancepaymentPreference?.advanceAmount + ? data?.advancepaymentPreference?.advanceAmount + : applicationData.advanceAmount; + const totalAmount = amount * noOfTrips; + const gramPanchayat = data?.address?.gramPanchayat || data?.address?.additionalDetails?.gramPanchayat; + const village = data?.address?.village || data?.address?.additionalDetails?.village; + const propertyLocation = data?.address?.propertyLocation?.code; + const newGp = data?.address?.newGp || data?.address?.additionalDetails?.newGramPanchayat; + const newVillage = data?.address?.newVillage || data?.address?.additionalDetails?.village; + const newLocality = data?.address?.newLocality || data?.address?.additionalDetails?.newLocality; + + const formData = { ...applicationData, sanitationtype: sanitationtype, source: applicationChannel.code, additionalDetails: { ...applicationData.additionalDetails, - tripAmount: amount, - distancefromroad:data.tripData.distancefromroad, - roadWidth:data.tripData.roadWidth, + tripAmount: typeof amount === "number" ? JSON.stringify(amount) : amount, + totalAmount: typeof totalAmount === "number" ? JSON.stringify(totalAmount) : totalAmount, }, propertyUsage, vehicleType: data.tripData.vehicleType.type, @@ -150,16 +200,31 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat slumName: slum, locality: { ...applicationData.address.locality, - code: localityCode, - name: localityName, + code: propertyLocation === "FROM_GRAM_PANCHAYAT" ? gramPanchayat?.code : localityCode, + name: propertyLocation === "FROM_GRAM_PANCHAYAT" ? gramPanchayat?.name : localityName, }, geoLocation: { ...applicationData.address.geoLocation, latitude: data?.address?.latitude ? data?.address?.latitude : applicationData.address.geoLocation.latitude, longitude: data?.address?.longitude ? data?.address?.longitude : applicationData.address.geoLocation.longitude, }, + additionalDetails: { + boundaryType: propertyLocation === "FROM_GRAM_PANCHAYAT" ? (village?.code ? "Village" : "GP") : "Locality", + gramPanchayat: { + code: gramPanchayat?.code, + name: gramPanchayat?.name, + }, + village: village?.code + ? { + code: village?.code ? village?.code : "", + code: village?.code ? village?.code : "", + } + : newVillage, + newGramPanchayat: newGp, + newLocality: newLocality, + }, }, - advanceAmount, + advanceAmount: typeof advanceAmount === "number" ? JSON.stringify(advanceAmount) : advanceAmount, }; delete formData["responseInfo"]; @@ -181,11 +246,12 @@ const EditForm = ({ tenantId, applicationData, channelMenu, vehicleMenu, sanitat } const configs = [...preFields, ...commonFields]; + return ( - <> -
-
{t("ES_TITLE_MODIFY_DESULDGING_APPLICATION")}
-
+ // <> + //
+ //
{t("ES_TITLE_MODIFY_DESULDGING_APPLICATION")}
+ //
- + // ); }; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/AddDriver.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/AddDriver.js index cbbe57d1ac7..0d171e35f60 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/AddDriver.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/AddDriver.js @@ -41,7 +41,7 @@ const AddDriver = ({ parentUrl, heading }) => { }; const onFormValueChange = (setValue, formData) => { - if (formData?.driverName && formData?.phone && formData?.selectGender) { + if (formData?.driverName && formData?.selectGender) { setSubmitValve(true); } else { setSubmitValve(false); @@ -57,7 +57,7 @@ const AddDriver = ({ parentUrl, heading }) => { const license = data?.license; const gender = data?.selectGender?.code; const emailId = data?.emailId; - const phone = data?.phone; + // const phone = data?.phone; const dob = new Date(`${data.dob}`).getTime() || new Date(`1/1/1970`).getTime(); const additionalDetails = data?.additionalDetails; const formData = { @@ -75,7 +75,7 @@ const AddDriver = ({ parentUrl, heading }) => { gender: gender, dob: dob, emailId: emailId || "abc@egov.com", - mobileNumber: phone, + // mobileNumber: phone, }, vendorDriverStatus: "INACTIVE", }, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/DriverDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/DriverDetails.js index 0252dcef5d9..8082ec9d382 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/DriverDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/DriverDetails.js @@ -111,6 +111,8 @@ const DriverDetails = (props) => { return setShowModal(true); case "EDIT": return history.push("/digit-ui/employee/fsm/registry/modify-driver/" + dsoId); + case "HOME": + return history.push("/digit-ui/employee/fsm/registry?selectedTabs=DRIVER"); default: break; } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/EditDriver.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/EditDriver.js index 5a2cfd2bf11..6b74298355b 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/EditDriver.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Driver/EditDriver.js @@ -45,7 +45,7 @@ const EditDriver = ({ parentUrl, heading }) => { selectGender: driverDetails?.driverData?.owner?.gender, dob: driverDetails?.driverData?.owner?.dob && Digit.DateUtils.ConvertTimestampToDate(driverDetails?.driverData?.owner?.dob, "yyyy-MM-dd"), emailId: driverDetails?.driverData?.owner?.emailId === "abc@egov.com" ? "" : driverDetails?.driverData?.owner?.emailId, - phone: driverDetails?.driverData?.owner?.mobileNumber, + // phone: driverDetails?.driverData?.owner?.mobileNumber, additionalDetails: driverDetails?.driverData?.additionalDetails?.description, }; setDefaultValues(values); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/AddVehicle.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/AddVehicle.js index 1cc541fc6b2..52725caf268 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/AddVehicle.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/AddVehicle.js @@ -1,6 +1,6 @@ import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; -import { FormComposer, Toast, Header } from "@egovernments/digit-ui-react-components"; +import { FormComposer, Toast, Header, InfoIcon } from "@egovernments/digit-ui-react-components"; import { useHistory } from "react-router-dom"; import VehicleConfig from "../../configs/VehicleConfig"; import { useQueryClient } from "react-query"; @@ -30,6 +30,19 @@ const AddVehicle = ({ parentUrl, heading }) => { const Config = VehicleConfig(t); + Config[0].body.forEach((item) => { + if (item.label === "ES_FSM_REGISTRY_VEHICLE_NUMBER") { + item.labelChildren = ( +
+ + + {t(item.populators.validation.title)} + +
+ ); + } + }); + const [canSubmit, setSubmitValve] = useState(false); const defaultValues = { @@ -41,7 +54,14 @@ const AddVehicle = ({ parentUrl, heading }) => { }; const onFormValueChange = (setValue, formData) => { - if (formData?.registrationNumber && formData?.ownerName && formData?.phone && formData?.vehicle?.modal && formData?.vehicle?.type) { + if ( + formData?.registrationNumber && + formData?.ownerName && + formData?.phone && + formData?.vehicle?.modal && + formData?.vehicle?.type && + formData?.selectGender + ) { setSubmitValve(true); } else { setSubmitValve(false); @@ -64,6 +84,10 @@ const AddVehicle = ({ parentUrl, heading }) => { const ownerName = data?.ownerName; const phone = data?.phone; const additionalDetails = data?.additionalDetails; + const gender = data?.selectGender?.code; + const emailId = data?.emailId; + const dob = new Date(`${data.dob}`).getTime() || new Date(`1/1/1970`).getTime(); + const formData = { vehicle: { tenantId: tenantId, @@ -84,10 +108,13 @@ const AddVehicle = ({ parentUrl, heading }) => { fatherOrHusbandName: ownerName, relationship: "OTHER", gender: "OTHERS", - dob: new Date(`1/1/1970`).getTime(), + dob: dob, emailId: "abc@egov.com", correspondenceAddress: "", mobileNumber: phone, + gender: gender, + dob: dob, + emailId: emailId || "abc@egov.com", }, additionalDetails: { description: additionalDetails, @@ -106,7 +133,7 @@ const AddVehicle = ({ parentUrl, heading }) => { queryClient.invalidateQueries("FSM_VEICLES_SEARCH"); setTimeout(() => { closeToast(); - history.push(`/digit-ui/employee/fsm/registry`); + history.push(`/digit-ui/employee/fsm/registry?selectedTabs=VEHICLE`); }, 5000); }, }); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/EditVehicle.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/EditVehicle.js index 57ec101841b..0e1ee15074c 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/EditVehicle.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/EditVehicle.js @@ -1,6 +1,6 @@ import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; -import { FormComposer, Loader, Toast, Header } from "@egovernments/digit-ui-react-components"; +import { FormComposer, Loader, Toast, Header, InfoIcon } from "@egovernments/digit-ui-react-components"; import { useHistory, useParams } from "react-router-dom"; import { useQueryClient } from "react-query"; import VehicleConfig from "../../configs/VehicleConfig"; @@ -60,6 +60,9 @@ const EditVehicle = ({ parentUrl, heading }) => { Digit.DateUtils.ConvertTimestampToDate(vehicleDetails?.vehicleData?.fitnessValidTill, "yyyy-MM-dd"), phone: vehicleDetails?.vehicleData?.owner?.mobileNumber, ownerName: vehicleDetails?.vehicleData?.owner?.name, + selectGender: vehicleDetails?.vehicleData?.owner?.gender, + dob: vehicleDetails?.vehicleData?.owner?.dob && Digit.DateUtils.ConvertTimestampToDate(vehicleDetails?.vehicleData?.owner?.dob, "yyyy-MM-dd"), + emailId: vehicleDetails?.vehicleData?.owner?.emailId === "abc@egov.com" ? "" : vehicleDetails?.vehicleData?.owner?.emailId, additionalDetails: vehicleDetails?.vehicleData?.additionalDetails?.description, }; setDefaultValues(values); @@ -71,6 +74,19 @@ const EditVehicle = ({ parentUrl, heading }) => { const Config = VehicleConfig(t, true); + Config[0].body.forEach((item) => { + if (item.label === "ES_FSM_REGISTRY_VEHICLE_NUMBER") { + item.labelChildren = ( +
+ + + {t(item.populators.validation.title)} + +
+ ); + } + }); + const onFormValueChange = (setValue, formData) => { if (formData?.registrationNumber && formData?.ownerName && formData?.phone && formData?.vehicle?.modal && formData?.vehicle?.type) { setSubmitValve(true); @@ -87,10 +103,10 @@ const EditVehicle = ({ parentUrl, heading }) => { const vehicleType = data?.vehicle?.type?.code || data?.vehicle?.type; const vehicleModal = data?.vehicle?.modal?.code || data?.vehicle?.modal; const tankCapacity = data?.vehicle?.type?.capacity || data?.vehicle?.tankCapacity; - const pollutionCert = new Date(`${data?.pollutionCert}`).getTime(); - const insurance = new Date(`${data?.insurance}`).getTime(); - const roadTax = new Date(`${data?.roadTax}`).getTime(); - const fitnessValidity = new Date(`${data?.fitnessValidity}`).getTime(); + const pollutionCert = data?.pollutionCert > 0 || data?.pollutionCert?.length > 0 ? new Date(`${data?.pollutionCert}`).getTime() : null; + const insurance = data?.insurance > 0 || data?.insurance?.length > 0 ? new Date(`${data?.insurance}`).getTime() : null; + const roadTax = data?.roadTax > 0 || data?.roadTax?.length > 0 ? new Date(`${data?.roadTax}`).getTime() : null; + const fitnessValidity = data?.fitnessValidity > 0 || data?.fitnessValidity?.length > 0 ? new Date(`${data?.fitnessValidity}`).getTime() : null; const additionalDetails = data?.additionalDetails; const formData = { vehicle: { @@ -106,6 +122,14 @@ const EditVehicle = ({ parentUrl, heading }) => { ...vehicleDetails.additionalDetails, description: additionalDetails, }, + owner: { + ...vehicleDetails.owner, + gender: gender || vehicleDetails.owner?.gender || "OTHER", + dob: dob, + emailId: emailId || "abc@egov.com", + name: vehicleOwnerName, + mobileNumber: phone, + }, }, }; mutate(formData, { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/VehicleDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/VehicleDetails.js index 285f5abf990..44c13032169 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/VehicleDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vehicle/VehicleDetails.js @@ -118,6 +118,8 @@ const VehicleDetails = (props) => { return setShowModal(true); case "EDIT": return history.push("/digit-ui/employee/fsm/registry/modify-vehicle/" + vehicleNumber); + case "HOME": + return history.push("/digit-ui/employee/fsm/registry?selectedTabs=VEHICLE"); default: break; } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/EditVendor.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/EditVendor.js index 56949b40960..10d14d4bb5b 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/EditVendor.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/EditVendor.js @@ -89,6 +89,7 @@ const EditVendor = ({ parentUrl, heading }) => { const onSubmit = (data) => { const name = data?.vendorName; + const phone = data?.phone; const pincode = data?.pincode; const street = data?.street?.trim(); const doorNo = data?.doorNo?.trim(); @@ -141,6 +142,7 @@ const EditVendor = ({ parentUrl, heading }) => { gender: gender || dsoDetails.owner?.gender || "OTHER", dob: dob, emailId: emailId || "abc@egov.com", + mobileNumber: phone, relationship: dsoDetails.owner?.relationship || "OTHER", }, additionalDetails: { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/VendorDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/VendorDetails.js index 2ec10e4c61f..ad2785d3a2d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/VendorDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/Vendor/VendorDetails.js @@ -117,6 +117,8 @@ const VendorDetails = (props) => { return setShowModal(true); case "EDIT": return history.push("/digit-ui/employee/fsm/registry/modify-vendor/" + dsoId); + case "HOME": + return history.push("/digit-ui/employee/fsm/registry?selectedTabs=VENDOR"); default: break; } @@ -388,7 +390,9 @@ const VendorDetails = (props) => { /> )} - {displayMenu ? : null} + {displayMenu ? ( + + ) : null} setDisplayMenu(!displayMenu)} /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/index.js index a039fc0e046..ebdd412f4bb 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FSMRegistry/index.js @@ -1,6 +1,8 @@ import React, { useState, useCallback, useEffect } from "react"; import { useTranslation } from "react-i18next"; -import { Header } from "@egovernments/digit-ui-react-components"; +import { Header, InfoIcon } from "@egovernments/digit-ui-react-components"; +import { useParams, useHistory, useLocation } from "react-router-dom"; + import RegisryInbox from "../../../components/RegistryInbox"; const FSMRegistry = () => { @@ -14,12 +16,17 @@ const FSMRegistry = () => { const [vehicleIds, setVehicleIds] = useState(""); const [driverIds, setDriverIds] = useState(""); const [tableData, setTableData] = useState([]); + const history = useHistory(); + const location = useLocation(); + const queryParams = new URLSearchParams(location.search); + const selectedTabs = queryParams.get("selectedTabs"); + const [loaded, setLoaded] = useState(false); const userInfo = Digit.UserService.getUser(); let paginationParms = { limit: pageSize, offset: pageOffset, sortBy: sortParams?.[0]?.id, sortOrder: sortParams?.[0]?.desc ? "DESC" : "ASC" }; const { data: dsoData, isLoading: isLoading, isSuccess: isDsoSuccess, error: dsoError, refetch } = - tab === "VEHICLE" + selectedTabs === "VEHICLE" ? Digit.Hooks.fsm.useVehiclesSearch({ tenantId, filters: { @@ -29,7 +36,7 @@ const FSMRegistry = () => { }, config: { enabled: false }, }) - : tab === "DRIVER" + : selectedTabs === "DRIVER" ? Digit.Hooks.fsm.useDriverSearch({ tenantId, filters: { @@ -60,31 +67,35 @@ const FSMRegistry = () => { { vehicleIds: vehicleIds, driverIds: driverIds, - status: "ACTIVE", + // status: "ACTIVE", }, { enabled: false } ); - const inboxTotalCount = dsoData?.totalCount || 50; useEffect(() => { refetch(); }, []); + useEffect(() => { + setPageOffset(0); + refetch(); + }, [searchParams]); + useEffect(() => { refetch(); }, [searchParams, sortParams, pageOffset, pageSize]); useEffect(() => { - if (dsoData?.vehicle && tab === "VEHICLE") { + if (dsoData?.vehicle && selectedTabs === "VEHICLE") { let vehicleIds = ""; dsoData.vehicle.map((data) => { vehicleIds += `${data.id},`; }); setVehicleIds(vehicleIds); - setTableData(dsoData.vehicle); + setTableData(dsoData?.vehicle); } - if (dsoData?.driver && tab === "DRIVER") { + if (dsoData?.driver && selectedTabs === "DRIVER") { let driverIds = ""; dsoData.driver.map((data) => { driverIds += `${data.id},`; @@ -92,7 +103,7 @@ const FSMRegistry = () => { setDriverIds(driverIds); setTableData(dsoData?.driver); } - if (dsoData?.vendor && tab === "VENDOR") { + if (dsoData?.vendor && selectedTabs === "VENDOR") { const tableData = dsoData.vendor.map((dso) => ({ mobileNumber: dso.owner?.mobileNumber, name: dso.name, @@ -124,7 +135,7 @@ const FSMRegistry = () => { useEffect(() => { if (vendorData) { - if (tab === "VEHICLE") { + if (selectedTabs === "VEHICLE") { const vehicles = dsoData?.vehicle.map((data) => { let vendor = vendorData.find((ele) => ele.dsoDetails?.vehicles?.find((vehicle) => vehicle.id === data.id)); if (vendor) { @@ -135,7 +146,7 @@ const FSMRegistry = () => { setTableData(vehicles); setVehicleIds(""); } - if (tab === "DRIVER") { + if (selectedTabs === "DRIVER") { const drivers = dsoData?.driver.map((data) => { let vendor = vendorData.find((ele) => ele.dsoDetails?.drivers?.find((driver) => driver.id === data.id)); if (vendor) { @@ -167,17 +178,23 @@ const FSMRegistry = () => { const handleFilterChange = () => {}; - const searchFields = - tab === "VEHICLE" + let searchFields = + selectedTabs === "VEHICLE" ? [ { label: t("ES_FSM_REGISTRY_SEARCH_VEHICLE_NUMBER"), name: "registrationNumber", - pattern: `[A-Z]{2}\\s{1}[0-9]{2}\\s{0,1}[A-Z]{1,2}\\s{1}[0-9]{4}`, - title: t("ES_FSM_VEHICLE_FORMAT_TIP"), + labelChildren: ( +
+ + + {t("ES_FSM_VEHICLE_FORMAT_TIP")} + +
+ ), }, ] - : tab === "DRIVER" + : selectedTabs === "DRIVER" ? [ { label: t("ES_FSM_REGISTRY_SEARCH_DRIVER_NAME"), @@ -190,7 +207,6 @@ const FSMRegistry = () => { name: "name", }, ]; - const handleSort = useCallback((args) => { if (args?.length === 0) return; setSortParams(args); @@ -198,6 +214,9 @@ const FSMRegistry = () => { const onTabChange = (tab) => { setTab(tab); + if (selectedTabs !== tab) { + history.push(`/digit-ui/employee/fsm/registry?selectedTabs=${tab}`); + } }; const refetchData = () => { @@ -233,7 +252,7 @@ const FSMRegistry = () => { onPageSizeChange={handlePageSizeChange} totalRecords={inboxTotalCount || 0} onTabChange={onTabChange} - selectedTab={tab} + selectedTab={selectedTabs} refetchData={refetchData} refetchVendor={refetchVendorData} /> diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpAddVehicle.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpAddVehicle.js index 5d8c912dbc9..2071e6100f1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpAddVehicle.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpAddVehicle.js @@ -1,5 +1,5 @@ import React, { useEffect, useState } from "react"; -import { FormStep, TextInput, LabelFieldPair, CardLabel, Header } from "@egovernments/digit-ui-react-components"; +import { FormStep, TextInput, LabelFieldPair, CardLabel, Header, InfoIcon } from "@egovernments/digit-ui-react-components"; import { useForm, Controller } from "react-hook-form"; import _ from "lodash"; import { useTranslation } from "react-i18next"; @@ -23,7 +23,7 @@ const FstpAddVehicle = ({ onSelect }) => { name: "vehicleNumber", validation: { // "pattern": "[a-zA-Z0-9 ]{1,20}", - pattern: `[A-Z]{2}\\s{1}[0-9]{2}\\s{0,1}[A-Z]{1,2}\\s{1}[0-9]{4}`, + pattern: `[A-Z]{2}[0-9]{2}[A-Z]{0,2}[0-9]{4}`, title: t("ES_FSM_VEHICLE_FORMAT_TIP"), }, }, @@ -36,7 +36,7 @@ const FstpAddVehicle = ({ onSelect }) => { }; function onChange(e) { - e.target.value.trim().length != 0 ? setVehicleNumber(e.target.value) : null; + return e.target.value.trim().length != 0 ? setVehicleNumber(e.target.value) : null; } const isMobile = window.Digit.Utils.browser.isMobile(); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperatorDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperatorDetails.js index f3b191b791a..3dc2713855b 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperatorDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperatorDetails.js @@ -1,7 +1,7 @@ import React, { Fragment, useState, useEffect, useRef } from "react"; import { useParams, useHistory, useLocation } from "react-router-dom"; import TimePicker from "react-time-picker"; -import { Dropdown, Header, MultiUploadWrapper, TextArea } from "@egovernments/digit-ui-react-components"; +import { Dropdown, Header, MultiUploadWrapper, RadioButtons, TextArea } from "@egovernments/digit-ui-react-components"; import { Card, CardLabel, @@ -41,8 +41,49 @@ const FstpOperatorDetails = () => { const history = useHistory(); const queryClient = useQueryClient(); const tenantId = Digit.ULBService.getCurrentTenantId(); + const allCities = Digit.Hooks.fsm.useTenants(); const state = Digit.ULBService.getStateId(); let { id: applicationNos } = useParams(); + const isNew = history.location.pathname.includes("new") ? true : false; + const { data: urcConfig } = Digit.Hooks.fsm.useMDMS(tenantId, "FSM", "UrcConfig"); + const isUrcEnable = urcConfig && urcConfig.length > 0 && urcConfig[0].URCEnable; + const [selectedCity, setSelectedCity] = useState(() => allCities.filter((city) => city?.code === tenantId)[0] || null); + let inputs = [ + { + active: true, + code: "WITHIN_ULB_LIMITS", + i18nKey: "WITHIN_ULB_LIMITS", + name: "Witnin ULB Limits", + }, + { + active: true, + code: "FROM_GRAM_PANCHAYAT", + i18nKey: "FROM_GRAM_PANCHAYAT", + name: "From Gram Panchayat", + }, + { + active: true, + code: "FROM_OTHER_ULB", + i18nKey: "FROM_OTHER_ULB", + name: "From Other/Outside ULBs", + }, + ]; + const { data: fetchedLocalities } = Digit.Hooks.useBoundaryLocalities( + selectedCity?.code, + "revenue", + { + enabled: !!selectedCity, + }, + t + ); + var { data: fetchedGramPanchayats } = Digit.Hooks.useBoundaryLocalities( + selectedCity?.code, + "gramPanchayats", + { + enabled: !!selectedCity, + }, + t + ); const [filters, setFilters] = useState(applicationNos != undefined ? { applicationNos } : { applicationNos: "null" }); const [isVehicleSearchCompleted, setIsVehicleSearchCompleted] = useState(false); const [searchParams, setSearchParams] = useState({}); @@ -76,6 +117,15 @@ const FstpOperatorDetails = () => { const [newDsoName, setNewDsoName] = useState(null); const [comments, setComments] = useState(); const location = useLocation(); + const [selectLocation, setSelectLocation] = useState(isNew ? inputs[0] : null); + const [gramPanchayats, setGramPanchayats] = useState(); + const [selectedGp, setSelectedGp] = useState(); + const [villages, setVillages] = useState([]); + const [selectedVillage, setSelectedVillage] = useState(); + const [newGramPanchayat, setNewGramPanchayat] = useState(null); + const [newVillage, setNewVillage] = useState(); + const [selectedLocality, setSelectedLocality] = useState(); + const [localities, setLocalities] = useState(); const onChangeVehicleNumber = (value) => { setNewVehicleNumber(value); @@ -102,7 +152,16 @@ const FstpOperatorDetails = () => { enabled: !!isVehicleSearchCompleted, } ); - + useEffect(() => { + if (fetchedLocalities && fetchedLocalities.length > 0) { + setLocalities(fetchedLocalities); + } + }, [fetchedLocalities]); + useEffect(() => { + if (fetchedGramPanchayats && fetchedGramPanchayats.length > 0) { + setGramPanchayats(fetchedGramPanchayats); + } + }, [fetchedGramPanchayats]); useEffect(() => { filterVehicle?.length == 0 ? setCurrentTrip(1) : setCurrentTrip(tripNo - filterVehicle?.length + 1); }, [tripNo, filterVehicle, totalvehicle, totalsuccess, isSuccess]); @@ -151,7 +210,6 @@ const FstpOperatorDetails = () => { history.location.pathname.includes("new") ? handleCreate() : handleSubmit(); default: setSelectedAction(); - console.debug("default case"); break; } }, [selectedAction]); @@ -218,7 +276,9 @@ const FstpOperatorDetails = () => { }; const handleCreate = () => { - const re = new RegExp("^[A-Z]{2}\\s{1}[0-9]{2}\\s{0,1}[A-Z]{1,2}\\s{1}[0-9]{4}$"); + const re = new RegExp("[A-Z]{2}\\s{0,1}[0-9]{2}\\s{0,1}[A-Z]{0,2}\\s{0,1}[0-9]{4}"); + const dsoName = new RegExp(/^[A-Za-z0-9 ]*$/); + const locality = new RegExp(/^[A-Za-z0-9 ]*$/); if (!re.test(newVehicleNumber)) { setShowToast({ key: "error", action: `ES_FSM_VEHICLE_FORMAT_TIP` }); setTimeout(() => { @@ -226,20 +286,35 @@ const FstpOperatorDetails = () => { }, 5000); return; } - if (newDsoName === null || newDsoName?.trim()?.length === 0) { + if (newDsoName === null || newDsoName?.trim()?.length === 0 || !dsoName.test(newDsoName)) { setShowToast({ key: "error", action: `ES_FSTP_INVALID_DSO_NAME` }); setTimeout(() => { closeToast(); }, 2000); return; } - if (newLocality === null || newLocality?.trim()?.length === 0) { + if ( + selectLocation?.code !== "FROM_GRAM_PANCHAYAT" && + (selectedLocality === undefined || selectedLocality?.name === "Other") && + (newLocality === null || newLocality?.trim()?.length === 0 || !locality.test(newLocality)) + ) { setShowToast({ key: "error", action: `ES_FSTP_INVALID_LOCALITY` }); setTimeout(() => { closeToast(); }, 2000); return; } + if ( + selectLocation?.code === "FROM_GRAM_PANCHAYAT" && + (selectedGp === undefined || selectedGp?.name === "Other") && + (newGramPanchayat === null || newGramPanchayat?.trim()?.length === 0) + ) { + setShowToast({ key: "error", action: `ES_FSTP_SELECT_GRAMPANCHAYAT` }); + setTimeout(() => { + closeToast(); + }, 2000); + return; + } if (tripStartTime === null) { setErrors({ tripStartTime: "ES_FSTP_INVALID_START_TIME" }); tripStartTimeRef.current.scrollIntoView({ behavior: "smooth", block: "center" }); @@ -285,6 +360,13 @@ const FstpOperatorDetails = () => { vehiclecapacity : vehicleCapacity, fileStoreId: uploadedFile, comments: comments, + gramPanchayat: selectedGp, + village: selectedVillage, + newGramPanchayat: newGramPanchayat, + newVillage: newVillage, + boundaryType: selectLocation?.code === "FROM_GRAM_PANCHAYAT" ? "GP" : "Locality", + propertyLocation: selectLocation?.code, + newLocality: newLocality, }; temp.businessService = "FSM_VEHICLE_TRIP"; temp.tripDetails = [ @@ -335,7 +417,7 @@ const FstpOperatorDetails = () => { setShowToast({ key: "success", action: `ES_FSM_DISPOSE_UPDATE_SUCCESS` }); setTimeout(() => { closeToast(); - history.push(`/digit-ui/employee/fsm/fstp-operations`); + history.push(`/digit-ui/employee`); }, 5000); }; @@ -382,16 +464,6 @@ const FstpOperatorDetails = () => { /> ), }, - { - title: `${t("ES_INBOX_LOCALITY")} *`, - value: (tripDetails && tripDetails[0]?.address?.locality?.name) || ( - onChangeLocality(e.target.value)} - value={newLocality} - /> - ), - }, ]; const handleTimeChange = (value, cb) => { @@ -424,6 +496,44 @@ const FstpOperatorDetails = () => { selectfile(newArr[newArr.length - 1]); }; + function selectedValue(value) { + setSelectLocation(value); + } + + function selectGramPanchayat(value) { + setSelectedGp(value); + if (value.name !== "Other") { + const filteredVillages = gramPanchayats.filter((items) => items.code === value.code)[0]?.children; + var localitiesWithLocalizationKeys = filteredVillages.map((obj) => ({ + ...obj, + i18nkey: tenantId.replace(".", "_").toUpperCase() + "_" + obj.code, + })); + if (localitiesWithLocalizationKeys.length > 0) { + localitiesWithLocalizationKeys.push({ + code: "OTHER", + name: "Other", + i18nkey: tenantId.replace(".", "_").toUpperCase() + "_OTHER", + }); + setVillages(localitiesWithLocalizationKeys); + } + } + } + + function selectVillage(value) { + setSelectedVillage(value); + } + + const onChangeGramPanchayat = (value) => { + setNewGramPanchayat(value); + }; + + const onChangeVillage = (value) => { + setNewVillage(value); + }; + function selectLocality(locality) { + setSelectedLocality(locality); + } + return (
{t("ES_INBOX_VEHICLE_LOG")}
@@ -442,6 +552,227 @@ const FstpOperatorDetails = () => { labelStyle={{ fontWeight: "normal" }} /> ))} + {isNew && isUrcEnable && ( +
+ {`${t("CS_PROPERTY_LOCATION")} *`} +
+ +
+
+ )} + {(selectLocation?.code === "FROM_GRAM_PANCHAYAT" || + (tripDetails && tripDetails.length > 0 && tripDetails[0]?.address?.additionalDetails?.boundaryType === "Village") || + (tripDetails && tripDetails.length > 0 && tripDetails[0]?.address?.additionalDetails?.boundaryType === "GP")) && ( +
+ 0 ? ( + tripDetails[0]?.address?.additionalDetails?.gramPanchayat?.name + ) : ( + + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + {selectedGp?.name === "Other" && ( +
+ 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + onChangeGramPanchayat(e.target.value)} value={newGramPanchayat} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + onChangeVillage(e.target.value)} value={newVillage} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> +
+ )} + {selectedGp?.name !== "Other" && ( + 0 ? ( + tripDetails[0]?.address?.additionalDetails?.village?.name ? ( + tripDetails[0]?.address?.additionalDetails?.village?.name + ) : ( + "N/A" + ) + ) : villages.length > 0 ? ( + + ) : ( + onChangeVillage(e.target.value)} value={newVillage} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + )} + {selectedVillage?.code === "OTHER" && ( + 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + onChangeVillage(e.target.value)} value={newVillage} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + )} +
+ )} + {(selectLocation?.code === "WITHIN_ULB_LIMITS" || + (tripDetails && tripDetails.length > 0 && tripDetails[0]?.address?.additionalDetails?.boundaryType === "Locality")) && ( +
+ 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + a.name.localeCompare(b.name))} + select={selectLocality} + optionKey="i18nkey" + style={{ width: "100%" }} + t={t} + /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + {selectedLocality?.name === "Other" && ( + 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + onChangeLocality(e.target.value)} value={newLocality} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> + )} +
+ )} + {selectLocation?.code === "FROM_OTHER_ULB" && ( +
+ 0 ? ( + tripDetails[0]?.address?.locality?.name + ) : ( + onChangeLocality(e.target.value)} value={newLocality} /> + ) + } + last={false} + labelStyle={{ fontWeight: "normal" }} + /> +
+ )}
{t(errors.tripStartTime)}
@@ -525,7 +856,7 @@ const FstpOperatorDetails = () => { className="form-field" onChange={(e) => { if (e.target.value.length > 1024) { - null; + return null; } else { setComments(e.target.value); } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpServiceRequest.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpServiceRequest.js index 5d81ca6cbc4..6312b294caa 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpServiceRequest.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpServiceRequest.js @@ -142,7 +142,10 @@ const FstpServiceRequest = () => { let citizenInfo = []; tripDetail?.map((vehicle) => { - citizenInfo.push(vehicleLog?.find((i) => i?.tripDetails[0]?.referenceNo === vehicle?.applicationNo)); + const info = vehicleLog?.find((i) => i?.tripDetails[0]?.referenceNo === vehicle?.applicationNo); + if (info !== undefined) { + citizenInfo.push(info); + } }); if (isMobile) { diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js index 5558e734ba5..19eacec3f39 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js @@ -47,7 +47,9 @@ export const NewApplication = ({ parentUrl, heading }) => { formData?. propertyID && formData?.propertyType && formData?.subtype && - formData?.address?.locality?.code && + ((formData?.address?.locality?.name === "Other" ? formData?.address?.newLocality : formData?.address?.locality?.code) || + (formData?.address?.propertyLocation?.code === "FROM_GRAM_PANCHAYAT" && + (formData?.address?.gramPanchayat?.name === "Other" ? formData?.address?.newGp : formData?.address?.gramPanchayat?.code))) && formData?.tripData?.vehicleType && formData?.channel && formData?.pitType && @@ -79,12 +81,6 @@ export const NewApplication = ({ parentUrl, heading }) => { } }; - // useEffect(() => { - // (async () => { - - // })(); - // }, [propertyType, subType, vehicle]); - const onSubmit = (data) => { const applicationChannel = data.channel; const sanitationtype = data?.pitType?.code; @@ -106,9 +102,17 @@ export const NewApplication = ({ parentUrl, heading }) => { const localityName = data?.address?.locality?.name; const gender = data.applicationData.applicantGender; const paymentPreference = amount === 0 ? null : data?.paymentPreference ? data?.paymentPreference : null; - const advanceAmount = amount === 0 ? null : data?.advancepaymentPreference?.advanceAmount; + const advanceAmount = + amount === 0 ? null : data?.advancepaymentPreference?.advanceAmount === null ? 0 : data?.advancepaymentPreference?.advanceAmount; const distancefromroad=data?.tripData?.distancefromroad; const roadWidth= data?.tripData?.roadWidth; + const gramPanchayat = data?.address.gramPanchayat; + const village = data?.address.village; + const propertyLocation = data?.address?.propertyLocation?.code; + const newLocality = data?.address?.newLocality; + const newGp = data?.address?.newGp; + const newVillage = data?.address?.newVillage; + const formData = { fsm: { citizen: { @@ -120,7 +124,7 @@ export const NewApplication = ({ parentUrl, heading }) => { sanitationtype: sanitationtype, source: applicationChannel.code, additionalDetails: { - tripAmount: amount, + tripAmount: typeof amount === "number" ? JSON.stringify(amount) : amount, distancefromroad:distancefromroad, roadWidth:roadWidth, propertyID : propertyID, @@ -141,17 +145,32 @@ export const NewApplication = ({ parentUrl, heading }) => { pincode, slumName: slum, locality: { - code: localityCode, - name: localityName, + code: propertyLocation === "FROM_GRAM_PANCHAYAT" ? gramPanchayat?.code : localityCode, + name: propertyLocation === "FROM_GRAM_PANCHAYAT" ? gramPanchayat?.name : localityName, }, geoLocation: { latitude: data?.address?.latitude, longitude: data?.address?.longitude, }, + additionalDetails: { + boundaryType: propertyLocation === "FROM_GRAM_PANCHAYAT" ? "GP" : "Locality", + gramPanchayat: { + code: gramPanchayat?.code, + name: gramPanchayat?.name, + }, + village: village?.code + ? { + code: village?.code ? village?.code : "", + name: village?.name ? village?.name : "", + } + : newVillage, + newLocality: newLocality, + newGramPanchayat: newGp, + }, }, noOfTrips, paymentPreference, - advanceAmount, + advanceAmount: typeof advanceAmount === "number" ? JSON.stringify(advanceAmount) : advanceAmount, }, workflow: null, }; @@ -169,6 +188,7 @@ export const NewApplication = ({ parentUrl, heading }) => { } const configs = [...preFields, ...commonFields]; + return (
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/DriverConfig.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/DriverConfig.js index 63c5bbddb0e..dd3264fbfb6 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/DriverConfig.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/DriverConfig.js @@ -97,7 +97,7 @@ const DriverConfig = (t, disabled = false) => { className: "payment-form-text-input-correction", }, }, - { + /* { label: "ES_FSM_REGISTRY_DRIVER_PHONE", isMandatory: true, type: "mobileNumber", @@ -114,7 +114,7 @@ const DriverConfig = (t, disabled = false) => { className: "payment-form-text-input-correction", labelStyle: { border: "1px solid black", borderRight: "none" }, }, - }, + }, */ ], }, ]; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/VehicleConfig.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/VehicleConfig.js index 4698b54412d..4973ecb54fa 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/VehicleConfig.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/configs/VehicleConfig.js @@ -1,5 +1,6 @@ import React from "react"; const { DatePicker, Dropdown } = require("@egovernments/digit-ui-react-components"); +import { convertEpochToDate } from "../../../utils"; const VehicleConfig = (t, disabled = false) => { return [ @@ -15,7 +16,7 @@ const VehicleConfig = (t, disabled = false) => { name: "registrationNumber", ValidationRequired: true, validation: { - pattern: `[A-Z]{2}\\s{1}[0-9]{2}\\s{0,1}[A-Z]{1,2}\\s{1}[0-9]{4}`, + pattern: `[A-Z]{2}[0-9]{2}[A-Z]{0,2}[0-9]{4}`, title: t("ES_FSM_VEHICLE_FORMAT_TIP"), }, error: t("FSM_REGISTRY_INVALID_REGISTRATION_NUMBER"), @@ -117,6 +118,52 @@ const VehicleConfig = (t, disabled = false) => { labelStyle: { border: "1px solid black", borderRight: "none" }, }, }, + { + label: "ES_FSM_REGISTRY_NEW_GENDER", + isMandatory: true, + type: "component", + route: "select-gender", + hideInEmployee: false, + key: "selectGender", + component: "SelectGender", + // disable: disabled, + }, + { + label: t("ES_FSM_REGISTRY_NEW_DOB"), + isMandatory: false, + type: "custom", + key: "dob", + populators: { + name: "dob", + validation: { + required: true, + }, + component: (props, customProps) => ( + + ), + }, + }, + { + label: "ES_FSM_REGISTRY_NEW_EMAIL", + isMandatory: false, + type: "text", + key: "emailId", + populators: { + name: "emailId", + validation: { + required: false, + pattern: /^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9.-]+\.[a-zA-Z0-9.-]+$/, + }, + error: t("FSM_REGISTRY_INVALID_EMAIL"), + defaultValue: "", + className: "payment-form-text-input-correction", + }, + }, { label: "ES_FSM_REGISTRY_NEW_VENDOR_ADDITIONAL_DETAILS", isMandatory: false, diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/README.md deleted file mode 100644 index 30648df8c6e..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-hrms - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-hrms -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-hrms":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { inithrmsComponents } from "@egovernments/digit-ui-module-hrms"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["hrms"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - inithrmsComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/package.json index 5c13e09d03b..2cafd580586 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/hrms/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-hrms", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-hrms", + "version": "1.7.3", "description": "Digit HRMS Module", "license": "MIT", "main": "dist/index.js", @@ -15,7 +15,7 @@ "prepublish": "yarn build" }, "dependencies": { - "@egovernments/digit-ui-react-components": "1.7.2", + "@egovernments/digit-ui-react-components": "^1.7.0-beta.2", "react": "17.0.2", "react-dom": "17.0.2", "react-hook-form": "6.15.8", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/README.md deleted file mode 100644 index 7738203ecef..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-mcollect - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-mcollect -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-mcollect":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initmcollectComponents } from "@egovernments/digit-ui-module-mcollect"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["mcollect"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initmcollectComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/package.json index a1ffdcbab31..fa2e25ca38d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/mCollect/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-mcollect", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-mcollect", + "version": "1.7.3", "license": "MIT", "description": "Digit Misc Collections Module", "main": "dist/index.js", @@ -19,7 +19,7 @@ "react-router-dom": "5.3.0" }, "dependencies": { - "@egovernments/digit-ui-react-components": "1.7.2", + "@egovernments/digit-ui-react-components": "^1.7.0-beta.2", "lodash.merge": "^4.6.2", "react": "17.0.2", "react-dom": "17.0.2", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/README.md deleted file mode 100644 index ccc1c414b68..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-noc - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-noc -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-noc":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initnocComponents } from "@egovernments/digit-ui-module-noc"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["noc"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initnocComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/package.json index 5d7cd1685b7..7205460227b 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/noc/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-noc", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-noc", + "version": "1.7.3", "description": "", "main": "dist/index.js", "module": "dist/index.modern.js", @@ -18,7 +18,7 @@ "react-router-dom": "5.3.0" }, "dependencies": { - "@egovernments/digit-ui-react-components": "1.7.2", + "@egovernments/digit-ui-react-components": "^1.7.0-beta.2", "react": "17.0.2", "react-dom": "17.0.2", "react-hook-form": "6.15.8", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/README.md index 5b9102b929d..e69de29bb2d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/README.md +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/README.md @@ -1,77 +0,0 @@ - -# digit-ui-module-pgr - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-pgr -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-pgr":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initpgrComponents } from "@egovernments/digit-ui-module-pgr"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["pgr"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initpgrComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/package.json index c6968bd9f9a..4c5d5c50ce4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-pgr", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-pgr", + "version": "1.7.5", "license": "MIT", "main": "dist/index.js", "module": "dist/index.modern.js", @@ -17,7 +17,7 @@ "react": "17.0.2", "react-router-dom": "5.3.0" }, - "dependencies": { + "dependencies": { "@egovernments/digit-ui-react-components": "1.7.2", "lodash.merge": "^4.6.2", "react": "17.0.2", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/Steps/SelectComplaintType.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/Steps/SelectComplaintType.js index 4aec06aa6cf..bb658054523 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/Steps/SelectComplaintType.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/Steps/SelectComplaintType.js @@ -14,84 +14,31 @@ const SelectComplaintType = ({ t, config, onSelect, value }) => { const { complaintType } = value; return complaintType ? complaintType : {}; }); - const [subType, setSubType] = useState(() => { - const { subType } = value; - return subType ? subType : {}; - }); + const goNext = () => { - console.log("complaintType",complaintType) - sessionStorage.setItem("complaintType",JSON.stringify(complaintType)) - onSelect({ subType }); + onSelect({ complaintType }); }; const textParams = config.texts; - const valuenew= { - key :"PropertyTax", - name :"Property Tax"} const menu = Digit.Hooks.pgr.useComplaintTypes({ stateCode: Digit.ULBService.getCurrentTenantId() }); - const cities = Digit.Hooks.pgr.useTenants(); - const [subTypeMenu, setSubTypeMenu] = useState([]); - const pttype=sessionStorage.getItem("type") - useEffect(()=>{ - (async()=>{ - if (pttype=="PT") { - setComplaintType(valuenew); - setSubTypeMenu(await serviceDefinitions.getSubMenu("pg.citya", valuenew, t)); - } - })(); - },[]) - - function selectedSubType(value) { - - console.log("selectedSubType",value) - setSubType(value); - } - const config1 = [ - { - head: t("CS_COMPLAINT_DETAILS_COMPLAINT_DETAILS"), - body: [ - { - label: t("CS_COMPLAINT_DETAILS_COMPLAINT_TYPE"), - isMandatory: true, - type: "dropdown", - populators: , - }, - { - label: t("CS_COMPLAINT_DETAILS_COMPLAINT_SUBTYPE"), - isMandatory: true, - type: "dropdown", - menu: { ...subTypeMenu }, - populators: , - }, - - ], - - }, - ]; - const tenantId = window.Digit.SessionStorage.get("Digit.Citizen.tenantId"); - async function selectedValue(value) { - if (value.key !== complaintType.key) { - if (value.key === "Others") { - setSubType({ name: "" }); - setSubTypeMenu([{ key: "Others", name: t("SERVICEDEFS.OTHERS") }]); - } else { - setSubType({ name: "" }); - setComplaintType(value); - setSubTypeMenu(await serviceDefinitions.getSubMenu("pg.citya", value, t)); - } - } - } + function selectedValue(value) { + setComplaintType(value); + // SessionStorage.set("complaintType", value); + } return ( - + ); }; -export default SelectComplaintType; \ No newline at end of file +export default SelectComplaintType; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/index.js index 602e80088d6..0e711f4ac22 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pgr/src/pages/citizen/Create/index.js @@ -22,7 +22,9 @@ export const CreateComplaint = () => { const { stateInfo } = storeData || {}; const [params, setParams, clearParams] = Digit.Hooks.useSessionStorage(PGR_CITIZEN_CREATE_COMPLAINT, {}); // const [customConfig, setConfig] = Digit.Hooks.useSessionStorage(PGR_CITIZEN_COMPLAINT_CONFIG, {}); - const config = useMemo(() => merge(defaultConfig, Digit.Customizations.PGR.complaintConfig), [Digit.Customizations.PGR.complaintConfig]); + const config = useMemo(() => defaultConfig); + console.log(defaultConfig,"defaultConfig") + const [paramState, setParamState] = useState(params); const [nextStep, setNextStep] = useState(""); const [canSubmit, setCanSubmit] = useState(false); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/package.json index c84ea784866..92823ede823 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/package.json @@ -1,6 +1,6 @@ { "name": "@upyog/digit-ui-module-pt", - "version": "1.7.2", + "version": "1.7.4", "license": "MIT", "main": "dist/index.js", "module": "dist/index.modern.js", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/PropertyType.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/PropertyType.js index 7379f8bb09b..0fcf616d2d4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/PropertyType.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/PropertyType.js @@ -31,7 +31,7 @@ const PropertyType = ({ t, config, onSelect, userType, formData, setError, clear } else { if (Array.isArray(proptype) && proptype.length > 0) { for (i = 0; i < proptype.length; i++) { - if (i != 1 && i != 4 && Array.isArray(proptype) && proptype.length > 0) + if ( Array.isArray(proptype) && proptype.length > 0) menu.push({ i18nKey: "COMMON_PROPTYPE_" + stringReplaceAll(proptype[i].code, ".", "_"), code: proptype[i].code }); } } diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/SelectPTUnits.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/SelectPTUnits.js index 6a723cfa84c..1a4e1f7b403 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/SelectPTUnits.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/pt/src/pageComponents/SelectPTUnits.js @@ -65,7 +65,7 @@ const SelectPTUnits = React.memo(({ t, config, onSelect, userType, formData }) = } }; - const { data: mdmsData, isLoading } = Digit.Hooks.useCommonMDMSV2( + const { data: mdmsData, isLoading } = Digit.Hooks.useCommonMDMS( Digit.ULBService.getStateId(), "PropertyTax", ["Floor", "OccupancyType", "UsageCategory"], diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/README.md deleted file mode 100644 index dc82248d6e9..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-receipts - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-receipts -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-receipts":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initreceiptsComponents } from "@egovernments/digit-ui-module-receipts"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["receipts"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initreceiptsComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/package.json index ec7a7c2436a..f66cfbec2c4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/receipts/package.json @@ -1,6 +1,6 @@ { - "name": "@egovernments/digit-ui-module-receipts", - "version": "1.7.2", + "name": "@upyog/digit-ui-module-receipts", + "version": "1.7.3", "description": "RECEIPTS", "license": "MIT", "main": "dist/index.js", @@ -15,7 +15,7 @@ "prepublish": "yarn build" }, "dependencies": { - "@egovernments/digit-ui-react-components": "1.7.2", + "@egovernments/digit-ui-react-components": "^1.7.0-beta.2", "react": "17.0.2", "react-dom": "17.0.2", "react-hook-form": "6.15.8", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/Modal/PTActionModal.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/Modal/PTActionModal.js index 7e37de54da8..3c3b80b7639 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/Modal/PTActionModal.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/Modal/PTActionModal.js @@ -32,7 +32,7 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, }, { enabled: !action?.isTerminateState } ); - const { isLoading: financialYearsLoading, data: financialYearsData } = Digit.Hooks.pt.useMDMS( + const { isLoading: financialYearsLoading, data: financialYearsData } = Digit.Hooks.pt.useMDMSV2( tenantId, businessService, "FINANCIAL_YEARLS", @@ -200,4 +200,4 @@ const ActionModal = ({ t, action, tenantId, state, id, closeModal, submitAction, ); }; -export default ActionModal; \ No newline at end of file +export default ActionModal; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js index bc6c333d205..6c03503d4a6 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/components/ApplicationDetailsContent.js @@ -135,7 +135,7 @@ function ApplicationDetailsContent({ return ; } else { const caption = { - date: convertEpochToDateDMY(applicationData?.auditDetails?.lastModifiedTime), + date: checkpoint?.auditDetails?.lastModified, // name: checkpoint?.assigner?.name, name: checkpoint?.assignes?.[0]?.name, // mobileNumber: checkpoint?.assigner?.mobileNumber, @@ -215,7 +215,6 @@ function ApplicationDetailsContent({ return "" } } - console.log("applicationDetails?.applicationDetails",applicationDetails?.applicationDetails) return ( {/* For UM-4418 changes */} @@ -464,4 +463,4 @@ function ApplicationDetailsContent({ ); } -export default ApplicationDetailsContent; \ No newline at end of file +export default ApplicationDetailsContent; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/config/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/config/index.js index f2a40492579..a75df054fe6 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/config/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/templates/ApplicationDetails/config/index.js @@ -26,4 +26,4 @@ export { configNOCApproverApplication, configWSApproverApplication, configWSDisConnectApplication -}; \ No newline at end of file +}; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/README.md b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/README.md deleted file mode 100644 index 38c0c0e85ad..00000000000 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/README.md +++ /dev/null @@ -1,77 +0,0 @@ - -# digit-ui-module-ws - -## Install - -```bash -npm install --save @egovernments/digit-ui-module-ws -``` - -## Limitation - -```bash -This Package is more specific to DIGIT-UI's can be used across mission's -``` - -## Usage - -After adding the dependency make sure you have this dependency in - -```bash -frontend/micro-ui/web/package.json -``` - -```json -"@egovernments/digit-ui-module-ws":"^1.5.0", -``` - -then navigate to App.js - -```bash - frontend/micro-ui/web/src/App.js -``` - - -```jsx -/** add this import **/ - -import { initwsComponents } from "@egovernments/digit-ui-module-ws"; - -/** inside enabledModules add this new module key **/ - -const enabledModules = ["ws"]; - -/** inside init Function call this function **/ - -const initDigitUI = () => { - initwsComponents(); -}; -``` - - - - -### Changelog - -```bash -1.7.1 UPYOG Base version -``` - -### Contributors - -[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] - -## Documentation - -Documentation Site (https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) - -## Maintainer - -- [jagankumar-egov](https://www.github.com/jagankumar-egov) - - -### Published from DIGIT Frontend -DIGIT Frontend Repo (https://github.com/upyog/UPYOG/tree/develop) - - -![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/package.json index 85f7145ab4d..9c2c844eba1 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/package.json @@ -1,6 +1,6 @@ { "name": "@upyog/digit-ui-module-ws", - "version": "1.7.2", + "version": "1.7.3", "description": "", "main": "dist/index.js", "module": "dist/index.modern.js", @@ -19,6 +19,7 @@ }, "dependencies": { "@egovernments/digit-ui-react-components": "1.7.2", + "microbundle-crl": "0.13.11", "react": "17.0.2", "react-dom": "17.0.2", "react-hook-form": "6.15.8", diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSActivationPageDetails.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSActivationPageDetails.js index bdfa33b75f9..991f1db83fe 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSActivationPageDetails.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSActivationPageDetails.js @@ -135,7 +135,6 @@ const ConnectionDetails = (_props) => { }, [errors]); const errorStyle = { width: "70%", marginLeft: "30%", fontSize: "12px", marginTop: "-21px" }; -console.log("ffffffffffffffffffff",formData2) return (
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSDisconnectionForm.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSDisconnectionForm.js index 94d0cb5d05b..3e6b127ac93 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSDisconnectionForm.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pageComponents/WSDisconnectionForm.js @@ -334,7 +334,6 @@ console.log("disconnectionData",disconnectionData)
); } -console.log("disconnectionData.type?.value?.code",disconnectionData.type?.value?.code) return (
{t("WS_WATER_AND_SEWERAGE_DISCONNECTION")}
diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pages/employee/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pages/employee/index.js index 4123d561f08..411638b336e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pages/employee/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/ws/src/pages/employee/index.js @@ -228,7 +228,6 @@ const BILLSBreadCrumbs = ({ location }) => { return
; }; const App = ({ path }) => { - console.log("ffffff",path) const location = useLocation(); const WSDocsRequired = Digit?.ComponentRegistryService?.getComponent("WSDocsRequired"); diff --git a/frontend/micro-ui/web/micro-ui-internals/publish-beta.sh b/frontend/micro-ui/web/micro-ui-internals/publish-beta.sh index 36e3d79405d..a2f28cf3cec 100644 --- a/frontend/micro-ui/web/micro-ui-internals/publish-beta.sh +++ b/frontend/micro-ui/web/micro-ui-internals/publish-beta.sh @@ -7,7 +7,7 @@ msg() { } # msg "Pre-building all packages" -# yarn build +yarn # sleep 5 # msg "Building and publishing css" diff --git a/frontend/micro-ui/web/package.json b/frontend/micro-ui/web/package.json index 6f018474c93..db4932d6bb9 100644 --- a/frontend/micro-ui/web/package.json +++ b/frontend/micro-ui/web/package.json @@ -13,22 +13,22 @@ "dependencies": { "@upyog-niua/upyog-css": "1.0.10", "@egovernments/digit-ui-libraries": "1.7.2", - "@egovernments/digit-ui-module-bills": "1.7.2", + "@upyog/digit-ui-module-bills": "1.7.2", "@egovernments/digit-ui-module-common": "1.7.2", "@egovernments/digit-ui-module-core": "1.7.2", - "@egovernments/digit-ui-module-engagement": "1.7.0-beta.2", - "@egovernments/digit-ui-module-dss": "1.7.2", - "@upyog/digit-ui-module-fsm": "1.7.2", - "@egovernments/digit-ui-module-hrms": "1.7.2", - "@egovernments/digit-ui-module-mcollect": "1.7.2", - "@egovernments/digit-ui-module-commonpt":"1.7.2", + "@upyog/digit-ui-module-engagement": "1.7.2", + "@upyog/digit-ui-module-dss": "1.7.3", + "@upyog/digit-ui-module-fsm": "1.7.3", + "@upyog/digit-ui-module-hrms": "1.7.3", + "@upyog/digit-ui-module-mcollect": "1.7.3", + "@upyog/digit-ui-module-commonpt":"1.7.2", "@upyog/digit-ui-module-obps": "1.7.2", - "@egovernments/digit-ui-module-noc": "1.7.2", - "@egovernments/digit-ui-module-pgr": "1.7.2", - "@upyog/digit-ui-module-pt": "1.7.2", - "@egovernments/digit-ui-module-receipts": "1.7.2", + "@upyog/digit-ui-module-noc": "1.7.3", + "@upyog/digit-ui-module-pgr": "1.7.5", + "@upyog/digit-ui-module-pt": "1.7.4", + "@upyog/digit-ui-module-receipts": "1.7.3", "@upyog/digit-ui-module-tl": "1.7.2", - "@upyog/digit-ui-module-ws": "1.7.2", + "@upyog/digit-ui-module-ws": "1.7.3", "@egovernments/digit-ui-react-components": "1.7.2", "babel-loader": "8.1.0", "react": "17.0.2", diff --git a/frontend/micro-ui/web/src/App.js b/frontend/micro-ui/web/src/App.js index 5067750053d..592526e980f 100644 --- a/frontend/micro-ui/web/src/App.js +++ b/frontend/micro-ui/web/src/App.js @@ -3,15 +3,15 @@ import React from "react"; import { initPGRComponents, PGRReducers, -} from "@egovernments/digit-ui-module-pgr"; +} from "@upyog/digit-ui-module-pgr"; import { initFSMComponents } from "@upyog/digit-ui-module-fsm"; import { PTModule, PTLinks, PTComponents, } from "@upyog/digit-ui-module-pt"; -import { MCollectModule, MCollectLinks, initMCollectComponents } from "@egovernments/digit-ui-module-mcollect"; -import { initDSSComponents } from "@egovernments/digit-ui-module-dss"; +import { MCollectModule, MCollectLinks, initMCollectComponents } from "@upyog/digit-ui-module-mcollect"; +import { initDSSComponents } from "@upyog/digit-ui-module-dss"; import { PaymentModule, PaymentLinks, @@ -22,20 +22,20 @@ import { initLibraries } from "@egovernments/digit-ui-libraries"; import { HRMSModule, initHRMSComponents, -} from "@egovernments/digit-ui-module-hrms"; +} from "@upyog/digit-ui-module-hrms"; import { TLModule, TLLinks, initTLComponents, } from "@upyog/digit-ui-module-tl"; -import { initReceiptsComponents, ReceiptsModule } from "@egovernments/digit-ui-module-receipts"; +import { initReceiptsComponents, ReceiptsModule } from "@upyog/digit-ui-module-receipts"; import { initOBPSComponents } from "@upyog/digit-ui-module-obps"; -import { initNOCComponents } from "@egovernments/digit-ui-module-noc"; -import { initEngagementComponents } from "@egovernments/digit-ui-module-engagement"; +import { initNOCComponents } from "@upyog/digit-ui-module-noc"; +import { initEngagementComponents } from "@upyog/digit-ui-module-engagement"; import { initWSComponents } from "@upyog/digit-ui-module-ws"; // import { initCustomisationComponents } from "./Customisations"; -import { initCommonPTComponents } from "@egovernments/digit-ui-module-commonpt"; -import { initBillsComponents } from "@egovernments/digit-ui-module-bills"; +import { initCommonPTComponents } from "@upyog/digit-ui-module-commonpt"; +import { initBillsComponents } from "@upyog/digit-ui-module-bills"; // import { initReportsComponents } from "@egovernments/digit-ui-module-reports"; initLibraries(); diff --git a/frontend/mono-ui/web/rainmaker-webview/src/main/AndroidManifest.xml b/frontend/mono-ui/web/rainmaker-webview/src/main/AndroidManifest.xml index b9cc10fd265..5f3cdb79fe9 100755 --- a/frontend/mono-ui/web/rainmaker-webview/src/main/AndroidManifest.xml +++ b/frontend/mono-ui/web/rainmaker-webview/src/main/AndroidManifest.xml @@ -69,7 +69,7 @@ diff --git a/frontend/mono-ui/web/rainmaker-webview/src/main/java/org/egovernment/mseva/AppJavaScriptProxy.java b/frontend/mono-ui/web/rainmaker-webview/src/main/java/org/egovernment/mseva/AppJavaScriptProxy.java index f467af41d76..d52fce3ea00 100755 --- a/frontend/mono-ui/web/rainmaker-webview/src/main/java/org/egovernment/mseva/AppJavaScriptProxy.java +++ b/frontend/mono-ui/web/rainmaker-webview/src/main/java/org/egovernment/mseva/AppJavaScriptProxy.java @@ -129,7 +129,6 @@ public void downloadBase64File(String base64Data, String filename) throws IOExce os = new FileOutputStream(dwldsPath, false); os.write(pdfAsBytes); }catch (Exception e){ - Log.v("Error while creating temp report."); }finally { os.flush(); os.close(); diff --git a/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/birth-common/birthSearchResources/birthSearchCard.js b/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/birth-common/birthSearchResources/birthSearchCard.js index ffb7a53486d..d76e4ec8137 100644 --- a/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/birth-common/birthSearchResources/birthSearchCard.js +++ b/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/birth-common/birthSearchResources/birthSearchCard.js @@ -263,7 +263,7 @@ export const searchSetCommon = getCommonContainer({ visible: process.env.REACT_APP_NAME === "Citizen" ? true : false, }), fromdate: getDateField({ - label: { labelName: "DOB", labelKey: "BND_FROM_DATE" }, + label: { labelName: "DOB", labelKey: "BND_BIRTH_FROM_DATE" }, placeholder: { labelName: "FromDate of Search", labelKey: "BND_BIRTH_DOB_PLACEHOLDER", @@ -284,7 +284,7 @@ export const searchSetCommon = getCommonContainer({ visible: process.env.REACT_APP_NAME === "Employee" ? true : false, }), todate: getDateField({ - label: { labelName: "DOB", labelKey: "BND_TO_DATE" }, + label: { labelName: "DOB", labelKey: "BND_BIRTH_TO_DATE" }, placeholder: { labelName: "ToDate of Search", labelKey: "BND_BIRTH_DOB_PLACEHOLDER", diff --git a/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/death-common/deathSearchResources/deathSearchCard.js b/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/death-common/deathSearchResources/deathSearchCard.js index a6e94943937..33af22c369c 100644 --- a/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/death-common/deathSearchResources/deathSearchCard.js +++ b/frontend/mono-ui/web/rainmaker/dev-packages/egov-bnd-dev/src/ui-config/screens/specs/death-common/deathSearchResources/deathSearchCard.js @@ -258,7 +258,7 @@ export const searchSetCommon = getCommonContainer({ visible: process.env.REACT_APP_NAME === "Citizen" ? true : false, }), fromdate: getDateField({ - label: { labelName: "DOD", labelKey: "BND_FROM_DATE" }, + label: { labelName: "DOD", labelKey: "BND_DEATH_FROM_DATE" }, placeholder: { labelName: "FromDate of Search", labelKey: "BND_DEATH_DOB_PLACEHOLDER", @@ -279,7 +279,7 @@ export const searchSetCommon = getCommonContainer({ visible: process.env.REACT_APP_NAME === "Employee" ? true : false, }), todate: getDateField({ - label: { labelName: "DOD", labelKey: "BND_TO_DATE" }, + label: { labelName: "DOD", labelKey: "BND_DEATH_TO_DATE" }, placeholder: { labelName: "ToDate of Search", labelKey: "BND_DEATH_DOB_PLACEHOLDER", diff --git a/frontend/mono-ui/web/rainmaker/dev-packages/egov-firenoc-dev/src/ui-config/screens/specs/utils/index.js b/frontend/mono-ui/web/rainmaker/dev-packages/egov-firenoc-dev/src/ui-config/screens/specs/utils/index.js index d8d45dea5c0..2dc4b566bf7 100644 --- a/frontend/mono-ui/web/rainmaker/dev-packages/egov-firenoc-dev/src/ui-config/screens/specs/utils/index.js +++ b/frontend/mono-ui/web/rainmaker/dev-packages/egov-firenoc-dev/src/ui-config/screens/specs/utils/index.js @@ -169,10 +169,24 @@ export const getCurrentFinancialYear = () => { var fiscalYr = ""; if (curMonth > 3) { var nextYr1 = (today.getFullYear() + 1).toString(); - fiscalYr = today.getFullYear().toString() + "-" + nextYr1; + fiscalYr = today.getFullYear().toString() + "-" + nextYr1.slice(-2); } else { var nextYr2 = today.getFullYear().toString(); - fiscalYr = (today.getFullYear() - 1).toString() + "-" + nextYr2; + fiscalYr = (today.getFullYear() - 1).toString() + "-" + nextYr2.slice(-2); + } + return fiscalYr; +}; + +export const getCurrentFinancialYearForFireNoc = () => { + var today = new Date(); + var curMonth = today.getMonth(); + var fiscalYr = ""; + if (curMonth > 3) { + var nextYr1 = (today.getFullYear() + 1).toString(); + fiscalYr = today.getFullYear().toString() + "-" + nextYr1.slice(-2); + } else { + var nextYr2 = today.getFullYear().toString(); + fiscalYr = (today.getFullYear() - 1).toString() + "-" + nextYr2.slice(-2); } return fiscalYr; }; diff --git a/frontend/mono-ui/web/rainmaker/dev-packages/egov-ui-kit-dev/src/components/AutoSuggestDropdown/index.js b/frontend/mono-ui/web/rainmaker/dev-packages/egov-ui-kit-dev/src/components/AutoSuggestDropdown/index.js index d145d1c34ca..9a17da6ea1e 100644 --- a/frontend/mono-ui/web/rainmaker/dev-packages/egov-ui-kit-dev/src/components/AutoSuggestDropdown/index.js +++ b/frontend/mono-ui/web/rainmaker/dev-packages/egov-ui-kit-dev/src/components/AutoSuggestDropdown/index.js @@ -161,4 +161,4 @@ const mapStateToProps = (state, ownProps) => { export default connect( mapStateToProps, null -)(AutoSuggestDropdown); +)(AutoSuggestDropdown); \ No newline at end of file diff --git a/frontend/workbench-ui/.gitignore b/frontend/workbench-ui/.gitignore new file mode 100644 index 00000000000..feb4cac5c94 --- /dev/null +++ b/frontend/workbench-ui/.gitignore @@ -0,0 +1,32 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +.env +.eslintcache + +# yarn $ +.yarn +yarn.lock +.yarnrc.yml + +# dependencies +node_modules +.yarn +/.pnp +.pnp.js + +# testing +/coverage + +# production +/web/build +dist +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/frontend/workbench-ui/CODEOWNERS b/frontend/workbench-ui/CODEOWNERS new file mode 100644 index 00000000000..ee47f9464c2 --- /dev/null +++ b/frontend/workbench-ui/CODEOWNERS @@ -0,0 +1 @@ +* @jagankumar-egov @sathishp-eGov diff --git a/frontend/workbench-ui/Jenkinsfile b/frontend/workbench-ui/Jenkinsfile new file mode 100644 index 00000000000..1206b9c141d --- /dev/null +++ b/frontend/workbench-ui/Jenkinsfile @@ -0,0 +1,3 @@ +library 'ci-libs' + +buildPipeline(configFile: './build/build-config.yml') diff --git a/frontend/workbench-ui/README.md b/frontend/workbench-ui/README.md new file mode 100644 index 00000000000..9420dbb760d --- /dev/null +++ b/frontend/workbench-ui/README.md @@ -0,0 +1,140 @@ + +# workbench ui + +A React App built on top of DIGIT UI Core. + +# DIGIT + +DIGIT eGovernance Platform Services + +DIGIT (Digital Infrastructure for Governance, Impact & Transformation) is India's largest platform for governance services. Visit https://core.digit.org/ for more details. + +DIGIT platform is microservices based API platform enabling quick rebundling of services as per specific needs. This is a repo that lays down the core platform on top of which other mission services depend. + + +# DIGIT UI + + +This repository contains source code for web implementation of the new Digit UI modules with dependencies and libraries. + +Workbench module is used to Manage the master data (MDMS V2 Service) used across the DIGIT Services / Applications + +It is also used to manage the Localisation data present in the system (Localisation service) + + +## Run Locally + +Clone the project + +```bash + git clone https://github.com/egovernments/DIGIT-Frontend.git +``` + +Go to the Sub directory to run UI +```bash + cd into micro-ui/web/micro-ui-internals +``` + +Install dependencies + +```bash + yarn install +``` + +Add .env file +```bash + micro-ui/web/micro-ui-internals/example/.env +``` + +Start the server + +```bash + yarn start +``` + + +## Environment Variables + +To run this project, you will need to add the following environment variables to your .env file + +`REACT_APP_PROXY_API` :: `{{server url}}` + +`REACT_APP_GLOBAL` :: `{{server url}}` + +`REACT_APP_PROXY_ASSETS` :: `{{server url}}` + +`REACT_APP_USER_TYPE` :: `{{EMPLOYEE||CITIZEN}}` + +`SKIP_PREFLIGHT_CHECK` :: `true` + +[sample .env file](https://github.com/egovernments/Digit-Core/blob/workbench/frontend/micro-ui/web/micro-ui-internals/example/.env-unifieddev) + +## Tech Stack + +**Libraries:** + +[React](https://react.dev/) + +[React Hook Form](https://www.react-hook-form.com/) + +[React Query](https://tanstack.com/query/v3/) + +[Tailwind CSS](https://tailwindcss.com/) + +[Webpack](https://webpack.js.org/) + +## License + +[MIT](https://choosealicense.com/licenses/mit/) + + +## Author + +- [@jagankumar-egov](https://www.github.com/jagankumar-egov) + + +## Documentation + +[Documentation](https://https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) + + +## Support + +For support, add the issues in https://github.com/egovernments/DIGIT-core/issues. + + +## Modules + + 1. Core + 2. Workbench + 3. HRMS + 4. Dashboard + 5. Engagement + 6. Payment + +## Starting with Digit-UI App (Impelmentation Teams) - MICRO-UI + + +Go to the Sub directory to run UI + +```bash + cd into micro-ui/web +``` + +```bash + yarn install +``` + +Add .env file +```bash + micro-ui/web/.env +``` + +Start the server + +```bash + yarn start +``` + + +![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) diff --git a/frontend/workbench-ui/package.json b/frontend/workbench-ui/package.json new file mode 100644 index 00000000000..19a3c47d6ee --- /dev/null +++ b/frontend/workbench-ui/package.json @@ -0,0 +1,4 @@ +{ + "name": "workbench-ui", + "version": "1.0.0" +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/.babelrc b/frontend/workbench-ui/web/.babelrc new file mode 100644 index 00000000000..5f90443d15e --- /dev/null +++ b/frontend/workbench-ui/web/.babelrc @@ -0,0 +1,5 @@ +{ + "presets": [ + "@babel/preset-env","@babel/preset-react" + ] + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/.env.sample b/frontend/workbench-ui/web/.env.sample new file mode 100644 index 00000000000..e87c7f586c4 --- /dev/null +++ b/frontend/workbench-ui/web/.env.sample @@ -0,0 +1,3 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_STATE_LEVEL_TENANT_ID=pb +REACT_APP_PROXY_URL=https://works-dev.digit.org diff --git a/frontend/workbench-ui/web/core/App.js b/frontend/workbench-ui/web/core/App.js new file mode 100644 index 00000000000..26a4f11a8ed --- /dev/null +++ b/frontend/workbench-ui/web/core/App.js @@ -0,0 +1,72 @@ +import React from "react"; +import { initLibraries } from "@egovernments/digit-ui-libraries"; +import { + paymentConfigs, + PaymentLinks, + PaymentModule, +} from "@egovernments/digit-ui-module-common"; +import { DigitUI } from "@egovernments/digit-ui-module-core"; +import { initDSSComponents } from "@egovernments/digit-ui-module-dss"; +import { initEngagementComponents } from "@egovernments/digit-ui-module-engagement"; +import { initHRMSComponents } from "@egovernments/digit-ui-module-hrms"; +import { initUtilitiesComponents } from "@egovernments/digit-ui-module-utilities"; +import { UICustomizations } from "./Customisations/UICustomizations"; +import { initWorkbenchComponents } from "@egovernments/digit-ui-module-workbench"; + +window.contextPath = window?.globalConfigs?.getConfig("CONTEXT_PATH"); + +const enabledModules = [ + "DSS", + "NDSS", + "Utilities", + "HRMS", + "Engagement", + "Workbench", +]; + +const moduleReducers = (initData) => ({ + initData, +}); + +const initDigitUI = () => { + window.Digit.ComponentRegistryService.setupRegistry({ + PaymentModule, + ...paymentConfigs, + PaymentLinks, + }); + + initDSSComponents(); + initHRMSComponents(); + initEngagementComponents(); + initUtilitiesComponents(); + initWorkbenchComponents(); + + window.Digit.Customizations = { + PGR: {}, + commonUiConfig: UICustomizations, + }; +}; + +initLibraries().then(() => { + initDigitUI(); +}); + +function App() { + window.contextPath = window?.globalConfigs?.getConfig("CONTEXT_PATH"); + const stateCode = + window.globalConfigs?.getConfig("STATE_LEVEL_TENANT_ID") || + process.env.REACT_APP_STATE_LEVEL_TENANT_ID; + if (!stateCode) { + return

stateCode is not defined

; + } + return ( + + ); +} + +export default App; diff --git a/frontend/workbench-ui/web/core/Dockerfile b/frontend/workbench-ui/web/core/Dockerfile new file mode 100644 index 00000000000..0e5c5add33d --- /dev/null +++ b/frontend/workbench-ui/web/core/Dockerfile @@ -0,0 +1,29 @@ +FROM egovio/alpine-node-builder-14:yarn AS build +#FROM ghcr.io/egovernments/alpine-node-builder-14:yarn AS build +RUN apk update && apk upgrade +RUN apk add --no-cache git>2.30.0 +ARG WORK_DIR +WORKDIR /app +ENV NODE_OPTIONS "--max-old-space-size=4792" + +COPY ${WORK_DIR} . +RUN ls -lah + +#RUN node web/envs.js +RUN cd web/ \ + && node -e 'console.log(v8.getHeapStatistics().heap_size_limit/(1024*1024))' \ + && node -e 'console.log("core only")' \ + && cd core/ \ + && ./install-deps.sh \ + && cd ../ \ + && yarn install \ + && yarn build:webpack + +FROM nginx:mainline-alpine +#FROM ghcr.io/egovernments/nginx:mainline-alpine +ENV WORK_DIR=/var/web/core-ui + +RUN mkdir -p ${WORK_DIR} + +COPY --from=build /app/web/build ${WORK_DIR}/ +COPY --from=build /app/web/core/nginx.conf /etc/nginx/conf.d/default.conf diff --git a/frontend/workbench-ui/web/core/install-deps.sh b/frontend/workbench-ui/web/core/install-deps.sh new file mode 100644 index 00000000000..3de106c45f7 --- /dev/null +++ b/frontend/workbench-ui/web/core/install-deps.sh @@ -0,0 +1,18 @@ +#!/bin/sh + +BRANCH="$(git branch --show-current)" + +echo "Main Branch: $BRANCH" + +INTERNALS="micro-ui-internals" +cd .. + +cp core/App.js src +cp core/package.json package.json +cp core/webpack.config.js webpack.config.js +cp core/inter-package.json $INTERNALS/package.json + +cp $INTERNALS/example/src/UICustomizations.js src/Customisations + +echo "UI :: core " && echo "Branch: $(git branch --show-current)" && echo "$(git log -1 --pretty=%B)" && echo "installing packages" + diff --git a/frontend/workbench-ui/web/core/inter-package.json b/frontend/workbench-ui/web/core/inter-package.json new file mode 100644 index 00000000000..41a1aaecd38 --- /dev/null +++ b/frontend/workbench-ui/web/core/inter-package.json @@ -0,0 +1,74 @@ +{ + "name": "egovernments", + "version": "1.0.0", + "main": "index.js", + "workspaces": [ + "packages/libraries", + "example", + "packages/css", + "packages/react-components", + "packages/modules/*" + ], + "author": "JaganKumar ", + "license": "MIT", + "private": true, + "engines": { + "node": ">=14" + }, + "scripts": { + "start": "SKIP_PREFLIGHT_CHECK=true run-s build start:dev", + "sprint": "SKIP_PREFLIGHT_CHECK=true run-s start:script", + "start:dev": "run-p dev:**", + "start:script": "./scripts/create.sh", + "dev:css": "cd packages/css && yarn start", + "publish:css": "cd packages/css && yarn publish --access public", + "dev:libraries": "cd packages/libraries && yarn start", + "dev:components": "cd packages/react-components && yarn start", + "dev:example": "cd example && yarn start", + "dev:core": "cd packages/modules/core && yarn start", + "dev:dss": "cd packages/modules/dss && yarn start", + "dev:hrms": "cd packages/modules/hrms && yarn start", + "devD:common": "cd packages/modules/common && yarn start", + "devD:utilities": "cd packages/modules/utilities && yarn start", + "dev:workbench": "cd packages/modules/workbench && yarn start", + "dev:engagement": "cd packages/modules/engagement && yarn start", + "build": "run-p build:**", + "build:libraries": "cd packages/libraries && yarn build", + "build:components": "cd packages/react-components && yarn build", + "build:svgcomponents": "cd packages/svg-components && yarn build", + "build:dss": "cd packages/modules/dss && yarn build", + "build:core": "cd packages/modules/core && yarn build", + "build:hrms": "cd packages/modules/hrms && yarn build", + "build:common": "cd packages/modules/common && yarn build", + "build:utilities": "cd packages/modules/utilities && yarn build", + "build:engagement": "cd packages/modules/engagement && yarn build", + "build:workbench": "cd packages/modules/workbench && yarn build", + "deploy:jenkins": "./scripts/jenkins.sh", + "clean": "rm -rf node_modules" + }, + "resolutions": { + "**/@babel/runtime": "7.20.1", + "**/babel-preset-react-app": "10.0.0" + }, + "devDependencies": { + "husky": "7.0.4", + "lint-staged": "12.3.7", + "npm-run-all": "4.1.5", + "prettier": "2.1.2" + }, + "husky": {}, + "lint-staged": { + "*.{js,css,md}": "prettier --write" + }, + "dependencies": { + "lodash": "4.17.21", + "microbundle-crl": "0.13.11", + "@egovernments/digit-ui-react-components": "1.8.0-beta.1", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-hook-form": "6.15.8", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "react-router-dom": "5.3.0" + } +} diff --git a/frontend/workbench-ui/web/core/nginx.conf b/frontend/workbench-ui/web/core/nginx.conf new file mode 100644 index 00000000000..cd96c34913f --- /dev/null +++ b/frontend/workbench-ui/web/core/nginx.conf @@ -0,0 +1,12 @@ +server +{ + listen 80; + underscores_in_headers on; + + location /core-ui + { + root /var/web; + index index.html index.htm; + try_files $uri $uri/ /core-ui/index.html; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/core/package.json b/frontend/workbench-ui/web/core/package.json new file mode 100644 index 00000000000..62675c6355d --- /dev/null +++ b/frontend/workbench-ui/web/core/package.json @@ -0,0 +1,84 @@ +{ + "name": "micro-ui", + "version": "1.0.0", + "author": "Jagankumar ", + "license": "MIT", + "private": true, + "engines": { + "node": ">=14" + }, + "workspaces": [ + "micro-ui-internals/packages/libraries", + "micro-ui-internals/packages/react-components", + "micro-ui-internals/packages/modules/*" + ], + "homepage": "/core-ui", + "dependencies": { + "@egovernments/digit-ui-libraries": "1.8.0-beta", + "@egovernments/digit-ui-module-workbench": "1.0.0-beta", + "@egovernments/digit-ui-module-core": "1.8.0-beta.5", + "@egovernments/digit-ui-module-hrms": "1.8.0-beta.2", + "@egovernments/digit-ui-react-components": "1.8.0-beta.1", + "@egovernments/digit-ui-module-dss": "1.8.0-beta", + "@egovernments/digit-ui-module-common": "1.8.0-beta", + "@egovernments/digit-ui-module-utilities": "1.0.0-beta", + "@egovernments/digit-ui-module-engagement": "1.5.20", + "babel-loader": "8.1.0", + "clean-webpack-plugin": "4.0.0", + "react": "17.0.2", + "react-dom": "17.0.2", + "jsonpath": "^1.1.1", + "react-router-dom": "5.3.0", + "react-scripts": "4.0.1", + "web-vitals": "1.1.2", + "terser-brunch": "^4.1.0", + "react-hook-form": "6.15.8", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "css-loader":"5.2.6", + "style-loader": "2.0.0", + "webpack-cli": "4.10.0" + }, + "devDependencies": { + "@babel/plugin-proposal-private-property-in-object": "7.21.0", + "http-proxy-middleware": "1.3.1", + "lodash": "4.17.21", + "microbundle-crl": "0.13.11", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-hook-form": "6.15.8", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "react-router-dom": "5.3.0", + "husky": "7.0.4", + "lint-staged": "12.3.7", + "npm-run-all": "4.1.5", + "prettier": "2.1.2" + }, + "scripts": { + "start": "react-scripts start", + "build": "GENERATE_SOURCEMAP=false SKIP_PREFLIGHT_CHECK=true react-scripts build", + "build:prepare": "./build.sh", + "build:libraries": "cd micro-ui-internals && yarn build", + "build:prod": "webpack --mode production", + "build:webpack":"yarn build:libraries &&cd .. && ls && cd ./web && ls && yarn build:prod", + "clean": "rm -rf node_modules" + }, + "eslintConfig": { + "extends": [ + "react-app" + ] + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/frontend/workbench-ui/web/core/webpack.config.js b/frontend/workbench-ui/web/core/webpack.config.js new file mode 100644 index 00000000000..83428036d3e --- /dev/null +++ b/frontend/workbench-ui/web/core/webpack.config.js @@ -0,0 +1,44 @@ +const path = require("path"); +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const { CleanWebpackPlugin } = require("clean-webpack-plugin"); +// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; + +module.exports = { + // mode: 'development', + entry: "./src/index.js", + devtool: "none", + module: { + rules: [ + { + test: /\.(js)$/, + exclude: /node_modules/, + use: ["babel-loader"], + }, + { + test: /\.css$/i, + use: ["style-loader", "css-loader"], + } + ], + }, + output: { + filename: "[name].bundle.js", + path: path.resolve(__dirname, "build"), + publicPath: "/core-ui/", + }, + optimization: { + splitChunks: { + chunks: 'all', + minSize:20000, + maxSize:50000, + enforceSizeThreshold:50000, + minChunks:1, + maxAsyncRequests:30, + maxInitialRequests:30 + }, + }, + plugins: [ + new CleanWebpackPlugin(), + // new BundleAnalyzerPlugin(), + new HtmlWebpackPlugin({ inject: true, template: "public/index.html" }), + ], +}; \ No newline at end of file diff --git a/frontend/workbench-ui/web/docker/Dockerfile b/frontend/workbench-ui/web/docker/Dockerfile new file mode 100644 index 00000000000..72d64bbab52 --- /dev/null +++ b/frontend/workbench-ui/web/docker/Dockerfile @@ -0,0 +1,26 @@ +# FROM egovio/alpine-node-builder-14:yarn AS build +FROM ghcr.io/egovernments/alpine-node-builder-14:yarn AS build +RUN apk update && apk upgrade +RUN apk add --no-cache git>2.30.0 +ARG WORK_DIR +WORKDIR /app +ENV NODE_OPTIONS "--max-old-space-size=8168" + +COPY ${WORK_DIR} . +RUN ls -lah + +#RUN node web/envs.js +RUN cd web/ \ + && chmod +x install-deps.sh \ + && ./install-deps.sh \ + && yarn install \ + && yarn build:webpack + +FROM nginx:mainline-alpine +#FROM ghcr.io/egovernments/nginx:mainline-alpine +ENV WORK_DIR=/var/web/digit-ui + +RUN mkdir -p ${WORK_DIR} + +COPY --from=build /app/web/build ${WORK_DIR}/ +COPY --from=build /app/web/docker/nginx.conf /etc/nginx/conf.d/default.conf diff --git a/frontend/workbench-ui/web/docker/devDockerfile b/frontend/workbench-ui/web/docker/devDockerfile new file mode 100644 index 00000000000..d7b1ba1870a --- /dev/null +++ b/frontend/workbench-ui/web/docker/devDockerfile @@ -0,0 +1,26 @@ +#FROM egovio/alpine-node-builder-14:yarn AS build +FROM ghcr.io/egovernments/alpine-node-builder-14:yarn AS build +RUN apk update && apk upgrade +RUN apk add --no-cache git>2.30.0 +ARG WORK_DIR +WORKDIR /app +ENV NODE_OPTIONS "--max-old-space-size=1792" + +COPY ${WORK_DIR} . +RUN ls -lah + +#RUN node web/envs.js +RUN cd web/ \ + && node envs.js \ + && ./install-deps.sh \ + && yarn install \ + && yarn build + +#FROM nginx:mainline-alpine +FROM ghcr.io/egovernments/nginx:mainline-alpine +ENV WORK_DIR=/var/web/digit-ui + +RUN mkdir -p ${WORK_DIR} + +COPY --from=build /app/web/build ${WORK_DIR}/ +COPY --from=build /app/web/docker/nginx.conf /etc/nginx/conf.d/default.conf diff --git a/frontend/workbench-ui/web/docker/masDockerfile b/frontend/workbench-ui/web/docker/masDockerfile new file mode 100644 index 00000000000..5d7cf45dd87 --- /dev/null +++ b/frontend/workbench-ui/web/docker/masDockerfile @@ -0,0 +1,25 @@ +#FROM egovio/alpine-node-builder-14:yarn AS build +FROM ghcr.io/egovernments/alpine-node-builder-14:yarn AS build +RUN apk update && apk upgrade +RUN apk add --no-cache git>2.30.0 +ARG WORK_DIR +WORKDIR /app +ENV NODE_OPTIONS "--max-old-space-size=3792" + +COPY ${WORK_DIR} . +RUN ls -lah + +#RUN node web/envs.js +RUN cd web/ \ + && node envs.js \ + && yarn install \ + && yarn build + +#FROM nginx:mainline-alpine +FROM ghcr.io/egovernments/nginx:mainline-alpine +ENV WORK_DIR=/var/web/digit-ui + +RUN mkdir -p ${WORK_DIR} + +COPY --from=build /app/web/build ${WORK_DIR}/ +COPY --from=build /app/web/docker/nginx.conf /etc/nginx/conf.d/default.conf diff --git a/frontend/workbench-ui/web/docker/nginx.conf b/frontend/workbench-ui/web/docker/nginx.conf new file mode 100644 index 00000000000..4f532e4a6ed --- /dev/null +++ b/frontend/workbench-ui/web/docker/nginx.conf @@ -0,0 +1,12 @@ +server +{ + listen 80; + underscores_in_headers on; + + location /digit-ui + { + root /var/web; + index index.html index.htm; + try_files $uri $uri/ /digit-ui/index.html; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/envs.js b/frontend/workbench-ui/web/envs.js new file mode 100644 index 00000000000..e69de29bb2d diff --git a/frontend/workbench-ui/web/install-deps.sh b/frontend/workbench-ui/web/install-deps.sh new file mode 100644 index 00000000000..efaceaee20d --- /dev/null +++ b/frontend/workbench-ui/web/install-deps.sh @@ -0,0 +1,14 @@ +#!/bin/sh + +BRANCH="$(git branch --show-current)" + +echo "Main Branch: $BRANCH" + +INTERNALS="micro-ui-internals" + +cp $INTERNALS/example/src/UICustomizations.js src/Customisations + +cd $INTERNALS && echo "Branch: $(git branch --show-current)" && echo "$(git log -1 --pretty=%B)" && echo "installing packages" + + +# yarn install diff --git a/frontend/workbench-ui/web/micro-ui-internals/.gitignore b/frontend/workbench-ui/web/micro-ui-internals/.gitignore new file mode 100644 index 00000000000..1747c795d6f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/.gitignore @@ -0,0 +1,143 @@ +# Created by https://www.toptal.com/developers/gitignore/api/node,react +# Edit at https://www.toptal.com/developers/gitignore?templates=node,react + +### eGov ### +packages/css/example/index.css +package-lock.json +locales/ +build/ +packages/**/dist/ + +# yarn # +.yarn +.yarnrc.yml + +### Node ### +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +lerna-debug.log* + +# Diagnostic reports (https://nodejs.org/api/report.html) +report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage +*.lcov + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (https://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# TypeScript v1 declaration files +typings/ + +# TypeScript cache +*.tsbuildinfo + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Microbundle cache +.rpt2_cache/ +.rts2_cache_cjs/ +.rts2_cache_es/ +.rts2_cache_umd/ + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# dotenv environment variables file +.env +.env.test +.env*.local + +# parcel-bundler cache (https://parceljs.org/) +.cache +.parcel-cache + +# Next.js build output +.next + +# Nuxt.js build / generate output +.nuxt +dist +dist-storybook + +# Gatsby files +.cache/ +# Comment in the public line in if your project uses Gatsby and not Next.js +# https://nextjs.org/blog/next-9-1#public-directory-support +# public + +# vuepress build output +.vuepress/dist + +# Serverless directories +.serverless/ + +# FuseBox cache +.fusebox/ + +# DynamoDB Local files +.dynamodb/ + +# TernJS port file +.tern-port + +# Stores VSCode versions used for testing VSCode extensions +.vscode-test + +### react ### +.DS_* +**/*.backup.* +**/*.back.* + +node_modules + +*.sublime* + +psd +thumb +sketch + +# vs code +.vscode/ + +# End of https://www.toptal.com/developers/gitignore/api/node,react \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/.prettierignore b/frontend/workbench-ui/web/micro-ui-internals/.prettierignore new file mode 100644 index 00000000000..d54de016ef0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/.prettierignore @@ -0,0 +1,23 @@ + +# See https://help.github.com/ignore-files/ for more about ignoring files. +# dependencies +node_modules +# builds +build +dist +.rpt2_cache +# dev +dev.css +index.css +index.compat.css +index.min.css +# misc +.DS_Store +.env +.env.local +.env.development.local +.env.test.local +.env.production.local +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/frontend/workbench-ui/web/micro-ui-internals/.prettierrc.json b/frontend/workbench-ui/web/micro-ui-internals/.prettierrc.json new file mode 100644 index 00000000000..b975008d6f8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/.prettierrc.json @@ -0,0 +1,3 @@ +{ + "printWidth": 150 +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/README.md b/frontend/workbench-ui/web/micro-ui-internals/README.md new file mode 100644 index 00000000000..f23a1fcfe9c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/README.md @@ -0,0 +1,100 @@ + +# workbench ui + +A React App built on top of DIGIT UI Core. + + +# DIGIT UI + +DIGIT (Digital Infrastructure for Governance, Impact & Transformation) is India's largest platform for governance services. Visit https://www.digit.org for more details. + +This repository contains source code for web implementation of the new Digit UI modules with dependencies and libraries. + +Workbench module is used to Manage the master data (MDMS V2 Service) used across the DIGIT Services / Applications + +It is also used to manage the Localisation data present in the system (Localisation service) + + +## Run Locally + +Clone the project + +```bash + git clone https://github.com/egovernments/Digit-Core.git +``` + +Go to the Sub directory to run UI +```bash + cd into frontend/micro-ui/web/micro-ui-internals +``` + +Install dependencies + +```bash + yarn install +``` + +Add .env file +```bash + frontend/micro-ui/web/micro-ui-internals/example/.env +``` + +Start the server + +```bash + yarn start +``` + + +## Environment Variables + +To run this project, you will need to add the following environment variables to your .env file + +`REACT_APP_PROXY_API` :: `{{server url}}` + +`REACT_APP_GLOBAL` :: `{{server url}}` + +`REACT_APP_PROXY_ASSETS` :: `{{server url}}` + +`REACT_APP_USER_TYPE` :: `{{EMPLOYEE||CITIZEN}}` + +`SKIP_PREFLIGHT_CHECK` :: `true` + +[sample .env file](https://github.com/egovernments/Digit-Core/blob/workbench/frontend/micro-ui/web/micro-ui-internals/example/.env-unifieddev) + +## Tech Stack + +**Libraries:** + +[React](https://react.dev/) + +[React Hook Form](https://www.react-hook-form.com/) + +[React Query](https://tanstack.com/query/v3/) + +[Tailwind CSS](https://tailwindcss.com/) + +[Webpack](https://webpack.js.org/) + +## License + +[MIT](https://choosealicense.com/licenses/mit/) + + +## Author + +- [@jagankumar-egov](https://www.github.com/jagankumar-egov) + + +## Documentation + +[Documentation](https://https://core.digit.org/guides/developer-guide/ui-developer-guide/digit-ui) + + +## Support + +For support, add the issues in https://github.com/egovernments/DIGIT-core/issues. + + +![Logo](https://s3.ap-south-1.amazonaws.com/works-dev-asset/mseva-white-logo.png) + diff --git a/frontend/workbench-ui/web/micro-ui-internals/clean.sh b/frontend/workbench-ui/web/micro-ui-internals/clean.sh new file mode 100644 index 00000000000..2235ef1c1d0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/clean.sh @@ -0,0 +1,28 @@ +#!/bin/bash + +BASEDIR="$( cd "$( dirname "$0" )" && pwd )" + +msg() { + echo -e "\n\n\033[32;32m$1\033[0m" +} + +msg "Cleaning root" +rm -rf node_modules + +msg "Cleaning css" +cd "$BASEDIR/packages/css" && rm -rf node_modules + +msg "Cleaning libraries" +cd "$BASEDIR/packages/libraries" && rm -rf node_modules + +msg "Cleaning react-components" +cd "$BASEDIR/packages/react-components" && rm -rf node_modules + +msg "Cleaning PGR module" +cd "$BASEDIR/packages/modules/pgr" && rm -rf node_modules + +msg "Cleaning FSM module" +cd "$BASEDIR/packages/modules/fsm" && rm -rf node_modules + +msg "Cleaning Core module" +cd "$BASEDIR/packages/modules/core" && rm -rf node_modules diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-fsm b/frontend/workbench-ui/web/micro-ui-internals/example/.env-fsm new file mode 100644 index 00000000000..1343375f3f7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-fsm @@ -0,0 +1,7 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE= +REACT_APP_EMPLOYEE_TOKEN= +REACT_APP_CITIZEN_TOKEN= +REACT_APP_PROXY_API=https://unified-dev.digit.org +REACT_APP_PROXY_ASSETS=https://unified-dev.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/egov-dev-assets/globalConfigsFSM.js diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-health-qa b/frontend/workbench-ui/web/micro-ui-internals/example/.env-health-qa new file mode 100644 index 00000000000..73b42b7dfad --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-health-qa @@ -0,0 +1,7 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://health-qa.digit.org +REACT_APP_PROXY_ASSETS=https://health-qa.digit.org +REACT_APP_GLOBAL=https://egov-dev-assets.s3.ap-south-1.amazonaws.com/globalConfigsWorkbenchHCM.js diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-prod b/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-prod new file mode 100644 index 00000000000..2d02707d7eb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-prod @@ -0,0 +1,7 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://salama.digit.org +REACT_APP_PROXY_ASSETS=https://salama.digit.org +REACT_APP_GLOBAL=https://moz-health-prd.s3.af-south-1.amazonaws.com/globalConfig.js diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-uat b/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-uat new file mode 100644 index 00000000000..bedf28a95b1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-mz-uat @@ -0,0 +1,7 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://moz-health-uat.digit.org +REACT_APP_PROXY_ASSETS=https://moz-health-uat.digit.org +REACT_APP_GLOBAL=https://moz-health-uat.s3.ap-south-1.amazonaws.com/globalConfig.js diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-qa b/frontend/workbench-ui/web/micro-ui-internals/example/.env-qa new file mode 100644 index 00000000000..fbef1be340a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-qa @@ -0,0 +1,7 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://qa.digit.org +REACT_APP_PROXY_ASSETS=https://qa.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/egov-dev-assets/globalConfigs.js \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-unifieddev b/frontend/workbench-ui/web/micro-ui-internals/example/.env-unifieddev new file mode 100644 index 00000000000..e443e98e036 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-unifieddev @@ -0,0 +1,8 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://unified-dev.digit.org +REACT_APP_PROXY_ASSETS=https://unified-dev.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/egov-dev-assets/globalConfigsWorkbench.js +REACT_APP_CONTEXT=works \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-upyog b/frontend/workbench-ui/web/micro-ui-internals/example/.env-upyog new file mode 100644 index 00000000000..f434772b7c2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-upyog @@ -0,0 +1,8 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://upyog.niua.org +REACT_APP_PROXY_ASSETS=https://upyog.niua.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/in-egov-assets/globalConfigs.js +REACT_APP_CONTEXT=digit-ui \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench b/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench new file mode 100644 index 00000000000..2b49a958229 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench @@ -0,0 +1,8 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://works-dev.digit.org +REACT_APP_PROXY_ASSETS=https://works-dev.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/works-dev-asset/globalConfigsWorkbench.js +REACT_APP_CONTEXT=works \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench-qa b/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench-qa new file mode 100644 index 00000000000..ccf4e7ca08f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-workbench-qa @@ -0,0 +1,8 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://qa.digit.org +REACT_APP_PROXY_ASSETS=https://qa.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/egov-qa-assets/globalConfigsWorkbench.js +REACT_APP_CONTEXT=works \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/.env-worksdev b/frontend/workbench-ui/web/micro-ui-internals/example/.env-worksdev new file mode 100644 index 00000000000..b42651ee829 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/.env-worksdev @@ -0,0 +1,8 @@ +SKIP_PREFLIGHT_CHECK=true +REACT_APP_USER_TYPE=EMPLOYEE +REACT_APP_EMPLOYEE_TOKEN=c835932f-2ad4-4d05-83d6-49e0b8c59f8a +REACT_APP_CITIZEN_TOKEN=7cd58aae-30b3-41ed-a1b3-3417107a993c +REACT_APP_PROXY_API=https://works-dev.digit.org +REACT_APP_PROXY_ASSETS=https://works-dev.digit.org +REACT_APP_GLOBAL=https://s3.ap-south-1.amazonaws.com/works-dev-asset/globalConfigsWorks.js +REACT_APP_CONTEXT=works \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/maspackage.json b/frontend/workbench-ui/web/micro-ui-internals/example/maspackage.json new file mode 100644 index 00000000000..1f54328562b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/maspackage.json @@ -0,0 +1,31 @@ +{ + "name": "@egovernments/digit-ui-example", + "version": "1.3.0", + "main": "index.js", + "license": "MIT", + "private": true, + "homepage": "digit-ui/", + "scripts": { + "start": "react-scripts start" + }, + "devDependencies": { + "http-proxy-middleware": "^1.0.5", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-i18next": "11.16.2", + "react-router-dom": "5.3.0", + "react-scripts": "^4.0.1" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/package.json b/frontend/workbench-ui/web/micro-ui-internals/example/package.json new file mode 100644 index 00000000000..f3753ae0715 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/package.json @@ -0,0 +1,40 @@ +{ + "name": "@egovernments/digit-ui-example", + "version": "1.0.0", + "main": "index.js", + "license": "MIT", + "private": true, + "homepage": "digit-ui", + "scripts": { + "start": "react-scripts start" + }, + "devDependencies": { + "@egovernments/digit-ui-libraries": "1.8.0-beta", + "@egovernments/digit-ui-module-workbench": "1.0.0-beta", + "@egovernments/digit-ui-module-dss": "1.8.0-beta", + "@egovernments/digit-ui-module-core": "1.8.0-beta.5", + "@egovernments/digit-ui-module-common": "1.8.0-beta", + "@egovernments/digit-ui-module-hrms": "1.8.0-beta.2", + "@egovernments/digit-ui-module-utilities": "1.0.0-beta", + "@egovernments/digit-ui-module-engagement": "1.5.20", + "@egovernments/digit-ui-react-components": "1.8.0-beta.1", + "http-proxy-middleware": "^1.0.5", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-i18next": "11.16.2", + "react-router-dom": "5.3.0", + "react-scripts": "^4.0.1" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/public/index.html b/frontend/workbench-ui/web/micro-ui-internals/example/public/index.html new file mode 100644 index 00000000000..b85e17ebfce --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/public/index.html @@ -0,0 +1,26 @@ + + + + + + + + + + DIGIT + + + + + + + + + + +
+ + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/ComponentRegistry.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/ComponentRegistry.js new file mode 100644 index 00000000000..9bafce3dc89 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/ComponentRegistry.js @@ -0,0 +1,11 @@ +class Registry { + constructor(registry = {}) { + this._registry = registry; + } + + getComponent(id) { + return this._registry[id]; + } +} + +export default Registry; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/UICustomizations.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/UICustomizations.js new file mode 100644 index 00000000000..140c4664d72 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/UICustomizations.js @@ -0,0 +1,420 @@ +import { Link } from "react-router-dom"; +import _ from "lodash"; + +//create functions here based on module name set in mdms(eg->SearchProjectConfig) +//how to call these -> Digit?.Customizations?.[masterName]?.[moduleName] +// these functions will act as middlewares +var Digit = window.Digit || {}; + +const businessServiceMap = { + "muster roll": "MR", +}; + +const inboxModuleNameMap = { + "muster-roll-approval": "muster-roll-service", +}; + +export const UICustomizations = { + businessServiceMap, + updatePayload: (applicationDetails, data, action, businessService) => { + if (businessService === businessServiceMap.estimate) { + const workflow = { + comment: data.comments, + documents: data?.documents?.map((document) => { + return { + documentType: action?.action + " DOC", + fileName: document?.[1]?.file?.name, + fileStoreId: document?.[1]?.fileStoreId?.fileStoreId, + documentUid: document?.[1]?.fileStoreId?.fileStoreId, + tenantId: document?.[1]?.fileStoreId?.tenantId, + }; + }), + assignees: data?.assignees?.uuid ? [data?.assignees?.uuid] : null, + action: action.action, + }; + //filtering out the data + Object.keys(workflow).forEach((key, index) => { + if (!workflow[key] || workflow[key]?.length === 0) delete workflow[key]; + }); + + return { + estimate: applicationDetails, + workflow, + }; + } + if (businessService === businessServiceMap.contract) { + const workflow = { + comment: data?.comments, + documents: data?.documents?.map((document) => { + return { + documentType: action?.action + " DOC", + fileName: document?.[1]?.file?.name, + fileStoreId: document?.[1]?.fileStoreId?.fileStoreId, + documentUid: document?.[1]?.fileStoreId?.fileStoreId, + tenantId: document?.[1]?.fileStoreId?.tenantId, + }; + }), + assignees: data?.assignees?.uuid ? [data?.assignees?.uuid] : null, + action: action.action, + }; + //filtering out the data + Object.keys(workflow).forEach((key, index) => { + if (!workflow[key] || workflow[key]?.length === 0) delete workflow[key]; + }); + + return { + contract: applicationDetails, + workflow, + }; + } + if (businessService === businessServiceMap?.["muster roll"]) { + const workflow = { + comment: data?.comments, + documents: data?.documents?.map((document) => { + return { + documentType: action?.action + " DOC", + fileName: document?.[1]?.file?.name, + fileStoreId: document?.[1]?.fileStoreId?.fileStoreId, + documentUid: document?.[1]?.fileStoreId?.fileStoreId, + tenantId: document?.[1]?.fileStoreId?.tenantId, + }; + }), + assignees: data?.assignees?.uuid ? [data?.assignees?.uuid] : null, + action: action.action, + }; + //filtering out the data + Object.keys(workflow).forEach((key, index) => { + if (!workflow[key] || workflow[key]?.length === 0) delete workflow[key]; + }); + + return { + musterRoll: applicationDetails, + workflow, + }; + } + if (businessService === businessServiceMap?.["works.purchase"]) { + const workflow = { + comment: data.comments, + documents: data?.documents?.map((document) => { + return { + documentType: action?.action + " DOC", + fileName: document?.[1]?.file?.name, + fileStoreId: document?.[1]?.fileStoreId?.fileStoreId, + documentUid: document?.[1]?.fileStoreId?.fileStoreId, + tenantId: document?.[1]?.fileStoreId?.tenantId, + }; + }), + assignees: data?.assignees?.uuid ? [data?.assignees?.uuid] : null, + action: action.action, + }; + //filtering out the data + Object.keys(workflow).forEach((key, index) => { + if (!workflow[key] || workflow[key]?.length === 0) delete workflow[key]; + }); + + const additionalFieldsToSet = { + projectId: applicationDetails.additionalDetails.projectId, + invoiceDate: applicationDetails.billDate, + invoiceNumber: applicationDetails.referenceId.split("_")?.[1], + contractNumber: applicationDetails.referenceId.split("_")?.[0], + documents: applicationDetails.additionalDetails.documents, + }; + return { + bill: { ...applicationDetails, ...additionalFieldsToSet }, + workflow, + }; + } + }, + enableModalSubmit: (businessService, action, setModalSubmit, data) => { + if (businessService === businessServiceMap?.["muster roll"] && action.action === "APPROVE") { + setModalSubmit(data?.acceptTerms); + } + }, + enableHrmsSearch: (businessService, action) => { + if (businessService === businessServiceMap.estimate) { + return action.action.includes("TECHNICALSANCTION") || action.action.includes("VERIFYANDFORWARD"); + } + if (businessService === businessServiceMap.contract) { + return action.action.includes("VERIFY_AND_FORWARD"); + } + if (businessService === businessServiceMap?.["muster roll"]) { + return action.action.includes("VERIFY"); + } + if (businessService === businessServiceMap?.["works.purchase"]) { + return action.action.includes("VERIFY_AND_FORWARD"); + } + return false; + }, + getBusinessService: (moduleCode) => { + if (moduleCode?.includes("estimate")) { + return businessServiceMap?.estimate; + } else if (moduleCode?.includes("contract")) { + return businessServiceMap?.contract; + } else if (moduleCode?.includes("muster roll")) { + return businessServiceMap?.["muster roll"]; + } else if (moduleCode?.includes("works.purchase")) { + return businessServiceMap?.["works.purchase"]; + } else if (moduleCode?.includes("works.wages")) { + return businessServiceMap?.["works.wages"]; + } else if (moduleCode?.includes("works.supervision")) { + return businessServiceMap?.["works.supervision"]; + } else { + return businessServiceMap; + } + }, + getInboxModuleName: (moduleCode) => { + if (moduleCode?.includes("estimate")) { + return inboxModuleNameMap?.estimate; + } else if (moduleCode?.includes("contract")) { + return inboxModuleNameMap?.contracts; + } else if (moduleCode?.includes("attendence")) { + return inboxModuleNameMap?.attendencemgmt; + } else { + return inboxModuleNameMap; + } + }, + + AttendanceInboxConfig: { + preProcess: (data) => { + //set tenantId + data.body.inbox.tenantId = Digit.ULBService.getCurrentTenantId(); + data.body.inbox.processSearchCriteria.tenantId = Digit.ULBService.getCurrentTenantId(); + + const musterRollNumber = data?.body?.inbox?.moduleSearchCriteria?.musterRollNumber?.trim(); + if (musterRollNumber) data.body.inbox.moduleSearchCriteria.musterRollNumber = musterRollNumber; + + const attendanceRegisterName = data?.body?.inbox?.moduleSearchCriteria?.attendanceRegisterName?.trim(); + if (attendanceRegisterName) data.body.inbox.moduleSearchCriteria.attendanceRegisterName = attendanceRegisterName; + + // deleting them for now(assignee-> need clarity from pintu,ward-> static for now,not implemented BE side) + const assignee = _.clone(data.body.inbox.moduleSearchCriteria.assignee); + delete data.body.inbox.moduleSearchCriteria.assignee; + if (assignee?.code === "ASSIGNED_TO_ME") { + data.body.inbox.moduleSearchCriteria.assignee = Digit.UserService.getUser().info.uuid; + } + + //cloning locality and workflow states to format them + // let locality = _.clone(data.body.inbox.moduleSearchCriteria.locality ? data.body.inbox.moduleSearchCriteria.locality : []); + + let selectedOrg = _.clone(data.body.inbox.moduleSearchCriteria.orgId ? data.body.inbox.moduleSearchCriteria.orgId : null); + delete data.body.inbox.moduleSearchCriteria.orgId; + if (selectedOrg) { + data.body.inbox.moduleSearchCriteria.orgId = selectedOrg?.[0]?.applicationNumber; + } + + // let selectedWard = _.clone(data.body.inbox.moduleSearchCriteria.ward ? data.body.inbox.moduleSearchCriteria.ward : null); + // delete data.body.inbox.moduleSearchCriteria.ward; + // if(selectedWard) { + // data.body.inbox.moduleSearchCriteria.ward = selectedWard?.[0]?.code; + // } + + let states = _.clone(data.body.inbox.moduleSearchCriteria.state ? data.body.inbox.moduleSearchCriteria.state : []); + let ward = _.clone(data.body.inbox.moduleSearchCriteria.ward ? data.body.inbox.moduleSearchCriteria.ward : []); + // delete data.body.inbox.moduleSearchCriteria.locality; + delete data.body.inbox.moduleSearchCriteria.state; + delete data.body.inbox.moduleSearchCriteria.ward; + + // locality = locality?.map((row) => row?.code); + states = Object.keys(states)?.filter((key) => states[key]); + ward = ward?.map((row) => row?.code); + + // //adding formatted data to these keys + // if (locality.length > 0) data.body.inbox.moduleSearchCriteria.locality = locality; + if (states.length > 0) data.body.inbox.moduleSearchCriteria.status = states; + if (ward.length > 0) data.body.inbox.moduleSearchCriteria.ward = ward; + const projectType = _.clone(data.body.inbox.moduleSearchCriteria.projectType ? data.body.inbox.moduleSearchCriteria.projectType : {}); + if (projectType?.code) data.body.inbox.moduleSearchCriteria.projectType = projectType.code; + + //adding tenantId to moduleSearchCriteria + data.body.inbox.moduleSearchCriteria.tenantId = Digit.ULBService.getCurrentTenantId(); + + //setting limit and offset becoz somehow they are not getting set in muster inbox + data.body.inbox.limit = data.state.tableForm.limit; + data.body.inbox.offset = data.state.tableForm.offset; + delete data.state; + return data; + }, + postProcess: (responseArray, uiConfig) => { + const statusOptions = responseArray?.statusMap + ?.filter((item) => item.applicationstatus) + ?.map((item) => ({ code: item.applicationstatus, i18nKey: `COMMON_MASTERS_${item.applicationstatus}` })); + if (uiConfig?.type === "filter") { + let fieldConfig = uiConfig?.fields?.filter((item) => item.type === "dropdown" && item.populators.name === "musterRollStatus"); + if (fieldConfig.length) { + fieldConfig[0].populators.options = statusOptions; + } + } + }, + additionalCustomizations: (row, key, column, value, t, searchResult) => { + if (key === "ATM_MUSTER_ROLL_ID") { + return ( + + + {String(value ? (column.translate ? t(column.prefix ? `${column.prefix}${value}` : value) : value) : t("ES_COMMON_NA"))} + + + ); + } + if (key === "ATM_ATTENDANCE_WEEK") { + const week = `${Digit.DateUtils.ConvertTimestampToDate(value?.startDate, "dd/MM/yyyy")}-${Digit.DateUtils.ConvertTimestampToDate( + value?.endDate, + "dd/MM/yyyy" + )}`; + return
{week}
; + } + if (key === "ATM_NO_OF_INDIVIDUALS") { + return
{value?.length}
; + } + if (key === "ATM_AMOUNT_IN_RS") { + return {value ? Digit.Utils.dss.formatterWithoutRound(value, "number") : t("ES_COMMON_NA")}; + } + if (key === "ATM_SLA") { + return parseInt(value) > 0 ? ( + {t(value) || ""} + ) : ( + {t(value) || ""} + ); + } + if (key === "COMMON_WORKFLOW_STATES") { + return {t(`WF_MUSTOR_${value}`)}; + } + //added this in case we change the key and not updated here , it'll throw that nothing was returned from cell error if that case is not handled here. To prevent that error putting this default + return {t(`CASE_NOT_HANDLED`)}; + }, + MobileDetailsOnClick: (row, tenantId) => { + let link; + Object.keys(row).map((key) => { + if (key === "ATM_MUSTER_ROLL_ID") + link = `/${window.contextPath}/employee/attendencemgmt/view-attendance?tenantId=${tenantId}&musterRollNumber=${row[key]}`; + }); + return link; + }, + populateReqCriteria: () => { + const tenantId = Digit.ULBService.getCurrentTenantId(); + return { + url: "/org-services/organisation/v1/_search", + params: { limit: 50, offset: 0 }, + body: { + SearchCriteria: { + tenantId: tenantId, + functions: { + type: "CBO", + }, + }, + }, + config: { + enabled: true, + select: (data) => { + return data?.organisations; + }, + }, + }; + }, + }, + SearchWageSeekerConfig: { + customValidationCheck: (data) => { + //checking both to and from date are present + const { createdFrom, createdTo } = data; + if ((createdFrom === "" && createdTo !== "") || (createdFrom !== "" && createdTo === "")) + return { warning: true, label: "ES_COMMON_ENTER_DATE_RANGE" }; + + return false; + }, + preProcess: (data) => { + data.params = { ...data.params, tenantId: Digit.ULBService.getCurrentTenantId() }; + + let requestBody = { ...data.body.Individual }; + const pathConfig = { + name: "name.givenName", + }; + const dateConfig = { + createdFrom: "daystart", + createdTo: "dayend", + }; + const selectConfig = { + wardCode: "wardCode[0].code", + socialCategory: "socialCategory.code", + }; + const textConfig = ["name", "individualId"]; + let Individual = Object.keys(requestBody) + .map((key) => { + if (selectConfig[key]) { + requestBody[key] = _.get(requestBody, selectConfig[key], null); + } else if (typeof requestBody[key] == "object") { + requestBody[key] = requestBody[key]?.code; + } else if (textConfig?.includes(key)) { + requestBody[key] = requestBody[key]?.trim(); + } + return key; + }) + .filter((key) => requestBody[key]) + .reduce((acc, curr) => { + if (pathConfig[curr]) { + _.set(acc, pathConfig[curr], requestBody[curr]); + } else if (dateConfig[curr] && dateConfig[curr]?.includes("day")) { + _.set(acc, curr, Digit.Utils.date.convertDateToEpoch(requestBody[curr], dateConfig[curr])); + } else { + _.set(acc, curr, requestBody[curr]); + } + return acc; + }, {}); + + data.body.Individual = { ...Individual }; + return data; + }, + additionalCustomizations: (row, key, column, value, t, searchResult) => { + //here we can add multiple conditions + //like if a cell is link then we return link + //first we can identify which column it belongs to then we can return relevant result + switch (key) { + case "MASTERS_WAGESEEKER_ID": + return ( + + + {String(value ? (column.translate ? t(column.prefix ? `${column.prefix}${value}` : value) : value) : t("ES_COMMON_NA"))} + + + ); + + case "MASTERS_SOCIAL_CATEGORY": + return value ? {String(t(`MASTERS_${value}`))} : t("ES_COMMON_NA"); + + case "CORE_COMMON_PROFILE_CITY": + return value ? {String(t(Digit.Utils.locale.getCityLocale(value)))} : t("ES_COMMON_NA"); + + case "MASTERS_WARD": + return value ? ( + {String(t(Digit.Utils.locale.getMohallaLocale(value, row?.tenantId)))} + ) : ( + t("ES_COMMON_NA") + ); + + case "MASTERS_LOCALITY": + return value ? ( + {String(t(Digit.Utils.locale.getMohallaLocale(value, row?.tenantId)))} + ) : ( + t("ES_COMMON_NA") + ); + default: + return t("ES_COMMON_NA"); + } + }, + MobileDetailsOnClick: (row, tenantId) => { + let link; + Object.keys(row).map((key) => { + if (key === "MASTERS_WAGESEEKER_ID") + link = `/${window.contextPath}/employee/masters/view-wageseeker?tenantId=${tenantId}&wageseekerId=${row[key]}`; + }); + return link; + }, + additionalValidations: (type, data, keys) => { + if (type === "date") { + return data[keys.start] && data[keys.end] ? () => new Date(data[keys.start]).getTime() <= new Date(data[keys.end]).getTime() : true; + } + }, + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/complaintConfig.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/complaintConfig.js new file mode 100644 index 00000000000..28c85515205 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/complaintConfig.js @@ -0,0 +1,31 @@ +export const config = { + routes: { + "complaint-type": { + nextStep: "pincode", + }, + landmark: { + nextStep: "apartment", + }, + apartment: { + component: "SelectName", + texts: { + header: "Apartment or Society", + cardText: "CS_COMPLAINT_SUBTYPE_TEXT", + submitBarLabel: "PT_COMMONS_NEXT", + }, + inputs: [ + { + label: "Apartment", + type: "text", + name: "custom.additionalDetails.apartment", + validation: { + minLength: 6, + maxLength: 7, + }, + error: "CORE_COMMON_PINCODE_INVALID", + }, + ], + nextStep: "upload-photos", + }, + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/components/SelectName.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/components/SelectName.js new file mode 100644 index 00000000000..56d2a195c12 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/components/SelectName.js @@ -0,0 +1,8 @@ +import React from "react"; +import { FormStep } from "@egovernments/digit-ui-react-components"; + +const SelectName = ({ config, onSelect, onSkip, t }) => { + return ; +}; + +export default SelectName; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/fsm.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/fsm.js new file mode 100644 index 00000000000..271d3ddad56 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/fsm.js @@ -0,0 +1,38 @@ +const fsmCustomizations = { + getEmployeeApplicationCustomization: (config, t) => { + const employeeConfig = [ + { + name: "applicationDetails", + // fields: ["sanitationType", "applicationChannel"], + // fieldsOrder: {sanitationType: 0, applicationChannel: 1}, // TODO + allFields: true, // for example: If in applicationDetails you have 10 fields and in fieldsOrder you only enter 3 fields name then on browser you will only see 3 fields in that order but if you want to see rest of 7 fields at the bottom. + // removeFields: ["applicantName"], // type the name of the field in camelCase to remove it + addFields: [ + // by default all the custom fields will add at the bottom, you can add "field name" to "fieldsOrder" if you want them in your custom order. + { + name: "example", + label: t("EXAMPLE"), + type: "text", + isMandatory: true, + populators: { + name: "example", + validation: { + required: true, + pattern: /[A-Za-z]/, + }, + }, + }, + ], + }, + ]; + + return { + config: employeeConfig, + defaultConfig: true, // You want to use defaultConfig and you only want to update one field section. The above employeeConfig is also an order for all the field section. So if defaultConfig is false then on browser you will only see those field section who are inside employeeConfig + }; + }, +}; + +const fsmComponents = {}; + +export { fsmCustomizations, fsmComponents }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/index.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/index.js new file mode 100644 index 00000000000..e2946604fc0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/index.js @@ -0,0 +1,84 @@ +import React from "react"; +import ReactDOM from "react-dom"; + +import { initLibraries } from "@egovernments/digit-ui-libraries"; +// import { paymentConfigs, PaymentLinks, PaymentModule } from "@egovernments/digit-ui-module-common"; +import { DigitUI } from "@egovernments/digit-ui-module-core"; +import { initDSSComponents } from "@egovernments/digit-ui-module-dss"; +import { initEngagementComponents } from "@egovernments/digit-ui-module-engagement"; +import { initHRMSComponents } from "@egovernments/digit-ui-module-hrms"; +// import { initUtilitiesComponents } from "@egovernments/digit-ui-module-utilities"; +import {initWorkbenchComponents} from "@egovernments/digit-ui-module-workbench"; + +import "@egovernments/digit-ui-css/example/index.css"; + +import { pgrCustomizations } from "./pgr"; +import { UICustomizations } from "./UICustomizations"; + +var Digit = window.Digit || {}; + +const enabledModules = [ "DSS", "HRMS", +"Workbench" +// "Engagement", "NDSS","QuickPayLinks", "Payment", + // "Utilities", +//added to check fsm +// "FSM" +]; + +const initTokens = (stateCode) => { + const userType = window.sessionStorage.getItem("userType") || process.env.REACT_APP_USER_TYPE || "CITIZEN"; + const token = window.localStorage.getItem("token") || process.env[`REACT_APP_${userType}_TOKEN`]; + + const citizenInfo = window.localStorage.getItem("Citizen.user-info"); + + const citizenTenantId = window.localStorage.getItem("Citizen.tenant-id") || stateCode; + + const employeeInfo = window.localStorage.getItem("Employee.user-info"); + const employeeTenantId = window.localStorage.getItem("Employee.tenant-id"); + + const userTypeInfo = userType === "CITIZEN" || userType === "QACT" ? "citizen" : "employee"; + window.Digit.SessionStorage.set("user_type", userTypeInfo); + window.Digit.SessionStorage.set("userType", userTypeInfo); + + if (userType !== "CITIZEN") { + window.Digit.SessionStorage.set("User", { access_token: token, info: userType !== "CITIZEN" ? JSON.parse(employeeInfo) : citizenInfo }); + } else { + // if (!window.Digit.SessionStorage.get("User")?.extraRoleInfo) window.Digit.SessionStorage.set("User", { access_token: token, info: citizenInfo }); + } + + window.Digit.SessionStorage.set("Citizen.tenantId", citizenTenantId); + + if (employeeTenantId && employeeTenantId.length) window.Digit.SessionStorage.set("Employee.tenantId", employeeTenantId); +}; + +const initDigitUI = () => { + window.contextPath = window?.globalConfigs?.getConfig("CONTEXT_PATH") || "digit-ui"; + window.Digit.Customizations = { + PGR: pgrCustomizations, + commonUiConfig: UICustomizations + }; + window?.Digit.ComponentRegistryService.setupRegistry({ + // PaymentModule, + // ...paymentConfigs, + // PaymentLinks, + }); + + initDSSComponents(); + initHRMSComponents(); + initEngagementComponents(); + // initUtilitiesComponents(); + initWorkbenchComponents(); + + + const moduleReducers = (initData) => initData; + + + const stateCode = window?.globalConfigs?.getConfig("STATE_LEVEL_TENANT_ID") || "pb"; + initTokens(stateCode); + + ReactDOM.render(, document.getElementById("root")); +}; + +initLibraries().then(() => { + initDigitUI(); +}); diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/pgr.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/pgr.js new file mode 100644 index 00000000000..48a498e4582 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/pgr.js @@ -0,0 +1,15 @@ +import SelectName from "./components/SelectName"; + +// import { config as complaintConfig } from "./complaintConfig"; + +const pgrCustomizations = { + // complaintConfig, + getComplaintDetailsTableRows: ({ id, service, role, t }) => { + return {}; + }, +}; + +const pgrComponents = { + SelectName: SelectName, +}; +export { pgrCustomizations, pgrComponents }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/example/src/setupProxy.js b/frontend/workbench-ui/web/micro-ui-internals/example/src/setupProxy.js new file mode 100644 index 00000000000..cf3a6f7c26c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/example/src/setupProxy.js @@ -0,0 +1,87 @@ +const { createProxyMiddleware } = require("http-proxy-middleware"); + +const createProxy = createProxyMiddleware({ + //target: process.env.REACT_APP_PROXY_API || "https://uat.digit.org", + // target: process.env.REACT_APP_PROXY_API || "https://qa.digit.org", + target: process.env.REACT_APP_PROXY_API || "https://works-dev.digit.org", + changeOrigin: true, + secure:false +}); +const assetsProxy = createProxyMiddleware({ + target: process.env.REACT_APP_PROXY_ASSETS || "https://works-dev.digit.org", + changeOrigin: true, + secure:false +}); +const mdmsProxy = createProxyMiddleware({ + target: process.env.REACT_APP_PROXY_ASSETS || "http://localhost:8080", + changeOrigin: true, + secure:false +}); +module.exports = function (app) { + ["/mdms-v2/v2/_create"].forEach((location) => app.use(location, mdmsProxy)); + [ + "/access/v1/actions/mdms", + "/egov-mdms-service", + "/mdms-v2", + "/egov-idgen", + "/egov-location", + "/localization", + "/egov-workflow-v2", + "/pgr-services", + "/filestore", + "/egov-hrms", + "/user-otp", + "/user", + "/fsm", + "/billing-service", + "/collection-services", + "/pdf-service", + "/pg-service", + "/vehicle", + "/vendor", + "/property-services", + "/fsm-calculator/v1/billingSlab/_search", + "/pt-calculator-v2", + "/dashboard-analytics", + "/echallan-services", + "/egov-searcher/bill-genie/mcollectbills/_get", + "/egov-searcher/bill-genie/billswithaddranduser/_get", + "/egov-searcher/bill-genie/waterbills/_get", + "/egov-searcher/bill-genie/seweragebills/_get", + "/egov-pdf/download/UC/mcollect-challan", + "/egov-hrms/employees/_count", + "/tl-services/v1/_create", + "/tl-services/v1/_search", + "/egov-url-shortening/shortener", + "/inbox/v1/_search", + "/inbox/v2/_search", + "/tl-services", + "/tl-calculator", + "/org-services", + "/edcr", + "/bpa-services", + "/noc-services", + "/egov-user-event", + "/egov-document-uploader", + "/egov-pdf", + "/egov-survey-services", + "/ws-services", + "/sw-services", + "/ws-calculator", + "/sw-calculator/", + "/egov-searcher", + "/report", + "/inbox/v1/dss/_search", + "/loi-service", + "/project/v1/", + "/estimate-service", + "/loi-service", + "/works-inbox-service/v2/_search", + "/egov-pdf/download/WORKSESTIMATE/estimatepdf", + "/muster-roll", + "/individual", + "/mdms-v2" + ].forEach((location) => app.use(location, createProxy)); + ["/pb-egov-assets"].forEach((location) => app.use(location, assetsProxy)); + ["/mdms-v2/v2/_create"].forEach((location) => app.use(location, mdmsProxy)); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/package.json b/frontend/workbench-ui/web/micro-ui-internals/package.json new file mode 100644 index 00000000000..4a4412cedfd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/package.json @@ -0,0 +1,74 @@ +{ + "name": "egovernments", + "version": "1.0.0", + "main": "index.js", + "workspaces": [ + "packages/libraries", + "example", + "packages/css", + "packages/react-components", + "packages/modules/*" + ], + "author": "JaganKumar ", + "license": "MIT", + "private": true, + "engines": { + "node": ">=14" + }, + "scripts": { + "start": "run-s build start:dev", + "sprint": "run-s start:script", + "start:dev": "run-p dev:**", + "start:script": "./scripts/create.sh", + "dev:css": "cd packages/css && yarn start", + "publish:css": "cd packages/css && yarn publish --access public", + "dev:libraries": "cd packages/libraries && yarn start", + "dev:components": "cd packages/react-components && yarn start", + "dev:example": "cd example && yarn start", + "dev:core": "cd packages/modules/core && yarn start", + "dev:dss": "cd packages/modules/dss && yarn start", + "dev:hrms": "cd packages/modules/hrms && yarn start", + "devD:common": "cd packages/modules/common && yarn start", + "devD:utilities": "cd packages/modules/utilities && yarn start", + "dev:workbench": "cd packages/modules/workbench && yarn start", + "dev:engagement": "cd packages/modules/engagement && yarn start", + "build": "run-p build:**", + "build:libraries": "cd packages/libraries && yarn build", + "build:components": "cd packages/react-components && yarn build", + "build:svgcomponents": "cd packages/svg-components && yarn build", + "build:dss": "cd packages/modules/dss && yarn build", + "build:core": "cd packages/modules/core && yarn build", + "build:hrms": "cd packages/modules/hrms && yarn build", + "build:common": "cd packages/modules/common && yarn build", + "build:utilities": "cd packages/modules/utilities && yarn build", + "build:engagement": "cd packages/modules/engagement && yarn build", + "build:workbench": "cd packages/modules/workbench && yarn build", + "deploy:jenkins": "./scripts/jenkins.sh", + "clean": "rm -rf node_modules" + }, + "resolutions": { + "**/@babel/runtime": "7.20.1", + "**/babel-preset-react-app": "10.0.0" + }, + "devDependencies": { + "husky": "7.0.4", + "lint-staged": "12.3.7", + "npm-run-all": "4.1.5", + "prettier": "2.1.2" + }, + "husky": {}, + "lint-staged": { + "*.{js,css,md}": "prettier --write" + }, + "dependencies": { + "lodash": "4.17.21", + "microbundle-crl": "0.13.11", + "@egovernments/digit-ui-react-components": "1.8.0-beta.1", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-hook-form": "6.15.8", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "react-router-dom": "5.3.0" + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/config/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/config/index.js new file mode 100644 index 00000000000..87090e08d09 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/config/index.js @@ -0,0 +1,3 @@ +module.exports = { + PORT: "3000", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/config/package.json b/frontend/workbench-ui/web/micro-ui-internals/packages/config/package.json new file mode 100644 index 00000000000..bb380df1243 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/config/package.json @@ -0,0 +1,6 @@ +{ + "name": "@egovernments/digit-ui-config", + "version": "1.0.1", + "main": "index.js", + "license": "MIT" +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/README.md b/frontend/workbench-ui/web/micro-ui-internals/packages/css/README.md new file mode 100644 index 00000000000..3749ccd49c4 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/README.md @@ -0,0 +1,78 @@ + + +# digit-ui-css + +## Install + +```bash +npm install --save @egovernments/digit-ui-css +``` + +## Limitation + +```bash +This Package is more specific to DIGIT-UI's can be used across mission's +It is the base css for all Digit UI's +``` + +## Usage + +After adding the dependency make sure you have this dependency in + +```bash +frontend/micro-ui/web/package.json +``` + +```json +"@egovernments/digit-ui-css":"^1.5.0", +``` + +then navigate to App.js + +```bash +frontend/micro-ui/web/public/index.html +``` + +```jsx +/** add this import **/ + + + +``` +# Changelog + +```bash +1.8.0-beta.13 fixed the login text styling issue +1.8.0-beta.1 styles for login dropdown and homepage dropdowns +1.8.0-beta added workbench related css and some new Digit v2 constants based on em +1.7.0 urban 2.9 +1.6.0 urban 2.8 +1.5.41 added styles for login dropdown and homepage dropdowns +1.5.40 aligment issue in edit and logout +1.5.39 updated login scss and alignment issues +1.5.37 updated the readme content +1.5.36 enhanced the formcomposer with header attribute +1.5.35 Fixed the card css issues +1.5.34 Fixed breadcrumb styling issue +1.5.33 fixed some card related css issues due to v2 css +1.5.32 newer css DIGITv2 added and corrected few existing issues +1.5.31 Corrected the CSS for inbox composers and default core ui +1.5.30 Updated the css for dynamic drodown filter dss +1.5.29 layout issues fixed +1.5.28 Horizontal Bar chart alignment fixes +1.5.27 DSS UI alignment fixes for Horizontal Metric and bar chart +1.5.26 added new css class for dss enhancements +1.5.25 added the css of inbox search composers +1.5.24 added the readme file +1.5.23 base version +``` +# Contributors + +[jagankumar-egov] [nipunarora-eGov] [Tulika-eGov] [Ramkrishna-egov] [nabeelmd-eGov] [anil-egov] [vamshikrishnakole-wtt-egov] + +## Published from DIGIT Core +Digit Core Repo (https://github.com/egovernments/Digit-Core/tree/digit-ui-core) + +## License + +MIT © [jagankumar-egov](https://github.com/jagankumar-egov) \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/gulpfile.js b/frontend/workbench-ui/web/micro-ui-internals/packages/css/gulpfile.js new file mode 100644 index 00000000000..74bc884bf13 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/gulpfile.js @@ -0,0 +1,70 @@ +const fs = require("fs"); +const { name, version, author, cssConfig } = JSON.parse(fs.readFileSync("package.json")); + +const headerString = ` +@charset "UTF-8"; +/*! + * ${name} - ${version} + * + * Copyright (c) ${new Date().getFullYear()} ${author} + * + */ + `; +const { series, src, dest, watch, task } = require("gulp"); +const header = require("postcss-header"); + +const clean = require("gulp-clean"); +const postcss = require("gulp-postcss"); +const sass = require("gulp-sass"); +const postcssPresetEnv = require("postcss-preset-env"); +const cleanCSS = require("gulp-clean-css"); +const rename = require("gulp-rename"); +const livereload = require("gulp-livereload"); + +let output = "./example"; +if (process.env.NODE_ENV === "production") { + output = "./dist"; +} + +function cleanStyles() { + return src(`${output}/*.css`, { read: false }).pipe(clean()); +} + +function styles() { + const plugins = [ + require("postcss-import"), + require("tailwindcss"), + postcssPresetEnv({ stage: 2, autoprefixer: { cascade: false }, features: { "custom-properties": true } }), + require("autoprefixer"), + require("cssnano"), + header({ header: headerString }), + ]; + return src("src/index.scss").pipe(postcss(plugins)).pipe(sass()).pipe(dest(output)); +} + +function minify() { + return src(`${output}/index.css`).pipe(cleanCSS()).pipe(rename(`index.min.css`)).pipe(dest(output)); +} + +function stylesLive() { + styles().pipe(livereload({ start: true })); +} + +function livereloadStyles() { + livereload.listen(); + watch("src/**/*.scss", series(stylesLive)); +} + +exports.styles = styles; +exports.default = series(styles); +exports.watch = livereloadStyles; +if (process.env.NODE_ENV === "production") { + exports.build = series(cleanStyles, styles, minify); +} else { + exports.build = series(styles, livereloadStyles); +} + +// gulp.task("watch:styles", function () { +// livereload.listen(); +// gulp.watch("**/*.scss", ["styles"]); +// }); diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/browser-icon.png b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/browser-icon.png new file mode 100644 index 00000000000..32e2488b00e Binary files /dev/null and b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/browser-icon.png differ diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/m_seva_white_logo.png b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/m_seva_white_logo.png new file mode 100644 index 00000000000..394e483de3a Binary files /dev/null and b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/m_seva_white_logo.png differ diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/mseva-demo.png b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/mseva-demo.png new file mode 100644 index 00000000000..50a52517263 Binary files /dev/null and b/frontend/workbench-ui/web/micro-ui-internals/packages/css/img/mseva-demo.png differ diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/package.json b/frontend/workbench-ui/web/micro-ui-internals/packages/css/package.json new file mode 100644 index 00000000000..d9cbc9c9ebc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/package.json @@ -0,0 +1,65 @@ +{ + "name": "@egovernments/digit-ui-css", + "version": "1.8.0-beta.13", + "license": "MIT", + "main": "dist/index.css", + "author": "Jagankumar ", + "engines": { + "node": ">=14" + }, + "cssConfig": { + "prefix": "" + }, + "scripts": { + "start": "gulp build", + "build:prod": "NODE_ENV=production gulp build", + "prepublish": "yarn build:prod", + "deploy": "gulp && cp -R svg example && cp -R img example && gh-pages -d example" + }, + "browserslist": [ + "> 3%", + "last 2 versions" + ], + "style": "./dist/index.css", + "dependencies": { + "node-sass": "^4.14.1", + "normalize.css": "^8.0.1", + "postcss-scss": "^3.0.1", + "tailwindcss": "^1.8.10" + }, + "devDependencies": { + "autoprefixer": "^10.0.0", + "cssnano": "^4.1.10", + "gh-pages": "^3.1.0", + "gulp": "^4.0.2", + "gulp-clean": "^0.4.0", + "gulp-clean-css": "^4.3.0", + "gulp-livereload": "^4.0.2", + "gulp-postcss": "^9.0.0", + "gulp-rename": "^2.0.0", + "gulp-sass": "^4.1.0", + "postcss": "^8.0.9", + "postcss-cli": "^8.0.0", + "postcss-header": "^2.0.0", + "postcss-import": "^12.0.1", + "postcss-prefixer": "^2.1.2", + "postcss-preset-env": "^6.7.0", + "postcss-scss": "^3.0.1", + "sass": "^1.26.11" + }, + "files": [ + "dist/index.min.css", + "dist/index.css", + "svg/**/*.svg", + "img/**/*.png", + "src/**/*.scss", + "src/**/*.css" + ], + "keywords": [ + "digit", + "egov", + "dpg", + "digit-ui", + "css" + ] +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/postcss.config.js b/frontend/workbench-ui/web/micro-ui-internals/packages/css/postcss.config.js new file mode 100644 index 00000000000..18485de221e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/postcss.config.js @@ -0,0 +1,55 @@ +const postcssPresetEnv = require("postcss-preset-env"); + +module.exports = { + parser: require("postcss-scss"), + plugins: [ + require("postcss-import"), + require("postcss-nested").default, + require("tailwindcss"), + require("postcss-preset-env"), + require("autoprefixer"), + // require("cssnano"), + ], +}; + +// const fs = require('fs'); +// const { name, version, author, cssConfig } = JSON.parse(fs.readFileSync('package.json')); + +// const header = ` +// @charset "UTF-8"; +// /*! +// * ${name} - ${version} +// * +// * Copyright (c) ${new Date().getFullYear()} ${author.name} +// */ +// `; + +// module.exports = (ctx) => { +// const prefix = ctx.env === 'compat' ? '' : cssConfig.prefix; +// const devMessage = `🎉🎉🎉🎉 \n${name} ${ctx.env} build was compiled sucessfully! \n`; + + +// return { +// map: ctx.options.map, +// parser: ctx.options.parser, +// plugins: { +// 'postcss-import': { root: ctx.file.dirname }, +// 'postcss-prefixer': { +// prefix, +// ignore: [/\[class\*=.*\]/], +// }, +// 'postcss-preset-env': { +// autoprefixer: { +// cascade: false, +// }, +// features: { +// 'custom-properties': true, +// }, +// }, +// cssnano: ctx.env === 'production' || ctx.env === 'compat' ? {} : false, +// 'postcss-header': { +// header, +// }, +// }, +// }; +// }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss new file mode 100644 index 00000000000..f2607b04638 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss @@ -0,0 +1,46 @@ +.CardBasedOptions { + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16); + @apply bg-white mb-md px-sm py-md mx-sm rounded w-full; + .headContent { + @apply flex justify-between mb-lg; + h2 { + @apply text-heading-s font-bold text-text-primary; + } + p { + @apply text-link text-primary-main font-medium cursor-pointer; + } + } + + .mainContent { + @apply flex justify-evenly; + .CardBasedOptionsMainChildOption { + width: 25%; + @apply text-center; + .ChildOptionImageWrapper { + margin: auto !important; + background: rgba(244, 119, 56, 0.12); + mix-blend-mode: normal; + padding-top: 14px; + @apply h-12 w-12 rounded-full cursor-pointer; + svg { + height: 20px; + width: 20px; + fill: theme(colors.primary.main); + margin: auto; + } + } + .ChildOptionName { + font-size: 12px; + line-height: 14px; + padding-top: 1rem; + } + } + } +} + +@screen dt { + .CardBasedOptions { + width: calc(50% - 16px); + @apply p-md; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss new file mode 100644 index 00000000000..45df9551f19 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss @@ -0,0 +1,56 @@ +.CitizenHomeCard { + @apply bg-white mx-md p-md mb-lg; + + .header { + @apply flex font-bold text-heading-l text-text-primary justify-between pb-sm; + + svg { + width: 33px; + height: 33px; + } + } + + .links { + @apply text-heading-s text-primary-main; + + a { + @apply block pb-sm; + } + } +} + +@screen dt { + .citizenAllServiceGrid { + display: flex; + flex-direction: column; + justify-content: center; + flex: 1; + } + + .CitizenHomeCard { + @apply p-lg; + .header { + @apply pb-lg text-heading-l-dt; + svg { + @apply w-12 h-12; + } + } + + .links { + @apply grid grid-cols-4 gap-px; + .linksWrapper { + height: 25px; + margin-bottom: 0.5em; + } + a { + @apply pb-md; + padding-left: 0.2em; + margin-bottom: 16px; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + min-width: 0; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EllipsisMenu.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EllipsisMenu.scss new file mode 100644 index 00000000000..0eb243a266d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EllipsisMenu.scss @@ -0,0 +1,17 @@ +.ellipsis-menu-wrap{ + @apply relative; + + .menu{ + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + @apply absolute right-0 bg-white z-30; + .item{ + @apply flex items-center justify-between p-sm; + &:hover{ + @apply bg-grey-mid cursor-pointer; + } + svg { + margin-right: 10px; + } + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EventCalendarView.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EventCalendarView.scss new file mode 100644 index 00000000000..58e6d3f8a56 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/EventCalendarView.scss @@ -0,0 +1,10 @@ +.EventCalendarView{ + .MonthViewInEventCalendar{ + @apply bg-primary-main text-legend text-white font-medium text-center py-sm; + } + + .DateViewInEventCalendar{ + @apply bg-grey-mid text-heading-l font-bold text-primary-main text-center py-md; + } + +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/FAQ.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/FAQ.scss new file mode 100644 index 00000000000..48b65688f56 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/FAQ.scss @@ -0,0 +1,64 @@ +.searchInputFAQs { + @apply mr-lg; + margin-bottom: 10px; + input{ + margin-bottom: 0; + background: border-box; + @apply pr-xl; + } + } + +.faq-page{ + width: 92%; + margin: 16px; +} + +.faqs{ + cursor: pointer; + .faq-question{ + font-weight: 400; + margin: 16px; + background: #fff; + justify-content: space-between; + display: flex; + font-size: 16px; + } + + .faqicon{ + float: right; + } + + .faq-answer{ + background: #fff; + overflow: hidden; + margin: 5px; + @apply text-form-field text-text-secondary mb-sm; + + span { + display: block; + font-size: 14px; + font-weight: 400; + margin: 0px 12px 5px + } + } + .cs-box-border { + height: 1px; + position: relative; + border-bottom: 1px solid lightgray;; + background: lightgray; + margin-left: 16px; + margin-right: 16px; + } +} + +.faq-list{ + background: #fff; + margin: 5px 0; + padding-top: 4px; + padding-bottom: 4px; +} + +.rotate { + transform: rotate(90deg); +} + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/OnGroundEventCard.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/OnGroundEventCard.scss new file mode 100644 index 00000000000..13468a645cc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/OnGroundEventCard.scss @@ -0,0 +1,72 @@ +.OnGroundEventCard{ + box-shadow: 0px 1px 2px 0px #00000029; + @apply bg-white mx-sm mb-md p-md cursor-pointer; + + .EventCalendarView{ + width: 100px; + @apply inline-block mr-md; + } + + .EventDetails{ + width: calc( 100% - 116px ); + @apply inline-block align-top; + + h2{ + @apply text-caption-m font-bold mb-md text-text-primary; + } + + .EventLocation{ + @apply flex mb-md; + svg{ + @apply h-4 w-4; + } + p{ + @apply text-body-s text-text-primary ml-sm; + } + } + + .EventTime{ + @apply flex ; + svg{ + @apply h-4 w-4; + } + p{ + @apply text-body-s text-text-primary ml-sm; + } + } + + .EventCategory{ + p{ + @apply text-body-s text-text-primary ; + } + } + + } + + +} + +@screen dt{ + .OnGroundEventCard{ + .EventDetails{ + .EventLocation{ + p{ + @apply text-body-s-dt; + } + } + + .EventTime{ + p{ + @apply text-body-s-dt; + } + } + + .EventCategory{ + p{ + @apply text-body-s-dt; + } + } + + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PageBasedInput.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PageBasedInput.scss new file mode 100644 index 00000000000..b2ba959698a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PageBasedInput.scss @@ -0,0 +1,29 @@ +.PageBasedInputWrapper { + .SubmitBar { + z-index: 60; + @apply p-sm fixed w-full bottom-0 left-0 text-right bg-white; + } + .SubmitBarInCardInDesktopView { + @apply hidden; + } + label { + margin-left: 0 !important; + } +} + +@screen dt { + .PageBasedInputWrapper { + .SubmitBar { + @apply hidden; + } + .SubmitBarInCardInDesktopView { + @apply block; + } + .card { + max-width: 960px; + } + button { + max-width: 240px; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PopupHeadingLabel.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PopupHeadingLabel.scss new file mode 100644 index 00000000000..c8e80a5ed18 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PopupHeadingLabel.scss @@ -0,0 +1,15 @@ +.popupModalHeading{ + @apply flex gap-3 mb-lg; + .headingIconAndLabel{ + @apply flex gap-3 items-center; + svg{ + @apply w-6 h-4; + } + h3{ + @apply text-heading-l font-bold; + } + } + .popupResetFormButton{ + @apply p-sm border border-solid border-text-primary border-opacity-25 self-center; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PropertySearchForm.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PropertySearchForm.scss new file mode 100644 index 00000000000..47f1f00cd7c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/PropertySearchForm.scss @@ -0,0 +1,58 @@ +.PropertySearchForm { + .pt-search-action { + @apply w-full; + display: flex; + margin-right: 10px; + justify-content: end; + align-items: center; + .pt-search-action-submit button { + width: 100% !important; + } + .pt-search-action-reset { + text-align: right; + cursor: pointer; + } + } + + .PropertySearchFormSwitcher{ + border-bottom: 1px solid theme(colors.border); + cursor: pointer; + margin-bottom: 20px; + display: flex; + .non-selected { + color: theme(colors.text.secondary); + font-weight: 400; + } + .selected { + color: theme(colors.primary.main); + font-weight: 700; + padding-bottom: 10px; + border-bottom: 2px solid theme(colors.primary.main); + } + span { + margin-right: 20px; + } + } + + + .form-field { + width: 30% !important; + margin-bottom: 20px; + } + @media (min-width: 780px) { + .pt-form-field{ + width: 30% !important; + margin-bottom: 20px; + } + } + @media (max-width: 780px) { + .form-field{ + width: 100% !important; + margin-bottom: 15px; + } + .pt-form-field{ + width: 100% !important; + margin-bottom: 15px; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchForm.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchForm.scss new file mode 100644 index 00000000000..41f3b212648 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchForm.scss @@ -0,0 +1,56 @@ +.search-form-wrapper{ + @apply flex flex-wrap justify-between bg-white mb-lg py-lg pl-lg; + .form-field{ + width: calc( 25% - 16px ); + @apply inline-block mr-md align-middle; + } + .SubmitAndClearAllContainer{ + @apply w-full; + .submit{ + right: 36px; + margin-top: 22px; + margin-left: -16px !important; + @apply flex flex-row-reverse items-center w-full align-middle text-center !important; + button{ + margin: 0; + @apply inline-block w-1/4 !important; + } + p{ + @apply cursor-pointer text-link text-focus w-1/4 inline-block ; + } + } + } + .submit{ + right: 36px; + margin-top: 22px; + @apply inline align-middle text-center !important; + button{ + margin: 0; + @apply inline-block w-full !important; + } + p{ + @apply cursor-pointer text-link text-focus w-full inline-block ; + } + } + .pt-property-search{ + justify-content: unset; + } + +} + +@media (min-width: 780px) { + .search-form-wrapper{ + .pt-form-field{ + width: 30% !important; + margin-bottom: 20px; + } + } + } + @media (max-width: 780px) { + .search-form-wrapper{ + .pt-form-field{ + width: 100% !important; + margin-bottom: 15px; + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchOnRadioButton.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchOnRadioButton.scss new file mode 100644 index 00000000000..1f9e2e597aa --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/SearchOnRadioButton.scss @@ -0,0 +1,10 @@ +.SearchOnRadioButton{ + svg{ + fill: theme(colors.text.secondary); + width: 24px; + height: 24px; + top: 8px; + right: 8px; + @apply absolute; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/StandaloneSearchBar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/StandaloneSearchBar.scss new file mode 100644 index 00000000000..69dd018a42d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/StandaloneSearchBar.scss @@ -0,0 +1,10 @@ +.StandaloneSearchBar{ + @apply bg-white flex rounded-3xl px-md py-sm w-full; + svg{ + fill: theme(colors.text.secondary); + @apply mr-md; + } + input{ + @apply w-full mr-md outline-none; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/TimeLine.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/TimeLine.scss new file mode 100644 index 00000000000..8547f22f5cf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/TimeLine.scss @@ -0,0 +1,68 @@ +.timeline-container { + @apply flex; + margin: 0px 8px 15px; + .timeline-checkpoint { + @apply relative flex-1; + z-index: 1; + } + + .timeline-content { + @apply flex flex-col items-center; + + span { + text-align: center; + color: white; + } + + .secondary-color { + color: theme(colors.text.primary); + padding: 5px; + font-size: small; + } + } + + .line { + @apply absolute; + top: 12px; + left: calc(50% + 8px); + right: calc(-50% + 8px); + border-top: 4px solid theme(colors.border); + z-index: -1; + } + + .circle { + width: 24px; + height: 24px; + background-color: #B1B4B6; + border-radius: 50%; + text-align: center; + } + + .active { + background-color: theme(colors.primary.main); + border-color: theme(colors.primary.main); + } +} + +.TLComments{ + max-width: 360px; + @apply mb-sm p-sm bg-grey-light; + h3{ + @apply font-bold text-caption-m; + } + p{ + @apply text-body-l; + } +} + +@screen dt{ + .TLComments{ + width: 360px; + h3{ + @apply text-caption-m-dt; + } + p{ + @apply text-body-l-dt; + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/WhatsNewCard.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/WhatsNewCard.scss new file mode 100644 index 00000000000..395b2fc4401 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/WhatsNewCard.scss @@ -0,0 +1,13 @@ +.WhatsNewCard{ + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16); + @apply rounded bg-white border-primary-main border-l-4 border-solid p-sm; + h2{ + @apply text-body-l text-text-primary font-medium mb-xs; + } + p{ + @apply text-form-field text-text-secondary mb-sm; + } + a{ + @apply block text-form-field text-primary-main mb-sm + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionLink.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionLink.scss new file mode 100644 index 00000000000..46a1f449ae1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionLink.scss @@ -0,0 +1,3 @@ +.action-link { + @apply text-primary-main text-text-btn mr-lg !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionbar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionbar.scss new file mode 100644 index 00000000000..18c905c20d2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/actionbar.scss @@ -0,0 +1,97 @@ +.action-bar-wrap { + box-shadow: rgba(0, 0, 0, 0.16) 0 -2px 8px; + max-width: 480px; + z-index: 100; + + @apply left-0 bottom-0 w-full bg-white py-sm px-sm fixed text-right; + + div { + @apply w-full; + } + .menu-wrap { + @apply absolute bg-white text-left mb-xs z-30 cursor-pointer; + bottom: 45px; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + width: calc(100% - 16px); + right: 8px; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + + &:hover { + @apply bg-grey-mid w-full; + } + } + } +} + +@screen dt { + .action-bar-wrap { + box-shadow: rgba(0, 0, 0, 0.16) 0 -2px 8px; + left: 0; + max-width: none; + z-index: 999; + + @apply fixed bottom-0 bg-white py-sm pr-lg text-right; + + div { + width: calc(100% - 16px); + } + + .menu-wrap { + bottom: 45px; + top: unset; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + @apply absolute h-auto bg-white text-left mb-xs z-30; + width: 240px; + right: 24px; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + + &:hover { + @apply bg-grey-mid w-full; + } + } + } + } +} + +.action-bar-wrap-registry { + + div { + @apply w-full; + } + .menu-wrap { + @apply absolute bg-white text-left mb-xs z-30 cursor-pointer; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + width: 160px; + right: 60px; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + + &:hover { + @apply bg-grey-mid w-full; + } + } + } + + .search-add { + padding: 12px 16px; + color: rgb(244, 119, 56); + display: flex; + cursor: pointer; + } + + .search-add-icon { + background: rgb(244, 119, 56); + border-radius: 50%; + height: 24px; + width: 24px; + display: flex; + justify-content: center; + align-items: center; + margin-left: 10px; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss new file mode 100644 index 00000000000..0433dc0c320 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss @@ -0,0 +1,136 @@ +.success-wrap, +.emp-success-wrap { + @apply block bg-success w-full text-center text-white pt-md pb-sm mb-md; + + header { + @apply block mb-sm font-rc font-bold text-heading-xl; + } + + div { + img { + padding: 13.67px; + margin-left: auto; + margin-right: auto; + @apply border border-solid border-white rounded-full h-16 w-16 bg-white mb-md; + } + + svg { + padding: 13.67px; + margin-left: auto; + margin-right: auto; + @apply border border-solid border-white rounded-full h-16 w-16 bg-white mb-md; + } + + svg.payment-svg { + border: unset; + background-color: unset; + @apply rounded-full; + } + + h2 { + @apply font-bold text-caption-m mb-sm; + } + + p { + @apply font-bold text-caption-l; + } + } +} + +.error-wrap, +.emp-error-wrap { + @apply block bg-error w-full text-center text-white pt-md pb-sm mb-md; + + header { + @apply block mb-sm font-rc font-bold text-heading-xl; + } + + img { + margin-left: auto; + margin-right: auto; + padding: 13.67px; + @apply border border-solid border-white rounded-full bg-white h-16 w-16 mb-md; + } + + svg { + margin-left: auto; + margin-right: auto; + padding: 13.67px; + @apply border border-solid border-white rounded-full bg-white h-16 w-16 mb-md; + } +} + +@screen dt { + .success-wrap { + header { + @apply text-heading-xl-dt; + } + } + .emp-success-wrap { + width: calc(100%); + header { + @apply text-heading-xl-dt; + } + } + + .error-wrap { + width: 100%; + header { + @apply text-heading-xl-dt; + } + } + + .emp-error-wrap { + width: calc(100%); + header { + @apply text-heading-xl-dt; + } + } +} + +.photos-wrap { + max-width: 640px; + @apply flex pt-md; + + img { + width: calc(33% - 9.333px); + margin-right: 14px; + } + + svg { + width: calc(33% - 9.333px); + margin-right: 14px; + } + + .last { + width: calc(33% - 9.333px); + } +} + +.banner { + @apply flex justify-center items-center; + height: calc(100vh - 80px); + background: linear-gradient(rgba(11, 75, 102, 0.8), rgba(11, 75, 102, 0.8)), var(--banner-url) center center; + + .bannerCard { + min-width: 400px; + } + .bannerLogo { + width: 80px; + height: 40px; + object-fit: contain; + padding-right: 10px; + margin-right: 10px; + border-right: 1px solid theme(colors.text.primary); + } + .bannerHeader { + @apply flex justify-center items-center; + margin-bottom: 24px; + } +} + +.banner-container { + flex-direction: column; + justify-content: center; + align-items: center !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/body.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/body.scss new file mode 100644 index 00000000000..8965c861f45 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/body.scss @@ -0,0 +1,144 @@ +body { + @apply bg-grey-bg; +} + +.body-container { + @apply bg-grey-bg h-full min-h-screen overflow-x-hidden; +} + +.navbar { + @apply text-white bg-secondary p-md w-full mb-md; + img { + height: 24px; + } +} +/* .navbar-header{ + @apply text-navbarheader float-left px-sm +} + +.navbar-subheader{ + @apply font-light px-sm border-solid border-l border-white border-opacity-100 +}*/ + +.h1 { + @apply text-heading-l text-text-primary font-bold mb-md ml-md; +} + +.link-label { + @apply block text-link text-primary-main mb-md ml-md cursor-pointer; + + &:hover { + @apply text-primary-main; + } +} + +.back-btn { + width: fit-content; + @apply block border-solid border-b border-text-primary font-rc text-text-primary text-text-btn ml-sm mt-md; + + label { + @apply inline mr-sm align-middle; + } + + p { + @apply inline float-right; + } +} + +.bread-crumb { + font-size: 14px; + color: theme(colors.text.secondary); + display: flex; + margin-bottom: 10px; + list-style: none; + padding: 0; +} +.bread-crumb--item { + margin-left: 5px; + + &:not(:last-child):after { + content: " /"; + } + + button { + outline: none; + } + + .last { + color: theme(colors.text.primary); + } +} + +.back-btn2 { + cursor: pointer; + width: fit-content; + @apply flex border-solid border-b border-text-primary font-rc text-text-primary text-text-btn ml-sm mb-md; + + img { + @apply flex; + } + + svg { + @apply flex; + } + + p { + @apply flex; + } +} + +@screen dt { + .employee-app-container { + @apply w-full; + } + + .app-container { + width: 100%; + form { + .card { + max-width: 960px; + h2 { + text-align: left; + } + .field-container { + max-width: 540px; + } + button { + max-width: 240px; + } + .input-otp-wrap, + .card-text-button { + text-align: left; + } + } + } + } + + .h1 { + margin-left: 0; + @apply text-heading-l-dt; + } + + .link-label { + margin-left: 0; + } + + .back-btn { + margin-left: 0; + } + + .back-btn2 { + margin-left: 0; + } +} + +.body-container::-webkit-scrollbar { + display: none; +} +.audit-card { + width: 80%; + margin-left: -21%; + margin-right: -27%; + max-height: 120px; + margin-top: 90px; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/buttons.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/buttons.scss new file mode 100644 index 00000000000..14312a25052 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/buttons.scss @@ -0,0 +1,101 @@ +.selector-button-primary { + @apply h-8 bg-primary-main text-center border-b-2 border-input-border border-solid outline-none px-lg; + + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-white; + } +} + +.selector-button-border { + @apply h-8 bg-border text-center border-b-2 border-input-border border-solid outline-none px-lg; + + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-text-primary; + } +} + +.input-mirror-selector-button{ + @apply h-16 bg-border text-center border-b-2 border-input-border border-solid outline-none px-lg !important; + + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-text-primary; + } +} + +.selector-button-primary-disabled { + @apply h-8 bg-primary-main text-center border-b-2 border-input-border border-solid outline-none px-lg opacity-50; + + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-white; + } +} +.submit-bar:focus { + @apply outline-none !important; +} + +.jk-digit-secondary-btn { + width: auto; + height: 40px; + background: theme(colors.white); + border: 1px solid theme(colors.primary.main); + padding: 12px; + color: theme(colors.primary.main); + display: flex; + align-items: center; + font-size: 19px; + cursor: pointer; + svg { + margin: 0 10px; + } +} +.jk-digit-primary-btn { + width: auto; + height: 40px; + background: theme(colors.primary.main); + border: 1px solid theme(colors.primary.main); + padding: 6px; + color: theme(colors.white); + display: flex; + align-items: center; + cursor: pointer; + font-size: 19px; + box-shadow: inset 0 -2px 0 #0b0c0c; + svg { + margin: 0 15px; + } +} + +.jk-digit-disabled-btn { + opacity: 0.5; + font-size: 19px; + cursor: not-allowed; +} + +.jk-header-btn-wrapper { + display: flex; + justify-content: space-between; +} + +/* for mobile view */ +@media (max-width: 780px) { + .jk-header-btn-wrapper { + flex-flow: column; + margin-bottom: 15px; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/card.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/card.scss new file mode 100644 index 00000000000..16d6c352cab --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/card.scss @@ -0,0 +1,391 @@ +.card { + @apply bg-white m-sm px-md pt-md pb-lg shadow-card; + border-radius: 4px; + max-width: 960px; + + .card-header { + @apply text-text-primary text-heading-xl font-bold font-rc align-middle text-left mb-md; + } + + .card-sub-header { + @apply text-text-primary text-caption-xl font-bold align-middle text-left mb-sm; + } + + .card-caption { + @apply text-text-secondary text-caption-xl mb-sm; + } + + .card-text { + @apply text-text-secondary text-body-l align-middle text-left mb-lg; + + span { + @apply text-text-primary; + } + } + + .card-text-primary { + @apply text-text-primary text-body-l; + } + + .card-text-button { + @apply text-primary-main text-text-btn; + } + + .card-label { + @apply text-legend text-text-primary mb-sm; + } + + .card-label-error { + @apply block text-body-s text-error mb-md; + } + + .card-label-desc { + @apply font-bold text-text-secondary text-heading-s mb-md; + } + + .card-link { + @apply block text-center text-link text-primary-main mt-md cursor-pointer; + } +} + +.validation-error { + @apply block text-body-s text-error; +} + +.docsDescription { + color: theme(colors.text.primary) !important; +} + +.field-container { + @apply flex items-center; + /*@apply flex justify-center items-center;*/ +} + +.employeeCard { + @apply bg-white shadow-card p-md mb-xl; + border-radius: 4px; + + .card-header { + @apply text-text-primary text-heading-xl font-bold font-rc align-middle text-left mb-md; + } + + .card-sub-header, + .employee-card-sub-header { + @apply text-text-primary text-caption-xl font-bold align-middle text-left; + } + + .card-section-header { + @apply text-text-primary text-heading-m font-bold; + } + + .card-section-sub-text{ + @apply text-text-primary text-body-s; + } + + .card-caption { + @apply text-text-secondary text-caption-xl mb-sm; + } + + .card-text { + @apply text-text-secondary text-body-l align-middle text-left mb-lg; + + span { + @apply text-text-primary; + } + } + + .card-text-primary { + @apply text-text-primary text-body-l; + } + + .card-text-button { + @apply text-primary-main text-text-btn; + } + + .card-label { + @apply text-legend text-text-primary mb-md; + } + + .card-label-error { + @apply block text-body-s text-error mb-md; + } + + .card-label-desc { + @apply font-bold text-text-secondary text-heading-s mb-md; + } + + .card-link { + @apply block text-center text-link text-link-normal mt-md; + } + + .card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; + } +} + +.header-wrap { + @apply flex mb-md; + + .header-start { + margin-right: auto; + } + + .header-content { + margin-top: 0.2rem; + } + + .header-end { + margin-left: auto; + } +} + +.card-emp { + @extend .card; + padding-right: 0; + padding-top: 0; + padding-left: 0; + @apply bg-white m-sm; +} + +.submit-bar { + @apply h-10 bg-primary-main text-center w-full outline-none; + box-shadow: inset 0px -2px 0px theme(colors.text.primary); + cursor: pointer; + &:focus { + @apply outline-none; + } + + header { + @apply font-rc font-medium text-legend text-white leading-10; + } +} + +.submit-bar-disabled { + @apply h-10 bg-primary-main text-center w-full outline-none opacity-50; + + &:focus { + @apply outline-none; + } + + header { + @apply font-rc font-medium text-legend text-white leading-10; + } +} + +@screen dt { + .submit-bar, + .submit-bar-disabled { + width: 240px; + } + + .card { + display: flex; + flex-direction: column; + + .card-header { + @apply text-heading-xl-dt; + } + + .card-sub-header { + @apply text-heading-l-dt; + } + + .card-caption { + @apply text-caption-xl-dt; + } + + .card-text, + .card-text-primary { + @apply text-body-l-dt; + } + + .card-link { + @apply text-left; + } + } + + .employeeCard { + /* TODO need to revisit that we need mx-md NABEEL/ANIL + @apply mb-md mx-md !important; + */ + @apply mb-md !important; + &.filter { + margin-left: auto; + margin-right: auto; + } + + .card-header { + @apply text-heading-xl-dt; + } + + .card-sub-header { + @apply text-heading-l-dt; + } + + .employee-card-sub-header { + margin-bottom: 40px; + @apply text-heading-l-dt; + } + + .card-section-header { + margin-bottom: 40px; + @apply text-heading-m-dt; + } + + .card-section-sub-text{ + @apply text-text-primary text-body-s-dt; + } + + .card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; + } + + .card-caption { + @apply text-caption-xl-dt; + } + + .card-text, + .card-text-primary { + @apply text-body-l-dt; + } + + .card-link { + @apply text-left; + } + + .label-field-pair { + @apply flex items-center; + + h2 { + width: 30%; + } + + .field { + width: 50%; + margin-right: 20%; + .field { + margin-right: unset; + } + } + } + + .field-container { + span { + border: 2px solid black; + background: rgb(247, 247, 247); + width: 40px; + height: 40px; + display: flex; + justify-content: center; + align-items: center; + margin-top: -16px; + border-right: none; + } + } + } + + .header-wrap { + @apply flex mb-md; + + .header-start { + margin-right: auto; + } + + .header-content { + } + + .header-end { + margin-left: auto; + } + } +} + +.card-section-header { + @apply text-text-primary text-heading-m font-bold; +} + +.card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; +} + +.button-sub-text { + width: 100%; +} + +.home-page-info-banner-wrap { + margin: "0px 16px 24px 16px"; +} + +@media (min-width: 780px) { + .button-sub-text { + width: 240px; + } + .home-page-info-banner-wrap { + max-width: 45%; + min-width: 40%; + margin-left: 0; + margin-right: 24px; + margin-bottom: 24px; + } + .info-banner-wrap-citizen-override { + } + .oc-aknowledgement-screen { + width: auto; + min-width: 240px; + max-width: 100%; + padding: 0px 10px; + } +} + +.card-label-error { + @apply block text-body-s text-error mb-md; +} + +.employeeCard-override { + margin-left: 0px !important; +} + +.BPAemployeeCard { + margin-left: 0px !important; + margin-right: 0px !important; + margin-bottom: 64px !important; +} + +.employee-application-details { + display: flex !important; + justify-content: space-between !important; + max-height: 60px !important; + height: 60px !important; +} +.employee-main-application-details { + padding: 10px !important; +} + +.employee-mulitlink-main-div { + z-index: 10 !important; + max-width: 41% !important; +} + +.employee-download-btn-className { + position: unset !important; + display: flex !important; + justify-content: flex-end !important; +} + +.employee-options-btn-className { + position: unset !important; + margin: 0 !important; + width: 100% !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/cardHeaderWithOptions.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/cardHeaderWithOptions.scss new file mode 100644 index 00000000000..a19f1dc164a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/cardHeaderWithOptions.scss @@ -0,0 +1,14 @@ +.cardHeaderWithOptions{ + @apply flex flex-row justify-between; + .multilinkWrapper{ + @apply relative; + .multilink-labelWrap{ + position: unset; + @apply flex z-10 items-center align-middle text-center m-md; + } + .multilink-optionWrap{ + top: 32px; + right: 0%; + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/changeLanguage.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/changeLanguage.scss new file mode 100644 index 00000000000..f030a38e809 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/changeLanguage.scss @@ -0,0 +1,3 @@ +.language-title { + margin-bottom: "5px"; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/charts.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/charts.scss new file mode 100644 index 00000000000..e7d398886f6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/charts.scss @@ -0,0 +1,186 @@ +.chartHeader { + display: flex; + flex-direction: row; + justify-content: space-between; + + .sideContent { + @apply flex justify-around items-center ; + + } +} + +.searchInput { + @apply mr-lg; + input{ + margin-bottom: 0; + @apply pr-xl; + } +} + +.signature-img{ + top: 8px; + right: 8px; + fill: theme(colors.text.secondary); + @apply absolute; +} + +.column-direction { + flex-direction: column; +} + +.chart-wrapper { + padding: 0 10px; + margin-top: 60px; +} + +.chart-row { + @apply flex justify-between flex-wrap; + .chart-item { + flex-grow: 1; + margin-bottom: 15px; + width: 100%; + + &:last-child { + margin-right: 0px; + } + } +} + +.cursorPointer { + @apply cursor-pointer; +} + +.options { + @apply flex justify-between items-center; + div { + display: none; + } +} + +.options-m { + width: 95%; + margin: 0 auto 15px; + @apply flex justify-between; + + svg { + margin-right: 10px; + } +} + +.options-m { + div { + @apply flex; + } +} +.no-data { + @apply flex justify-center items-center; + height: 90%; + margin-bottom: 40px; + white-space:pre; +} + +@screen dt { + .chart-wrapper { + padding-left: 15px; + margin-top: 10px; + + .chart-item { + margin-right: 25px !important; + margin-bottom: 25px !important; + margin-left: 0 !important; + width: 31%; + } + } + .column-direction { + flex-direction: row; + } + .options-m { + display: none; + } + + .options { + div { + @apply flex cursor-pointer; + } + } +} + +.showMore { + @apply text-right cursor-pointer; + color: theme(colors.primary.main); +} + +@media (max-width: 420px) { + .recharts-default-tooltip { + width: 85%; + ul { + width: 100% !important; + } + ul li { + width: 100%; + display: flex !important; + flex-wrap: wrap; + } + } +} + + +@media print{ + .page-break { + margin-top: 1rem; + display: block; + page-break-before: auto; + } + .chart-wrapper { + @media print{ + .chart-row { + @media print{ + @apply flex justify-between flex-wrap; + .chart-item { + @media print{ + flex-grow: 1; + margin-right: 25px; + margin-bottom: 25px; + width: 31%; + + &:last-child { + margin-right: 0px; + } + .chartHeader { + display: flex; + justify-content: space-between; + + .sideContent { + @apply flex justify-around items-center ; + + .searchInput { + @apply mr-lg; + input{ + margin-bottom: 0; + @apply pr-xl; + } + } + + .signature-img{ + top: 8px; + right: 8px; + fill: theme(colors.text.secondary); + @apply absolute; + } + } + } + } + } + } + } + + .options { + @apply flex justify-end; + } + + .options-m { + display: none; + } + } +} +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkbox.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkbox.scss new file mode 100644 index 00000000000..b805530f4d7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkbox.scss @@ -0,0 +1,53 @@ +.checkbox-wrap { + @apply flex mb-md relative items-baseline; + + input { + width: 38px; + height: 38px; + @apply opacity-0 absolute top-0 left-0 z-10; + } + + .input-emp { + @extend input; + width: 24px; + height: 24px; + } + + .custom-checkbox { + width: 38px; + height: 38px; + @apply absolute top-0 left-0 border border-solid border-input-border z-0; + + img { + @apply opacity-0; + } + + svg { + @apply opacity-0; + } + } + + .custom-checkbox-emp { + @extend .custom-checkbox; + width: 24px; + height: 24px; + } + + input:checked ~ .custom-checkbox, + input:hover ~ .custom-checkbox { + @apply border-2 border-primary-main; + } + + input:checked ~ .custom-checkbox img { + @apply opacity-100; + } + + input:checked ~ .custom-checkbox svg { + @apply opacity-100; + } + + .label { + margin-left: 56px; + @apply text-form-field text-text-primary; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkpoint.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkpoint.scss new file mode 100644 index 00000000000..6d0e3fc7262 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/checkpoint.scss @@ -0,0 +1,63 @@ +.checkpoint-connect-wrap { + padding-bottom: 40px; + @apply relative; +} +.checkpoint-done { + @apply flex; + + h2 { + width: 24px; + height: 24px; + border-radius: 50%; + @apply border-b border-solid border-primary-main bg-primary-main; + } + + header { + @apply text-heading-s ml-md; + + p { + margin-top: 4px; + @apply text-heading-s text-text-secondary; + } + } +} + +.checkpoint { + @apply flex; + + h2 { + width: 24px; + height: 24px; + border-radius: 50%; + --text-opacity: 1; + @apply border-b border-solid border-border bg-border; + } + + header { + @apply text-heading-s ml-md; + + p { + margin-top: 4px; + @apply text-heading-s text-text-secondary; + } + } +} + +.checkpoint-connect { + margin-left: 12px; + margin-top: 22px; + @apply absolute top-0 left-0 h-full border-l border-solid border-border; +} + +.checkpoint-comments-wrap { + max-width: 560px; + @apply bg-grey-mid p-sm mt-sm; + + h4{ + @apply text-text-primary text-heading-s; + } + + p{ + @apply text-text-secondary text-body-s-dt; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/citizenInfoLabel.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/citizenInfoLabel.scss new file mode 100644 index 00000000000..bbb1ce45220 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/citizenInfoLabel.scss @@ -0,0 +1,14 @@ +.citizen-info-label { + @apply p-sm border-4 border-solid border-link-normal text-heading-m m-sm; + max-width: 960px; + + p { + @apply text-link-normal font-bold mt-xs text-heading-s; + } +} + +@screen dt { + .citizen-info-label { + margin: 0; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/custombtn.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/custombtn.scss new file mode 100644 index 00000000000..82b369ab798 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/custombtn.scss @@ -0,0 +1,11 @@ +.customBtn { + @apply bg-white text-text-primary box-border inline-block outline-none px-sm border border-solid border-primary-main; + margin: 0px 4.65% 0px 0px; + height: 30px; + line-height: 30px; +} + +.customBtn-selected { + @extend .customBtn; + @apply bg-primary-main text-white font-medium; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datatable.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datatable.scss new file mode 100644 index 00000000000..b2756a61e96 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datatable.scss @@ -0,0 +1,134 @@ +.data-table { + @apply text-text-primary; + + .row { + @apply flex border-b border-border pb-sm mb-sm; + + span { + width: 70%; + display: contents; + } + + h2 { + width: 40%; + @apply font-bold text-heading-s; + } + + .value { + width: 50%; + @apply text-heading-s; + word-break: break-all; + } + .caption { + width: 70%; + @apply text-heading-s text-text-secondary; + } + } + + .last { + border: none; + padding: 0; + margin: 0; + } +} + +.employee-data-table { + .row { + @apply flex pb-sm mb-sm; + + span { + width: 70%; + display: contents; + } + + h2 { + width: 30%; + @apply font-bold text-heading-s; + } + + .value { + width: 50%; + @apply text-heading-s; + white-space: break-spaces !important; + word-break: break-all; + } + + .caption { + width: 70%; + @apply text-heading-s text-text-secondary; + } + } + + .last { + border: none; + padding: 0; + margin: 0; + } +} + +.employee-data-table { + .row { + @apply flex pb-sm mb-sm; + + span { + width: 70%; + display: contents; + } + + h2 { + width: 30%; + @apply font-medium text-heading-s; + } + + .value { + white-space: break-spaces !important; + word-break: break-all; + width: 60%; + @apply text-heading-s; + &.status-row-radio { + div { + margin-right: 1rem; + width: 50%; + } + .mg-sm { + width: 30%; + } + } + } + + .caption { + width: 70%; + @apply text-heading-s text-text-secondary; + } + } + + .last { + border: none; + padding: 0; + margin: 0; + } + &.status-radio-table { + margin-top: 1rem; + .row { + span { + width: 24px; + display: block; + float: left; + border-radius: 50%; + } + } + } + + &.view-header { + .row { + display: grid; + grid-template-columns: 1fr 68%; + } + } +} + + +.pt-citizen {.data-table {.row { + justify-content: space-between; + +}}} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datewrap.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datewrap.scss new file mode 100644 index 00000000000..1f3c8897774 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/datewrap.scss @@ -0,0 +1,21 @@ +.date-wrap { + @apply flex mb-md; + + img, + svg { + height: 22px; + width: 20px; + } + + p { + @apply text-text-primary text-body-l pl-sm; + } +} + +@screen dt { + .date-wrap { + p { + @apply text-body-l-dt; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscard.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscard.scss new file mode 100644 index 00000000000..cfbc83a99e3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscard.scss @@ -0,0 +1,6 @@ +.details-card { + @apply bg-white m-sm px-sm pt-sm pb-lg shadow-card; + .card-label { + @apply font-bold text-legend text-text-primary mb-md; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscontainer.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscontainer.scss new file mode 100644 index 00000000000..fa3ab70b9d5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/detailscontainer.scss @@ -0,0 +1,13 @@ +.details-container { + @apply flex flex-col m-sm pt-md pb-md pl-sm pr-sm bg-white rounded; + .detail { + @apply grid grid-cols-2 gap-2 items-baseline; + .label { + width: 138px; + @apply font-bold text-heading-s text-text-primary mb-md; + } + .name { + @apply pt-md; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/filters.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/filters.scss new file mode 100644 index 00000000000..dd4b6634b19 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/filters.scss @@ -0,0 +1,98 @@ +.filters-wrapper { + display: none; + padding: 20px 0px 0px; + z-index: 1; + + .filters-input { + flex-basis: 22%; + } + + .filters-input:not(:first-of-type) { + margin-left: 5%; + } + + .switch-wrapper { + display: flex; + justify-content: space-between; + max-width: 200px; + + .radio-switch { + display: none; + + &:checked ~ label { + border-color: theme(colors.primary.main); + color: theme(colors.primary.main); + } + } + + label { + border: 1px solid; + padding: 6px 10px; + display: block; + @apply border border-solid border-input-border; + &:hover{ + @apply border-2 border-solid border-primary-main; + } + } + } +} + +.pickerShadow { + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); +} + +.filter-close { + @apply flex justify-end; +} + +.filter-header { + @apply flex; + + p { + font-weight: bold; + font-size: 24px; + line-height: 1; + margin: 0 12px 20px 8px; + } +} + +.clearText { + display: none; +} + +@screen dt { + .filters-wrapper { + display: flex; + } + + .filter-close, + .filter-header { + display: none; + } + + .clearText { + display: block; + text-align: right; + color: theme(colors.primary.main); + margin-top: 20px; + margin-left: 10px; + } +} + +@media (max-width: 780px) { + .filters-modal { + display: block; + position: fixed; + width: 100%; + height: 100vh; + left: 0; + top: 130px; + padding: 16px; + background-color: #fff; + z-index: 99; + } + + .rdrDefinedRangesWrapper { + display: none; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/grey.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/grey.scss new file mode 100644 index 00000000000..eec759d99fe --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/grey.scss @@ -0,0 +1,3 @@ +.grey { + @apply text-text-secondary; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/InboxComposer.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/InboxComposer.scss new file mode 100644 index 00000000000..98bacf62f21 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/InboxComposer.scss @@ -0,0 +1,115 @@ +.InboxComposerWrapper { + .form-field-flex-one { + .form-field { + @apply flex-1; + } + } +} + +.inboxPopupMobileWrapper { + @apply block p-md w-full overflow-scroll; + .submit { + @apply flex left-0 w-full px-xl items-center flex-row-reverse !important; + } + .form-field { + margin: 0 !important; + @apply w-full; + } + .InboxMobilePopupCloseButtonWrapper { + @apply flex flex-row-reverse; + } +} + +@screen dt { + .InboxComposerWrapper { + grid-template-columns: calc(25% - 32px) 75%; + @apply grid gap-x-8 gap-y-6; + } + + .wns-inbox-composer { + .filter-form { + height: fit-content; + } + + .wns-search-field { + width: 30% !important; + .field-container { + } + } + .form-field { + width: 100% !important; + } + + .SubmitAndClearAllContainer { + width: 100%; + display: flex; + justify-content: end; + align-items: center; + .clear-search { + width: 30%; + display: inline-block; + vertical-align: middle; + text-align: right; + cursor: pointer; + p { + padding: 1rem; + color: rgb(244, 119, 56); + text-align: end; + } + } + .submit { + width: 30% !important; + margin-left: unset !important; + button { + width: 100% !important; + } + } + } + } + + .search-form-wns-inbox { + .clear-search-container { + grid-column: 2/3; + text-align: right; + .clear-search { + width: 100%; + color: rgb(244, 119, 56); + } + } + button { + width: 100%; + } + + .filter-form { + height: fit-content; + } + + .search-complaint-container { + flex-direction: column; + align-items: flex-start; + --bg-opacity: 1; + background-color: #fff; + background-color: rgba(255, 255, 255, var(--bg-opacity)); + padding: 16px; + display: unset; + flex-wrap: unset; + justify-content: unset; + margin-bottom: 0; + .complaint-input-container { + display: grid; + grid-template-columns: 33.33% 33.33% 33.33%; + } + .form-field { + width: 100%; + padding-right: 15px; + .clear-search { + padding-top: 10px; + } + } + } + .submit { + margin-top: 0; + right: 0; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/index.scss new file mode 100644 index 00000000000..d651ce49346 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/hoc/index.scss @@ -0,0 +1 @@ +@import "./InboxComposer.scss" \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/howItWorks.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/howItWorks.scss new file mode 100644 index 00000000000..c77a82b2b1a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/howItWorks.scss @@ -0,0 +1,71 @@ +.how-it-works-page{ + width: 92%; + margin: 16px; + .how-it-works-page-header{ + margin-bottom: 15px; + } +} + +.video-icon{ + float: left; + background-color: #6F6F6F; + height: 60px; + width: 100px; + cursor: pointer; + margin: 5px; + + .vid-svg{ + padding-left: 35px; + padding-top: 18px; + } +} + +.how-it-works-header-description{ + padding: 5px; + overflow-wrap: break-word; + h2{ + font-size: 16px; + font-weight: 400; + } + p{ + font-size: 12px; + font-weight: 400; + } +} + +.how-it-works-pdf-section{ + display: flex; + justify-content: space-between; + .pdf-icon-header-desc{ + float: left; + .pdf-icon{ + display: inline-block; + } + .pdf-header-desc{ + display: inline-block; + position: absolute; + padding: 5px; + overflow-wrap: break-word; + h2{ + font-size: 16px; + font-weight: 400; + } + p{ + font-size: 12px; + font-weight: 400; + } + } + } + .download-icon{ + float: right; + } +} + +.how-it-works-video-play{ + display: inline-block; + .close-button{ + float: right; + cursor: pointer; + } +} + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/imageviewer.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/imageviewer.scss new file mode 100644 index 00000000000..1f0568f8d01 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/imageviewer.scss @@ -0,0 +1,33 @@ +.image-viewer-wrap { + @apply bg-text-primary p-md top-0 left-0 z-20 fixed w-full h-full; + + svg { + top: 90px; + right: 16px; + @apply absolute h-6 w-6; + } + + img { + margin-top: 40%; + @apply max-w-full h-auto; + } +} + +@screen dt { + .image-viewer-wrap { + @apply flex fixed top-0 left-0 w-full h-full z-20 bg-text-primary p-md; + + svg { + top: 90px; + right: 16px; + @apply absolute h-6 w-6; + } + + img { + width: auto; + height: auto; + max-width: 640px; + margin: auto; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/InboxLinks.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/InboxLinks.scss new file mode 100644 index 00000000000..7549fe0b3d9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/InboxLinks.scss @@ -0,0 +1,59 @@ +@import url("../../digitv2/index.scss"); + +.inbox-search-links-container { + @extend .light-paper-primary; + height: 100%; + width: 100% !important; + display: flex; + flex-direction: column; + padding: 1rem; + .header { + @extend .light-text-color-primary; + display: grid; + grid-template-columns: 20% 1fr; + .logo { + display: flex; + align-items: center; + justify-content: flex-start; + .inbox-search-icon--projects { + fill : #f47738; + height: 2rem; + width: 2rem; + } + } + .text { + @extend .light-text-color-primary; + line-height: 32px; + font-weight: 700; + color : black; + display: flex; + align-items: center; + justify-content: flex-start; + } + + @media (min-width: 1024px) { + .text { + font-size: 24px; + } + } + + @media (max-width: 1024px) { + .text { + font-size: 20px; + } + } + } + .contents { + margin-top: 1rem; + box-sizing: border-box; + display: flex; + flex-direction: column; + .link { + @extend .light-primary; + padding: 8px; + --text-opacity: 1; + color: #f47738; + color: rgba(244, 119, 56, var(--text-opacity)); + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/horizontalNav.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/horizontalNav.scss new file mode 100644 index 00000000000..13fd228d181 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/horizontalNav.scss @@ -0,0 +1,224 @@ +@import url("../../digitv2/index.scss"); + +.horizontal-nav { + @extend .light-paper-primary; + @extend .light-text-color-primary; + overflow: auto; + display: flex; + margin-top: 3rem; + + .menu-item { + border: 10px; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + cursor: pointer; + text-decoration: none; + margin: 0px; + padding: 0px; + outline: none; + font-size: 16px; + position: relative; + color: rgb(95, 92, 98); + line-height: 48px; + transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; + min-height: 48px; + white-space: initial; + background: none; + + .icon { + @extend .light-background; + display: block; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + height: 21px !important; + width: 21px !important; + float: left; + margin-top: 12px; + } + + .edit-btn-ico { + height: 17px; + width: 17px; + margin-top: 16px; + } + + .icon+.menu-label { + margin-left: 36px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + + @media (min-width: 780px) { + .sidebar-list { + padding-right: 30px; + padding-left: 30px; + background-color: #EEEEEE; + border: 1px solid #DDDDDD; + border-radius: 8px 8px 0px 0px; + + &.active { + font-weight: 600; + border-bottom: 3px solid theme(colors.primary.main); + + background-color: #FFFFFF; + + .menu-label { + color: theme(colors.primary.main); + } + + .icon { + fill: theme(colors.primary.main); + } + } + + .submenu-container { + cursor: pointer; + display: flex; + flex-direction: column; + + .sidebar-link { + display: flex; + justify-content: space-between; + align-items: center; + padding: 15px!important; + padding-top: 20px!important; + svg { + width: 24px !important; + height: 24px !important; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + + .actions { + .tooltip { + margin-left: 16px; + } + } + } + + .actions { + display: flex; + align-items: center; + overflow: hidden !important; + + span { + margin-left: 13px; + line-height: 48px; + white-space: nowrap; + color: #5f5c62; + overflow: hidden; + text-overflow: ellipsis; + } + } + } + .submenu-container:first-child { + margin-top:5px; + .employee-search-input{ + margin-left:16px !important; + } + } + } + .sidebar-list-search-form { + padding-right: 30px; + padding-left: 30px; + + &.active { + font-weight: 600; + border-bottom: 3px solid theme(colors.primary.main); + + background-color: #FFFFFF; + + .menu-label { + color: theme(colors.primary.main); + } + + .icon { + fill: theme(colors.primary.main); + } + } + + .submenu-container { + cursor: pointer; + display: flex; + flex-direction: column; + + .sidebar-link { + display: flex; + justify-content: space-between; + align-items: center; + padding: 15px!important; + padding-top: 20px!important; + svg { + width: 24px !important; + height: 24px !important; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + + .actions { + .tooltip { + margin-left: 16px; + } + } + } + + .actions { + display: flex; + align-items: center; + overflow: hidden !important; + + span { + margin-left: 13px; + line-height: 48px; + white-space: nowrap; + color: #5f5c62; + overflow: hidden; + text-overflow: ellipsis; + } + } + } + .submenu-container:first-child { + margin-top:5px; + .employee-search-input{ + margin-left:16px !important; + } + } + } + + + .dropdown-link { + .actions { + display: flex; + padding: 1em; + + svg { + width: 21px; + height: 21px; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + + span { + color: #5f5c62; + } + } + } + } +} + + + +.sidebar-link { + display: flex; + justify-content: space-between; + align-items: center; + padding: 15px!important; + padding-top: 20px!important; + svg { + width: 24px !important; + height: 26px !important; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearch.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearch.scss new file mode 100644 index 00000000000..a24f8919f3b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearch.scss @@ -0,0 +1,116 @@ +@import url("../../digitv2/index.scss"); + +.search-wrapper { + @extend .light-text-color-primary; + @extend .light-paper-primary; + height: 100%; + width: 100%; + padding: 1rem; + + .popup-label { + display: flex; + font-size: large; + @extend .light-text-color-primary; + .header { + @extend .light-text-color-primary; + width: 100%; + font-weight: normal; + font-size: large; + .icon { + @extend .light-primary; + margin-right: 12px; + margin-top: 5px; + } + } + } + + .filter-header-wrapper { + @extend .light-text-color-primary; + display: grid; + grid-template-columns: 15% 1fr 15%; + height: 3rem; + margin-bottom: 1rem; + .icon-refresh { + display: flex; + align-items: center; + justify-content: center; + border: 1px solid #00000017; + cursor: pointer; + svg { + height: 60%; + width: 40%; + } + } + .label { + @extend .light-text-color-primary; + display: flex; + align-items: center; + justify-content: flex-start; + } + + @media (min-width: 1024px) { + .label { + font-size: 24px; + } + } + + @media (max-width: 1024px) { + .label { + font-size: 16px; + } + } + + .icon-filter { + display: flex; + align-items: center; + justify-content: flex-start; + } + } + + .search-field-wrapper { + display: grid; + row-gap: 0.25rem; + column-gap: 1rem; + &.inbox { + grid-template-columns: repeat(3, 1fr); + &.filter { + display: flex; + flex-direction: column; + } + } + &.search { + grid-template-columns: repeat(4, 1fr); + } + .text-input{ + @extend .light-primary; + } + } + + .search-button-wrapper { + display: flex; + align-items: center; + justify-content: flex-end; + gap: 1rem; + padding-top: 8px; + &.inbox { + grid-column: 2 / span 2; + &.filter { + button { + width: 100%; + } + } + } + &.search { + grid-column: 3 / span 2; + } + } +} + +@screen sm { + .search-wrapper { + .search-field-wrapper { + display: flex; + flex-direction: column; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearchComposer.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearchComposer.scss new file mode 100644 index 00000000000..091a4e6a249 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/inboxSearchComposer.scss @@ -0,0 +1,134 @@ +@import url("../../digitv2/index.scss"); + +.inbox-search-wrapper { + /* + TODO NABEEL/ANIL Removed these since it creates issues in search screen + @extend .light-background; + + */ + height: 100%; + .inbox-search-component-wrapper { + /* + TODO NABEEL/ANIL Removed these since it creates issues in search screen + @extend .light-background; + + */ height: 100%; + width: 100%; + .sections-parent { + /* + TODO NABEEL/ANIL Removed these since it creates issues in search screen + @extend .light-background; + + */ height: 100%; + display: grid; + grid-template-columns: 20% 1fr; + gap : 1rem; + &.inbox { + @extend .light-text-color-primary; + .links{ + @extend .light-primary; + @extend .light-paper-primary; + .text{ + @extend .light-text-color-primary; + } + .inbox-links-icon{ + color:#f47738; + fill:#f47738; + path{ + fill:#f47738; + } + } + } + } + &.search { + display: flex; + flex-direction: column; + .section { + &.links { + display: none; + } + &.filter { + display: none; + } + } + .search-wrapper { + @extend .light-paper-primary; + .search-field-wrapper.search.custom-both-clear-search{ + .search-button-wrapper.search { + grid-column: initial; + } + .search-button-wrapper{ + .link-label{ + @extend .light-primary; + white-space:initial; + } + .submit-bar { + @extend .light-primary-button; + width: 60%; + } + } + } + } + } + &.download { + grid-template-columns: 100% + } + .section { + @extend .light-paper-primary; + @extend .light-text-color-primary; + min-height: 10rem; + /* background-color: white; */ + display: flex; + align-items: center; + justify-content: center; + border-radius: 4px; + box-shadow: 0 1px 2px 0 rgb(0 0 0 / 16%); + &.search-results { + min-height: 0; + } + &.links { + height: 100%; + color : #f47738; + .inbox-search-links-component { + height: 100% !important; + width: 100%; + } + } + &.filter { + @extend .light-paper-primary; + @extend .light-text-color-primary; + height: fit-content; + } + } + } + } +} + +@screen sm { + .employee-main-application-details-for-modal { + padding: 0 !important; + } + .inbox-search-wrapper { + .inbox-search-component-wrapper { + .sections-parent { + display: flex; + flex-direction : column; + .section { + &.search-results { + } + &.links { + } + &.filter { + + } + &.as-modal { + position : fixed; + top : 0; + height : 100vh; + width : 100vw; + } + } + } + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/index.scss new file mode 100644 index 00000000000..bad206269e9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/index.scss @@ -0,0 +1,5 @@ +@import "./horizontalNav.scss"; +@import "./InboxLinks.scss"; +@import "./inboxSearch.scss"; +@import "./searchComponentTable.scss"; +@import "./inboxSearchComposer.scss"; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/searchComponentTable.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/searchComponentTable.scss new file mode 100644 index 00000000000..a542d721fa9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inboxv2/searchComponentTable.scss @@ -0,0 +1,44 @@ +.search-component-table { + width: 100%; + display: block; + overflow-x: auto; + overflow-y:hidden; + table { + th { + .tooltip { + min-width: 80px; + } + } + tr { + td { + span { + white-space: pre; + min-width: 80px; + .tooltip { + position: relative; + min-width: 80px; + display: inline-block; + margin-left: 16px; + .tooltiptext { + visibility: hidden; + background-color: #555; + color: #fff; + text-align: left; + border-radius: 6px; + padding: 5px; + position: absolute; + z-index: 1; + bottom: 125%; + left: 50%; + margin-left: -60px; + opacity: 0; + transition: opacity 0.3s; + width: 30rem; + } + } + + } + } + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/info-banner.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/info-banner.scss new file mode 100644 index 00000000000..3ed3b4ac46b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/info-banner.scss @@ -0,0 +1,35 @@ +.info-banner-wrap { + @apply bg-link-normal bg-opacity-25 m-sm p-md; + max-width: 960px; + + background-color: #C7E0F1; + border-radius: 4px; + svg { + margin-top: 5px; + @apply rounded-full; + } + + div { + @apply flex; + } + + h2 { + @apply text-heading-m text-link-normal mb-md font-bold ml-sm; + } + + p { + @apply text-body-l text-link-normal whitespace-pre-line; + } +} + +@screen dt { + .info-banner-wrap { + h2 { + @apply text-heading-m-dt; + } + + p { + @apply text-body-l-dt; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inputotp.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inputotp.scss new file mode 100644 index 00000000000..686694452fc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/inputotp.scss @@ -0,0 +1,15 @@ +.input-otp-wrap { + @apply mb-lg; + + input { + @apply border-2 border-solid border-input-border outline-none h-10 w-10 text-form-field text-text-primary mr-sm mb-sm text-center; + } + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + input[type="number"] { + -moz-appearance: textfield; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/keynote.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/keynote.scss new file mode 100644 index 00000000000..df736c06aa4 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/keynote.scss @@ -0,0 +1,27 @@ +.key-note-pair { + @apply mb-md; + + h3 { + margin-bottom: 4px; + @apply font-bold text-text-primary text-heading-s; + } + + p { + @apply text-text-primary text-body-l; + } + + .caption { + @apply text-body-l text-text-secondary; + } +} + +@screen dt { + .key-note-pair { + p { + @apply text-body-l-dt; + } + .caption { + @apply text-body-l-dt text-text-secondary; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/languageSelector.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/languageSelector.scss new file mode 100644 index 00000000000..86da3527354 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/languageSelector.scss @@ -0,0 +1,23 @@ +.language-selector { + @apply flex flex-wrap; +} + +.language-selector div:not(:first-child) { + margin-left: 10px; +} +.bannerCard .language-button-container button { + width: 6.2rem; + height: 2.5rem; +} +.bannerCard .customBtn { + border-color: theme(colors.text.secondary); +} +.bannerCard .customBtn:focus { + outline: none; +} +.bannerCard .customBtn-selected { + border-color: transparent; +} +.bannerCard .bannerHeader p { + font-size: 19px; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/loader.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/loader.scss new file mode 100644 index 00000000000..1784a54c44c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/loader.scss @@ -0,0 +1,96 @@ +.page-loader, +.module-loader { + text-align: center; +} + +.page-loader { + padding-top: 88px; +} + +.module-loader { + padding: 16px; +} + +@keyframes ldio-pjg92h09b2o { + 0% { + transform: translate(-50%, -50%) rotate(0deg); + } + + 100% { + transform: translate(-50%, -50%) rotate(360deg); + } +} + +.ldio-pjg92h09b2o div { + position: absolute; + width: 52px; + height: 52px; + border: 12px solid theme(colors.secondary); + border-top-color: transparent; + border-radius: 50%; +} + +.ldio-pjg92h09b2o div { + animation: ldio-pjg92h09b2o 1s linear infinite; + top: 50px; + left: 50px; +} + +.loadingio-spinner-rolling-faewnb8ux8 { + width: 48px; + height: 48px; + display: inline-block; + overflow: hidden; + background: none; +} + +.ldio-pjg92h09b2o { + width: 100%; + height: 100%; + position: relative; + transform: translateZ(0) scale(0.48); + backface-visibility: hidden; + transform-origin: 0 0; + /* see note above */ +} + +.ldio-pjg92h09b2o div { + box-sizing: content-box; +} + +/* +.loader { + position: absolute; + left: 50%; + top: 50%; + z-index: 1; + width: 80px; + height: 80px; + margin: -80px 0 0 -40px; + border: 8px solid #f3f3f3; + border-radius: 50%; + border-top-color: #3498db; + -webkit-animation: loader-spin 1s linear infinite; + animation: loader-spin 1s linear infinite; +} + +@-webkit-keyframes loader-spin { + 0% { + -webkit-transform: rotate(0deg); + } + + 100% { + -webkit-transform: rotate(360deg); + } +} + +@keyframes loader-spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} +*/ diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/map.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/map.scss new file mode 100644 index 00000000000..7e0fb5829ca --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/map.scss @@ -0,0 +1,30 @@ +.map-wrap { + @apply pb-lg; +} + +.map { + width: 100%; + height: 384px; + overflow: visible; + position: relative; +} + +.map-search-bar-wrap { + border-radius: 4px; + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5); + margin-bottom: 4px; + display: flex; + width: 100%; +} + +.map-search-bar-icon { + @apply inline h-6 w-6 m-sm; +} + +.map-search-bar { + @apply block outline-none text-form-field text-text-primary h-10 w-full !important; +} + +.map-search-bar:focus { + border: none; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/menu.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/menu.scss new file mode 100644 index 00000000000..e69de29bb2d diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/metricsTable.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/metricsTable.scss new file mode 100644 index 00000000000..786adc3c346 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/metricsTable.scss @@ -0,0 +1,28 @@ +.metricsTable { + @apply bg-white px-md pt-md pb-lg shadow-card; + max-width: 440px; + border-radius: 4px; + + .row { + @apply flex justify-between; + height: 80px; + width: 100%; + } + + .lower_red { + @apply inline; + color: rgb(229, 77, 66); + } + + .upper_green { + @apply inline; + color: theme(colors.success); + } +} + +.chart-metric-wrapper{ + display: flex; + flex-wrap: wrap; + margin-top: 15px; + justify-content: space-evenly; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiLink.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiLink.scss new file mode 100644 index 00000000000..816bfec9637 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiLink.scss @@ -0,0 +1,88 @@ +.multilink-labelWrap{ + top: 73px; + @apply flex items-center align-middle text-center m-md absolute right-0 z-10; +} + +.multilink-link-button{ + margin: 0; + @apply text-heading-s text-primary-light +} + +.multilink-optionWrap{ + right: 0; + top:110px; + width: max-content; + @apply absolute shadow-card bg-white m-md z-10; + + .multilink-option{ + + svg{ + margin-top: auto; + margin-bottom: auto; + @apply mx-sm + } + + &:hover{ + @apply bg-grey-mid cursor-pointer; + } + @apply p-md; + } +} +.overCard{ + top: 23px; +} + +.multilink-block-wrapper{ + @apply relative; + .multilink-labelWrap{ + margin: 0 !important; + top: unset; + @apply relative text-text-primary !important; + svg{ + fill: theme(colors.text.secondary); + } + span{ + @apply text-text-primary !important; + } + } + .multilink-optionWrap{ + top: 8px; + right: -50%; + @apply block !important; + } +} + +@screen dt { + + .multilink-block-wrapper{ + .multilink-optionWrap{ + right: 0 !important; + } + } + + .multilink-labelWrap{ + right: 20%; + top: 80px; + } + + .multilink-optionWrap{ + right: 20%; + top: 110px; + @apply shadow-card rounded-sm; + } +} + +.reports-download-btn{ + justify-content: flex-end; + position: unset; +} + +.reports-options-download{ + position: absolute; + justify-content: flex-end; + float: right; + right:0%; + display: flex; + flex-direction: row; + top:2rem; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiSelectDropdown.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiSelectDropdown.scss new file mode 100644 index 00000000000..5848ee0214c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/multiSelectDropdown.scss @@ -0,0 +1,77 @@ +.multi-select-dropdown-wrap{ + @apply relative text-form-field text-text-primary w-full; + .master, .master-active{ + @apply relative border border-solid border-input-border h-10 w-full; + input[type=text]{ + @apply absolute top-0 left-0 p-sm pl-sm min-h-full min-w-full opacity-0; + &:focus{ + @apply outline-none; + } + } + .label{ + @apply flex justify-between p-sm w-full h-full; + svg{ + @apply h-6 w-6; + } + } + + &:hover{ + @apply border-2 border-solid border-primary-main; + } + } + + .master-active{ + @apply border-2 border-primary-main; + input[type=text]{ + @apply opacity-100; + } + .label{ + @apply hidden; + } + } + + .server{ + + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + top:40px; + + max-height:20vmax; + overflow: scroll; + @apply absolute min-w-full z-20; + div{ + @apply flex w-full bg-white; + justify-content: flex-start; + align-items: center; + &:hover{ + @apply bg-grey-mid; + } + input{ + height: 44px; + @apply absolute min-w-full opacity-0 z-20 cursor-pointer; + } + p{ + padding: 12px; + margin-top: 5px; + margin-bottom: 5px; + @apply text-form-field text-text-primary; + } + .custom-checkbox{ + height: 28px; + width: 28px; + @apply border border-solid border-input-border m-sm; + svg{ + @apply opacity-0 z-10; + } + } + input:checked ~ .custom-checkbox, + input:hover ~ .custom-checkbox { + @apply border-2 border-primary-main; + } + + input:checked ~ .custom-checkbox svg { + @apply opacity-100; + } + + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss new file mode 100644 index 00000000000..94eb1369c2d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss @@ -0,0 +1,312 @@ +.navbar { + @apply text-white bg-secondary p-md w-full; + position: fixed; + z-index: 9999; + + img { + display: inline-block; + min-width: 78px; + height: 24px; + } + .nav { + display: flex; + justify-content: space-between; + } + .nav-wrapper { + display: flex; + @media (min-width: 780px) { + .hamburger-span { + display: none; + } + } + } + + h3 { + @apply inline-block border-l border-solid border-white pl-sm ml-sm; + } +} + +.img-circle { + border-radius: 50%; +} + +.profile-section { + height: auto; + display: flex; + flex-direction: column; + align-items: center; + padding-top: 30px; + background-color: theme(colors.white); + + img { + width: 89px; + height: 88px; + margin: 0px auto 16px; + } + + .label-container { + .label-text { + color: #767676; + } + &.name-Profile { + .label-text { + letter-spacing: 0.6px; + font-weight: 700; + font-size: 18px; + color: theme(colors.text.primary); + } + } + } + .profile-divider { + border-top: 1px solid theme(colors.border); + margin-left: 20px; + margin-right: 20px; + width: 90%; + margin-top: 1rem; + } +} + +.drawer-list { + @apply pt-md; + position: relative; + min-height: 1px; + overflow: auto; + .menu-item { + border: 10px; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + cursor: pointer; + text-decoration: none; + margin: 0px; + padding: 0px; + outline: none; + font-size: 16px; + position: relative; + color: rgb(95, 92, 98); + line-height: 48px; + transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; + min-height: 48px; + white-space: initial; + background: none; + .icon { + display: block; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + height: 21px; + width: 21px; + float: left; + margin-top: 12px; + } + .edit-btn-ico{ + height: 17px; + width: 17px; + margin-top: 16px; + } + .icon + .menu-label { + margin-left: 36px; + text-overflow: ellipsis; + white-space: nowrap; + } + } + .sidebar-list { + padding-right: 16px; + padding-left: 16px; + &.active { + border-left: 5px solid theme(colors.primary.main); + .menu-label { + color: theme(colors.primary.main); + } + .icon { + fill: theme(colors.primary.main); + } + } + + .submenu-container { + cursor: pointer; + display: flex; + flex-direction: column; + + .sidebar-link { + display: flex; + justify-content: space-between; + align-items: center; + svg { + width: 21px; + height: 21px; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + } + .actions { + display: flex; + align-items: center; + overflow: hidden !important; + + span { + margin-left: 13px; + line-height: 48px; + white-space: nowrap; + color: #5f5c62; + overflow: hidden; + text-overflow: ellipsis; + } + input { + border: none; + outline: none; + margin-left: 16px; + padding: 0.5em; + color: #5f5c62; + } + } + } + } + + .dropdown-link { + .actions { + display: flex; + padding: 1em; + svg { + width: 21px; + height: 21px; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + span { + color: #5f5c62; + } + } + } +} + +.drawer-desktop { + overflow: auto; + .menu-item { + border: 10px; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + cursor: pointer; + text-decoration: none; + margin: 0px; + padding: 0px; + outline: none; + font-size: 16px; + position: relative; + color: rgb(95, 92, 98); + line-height: 48px; + transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; + min-height: 48px; + white-space: initial; + background: none; + .icon { + display: block; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + height: 21px !important; + width: 21px !important; + float: left; + margin-top: 12px; + } + .edit-btn-ico { + height: 17px; + width: 17px; + margin-top: 16px; + } + .icon + .menu-label { + margin-left: 36px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + @media (min-width: 780px) { + .sidebar-list { + padding-right: 16px; + padding-left: 16px; + &.active { + border-left: 5px solid theme(colors.primary.main); + padding-left: 11px; + .menu-label { + color: theme(colors.primary.main); + } + .icon { + fill: theme(colors.primary.main); + } + } + + .submenu-container { + margin-left: 1.5rem; + cursor: pointer; + display: flex; + flex-direction: column; + + .sidebar-link { + display: flex; + justify-content: space-between; + align-items: center; + svg { + width: 21px; + height: 21px; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + .actions { + .tooltip { + margin-left: 16px; + } + } + } + .actions { + display: flex; + align-items: center; + overflow: hidden !important; + + span { + margin-left: 13px; + line-height: 48px; + white-space: nowrap; + color: #5f5c62; + overflow: hidden; + text-overflow: ellipsis; + } + } + } + } + + .dropdown-link { + .actions { + display: flex; + padding: 1em; + svg { + width: 21px; + height: 21px; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + } + span { + color: #5f5c62; + } + } + } + } +} + +/* .navbar-header{ + @apply text-navbarheader float-left px-sm +} + +.navbar-subheader{ + @apply font-light px-sm border-solid border-l border-white border-opacity-100 +}*/ + +.side-bar-footer { + width: 200px; + margin-left: 50px; + margin-top: 24px; + margin-bottom: 16px; + position: relative; +} + +.digit-footer { + @apply flex h-4 mb-sm; + img { + @apply mr-sm; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/plusMinus.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/plusMinus.scss new file mode 100644 index 00000000000..d482a9a50b0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/plusMinus.scss @@ -0,0 +1,15 @@ +.PlusMinus { + text-align: center; + display: flex; + align-content: center; + justify-content: center; +} +.PlusMinusbutton{ + border: 1px solid theme(colors.border); + background-color: theme(colors.grey.mid); + color: theme(colors.text.secondary); + font-size: 27px; + font-weight: 400; + text-align: center; + width: 40px; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/popup.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/popup.scss new file mode 100644 index 00000000000..bf6e6d3d684 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/popup.scss @@ -0,0 +1,16 @@ +.popup-wrap { + background: rgba(0, 0, 0, 0.7); + @apply flex fixed w-full h-full overflow-auto top-0 left-0 min-h-screen; + z-index: 10000; +} + +@screen dt { + .popup-wrap { + background: rgba(0, 0, 0, 0.7); + @apply min-h-screen; + } +} + +.popup-close-icon{ + @apply flex justify-end; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/radiobtn.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/radiobtn.scss new file mode 100644 index 00000000000..74b73623789 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/radiobtn.scss @@ -0,0 +1,45 @@ +.radio-wrap { + @apply my-sm block leading-10 mb-lg; + + div { + @apply block mb-md; + } + + .radio-btn-wrap { + @apply block float-left relative; + &:hover { + .radio-btn-checkmark { + @apply border-primary-main; + } + } + } + + .radio-btn { + @apply opacity-0 absolute cursor-pointer h-10 w-10; + } + + .radio-btn-checkmark { + @apply h-10 w-10 border border-input-border border-solid rounded-full block; + } + + label { + @apply text-text-primary text-form-field ml-md; + } + + .radio-btn-checkmark:after { + content: ""; + } + + .radio-btn-wrap input:checked ~ .radio-btn-checkmark { + @apply border-2 border-primary-main; + } + + .radio-btn-wrap input:checked ~ .radio-btn-checkmark:after { + @apply block bg-primary-main h-5 w-5 rounded-full absolute top-10 left-10; + } +} +.reverse-radio-selection-wrapper{ + div{ + @apply flex flex-row-reverse place-content-between items-center; ; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/ratingstar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/ratingstar.scss new file mode 100644 index 00000000000..e3429ab698d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/ratingstar.scss @@ -0,0 +1,33 @@ +.rating-star-wrap { + @apply flex w-full mb-lg; + img { + width: 40px; + height: 38px; + display: block; + @apply mr-sm; + } + + svg { + width: 40px; + height: 38px; + display: block; + @apply mr-sm; + } +} + +@screen dt { + .rating-star-wrap { + @apply w-2/5; + } +} + +.rating-with-text { + @apply flex place-items-center w-full; + + svg { + width: 24px; + height: 38px; + display: block; + @apply mr-sm; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/roundedLabel.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/roundedLabel.scss new file mode 100644 index 00000000000..ae734267665 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/roundedLabel.scss @@ -0,0 +1,10 @@ +.roundedLabel { + width: 24px; + height: 24px; + border-radius: 15px; + position: absolute; + z-index: 100; + bottom: 10px; + right: 70px; + @apply ml-sm bg-error text-center text-white; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/searchAction.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/searchAction.scss new file mode 100644 index 00000000000..69d908acf19 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/searchAction.scss @@ -0,0 +1,20 @@ +.searchBox { + @apply flex m-sm justify-between; + .searchAction { + position: relative; + @apply flex flex-row text-focus; + .searchText { + @apply ml-sm; + } + } +} + +.svgPrimaryH16px{ + svg{ + width: 18px; + @apply h-6; + path{ + fill: theme(colors.primary.main); + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sectionalDropdown.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sectionalDropdown.scss new file mode 100644 index 00000000000..c62103e66a7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sectionalDropdown.scss @@ -0,0 +1,43 @@ +.sect-dropdown-wrap { + @apply mb-lg relative; + + .sect-dropdown-input-wrap { + @apply block w-full h-10 border border-solid border-input-border; + + input[type="text"] { + width: calc(100% - 32px); + @apply h-full outline-none text-text-primary text-form-field pl-sm; + } + p { + padding-top: 9px; + @apply text-form-field text-text-primary float-left ml-sm; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + } + + .sect-dropdown-card { + width: 100% !important; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + @apply absolute z-10 mt-xs pb-sm bg-white; + + h1 { + @apply pl-sm pt-md text-text-primary text-form-field; + } + + p { + padding-left: 21px; + @apply w-full pt-sm text-text-secondary text-form-field; + + &:hover { + @apply bg-grey-mid; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/selectdropdown.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/selectdropdown.scss new file mode 100644 index 00000000000..98ef8ec40fd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/selectdropdown.scss @@ -0,0 +1,174 @@ +/*.select { + + @apply mb-lg block border-2 border-input-border border-solid outline-none rounded-none w-full h-10 bg-white leading-10; + + option { + @apply h-10 text-form-field text-text-primary align-top text-left; + } + + } + +.select:active { + @apply border-focus border-2; +} + +@screen dt { + .select { + @apply w-2/5; + } +} +*/ +.employee-select-wrap { + @apply mb-lg relative; + + .select { + @apply relative block w-full h-10 border border-solid border-input-border; + &:hover { + @apply border-2 border-solid border-primary-main; + } + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + padding-top: 9px; + @apply text-form-field text-text-primary float-left ml-sm; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .select-active { + @apply relative block w-full h-10 border-2 border-solid border-primary-main; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + @apply text-form-field text-text-primary float-left ml-sm; + } + + p { + padding-top: 9px; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .options-card { + width: 100% !important; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + max-height: 400px; + overflow: auto; + @apply absolute z-20 mt-xs bg-white max-w-full; + + p { + padding-top: 14px; + @apply w-full h-12 pl-sm text-text-primary text-form-field; + + &:hover { + @apply bg-grey-mid; + } + } + } +} + +.employee-select-wrap--elipses { + width: 85% !important; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.select-wrap { + @apply mb-lg relative; + max-width: 540px; + + .select { + @apply relative block w-full h-10 border border-solid border-input-border; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + padding-top: 9px; + @apply text-form-field text-text-primary float-left ml-sm; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .select-active { + @apply relative block w-full h-10 border-2 border-solid border-primary-main; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + @apply text-form-field text-text-primary float-left ml-sm; + } + + p { + padding-top: 9px; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .options-card { + width: 100% !important; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + @apply absolute z-20 mt-xs bg-white; + + p { + padding-top: 14px; + @apply w-full h-12 pl-sm text-text-primary text-form-field; + + &:hover { + @apply bg-grey-mid; + } + } + } +} + +@screen dt { +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sidebar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sidebar.scss new file mode 100644 index 00000000000..6a04adffdc2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/sidebar.scss @@ -0,0 +1,141 @@ +.sidebar-link:hover .arrow { + display: block; +} + +.hidden-arrow { + display: none; +} +.new-dropdown-link{ + display: flex; + align-items: center; + justify-content: space-between; + padding: 10px 15px 15px !important; + color: #fff; + font-size: 1rem; + font-weight: 500; + text-decoration: none; + margin-left: 0px !important; + height: 3rem !important; + margin-left: 1rem; + margin-top: 0.5rem; +} +.selected { + background-color: #e0e0e0; /* Change this to your desired highlight color */ +} + +.selected-item { + background-color: #e0e0e0; /* Set your desired background color for the selected item */ + color: #000; /* Set your desired text color for the selected item */ + /* Add any other styles you want to apply to the selected item */ +} +/* Style the container that acts as the viewport */ +.new-sidebar { + height: 90%; /* Set a fixed height for the viewport */ + overflow: scroll; /* Hide the scrollbar */ + + &::-webkit-scrollbar { + display: none; + } + + &::-webkit-scrollbar { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ + } +} + +/* Style the content inside the viewport */ +.new-sidebar > div { + height: auto; /* Allow content to expand vertically */ + overflow-y: auto; /* Enable vertical scrolling */ + overflow-x: hidden; + padding-right: 2px; /* Add space for the hidden scrollbar (adjust as needed) */ +} + +/* Style the scrollbar thumb to make it transparent */ +.new-sidebar > div::-webkit-scrollbar-thumb { + background: transparent; +} +.link-icon{ + width: 24px !important; + height: 26px !important; +} +.link-icon svg{ + width: 24px !important; + height: 26px !important; +} + +.employee-search-input{ + width: 150px; + background-color: transparent; + &.nav-bar { + color:#fff; + } + &.nav-bar::placeholder { + color: #fff; + } +} + +.search-icon-wrapper-new { + margin-left: 0.35rem; +} + +.search-icon-wrapper-new svg{ + fill: theme(colors.white) !important; + width: 21px; + height: 21px; +} +.search-icon-wrapper-new svg path { + fill: theme(colors.white) !important; + } + +.submenu-container { + overflow: scroll; + margin-bottom: 1rem; + /* Hide the scrollbar */ + &::-webkit-scrollbar { + display: none; + } + + &.level-2 { + border-left: 1px solid; + margin-left: 2rem; + } + &.level-1 { + margin-left: -1.5rem; + } +} + +.actions { + &.level-0 { + margin-left: 0.4rem; + } + &.selected-action-level-0 { + color: theme(colors.primary.main) !important; + } + &.selected-action-level-1 { + border-left:4px solid theme(colors.primary.main); + margin-left: -0.6rem; + height: 2rem; + color: theme(colors.primary.main) !important; + } + + &.default-0 { + &.active { + + } + } + &.default-1 { + margin-left: -0.6rem; + height: 2rem; + width: 111% !important; + } + + + &.custom { + margin-left: 0.3rem; + } + &:hover { + background-color: #6A8E9D; + opacity: 0.8; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticDynamicMessages.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticDynamicMessages.scss new file mode 100644 index 00000000000..cbf0b895528 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticDynamicMessages.scss @@ -0,0 +1,107 @@ +.pay-whatsapp-card{ + display: flex; + justify-content: space-between; + cursor: pointer; +} +.pay-whatsapp-text{ + color: #25D366; + float: left; + font-family: 'Roboto'; + font-size: 16px; + font-weight: 700; +} +.dynamicDataCard{ + background: rgba(244, 119, 56, 0.12); + mix-blend-mode: normal; + height: auto; + max-height: 64px; + border-radius: 4px; + margin-bottom: 16px; +} +.dynamicData{ + padding: 10px 16px 16px 16px; + display: flex; +} +.dynamicData-content{ + font-family: 'Roboto'; + font-size: 14px; + font-weight: 400; + padding-top: 4px; + word-break: break-word; + margin-inline: 20px; +} +.staticDataCard{ + background: rgba(238, 238, 238, 1); + mix-blend-mode: normal; + height: auto; + max-height: 100px; + border-radius: 4px; + margin-bottom: 16px; +} +.staticData{ + display: flex; +} +.timerIcon{ + padding: 16px 0px 16px 16px; +} +.static-data-content{ + display: grid; + margin-inline: 20px; + padding-top: 8px; +} +.rupeeSymbol{ + padding: 16px 0px 16px 16px; +} +.validityIcon{ + padding: 16px 0px 16px 8px; +} +.static-data-content-first{ + font-family: 'Roboto'; + font-size: 14px; + font-weight: 400; +} +.static-data-content-second{ + font-family: 'Roboto'; + font-size: 16px; + font-weight: 700; + word-break: break-word; +} +.staticDataCardLast{ + background: rgba(238, 238, 238, 1); + mix-blend-mode: normal; + height: 56px; + border-radius: 4px; +} +.whatsAppIconG{ + float: right; +} +.static-home-Card{ + display: flex; + justify-content: space-between; +} +.static-home-Card-header{ + font-family: 'Roboto'; + font-size: 16px; + font-weight: 700; + float: left; +} +.helplineIcon{ + float: right; +} +.call-center-card-text{ + display: grid; +} +.call-center-card-content{ + float: left; +} +.serviceCentrIcon{ + float: right; +} +.service-center-details-card{ + display: flex; + overflow-wrap: break-word; +} +.service-center-details-text{ + float: left; + width: 180px; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticSideBar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticSideBar.scss new file mode 100644 index 00000000000..b87fa57e830 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/staticSideBar.scss @@ -0,0 +1,27 @@ +.sidebar-menu { + display: flex; + flex-direction: column; + padding-top: 16px; + padding-left: 16px; + padding-right: 16px; + color: #757575; + + .menu-item { + display: flex; + cursor: pointer; + min-height: 48px; + margin: 0; + padding: 0; + .menu-item-icon { + svg { + color: #757575; + fill: #757575; + width: 21px; + height: 21px; + } + } + .menu-item-text { + margin-left: 1em; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/statushighlight.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/statushighlight.scss new file mode 100644 index 00000000000..ef564ab082b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/statushighlight.scss @@ -0,0 +1,17 @@ +.status-highlight { + --bg-opacity: 12% !important; + border-radius: 16px; + @apply h-8 w-20 bg-error mb-sm; + + p { + padding-top: 6px; + @apply block text-center text-caption-m text-error cursor-pointer; + } + + &.success { + @apply bg-success; + p { + @apply text-success; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/submiterrors.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/submiterrors.scss new file mode 100644 index 00000000000..f0f6c92c715 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/submiterrors.scss @@ -0,0 +1,11 @@ +.error-message-wrap { + @apply w-full mb-sm p-md border-4 border-solid border-error; + + h2 { + @apply font-bold text-caption-m block mb-sm; + } + + p { + @apply font-bold text-caption-m text-error block; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/summary.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/summary.scss new file mode 100644 index 00000000000..3c044a0cacb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/summary.scss @@ -0,0 +1,29 @@ +.summary-wrapper { + @apply flex justify-around; + + .wrapper-child { + @apply flex flex-col justify-center flex-grow; + } + + .blocks { + display: flex; + margin-bottom: 25px; + + p:only-child { + font-weight: bold; + font-size: 24px; + } + + div { + margin-right: 25px; + + p:not(:first-child) { + font-weight: bold; + font-size: 24px; + } + } + } +} +.summary-card-margin{ + margin:0 24px 20px 0px !important; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/table.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/table.scss new file mode 100644 index 00000000000..379af9fa6a1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/table.scss @@ -0,0 +1,201 @@ +.table { + @apply bg-white w-full; + + thead { + th { + padding: 20px 18px; + @apply font-bold align-middle text-left; + &:first-child { + min-width: 256px; + } + &:nth-child(2) { + min-width: 200px; + } + } + } + + + tbody { + border: none; + padding: 0; + margin: 0; + td { + @apply border-t border-border text-left align-middle; + padding: "20px 18px"; + } + } +} + +.pagination { + display: flex; + justify-content: flex-end; + background-color: rgba(255, 255, 255, var(--bg-opacity)); + border-top: 1px solid rgb(214, 213, 212); + padding: 20px 40px 20px 0px; + color: rgb(80, 90, 95); + + svg { + fill: theme(colors.text.secondary); + @apply ml-md; + } +} + +.pagination button:nth-child(1) span::after { + content: "\f105"; +} + +.fullWidth { + width: 100% !important; +} + +.customTable { + width: 100%; + th { + font-weight: bold; + } + + th, + td { + text-align: left; + border-bottom: 1px solid #b1b4b6; + padding: 15px 10px; + } + + tr:nth-child(odd) { + background-color: theme(colors.grey.mid); + } + tr:nth-child(even) { + background-color: #fff; + } + + thead { + tr:first-child { + background-color: unset; + } + } +} + +.table-fixed-first-column { + thead { + th:first-child { + position: sticky; + background: #fff; + left: 0; + border-right: 1px solid #b1b4b6; + border-top-left-radius: 4px; + } + } + tbody { + td:first-child { + position: sticky; + background: #fff; + color: theme(colors.primary.main); + left: 0; + border-right: 1px solid #b1b4b6; + } + } +} + +.table-fixed-last-column { + thead { + th:last-child { + position: sticky; + background: #fff; + right: 0; + left:0; + border-top-left-radius: 4px; + } + } + tbody { + td:last-child { + position: sticky; + background: #fff; + color: theme(colors.primary.main); + left: 0; + right:0; + } + } +} + +.table-fixed-column-common-pay { + thead { + th:first-child { + position: sticky; + background: rgb(238, 238, 238); + left: 0; + border-top-left-radius: 4px; + } + th:last-child { + position: sticky; + background: rgb(238, 238, 238); + right: 0; + border-top-left-radius: 4px; + } + } + tbody { + td:first-child { + position: sticky; + background: rgb(238, 238, 238); + left: 0; + } + td:last-child { + position: sticky; + background: rgb(238, 238, 238); + right: 0; + } + } +} + +.table-fixed-first-second-column { + thead { + th:nth-child(2) { + position: sticky; + left: 0; + background-color: white; + } + } + tbody { + td:nth-child(2) { + position: sticky; + left: 0; + background-color: inherit; + } + } +} +.table-border-style { + border: 1px solid #b1b4b6; + border-radius: 4px; + border-spacing: 0; + border-collapse: separate; +} +.dss-table-wrapper { + width: 100%; + display: block; + overflow-x: auto; + table { + th { + .tooltip { + min-width: 80px; + } + } + tr { + td { + span { + white-space: pre; + min-width: 80px; + } + } + } + } +} + +.reports-table { + margin-top: 2rem; + thead { + th { + &:first-child { + min-width: unset; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/tag.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/tag.scss new file mode 100644 index 00000000000..0d0d0e9b347 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/tag.scss @@ -0,0 +1,27 @@ +.tag-container { + @apply flex flex-wrap mb-md; + .tag { + @apply bg-grey-mid rounded-2xl pt-sm pb-sm flex justify-between items-center; + padding-left: 12px; + padding-right: 12px; + font-size: 14px; + margin-left: 2px; + height: 2rem; + margin-top: 1rem; + .text { + padding-right: 5px; + max-width: calc( 100% - 24px ); + height: 22px; + overflow: hidden; + text-overflow: clip; + } + + &:hover { + @apply cursor-pointer; + + .close { + fill: black; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/telephone.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/telephone.scss new file mode 100644 index 00000000000..7b711d21f76 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/telephone.scss @@ -0,0 +1,17 @@ +.telephone { + @apply flex items-baseline; + img, + svg { + height: 22px; + width: 20px; + @apply text-primary-main ml-sm items-center; + } + + p { + @apply text-text-primary text-body-l pl-sm; + } +} + +.call { + @apply flex text-text-secondary text-body-l; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss new file mode 100644 index 00000000000..715140131c0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss @@ -0,0 +1,96 @@ +.card-input { + @apply mb-lg pl-sm outline-none mt-sm block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.employee-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} +.employee-card-input:disabled { + @apply border-grey-dark text-grey-dark !important; + pointer-events: none !important; +} +.employee-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + background: theme(colors.grey.mid); + border-right: 0; + padding-right: 5px; +} +.employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.card-textarea, +.employee-card-textarea { + @apply block outline-none mt-md mb-lg border w-full border-input-border border-solid bg-white h-24 text-form-field text-text-primary p-sm; +} + +.inputWrapper { + display: flex; + justify-content: flex-start; + max-width: 500px; + + div { + max-width: 80px; + } + + span { + margin-top: 16px; + margin-left: 10%; + margin-right: 10%; + } +} + +@screen dt { + .card-input { + width: 480px; + } + + .card-input-emp { + width: 240px; + } + + .card-input-error { + width: 480px; + } + + .employee-card-input { + @apply w-full; + } + + .employee-card-input-error { + @apply w-full; + } + + .card-textarea { + /* //width: 480px; */ + @apply w-full; + max-width:540px; + } + + .employee-card-textarea { + @apply w-full; + } + + .card-input-emp { + width: 240px; + } +} + +.citizen-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.citizen-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + background: theme(colors.grey.mid); + border-right: 0; + padding-right: 5px; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toast.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toast.scss new file mode 100644 index 00000000000..3a442bcf9d2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toast.scss @@ -0,0 +1,31 @@ +.toast-success { + max-width: 480px; + width: calc(100% - 20px); + bottom: 64px; + left: 0; + margin: 0 10px; + gap: 16px; + border-radius: 4px; + min-height: 48px; + @apply fixed flex bg-success leading-7 z-20 items-center pl-md pr-sm; + + svg { + height: 20px; + width: 20px; + } + + .toast-close-btn { + margin-left: auto; + } + + h2 { + @apply text-body-s-dt text-white; + } +} + +@screen dt { + .toast-success { + width: 100%; + left: calc(50% - 240px); + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toggleSwitch.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toggleSwitch.scss new file mode 100644 index 00000000000..6c09986db2e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/toggleSwitch.scss @@ -0,0 +1,41 @@ +.react-switch-checkbox { + height: 0; + width: 0; + visibility: hidden; + } + + .react-switch-label { + display: flex; + align-items: center; + justify-content: space-between; + cursor: pointer; + width: 50px; + height: 20px; + background: white; + border-radius: 100px; + position: relative; + transition: background-color .2s; + border: 1px solid #bbb; + } + + .react-switch-label .react-switch-button { + content: ''; + position: absolute; + top: 2px; + left: 2px; + width: 14px; + height: 14px; + border-radius: 45px; + transition: 0.2s; + background: theme(colors.primary.main); + box-shadow: 0 0 2px 0 rgba(10, 10, 10, 0.29); + } + + .react-switch-checkbox:checked + .react-switch-label .react-switch-button { + left: calc(100% - 2px); + transform: translateX(-100%); + } + + .react-switch-label:active .react-switch-button { + width: 45px; + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/topbar.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/topbar.scss new file mode 100644 index 00000000000..56bbd8426ec --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/topbar.scss @@ -0,0 +1,153 @@ +.topbar { + position: fixed; + top: 0; + width: 100%; + padding: 10px 24px; + background: white; + box-shadow: rgba(0, 0, 0, 0.24) 0 1px 4px; + z-index: 9999999; + @apply flex items-center; + + img { + display: inline; + + &.city { + margin-right: 8px; + height: 48px; + width: 48px; + } + + &.state { + height: 20px; + max-height: 20px; + width: auto; + } + } + + .ulb { + font-weight: bold; + display: inline-block; + } + + .right { + float: right; + margin-top: 12px; + position: relative; + + svg { + display: inline; + } + + .user-img-txt { + background: theme(colors.primary.main); + padding: 10px 15px; + border-radius: 50%; + color: white; + font-weight: 700; + } + } + + .left { + float: left; + } + + .w-80 { + width: 70%; + } + + .width-20 { + width: 30%; + } + + .margin-top-6 { + margin-top: 6px; + } + + .margin-right-30 { + margin-right: 30px; + } + + .margin-top-10 { + margin-top: 10px; + } + + .icon { + display: block; + color: rgb(117, 117, 117); + fill: rgb(117, 117, 117); + height: 21px; + width: 21px; + } + + .column-gap-15 { + column-gap: 15px; + } + + .column-gap-5 { + column-gap: 5px; + } + + .select-wrap, + .employee-select-wrap { + margin-bottom: 0px; + .profile-dropdown--item { + span { + white-space: pre; + } + } + } +} + +.cp { + cursor: pointer; + .hamburger { + display: none; + } + + @media (max-width: 780px) { + .hamburger { + display: none; + } + } +} + +.citizen { + .right { + margin-top: 5px; + margin-bottom: 5px; + } + + .topbar-select-wrap { + margin-bottom: 0; + } + + .flex-between { + @apply flex items-center justify-between; + } +} + +.profile-dropdown--item { + display: flex; + flex-direction: row; + padding: 10px; + column-gap: 10px; + color: theme(colors.text.secondary); + + &:hover { + background: theme(colors.grey.mid); + } +} + +.flex-right { + @apply flex items-center justify-end; + min-width: 85px; +} +video::-webkit-media-controls-panel { + top: 55%; + position: absolute; + width: 100%; +} + +.topbarOptionsClassName { + right: -3rem !important +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/uploadcomponents.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/uploadcomponents.scss new file mode 100644 index 00000000000..349f2f9b524 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/components/uploadcomponents.scss @@ -0,0 +1,100 @@ +.upload-wrap { + @apply flex w-full h-40 bg-grey-light relative mb-lg px-sm border border-border border-dashed; + max-width: 540px; + + img { + display: block; + margin-top: 58px; + margin-left: calc(50% - 23px); + height: 42px; + width: 46px; + } + + svg { + display: block; + margin-top: 58px; + margin-left: calc(50% - 23px); + height: 42px; + width: 46px; + } + + input { + @apply absolute w-full h-full opacity-0 top-0; + } +} + +.multi-upload-wrap { + @apply flex mb-lg; + + div { + display: block; + position: relative; + background-color: theme(colors.grey.light); + width: calc((100% - 16px) / 3); + margin-right: 8px; + + .delete { + position: absolute; + height: 24px; + width: 24px; + border-radius: 100%; + top: 2px; + right: 2px; + } + } + + .upload-img-container { + border: 1px dashed theme(colors.border); + margin: 0 !important; + + img { + margin-left: auto; + margin-right: auto; + padding-top: calc(33% - 21px); + } + + svg { + @apply flex; + margin: auto; + } + + svg { + margin-left: auto; + margin-right: auto; + top: calc(50% - 21px); + position: relative; + } + + input { + @apply absolute w-full h-full opacity-0 top-0; + } + } +} + +.upload-file-max-width { + max-width: 540px; +} + +.upload-file { + min-height: 56px; + @apply relative border border-input-border w-full; + + div { + @apply flex flex-row h-full items-center pl-md mt-sm flex-wrap; + + .file-upload-status { + @apply text-body-s-dt ml-sm; + } + } + input { + width: 160px; + @apply absolute top-0 left-0 opacity-0 h-full; + } +} + +@screen dt { + .multi-upload-wrap img { + width: 100%; + height: 158px; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ErrorMessage.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ErrorMessage.scss new file mode 100644 index 00000000000..07117cc830e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ErrorMessage.scss @@ -0,0 +1,6 @@ +@import url("../index.scss"); + +.digit-error-message { + @extend .alert-error; + @apply block text-body-s mb-md; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/FormComposerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/FormComposerV2.scss new file mode 100644 index 00000000000..1fe70a1b7b4 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/FormComposerV2.scss @@ -0,0 +1,120 @@ +@import url("../index.scss"); + +.field-container { + display: flex; + align-items: center; + max-width: 540px; + @apply flex items-center; + + .component-in-front { + @apply flex justify-center items-center; + @extend .light-background; + @extend .light-input-border; + margin-top: 0; + border: 1px solid; + border-right: none; + padding: 7px; + } +} + +.card-date-input { + @apply absolute top-0 left-0 w-3/4 bg-white pl-sm border border-input-border border-solid border-r-0; + outline: transparent solid 1px; + height: 2.5rem; + @extend .light-input-border; +} +.text-input-width { + max-width: 540px; +} + +.text-input { + @apply relative w-full; + input { + background-color: transparent; + &:hover { + @apply border-2 border-solid border-primary-main; + @extend .light-input-border; + } + } +} +.employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; +} +.card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; +} + +.employee-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; +} +.employee-card-input:disabled { + @apply border-grey-dark text-grey-dark !important; + pointer-events: none !important; + @extend .light-input-border; + @extend .light-text-color-disabled; +} +.employee-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + /* background: theme(colors.grey.mid); */ + @extend .light-background; + border-right: 0; + padding-right: 5px; +} +.employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; +} + +.card-textarea, +.employee-card-textarea { + @apply block outline-none mt-md mb-lg border w-full border-input-border border-solid bg-white h-24 text-form-field text-text-primary p-sm; + @extend .light-input-border; +} +.employee-card-textarea { + @apply w-full; +} + +.citizen-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; +} +.citizen-card-input--front { + @extend .light-background; + width: fit-content !important; + display: flex; + align-items: center; + /* background: theme(colors.grey.mid); */ + border-right: 0; + padding-right: 5px; +} + +.break-line { + @extend .light-input-border; + @apply border-border my-lg; +} + +.primary-label-btn { + @apply flex; + gap: 10px; + + svg { + fill: theme(colors.primary.main); + } + + @extend .light-primary; + cursor: pointer; + font-weight: 500; + width: fit-content; +} + +.digit-form-composer-header{ + font-size:theme(digitv2.fontSize.heading-l-dt); +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionLinkV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionLinkV2.scss new file mode 100644 index 00000000000..c41b0b25d07 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionLinkV2.scss @@ -0,0 +1,7 @@ +@import url("../index.scss"); + +.digit-action-links { + @extend .light-primary; + @apply text-text-btn mr-lg !important; + cursor: pointer; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionbarV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionbarV2.scss new file mode 100644 index 00000000000..e5a69acd35e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/actionbarV2.scss @@ -0,0 +1,110 @@ +@import url("../index.scss"); + +.digit-action-bar-wrap { + @extend .light-text-color-primary; + @extend .light-paper-primary; + box-shadow: rgba(0, 0, 0, 0.16) 0 -2px 8px; + max-width: 100%; + z-index: 100; + + @apply left-0 bottom-0 w-full bg-white py-sm px-sm fixed text-right; + + div { + @apply w-full; + } + + .digit-menu-wrap { + @apply absolute bg-white text-left mb-xs z-30 cursor-pointer; + @extend .light-background; + bottom: 45px; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + width: calc(100% - 16px); + right: 8px; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + @extend .light-primary; + + &:hover { + @apply bg-grey-mid w-full; + @extend .light-background; + } + } + } +} + +@screen dt { + .digit-action-bar-wrap { + box-shadow: rgba(0, 0, 0, 0.16) 0 -2px 8px; + left: 0; + max-width: none; + z-index: 999; + + @apply fixed bottom-0 bg-white py-sm pr-lg text-right; + /* @extend .light-background; */ + + div { + width: calc(100% - 16px); + } + + .digit-menu-wrap { + bottom: 45px; + top: unset; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + @apply absolute h-auto bg-white text-left mb-xs z-30; + width: 240px; + right: 24px; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + + &:hover { + @apply bg-grey-mid w-full; + /* @extend .light-background; */ + } + } + } + } +} + +.digit-action-bar-wrap-registry { + div { + @apply w-full; + } + .digit-menu-wrap { + @apply absolute bg-white text-left mb-xs z-30 cursor-pointer; + box-shadow: rgba(0, 0, 0, 0.14) 0 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px, rgba(0, 0, 0, 0.2) 0 5px 5px -3px; + width: 160px; + right: 60px; + @extend .light-background; + + div { + @apply h-12 pl-sm py-md text-body-l text-text-primary; + + &:hover { + @apply bg-grey-mid w-full; + @extend .light-background; + } + } + } + + .digit-search-add { + padding: 12px 16px; + @extend .light-primary; + color: rgb(244, 119, 56); + display: flex; + cursor: pointer; + } + + .digit-search-add-icon { + @extend .light-primary-button; + background: rgb(244, 119, 56); + border-radius: 50%; + height: 24px; + width: 24px; + display: flex; + justify-content: center; + align-items: center; + margin-left: 10px; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/appContainerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/appContainerV2.scss new file mode 100644 index 00000000000..fda32e93240 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/appContainerV2.scss @@ -0,0 +1,55 @@ +@import url("../index.scss"); + +.app-container { + @extend .light-background; + width: 100%; + form { + .card { + max-width: 960px; + h2 { + @extend .light-text-color-primary; + text-align: left; + } + .field-container { + max-width: 540px; + } + button { + @extend .light-primary-button; + max-width: 240px; + } + .input-otp-wrap, + .card-text-button { + @extend .light-primary-button; + text-align: left; + } + } + } +} + +@screen dt { + .employee-app-container { + @apply w-full; + } + + .app-container { + width: 100%; + form { + .card { + max-width: 960px; + h2 { + text-align: left; + } + .field-container { + max-width: 540px; + } + button { + max-width: 240px; + } + .input-otp-wrap, + .card-text-button { + text-align: left; + } + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/backButtonV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/backButtonV2.scss new file mode 100644 index 00000000000..68f7cf957c0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/backButtonV2.scss @@ -0,0 +1,26 @@ +@import url("../index.scss"); + +.digit-back-button { + @extend .light-text-color-primary; + @extend .light-input-border; + width: fit-content; + @apply flex items-center cursor-pointer border-b font-rc text-text-btn ml-sm mb-md; + + img { + @apply flex; + } + + svg { + @apply flex; + } + + p { + @apply flex; + } +} + +@screen dt { + .digit-back-button { + margin-left: 0; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bannerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bannerV2.scss new file mode 100644 index 00000000000..06c16970a7f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bannerV2.scss @@ -0,0 +1,120 @@ +@import url("../index.scss"); + +.digit-banner-success-wrap, +.digit-banner-emp-success-wrap { + @apply block bg-success w-full text-center text-white pt-md pb-sm mb-md; + + header { + @apply block mb-sm font-rc font-bold text-heading-xl; + } + + div { + img { + padding: 13.67px; + margin-left: auto; + margin-right: auto; + @apply border border-solid border-white rounded-full h-16 w-16 bg-white mb-md; + } + + svg { + padding: 13.67px; + margin-left: auto; + margin-right: auto; + @apply border border-solid border-white rounded-full h-16 w-16 bg-white mb-md; + } + + svg.payment-svg { + border: unset; + background-color: unset; + @apply rounded-full; + } + + h2 { + @apply font-bold text-caption-m mb-sm; + } + + p { + @apply font-bold text-caption-l; + } + } +} + +.digit-banner-error-wrap, +.digit-banner-emp-error-wrap { + @apply block bg-error w-full text-center text-white pt-md pb-sm mb-md; + + + header { + @apply block mb-sm font-rc font-bold text-heading-xl; + } + + img { + margin-left: auto; + margin-right: auto; + padding: 13.67px; + @apply border border-solid border-white rounded-full bg-white h-16 w-16 mb-md; + } + + svg { + margin-left: auto; + margin-right: auto; + padding: 13.67px; + @apply border border-solid border-white rounded-full bg-white h-16 w-16 mb-md; + } +} + +@screen dt { + .digit-banner-success-wrap { + header { + @apply text-heading-xl-dt; + } + } + .digit-banner-emp-success-wrap { + width: calc(100%); + header { + @apply text-heading-xl-dt; + } + } + + .digit-banner-error-wrap { + width: 100%; + header { + @apply text-heading-xl-dt; + } + } + + .digit-banner-emp-error-wrap { + width: calc(100%); + header { + @apply text-heading-xl-dt; + } + } +} + +.banner { + @apply flex justify-center items-center; + height: calc(100vh - 80px); + background: linear-gradient(rgba(11, 75, 102, 0.8), rgba(11, 75, 102, 0.8)), var(--banner-url) center center; + + .bannerCard { + min-width: 400px; + } + .bannerLogo { + width: 80px; + height: 40px; + object-fit: contain; + padding-right: 10px; + margin-right: 10px; + border-right: 1px solid theme(colors.text.primary); + } + .bannerHeader { + @apply flex justify-center items-center; + margin-bottom: 24px; + } +} + +.banner-container { + flex-direction: column; + justify-content: center; + align-items: center !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bodyContainerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bodyContainerV2.scss new file mode 100644 index 00000000000..9836a7104df --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/bodyContainerV2.scss @@ -0,0 +1,39 @@ +@import url("../index.scss"); + +body { + @extend .light-background; +} + +.body-container { + @extend .light-background; + @apply h-full min-h-screen overflow-x-hidden; +} + +.body-container::-webkit-scrollbar { + display: none; +} + +.h1 { + @extend .light-text-color-primary; + @apply text-heading-l font-bold mb-md ml-md; +} + +.link-label { + @extend .light-primary; + @apply block mb-md ml-md cursor-pointer; + + &:hover { + @extend .light-text-color-primary; + } +} + +@screen dt { + .h1 { + margin-left: 0; + @apply text-heading-l-dt; + } + + .link-label { + margin-left: 0; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breadCrumbV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breadCrumbV2.scss new file mode 100644 index 00000000000..2b13c868290 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breadCrumbV2.scss @@ -0,0 +1,31 @@ +@import url("../index.scss"); + +.digit-bread-crumb { + @extend .light-text-color-secondary; + font-size: 14px; + display: flex; + margin-bottom: 10px; +} +.digit-bread-crumb--item { + margin-left: 5px; + + &:not(:last-child):after { + content: " /"; + } + + button { + outline: none; + } + + .last { + @extend .light-text-color-primary; + } + + span { + cursor: pointer; + } +} +ol, +ul { + list-style: none; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breakLineV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breakLineV2.scss new file mode 100644 index 00000000000..1b67e4bcc81 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/breakLineV2.scss @@ -0,0 +1,6 @@ +@import url("../index.scss"); + +.digit-break-line { + @apply border-solid border-2; + @extend .light-input-border; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/buttonsV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/buttonsV2.scss new file mode 100644 index 00000000000..13334e22958 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/buttonsV2.scss @@ -0,0 +1,40 @@ +@import url("../index.scss"); + +.digit-button-primary { + height: fit-content; + @extend .light-primary-button; + @apply text-center cursor-pointer outline-none px-lg; + + &.disabled { + opacity: 0.5; + } + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-white; + } +} + +.digit-button-secondary { + height: fit-content; + @extend .light-paper-secondary; + @apply text-center cursor-pointer border-primary-main border-b-2 border-solid outline-none px-lg; + + &:focus { + @apply outline-none; + } + + h2 { + @extend .light-primary; + @apply font-rc font-medium text-legend; + } + .disabled { + opacity: 0.5; + } +} + +.submit-bar:focus { + @apply outline-none !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/cardV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/cardV2.scss new file mode 100644 index 00000000000..ee75e5a9689 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/cardV2.scss @@ -0,0 +1,385 @@ +@import url("../index.scss"); + +.digit-card { + @apply bg-white m-sm px-md pt-md pb-lg shadow-card; + @extend .light-paper-primary; + border-radius: 4px; + max-width: 960px; + + .digit-card-header { + @extend .light-primary; + @apply text-heading-xl font-bold font-rc align-middle text-left mb-md; + } + + .digit-card-sub-header { + @extend .light-primary; + @apply text-caption-xl font-bold align-middle text-left mb-sm; + } + + .digit-card-caption { + @extend .light-text-color-secondary; + @apply text-caption-xl mb-sm; + } + + .digit-card-text { + @extend .light-text-color-secondary; + @apply text-body-l align-middle text-left mb-lg; + + span { + @extend .light-text-color-primary; + } + } + + .digit-card-text-primary { + @extend .light-primary; + @apply text-body-l; + } + + .digit-card-text-button { + @extend .light-primary; + @apply text-text-btn; + } + + .digit-card-label { + @extend .light-primary; + @apply text-legend mb-sm; + } + + .digit-card-label-error { + @extend .alert-error; + @apply block text-body-s text-error mb-md; + } + + .digit-card-label-desc { + @extend .light-text-color-secondary; + @apply font-bold text-heading-s mb-md; + } + + .digit-card-link { + @extend .light-primary; + @apply block text-center text-link mt-md cursor-pointer; + } +} + +.digit-validation-error { + @extend .alert-error; + @apply block text-body-s text-error; +} + +.digit-docsDescription { + @extend .light-text-color-primary; +} + +.digit-field-container { + @apply flex items-center; +} + +.digit-employee-card { + @extend .light-paper-primary; + @apply shadow-card p-md mb-xl; + border-radius: 4px; + + .digit-card-header { + @extend .light-primary; + @apply text-heading-xl font-bold font-rc align-middle text-left mb-md; + } + + .digit-card-sub-header, + .digit-employee-card-sub-header { + @extend .light-primary; + @apply text-caption-xl font-bold align-middle text-left; + } + + .digit-card-section-header { + @extend .light-primary; + @apply text-heading-m font-bold; + } + + .digit-card-section-sub-text { + @extend .light-primary; + @apply text-body-s; + } + + .digit-card-caption { + @extend .light-text-color-secondary; + @apply text-caption-xl mb-sm; + } + + .digit-card-text { + @extend .light-text-color-secondary; + @apply text-body-l align-middle text-left mb-lg; + + span { + @extend .light-text-color-primary; + } + } + + .card-text-primary { + @extend .light-primary; + @apply text-body-l; + } + + .card-text-button { + @extend .light-primary; + @apply text-text-btn; + } + + .card-label { + @extend .light-primary; + @apply text-legend mb-md; + } + + .card-label-error { + @extend .alert-error; + @apply block text-body-s text-error mb-md; + } + + .card-label-desc { + @extend .light-text-color-secondary; + @apply font-bold text-heading-s mb-md; + } + + .card-link { + @extend .light-primary; + @apply block text-center text-link text-link-normal mt-md; + } + + .card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; + } +} + +.header-wrap { + @apply flex mb-md; + + .header-start { + margin-right: auto; + } + + .header-content { + } + + .header-end { + margin-left: auto; + } +} + +.card-emp { + @extend .card; + padding-right: 0; + padding-top: 0; + padding-left: 0; + @apply bg-white m-sm; + @extend .light-background; +} + +.submit-bar { + @extend .light-primary-button; + @apply h-10 text-center w-full outline-none; + box-shadow: inset 0px -2px 0px theme(colors.text.primary); + cursor: pointer; + + &:focus { + @apply outline-none; + } + + header { + @apply font-rc font-medium text-legend text-white leading-10; + } +} + +.submit-bar-disabled { + @apply h-10 bg-primary-main text-center w-full outline-none opacity-50; + + &:focus { + @apply outline-none; + } + + header { + @apply font-rc font-medium text-legend text-white leading-10; + } +} + +@screen dt { + .submit-bar, + .submit-bar-disabled { + width: 240px; + } + + .card { + display: flex; + flex-direction: column; + + .card-header { + @apply text-heading-xl-dt; + } + + .card-sub-header { + @apply text-heading-l-dt; + } + + .card-caption { + @apply text-caption-xl-dt; + } + + .card-text, + .card-text-primary { + @apply text-body-l-dt; + } + + .card-link { + @apply text-left; + } + } + + .digit-employee-card { + @apply mb-md mx-md !important; + + &.digit-filter { + margin-left: auto; + margin-right: auto; + } + + .digit-card-header { + @apply text-heading-xl-dt; + } + + .digit-card-sub-header { + @apply text-heading-l-dt; + } + + .digit-employee-card-sub-header { + margin-bottom: 40px; + @apply text-heading-l-dt; + } + + .digit-card-section-header { + margin-bottom: 40px; + @apply text-heading-m-dt; + } + + .digit-card-section-sub-text { + @apply text-text-primary text-body-s-dt; + } + + .digit-card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; + } + + .digit-card-caption { + @apply text-caption-xl-dt; + } + + .digit-card-text, + .digit-card-text-primary { + @apply text-body-l-dt; + } + + .digit-card-link { + @apply text-left; + } + + .digit-label-field-pair { + @apply flex items-center; + + h2 { + width: 30%; + } + + .field { + width: 50%; + margin-right: 20%; + .field { + margin-right: unset; + } + } + } + + .digit-field-container { + span { + border: 2px solid black; + background: rgb(247, 247, 247); + width: 40px; + height: 40px; + display: flex; + justify-content: center; + align-items: center; + margin-top: -16px; + border-right: none; + } + } + } + + .digit-header-wrap { + @apply flex mb-md; + + .header-start { + margin-right: auto; + } + + .header-content { + } + + .header-end { + margin-left: auto; + } + } +} + +.digit-card-section-header { + @extend .light-text-color-primary; + @apply text-text-primary text-heading-m font-bold; +} + +.digit-card-search-heading { + margin-right: 0px !important; + margin-left: 0px !important; + margin-bottom: 0px !important; + padding-bottom: 0px; + padding-left: 25px; +} + +.digit-card-label-error { + @extend .alert-error; + @apply block text-body-s text-error mb-md; +} + +.digit-employee-card-override { + margin-left: 0px !important; +} + +.digit-employee-application-details { + display: flex !important; + justify-content: space-between !important; + max-height: 60px !important; + height: 60px !important; +} +.digit-employee-main-application-details { + padding: 10px !important; +} + +.digit-employee-mulitlink-main-div { + @extend .light-primary; + z-index: 10 !important; + max-width: 41% !important; +} + +.digit-employee-download-btn-className { + position: unset !important; + display: flex !important; + justify-content: flex-end !important; +} + +.digit-employee-options-btn-className { + position: unset !important; + margin: 0 !important; + width: 100% !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkboxV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkboxV2.scss new file mode 100644 index 00000000000..c19cfe8c247 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkboxV2.scss @@ -0,0 +1,61 @@ +@import url("../index.scss"); + +.digit-checkbox-wrap { + @apply flex mb-md relative items-baseline; + + input { + width: 38px; + height: 38px; + @apply opacity-0 absolute top-0 left-0 z-10; + @extend .light-input-border; + } + + .input-emp { + @extend input; + width: 24px; + height: 24px; + } + + .digit-custom-checkbox { + width: 38px; + height: 38px; + @apply absolute top-0 left-0 border border-solid border-input-border z-0; + @extend .light-input-border; + + img { + @apply opacity-0; + } + + svg { + @apply opacity-0; + } + } + + .digit-custom-checkbox-emp { + @extend .digit-custom-checkbox; + width: 24px; + height: 24px; + } + + input:checked ~ .digit-custom-checkbox, + input:hover ~ .digit-custom-checkbox { + @apply border-2 border-primary-main; + @extend .light-input-border; + } + + input:checked ~ .digit-custom-checkbox img { + @apply opacity-100; + } + + input:checked ~ .digit-custom-checkbox svg { + @apply opacity-100; + width: 35px; + height: 35px; + } + + .label { + margin-left: 56px; + @apply text-form-field text-text-primary; + @extend .light-text-color-primary; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkpointV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkpointV2.scss new file mode 100644 index 00000000000..f751e8a910b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/checkpointV2.scss @@ -0,0 +1,71 @@ +@import url("../index.scss"); + +.digit-checkpoint-connect-wrap { + padding-bottom: 40px; + @apply relative; +} +.digit-checkpoint-done { + @apply flex items-center; + + h2 { + z-index: 1; + width: 24px; + height: 24px; + border-radius: 50%; + @apply border-b border-solid border-primary-main bg-primary-main; + } + + header { + @apply text-heading-s ml-md; + + p { + margin-top: 4px; + @extend .light-text-color-secondary; + @apply text-heading-s; + } + } +} + +.digit-checkpoint { + @apply flex items-center; + + h2 { + z-index: 1; + width: 24px; + height: 24px; + border-radius: 50%; + --text-opacity: 1; + @apply border-b border-solid border-border bg-border; + } + + header { + @apply text-heading-s ml-md; + + p { + margin-top: 4px; + @extend .light-text-color-secondary; + @apply text-heading-s; + } + } +} + +.digit-checkpoint-connect { + margin-left: 12px; + margin-top: 22px; + @apply absolute top-0 left-0 h-full border-l border-solid border-border; +} + +.digit-checkpoint-comments-wrap { + max-width: 560px; + @apply bg-grey-mid p-sm mt-sm; + + h4 { + @extend .light-text-color-primary; + @apply text-heading-s; + } + + p { + @extend .light-text-color-secondary; + @apply text-body-s-dt; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/collapseAndExpandGroups.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/collapseAndExpandGroups.scss new file mode 100644 index 00000000000..3e0b65a668d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/collapseAndExpandGroups.scss @@ -0,0 +1,60 @@ +@import url("../../digitv2/index.scss"); + +.digit-expand-collapse-wrapper { + display: flex; + flex-direction: column; + margin-top: 1rem; +} + +.digit-expand-collapse-header { + background-color: #f2f2f2; + display: grid; + grid-template-columns: 1fr 1fr; + align-items: center; + padding: 12px; + position: relative; + font-weight: bolder; + border: 1px solid #828282; + border-radius: 4px; +} + +.digit-icon-toggle { + position: absolute; + right: 10px; + top: 50%; + transform: translate(0%, -50%); + cursor: pointer; + span{ + display: inline-flex; + align-items: center; + + h5{ + color: theme(colors.primary.main); + display: inline; + } + } +} + +.digit-expand-collapse-header .label { + display: block; + text-align: left; +} + +.digit-expand-collapse-header .value { + display: block; + text-align: right; + margin-right: 2rem; +} + +.digit-toggling-wrapper.digit-collapse { + flex: none; + overflow: hidden; + height: 0; + transition: 0.2s ease-in-out; +} + +.digit-toggling-wrapper { + flex: 1; + transition: 0.2s ease-in-out; + box-sizing: border-box; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/dateWrapV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/dateWrapV2.scss new file mode 100644 index 00000000000..3d2dc3db77b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/dateWrapV2.scss @@ -0,0 +1,12 @@ +.digit-date-picker { + @apply relative w-full cursor-pointer; + .citizen { + max-width: 540px; + } + .digit-employee-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + width: calc(100%-62px); + padding-right: 9px; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/displayPhotosV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/displayPhotosV2.scss new file mode 100644 index 00000000000..77bd2d221bc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/displayPhotosV2.scss @@ -0,0 +1,33 @@ +.digit-photos-wrap { + max-width: 640px; + @apply flex pt-md; + + img { + width: calc(33% - 9.333px); + margin-right: 14px; + } + + svg { + width: calc(33% - 9.333px); + margin-right: 14px; + } + + .last { + width: calc(33% - 9.333px); + } +} + +.digit-image-pdf-icon { + @apply flex flex-wrap justify-start content-center; + .digit-url { + min-width: 100px; + margin-right: 10px; + max-width: 100px; + height: auto; + .digit-icon { + background: #f6f6f6; + padding: 8px; + width: 100px; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/headerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/headerV2.scss new file mode 100644 index 00000000000..9f514c0d983 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/headerV2.scss @@ -0,0 +1,6 @@ +@import url("../index.scss"); + +.digit-header { + @extend .light-text-color-primary; + @apply text-heading-l font-bold mb-md ml-md; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/infoBannerV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/infoBannerV2.scss new file mode 100644 index 00000000000..132ee6c0b96 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/infoBannerV2.scss @@ -0,0 +1,37 @@ +@import url("../index.scss"); + +.digit-info-banner-wrap { + @apply bg-opacity-25 m-sm p-md; + max-width: 960px; + + @extend .alert-info-bg; + border-radius: 4px; + svg { + margin-top: 5px; + @apply rounded-full; + } + + div { + @apply flex items-center; + } + + h2 { + @apply text-heading-m text-link-normal mb-md font-bold ml-sm; + } + + p { + @apply text-body-l text-link-normal whitespace-pre-line; + } +} + +@screen dt { + .digit-info-banner-wrap { + h2 { + @apply text-heading-m-dt; + } + + p { + @apply text-body-l-dt; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/keynoteV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/keynoteV2.scss new file mode 100644 index 00000000000..02fe872b5c6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/keynoteV2.scss @@ -0,0 +1,35 @@ +.digit-key-note-pair { + @apply mb-md; + + h3 { + margin-bottom: 4px; + @apply font-bold text-text-primary text-heading-s; + } + + p { + @apply text-text-primary text-body-l; + } + .digit-key-note-container { + display: inline-flex; + .digit-unmask-container { + display: inline-flex; + width: fit-content; + margin-left: 10px; + margin-top: 5px; + } + } + .digit-caption { + @apply text-body-l text-text-secondary; + } +} + +@screen dt { + .digit-key-note-pair { + p { + @apply text-body-l-dt; + } + .digit-caption { + @apply text-body-l-dt text-text-secondary; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/loaderV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/loaderV2.scss new file mode 100644 index 00000000000..7e435da688a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/loaderV2.scss @@ -0,0 +1,81 @@ +@import url("../index.scss"); + +.digit-screen-loader { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + z-index: 9999; + @extend .light-background; + .digit-ldio-pjg92h09b2o div { + position: absolute; + width: 52px; + height: 52px; + border: 12px solid theme(digitv2.lightTheme.primary); + border-top-color: transparent; + border-radius: 50%; + } +} + +.digit-page-loader, +.digit-module-loader { + text-align: center; +} + +.digit-page-loader { + padding-top: 88px; +} + +.digit-module-loader { + padding: 16px; +} + +@keyframes digit-ldio-pjg92h09b2o { + 0% { + transform: translate(-50%, -50%) rotate(0deg); + } + + 100% { + transform: translate(-50%, -50%) rotate(360deg); + } +} + +.digit-ldio-pjg92h09b2o div { + position: absolute; + width: 52px; + height: 52px; + border: 12px solid theme(colors.secondary); + border-top-color: transparent; + border-radius: 50%; +} + +.digit-ldio-pjg92h09b2o div { + animation: digit-ldio-pjg92h09b2o 1s linear infinite; + top: 50px; + left: 50px; +} + +.digit-loadingio-spinner-rolling-faewnb8ux8 { + width: 48px; + height: 48px; + display: inline-block; + overflow: hidden; + background: none; +} + +.digit-ldio-pjg92h09b2o { + width: 100%; + height: 100%; + position: relative; + transform: translateZ(0) scale(0.48); + backface-visibility: hidden; + transform-origin: 0 0; +} + +.digit-ldio-pjg92h09b2o div { + box-sizing: content-box; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/mobileNumberV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/mobileNumberV2.scss new file mode 100644 index 00000000000..5c7f6088047 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/mobileNumberV2.scss @@ -0,0 +1,33 @@ +@import url("../index.scss"); + +.digit-mobile-number-container { + @apply flex items-center; + + .digit-citizen-card-input--front { + @extend .light-background; + width: fit-content !important; + display: flex; + align-items: center; + /* background: theme(colors.grey.mid); */ + border-right: 0; + padding-right: 5px; + } + + .digit-citizen-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; + } + + .digit-citizen-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + background: theme(colors.grey.mid); + border-right: 0; + padding-right: 5px; + } + .digit-employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/multiSelectDropdownV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/multiSelectDropdownV2.scss new file mode 100644 index 00000000000..0862eebe234 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/multiSelectDropdownV2.scss @@ -0,0 +1,92 @@ +@import url("../index.scss"); + +.digit-multi-select-dropdown-wrap { + margin-bottom: 24px; + @apply relative text-form-field text-text-primary w-full; + .digit-master, + .digit-master-active { + @apply relative border border-solid border-input-border h-10 w-full; + input[type="text"] { + @apply absolute top-0 left-0 p-sm pl-sm min-h-full min-w-full opacity-0; + &:focus { + @apply outline-none; + } + } + .digit-label { + @apply flex justify-between p-sm w-full h-full; + svg { + @apply h-6 w-6; + } + } + + &:hover { + @apply border-2 border-solid border-primary-main; + } + } + + .digit-master-active { + @apply border-2 border-primary-main; + input[type="text"] { + @apply opacity-100; + } + .digit-label { + @apply hidden; + } + } + + .digit-server { + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + top: 40px; + + max-height: 20vmax; + overflow: scroll; + @apply absolute min-w-full z-20; + div { + @apply flex w-full bg-white; + justify-content: flex-start; + align-items: center; + &:hover { + @apply bg-grey-mid; + } + input { + height: 44px; + @apply absolute min-w-full opacity-0 z-20 cursor-pointer; + } + p { + padding: 12px; + margin-top: 5px; + margin-bottom: 5px; + @apply text-form-field text-text-primary; + } + .digit-custom-checkbox { + height: 28px; + width: 28px; + @apply border border-solid border-input-border m-sm; + svg { + @apply opacity-0 z-10; + } + } + input:checked ~ .digit-custom-checkbox, + input:hover ~ .digit-custom-checkbox { + @apply border-2 border-primary-main; + } + + input:checked ~ .digit-custom-checkbox svg { + @apply opacity-100; + } + } + } + .digit-cursorPointer { + @apply cursor-pointer; + } + .digit-master { + .digit-label { + p { + white-space: pre; + margin: auto; + margin-left: 0px; + padding-left: 1%; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/noresultsfoundV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/noresultsfoundV2.scss new file mode 100644 index 00000000000..aedadebe94f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/noresultsfoundV2.scss @@ -0,0 +1,11 @@ +.digit-no-data-found { + height: 100%; + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + .digit-error-msg { + margin-top: 2rem; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/otpInputV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/otpInputV2.scss new file mode 100644 index 00000000000..b16e2c90182 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/otpInputV2.scss @@ -0,0 +1,15 @@ +.digit-input-otp-wrap { + @apply mb-lg; + + input { + @apply border-2 border-solid border-input-border outline-none h-10 w-10 text-form-field text-text-primary mr-sm mb-sm text-center; + } + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + input[type="number"] { + -moz-appearance: textfield; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/popUpV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/popUpV2.scss new file mode 100644 index 00000000000..94f6fc0188a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/popUpV2.scss @@ -0,0 +1,16 @@ +.digit-popup-wrap { + background: rgba(0, 0, 0, 0.7); + @apply flex fixed w-full h-full overflow-auto top-0 left-0 min-h-screen; + z-index: 10000; +} + +@screen dt { + .digit-popup-wrap { + background: rgba(0, 0, 0, 0.7); + @apply min-h-screen; + } +} + +.digit-popup-close-icon { + @apply flex justify-end; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/radiobtnV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/radiobtnV2.scss new file mode 100644 index 00000000000..638271e149a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/radiobtnV2.scss @@ -0,0 +1,51 @@ +@import url("../index.scss"); + +.digit-radio-wrap { + @apply my-sm block leading-10 mb-lg; + + div { + @apply block mb-md; + } + + .digit-radio-btn-wrap { + @apply block float-left relative; + &:hover { + .digit-radio-btn-checkmark { + @apply border-primary-main; + } + } + } + + .digit-radio-btn { + @apply opacity-0 absolute cursor-pointer h-10 w-10; + } + + .digit-radio-btn-checkmark { + @extend .light-input-border; + @apply h-10 w-10 border border-input-border border-solid rounded-full block; + } + + label { + @extend .light-text-color-primary; + @apply text-text-primary text-form-field ml-md; + } + + .digit-radio-btn-checkmark:after { + content: ""; + } + + .digit-radio-btn-wrap input:checked ~ .digit-radio-btn-checkmark { + /* @extend .light-input-border; */ + @apply border-2 border-primary-main; + } + + .digit-radio-btn-wrap input:checked ~ .digit-radio-btn-checkmark:after { + /* @extend .light-background; */ + @apply block bg-primary-main h-5 w-5 rounded-full absolute top-10 left-10; + } +} +.digit-reverse-radio-selection-wrapper { + div { + @apply flex flex-row-reverse place-content-between items-center; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ratingV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ratingV2.scss new file mode 100644 index 00000000000..98e9e6d5642 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/ratingV2.scss @@ -0,0 +1,33 @@ +.digit-rating-star-wrap { + @apply flex w-full mb-lg; + img { + width: 40px; + height: 38px; + display: block; + @apply mr-sm; + } + + svg { + width: 40px; + height: 38px; + display: block; + @apply mr-sm; + } +} + +@screen dt { + .digit-rating-star-wrap { + @apply w-2/5; + } +} + +.digit-rating-with-text { + @apply flex place-items-center w-full; + + svg { + width: 24px; + height: 38px; + display: block; + @apply mr-sm; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/selectdropdownV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/selectdropdownV2.scss new file mode 100644 index 00000000000..a4f4118c91d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/selectdropdownV2.scss @@ -0,0 +1,170 @@ +.digit-employee-select-wrap { + @apply mb-lg relative; + + .digit-select { + @extend .light-input-border; + @apply relative block w-full h-10 border border-solid border-input-border; + &:hover { + @extend .light-input-border; + @apply border-2 border-solid border-primary-main; + } + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + @extend .light-input-border; + @extend .light-text-color-primary; + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + padding-top: 9px; + @extend .light-text-color-primary; + @apply text-form-field text-text-primary float-left ml-sm; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .digit-select-active { + @apply relative block w-full h-10 border-2 border-solid border-primary-main; + @extend .light-input-border; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + @extend .light-background; + @extend .light-text-color-primary; + + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + @extend .light-text-color-primary; + @apply text-form-field text-text-primary float-left ml-sm; + } + + p { + padding-top: 9px; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .digit-options-card { + width: 100% !important; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + max-height: 400px; + overflow: auto; + @apply absolute z-20 mt-xs bg-white max-w-full; + + p { + padding-top: 14px; + @extend .light-text-color-primary; + @apply w-full h-12 pl-sm text-text-primary text-form-field; + + &:hover { + @apply bg-grey-mid; + @extend .light-background; + } + } + } +} + +.digit-employee-select-wrap--elipses { + width: 85% !important; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.digit-select-wrap { + @apply mb-lg relative; + max-width: 540px; + + .digit-select { + @apply relative block w-full h-10 border border-solid border-input-border; + @extend .light-input-border; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + @extend .light-text-color-primary; + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + padding-top: 9px; + @extend .light-text-color-primary; + @apply text-form-field text-text-primary float-left ml-sm; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .digit-select-active { + @extend .light-input-border; + @apply relative block w-full h-10 border-2 border-solid border-primary-main; + + input[type="text"] { + width: calc(100% - 32px); + background-color: transparent; + @extend .light-text-color-primary; + @apply absolute z-10 w-full h-full outline-none text-text-primary text-form-field pl-sm; + } + + p { + @extend .light-text-color-primary; + @apply text-form-field text-text-primary float-left ml-sm; + } + + p { + padding-top: 9px; + } + + img { + @apply float-right h-6 w-6 mt-sm mr-sm; + } + + svg { + @apply absolute right-0 float-right h-6 w-6 mt-sm mr-sm; + } + } + + .digit-options-card { + width: 100% !important; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); + @extend .light-background; + @apply absolute z-20 mt-xs bg-white; + + p { + padding-top: 14px; + @extend .light-text-color-primary; + @apply w-full h-12 pl-sm text-text-primary text-form-field; + + &:hover { + @apply bg-grey-mid; + } + } + } +} + +@screen dt { +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/tagV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/tagV2.scss new file mode 100644 index 00000000000..a202bbd671f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/tagV2.scss @@ -0,0 +1,28 @@ +.digit-tag-container { + @apply flex flex-wrap mb-md; + + .digit-tag { + @apply bg-grey-mid rounded-2xl pt-sm pb-sm flex justify-between items-center; + padding-left: 12px; + padding-right: 12px; + font-size: 14px; + margin-left: 2px; + height: 2rem; + margin-top: 1rem; + .digit-text { + padding-right: 5px; + max-width: calc(100% - 24px); + height: 22px; + overflow: hidden; + text-overflow: clip; + } + + &:hover { + @apply cursor-pointer; + + .close { + fill: black; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/telephoneV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/telephoneV2.scss new file mode 100644 index 00000000000..0953ca8d717 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/telephoneV2.scss @@ -0,0 +1,18 @@ +.digit-telephone { + @apply flex items-baseline; + img, + svg { + height: 22px; + width: 20px; + @apply text-primary-main ml-sm items-center; + margin-left: 0px; + } + + p { + @apply text-text-primary text-body-l pl-sm; + } +} + +.digit-call { + @apply flex text-text-secondary text-body-l; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textInputV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textInputV2.scss new file mode 100644 index 00000000000..863500eb5e4 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textInputV2.scss @@ -0,0 +1,123 @@ +@import url("../index.scss"); + +.digit-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; +} +.digit-text-input { + @apply relative w-full; +} + +.digit-text-input-width { + max-width: 540px; +} +.digit-card-input { + @apply mb-lg pl-sm outline-none mt-sm block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.digit-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.digit-employee-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} +.digit-employee-card-input:disabled { + @apply border-grey-dark text-grey-dark !important; + pointer-events: none !important; +} +.digit-employee-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + background: theme(colors.grey.mid); + border-right: 0; + padding-right: 5px; +} +.digit-employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.digit-card-textarea, +.digit-employee-card-textarea { + @apply block outline-none mt-md mb-lg border w-full border-input-border border-solid bg-white h-24 text-form-field text-text-primary p-sm; +} + +.digit-inputWrapper { + display: flex; + justify-content: flex-start; + max-width: 500px; + + div { + max-width: 80px; + } + + span { + margin-top: 16px; + margin-left: 10%; + margin-right: 10%; + } +} + +@screen dt { + .digit-card-input { + width: 480px; + } + + .digit-card-input-emp { + width: 240px; + } + + .digit-card-input-error { + width: 480px; + } + + .digit-employee-card-input { + @apply w-full; + } + + .digit-employee-card-input-error { + @apply w-full; + } + + .digit-card-textarea { + /* //width: 480px; */ + @apply w-full; + max-width: 540px; + } + + .digit-employee-card-textarea { + @apply w-full; + } + + .card-input-emp { + width: 240px; + } +} + +.digit-citizen-card-input { + @apply mb-lg pl-sm outline-none block border w-full h-10 border-input-border border-solid bg-white leading-10 text-form-field text-text-primary; +} + +.digit-citizen-card-input--front { + width: fit-content !important; + display: flex; + align-items: center; + background: theme(colors.grey.mid); + border-right: 0; + padding-right: 5px; +} + +.digit-employee-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; +} +.digit-card-input-error { + @apply mb-lg pl-sm block w-full h-10 outline-none border-2 border-error border-solid bg-white leading-10 text-form-field text-text-primary; + @extend .light-input-border; + @extend .alert-error; +} +.disabled { + @apply border-grey-dark text-grey-dark !important; + pointer-events: none !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textareaV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textareaV2.scss new file mode 100644 index 00000000000..1be8174b0fe --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/textareaV2.scss @@ -0,0 +1,11 @@ +.digit-card-textarea, +.digit-employee-card-textarea { + @apply block outline-none mt-md mb-lg border w-full border-input-border border-solid bg-white h-24 text-form-field text-text-primary p-sm; + @extend .light-input-border; +} +.digit-employee-card-textarea { + @apply w-full; +} +.digit-cell-text { + color: theme(colors.text.secondary); +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/uploadFileV2.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/uploadFileV2.scss new file mode 100644 index 00000000000..8ebd72365bc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/components/uploadFileV2.scss @@ -0,0 +1,146 @@ +.digit-upload-wrap { + @apply flex w-full h-40 bg-grey-light relative mb-lg px-sm border border-border border-dashed; + max-width: 540px; + min-height: 50px; + padding: 0.5rem; + + img { + display: block; + margin-top: 58px; + margin-left: calc(50% - 23px); + height: 42px; + width: 46px; + } + + svg { + display: block; + margin-top: 58px; + margin-left: calc(50% - 23px); + height: 42px; + width: 46px; + } + + input { + @apply absolute w-full h-full opacity-0 top-0; + } + .digit-cell-text { + color: theme(colors.text.secondary); + padding-top: 3px; + } +} + +.digit-multi-upload-wrap { + @apply flex mb-lg; + + div { + display: block; + position: relative; + background-color: theme(colors.grey.light); + width: calc((100% - 16px) / 3); + margin-right: 8px; + + .digit-delete { + position: absolute; + height: 24px; + width: 24px; + border-radius: 100%; + top: 2px; + right: 2px; + } + } + + .digit-upload-img-container { + border: 1px dashed theme(colors.border); + margin: 0 !important; + + img { + margin-left: auto; + margin-right: auto; + padding-top: calc(33% - 21px); + } + + svg { + @apply flex; + margin: auto; + } + + svg { + margin-left: auto; + margin-right: auto; + top: calc(50% - 21px); + position: relative; + } + + input { + @apply absolute w-full h-full opacity-0 top-0; + } + } +} + +.digit-upload-file-max-width { + max-width: 540px; +} + +.digit-upload-file { + min-height: 56px; + @apply relative border border-input-border w-full; + + div { + @apply flex flex-row h-full items-center pl-md mt-sm flex-wrap; + + .file-upload-status { + @apply text-body-s-dt ml-sm; + } + } + input { + width: 160px; + @apply absolute top-0 left-0 opacity-0 h-full; + } +} + +@screen dt { + .digit-multi-upload-wrap img { + width: 100%; + height: 158px; + } +} + +.digit-upload-file-button-wrap { + display: flex; + justify-content: flex-start; + align-items: center; + flex-wrap: wrap; + margin: 0px; + padding: 0px; + button { + height: auto; + min-height: 40px; + width: 43%; + max-height: 40px; + margin: 5px; + padding: 0px; + h2 { + word-break: break-all; + height: auto; + line-height: 16px; + overflow: hidden; + max-height: 34px; + max-width: 100%; + } + } + .digit-tag-container { + margin: 0px; + padding: 0px; + } +} +.digit-input-mirror-selector-button { + @apply h-16 bg-border text-center border-b-2 border-input-border border-solid outline-none px-lg !important; + + &:focus { + @apply outline-none; + } + + h2 { + @apply font-rc font-medium text-legend text-text-primary; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/index.scss new file mode 100644 index 00000000000..9713106cfd7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/index.scss @@ -0,0 +1,168 @@ +@import url("./components/actionbarV2.scss"); +/* + TODO NABEEL/ANIL Removed these since it creates issues in search screen and home screen +@import url("./components/cardV2.scss"); +*/ + +@import url("./components/checkboxV2.scss"); +@import url("./components/FormComposerV2.scss"); +@import url("./components/radiobtnV2.scss"); +@import url("./components/selectdropdownV2.scss"); +@import url("./typography.scss"); +@import url("./components/actionLinkV2.scss"); +@import url("./components/appContainerV2.scss"); +@import url("./components/bodyContainerV2.scss"); +@import url("./components/breadCrumbV2.scss"); +@import url("./components/bannerV2.scss"); +@import url("./components/breakLineV2.scss"); +@import url("./components/loaderV2.scss"); +@import url("./components/headerV2.scss"); +@import url("./components/checkpointV2.scss"); +@import url("./components/backButtonV2.scss"); +@import url("./components/buttonsV2.scss"); +@import url("./components/infoBannerV2.scss"); +@import url("./components/displayPhotosV2.scss"); +@import url("./components/collapseAndExpandGroups.scss"); +@import url("./components/dateWrapV2.scss"); +@import url("./components/ErrorMessage.scss"); +@import url("./components/ratingV2.scss"); +@import url("./components/noresultsfoundV2.scss"); +@import url("./components/mobileNumberV2.scss"); +@import url("./components/tagV2.scss"); +@import url("./components/popUpV2.scss"); +@import url("./components/telephoneV2.scss"); +@import url("./components/textareaV2.scss"); +@import url("./components/textInputV2.scss"); +@import url("./components/otpInputV2.scss"); +@import url("./components/multiSelectDropdownV2.scss"); +@import url("./components/uploadFileV2.scss"); + +/* pages */ +@import url("./pages/employee/index.scss"); + +/* important to be remove after fixing the components */ +.light { + &-primary { + color: theme(digitv2.lightTheme.primary) !important; + + &-button { + background-color: theme(digitv2.lightTheme.primary) !important; + } + + &-bg { + background-color: theme(digitv2.lightTheme.primary-bg) !important; + } + } + + &-text-color { + &-primary { + color: theme(digitv2.lightTheme.text-color-primary) !important; + } + + &-secondary { + color: theme(digitv2.lightTheme.text-color-secondary) !important; + } + + &-disabled { + color: theme(digitv2.lightTheme.text-color-disabled) !important; + } + } + + &-background { + background-color: theme(digitv2.lightTheme.background) !important; + } + + &-paper { + &-primary { + background-color: theme(digitv2.lightTheme.paper) !important; + + &-color { + color: theme(digitv2.lightTheme.paper) !important; + } + } + + &-secondary { + background-color: theme(digitv2.lightTheme.paper-secondary) !important; + } + + &-border { + border-radius: 4px; + border-style: solid; + border-width: 1px; + border-color: theme(digitv2.lightTheme.divider); + } + } + + &-divider { + background-color: theme(digitv2.lightTheme.divider) !important; + } + + &-header-sidenav { + color: theme(digitv2.lightTheme.header-sidenav) !important; + } + + &-input-border { + /* TODO Check why important added here @ANIL/NABEEL */ + border-color: theme(digitv2.lightTheme.input-border); + } +} + +.alert { + &-error { + color: theme(digitv2.alert.error) !important; + + &-bg { + background-color: theme(digitv2.alert.error-bg) !important; + } + + &-border { + border-color: theme(digitv2.alert.error) !important; + } + } + + &-success { + color: theme(digitv2.alert.success) !important; + + &-bg { + background-color: theme(digitv2.alert.success-bg) !important; + } + } + + &-info { + color: theme(digitv2.alert.info) !important; + + &-bg { + background-color: theme(digitv2.alert.info-bg) !important; + } + } +} + +.chart { + &-item-1 { + color: theme(digitv2.chart.chart-1) !important; + } + + &-item-1-gradient { + color: theme(digitv2.chart.chart-1-gradient) !important; + } + + &-item-2 { + color: theme(digitv2.chart.chart-2) !important; + } + + &-item-2-gradient { + color: theme(digitv2.chart.chart-2-gradient) !important; + } + + &-item-3 { + color: theme(digitv2.chart.chart-3) !important; + } + + &-item-4 { + color: theme(digitv2.chart.chart-4) !important; + } + + &-item-5 { + color: theme(digitv2.chart.chart-5) !important; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/index.scss new file mode 100644 index 00000000000..99435b650be --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/index.scss @@ -0,0 +1 @@ +@import url("./workbench.scss"); diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/workbench.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/workbench.scss new file mode 100644 index 00000000000..2e6f685f512 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/pages/employee/workbench.scss @@ -0,0 +1,615 @@ +@import url("../../index.scss"); + +.bread-crumb.workbench-bredcrumb{ +a{ + color: theme(digitv2.lightTheme.primary); +} +} +.workbench{ +.workbench-create-form { + display: inherit; + padding-top: 1.5rem; + .digit-form-composer-sub-header { + @extend .typography.text-heading-m; + padding-left: 1rem; + @media (max-width: theme(digitv2.screens.mobile)) { + padding-left: 0; + } + } + + form { + #label_digit_root { + display: none; + } + + #digit_root { + width: 100%; + + .field-wrapper { + .form-group.field { + display: flex; + padding: 1em 0 0 1em; + + @media (max-width: theme(digitv2.screens.mobile)) { + flex-direction: column; + } + + &.field-error.has-error.has-danger { + .control-label { + @extend .alert-error; + } + + .form-control { + @extend .alert-error-border; + } + + .card-label-error { + display: inline; + position: relative; + margin: 0px; + padding: 0px; + top: -0.7rem; + font-weight: normal; + + } + } + + &.field-boolean.field-error.has-error.has-danger { + + .card-label-error { + position: initial; + display: block; + margin-top: 0.5rem; + + } + } + + .control-label { + max-width: 12.5rem; + margin-right: 2.5rem; + @extend .card-label; + display: inline-flex; + /* align-self: center; */ + line-height: 3rem; + @extend .typography.text-heading-s; + /* web view*/ + @apply w-1/3; + + /* tablet view*/ + + @media (max-width: theme(digitv2.screens.tablet)) { + max-width: 11rem; + margin-right: 1.5rem; + + } + + /* mobile view*/ + + @media (max-width: theme(digitv2.screens.mobile)) { + /*max-width: 10.2rem;*/ + @apply w-full; + + } + + } + + .all-input-field-wrapper { + + @apply w-3/5; + @media (max-width: theme(digitv2.screens.mobile)) { + @apply w-full; + } + + .form-control { + @extend .light-input-border; + @extend .employee-card-input; + font-style: inherit; + font-family: inherit; + /* web view*/ + max-width: 37.5rem; + min-width: 20.5rem; + margin-bottom: 1rem; + /* tablet view*/ + + @media (max-width: theme(digitv2.screens.tablet)) { + max-width: 27.5rem; + min-width: 12.5rem; + + } + + /* mobile view*/ + + @media (max-width: theme(digitv2.screens.mobile)) { + max-width: 20.5rem; + min-width: 9.5rem; + @apply w-full; + + } + + &.form-select { + padding: 0%; + border: 0px; + + .digit__control { + @apply outline-none; + + .digit__value-container:in-range { + border-color: unset; + box-shadow: none; + box-sizing: unset; + @apply outline-none; + } + } + + .digit__control--is-focused { + border-color: theme(digitv2.lightTheme.primary) !important; + box-shadow: none; + box-sizing: unset; + @apply outline-none; + } + + + .digit__control:hover { + + border-color: unset; + box-shadow: none; + box-sizing: unset; + @apply outline-none; + } + + .digit__control:focus { + border-color: theme(digitv2.lightTheme.primary); + + .digit__value-container:focus { + border-color: theme(digitv2.lightTheme.primary); + + } + } + } + + &.form-select:focus { + @apply outline-none; + border-color: theme(digitv2.lightTheme.primary); + + } + } + + .form-control:read-only { + background-color: theme(digitv2.lightTheme.background); + color: theme(digitv2.lightTheme["text-color-secondary"]); + } + + .form-control:focus { + + @apply outline-none; + border-color: theme(digitv2.lightTheme.primary); + } + + textarea.form-control { + height: 5rem; + } + } + + &.field-string { + align-self: center; + } + + &.field-boolean { + padding-top: 0rem; + padding-bottom: 1rem; + + .custom-checkbox { + display: inline-flex; + align-items: end; + + &.custom-checkbox-disabled { + pointer-events: none; + opacity: 0.6; + } + + .custom-checkbox-label { + @extend .typography.text-body-s; + @apply pl-sm; + } + } + + .checkbox { + width: 28rem; + + label { + float: left; + + /* display: flex; + flex-direction: row-reverse; + */ + span { + width: 17rem; + display: none; + @extend .card-label; + } + + input[type="checkbox"] { + @extend .light-input-border; + @extend .employee-card-input; + height: 1.5rem; + /* @apply ml-sm;*/ + } + + input[type="checkbox"]#digit_root_active { + accent-color: theme(digitv2.lightTheme.primary); + } + + input:checked, + input:hover { + @apply border-2; + @extend .light-input-border; + } + } + } + + .field-radio-group { + display: inline-flex; + height: 2.5rem; + align-items: center; + + .radio { + @apply mr-sm; + } + } + + + + } + + + + &.field-object>.control-label { + margin-left: 0.5rem; + } + + &.field-object { + display: block; + @extend .light-background; + @extend .light-paper-border; + padding: 1rem; + margin: 1rem; + + .digit-expand-collapse-wrapper { + margin-top: 0px; + } + + .digit-icon-toggle { + top: -1.5rem; + right: 1.5em; + } + + .object-wrapper { + .array-remove-button-wrapper { + position: relative; + } + } + + /* have to revisit for objects + [id^="root_"] { + @extend .light-background; + } + */ + } + + &.field-array { + display: block; + @extend .light-paper-secondary; + @extend .light-paper-border; + padding: 2rem; + margin: 1rem; + padding-top: 1rem; + + .array-wrapper .array-item { + &.jk-array-objects>.array-remove-button-wrapper { + display: block; + } + + &.jk-array-objects { + margin-bottom: 2rem; + + .array-children>span .form-group.field.field-object { + padding-bottom: 3rem; + } + + .array-obj { + position: absolute; + bottom: 1.5rem; + left: 2rem; + + >.array-remove-button-wrapper { + position: unset; + } + } + + } + + &.jk-array-of-non-objects>.array-remove-button-wrapper { + display: inline; + left: 38.5rem; + right: unset; + top: 0.7rem; + } + + &.jk-array-of-non-objects .array-children { + span .form-group { + padding-left: 0%; + + .control-label { + display: none; + } + + } + } + + /* it has been removed since we dont need diff color for array items @extend .light-background;*/ + position: relative; + + .field-object { + margin-left: 0; + margin-right: 0; + } + + + .array-remove-button-wrapper { + position: absolute; + right: 1.3em; + top: 1.3em; + background-color: inherit !important; + + .array-remove-button { + cursor: pointer; + background-color: inherit !important; + @media (max-width: theme(digitv2.screens.mobile)) { + padding:0px; + } + h2{ + @media (max-width: theme(digitv2.screens.mobile)) { + display: none; + } + } + + } + } + + span.all-input-field-wrapper { + @apply w-3/5; + + .form-control { + @apply w-full; + } + } + + .control-label { + @apply w-1/3; + + } + } + + + .jk-digit-secondary-btn { + height: 1.7em; + margin-top: 0.5rem; + + @media (max-width: theme(digitv2.screens.mobile)) { + height: auto; + width: 100%; + } + + h2 { + font-size: 1rem; + } + } + + .all-input-field-wrapper { + .card-label-error { + position: unset !important; + } + } + + } + + .digit-expand-collapse-header { + border: 0; + background-color: inherit; + padding: 0; + } + } + } + } + } + + div.action-bar-wrap { + @extend .action-bar-wrap; + + .submit-bar { + @extend .submit-bar; + cursor: pointer; + @apply font-rc font-medium text-legend text-white leading-10; + } + } +} + +.workbench-no-schema-found { + @apply flex justify-items-center flex-col; + align-items: center; +} + +.jk-digit-loader { + position: absolute; + z-index: 10000; + width: 100vw; + background-color: rgba(189, 189, 189, 0.5); + height: 100vh; + left: 0; + top: 0; + + .jk-spinner-wrapper { + width: 100%; + display: flex; + align-items: center; + justify-content: center; + height: 100%; + + .jk-spinner { + border: 0.4em solid #fe7a51; + border-radius: 50%; + border-top: 0.4em solid #ffffff; + width: 4em; + height: 4em; + -webkit-animation: spin 2s linear infinite; + /* Safari */ + animation: spin 1s linear infinite; + } + } +} + +.jk-sm-inbox-loader { + border: 0.2em solid #fe7a51; + border-radius: 50%; + border-top: 0.2em solid #ffffff; + width: 2em; + height: 2em; + -webkit-animation: spin 2s linear infinite; + /* Safari */ + animation: spin 1s linear infinite; +} + +/* Safari */ +@-webkit-keyframes spin { + 0% { + -webkit-transform: rotate(0deg); + } + + 100% { + -webkit-transform: rotate(360deg); + } +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} + +.no-data-found { + height: 100%; + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + .digit-error-msg { + margin-top: 2rem; + } +} + + +.tooltip .tooltiptext { + + top: 2rem; + left: 0; + margin-left: 0rem; + width: fit-content; + height: max-content; + white-space: normal; + + .tooltiptextvalue { + font-size: 14px; + font-weight: 400px; + color: white; + } +} +.employeeCard.manage-master-wrapper { + width: 100%; + display: flex; + padding-top: 2.1rem; + @media (max-width: theme(digitv2.screens.mobile)) { + flex-direction: column; + } + .employee-select-wrap.form-field{ + @apply w-1/4; + margin-right:1rem ; + @media (max-width: theme(digitv2.screens.mobile)) { + @apply w-full; + } + } +} + +.table{ + padding-left:0.8rem ; + padding-right:0.8rem ; + &-row-mdms:hover{ + background-color: theme(digitv2.lightTheme.primary-bg); /* Change this to the desired hover color */ + cursor: pointer; + } +} +} + +.header-btn{ + width: 12rem; +} + +.drag-drop-container { + background-color: #FAFAFA; + border: 1.5px dashed #D6D5D4; + border-radius: 5px; + margin:-1rem 1rem 1rem 1rem; + padding: 1rem 1rem 1rem 1rem; + display: flex; + align-items: center; + flex-direction: column; + + .drag-drop-text { + text-decoration: none; + .browse-text { + text-decoration: none; + color: #F47738; + transition: color 0.3s; + } + .browse-text:hover { + color: #F47738; + text-decoration: underline; + cursor: pointer; + } + } + +} + +.uploaded-file-container { + background-color: #FAFAFA; + border: 1.5px solid #D6D5D4; + border-radius: 5px; + margin:0.5rem 1rem 2rem 1rem; + display: flex; + flex-direction: row; + align-items: center; + padding: 0.6rem; + justify-content: space-between; + + .uploaded-file-container-sub { + display: flex; + align-items: center; + + .icon:hover { + cursor: pointer; + } + } +} + +button:hover { + cursor: pointer; +} + +.popup-header-fix { + margin-top: -0.5rem !important; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/typography.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/typography.scss new file mode 100644 index 00000000000..4f428d7c654 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/digitv2/typography.scss @@ -0,0 +1,241 @@ +@import url("../index.scss"); + +.typography { + &.text-heading-xl { + font-family: theme(digitv2.fontFamily.rc); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.bold); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.heading-xl.desktop); + } + + @media (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.heading-xl.tablet); + } + + @media (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.heading-xl.mobile); + } + } + + &.text-heading-l { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.bold); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.heading-l.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.heading-l.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.heading-l.mobile); + } + } + &.text-heading-m { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.bold); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.heading-m.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.heading-m.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.heading-m.desktop); + } + } + &.text-heading-s { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.bold); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.heading-s.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.heading-s.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.heading-s.mobile); + } + } + &.text-heading-xs { + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.heading-xs.mobile); + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.bold); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + } + } + &.text-caption-l { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.medium); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.caption-l.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.caption-l.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.caption-l.mobile); + } + } + + &.text-caption-m { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.medium); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.caption-m.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.caption-m.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.caption-m.mobile); + } + } + + &.text-caption-s { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.medium); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.caption-s.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.caption-s.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.caption-s.desktop); + } + } + &.text-body-l { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.regular); + color: theme(digitv2.lightTheme.text-color-primary); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.body-l.desktop); + line-height: theme(digitv2.lineHeight.line-height-body-l.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.body-l.tablet); + line-height: theme(digitv2.lineHeight.line-height-body-l.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.body-l.mobile); + line-height: theme(digitv2.lineHeight.line-height-body-l.mobile); + } + } + &.text-body-s { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.regular); + color: theme(digitv2.lightTheme.text-color-primary); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.body-s.desktop); + line-height: theme(digitv2.lineHeight.line-height-body-s.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.body-s.tablet); + line-height: theme(digitv2.lineHeight.line-height-body-s.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.body-s.mobile); + line-height: theme(digitv2.lineHeight.line-height-body-s.mobile); + } + } + &.text-body-xs { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.regular); + color: theme(digitv2.lightTheme.text-color-primary); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.body-xs.desktop); + line-height: theme(digitv2.lineHeight.line-height-body-xs.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.body-xs.tablet); + line-height: theme(digitv2.lineHeight.line-height-body-xs.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.body-xs.mobile); + line-height: theme(digitv2.lineHeight.line-height-body-xs.mobile); + } + } + &.text-label { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.italic); + font-weight: theme(digitv2.fontWeight.regular); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.label.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.label.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.label.mobile); + } + } + &.text-link { + font-family: theme(digitv2.fontFamily.sans); + font-style: theme(digitv2.fontStyle.normal); + font-weight: theme(digitv2.fontWeight.regular); + color: theme(digitv2.lightTheme.text-color-primary); + line-height: theme(digitv2.lineHeight.normal); + text-decoration: theme(digitv2.textDecorationLine.underline); + + @media screen and (min-width: theme(digitv2.screens.desktop)) { + font-size: theme(digitv2.fontSize.link.desktop); + } + @media screen and (min-width: theme(digitv2.screens.tablet)) { + font-size: theme(digitv2.fontSize.link.tablet); + } + + @media screen and (min-width: theme(digitv2.screens.mobile)) { + font-size: theme(digitv2.fontSize.link.mobile); + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/index.scss new file mode 100644 index 00000000000..0e68dddc547 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/index.scss @@ -0,0 +1,762 @@ +/*@import 'normalize.css';*/ + +/*@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;500;700&family=Roboto:wght@400;500;700&display=swap");*/ + +@import "tailwindcss/base"; + +@import "tailwindcss/components"; + +@import "tailwindcss/utilities"; + +@import "react-date-range/dist/styles.css"; +@import "react-date-range/dist/theme/default.css"; + +@import "./components/loader.scss"; + +@import "./components/body.scss"; +@import "./components/navbar.scss"; +@import "./components/card.scss"; +@import "./components/buttons.scss"; +@import "./components/radiobtn.scss"; +@import "./components/selectdropdown.scss"; +@import "./components/textfields.scss"; +@import "./components/bannercomponents.scss"; +@import "./components/datewrap.scss"; +@import "./components/datatable.scss"; +@import "./components/checkpoint.scss"; +@import "./components/checkbox.scss"; +@import "./components/inputotp.scss"; +@import "./components/map.scss"; +@import "./pages/employee/tooltip.scss"; +@import "./components/menu.scss"; +@import "./components/submiterrors.scss"; +@import "./components/ratingstar.scss"; +@import "./components/keynote.scss"; +@import "./components/statushighlight.scss"; +@import "./components/imageviewer.scss"; +@import "./components/actionbar.scss"; +@import "./components/table.scss"; +@import "./components/popup.scss"; +@import "./components/uploadcomponents.scss"; +@import "./components/toast.scss"; +@import "./components/detailscontainer.scss"; +@import "./components/telephone.scss"; +@import "./components/grey.scss"; +@import "./components/actionLink.scss"; +@import "./components/sectionalDropdown.scss"; +@import "./components/detailscard.scss"; +@import "./components/searchAction.scss"; +@import "./components/tag.scss"; +@import "./components/topbar.scss"; +@import "./components/languageSelector.scss"; +@import "./components/custombtn.scss"; +@import "./components/citizenInfoLabel.scss"; +@import "./components/roundedLabel.scss"; +@import "./components/changeLanguage.scss"; +@import "./components//metricsTable.scss"; +@import "./components/filters.scss"; +@import "./components//charts.scss"; +@import "./components/summary.scss"; +@import "./components/multiLink.scss"; +@import "./components/info-banner.scss"; +@import "./components/multiSelectDropdown.scss"; +@import "./components/EllipsisMenu.scss"; +@import "./components/CitizenHomeCard.scss"; +@import "./components/PropertySearchForm.scss"; +@import "./components/SearchForm.scss"; +@import "./components/cardHeaderWithOptions.scss"; +@import "./components/TimeLine.scss"; +@import "./components/PageBasedInput.scss"; +@import "./components/StandaloneSearchBar.scss"; +@import "./components/CardBasedOptions.scss"; +@import "./components/WhatsNewCard.scss"; +@import "./components/SearchOnRadioButton.scss"; +@import "./components/EventCalendarView.scss"; +@import "./components/OnGroundEventCard.scss"; +@import "./components/PopupHeadingLabel.scss"; +@import "./components/staticSideBar.scss"; +@import "./components/hoc/index.scss"; +@import "./components/FAQ.scss"; +@import "./components//howItWorks.scss"; +@import "./components/staticDynamicMessages.scss"; +@import "./components/toggleSwitch.scss"; +@import "./components/plusMinus.scss"; + +@import "./pages/employee/index.scss"; +@import "./pages/employee/cardfix.scss"; +@import "./pages/employee/popupmodule.scss"; +@import "./pages/employee/container.scss"; +@import "./pages/employee/inbox.scss"; +@import "./pages/employee/response.scss"; +@import "./pages/employee/form-fields.scss"; +@import "./pages/employee/scroll-table.scss"; +@import "./pages/employee/EmployeeLogin.scss"; +@import "./pages/employee/updateNumber.scss"; +@import "./pages/employee/oldMobileInbox.scss"; +@import "./pages/employee/dss.scss"; +@import "./pages/employee/iframe.scss"; + +@import "./pages/citizen/payment/payment-type.scss"; +@import "./pages/citizen/container.scss"; +@import "./pages/citizen/HomePageWrapper.scss"; +@import "./pages/citizen/CitizenEngagementNotificationWrapper.scss"; +@import "./pages/citizen/Events.scss"; +@import "./pages/citizen/DocumentList.scss"; +@import "./pages/citizen/SurveyList.scss"; +@import "./pages/citizen/updatePropertyNumber.scss"; +@import "./pages/citizen/citizenDocument.scss"; +@import "./pages/employee/surveys.scss"; +@import "./digitv2/index.scss"; +/* @import "./digitv2/typography.scss"; */ +@import "./components/inboxv2/index.scss"; +@import "./components//sidebar.scss"; + +.display-none { + display: none; +} + +.p-unset { + padding: unset !important; +} + +h1, h2, h3, h4, h5, h6 { + font-size: inherit; + font-weight: inherit; } + + +.flex-one { + @apply flex-1; +} + +.display-flex-gap-2 { + @apply flex gap-3; +} +.rm-mb { + margin-bottom: unset !important; +} + +.w-fullwidth { + @apply w-full; +} + +.margin-unset { + margin: unset !important; +} + +.text-align-center { + @apply text-center; +} + +.desktop-only { + @apply hidden; +} + +@screen dt { + .desktop-only { + @apply block; + } +} + +.mobile-only { + @apply block; +} + +@screen dt { + .mobile-only { + @apply hidden; + } +} + +.dark { + @apply text-text-primary; +} + +.mrlg { + @apply mr-lg; +} + +.mrsm { + @apply mr-sm; +} + +.mbsm { + @apply mb-sm; +} + +.employeeCard { + /* TODO need to revisit that we need mx-md NABEEL/ANIL + @apply mb-md mx-md !important; + */ + @apply mb-md !important; +} + +.home-link { + margin-left: 16px; + margin-bottom: 16px; + + a { + color: theme(colors.link.normal); + } +} + +.clear-search-label { + color: theme(colors.primary.main); + cursor: pointer; +} + +.search-submit-bar { + margin-top: 32; + margin-left: auto; +} + +.application-details-link-button { + @apply flex justify-between items-center; + + .download-button { + color: theme(colors.primary.main); + margin-left: 8px; + } +} + +.response-download-button { + @apply flex mb-sm; + + .download-button { + color: theme(colors.primary.main); + margin-left: 8px; + } +} + +.check-page-link-button { + color: theme(colors.primary.main) !important; +} + +.pt-application-download-btn { + display: flex; + justify-content: flex-end; + margin: 0px 8px; +} + +.form-pt-dropdown-only { + .options-card { + position: unset; + } +} +.application-table-container { + @apply mt-lg ml-lg flex-1; +} + +.primary-label-btn { + @apply flex; + gap: 10px; + + svg { + fill: theme(colors.primary.main); + } + + color: theme(colors.primary.main); + + cursor: pointer; + font-weight: 500; + width: fit-content; +} + +.primaryColor { + color: theme(colors.text.primary) !important; +} + +input[readonly] { + @apply border-grey-dark !important; + background-color: theme(digitv2.lightTheme.background); + border-color: theme(digitv2.lightTheme.text-color-secondary); + color: theme(digitv2.lightTheme.text-color-secondary); +} + +.hide-input-type-file { + position: absolute; + clip: rect(0, 0, 0, 0); + pointer-events: none !important; +} + +@media (hover: hover) { + .primary-label-btn { + &:hover { + color: #000; + + svg { + fill: #000; + } + } + } +} + +.disabled { + @apply border-grey-dark text-grey-dark !important; + pointer-events: none !important; +} + +.card-date-input { + @apply absolute top-0 left-0 w-3/4 bg-white pl-sm border border-input-border border-solid border-r-0; + outline: transparent solid 1px; + height: 2.5rem; +} + +.h4 { + @apply mb-sm; +} + +.react-time-picker { + width: 194px; + height: 2.5rem; + &__wrapper { + border: 2px solid theme(colors.text.primary); + padding-left: 16px; + } + &__inputGroup__input { + @apply px-sm; + line-height: 2.5rem; + min-width: 16px; + &:focus { + outline: 2px solid black; + } + } +} + +.border-none { + border: none; + justify-content: space-between; +} + +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + -webkit-appearance: none; + margin: 0; +} +input[type="number"] { + -moz-appearance: textfield; +} + + +.static { + @apply flex flex-col; + min-height: 85vh; + + &-wrapper { + flex: 1; + max-height: 75vh; + overflow: scroll; + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ + + &::-webkit-scrollbar { + display: none; + } + } +} + +.bill-summary { + border: #e8e7e6 solid 1px; + @apply bg-grey-light w-full; + + .bill-account-details { + @apply flex mb-md; + padding: 5px; + + .label { + @apply w-1/2 font-bold; + } + + .value { + @apply w-1/2 text-right; + } + } + + .amount-details { + @apply flex mb-md items-center; + padding: 5px; + + .label { + @apply w-1/2 font-bold; + } + + .value { + @apply w-1/2 font-bold text-right; + font-size: 18px; + } + } +} + +.bill-payment-amount { + @apply sticky bottom-0 bg-white; + padding-bottom: 32px; + + .payment-amount-front { + @apply absolute z-10 w-10 flex justify-center items-center; + background-color: #efefef; + padding: 7px 12px; + color: #9a9a9a; + } +} + +.text-indent-xl input { + text-indent: 40px; +} + +.select-payment-type { + @apply flex justify-center font-bold items-center; + padding-top: 10px; + padding-bottom: 25px; + + .value { + font-size: 20px; + } +} + +.cheque-date { + @apply flex items-center mb-lg; + border: 2px solid theme(colors.text.primary); + border-radius: 2px; + + input { + @apply outline-none w-full; + border: 0px; + background: transparent; + text-indent: 5px; + padding: 6px 0px; + } + + button { + @apply outline-none; + border: 0px; + background: transparent; + text-indent: 2px; + } +} + +.w-half { + @apply w-1/2; +} + +.ifsc-field { + @apply flex items-center mb-lg; + border: 2px solid theme(colors.text.primary); + border-radius: 2px; + + input { + @apply outline-none w-full; + border: 0px; + background: transparent; + text-indent: 5px; + padding: 6px 0px; + } + button { + @apply outline-none; + border: 0px; + background: transparent; + text-indent: 2px; + } +} + +.text-input { + @apply relative w-full; + input { + &:hover { + @apply border-2 border-solid border-primary-main; + } + } +} + +.text-input-width { + max-width: 540px; +} + +.text-mobile-input-width { + max-width: 500px; +} + +.custom-time-picker { + @apply w-full; + max-width: 200px; +} + +.sla-cell { + @apply text-text-secondary; +} + +.submit-bar-search { + margin-top: 32px; + margin-left: 16px; + max-width: 256px; +} + +.clear-search-container { + @apply flex justify-between items-center; +} + +.card-label-smaller { + @apply w-1/3; + margin-bottom: revert; +} + +.card-label-APK { + @apply w-1/3; + margin-bottom: revert; + width: 100%; +} + +.underline { + border-color: #e7e6e6; + @apply mb-sm; +} + +.box-shadow-none { + box-shadow: none; +} + +.component-in-front { + @apply flex justify-center items-center; +} + +.subform-composer { + @apply flex; +} + +.inbox-search-container { + .result { + @apply mt-lg; + } +} + +.payment-form-text-input-correction { + width: 100% !important; +} + +.edcr-citizen-inbox { + thead th:first-child { + min-width: 155px; + } +} + +.error-boundary { + width: 100vw; + height: 100vh; + font-size: 16px; + font-family: sans-serif; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + .error-container { + display: flex; + width: 400px; + justify-content: center; + align-items: center; + flex-direction: column; + h1 { + font-size: 32px; + font-weight: bold; + } + button { + height: 40px; + width: 153px; + border-radius: 0px; + padding: 8px 24px; + color: white; + cursor: pointer; + background-color: theme(colors.primary.main); + } + } +} + +.error-boundary summary, +.error-boundary details { + width: 300px; + background-color: rgb(218, 100, 100); + margin: 5px; + border: 2px solid #222; + border-radius: 3px; + padding: 3px; +} + +.full-width-card { + width: 92vw !important; +} +.full-employee-card-link { + width: 100% !important; + margin: 7px 0px; + a { + color: inherit; + text-decoration: inherit; + } +} +.full-employee-card-height { + height: unset !important; +} + +@media (min-width: 640px) { + .full-employee-card-height { + height: 196px !important; + } + .full-employee-card-link { + width: 30% !important; + } + .full-width-card { + @apply w-full !important; + } +} +.applications-list-container { +} +.complaint-summary { + @media (min-width: 780px) { + flex: 1 0 auto; + margin-left: 1rem; + margin-top: 1rem; + } +} + +@media (min-width: 780px) { + .citizen-form-wrapper { + width: calc(100% - 219px); + display: flex; + justify-content: center; + margin-top: 1rem; + padding-left: 16px; + padding-right: 16px; + } +} +@media (min-width: 780px) { + .citizen-card-container { + padding-left: 15px; + padding-right: 15px; + margin-top: 1rem; + } +} + +@media (min-width: 780px) { + .citizen-obps-wrapper, + .selection-card-wrapper, + .pgr-citizen-wrapper, + .pt-citizen, + .bill-citizen, + .bills-citizen-wrapper, + .payer-bills-citizen-wrapper, + .engagement-citizen-wrapper, + .citizen-all-services-wrapper, + .mcollect-citizen, + .ws-citizen-wrapper, + .tl-citizen { + width: calc(100% - 219px); + padding-left: 16px; + padding-right: 16px; + margin-top: 1rem; + } +} +@media only screen and (max-width: 768px) { + /* For mobile phones: */ + .error-boundary { + height: 75vh; + } +} +.employee-app-wrapper { + min-height: calc(100vh - 8em); +} + +.ws-custom-wrapper { + .submit { + display: flex !important; + flex-direction: row-reverse !important; + width: 100% !important; + align-items: center; + button { + width: 240px !important; + } + p { + width: unset; + margin-right: 1rem; + } + } +} + +.plumber-details-new-value-wrapper { + flex: 2 1 auto; +} + +.connection-details-new-value-wrapper { + flex: 1 1 auto; +} + +.connection-details-old-value-wrapper, +.plumber-details-old-value-wrapper { + flex: 1 1 auto; + + .old-value-null-wrapper { + visibility: hidden; + padding-bottom: 8px; + margin-bottom: 8px; + } + .row { + color: #b1b4b6; + font-weight: 700; + font-size: 16px; + } +} + +.plumber-details-new-value-wrapper { + flex: 2 1 auto; +} + +.connection-details-new-value-wrapper { + flex: 1 1 auto; +} + +.connection-details-old-value-wrapper, +.plumber-details-old-value-wrapper { + flex: 1 1 auto; + .old-value-null-wrapper { + visibility: hidden; + padding-bottom: 8px; + margin-bottom: 8px; + } + .row { + color: #b1b4b6; + font-weight: 700; + font-size: 16px; + } +} + +.modal-header-ws { + padding: 1rem; + font-weight: 400; +} +.modal-body-ws { + padding: 1rem; + font-weight: 700; + color: theme(colors.text.primary); + font-size: 24px; + margin-bottom: 1rem; +} +.privacy-icon { + cursor: pointer; +} +.privacy-icon:hover { + path { + fill: rgba(244, 119, 56, 1); + } +} + +.privacy-icon-2 { + cursor: pointer; +} +.privacy-icon-2:hover { + path { + fill: none; + } +} + +.audit-card { + width: 80%; + margin-left: -260px; + margin-right: -27%; + max-height: 120px; + margin-top: 90px; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/CitizenEngagementNotificationWrapper.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/CitizenEngagementNotificationWrapper.scss new file mode 100644 index 00000000000..ea048c9f278 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/CitizenEngagementNotificationWrapper.scss @@ -0,0 +1,8 @@ +.CitizenEngagementNotificationWrapper { + .h1 { + margin: 15px; + } + .WhatsNewCard { + @apply mx-md mb-md; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/DocumentList.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/DocumentList.scss new file mode 100644 index 00000000000..e48d487f9c2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/DocumentList.scss @@ -0,0 +1,305 @@ +.wrapper { + margin: 20px auto; +} +.accordion-wrapper { + & + * { + margin-top: 0.5em; + } +} +.accordion-item { + overflow: hidden; + transition: max-height 0.3s cubic-bezier(1, 0, 1, 0); + height: auto; + max-height: 9999px; +} +.accordion-item.collapsed { + max-height: 0; + transition: max-height 0.35s cubic-bezier(0, 1, 0, 1); +} +.accordion-title { + font-weight: 600; + cursor: pointer; + color: #666; + padding: 0.5em 0em; + border-radius: 1.5em; + display: flex; + justify-content: space-between; + align-items: center; + &.open svg { + transform: rotate(-90deg); + } + &:hover, + &.open { + color: black; + } +} +.accordion-content { + padding: 1em 0em; +} +.document_list_searchbar { + border: 1px solid theme(colors.text.secondary) !important; + border-radius: 0px !important; + margin: 20px 0; +} +.notices_circular_searchbox { + margin-top: 50px; +} +.notice_and_circular_main { + @apply flex bg-white my-md px-md pt-md pb-lg shadow-card relative; + border-radius: 4px; +} +.gap-ten { + @apply gap-10; +} +.notice_and_circular_heading_mb { + display: flex; + justify-content: space-between; + padding: 2px; +} +.notice_and_circular_heading_mb header { + font-weight: bold; + font-size: 16px !important; + line-height: 24px; + margin-right: 50px; +} +.notice_and_circular_heading_mb .card-caption { + padding-left: 30px; + font-weight: normal; + font-size: 12px; + line-height: 24px; + color: theme(colors.text.secondary); + padding-right: 5px; + padding-left: 15px; + min-width: 80px; + position: absolute; + right: 20px; +} +.notice_and_circular_text { + padding-bottom: 20px; +} +.notice_and_circular_text p { + font-weight: normal; + font-size: 12px; + line-height: 14px; + color: theme(colors.text.secondary); +} +.notice_and_circular_caption { + margin-top: 10px; + margin-bottom: 10px; +} +.notice_and_circular_caption .card-caption { + font-weight: normal; + font-size: 10px; + line-height: 18px; + color: #A3A3A3; +} +.view_download_main { + display: flex; + flex-wrap: wrap; + gap:8px; + align-items: end; + span { + padding-right: 20px; + & .views { + display: flex; + justify-content: space-between; + align-items: center; + p { + padding-left: 10px; + font-weight: normal; + font-size: 16px; + line-height: 19px; + color: theme(colors.primary.main); + } + } + } + & .download_views_padding{ + padding-top: 8px; + } +} +@screen dt{ + .view_download_main { + span{ + & .views { + display: flex; + justify-content: space-between; + align-items: center; + p { + padding-left: 10px; + font-weight: normal; + font-size: 16px; + line-height: 19px; + color: theme(colors.primary.main); + } + } + } + } + + .notice_and_circular_heading_mb .card-caption { + font-size: 16px; + line-height: 24px; + min-width : 150px; + padding-left: 50px; + } + + .view_download_main span{ + padding-right: 30px; + } + .view_download_main span .views p { + padding-left: 8px; + font-size: 16px; + } + .notice_and_circular_text p { + font-size: 16px !important; + line-height : 24px; + } + .documentDetails_row { + grid-gap: 0 !important; + gap: 0 !important; + } + .notice_and_circular_heading_mb header{ + font-size: 24px !important; + line-height: 28px; + margin-right : 100px; + } + .notice_and_circular_caption .card-caption { + font-size: 14px; + line-height: 21px; + } + +} +.documentDetails { + &_wrapper { + @apply flex flex-col gap-10 items-start; + } + &_row { + @apply flex gap-20; + } + &_title { + @apply w-48 font-bold; + } + &_description { + @apply max-w-lg; + text-overflow: clip; + } + &_pdf { + @apply flex flex-col gap-5; + } + &_subheader { + @apply font-bold; + font-size: large; + } +} + +.documentDetails_pdf { + @apply flex gap-10 cursor-pointer; +} +.grid_section { + @apply grid grid-cols-4 gap-4; + & .document_notification_form_section { + @apply col-span-3; + } +} +.document_notification_first_grid { + @apply grid grid-cols-4 gap-4; + & .form_section, + .document_notification_table_section { + @apply col-span-3; + } +} +.new_document_section_flex { + @apply flex items-center; + & .card-section-header { + @apply pl-lg; + } +} +.new_document_para_color { + @apply text-primary-light; + margin-bottom: 42px; +} +.document_notification_second_grid { + @apply grid grid-cols-3 gap-4; +} +.document_notification_clear_search_btn { + display: flex; + justify-content: flex-end; + align-items: center; + & .document_notification_clear_search_btn_align { + display: flex; + align-items: center; + } +} +.new_document_clear_search_alignment { + @apply mb-md mr-lg; +} +.document_notification_filter_header { + @apply flex justify-between items-center; +} +.document_notification_filter_icon { + @apply flex items-center; + & .card-caption { + @apply ml-lg; + } +} +.document-table-docs-columns { + @apply flex items-center gap-5; +} +.filter_section_main { + padding-bottom: 300px; +} +.new_document_card { + @apply w-full h-56 bg-white p-xl; +} +.filter_table_section_margin { + margin-top: 30px; +} +.filter_card_employee { + @apply w-full h-auto bg-white p-xl; + padding-bottom: 100px; +} +.filter_section_document_categories { + padding-top: 20px; +} +.new_document_card_table { + @apply w-full h-auto bg-white p-xl; +} +.employee_document_inbox_table_main { + .table { + tbody { + tr { + @apply py-md; + } + } + } +} +.confirmation_box { + height: 130px; + display: flex; + align-items: center; + padding-left: 8px; + gap: 10px; + overflow: hidden; + text-overflow: ellipsis; +} + +.Docs_CardWrapper{ + @apply bg-white m-sm px-md pt-md pb-lg shadow-card; + border-radius: 4px; +} + +.mobileInbox_attachments{ + display:flex; + gap:10px; +} + +.documentDetails_row_items { + display:flex; + flex-direction: row; + align-self: flex-start; +} + +@media screen and (max-width : 768px){ + .documentDetails_row_items{ + @apply grid grid-cols-2 gap-4; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/Events.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/Events.scss new file mode 100644 index 00000000000..edf8c3322d3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/Events.scss @@ -0,0 +1,47 @@ +.OnGroundEventDetailsCard{ + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16); + @apply bg-white mx-sm mb-md p-md rounded; +} + +.eventAddressAndDirection{ + @apply text-body-s mb-md; + span{ + @apply flex mb-sm; + svg{ + @apply h-5 w-5; + } + div{ + @apply ml-md; + p{ + @apply mb-sm; + } + .direction{ + @apply text-primary-main cursor-pointer; + } + } + } +} + +.eventTimeRange{ + @apply text-body-s flex; + svg{ + @apply h-5 w-5; + } + p{ + @apply ml-md; + } +} + +.cardCaptionBodyS{ + @apply text-body-s text-text-secondary mb-md; +} + +@screen dt{ + .eventAddressAndDirection{ + @apply text-body-s-dt; + } + + .cardCaptionBodyS{ + @apply text-body-s-dt; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/HomePageWrapper.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/HomePageWrapper.scss new file mode 100644 index 00000000000..de3747c67d6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/HomePageWrapper.scss @@ -0,0 +1,158 @@ +.HomePageWrapper { + margin-top: -25px; + + .BannerWithSearch { + margin-bottom: 40px; + width: 100%; + @apply relative; + .Search { + width: calc(100% - 32px); + bottom: -18px; + @apply mx-md absolute; + } + img { + height: 33vw; + @apply w-full object-cover; + } + } + + .ServicesSection { + @apply flex flex-wrap; + padding: 40px 15px 0 15px; + } + + @screen dt { + .ServicesSection { + @apply flex flex-wrap; + padding: 40px 15px 0 15px; + width: 100%; + } + } + + .WhatsNewSection { + @apply m-sm; + padding: 0 15px; + .headSection { + @apply flex mb-sm justify-between; + h2 { + @apply text-heading-s font-bold text-text-primary pl-sm; + } + p { + @apply text-link text-primary-main font-medium cursor-pointer; + } + } + @media (min-width: 780px) { + padding: 0 15px; + } + } + + .WhatsAppBanner{ + width: 100%; + padding: 0px 20px 0px 20px; + margin: auto; + cursor: pointer; + img { + width: 100%; + } + } +} + +@media (min-width: 780px) { + .SideBarStatic { + width: 219px; + background: theme(colors.white); + } +} + +@media (max-width: 780px) { + .SideBarStatic { + display: none; + } +} +.HomePageContainer { + @media (min-width: 780px) { + display: flex; + width: calc(100% - 219px); + height: calc(100%-30px); + } +} + +.moduleLinkHomePage { + @media (min-width: 780px) { + width: calc(100% - 219px); + } + margin-top: -25px; + img { + height: 33vw; + filter: grayscale(100%); + @apply w-full object-cover; + } + h1 { + position: absolute; + top: 100px; + left: 21px; + @apply text-heading-xl text-white font-bold; + } + .moduleLinkHomePageBackButton { + border: none; + top: 76px; + svg { + fill: theme(colors.white); + } + @apply absolute text-white text-heading-s ml-md; + } +} + +.moduleLinkHomePageModuleLinks { + @apply mt-md; + .CitizenHomeCard { + .header { + @apply hidden; + } + } +} + +@screen dt { + .HomePageWrapper { + width: 100%; + .BannerWithSearch { + margin-bottom: 56px; + width: 100% !important; + .Search { + width: 100%; + margin: 0; + padding: 0 15px 0 15px; + } + img { + height: 20vw; + } + } + + .WhatsAppBanner { + width: 100%; + img{ + height: 20vw; + width: 100%; + } + } + + } + .moduleLinkHomePage { + img { + min-width: 100vw; + height: 20vw; + } + h1 { + top: calc(10vw + 40px); + left: 15.8rem; + } + .moduleLinkHomePageBackButton { + top: calc(10vw + 16px); + @apply ml-md; + } + } + + .moduleLinkHomePageModuleLinks { + width: 100%; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/SurveyList.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/SurveyList.scss new file mode 100644 index 00000000000..21994bb1fda --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/SurveyList.scss @@ -0,0 +1,22 @@ +.surveyListclockDiv{ + @apply flex items-center my-lg; +} +.surveyListclockDiv span{ + @apply pl-md text-text-primary; +} +.surveyListstatus{ + @apply flex items-center justify-between; +} +.surveyLisNotResponded{ + @apply text-error; +} +.surveyLisResponded{ + @apply text-success; +} +.surveyListCardMargin{ + @apply mx-md my-lg ; +} +.centered-message{ + @apply flex items-center pl-md py-lg ; + +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/citizenDocument.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/citizenDocument.scss new file mode 100644 index 00000000000..106bde67263 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/citizenDocument.scss @@ -0,0 +1,22 @@ +.notice_and_circular_image svg { + width: 80px; + height: 100px; + } + .notice_and_circular_content { + padding-left: 50px; + } + .back-btn2{ + border: none; + } + @media screen and (max-width: 768px) { + .notice_and_circular_image svg { + width: 53px; + height: 66px; + } + .notice_and_circular_content { + padding-left: 40px; + } + .documentContainerPadding{ + padding: 0 10px; + } + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/container.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/container.scss new file mode 100644 index 00000000000..ad7a47a7a1f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/container.scss @@ -0,0 +1,19 @@ +.citizen-home-footer { + @apply flex w-full h-10 bg-grey-bg pb-md pt-sm justify-center; + img { + @apply ml-sm; + } +} + +.employee .citizen-home-footer { + @apply fixed bottom-0; +} +.fill-path-primary-main { + path { + fill: theme(colors.primary.main); + } +} + +.obps-search { + margin: 8px; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/payment/payment-type.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/payment/payment-type.scss new file mode 100644 index 00000000000..2e2698b830c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/payment/payment-type.scss @@ -0,0 +1,3 @@ +.payment-amount-info{ + @apply flex justify-between; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/updatePropertyNumber.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/updatePropertyNumber.scss new file mode 100644 index 00000000000..9c866b9be8c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/citizen/updatePropertyNumber.scss @@ -0,0 +1,46 @@ +.updatenumber-warper-citizen{ + min-height: 95vh; + height: unset; +} +.updatePropertyNumber { + .pt-update-no-popup-wrapper { + @apply m-md; + } + .search-form-wrapper { + display: inherit; + padding: 16px; + .submit-bar { + position: absolute; + bottom: 25px; + width: 90%; + } + .submit-bar-disabled { + position: absolute; + bottom: 25px; + width: 90%; + } + } +} + +@screen dt { + .updatenumber-warper-citizen{ + min-height: 100vh; + height: unset; + } + .updatePropertyNumber { + .h1 { + @apply m-md; + } + .search-form-wrapper { + .submit-bar { + width: 100% !important; + position: unset !important; + } + .submit-bar-disabled { + position: absolute; + bottom: 25px; + width: 90%; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/EmployeeLogin.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/EmployeeLogin.scss new file mode 100644 index 00000000000..185bd91f9e7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/EmployeeLogin.scss @@ -0,0 +1,7 @@ +.EmployeeLoginFooter{ + margin: auto; + @apply absolute bottom-10; + img{ + @apply h-4 object-contain; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/cardfix.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/cardfix.scss new file mode 100644 index 00000000000..14a0b34383b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/cardfix.scss @@ -0,0 +1,13 @@ +.flex-fit{ + @apply flex w-full border-b border-solid border-border; + padding : 8px 10px; +} +.card-count{ + @apply pr-xl; + div{ + @apply text-link; + span{ + @apply text-link font-bold; + } + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/container.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/container.scss new file mode 100644 index 00000000000..ee8cd235421 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/container.scss @@ -0,0 +1,72 @@ +.icon-bg-secondary { + @apply flex bg-secondary w-12 h-12; + + svg { + margin: auto; + @apply w-6 h-6; + } +} + +.heading-m { + @apply font-bold text-text-primary text-heading-m ml-md pt-sm; +} +.BPAheading-m { + margin-left: 22px; +} + +.break-line { + @apply border-border my-lg; +} + +.employee-home-footer { + @apply flex h-10 pb-md pt-sm justify-center w-full; + img { + height: 100%; + } +} +.employee-login-home-footer{ + @apply flex fixed bottom-0 h-10 bg-grey-bg pb-md pt-sm justify-center w-full; + img{ + @apply ml-sm + } +} +.fieldInspectionWrapper{ + border: 1px solid theme(colors.border); + padding: 16px; + margin-top: 8px; + background: theme(colors.grey.light); +} + +.fieldInsepctionInsideWrapper { + border: 1px solid theme(colors.border); + padding: 16px; + margin-top: 8px; + background: theme(colors.white); + max-width: 70%; + min-width: 280px; +} + +@screen dt { + .ground-container { + margin-bottom: 56px; + @apply p-md; + } + .heading-m { + @apply text-heading-m-dt; + } + .BPAheading-m { + margin-left: 22px; + } + .break-line { + margin-top: 40px; + margin-bottom: 40px; + } + .employee-home-footer { + } + .moduleCardWrapper { + @apply flex flex-row flex-wrap !important; + } + .gridModuleWrapper { + @apply grid grid-cols-4 gap-4; + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/dss.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/dss.scss new file mode 100644 index 00000000000..f211b041697 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/dss.scss @@ -0,0 +1,266 @@ +.dss-switch-tabs{/* Card / Primary */ + +/* Light Theme / Paper */ + +background: theme(colors.white); +/* Card-Shadow */ + +box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16); +border-radius: 4px; +margin-bottom:3%; +margin-right:25px; +} + +.dss-header-label{ + font-weight: 600 !important; + font-size: 22px !important; + white-space: pre-line; +} +.dss-switch-tab-wrapper{ + cursor:pointer; + display: flex; + flex-direction: row; + height: 50px; + align-items: center; +} + +.dss-switch-tab-selected{ + /* Revenue */ + border-bottom: 3px solid theme(colors.primary.main); + font-family: Roboto; + font-style: normal; + font-weight: 500; + font-size: 22px; + color: theme(colors.primary.main); + padding: 7px 24px; + +} +.dss-switch-tab-unselected{ + +font-family: Roboto; +font-style: normal; +font-weight: 500; +font-size: 22px; +color: theme(colors.text.secondary); +padding: 8px 24px; + +} + +.dss-table-subheader{ + position: relative; + top: -7px; + font-size: 13px; + font-weight: 400; + color: rgba(80, 90, 95, 1); +} + +.dss-pie-subheader{ + position: relative; + top: -7px; + font-size: 13px; + font-weight: 400; + color: rgba(80, 90, 95, 1); +} + +.recharts-legend-item{ + margin-bottom: 20px !important; + white-space: pre; +} + +.dss-white-pre{ + white-space: pre; + +} +.dss-white-pre-line{ + white-space: pre-line; + +} +.dss-white-pre-temp{ + white-space: pre-line; + +} + +.multi-select-dropdown-wrap{ + .master{ + .label{ + p{ + white-space:pre; + margin: auto; + margin-left:0px; + padding-left: 1%; + } + } + } +} + +.divToBeHidden{ + display:block; +} + +.divWillGetHidden{ + display:none; +} + +.dss-temp-white-pre{ + white-space: pre; +} + +.dss-input-active-border{ +--border-opacity: 1; +border: 1px solid theme(colors.primary.main) !important; +border-color: rgba(244, 119, 56, var(--border-opacity)); +} + +.dss-card { + display: flex; + flex-wrap: wrap; +} + +.dss-card-parent { + display: flex; + flex-direction: column; + width: 31%; + border-radius: 6px; + padding: 25px; + margin: 15px 11.5px; + box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); + cursor: pointer; +} + +.dss-card-body { + display: flex; + flex-wrap: wrap; + cursor: pointer; +} + +.dss-card-header { + display: flex; + margin-bottom: 30px; + align-items: center; + + p { + font-size: 24px; + font-family: "Roboto", sans-serif; + font-weight: 500; + color: theme(colors.black); + } + + svg { + width: 50px; + height: 50px; + } +} + + +.dss-insight-card { + margin: 10px 0; + + p { + font-family: "Roboto", sans-serif; + } + + .p1 { + font-size: 16px; + color: #585858; + } + + .p3 { + font-size: 16px; + font-weight: 400; + } + + .p2 { + font-size: 24px; + font-weight: 500; + color: theme(colors.black); + } + + .color-green { + color: theme(colors.success); + } + + .color-red { + color: theme(colors.error); + } +} +.w-100 { + width: 100%; +} +.dss-w-100 { + width: 97%; +} + +.h-100{ + width: 100%; + height: 100%; +} + +.dss-h-100{ + width: 97%; + height: 100%; +} + +.tab-rows{ + display: flex; + justify-content:space-between; + height: 30px; + align-items: center; + width: 60%; + margin-left: 13%; +} +.tab-header{ + font-weight: 700; + font-size: 16px; + line-height: 19px; + border-bottom: 1px solid #b1b4b6; + color: #2a3340; +} +.map-status{ + position: relative; + width: 33%; + left: 50%; + bottom: 130px; +} +.map-row{ + display: flex; + align-items: center; + margin-top: 5px; +} +.map-box{ + display: inline-block; + height: 10px; + width: 10px; +} +.map-text{ + margin-left: 5px; + color: #636363; + font-size: 14px; +} + + +@media screen and (max-width: 768px) { + .dss-switch-tabs{/* Card / Primary */ + margin-right:0px; + } + + .dss-card-parent{ + width:100%; + } +} + +.dss-metric-horizontal{ + width: 48%; + max-width: 48%; +} +.dss-primary{ + display: inline; + margin-right: 10px; + path{ + fill:theme(colors.primary.main); + } +} + +.dss-horizontal-v2{ + width: 22.7%; + max-width: 22.7%; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/form-fields.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/form-fields.scss new file mode 100644 index 00000000000..d5eb9b56939 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/form-fields.scss @@ -0,0 +1,13 @@ +.form-field{ + @apply w-full +} + +@screen dt { + .form-field{ + @apply w-1/2 + } + + .desktop-w-full{ + @apply w-full !important + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/iframe.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/iframe.scss new file mode 100644 index 00000000000..1f3b992c708 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/iframe.scss @@ -0,0 +1,66 @@ +body { + margin: 0; + padding: 0; + font-family: "Roboto"; + background: #f4f7fb; + } + + + .app-container-iframe { + border-width: 0px; + div[class^="MuiCircularProgress"] { + position: sticky; + top: 90%; + left: 50%; + } + div[role^="progressbar"] { + left: 50%; + position: sticky; + } + } + + @media only screen and (min-width: 953px) { + .app-container-iframe { + border-width: 0px; + position: fixed; + width: 83.5%; + height: calc(100vh - 64px); + } + } + + + @media (max-width: 768px) { + .app-container-iframe { + border-width: 0; + width: 100vw; + height: 100vh; + margin: 32px 0 0 0; + } + } + @media (max-width: 375px) { + .app-container-iframe { + border-width: 0; + width: 100vw; + height: 100vh; + margin: 32px 0 0 0; + } + } + +.app-iframe-wrapper{ + left: 64px; + border-width: 0; + position: fixed; + top: 80px; +} + .app-iframe{ + width: 97%; + height: calc(100vh - 90px); + border-width: 0; + position: fixed; + } + @media (max-width: 768px) { + + .app-iframe-wrapper{ + left: 0px; + } + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss new file mode 100644 index 00000000000..b19e0b2d12e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss @@ -0,0 +1,585 @@ +.complaint-links-container { + @apply bg-white; + border-radius: 4px; + .header { + @apply flex items-center border-b border-border justify-between; + + .logo { + width: 56px; + height: 56px; + @apply bg-focus; + padding: 12px; + border-radius: 4px; + svg { + @apply w-8 h-8; + } + } + + .text { + @apply pl-md text-heading-m font-bold; + } + } + + .body { + padding: 10px; + @apply flex items-start flex-col; + margin-left: 46px; + + .link { + @apply p-sm text-primary-main items-center; + display: flex !important; + a{ + color: inherit; + text-decoration: inherit + } + } + + .inbox-total { + padding: 4px; + display: table; + @apply whitespace-normal text-center text-white w-8 h-8 bg-primary-main rounded-full ml-xs; + } + } + + .links-wrapper { + @apply pl-md py-sm text-text-btn; + .link { + padding: 0 !important; + padding-bottom: 4px !important; + svg { + @apply ml-sm; + } + } + } +} + +.MobilePopupHeadingWrapper { + @apply flex place-content-between mb-md; + h2 { + @apply text-heading-l font-bold; + } +} + +.filter-button { + @apply text-primary-main; + &:hover { + @apply text-primary-dark cursor-pointer; + } +} + +.employeeCard-info-box { + @apply flex justify-end ml-md; + background-color: theme(colors.grey.light); + div { + margin-right: 32px; + span:nth-child(2) { + @apply font-bold; + color: #4f5a5f; + } + } + .employeeCard-info-data { + display: flex; + flex-direction: column; + } +} + +.filter-form { + .filter-card { + @apply bg-white min-h-full; + padding: 10px; + + .heading { + justify-content: unset; + @apply flex; + + .clearAll { + display: none; + } + } + + .filter-label { + @apply font-bold text-heading-l flex gap-3; + padding-bottom: 6px; + svg { + fill: theme(colors.text.primary); + } + } + .sub-filter-label { + font-weight: 400; + font-size: 16px; + } + } + .filter-form-field { + p { + @apply text-form-field text-text-primary block mb-md; + } + } +} + +.inbox-container { + .filters-container { + .filter { + .filter-card { + @apply bg-white; + padding: 10px; + .filter-card-close-button { + @apply flex flex-row-reverse; + } + .heading { + @apply flex justify-between; + + .clearAll { + display: none; + } + } + + .filter-label { + @apply text-heading-m block flex gap-3 items-center; + padding-bottom: 6px; + svg { + fill: theme(colors.text.primary); + } + } + + .sub-filter-label { + font-weight: 400; + font-size: 16px; + } + } + } + + .search-complaint-container { + @apply items-center bg-white p-md; + + .complaint-input-container { + @apply w-full; + .complaint-input { + @apply flex flex-col; + + .clear-search { + @apply text-focus; + display: none; + &:hover { + color: theme(colors.link.hover); + cursor: pointer; + } + } + } + + .mobile-input { + } + } + } + } + + .status-container { + margin-bottom: 50px; + } +} + +.clear-search, +.clear-search .link-label { + @apply text-focus; + @apply block; + cursor: pointer; + &:hover { + color: #000; + } +} +.button-clear { + @apply text-focus text-body-s-dt; +} + +.inbox-count { + @apply inline ml-sm p-sm bg-primary-main rounded-full text-white text-heading-s align-middle text-center font-regular; +} + +@screen dt { + .complaint-links-container { + @apply bg-white; + + .header { + @apply flex items-center border-b border-border; + + .logo { + @apply bg-focus; + padding: 12px; + border-radius: 4px; + } + + .text { + @apply pl-md text-heading-m-dt font-bold; + } + } + + .body { + padding: 10px; + @apply flex items-start flex-col; + margin-left: 46px; + + .link { + @apply p-sm text-primary-main; + } + } + } + + .inboxLinks { + margin: 0 !important; + padding: 0 !important; + .header { + border: none; + @apply justify-start; + .logo { + @apply bg-white; + svg { + path { + fill: theme(colors.primary.main); + } + } + } + } + .body { + margin-left: 0; + } + } + + .filter-form { + .filter-card { + @apply p-md bg-white; + + .heading { + @apply flex justify-between; + } + + .label { + @apply text-heading-s; + } + } + } + + .inbox-container { + @apply flex; + + .filters-container { + width: 270px; + + .filter { + @apply mt-md; + + .filter-card { + @apply p-md bg-white; + + .heading { + @apply flex justify-between; + } + + .label { + @apply text-heading-s; + } + } + } + .citizen-filter { + margin-top: unset; + } + } + + .search-container { + width: 874px; + + .search-complaint-container { + margin: auto; + @apply flex flex-col items-start mb-md bg-white p-md; + + .complaint-header { + display: flex; + @apply flex justify-between w-full; + margin-bottom: 20px; + } + + .complaint-input-container { + /* display: inline-block !important; */ + display: grid; + grid-template-columns: 33.33% 33.33% 33.33%; + + &.for-pt { + &.for-search { + grid-template-columns: 25% 25% 25% 25%; + + .input-fields:nth-child(3n) { + @apply mr-md !important; + } + + .input-fields:nth-child(4n) { + margin-right: 0 !important; + } + + .search-submit-wrapper { + grid-column: 4/5; + /* margin-top: 56px;*/ + max-width: unset; + margin-left: unset; + } + } + } + + .search-submit-wrapper { + grid-column: 3/4; + margin-left: 50%; + max-width: 50%; + grid-column: 3/4; + @apply flex flex-col justify-center text-center; + + .submit-bar-search { + margin-top: unset; + width: 100%; + margin-bottom: 20px; + margin-left: unset; + max-width: 100%; + width: 100%; + } + } + + .input-fields { + /*width: calc(50% - 16px);*/ + + @apply inline-block mr-md !important; + + .inbox-search-form-error { + padding-top: 0; + margin-top: 0; + @apply absolute; + } + } + + .input-fields:nth-child(3n) { + margin-right: 0 !important; + } + + .complaint-input { + @apply flex flex-col; + + .clear-search { + @apply text-focus; + @apply block; + cursor: pointer; + &:hover { + color: theme(colors.link.hover); + cursor: pointer; + } + } + } + + .mobile-input { + @apply ml-sm; + } + } + + .search-action-wrapper { + width: 33%; + margin-top: 28px; + @apply inline-block align-middle text-center; + button { + margin: 0; + width: 100%; + max-width: 300px !important; + } + } + } + + .search-complaint-container-for-search { + } + } + } +} + +.document-clear-all { + grid-area: 2/2; + display: flex; + justify-content: flex-end; + padding-right: 16px; + align-items: center; +} + +.cell-text { + color: theme(colors.text.secondary); +} + +.sla-cell-error { + color: theme(colors.error); + background-color: rgba(212, 53, 28, 0.12); + padding: 0 24px; + border-radius: 11px; +} + +.sla-cell-success { + color: theme(colors.success); + background-color: rgba(0, 112, 60, 0.12); + padding: 0 24px; + border-radius: 11px; +} + +.complain-no-cell-text { + margin-top: "4px"; + color: "theme(colors.text.secondary)"; +} + +.search-error-label { + @apply font-bold text-legend text-error mb-sm !important; +} + +.inbox-action-container { + display: flex; + justify-content: flex-end; + align-items: flex-start; +} +.complaint-links-container .header .removeHeight { + line-height: 28px; +} + +@screen dt { + .complaint-links-container .header .removeBorderRadiusLogo { + border-radius: 2px !important; + } +} +@screen dt { + .customEmployeeCard { + width: 263px !important; + height: 263px !important; + } +} +.employeeTotalLink { + color: theme(colors.text.secondary); + font-size: 16px; + text-decoration: none; +} + +@screen dt { + .groupBill-custom { + .custom-group-merge-container { + display: flex !important; + justify-content: space-between !important; + .header { + display: flex; + align-items: baseline; + .logo { + margin-right: 1rem; + svg { + path { + fill: theme(colors.primary.main); + } + } + } + .h1 { + font-size: 24px; + line-height: 28px; + font-weight: 400; + color: theme(colors.primary.main); + } + } + } + .inbox-container { + .search-container { + .search-complaint-container { + display: flex; + flex-direction: row; + } + .group-complaint-input-container { + width: 33% !important; + display: flex; + flex-direction: column; + } + } + } + .inbox-action-container { + display: flex; + flex-direction: row-reverse; + .clear-search { + margin-top: 65px; + margin-left: 16px; + padding-top: unset !important; + } + .submit-bar-search { + margin-top: 55px !important; + } + } + } +} + +.plumber-details-new-value-wrapper { + flex: 2 1 auto; +} + +.connection-details-new-value-wrapper { + flex: 1 1 auto; +} + +.connection-details-old-value-wrapper, +.plumber-details-old-value-wrapper { + flex: 1 1 auto; + + .old-value-null-wrapper { + visibility: hidden; + padding-bottom: 8px; + margin-bottom: 8px; + } + .row { + color: #b1b4b6; + font-weight: 700; + font-size: 16px; + } +} + +.search-tabs-container { + border-bottom: 1px solid rgba(0, 0, 0, 0.2); + margin-bottom: 35px; + display: flex; + justify-content: space-between; + + .search-tab-head { + padding: 10px 35px; + } + + .search-tab-head-selected { + padding: 10px 35px; + color: rgb(244, 119, 56); + border-bottom: 4px solid rgb(244, 119, 56); + font-weight: bold; + } + + .search-tab-head-selected:focus { + outline: 0; + } +} + +.card-with-background { + background: rgb(250, 250, 250); + border: 1px solid rgb(214, 213, 212); + + .card-head { + display: flex; + justify-content: space-between; + margin-bottom: 30px; + } + + h2 { + font-size: 16px; + font-weight: 700; + } +} + +.registryTable { + tHead { + tr { + th { + text-align: center; + } + } + } + tBody { + tr { + td { + text-align: center; + } + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss new file mode 100644 index 00000000000..8f41c6938d8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss @@ -0,0 +1,572 @@ +@import "./login.scss"; +/* TODO: convert using tailwind */ +.employee { + .breadcrumb { + @apply ml-sm mb-lg; + } + .ground-container { + margin-bottom: 56px; + @apply flex flex-col; + } + .card-home { + font-size: 16px; + padding: 0 0 16px 0; + width: 92vw; + display: inline-block; + margin: 8px auto; + } + .home-action-cards { + height: auto !important; + min-height: 263px; + } + .topbar { + position: fixed; + top: 0; + width: 100%; + padding: 16px 24px; + background: white; + box-shadow: rgba(0, 0, 0, 0.24) 0 1px 4px; + z-index: 9999; + + img { + display: inline; + + &.city { + margin-right: 8px; + height: 48px; + width: 48px; + } + + &.state { + height: 20px; + max-height: 20px; + width: auto; + } + } + + .ulb { + font-weight: bold; + } + + .right { + float: right; + margin-top: 12px; + + .user-img-txt { + background: theme(colors.primary.main); + padding: 10px 15px; + border-radius: 50%; + color: white; + font-weight: 700; + } + } + } + + .main { + padding-top: 88px; + } + + .loginContainer { + padding-top: 88px; + } + + .react-time-picker { + width: 100%; + } + + .react-time-picker__wrapper { + border: 1px solid theme(colors.inputBorder); + } + + .react-time-picker__clock { + display: none; + } + + .react-time-picker__inputGroup__leadingZero { + padding-right: 8px; + display: inline !important; + } + + .react-time-picker__inputGroup__input { + padding: 0; + min-width: none; + outline: none !important; + border: none !important; + } + + .react-time-picker__wrapper { + padding-left: 8px; + } +} + +.citizen { + .main { + padding-top: 82px; + min-height: calc(100vh - 90px); + } +} + +.citizen, +.employee { + .sidebar { + position: fixed; + left: 0; + background: #0B4B66; + height: 100%; + color: theme(colors.white); + margin-top: 83px; + z-index: 10000; + transition: 0.3s ease all; + white-space: nowrap; + height: calc(100vh - 36px); + padding-bottom: 5rem; + + .actions { + cursor: pointer; + display: flex; + align-items: center; + .tooltip { + margin-left: 16px; + } + margin-bottom: 0px; + } + + svg { + width: 24px; + height: 24px; + fill: theme(colors.white); + } + a { + display: flex; + } + .sidebar-link { + display: flex; + color: theme(colors.white); + justify-content: space-between; + align-items: center; + padding: 20px; + font-size: 14px; + + &.level-0 { + margin:0 0.3rem 0 0.3rem; + &.select-level{ + border-top: 1px solid; + border-bottom: 1px solid; + } + } + + &.active { + color: theme(colors.primary.main) !important; + + border-right: none; + svg { + fill: theme(colors.primary.main) !important; + } + } + .employee-search-input { + border: none; + outline: none; + background-color: rgba(0, 0, 0, 0); + margin-left: 13px; + } + .custom-link { + .tooltip { + margin-left: 16px; + span { + margin-left: unset !important; + left: unset !important; + } + } + } + + svg { + fill: theme(colors.white) !important; + width: 21px; + height: 21px; + } + + &:hover { + + background-color: #0B4B66; + + cursor: pointer; + + } + .search-icon-wrapper { + border: 2px solid theme(colors.white); + border-radius: 4px; + padding: 5px; + svg { + fill: theme(colors.white) !important; + width: 21px; + height: 21px; + path { + fill: theme(colors.white) !important; + } + } + } + } + .dropdown-link { + height: 40px; + display: flex; + margin-left: 40px; + align-items: center; + text-decoration: none; + color: theme(colors.white); + font-size: 14px; + .actions { + .tooltiptext { + left: unset; + right: 1%; + } + } + svg { + width: 20px; + height: 20px; + fill: theme(colors.white); + } + &:hover { + background-color: #6A8E9D; + opacity: 0.8; + cursor: pointer; + svg { + fill: #fe7a51 !important; + } + } + + + &.active { + border-left: 4px solid theme(colors.primary.main); + &.level-0 { + + } + &.level-1 { + border-left: 8.5px solid theme(colors.primary.main); + } + &.level-2 { + border-left: 4px solid theme(colors.primary.main); + } + + &.level-3{ + + } + color: theme(colors.primary.main) !important; + border-right: none; + svg { + fill: theme(colors.primary.main) !important; + } + } + } + span { + margin-left: 16px; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + } + + .wrapperStyles { + margin-top: -5px; + padding-left: 20px; + padding-top: 10px; + + .containerStyles { + border: 1px solid theme(colors.text.secondary); + padding: 16px; + margin-bottom: 20px; + } + + &.leftBorder { + border-left: 2px solid rgba(0, 0, 0, 0.12); + } + } + + .rowContainerStyles { + @apply flex flex-col; + } + + .tableContainerStyles { + border: 1px solid theme(colors.text.secondary); + padding: 16px; + margin-bottom: 20px; + } + + .historyTables { + display: grid; + grid-template-rows: 100px 100px; + grid-template-columns: repeat(5, minmax(100px, 1fr)); + } + + .historyContent { + margin: 0 10px; + position: relative; + padding-bottom: 5px; + } + + .historyCheckpoint { + background-color: #fe7a51; + border-radius: 100%; + width: 18px; + height: 18px; + display: inline-block; + position: relative; + left: -9px; + top: 4px; + + &.zIndex { + z-index: 10; + } + } + + .historyTableDateLabel { + color: rgba(0, 0, 0, 0.87); + font-size: 16px; + font-weight: 700; + line-height: 17px; + text-align: left; + display: inline-block; + padding-top: 5px; + } + + .bottomMargin { + margin-bottom: 0px; + } + + .historyTableDate { + color: rgba(0, 0, 0, 0.87); + font-size: 19px; + font-weight: 400; + line-height: 17px; + text-align: left; + display: inline-block; + padding-top: 10px; + } + + .historyHorizontalBar { + background-color: rgba(0, 0, 0, 0.12); + width: auto; + height: 2px; + margin-left: 16px; + } + + .smallText { + font-weight: 500; + font-size: 14px; + } +} + +.citizen { + .sidebar { + margin-top: 54px; + min-width: 200px; + .actions { + display: flex; + align-items: center; + gap: 10px; + } + } +} + +.link { + @apply text-primary-main cursor-pointer; + + :hover { + @apply text-primary-dark; + } +} + +.RightMostTopBarOptions { + @apply flex; + .EventNotificationWrapper { + @apply relative cursor-pointer ml-md; + span { + top: -10px; + right: -10px; + @apply absolute bg-error h-5 w-5 rounded-full text-center; + p { + line-height: 20px; + } + } + } + .select-wrap { + margin-bottom: unset; + svg { + fill: theme(colors.white); + } + } +} + +@media (min-width: 640px) { + .employee { + .ground-container { + @apply block; + } + .breadcrumb { + @apply mb-lg; + margin-left: 0; + } + .card-home { + width: 270px; + margin-right: 10px; + margin-bottom: 10px; + } + .card-home-hrms { + width: 405px; + padding: 0px; + margin-right: 16px; + margin-bottom: 16px; + } + .main { + display: flex; + flex-direction: column; + padding-top: 80px; + margin-left: 72px; + width: calc(100%-83px); + } + .citizen-home-container { + display: flex; + flex-direction: unset !important; + width: unset !important; + margin-left: unset !important; + padding-top: 58px; + } + } + + .citizen { + .main { + width: 100%; + padding-top: 58px; + height: 100%; + display: flex; + justify-content: center; + } + + .center-container { + } + } +} + +.fullWidth { + width: 100%; +} + +.multi-select-container { + .disposal-text { + @apply font-bold; + } + + .disposal-info { + @apply my-md ml-sm; + } + + .disposal-action-bar { + @apply flex justify-between items-center; + } +} + +@screen dt { + .d-grid { + display: grid; + grid-template-columns: 250px 250px 250px 250px; + column-gap: 10px; + row-gap: 2px; + margin-left: -12px; + } +} + +.m-auto { + margin: auto !important; +} + +.mb-50 { + margin-bottom: 50px; +} +.mb-25 { + margin-bottom: 25px; +} + +.back-wrapper { + display: flex; + justify-content: space-between; + + .top-back-btn { + margin-bottom: 0px; + color: theme(colors.white); + margin-right: 1em; + & svg { + fill: theme(colors.white); + } + } + .hambuger-back-wrapper { + display: flex; + @media (min-width: 780px) { + .hamburger-span { + display: none; + } + } + } +} + +@screen dt { + .back-wrapper { + margin-right: 2rem; + margin-left: 2rem; + } +} + +.user-profile { + @media (min-width: 780px) { + width: calc(100% - 219px); + margin-left: 16px; + margin-right: 16px; + } +} + +.link { + a{ + color: inherit; + text-decoration: inherit + } +} + +.breadcrumb { + a{ + color: inherit; + text-decoration: inherit + } +} + +.sidebar-link.active{ +.custom-link{ + text-decoration: none; + div{ + span{ + color: theme(colors.primary.main) !important; + text-decoration: none; + } + } +} +} +.bread-crumb { + a{ + color: inherit; + text-decoration: inherit + } +} + +.sidebar-link{ + .custom-link{ + text-decoration: none; + div{ + span{ + color: theme(colors.white); + text-decoration: none; + } + } + } + } + +/* TODO fix required NABEEL/ANIL for home screen card */ + .customEmployeeCard { + @apply m-sm !important; + } diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss new file mode 100644 index 00000000000..2ec40a63ca1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss @@ -0,0 +1,221 @@ +.loginFormStyleEmployee { + .employeeCard { + .submit-bar { + @apply w-full; + } + } +} +.banner .bannerCard{ + min-width: 420px !important; +} +.employeeForgotPassword .employeeCard .field .field-container .component-in-front { + margin-top: 0; + border: 1px solid; + border-right: none; + padding: 7px; +} +@screen dt { + .employeeForgotPassword .employeeCard .field .field-container .component-in-front { + padding: 7px; + } + .loginFormStyleEmployee .employeeCard, .banner .bannerCard{ + min-width: 420px !important; + } + .employeeForgotPassword .employeeCard, .employeeChangePassword .employeeCard{ + max-width: 420px !important; + min-width: 420px !important; + } +} + +.employeeForgotPassword .employee-card-input { + margin-bottom: 0px; + border-left: none; +} + +.employeeForgotPassword .field-container { + margin: 10px 0; +} +.employeeForgotPassword { + .submit-bar { + @apply w-full; + } +} +.employeeChangePassword .submit-bar { + width: 100% !important; +} +.employeeChangePassword .card-text { + text-align: center; +} +.employeeChangePassword .input-otp-wrap { + text-align: center; +} +.submit-bar { + .submit-bar { + @apply w-full; + } +} +.loginFormStyleEmployee .bannerHeader p, +.employeeForgotPassword .bannerHeader p, +.employeeChangePassword .bannerHeader p { + font-size: 19px; +} +.employeeCard .card-sub-header { + font-size: 24px; +} +.loginFormStyleEmployee .employeeCard .card-label, .employeeForgotPassword .employeeCard .card-label{ + font-weight: normal; + font-size: 16px; + line-height: 19px; + color: theme(colors.text.primary); + margin-top: 20px; +} +.banner .bannerHeader { + margin-bottom: 20px; +} +.employeeCard .card-label{ + font-weight: normal; + font-size: 16px; + line-height: 19px; + color: theme(colors.text.primary); +} +.profile-label-margin{ + margin-top: 10px; +} + +.employeeForgotPassword .employeeCard .card-label-desc { + font-weight: normal; + font-size: 16px; + line-height: 24px; + color: theme(colors.text.secondary); + margin-top: 15px; +} +.employeeChangePassword .employeeCard .card-text { + margin-bottom: 15px; + font-size: 16px; + color: theme(colors.text.secondary); +} +@media screen and (max-width: 768px) { + .employeeChangePassword .employeeCard .card-text { + margin-top: 7px; + } + .employeeCard .card-sub-header { + font-size: 18px; + } +} +.employeeChangePassword .employeeCard .card-text-button { + text-align: center !important; + margin-bottom: 12px !important; +} +.employeeChangePassword .employeeCard .input-otp-wrap { + margin-bottom: 10px; +} +.employee .loginContainer { + padding-top: 0px !important; +} +.banner { + height: calc(100vh ) !important; +} + +.employeeChangePassword .employeeCard .field .field-container{ + margin-bottom: 24px; +} + +.employeeForgotPassword .employeeCard .employee-card-sub-header, .employeeChangePassword .employeeCard .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header{ + font-size: 24px !important; + line-height: 28px !important; + margin-bottom: 0px !important; +} +@media screen and (max-width : 768px){ + .employeeForgotPassword .employeeCard .employee-card-sub-header, .employeeChangePassword .employeeCard .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header{ + font-size: 18px !important; + line-height: 21px !important; + margin-bottom: 0px !important; + } + .loginFormStyleEmployee .employeeCard, .banner .bannerCard{ + min-width: 340px !important; + margin: 10px !important; + } + .employeeForgotPassword .employeeCard, .employeeChangePassword .employeeCard{ + max-width: 360px !important; + min-width: 340px !important; + margin: 10px !important; + } +} +.employeeChangePassword .employeeCard .card-text{ + margin-top: 18px !important; + margin-bottom: 20px !important; +} +.employeeBackbuttonAlign{ + display: none; +} +.resend-otp{ + cursor: pointer; +} + +.employee-select-wrap.login-city-dd { + .options-card{ + max-height: 200px; + } +} +@media screen and (max-width: 768px){ + .employeeBackbuttonAlign{ + display: block; + position: absolute; + top: 20px; + left: 20px; + } + .banner{ + align-items: flex-end; + padding-bottom: 40px; + height: 100vh !important; + } + .topbar{ + background: rgba(34, 57, 77, var(--bg-opacity)) !important; + color: white; + } + .employee .loginContainer{ + padding-top: 0px !important; + } + .removeBottomMargin{ + margin-bottom: 0px !important; + } + .employee-select-wrap.login-city-dd { + .options-card{ + max-height: 160px; + } + } +} + + +.loginFormStyleEmployee { + + .loginCardSubHeaderClassName { + text-align: center !important; + } + .loginCardClassName { + margin: auto !important; + min-width: 408px !important; + header.employee-card-sub-header{ + text-align: center; + margin-top: 10px; + } + } + .buttonClassName { + max-width: 100% !important; + width: 100% !important + } + .field .field-container .text-input input { + margin-bottom: 5px !important; + } + .bannerHeader { + margin-bottom: 0px !important; + } + + .primary-label-btn { + margin: 20px auto 0 auto !important; + } + + .employee-select-wrap .options-card { + max-height: 150px !important; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/oldMobileInbox.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/oldMobileInbox.scss new file mode 100644 index 00000000000..0c8e7812570 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/oldMobileInbox.scss @@ -0,0 +1,5 @@ +.linksWrapperForMobileInbox{ + .header{ + justify-content: initial; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/popupmodule.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/popupmodule.scss new file mode 100644 index 00000000000..b8a99b6f5d7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/popupmodule.scss @@ -0,0 +1,34 @@ +.popup-module { + width: 480px; + margin: 0 auto; + @apply bg-white; + + .popup-module-main { + @apply px-lg pb-lg; + } + + .popup-module-action-bar { + gap: 16px; + @apply flex flex-row justify-end; + } +} + +@screen dt { + .popup-module { + width: 480px; + margin: auto; + @apply bg-white; + + .popup-module-main { + @apply px-lg pb-lg; + } + .popup-module-main { + @apply w-full p-sm h-full; + } + + .popup-module-action-bar { + gap: 16px; + @apply flex flex-row justify-end; + } + } +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/response.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/response.scss new file mode 100644 index 00000000000..31a3993d26a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/response.scss @@ -0,0 +1,3 @@ +.secondary-action{ + @apply inline float-right; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/scroll-table.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/scroll-table.scss new file mode 100644 index 00000000000..c6637ebbce6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/scroll-table.scss @@ -0,0 +1,119 @@ +.scroll-table-wrapper{ + &::-webkit-scrollbar { + display: none; + } + -ms-overflow-style: none; + scrollbar-width: none; + @apply relative overflow-x-scroll overflow-y-visible pb-sm text-center; + + .scroll-table-width-wrapper{ + &::-webkit-scrollbar { + display: none; + } + -ms-overflow-style: none; + scrollbar-width: none; + width: calc(100% - 110px); + margin: auto; + @apply overflow-x-scroll; + table{ + margin: auto; + } + } + + .first-col{ + width:110px; + @apply absolute left-0; + } + + .last-col{ + width:110px; + @apply absolute right-0; + } +} + +@screen dt{ + .scroll-table-wrapper{ + width: 60%; + } +} +.table-switch-card-chip{ + display: flex; + cursor: pointer; + padding-right: 10px; + width: 100%; +} + +.table-search-wrapper{ + display:flex; + width:100%; + align-items:center; +} +.table-switch-card-inactive{ + /* Frame 58 */ + + +/* Auto layout */ + +display: flex; +flex-direction: row; +align-items: flex-start; +padding: 8px; + +position: static; +height: 40px; +left: 84px; +top: 0px; + +/* Light Theme / Paper */ + +background: theme(colors.white); +box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); + +/* Inside auto layout */ + +flex: none; +flex-grow: 0; +margin: 0px 0px; +color: #B1B4B6; +} +.table-switch-card-inactive:hover{ + background: #fffffc; + font-size: 17px; + color: theme(colors.text.secondary); +} + +.table-switch-card-active{/* Frame 57 */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 8px; + + position: static; + height: 40px; + left: 0px; + top: 0px; + + /* Light Theme / Paper */ + + background: theme(colors.white); + /* Light Theme / Primary */ + + border: 1px solid theme(colors.primary.main); + box-sizing: border-box; + box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + margin: 0px 0px; +} + +.icon-wrapper { + margin-left:1rem; + cursor:pointer +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/surveys.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/surveys.scss new file mode 100644 index 00000000000..bcfa2aa5eae --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/surveys.scss @@ -0,0 +1,273 @@ +.surveydetailsform-wrapper { + @apply grid gap-6 py-md; + + label { + @apply font-medium; + } + .surveyformfield { + @apply grid gap-4; + } + + .employee-select-wrap, + .employee-card-input { + margin-bottom: 0; + } +} + +.newSurveyForm_wrapper { + @apply grid p-md bg-grey-light border border-border rounded gap-6 ; + .newSurveyForm_questions { + } + .newSurveyForm_answer { + } + .newSurveyForm_actions { + @apply flex justify-end gap-4 py-md; + .checkbox-wrap .label { + margin-left: 40px; + } + } + .newSurveyForm_seprator { + @apply w-px h-6 border border-border; + } +} + +.surveyformslist_wrapper, +.surveydetailsform-wrapper { + .heading { + @apply text-heading-l font-medium py-md; + } +} + +.surveyformslist_wrapper { + @apply grid gap-6 py-md; +} + +.options_checkboxes { + @apply flex flex-col gap-4; +} + +.optioncheckboxwrapper { + @apply flex; +} + +.simple_editable-input { + outline-width: 0; + border: 0; + border-bottom: 2px solid black; +} + +.simple_readonly-input { + outline-width: 0; + border: 0; + background: transparent; +} + +.pointer { + cursor: pointer; +} + +.disabled-btn { + @apply pointer-events-none cursor-not-allowed; +} + +.optionradiobtnwrapper { + @apply flex gap-2; + + .customradiobutton { + @apply w-6 h-6; + } +} + +.edit-action-btn { + @apply flex justify-end; +} + +.surveyQuestion-wrapper{ + @apply grid gap-6; +} + +.question-title { + font-size: 18px; + line-height: 21px; + color: theme(colors.text.primary); + font-weight: 700; +} + +.responses-container { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 8px 4px; + background-color: theme(colors.grey.light); + border: 1px solid theme(colors.border); + box-sizing: border-box; + border-radius: 4px; + margin-top: 20px; + margin-bottom: 20px; + position: relative; +} + +.responses-container-date { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 8px 8px 0px 8px; + position: static; + left: 0px; + top: 41px; + background: theme(colors.grey.light); + border: 1px solid theme(colors.border); + box-sizing: border-box; + border-radius: 4px; + margin-top: 20px; + margin-bottom: 20px; +} + +.responses-container-line { + width: 100%; + margin-bottom: -12px; +} + +.date-time{ + margin-top: 10px; + margin-bottom: 10px; +} + +.response-result { + flex: none; + order: 1; + flex-grow: 0; + margin: 0px 0px -20px; + display: inline-block; +} + +.date-container { + display: flex; +flex-direction: column; +justify-content: center; +align-items: center; +padding: 16px 8px; +background: theme(colors.grey.light); +border: 1px solid theme(colors.border); +box-sizing: border-box; +border-radius: 4px; +@apply gap-y-6; +} + +.date-response { +display: flex; +flex-direction: row; +font-weight: bold; +@apply gap-10 ; +} +.divide { + --tw-divide-x-reverse: 0; +border-right-width: calc(2px * var(--tw-divide-x-reverse)); +border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse))); +} + +.circle { + background-color:red; + height:40px; + border-radius:50%; + -moz-border-radius:50%; + -webkit-border-radius:50%; + width:40px; +} + +.align-columns{ + @apply grid gap-4; +} + + +@screen dt { + .surveydetailsform-wrapper { + .surveyformfield { + @apply items-center; + grid-template-columns: 1fr 2fr 1fr; + + .radio-wrap { + @apply flex gap-20; + margin-bottom: 0; + } + .radio-wrap div { + @apply flex items-center; + } + + .radio-btn { + @apply w-6 h-6; + } + + .radio-btn-checkmark { + height: 1.75rem; + width: 1.75rem; + --border-opacity: 1; + border: 1px solid theme(colors.inputBorder); + border-color: rgba(70, 70, 70, var(--border-opacity)); + border-radius: 9999px; + display: block; + } + + .radio-wrap .radio-btn-wrap input:checked ~ .radio-btn-checkmark:after { + display: block; + --bg-opacity: 1; + background-color: theme(colors.primary.main); + background-color: rgba(244, 119, 56, var(--bg-opacity)); + height: 1.25rem; + width: 1.25rem; + border-radius: 9999px; + position: absolute; + top: 4px; + left: 4px; + } + } + } + + .newSurveyForm_wrapper { + @apply grid p-md bg-grey-light border border-border rounded; + grid-template-columns: 33% 1fr; + + .newSurveyForm_quesno { + @apply text-heading-m font-medium; + } + + .newSurveyForm_mainsection { + } + .newSurveyForm_questions { + @apply flex gap-4; + + .text-input { + @apply w-3/4; + } + .employee-select-wrap { + @apply flex-1; + } + } + .newSurveyForm_answer { + } + .newSurveyForm_actions { + @apply flex justify-end gap-2; + .checkbox-wrap { + @apply items-center; + margin-bottom: 0; + } + .checkbox-wrap .label { + margin-left: 40px; + } + } + .newSurveyForm_seprator { + @apply w-px h-6 border border-border; + } + } + + .surveyformslist_wrapper { + @apply w-3/4 grid gap-6 py-md; + } +} + +.unstyled-button { + border: none; + padding: 0; + background: none; +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/tooltip.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/tooltip.scss new file mode 100644 index 00000000000..5a4f67caba6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/tooltip.scss @@ -0,0 +1,36 @@ +.tooltip { + position: relative; + display: inline-block; + } + + .tooltip .tooltiptext { + visibility: hidden; + background-color: #555; + color: #fff; + text-align: left; + border-radius: 6px; + padding: 5px; + position: absolute; + z-index: 1; + bottom: 125%; + left: 50%; + margin-left: -60px; + opacity: 0; + transition: opacity 0.3s; + } + + .tooltip .tooltiptext::after { + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: #555 transparent transparent transparent; + } + + .tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; + cursor: pointer; + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/updateNumber.scss b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/updateNumber.scss new file mode 100644 index 00000000000..fbd3294177d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/src/pages/employee/updateNumber.scss @@ -0,0 +1,13 @@ +.updateNumberEmployee{ + width: 100%; + .employee-data-table .row h2{ + font-weight:500; + width: 100%; + } + .submit-bar { + position: relative; + } + .search-form-wrapper { + justify-content: initial; + } +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowdown.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowdown.svg new file mode 100644 index 00000000000..b7456af64e7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowdown.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowleft.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowleft.svg new file mode 100644 index 00000000000..291db649e0a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/arrowleft.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/calendar.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/calendar.svg new file mode 100644 index 00000000000..db8c32d6b24 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/calendar.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/camera.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/camera.svg new file mode 100644 index 00000000000..5f0b5297983 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/camera.svg @@ -0,0 +1,4 @@ + + + + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/check.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/check.svg new file mode 100644 index 00000000000..88018af3276 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/check.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/close.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/close.svg new file mode 100644 index 00000000000..357ce662494 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/close.svg @@ -0,0 +1,4 @@ + + + + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error.svg new file mode 100644 index 00000000000..2f3e7d76748 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error2.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error2.svg new file mode 100644 index 00000000000..008d258c3d6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/error2.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/searchicon.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/searchicon.svg new file mode 100644 index 00000000000..bca3b004413 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/searchicon.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starempty.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starempty.svg new file mode 100644 index 00000000000..8d295e7219b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starempty.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starfilled.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starfilled.svg new file mode 100644 index 00000000000..23481e8ccb2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/starfilled.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/success.svg b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/success.svg new file mode 100644 index 00000000000..e846ff61864 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/svg/success.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/css/tailwind.config.js b/frontend/workbench-ui/web/micro-ui-internals/packages/css/tailwind.config.js new file mode 100644 index 00000000000..673ba2cfaba --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/css/tailwind.config.js @@ -0,0 +1,231 @@ +module.exports = { + future: { + removeDeprecatedGapUtilities: true, + purgeLayersByDefault: true, + }, + purge: { enabled: true, content: ["./example/index.html"] }, + theme: { + screens: { + dt: "780px", + sm: { max: "425px" }, + }, + colors: { + primary: { + light: "#F18F5E", + main: "#F47738", + dark: "#C8602B", + }, + secondary: "#22394D", + text: { + primary: "#0B0C0C", + secondary: "#505A5F", + }, + link: { + normal: "#1D70B8", + hover: "#003078", + }, + border: "#D6D5D4", + inputBorder: "#464646", + "input-border": "#464646", + focus: "#F47738", + error: "#D4351C", + success: "#00703C", + black: "#000000", + grey: { + dark: "#9E9E9E", + mid: "#EEEEEE", + light: "#FAFAFA", + bg: "#E3E3E3", + }, + white: "#FFFFFF", + }, + fontFamily: { + sans: ["Roboto", "sans-serif"], + rc: ['"Roboto Condensed"', "sans-serif"], + }, + fontSize: { + "heading-xl-dt": ["48px", "56px"], + "heading-xl": ["32px", "40px"], + "heading-l-dt": ["36px", "40px"], + "heading-l": ["24px", "32px"], + "heading-m-dt": ["24px", "32px"], + "heading-m": ["18px", "28px"], + "heading-s": ["16px", "24px"], + "caption-xl-dt": ["27px", "32px"], + "caption-xl": ["18px", "26px"], + "caption-l-dt": ["24px", "28px"], + "caption-l": ["18px", "21px"], + "caption-m-dt": ["19px", "23px"], + "caption-m": ["16px", "19px"], + "form-field": ["16px", "20px"], + "body-l-dt": ["19px", "28px"], + "body-l": ["16px", "24px"], + "body-s-dt": ["16px", "24px"], + "body-s": ["14px", "16px"], + legend: ["19px", "23px"], + link: ["16px", "24px"], + "text-btn": ["16px", "24px"], + }, + fontWeight: { + regular: 400, + medium: 500, + bold: 700, + }, + padding: { + sm: "8px", + md: "16px", + lg: "24px", + xl: "36px", + }, + margin: { + xs: "4px", + sm: "8px", + md: "16px", + lg: "24px", + xl: "64px", + }, + borderWidth: { + default: "1px", + 0: "0", + 2: "1px", + 4: "4px", + 10: "10px", + }, + boxShadow: { + card: "0 1px 2px 0 rgba(0, 0, 0, 0.16)", + radiobtn: "0 0 0 5px #F47738", + }, + inset: { + 0: 0, + 6: "6px", + 10: "10px", + }, + extend: {}, + digitv2: { + lightTheme: { + primary: "#F47738", + "text-color-primary": "#0B0C0C", + "text-color-secondary": "#505A5F", + "text-color-disabled": "#B1B4B6", + background: "#EEEEEE", + paper: "#FFFFFF", + "paper-secondary": "#FAFAFA", + divider: "#D6D5D4", + "header-sidenav": "#0B4B66", + "input-border": "#505A5F", + "primary-bg": "#FEEFE7", + }, + alert: { + error: "#D4351C", + "error-bg": "#EFC7C1", + success: "#00703C", + "success-bg": "#BAD6C9", + info: "#3498DB", + "info-bg": "#C7E0F1", + }, + chart: { + "chart-1": "#048BD0", + "chart-1-gradient": "#048BD0", + "chart-2": "#FBC02D", + "chart-2-gradient": "#FBC02D", + "chart-3": "#8E29BF", + "chart-4": "#EA8A3B", + "chart-5": "#0BABDE", + }, + fontSize: { + "heading-xl": { + mobile: "2rem", + tablet: "2.25rem", + desktop: "2.5rem", + }, + "heading-l": { + mobile: "1.5rem", + tablet: "1.75rem", + desktop: "2rem", + }, + "heading-m": { + mobile: "1.25rem", + tablet: "1.375rem", + desktop: "1.5rem", + }, + "heading-s": { + mobile: "1rem", + tablet: "1rem", + desktop: "1rem", + }, + "heading-xs": { + mobile: "0.75rem", + }, + "caption-l": { + mobile: "1.5rem", + tablet: "1.75rem", + desktop: "1.75rem", + }, + "caption-m": { + mobile: "1.25rem", + tablet: "1.5rem", + desktop: "1.5rem", + }, + "caption-s": { + mobile: "1rem", + tablet: "1.25rem", + desktop: "1.25rem", + }, + "body-l": { + mobile: "1rem", + tablet: "1.25rem", + desktop: "1.25rem", + }, + "body-s": { + mobile: "0.875rem", + tablet: "1rem", + desktop: "1rem", + }, + "body-xs": { + mobile: "0.75rem", + tablet: "0.875rem", + desktop: "0.875rem", + }, + label: { + mobile: "1rem", + tablet: "1rem", + desktop: "1rem", + }, + link: { + mobile: "1rem", + tablet: "1rem", + desktop: "1rem", + }, + }, + fontFamily: { + sans: ["Roboto"], + rc: ['"Roboto Condensed"'], + }, + fontStyle: { + normal: "normal", + italic: "italic", + }, + textDecorationLine: { + underline: "underline", + }, + fontWeight: { + regular: 400, + medium: 500, + bold: 700, + }, + lineHeight: { + "line-height-body-l": { mobile: "1.5rem", tablet: "1.75rem", desktop: "1.75rem" }, + "line-height-body-s": { mobile: "1.0938rem", tablet: "1.5rem", desktop: "1.5rem" }, + "line-height-body-xs": { mobile: "1.125rem", tablet: "1.5rem", desktop: "1.5rem" }, + normal: "normal", + }, + screens: { + mobile: "400px", + tablet: "768px", + desktop: "1024px", + }, + }, + }, + variants: {}, + plugins: [], +}; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/README.md b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/README.md new file mode 100644 index 00000000000..39fc8cb4ee5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/README.md @@ -0,0 +1,32 @@ +# digit-ui-libraries + +> Made with @egovernments/create-ui-library + +## Install + +```bash +npm install --save @egovernments/digit-ui-libraries +``` + +## Usage + +```jsx +import React from "react"; +import initLibraries from "@egovernments/digit-ui-libraries"; + +import defaultConfig from "./config"; + +const App = ({ deltaConfig, stateCode, cityCode, moduleCode }) => { + initLibraries(); + + const store = eGov.Services.useStore(defaultConfig, { deltaConfig, stateCode, cityCode, moduleCode }); + + return

Create React Library Example 😄

; +}; + +export default App; +``` + +## License + +MIT © [](https://github.com/) diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/package.json b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/package.json new file mode 100644 index 00000000000..c8f1cf4de7d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/package.json @@ -0,0 +1,50 @@ +{ + "name": "@egovernments/digit-ui-libraries", + "version": "1.8.0-beta", + "main": "dist/index.js", + "module": "dist/index.modern.js", + "source": "src/index.js", + "license": "MIT", + "files": [ + "dist" + ], + "scripts": { + "build": "microbundle-crl --compress --no-sourcemap --format cjs", + "start": "microbundle-crl watch --no-compress --format modern,cjs", + "prepublish": "yarn build" + }, + "peerDependencies": { + "react": "17.0.2" + }, + "devDependencies": { + "gh-pages": "2.2.0", + "microbundle-crl": "0.13.11", + "react-dom": "17.0.2", + "react-scripts": "^4.0.1" + }, + "dependencies": { + "axios": "0.21.1", + "babel-preset-react": "6.24.1", + "date-fns": "2.28.0", + "html2canvas": "1.4.1", + "dom-to-image": "2.6.0", + "i18next": "19.9.2", + "i18next-react-postprocessor": "3.0.7", + "pdfmake": "0.1.72", + "react": "17.0.2", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "react-redux": "7.2.8", + "react-router-dom": "5.3.0", + "redux": "4.1.2", + "xlsx": "0.17.5" + }, + "author": "JaganKumar ", + "keywords": [ + "digit", + "egov", + "dpg", + "digit-ui", + "libraries" + ] +} diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/configUtils.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/configUtils.js new file mode 100644 index 00000000000..05df9e7def6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/configUtils.js @@ -0,0 +1,46 @@ +export const getSectionInfo = (formId, sectionId, defaultConfigCopy) => { + let sectionInfo; + let fieldToUpdate = { field: "", fields: [] }; + for (let section of defaultConfigCopy) { + sectionInfo = section.form.find((formDetail) => { + return formDetail.id === sectionId; + }); + if (sectionInfo) { + if (sectionInfo.fields) { + for (let field of sectionInfo.fields) { + if (field.id === formId) { + fieldToUpdate.field = field; + fieldToUpdate.fields = sectionInfo.fields; + break; + } else { + if (field.fields) { + for (let innerField of field.fields) { + if (innerField.id === formId) { + fieldToUpdate.field = innerField; + fieldToUpdate.fields = field.fields; + break; + } + } + } + } + } + } + } + } + return fieldToUpdate; +}; + +export const ifObjectContainsArray = (object) => { + if (Array.isArray(object)) { + return { hasArray: true, value: object }; + } + for (const property in object) { + if (object.hasOwnProperty(property)) { + const element = object[property]; + if (Array.isArray(element)) { + return { hasArray: true, value: element }; + } + } + } + return { hasArray: false, value: [] }; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/index.js new file mode 100644 index 00000000000..2bc6a46fbfc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/index.js @@ -0,0 +1,31 @@ +export const getConfig = (ComponentMap, GetFunction, { config, state, repeatClicked, handlesubmit, register, onSubmit }) => { + if (!config || config.length === 0) return []; + return config.map((item) => { + const { component, name, fields, submit, ...props } = item; + return { + ...props, + // submit: submit ? GetFunction(submit) : undefined, + fields: + fields && fields.length > 0 + ? getConfig(ComponentMap, GetFunction, { + config: fields, + state, + repeatClicked, + handlesubmit, + register, + onSubmit, + }) + : null, + name, + value: state[name], + handlesubmit: component === "form" ? handlesubmit : null, + onSubmit: component === "form" ? onSubmit : null, + repeats: component === "form-section-repeat-group" ? state[name + "-repeats"] || 1 : null, + dorepeat: component === "form-section-repeat-group" ? repeatClicked(name) : null, + ref: component === "input-select" || component === "input-field" || component === "city-mohalla" ? register : null, + register: component === "input-select" || component === "input-field" || component === "city-mohalla" ? register : null, + // onChange: component === 'input-field' ? onChange(name) : null, + component: ComponentMap[component], + }; + }); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/mergeConfig.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/mergeConfig.js new file mode 100644 index 00000000000..60ecf21491d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/config/mergeConfig.js @@ -0,0 +1,157 @@ +// let defaultConfig = require("./default2.json"); +import { ifObjectContainsArray } from "./configUtils"; + +let defaultConfigCopy = {}; +let sectionToBeUpdated = {}; +let currentUpdatableSection = []; +let selectedProperty = ""; + +const MergeConfigObj = (defaultConfig, deltaConfig) => { + defaultConfigCopy = JSON.parse(JSON.stringify(defaultConfig)); + let deltaConfigCopy = JSON.parse(JSON.stringify(deltaConfig)); + processStateConfig(deltaConfigCopy); + return defaultConfigCopy; +}; + +const processStateConfig = (deltaConfig) => { + if (Array.isArray(deltaConfig)) { + deltaConfig.forEach((forms) => { + sectionToBeUpdated = {}; + InitSectionToUpdate(forms); + }); + } +}; + +const InitSectionToUpdate = (forms) => { + if (forms.id && !forms.__property__) { + GetCurrentUpdatableSection(forms.id, defaultConfigCopy); + } + if (forms.__property__ && forms.__action__) { + selectedProperty = forms.__property__; + currentUpdatableSection = currentUpdatableSection.length === 0 ? defaultConfigCopy : currentUpdatableSection; + findSectionById(selectedProperty, currentUpdatableSection); + seachInDefaultConfig(forms.__property__, forms); + } else if (Array.isArray(forms)) { + forms.forEach((form) => { + InitSectionToUpdate(form); + }); + } else if (ifObjectContainsArray(forms).hasArray) { + let array = ifObjectContainsArray(forms).value; + InitSectionToUpdate(array); + } else { + throw new Error("__property__ or __action__ not found"); + } +}; + +const GetCurrentUpdatableSection = (id, defaultConfigCopy) => { + if (Array.isArray(defaultConfigCopy)) { + for (let i = 0; i < defaultConfigCopy.length; i++) { + if (defaultConfigCopy[i].id === id) { + currentUpdatableSection.push(defaultConfigCopy[i]); + } else if (ifObjectContainsArray(defaultConfigCopy[i]).hasArray) { + let array = ifObjectContainsArray(defaultConfigCopy[i]).value; + GetCurrentUpdatableSection(id, array); + } + } + } +}; + +const findSectionById = (id, currentUpdatableSection) => { + if (Array.isArray(currentUpdatableSection)) { + for (let i = 0; i < currentUpdatableSection.length; i++) { + if (currentUpdatableSection[i].id === id) { + sectionToBeUpdated = currentUpdatableSection; + } else if (ifObjectContainsArray(currentUpdatableSection[i]).hasArray) { + let arr = ifObjectContainsArray(currentUpdatableSection[i]).value; + findSectionById(id, arr); + } + } + } + + return sectionToBeUpdated; +}; + +const seachInDefaultConfig = (id, action) => { + if (!Array.isArray(sectionToBeUpdated) && !sectionToBeUpdated.id) { + throw new Error("id not found"); + } + if (sectionToBeUpdated.id === id) { + actionHandler(action, id, sectionToBeUpdated); + } else if (Array.isArray(sectionToBeUpdated)) { + sectionToBeUpdated.forEach((section) => { + if (section.id === id) { + actionHandler(action, id, sectionToBeUpdated); + } + }); + } else if (ifObjectContainsArray(sectionToBeUpdated).hasArray) { + sectionToBeUpdated = ifObjectContainsArray(sectionToBeUpdated).value; + seachInDefaultConfig(id, action); + } +}; + +const actionHandler = (action, id, fieldList) => { + const index = getIndex(id, fieldList); + if (!action) { + return; + } + if (action.__action__ === "UPDATE") { + updateAt(index, action, fieldList); + deleteExtraKeys(action); + } + if (action.__action__ === "DELETE") { + deleteAt(index, fieldList); + deleteExtraKeys(action); + } + if (["INSERT_AFTER", "INSERT_BEFORE"].includes(action.__action__)) { + handleInsertion(index, action, fieldList); + } +}; + +const handleInsertion = (index, action, fields) => { + index = action.__action__ === "INSERT_BEFORE" ? index : index + 1; + insertAt(index, action, fields); + deleteExtraKeys(action); +}; + +const getIndex = (propertyValue, fields) => { + let index = fields.findIndex((option) => option.id === propertyValue); + + return index; +}; + +const insertAt = (index, data, fields) => { + if (!data.id) { + throw new Error("id is required is required to insert a record"); + } + fields.splice(index, 0, data); +}; + +const updateAt = (index, data, fields) => { + if (fields[index].id !== data.id) { + throw new Error(`id ${data.id} not matched`); + } + fields[index] = { ...fields[index], ...data }; +}; + +const deleteAt = (index, fields) => { + fields.splice(index, 1); +}; + +const deleteExtraKeys = (data) => { + delete data.__action__; + delete data.__property__; +}; + +const getMergedConfig = (defaultConfig, deltaConfig) => { + let mergedConfigObj = defaultConfig; + + for (const key in deltaConfig) { + if (deltaConfig.hasOwnProperty(key)) { + const mergedConfig = MergeConfigObj(defaultConfig[key], deltaConfig[key]); + mergedConfigObj[key] = mergedConfig; + } + } + return mergedConfigObj; +}; + +export default getMergedConfig; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/contexts/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/contexts/index.js new file mode 100644 index 00000000000..202c8fd57bf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/contexts/index.js @@ -0,0 +1,6 @@ +import React from "react"; + +const ComponentProvider = React.createContext(); +const PrivacyProvider = React.createContext({}); + +export default { ComponentProvider ,PrivacyProvider}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/ConfigActionTypes.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/ConfigActionTypes.js new file mode 100644 index 00000000000..f0d76ead434 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/ConfigActionTypes.js @@ -0,0 +1,5 @@ +const ConfigActionTypes = Object.freeze({ + CONFIG_UPDATE: "CONFIG_UPDATE", +}); + +export default ConfigActionTypes; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/FormFields.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/FormFields.js new file mode 100644 index 00000000000..83ba271d1dc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/FormFields.js @@ -0,0 +1,5 @@ +const FormFields = Object.freeze({ + INPUT: "input-fields", +}); + +export default FormFields; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/Pages.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/Pages.js new file mode 100644 index 00000000000..edba2497c27 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/Pages.js @@ -0,0 +1,7 @@ +const Pages = Object.freeze({ + PGR_LIST: "pgr-list", + PGR_NEW_COMPLAINT: "pgr-new-complaint", + PGR_SEARCH: "pgr-search-complaint", +}); + +export default Pages; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/index.js new file mode 100644 index 00000000000..8dbb59fea95 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/enums/index.js @@ -0,0 +1,7 @@ +import Pages from "./Pages"; +import ConfigActionTypes from "./ConfigActionTypes"; +// import FormFields from "./FormFields;" + +const Enums = { Pages, ConfigActionTypes }; + +export default Enums; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDSSDashboard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDSSDashboard.js new file mode 100644 index 00000000000..0371e5a5cbc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDSSDashboard.js @@ -0,0 +1,8 @@ +import { useQueries } from "react-query"; +import { getDSSDashboardData } from "../../services/molecules/DSS/getDSSDashboardData"; + +const useDSSDashboard = (stateCode, mdmsType, moduleCode, config) => { + return useQueries(getDSSDashboardData(stateCode, mdmsType, moduleCode, config)); +}; + +export default useDSSDashboard; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDashboardConfig.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDashboardConfig.js new file mode 100644 index 00000000000..82ea22ce7bf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useDashboardConfig.js @@ -0,0 +1,8 @@ +import { useQuery } from "react-query"; +import { DSSService } from "../../services/elements/DSS"; + +const useDashoardConfig = (moduleCode) => { + return useQuery(`DSS_DASHBOARD_CONFIG_${moduleCode}`, () => DSSService.getDashboardConfig(moduleCode)); +}; + +export default useDashoardConfig; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetChart.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetChart.js new file mode 100644 index 00000000000..20d41f3736d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetChart.js @@ -0,0 +1,56 @@ +import { useQuery } from "react-query"; +import { startOfMonth, endOfMonth, getTime } from "date-fns"; +import { DSSService } from "../../services/elements/DSS"; + +const getRequest = (type, code, requestDate, filters, moduleLevel = "", addlFilter) => { + let newFilter = { ...{ ...filters, ...addlFilter } }; + let updatedFilter = Object.keys(newFilter) + .filter((ele) => newFilter[ele].length > 0) + .reduce((acc, curr) => { + acc[curr] = newFilter[curr]; + return acc; + }, {}); + return { + aggregationRequestDto: { + visualizationType: type.toUpperCase(), + visualizationCode: code, + queryType: "", + filters: updatedFilter, + moduleLevel: moduleLevel, + aggregationFactors: null, + requestDate, + }, + }; +}; +const defaultSelect = (data) => { + if (data?.responseData) { + if (data?.responseData?.data) { + data.responseData.data = data?.responseData?.data?.filter((col) => col) || []; + data.responseData.data?.forEach((row) => { + if (row?.plots) { + row.plots = row?.plots.filter((col) => col) || []; + } + }); + } + } + return data; +}; + +const useGetChart = (args) => { + const { key, type, tenantId, requestDate, filters, moduleLevel, addlFilter } = args; + return useQuery( + [args], + () => + DSSService.getCharts({ + ...getRequest(type, key, requestDate, filters, moduleLevel, addlFilter), + headers: { + tenantId, + }, + }), + { + select: defaultSelect, + } + ); +}; + +export default useGetChart; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterRequestValues.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterRequestValues.js new file mode 100644 index 00000000000..2154e446939 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterRequestValues.js @@ -0,0 +1,8 @@ +import { useQuery } from "react-query"; +import { DSSService } from "../../services/elements/DSS"; + +const useGetCustomFilterRequestValues = (filterConfigs, config={}) => { + return useQuery(`DSS_CUSTOM_FILTER_REQUEST_VAL_${JSON.stringify(filterConfigs)}`, () => DSSService.getCustomFiltersDynamicValues(filterConfigs), config); +}; + +export default useGetCustomFilterRequestValues; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterValues.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterValues.js new file mode 100644 index 00000000000..2620c074f93 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetCustomFilterValues.js @@ -0,0 +1,8 @@ +import { useQuery } from "react-query"; +import { DSSService } from "../../services/elements/DSS"; + +const useGetCustomFilterValues = (filterConfigs, config={}) => { + return useQuery(`DSS_CUSTOM_FILTER_CONFIG_${JSON.stringify(filterConfigs)}`, () => DSSService.getFiltersConfigData(filterConfigs), config); +}; + +export default useGetCustomFilterValues; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useMDMS.js new file mode 100644 index 00000000000..2b420c26019 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useMDMS.js @@ -0,0 +1,20 @@ +import { useQuery } from "react-query"; +import { MdmsService } from "../../services/elements/MDMS"; + +const useDssMDMS = (tenantId, moduleCode, type, config) => { + const useDssDashboard = () => { + return useQuery("DSS_DASHBOARD", () => MdmsService.getDssDashboard(tenantId, moduleCode), config); + }; + const _default = () => { + return useQuery([tenantId, moduleCode, type], () => MdmsService.getMultipleTypes(tenantId, moduleCode, type), config); + }; + + switch (type) { + case "DssDashboard": + return useDssDashboard(); + default: + return _default(); + } +}; + +export default useDssMDMS; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useCreate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useCreate.js new file mode 100644 index 00000000000..998a5f5c844 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useCreate.js @@ -0,0 +1,8 @@ +import { Engagement } from "../../services/elements/Engagement"; +import { useMutation } from "react-query"; + +const useCreateDocument = (filters, config) => { + return useMutation((filters) => Engagement.create(filters)); +}; + +export default useCreateDocument; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useDelete.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useDelete.js new file mode 100644 index 00000000000..31d3d23b329 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useDelete.js @@ -0,0 +1,8 @@ +import { Engagement } from "../../services/elements/Engagement"; +import { useMutation } from "react-query"; + +const useDelteDocument = (filters, config) => { + return useMutation((filters) => Engagement.delete(filters)); +}; + +export default useDelteDocument; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useMdms.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useMdms.js new file mode 100644 index 00000000000..b29de4cd1cb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useMdms.js @@ -0,0 +1,19 @@ +import { MdmsService, getGeneralCriteria } from "../../services/elements/MDMS"; +import { useQuery } from "react-query"; + +export const useEngagementMDMS = (tenantId, moduleCode, type, config = {}, payload = []) => { + const useDocumentCategory = () => { + return useQuery(type, () => MdmsService.getDataByCriteria(tenantId, getGeneralCriteria(tenantId, moduleCode, type), moduleCode), config); + }; + + const _default = () => { + return useQuery([tenantId, moduleCode, type], () => MdmsService.getMultipleTypes(tenantId, moduleCode, type), config); + }; + + switch (type) { + case "DocumentsCategory": + return useDocumentCategory(); + default: + return _default(); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useSearch.js new file mode 100644 index 00000000000..730737b969a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useSearch.js @@ -0,0 +1,8 @@ +import { Engagement } from "../../services/elements/Engagement"; +import { useMutation, useQuery } from "react-query"; + +const useSearch = (filters, config) => { + return useQuery(["search_engagement", filters?.name, filters?.category, filters?.tenantIds, filters?.postedBy, filters?.offset, filters?.limit ], () => Engagement.search(filters), { ...config }); +}; + +export default useSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useUpdate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useUpdate.js new file mode 100644 index 00000000000..2c081065831 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/engagement/useUpdate.js @@ -0,0 +1,8 @@ +import { Engagement } from "../../services/elements/Engagement"; +import { useMutation } from "react-query"; + +const useUpdateDocument = (filters, config) => { + return useMutation((filters) => Engagement.update(filters)); +}; + +export default useUpdateDocument; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/index.js new file mode 100644 index 00000000000..1c0bb57bae5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/index.js @@ -0,0 +1,185 @@ +import { useQuery, useMutation } from "react-query"; + +const tsToDate = (ts) => { + const plus0 = num => `0${num.toString()}`.slice(-2) + const d = new Date(ts) + const month = d.toLocaleString("default", {month: 'short'}).toUpperCase() + const date = plus0(d.getDate()) + const hour = plus0(d.getHours()) + const minute = plus0(d.getMinutes()) + + return { + month, + date, + hour, + minute + } +} + +const isEqual = (from, to) => from === to ? from : `${from} - ${to}` + +const timeStampBreakdown = (fromTS, toTS) => { + const fromDateTime = tsToDate(fromTS) + const toDateTime = tsToDate(toTS) + return { + onGroundEventMonth: isEqual(fromDateTime.month, toDateTime.month), + onGroundEventDate: isEqual(fromDateTime.date, toDateTime.date), + onGroundEventTimeRange: `${fromDateTime.hour}:${fromDateTime.minute} - ${toDateTime.hour}:${toDateTime.minute}` + } +} + +const fetchImageLinksFromFilestoreIds = async (filesArray, tenantId) => { + const ids = filesArray?.map(file => file.fileStoreId) + const res = await Digit.UploadServices.Filefetch(ids, tenantId); + if (res.data.fileStoreIds && res.data.fileStoreIds.length !== 0) { + return res.data.fileStoreIds.map((o, index) => ({ + actionUrl: o.url.split(",")[0], + code: "VIEW_ATTACHMENT" + })); + } else { + return []; + } + }; + +const getTransformedLocale = label => { + if (typeof label === "number") return label; + label=label?.trim(); + return label && label.toUpperCase().replace(/[.:-\s\/]/g, "_"); +}; +const getTimeFormat = (epochTime) => { + epochTime = new Date(epochTime); + const Period = epochTime.getHours() < 12 ? "AM" : "PM"; + const Format = epochTime.getHours() % 12 > 0 ? epochTime.getHours() % 12 : 12; + return Format.toString() + ":" + epochTime.toString().split(":")[1] + " " + Period; + }; + const getDateFormat = (epochTime) => { + const monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "June", + "July", "Aug", "Sep", "Oct", "Nov", "Dec" + ]; + epochTime = new Date(epochTime); + const day = epochTime.getDate(); + const Month = epochTime.getMonth(); + return day.toString() + " " + monthNames[Month]; + }; + + +const getEventSLA = (item) => { + const days = (Date.now() - item.auditDetails.lastModifiedTime) / (1000 * 60 * 60 * 24); + let time; + let unit; + if (item.eventType === "EVENTSONGROUND") { + const disp = getDateFormat(item.eventDetails.fromDate) + " " + getTimeFormat(item.eventDetails.fromDate) + "-" + getDateFormat(item.eventDetails.toDate) + " " + getTimeFormat(item.eventDetails.toDate); + time=""; + unit=disp; + } else { + if (days >= 60){ + time=[Math.floor(days / 30)]; + unit="EV_SLA_MONTH"; + } + else if (days >= 30){ + time=[Math.floor(days / 30)]; + unit="EV_SLA_MONTH_ONE"; + } + else if (days >= 14){ + time=[Math.floor(days / 7)]; + unit="EV_SLA_WEEK"; + } + else if (days >= 7) { + time=[Math.floor(days / 7)]; + unit="EV_SLA_WEEK_ONE"; + } + else if (days >= 2){ + time=[Math.floor(days)]; + unit="CS_SLA_DAY"; + } + else if (days >= 1){ + time=[Math.floor(days)]; + unit="EV_SLA_DAY_ONE"; + } + else if ((days % 1) * 24 >= 2) { + time=[Math.floor((days % 1) * 24)]; + unit="EV_SLA_TIME"; + } + else if ((days % 1) * 24 >= 1){ + time=[Math.floor((days % 1) * 24)]; + unit="EV_SLA_TIME_ONE"; + } + else if ((days % 1) * 24 * 60 >= 2) { + time=[Math.floor((days % 1) * 24 * 60)]; + unit="EV_SLA_MINUTE"; + } + else if ((days % 1) * 24 * 60 >= 1) { + time=[Math.floor((days % 1) * 24 * 60)]; + unit="EV_SLA_MINUTE_ONE"; + + } + else{ + time=""; + unit="CS_SLA_NOW"; + } + } + + return { + time,unit + }; + }; + + + +const filterAllEvents = async(data, variant) => { + const filteredEvents = data.filter(e => e.status === "ACTIVE") + const events = [] + for(const e of filteredEvents){ + const actionDownloadLinks = e?.eventDetails?.documents?.length > 0 && e?.tenantId ? await fetchImageLinksFromFilestoreIds(e?.eventDetails?.documents, e?.tenantId) : [] + const slaDetails=getEventSLA(e); + events.push({ + ...e, + timePastAfterEventCreation: slaDetails.time, + timeApproxiamationInUnits: slaDetails.unit, + //todo + eventNotificationText: e?.description, + header: e?.eventType === "SYSTEMGENERATED" ? getTransformedLocale(e?.name) : e?.name, + eventType: e?.eventType, + actions: [...(e?.actions?.actionUrls ? e?.actions?.actionUrls : []), ...actionDownloadLinks], + ...variant === "events" || e?.eventType === "EVENTSONGROUND" ? timeStampBreakdown(e?.eventDetails?.fromDate, e?.eventDetails?.toDate) : {}, + }) + } + return events +} + +const variantBasedFilter = async(variant, data) =>{ + switch(variant){ + case "whats-new": + const allWhatsNewEvents = await filterAllEvents(data.events, variant) + return allWhatsNewEvents.filter( i => i?.actions?.length ) + case "events": + return await filterAllEvents(data.events, variant) + default: + return await filterAllEvents(data.events, variant) + } +} + +const getEventsData = async (variant, tenantId) => { + const isLoggedIn = Digit.UserService.getUser() + const data = await Digit.EventsServices.Search({tenantId, auth: !!isLoggedIn, ...variant === "events" ? {filter: {eventTypes: "EVENTSONGROUND"}} : {} }) + const allEventsData = await variantBasedFilter(variant, data) + return allEventsData +} + +const useEvents = ({tenantId, variant, config={}}) => useQuery( + ["EVENTS_SEARCH", tenantId, variant], + () => getEventsData(variant, tenantId), + { + ...config + } ) + +const useClearNotifications = () => useMutation(({tenantId}) => Digit.EventsServices.ClearNotification({tenantId})) + +const useNotificationCount = ({tenantId, config={}}) => useQuery( + ["NOTIFICATION_COUNT", tenantId], + () => Digit.EventsServices.NotificationCount({tenantId}), + { + ...config + }) + +export { useEvents, useClearNotifications, useNotificationCount } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useCreateEvent.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useCreateEvent.js new file mode 100644 index 00000000000..9ba375f166e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useCreateEvent.js @@ -0,0 +1,7 @@ +import { useMutation } from "react-query"; + +const useCreateEvent = () => { + return useMutation(eventData => Digit.EventsServices.Create(eventData)) +} + +export default useCreateEvent; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventDetails.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventDetails.js new file mode 100644 index 00000000000..c1043ce0db1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventDetails.js @@ -0,0 +1,44 @@ +import { useQuery } from 'react-query'; +import { format } from "date-fns"; + +const useEventDetails = (tenantId, filters, config = {}) => { + return useQuery( + ['EVENT_DETAILS', tenantId, filters], + () => Digit.EventsServices.EventDetails(tenantId, filters), + { + select: (data) => { + const details = [{ + title:" ", + asSectionHeader: true, + values: [ + { title: "EVENTS_ULB_LABEL", value: data?.tenantId }, + { title: "EVENTS_NAME_LABEL", value: data?.name }, + { title: "EVENTS_CATEGORY_LABEL", value: data?.eventCategory }, + { title: "EVENTS_DESCRIPTION_LABEL", value: data?.description }, + { title: "EVENTS_FROM_DATE_LABEL", value: format(new Date(data?.eventDetails?.fromDate), 'dd/MM/yyyy') }, + { title: "EVENTS_TO_DATE_LABEL", value: format(new Date(data?.eventDetails?.toDate), 'dd/MM/yyyy') }, + { title: "EVENTS_FROM_TIME_LABEL", value: format(new Date(data?.eventDetails?.fromDate), 'hh:mm'), skip: true }, + { title: "EVENTS_TO_TIME_LABEL", value: format(new Date(data?.eventDetails?.toDate), 'hh:mm'), skip: true }, + { title: "EVENTS_ADDRESS_LABEL", value: data?.eventDetails?.address }, + { title: "EVENTS_MAP_LABEL", + map: true, + value: data?.eventDetails?.latitude && data?.eventDetails?.longitude ? + Digit.Utils.getStaticMapUrl(data?.eventDetails?.latitude, data?.eventDetails?.longitude) : + 'N/A' + }, + { title: "EVENTS_ORGANIZER_NAME_LABEL", value: data?.eventDetails?.organizer }, + { title: "EVENTS_ENTRY_FEE_INR_LABEL", value: data?.eventDetails?.fees }, + ] + }] + return { + applicationData: data, + applicationDetails: details, + tenantId: tenantId + } + }, + ...config + } + ) +} + +export default useEventDetails; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventInbox.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventInbox.js new file mode 100644 index 00000000000..826e342075c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useEventInbox.js @@ -0,0 +1,23 @@ +import { useQuery } from "react-query" + +const combineResponse = (data, users) => { + data.events = data?.events?.map(event => { + const user = users.find(user => user.uuid === event?.auditDetails?.lastModifiedBy) + return { ...event, user } + }); + return data; +} + + +const useInbox = (tenantId, data, filter = {}, config = {}) => { + return useQuery(["EVENT_INBOX", tenantId, data, filter], async () => { + const eventData = await Digit.EventsServices.Search({ tenantId, data, filter }); + const uuids = [] + eventData?.events?.forEach(event => uuids.push(event?.auditDetails?.lastModifiedBy)); + const usersResponse = await Digit.UserService.userSearch(null, { uuid: uuids }, {}); + return combineResponse(eventData, usersResponse?.user); + }, + config); +} + +export default useInbox; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useUpdateEvent.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useUpdateEvent.js new file mode 100644 index 00000000000..77ddb893464 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/events/useUpdateEvent.js @@ -0,0 +1,7 @@ +import { useMutation } from "react-query"; + +const useUpdateEvent = () => { + return useMutation(eventData => Digit.EventsServices.Update(eventData)) +} + +export default useUpdateEvent; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSCount.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSCount.js new file mode 100644 index 00000000000..50b63dadb63 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSCount.js @@ -0,0 +1,8 @@ +import { useQuery, useQueryClient } from "react-query"; +import HrmsService from "../../services/elements/HRMS"; + +export const useHRMSCount = (tenantId, config = {}) => { + return useQuery(["HRMS_COUNT", tenantId], () => HrmsService.count(tenantId), config); +}; + +export default useHRMSCount; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGender.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGender.js new file mode 100644 index 00000000000..7d7e97b0fbf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGender.js @@ -0,0 +1,18 @@ +import { useQuery } from "react-query"; +import { MdmsService } from "../../services/elements/MDMS"; + +const useHRMSGenderMDMS = (tenantId, moduleCode, type, config = {}) => { + const useHRGenders = () => { + return useQuery("HR_GENDER_DETAILS", () => MdmsService.HRGenderType(tenantId, moduleCode ,type), config); + }; + + + switch (type) { + case "GenderType": + return useHRGenders(); + } +}; + + + +export default useHRMSGenderMDMS; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGenderMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGenderMDMS.js new file mode 100644 index 00000000000..7d7e97b0fbf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSGenderMDMS.js @@ -0,0 +1,18 @@ +import { useQuery } from "react-query"; +import { MdmsService } from "../../services/elements/MDMS"; + +const useHRMSGenderMDMS = (tenantId, moduleCode, type, config = {}) => { + const useHRGenders = () => { + return useQuery("HR_GENDER_DETAILS", () => MdmsService.HRGenderType(tenantId, moduleCode ,type), config); + }; + + + switch (type) { + case "GenderType": + return useHRGenders(); + } +}; + + + +export default useHRMSGenderMDMS; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSMDMS.js new file mode 100644 index 00000000000..6616cbe0889 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSMDMS.js @@ -0,0 +1,25 @@ +import { MdmsService } from "../../services/elements/MDMS"; +import { useQuery } from "react-query"; + +const useHrmsMDMS = (tenantId, moduleCode, type, config = {}) => { + const useHrmsRolesandDesignations = () => { + return useQuery(["HRMS_EMP_RD", tenantId], () => MdmsService.getHrmsEmployeeRolesandDesignation(tenantId), config); + }; + const useHrmsEmployeeTypes = () => { + return useQuery(["HRMS_EMP_TYPE", tenantId], () => MdmsService.getHrmsEmployeeTypes(tenantId, moduleCode, type), config); + }; + + const useHrmsEmployeeReasons = () => { + return useQuery(["HRMS_EMP_REASON", tenantId], () => MdmsService.getHrmsEmployeeReason(tenantId, moduleCode, type), config); + }; + + switch (type) { + case "HRMSRolesandDesignation": + return useHrmsRolesandDesignations(); + case "EmployeeType": + return useHrmsEmployeeTypes(); + case "DeactivationReason": + return useHrmsEmployeeReasons(); + } +}; +export default useHrmsMDMS; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSUpdate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSUpdate.js new file mode 100644 index 00000000000..509462726b8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSUpdate.js @@ -0,0 +1,8 @@ +import { useQuery, useMutation } from "react-query"; +import HrmsService from "../../services/elements/HRMS"; + +export const useHRMSUpdate = (tenantId, config = {}) => { + return useMutation((data) => HrmsService.update(data, tenantId)); +}; + +export default useHRMSUpdate; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMScreate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMScreate.js new file mode 100644 index 00000000000..85d0af95e90 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMScreate.js @@ -0,0 +1,8 @@ +import { useQuery, useMutation } from "react-query"; +import HrmsService from "../../services/elements/HRMS"; + +export const useHRMSCreate = (tenantId, config = {}) => { + return useMutation((data) => HrmsService.create(data, tenantId)); +}; + +export default useHRMSCreate; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSsearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSsearch.js new file mode 100644 index 00000000000..77822d3a731 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/hrms/useHRMSsearch.js @@ -0,0 +1,8 @@ +import { useQuery, useQueryClient } from "react-query"; +import HrmsService from "../../services/elements/HRMS"; + +export const useHRMSSearch = (searchparams, tenantId, filters, isupdated, config = {}) => { + return useQuery(["HRMS_SEARCH", searchparams, tenantId, filters, isupdated], () => HrmsService.search(tenantId, filters, searchparams), config); +}; + +export default useHRMSSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js new file mode 100644 index 00000000000..49c902d937b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/index.js @@ -0,0 +1,216 @@ +import { useClearNotifications, useEvents, useNotificationCount } from "./events"; +import useCreateEvent from "./events/useCreateEvent"; +import useUpdateEvent from "./events/useUpdateEvent"; +import { + useBulkPdfDetails, useDemandSearch, useFetchBillsForBuissnessService, useFetchCitizenBillsForBuissnessService, useFetchPayment, useGetPaymentRulesForBusinessServices, usePaymentSearch, usePaymentUpdate, useRecieptSearch +} from "./payment"; +import { useInitStore } from "./store"; +import useAccessControl from "./useAccessControl"; +import { useApplicationsForBusinessServiceSearch } from "./useApplicationForBillSearch"; +import useClickOutside from "./useClickOutside"; +import useCustomMDMS from "./useCustomMDMS"; +import useDocumentSearch from "./useDocumentSearch"; +import useDynamicData from "./useDynamicData"; +import useLocation from "./useLocation"; + +import useInboxGeneral from "./useInboxGeneral/useInboxGeneral"; +import useNewInboxGeneral from "./useInboxGeneral/useNewInbox"; +import useBoundaryLocalities from "./useLocalities"; +import useCommonMDMS from "./useMDMS"; +import useWorkflowDetailsV2 from "./useWorkflowDetailsV2"; +import useModuleTenants from "./useModuleTenants"; +import useQueryParams from "./useQueryParams"; +import useRouteSubscription from "./useRouteSubscription"; +import { useUserSearch } from "./userSearch"; +import useSessionStorage from "./useSessionStorage"; +import useApplicationStatusGeneral from "./useStatusGeneral"; +import useStore from "./useStore"; +import { useTenants } from "./useTenants"; +import useWorkflowDetails from "./workflow"; +import useCustomAPIHook from "./useCustomAPIHook"; +import useCustomAPIMutationHook from "./useCustomAPIMutationHook"; +import useUpdateCustom from "./useUpdateCustom"; + + +import useComplaintDetails from "./pgr/useComplaintDetails"; +import { useComplaintsList, useComplaintsListByMobile } from "./pgr/useComplaintList"; +import useComplaintStatus from "./pgr/useComplaintStatus"; +import useComplaintStatusCount from "./pgr/useComplaintStatusWithCount"; +import useComplaintSubType from "./pgr/useComplaintSubType"; +import useComplaintTable from "./pgr/useComplaintTable"; +import useComplaintTypes from "./pgr/useComplaintTypes"; +import useEmployeeFilter from "./pgr/useEmployeeFilter"; +import useInboxData from "./pgr/useInboxData"; +import useLocalities from "./pgr/useLocalities"; +import useServiceDefs from "./pgr/useServiceDefs"; +import usePGRTenants from "./pgr/useTenants"; +import useGenderMDMS from "./useGenderMDMS"; + +import useEmployeeSearch from "./useEmployeeSearch"; + +import useDashboardConfig from "./dss/useDashboardConfig"; +import useDSSDashboard from "./dss/useDSSDashboard"; +import useGetChart from "./dss/useGetChart"; +import useDssMdms from "./dss/useMDMS"; +import useGetCustomFilterValues from "./dss/useGetCustomFilterValues"; +import useGetCustomFilterRequestValues from './dss/useGetCustomFilterRequestValues'; + + +import useHRMSCount from "./hrms/useHRMSCount"; +import useHRMSCreate from "./hrms/useHRMScreate"; +import useHRMSGenderMDMS from "./hrms/useHRMSGender"; +import useHrmsMDMS from "./hrms/useHRMSMDMS"; +import useHRMSSearch from "./hrms/useHRMSsearch"; +import useHRMSUpdate from "./hrms/useHRMSUpdate"; + + + +import useDocCreate from "./engagement/useCreate"; +import useDocDelete from "./engagement/useDelete"; +import { useEngagementMDMS } from "./engagement/useMdms"; +import useDocSearch from "./engagement/useSearch"; +import useDocUpdate from "./engagement/useUpdate"; +import useEventDetails from "./events/useEventDetails"; +import useEventInbox from "./events/useEventInbox"; + +import useSurveyCreate from "./surveys/useCreate"; +import useSurveyDelete from "./surveys/useDelete"; +import useSurveySearch from "./surveys/useSearch"; +import useSurveyShowResults from "./surveys/useShowResults"; +import useSurveySubmitResponse from "./surveys/useSubmitResponse"; +import useSurveyInbox from "./surveys/useSurveyInbox"; +import useSurveyUpdate from "./surveys/useUpdate"; + + + +import useGetDSSAboutJSON from "./useGetDSSAboutJSON"; +import useGetDSSFAQsJSON from "./useGetDSSFAQsJSON"; +import useGetFAQsJSON from "./useGetFAQsJSON"; +import useGetHowItWorksJSON from "./useHowItWorksJSON"; +import { usePrivacyContext } from "./usePrivacyContext"; +import useStaticData from "./useStaticData"; + + + +const pgr = { + useComplaintDetails, + useComplaintsList, + useComplaintsListByMobile, + useComplaintStatus, + useComplaintTable, + useComplaintTypes, + useEmployeeFilter, + useInboxData, + useLocalities, + useServiceDefs, + useTenants: usePGRTenants, + useComplaintSubType, + useComplaintStatusCount, +}; + + +const dss = { + useMDMS: useDssMdms, + useDashboardConfig, + useDSSDashboard, + useGetChart, + useGetCustomFilterValues, + useGetCustomFilterRequestValues +}; + + +const hrms = { + useHRMSSearch, + useHrmsMDMS, + useHRMSCreate, + useHRMSUpdate, + useHRMSCount, + useHRMSGenderMDMS, +}; + + + + +const events = { + useInbox: useEventInbox, + useCreateEvent, + useEventDetails, + useUpdateEvent, +}; + +const engagement = { + useMDMS: useEngagementMDMS, + useDocCreate, + useDocSearch, + useDocDelete, + useDocUpdate, +}; + +const survey = { + useCreate: useSurveyCreate, + useUpdate: useSurveyUpdate, + useDelete: useSurveyDelete, + useSearch: useSurveySearch, + useSubmitResponse: useSurveySubmitResponse, + useShowResults: useSurveyShowResults, + useSurveyInbox, +}; + +const Hooks = { + useSessionStorage, + useQueryParams, + useFetchPayment, + usePaymentUpdate, + useFetchCitizenBillsForBuissnessService, + useFetchBillsForBuissnessService, + useGetPaymentRulesForBusinessServices, + useWorkflowDetails, + useInitStore, + useClickOutside, + useUserSearch, + useApplicationsForBusinessServiceSearch, + useDemandSearch, + useInboxGeneral, + useEmployeeSearch, + useBoundaryLocalities, + useCommonMDMS, + useApplicationStatusGeneral, + useModuleTenants, + useRecieptSearch, + usePaymentSearch, + useNewInboxGeneral, + useEvents, + useClearNotifications, + useNotificationCount, + useStore, + useDocumentSearch, + useTenants, + useAccessControl, + usePrivacyContext, + pgr, + + dss, + + hrms, + + events, + engagement, + survey, + useGenderMDMS, + useRouteSubscription, + useCustomAPIHook, + useCustomAPIMutationHook, + useWorkflowDetailsV2, + useUpdateCustom, + useCustomMDMS, + useGetHowItWorksJSON, + useGetFAQsJSON, + useGetDSSFAQsJSON, + useGetDSSAboutJSON, + useStaticData, + useDynamicData, + useBulkPdfDetails, + useLocation +}; + +export default Hooks; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/payment.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/payment.js new file mode 100644 index 00000000000..255ac45ff95 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/payment.js @@ -0,0 +1,160 @@ +import { useQuery, useQueryClient } from "react-query"; +import { PaymentService } from "../services/elements/Payment"; + +export const useFetchCitizenBillsForBuissnessService = ({ businessService, ...filters }, config = {}) => { + const queryClient = useQueryClient(); + const { mobileNumber, tenantId } = Digit.UserService.getUser()?.info || {}; + const params = { mobileNumber, businessService, ...filters }; + if (!params["mobileNumber"]) delete params["mobileNumber"]; + const { isLoading, error, isError, data, status } = useQuery( + ["citizenBillsForBuisnessService", businessService, { ...params }], + () => Digit.PaymentService.fetchBill(tenantId, { ...params }), + { + refetchOnMount: true, + retry: false, + ...config, + } + ); + return { + isLoading, + error, + isError, + data, + status, + revalidate: () => queryClient.invalidateQueries(["citizenBillsForBuisnessService", businessService]), + }; +}; + +export const useFetchBillsForBuissnessService = ({ tenantId, businessService, ...filters }, config = {}) => { + const queryClient = useQueryClient(); + let isPTAccessDone = sessionStorage.getItem("IsPTAccessDone"); + const params = { businessService, ...filters }; + const _tenantId = tenantId || Digit.UserService.getUser()?.info?.tenantId; + const { isLoading, error, isError, data, status } = useQuery( + ["billsForBuisnessService", businessService, { ...filters }, config, isPTAccessDone], + () => Digit.PaymentService.fetchBill(_tenantId, params), + { + retry: (count, err) => { + return false; + }, + ...config, + } + ); + return { + isLoading, + error, + isError, + data, + status, + revalidate: () => queryClient.invalidateQueries(["billsForBuisnessService", businessService]), + }; +}; + +export const useFetchPayment = ({ tenantId, consumerCode, businessService }, config) => { + const queryClient = useQueryClient(); + + const fetchBill = async () => { + /* Currently enabled the logic to get bill no and expiry date for PT Module */ + if (businessService?.includes("PT") || businessService?.includes("SW") || businessService?.includes("WS")) { + const fetchedBill = await Digit.PaymentService.fetchBill(tenantId, { consumerCode, businessService }); + const billdetail = fetchedBill?.Bill?.[0]?.billDetails?.sort((a, b) => b.fromPeriod - a.fromPeriod)?.[0] || {}; + fetchedBill.Bill[0].billDetails = fetchedBill?.Bill[0]?.billDetails?.map((ele) => ({ + ...ele, + currentBillNo: fetchedBill?.Bill?.[0]?.billNumber, + currentExpiryDate: billdetail?.expiryDate, + })); + if (fetchedBill && fetchedBill?.Bill?.[0]?.billDetails?.length > 1) { + fetchedBill?.Bill?.[0]?.billDetails?.map(async (billdet) => { + const searchBill = await Digit.PaymentService.searchBill(tenantId, { + consumerCode, + fromPeriod: billdet?.fromPeriod, + toPeriod: billdet?.toPeriod, + service: businessService, + retrieveOldest: true, + }); + billdet.expiryDate = searchBill?.Bill?.[0]?.billDetails?.[0]?.expiryDate; + billdet.billNumber = searchBill?.Bill?.[0]?.billNumber; + }); + } + return fetchedBill; + } else { + return Digit.PaymentService.fetchBill(tenantId, { consumerCode, businessService }); + } + }; + + const retry = (failureCount, error) => { + if (error?.response?.data?.Errors?.[0]?.code === "EG_BS_BILL_NO_DEMANDS_FOUND") return false; + else return failureCount < 3; + }; + + const queryData = useQuery(["paymentFetchDetails", tenantId, consumerCode, businessService], () => fetchBill(), { retry, ...config }); + + return { + ...queryData, + revalidate: () => queryClient.invalidateQueries(["paymentFetchDetails", tenantId, consumerCode, businessService]), + }; +}; + +export const usePaymentUpdate = ({ egId }, businessService, config) => { + const getPaymentData = async (egId) => { + const transaction = await Digit.PaymentService.updateCitizenReciept(egId); + const payments = await Digit.PaymentService.getReciept(transaction.Transaction[0].tenantId, businessService, { + consumerCodes: transaction.Transaction[0].consumerCode, + }); + return { payments, applicationNo: transaction.Transaction[0].consumerCode, txnStatus: transaction.Transaction[0].txnStatus }; + }; + + return useQuery(["paymentUpdate", egId], () => getPaymentData(egId), config); +}; + +export const useGetPaymentRulesForBusinessServices = (tenantId) => { + return useQuery(["getPaymentRules", tenantId], () => Digit.MDMSService.getPaymentRules(tenantId)); +}; + +export const usePaymentSearch = (tenantId, filters, config = {}) => { + return useQuery(["PAYMENT_SERACH", tenantId], () => Digit.PaymentService.searchBill(tenantId, filters), { + select: (data) => { + return data?.Bill?.[0]?.billDetails?.[0]?.billAccountDetails.filter((e) => { + switch (e.taxHeadCode) { + case "WS_CHARGE": + case "WS_TIME_PENALTY": + case "WS_TIME_INTEREST": + case "SW_TIME_INTEREST": + case "SW_TIME_PENALTY": + case "SW_CHARGE": + case "WS_WATER_CESS": + case "WS_TIME_ADHOC_PENALTY": + case "WS_TIME_ADHOC_REBATE": + case "SW_TIME_ADHOC_PENALTY": + case "SW_TIME_ADHOC_REBATE": + return true; + default: + return false; + } + }); + }, + ...config, + }); +}; + +export const useDemandSearch = ({ consumerCode, businessService, tenantId }, config = {}) => { + if (!tenantId) tenantId = Digit.ULBService.getCurrentTenantId(); + const queryFn = () => Digit.PaymentService.demandSearch(tenantId, consumerCode, businessService); + const queryData = useQuery(["demand_search", { consumerCode, businessService, tenantId }], queryFn, { refetchOnMount: "always", ...config }); + return queryData; +}; + +export const useRecieptSearch = ({ tenantId, businessService, ...params }, config = {}) => { + return useQuery( + ["reciept_search", { tenantId, businessService, params },config], + () => Digit.PaymentService.recieptSearch(tenantId, businessService, params), + { + refetchOnMount: false, + ...config, + } + ); +}; + +export const useBulkPdfDetails = ({ filters }) => { + return useQuery(["BULK_PDF_DETAILS", filters], async () => await PaymentService.getBulkPdfRecordsDetails(filters)); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintDetails.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintDetails.js new file mode 100644 index 00000000000..ee40baaf459 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintDetails.js @@ -0,0 +1,76 @@ +import { useQuery, useQueryClient } from "react-query"; + +// TODO: move to service +const getThumbnails = async (ids, tenantId) => { + const res = await Digit.UploadServices.Filefetch(ids, tenantId); + if (res.data.fileStoreIds && res.data.fileStoreIds.length !== 0) { + return { thumbs: res.data.fileStoreIds.map((o) => o.url.split(",")[3]), images: res.data.fileStoreIds.map((o) => Digit.Utils.getFileUrl(o.url)) }; + } else { + return null; + } +}; + +const getDetailsRow = ({ id, service, complaintType }) => ({ + CS_COMPLAINT_DETAILS_COMPLAINT_NO: id, + CS_COMPLAINT_DETAILS_APPLICATION_STATUS: `CS_COMMON_${service.applicationStatus}`, + CS_ADDCOMPLAINT_COMPLAINT_TYPE: complaintType === "" ? `SERVICEDEFS.OTHERS` : `SERVICEDEFS.${complaintType}`, + CS_ADDCOMPLAINT_COMPLAINT_SUB_TYPE: `SERVICEDEFS.${service.serviceCode.toUpperCase()}`, + CS_COMPLAINT_ADDTIONAL_DETAILS: service.description, + CS_COMPLAINT_FILED_DATE: Digit.DateUtils.ConvertTimestampToDate(service.auditDetails.createdTime), + ES_CREATECOMPLAINT_ADDRESS: [ + service.address.landmark, + Digit.Utils.locale.getLocalityCode(service.address.locality, service.tenantId), + service.address.city, + service.address.pincode, + ], +}); + +const isEmptyOrNull = (obj) => obj === undefined || obj === null || Object.keys(obj).length === 0; + +const transformDetails = ({ id, service, workflow, thumbnails, complaintType }) => { + const { Customizations, SessionStorage } = window.Digit; + const role = (SessionStorage.get("user_type") || "CITIZEN").toUpperCase(); + const customDetails = Customizations?.PGR?.getComplaintDetailsTableRows + ? Customizations.PGR.getComplaintDetailsTableRows({ id, service, role }) + : {}; + return { + details: !isEmptyOrNull(customDetails) ? customDetails : getDetailsRow({ id, service, complaintType }), + thumbnails: thumbnails?.thumbs, + images: thumbnails?.images, + workflow: workflow, + service, + audit: { + citizen: service.citizen, + details: service.auditDetails, + source: service.source, + rating: service.rating, + serviceCode: service.serviceCode, + }, + service: service, + }; +}; + +const fetchComplaintDetails = async (tenantId, id) => { + var serviceDefs = await Digit.MDMSService.getServiceDefs(tenantId, "PGR"); + const { service, workflow } = (await Digit.PGRService.search(tenantId, { serviceRequestId: id })).ServiceWrappers[0] || {}; + Digit.SessionStorage.set("complaintDetails", { service, workflow }); + if (service && workflow && serviceDefs) { + const complaintType = serviceDefs.filter((def) => def.serviceCode === service.serviceCode)[0].menuPath.toUpperCase(); + const ids = workflow.verificationDocuments + ? workflow.verificationDocuments.filter((doc) => doc.documentType === "PHOTO").map((photo) => photo.fileStoreId || photo.id) + : null; + const thumbnails = ids ? await getThumbnails(ids, service.tenantId) : null; + const details = transformDetails({ id, service, workflow, thumbnails, complaintType }); + return details; + } else { + return {}; + } +}; + +const useComplaintDetails = ({ tenantId, id }) => { + const queryClient = useQueryClient(); + const { isLoading, error, data } = useQuery(["complaintDetails", tenantId, id], () => fetchComplaintDetails(tenantId, id)); + return { isLoading, error, complaintDetails: data, revalidate: () => queryClient.invalidateQueries(["complaintDetails", tenantId, id]) }; +}; + +export default useComplaintDetails; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintList.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintList.js new file mode 100644 index 00000000000..33f3a5c23bb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintList.js @@ -0,0 +1,12 @@ +import { useQuery, useQueryClient } from "react-query"; + +export const useComplaintsList = (tenantId, filters) => { + // TODO: move city to state + const client = useQueryClient(); + const { isLoading, error, data } = useQuery(["complaintsList", filters], () => Digit.PGRService.search(tenantId, filters), {}); + return { isLoading, error, data, revalidate: () => client.invalidateQueries(["complaintsList", filters]) }; +}; + +export const useComplaintsListByMobile = (tenantId, mobileNumber) => { + return useComplaintsList(tenantId, { mobileNumber }); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatus.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatus.js new file mode 100644 index 00000000000..f75ec847554 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatus.js @@ -0,0 +1,31 @@ +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; + +const useComplaintStatus = () => { + const { t } = useTranslation(); + const [complaintStatus, setComplaintStatus] = useState([]); + const tenantId = Digit.ULBService.getCurrentTenantId(); + + useEffect(() => { + let WorkflowService = null; + // const user = Digit.UserService.getUser(); + // const tenantId = user?.info?.tenantId; + (async () => { + // let stateCode = + // Digit.SessionStorage.get("userType") == "employee" + // ? Digit.SessionStorage.get("Employee.tenantId") + // : Digit.SessionStorage.get("Citizen.tenantId"); + WorkflowService = await Digit.WorkflowService.init(tenantId, "PGR"); + let applicationStatus = WorkflowService.BusinessServices[0].states + .filter((state) => state.applicationStatus) + .map((state) => ({ + name: t(`CS_COMMON_${state.applicationStatus}`), + code: state.applicationStatus, + })); + setComplaintStatus(applicationStatus); + })(); + }, [t, tenantId]); + + return complaintStatus; +}; +export default useComplaintStatus; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatusWithCount.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatusWithCount.js new file mode 100644 index 00000000000..c2337fcf21f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintStatusWithCount.js @@ -0,0 +1,27 @@ +import { useEffect, useState } from "react"; +import useComplaintStatus from "./useComplaintStatus"; + +const useComplaintStatusCount = (complaints) => { + const [complaintStatusWithCount, setcomplaintStatusWithCount] = useState([]); + let complaintStatus = useComplaintStatus(); + let tenantId = Digit.ULBService.getCurrentTenantId(); + + const getCount = async (value) => { + let response = await Digit.PGRService.count(tenantId, { applicationStatus: value }); + return response?.count || ""; + }; + + useEffect(() => { + let getStatusWithCount = async () => { + let statusWithCount = complaintStatus.map(async (status) => ({ + ...status, + count: await getCount(status.code), + })); + setcomplaintStatusWithCount(await Promise.all(statusWithCount)); + }; + getStatusWithCount(); + }, [complaints, complaintStatus]); + return complaintStatusWithCount; +}; + +export default useComplaintStatusCount; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintSubType.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintSubType.js new file mode 100644 index 00000000000..6aa59a02340 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintSubType.js @@ -0,0 +1,18 @@ +import React, { useEffect, useState } from "react"; + +const useComplaintSubType = (complaintType, t) => { + const [subTypeMenu, setSubTypeMenu] = useState([]); + + useEffect(() => { + (async () => { + if (complaintType) { + const menu = await Digit.GetServiceDefinitions.getSubMenu(Digit.ULBService.getCurrentTenantId(), complaintType, t); + setSubTypeMenu(menu); + } + })(); + }, [complaintType]); + + return subTypeMenu; +}; + +export default useComplaintSubType; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTable.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTable.js new file mode 100644 index 00000000000..9716bb3415b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTable.js @@ -0,0 +1,23 @@ +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; + +const useComplaintTable = ({ data }) => { + const { t } = useTranslation(); + const [details, setDetails] = useState([]); + + useEffect(() => { + const details = { + CS_COMPLAINT_DETAILS_COMPLAINT_NO: data.serviceRequestId, + CS_COMPLAINT_DETAILS_COMPLAINT_SUBTYPE: t(data.complaintSubType), + CS_COMPLAINT_DETAILS_APPLICATION_STATUS: data.applicationStatus, + CS_COMPLAINT_DETAILS_LOCALITY: t(data.locality), + CS_COMPLAINT_DETAILS_TASK_OWNER: "task owner", + CS_COMPLAINT_SLA_REMAINING: "", + }; + setDetails(details); + }, []); + + return details; +}; + +export default useComplaintTable; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTypes.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTypes.js new file mode 100644 index 00000000000..6110a9549d7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useComplaintTypes.js @@ -0,0 +1,20 @@ +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; + +const useComplaintTypes = ({ stateCode }) => { + const [complaintTypes, setComplaintTypes] = useState(null); + const { t } = useTranslation(); + + useEffect(() => { + (async () => { + const res = await Digit.GetServiceDefinitions.getMenu(stateCode, t); + let menu = res.filter((o) => o.key !== ""); + menu.push({ key: "Others", name: t("SERVICEDEFS.OTHERS") }); + setComplaintTypes(menu); + })(); + }, [t, stateCode]); + + return complaintTypes; +}; + +export default useComplaintTypes; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useEmployeeFilter.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useEmployeeFilter.js new file mode 100644 index 00000000000..8249a076645 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useEmployeeFilter.js @@ -0,0 +1,35 @@ +import React, { useState, useEffect } from "react"; +import { useTranslation } from "react-i18next"; + +const useEmployeeFilter = (tenantId, roles, complaintDetails) => { + const [employeeDetails, setEmployeeDetails] = useState(null); + const { t } = useTranslation(); + useEffect(() => { + (async () => { + // const _roles = roles.join(","); + const searchResponse = await Digit.PGRService.employeeSearch(tenantId, roles); + + const serviceDefs = await Digit.MDMSService.getServiceDefs(tenantId, "PGR"); + const serviceCode = complaintDetails.service.serviceCode; + const service = serviceDefs?.find((def) => def.serviceCode === serviceCode); + const department = service?.department; + const employees = searchResponse.Employees.filter((employee) => + employee.assignments.map((assignment) => assignment.department).includes(department) + ); + + //emplpoyess data sholld only conatin name uuid dept + setEmployeeDetails([ + { + department: t(`COMMON_MASTERS_DEPARTMENT_${department}`), + employees: employees.map((employee) => { + return { uuid: employee.user.uuid, name: employee.user.name }; + }), + }, + ]); + })(); + }, [tenantId, roles, t, complaintDetails]); + + return employeeDetails; +}; + +export default useEmployeeFilter; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useInboxData.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useInboxData.js new file mode 100644 index 00000000000..c07c024b46b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useInboxData.js @@ -0,0 +1,61 @@ +import { useQuery, useQueryClient } from "react-query"; + +const useInboxData = (searchParams) => { + const client = useQueryClient(); + // const [complaintList, setcomplaintList] = useState([]); + // const user = Digit.UserService.getUser(); + // const tenantId = user?.info?.tenantId; + + + const fetchInboxData = async () => { + const tenantId = Digit.ULBService.getCurrentTenantId(); + let serviceIds = []; + let commonFilters = { start: 1, end: 10 }; + const { limit, offset } = searchParams; + let appFilters = { ...commonFilters, ...searchParams.filters.pgrQuery, ...searchParams.search, limit, offset }; + let wfFilters = { ...commonFilters, ...searchParams.filters.wfQuery }; + let complaintDetailsResponse = null; + let combinedRes = []; + complaintDetailsResponse = await Digit.PGRService.search(tenantId, appFilters); + complaintDetailsResponse.ServiceWrappers.forEach((service) => serviceIds.push(service.service.serviceRequestId)); + const serviceIdParams = serviceIds.join(); + const workflowInstances = await Digit.WorkflowService.getByBusinessId(tenantId, serviceIdParams, wfFilters, false); + if (workflowInstances.ProcessInstances.length) { + combinedRes = combineResponses(complaintDetailsResponse, workflowInstances).map((data) => ({ + ...data, + sla: Math.round(data.sla / (24 * 60 * 60 * 1000)), + })); + } + return combinedRes; + }; + + const result = useQuery(["fetchInboxData", + ...Object.keys(searchParams).map(i => + typeof searchParams[i] === "object" ? Object.keys(searchParams[i]).map(e => searchParams[i][e]) : searchParams[i] + )], + fetchInboxData, + { staleTime: Infinity } + ); + return { ...result, revalidate: () => client.refetchQueries(["fetchInboxData"]) }; +}; + +const mapWfBybusinessId = (wfs) => { + return wfs.reduce((object, item) => { + return { ...object, [item["businessId"]]: item }; + }, {}); +}; + +const combineResponses = (complaintDetailsResponse, workflowInstances) => { + let wfMap = mapWfBybusinessId(workflowInstances.ProcessInstances); + return complaintDetailsResponse.ServiceWrappers.map((complaint) => ({ + serviceRequestId: complaint.service.serviceRequestId, + complaintSubType: complaint.service.serviceCode, + locality: complaint.service.address.locality.code, + status: complaint.service.applicationStatus, + taskOwner: wfMap[complaint.service.serviceRequestId]?.assignes?.[0]?.name || "-", + sla: wfMap[complaint.service.serviceRequestId]?.businesssServiceSla, + tenantId: complaint.service.tenantId, + })); +}; + +export default useInboxData; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useLocalities.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useLocalities.js new file mode 100644 index 00000000000..560f0823fe8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useLocalities.js @@ -0,0 +1,34 @@ +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; + +const useLocalities = ({ city }) => { + const { t } = useTranslation(); + let locality = []; + const [localityList, setLocalityList] = useState(null); + const [localities, setLocalities] = useState(null); + useEffect(() => { + (async () => { + let tenantId = Digit.ULBService.getCurrentTenantId(); + let response = await Digit.LocationService.getLocalities(tenantId); + let __localityList = []; + if (response && response.TenantBoundary.length > 0) { + __localityList = Digit.LocalityService.get(response.TenantBoundary[0]); + } + setLocalityList(__localityList); + })(); + }, [city]); + + useEffect(() => { + if (localityList) { + const __localities = localityList; + __localities.forEach((element) => { + locality.push({ name: t(element.code), code: element.code }); + }); + setLocalities(locality); + } + }, [localityList]); + + return localities; +}; + +export default useLocalities; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useServiceDefs.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useServiceDefs.js new file mode 100644 index 00000000000..ceea6438ce6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useServiceDefs.js @@ -0,0 +1,23 @@ +import { useTranslation } from "react-i18next"; + +const { useState, useEffect } = require("react"); + +const useServiceDefs = (tenantId, moduleCode) => { + const [localMenu, setLocalMenu] = useState([]); + const SessionStorage = Digit.SessionStorage; + let { t } = useTranslation(); + + useEffect(() => { + (async () => { + const serviceDefs = await Digit.MDMSService.getServiceDefs(tenantId, moduleCode); + SessionStorage.set("serviceDefs", serviceDefs); + + const serviceDefsWithKeys = serviceDefs.map((def) => ({ ...def, i18nKey: t("SERVICEDEFS." + def.serviceCode.toUpperCase()) })); + setLocalMenu(serviceDefsWithKeys); + })(); + }, [t, tenantId, moduleCode]); + + return localMenu; +}; + +export default useServiceDefs; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useTenants.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useTenants.js new file mode 100644 index 00000000000..0c2f394c93c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/pgr/useTenants.js @@ -0,0 +1,9 @@ +import React, { useEffect, useState } from "react"; + +const useTenants = () => { + const tenantInfo = Digit.SessionStorage.get("PGR_TENANTS"); + const [tenants, setTenants] = useState(tenantInfo ? tenantInfo : null); + return tenants; +}; + +export default useTenants; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/revalidateQuery.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/revalidateQuery.js new file mode 100644 index 00000000000..3514b6779f4 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/revalidateQuery.js @@ -0,0 +1,6 @@ +import { useQueryClient } from "react-query"; + +export const useRevalidateQuery = async (key) => { + const client = useQueryClient(); + return client.refetchQueries(key); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js new file mode 100644 index 00000000000..477ee4bd39e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/store.js @@ -0,0 +1,19 @@ +import { useState, useEffect } from "react"; +import { useQuery } from "react-query"; +// import mergeConfig from "../../config/mergeConfig"; +import { StoreService } from "../services/molecules/Store/service"; + +export const useStore = ({ stateCode, moduleCode, language }) => { + return useQuery(["store", stateCode, moduleCode, language], () => StoreService.defaultData(stateCode, moduleCode, language)); +}; + +export const useInitStore = (stateCode, enabledModules) => { + const { isLoading, error, isError, data } = useQuery( + ["initStore", stateCode, enabledModules], + () => StoreService.digitInitData(stateCode, enabledModules), + { + staleTime: Infinity, + } + ); + return { isLoading, error, isError, data }; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreate.js new file mode 100644 index 00000000000..c645dea3064 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useCreate.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useCreateSurveys = (filters, config) => { + return useMutation((filters) => Surveys.create(filters)); +}; + +export default useCreateSurveys; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useDelete.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useDelete.js new file mode 100644 index 00000000000..91c94a0d037 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useDelete.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useDeleteSurveys = (filters, config) => { + return useMutation((filters) => Surveys.delete(filters)); +}; + +export default useDeleteSurveys; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSearch.js new file mode 100644 index 00000000000..ca2c937407a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSearch.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useQuery } from "react-query"; + +const useSearch = (filters, config) => { + return useQuery(["search_surveys", filters?.uuid, filters?.title, filters?.tenantIds, filters?.postedBy, filters?.offset, filters?.limit], () => Surveys.search(filters), { ...config }); +}; + +export default useSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useShowResults.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useShowResults.js new file mode 100644 index 00000000000..331baa79ed8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useShowResults.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useShowResults = (filters, config) => { + return useMutation((filters) => Surveys.showResults(filters)); +}; + +export default useShowResults; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitResponse.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitResponse.js new file mode 100644 index 00000000000..a4351dd2f45 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSubmitResponse.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useSubmitResponse = (filters, config) => { + return useMutation((filters) => Surveys.submitResponse(filters)); +}; + +export default useSubmitResponse; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyInbox.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyInbox.js new file mode 100644 index 00000000000..16712efea31 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useSurveyInbox.js @@ -0,0 +1,33 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation, useQuery } from "react-query"; +/* import { isObject, isObjectLike } from "lodash"; */ + +const useSearch = (filters, config) => { + const { filterForm, searchForm, tableForm } = filters + const { status } = filterForm + const { title, tenantIds, postedBy } = searchForm + const { sortBy, limit, offset, sortOrder } = tableForm; + const validTenantId = typeof tenantIds === 'object' ? tenantIds.code : tenantIds; + const validStatus = typeof status === 'object' ? status.code : status; + + const finalFilters = { + tenantIds: validTenantId, + status: validStatus === "ALL" ? "" : validStatus, + title, + postedBy, + limit, + offset + } + + //clearing out empty string params from payload + Object.keys(finalFilters).forEach(key => { + if (finalFilters[key] === '') { + delete finalFilters[key]; + } + }); + + + return useQuery(["search_surveys", title, tenantIds, postedBy, status, offset, limit], () => Surveys.search(finalFilters), { ...config, refetchInterval: 6000 }); +}; + +export default useSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useUpdate.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useUpdate.js new file mode 100644 index 00000000000..770a88047a5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/surveys/useUpdate.js @@ -0,0 +1,8 @@ +import { Surveys } from "../../services/elements/Surveys"; +import { useMutation } from "react-query"; + +const useUpdateSurvey = (filters, config) => { + return useMutation((filters) => Surveys.update(filters)); +}; + +export default useUpdateSurvey; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useAccessControl.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useAccessControl.js new file mode 100644 index 00000000000..df030439b9e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useAccessControl.js @@ -0,0 +1,13 @@ +import { useQuery } from "react-query"; +import AccessControlService from "../services/elements/Access"; +const useAccessControl = (tenantId) => { + const getUserRoles = Digit.SessionStorage.get("User")?.info?.roles; + + const roles = getUserRoles?.map((role) => { + return role.code; + }); + + const response = useQuery(["ACCESS_CONTROL", tenantId], async () => await AccessControlService.getAccessControl(roles),{enabled:roles?true:false}); + return response; +}; +export default useAccessControl; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useApplicationForBillSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useApplicationForBillSearch.js new file mode 100644 index 00000000000..158535e45c7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useApplicationForBillSearch.js @@ -0,0 +1,37 @@ + +import { useQuery } from "react-query"; + + + +const refObj = (tenantId, filters) => { + let consumerCodes = filters?.consumerCodes; + // delete filters.consumerCodes; + + return { + + }; +}; + +export const useApplicationsForBusinessServiceSearch = ({ tenantId, businessService, filters }, config = {}) => { + let _key = businessService?.toLowerCase().split(".")[0]; + if (window.location.href.includes("mcollect")) { + _key = "mcollect"; + } + if (window.location.href.includes("TL")) { + _key = "TL"; + } + if (window.location.href.includes("BPAREG")) { + _key = businessService + } + if (window.location.href.includes("BPA.")) { + _key = "BPA" + } + + /* key from application ie being used as consumer code in bill */ + const { searchFn, key, label } = refObj(tenantId, filters)[_key]; + const applications = useQuery(["applicationsForBillDetails", { tenantId, businessService, filters, searchFn }], searchFn, { + ...config, + }); + + return { ...applications, key, label }; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useClickOutside.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useClickOutside.js new file mode 100644 index 00000000000..dedb9c215a2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useClickOutside.js @@ -0,0 +1,23 @@ +import { useEffect } from "react"; + +const useOnClickOutside = (ref, handler, isActive, eventParam = false) => { + useEffect(() => { + if (isActive) { + document.addEventListener("click", handleClickOutSide, eventParam); + } else { + document.removeEventListener("click", handleClickOutSide, eventParam); + } + return () => { + document.removeEventListener("click", handleClickOutSide, eventParam); + }; + }, [isActive]); + + const handleClickOutSide = (event) => { + if (ref.current && ref.current.contains(event.target)) { + return; + } + handler(event); + } +}; + +export default useOnClickOutside; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIHook.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIHook.js new file mode 100644 index 00000000000..1458a426486 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIHook.js @@ -0,0 +1,56 @@ +import { useQuery, useQueryClient } from "react-query"; +import { CustomService } from "../services/elements/CustomService"; + +/** + * Custom hook which can make api call and format response + * + * @author jagankumar-egov + * + * + * @example + * + const requestCriteria = [ + "/user/_search", // API details + {}, //requestParam + {data : {uuid:[Useruuid]}}, // requestBody + {} , // privacy value + { // other configs + enabled: privacyState, + cacheTime: 100, + select: (data) => { + // format data + return _.get(data, loadData?.jsonPath, value); + }, + }, + ]; + const { isLoading, data, revalidate } = Digit.Hooks.useCustomAPIHook(...requestCriteria); + + * + * @returns {Object} Returns the object which contains data and isLoading flag + */ + + +const useCustomAPIHook = ({ url, params, body, config = {}, plainAccessRequest,changeQueryName="Random" }) => { + const client = useQueryClient(); + + const { isLoading, data, isFetching,refetch } = useQuery( + [url,changeQueryName].filter((e) => e), + () => CustomService.getResponse({ url, params, body, plainAccessRequest }), + { + cacheTime:0, + ...config, + } + ); + + return { + isLoading, + isFetching, + data, + refetch, + revalidate: () => { + data && client.invalidateQueries({ queryKey: [url].filter((e) => e) }); + }, + }; +}; + +export default useCustomAPIHook; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIMutationHook.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIMutationHook.js new file mode 100644 index 00000000000..6afcfe74d49 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomAPIMutationHook.js @@ -0,0 +1,68 @@ +import { useQueryClient, useMutation } from "react-query"; +import { CustomService } from "../services/elements/CustomService"; + +/** + * Custom hook which can make api call and format response + * + * @author jagankumar-egov + * + * + * @example + * + const requestCriteria = [ + "/user/_search", // API details + {}, //requestParam + {data : {uuid:[Useruuid]}}, // requestBody + {} , // privacy value + { // other configs + enabled: privacyState, + cacheTime: 100, + select: (data) => { + // format data + return _.get(data, loadData?.jsonPath, value); + }, + }, + ]; + const mutation = Digit.Hooks.useCustomAPIMutationHook(...requestCriteria); + + +while mutating use the following format + +mutation.mutate({ + params: {}, + body: { "payload": { + // custom data + } + }}, + { + onError : ()=> { // custom logic}, + onSuccess : ()=> { // custom logic} + } + ); + + * + * @returns {Object} Returns the object which contains data and isLoading flag + */ + +const useCustomAPIMutationHook = ({ url, params, body, config = {}, plainAccessRequest, changeQueryName = "Random" }) => { + const client = useQueryClient(); + + const { isLoading, data, isFetching, ...rest } = useMutation( + (data) => CustomService.getResponse({ url, params: { ...params, ...data?.params }, body: { ...body, ...data?.body }, plainAccessRequest }), + { + cacheTime: 0, + ...config, + } + ); + return { + ...rest, + isLoading, + isFetching, + data, + revalidate: () => { + data && client.invalidateQueries({ queryKey: [url].filter((e) => e) }); + }, + }; +}; + +export default useCustomAPIMutationHook; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomMDMS.js new file mode 100644 index 00000000000..523bcf41593 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useCustomMDMS.js @@ -0,0 +1,32 @@ +import { useQuery } from "react-query"; +import { MdmsService } from "../services/elements/MDMS"; + +/** + * Custom hook which can be used to + * make a single hook a module to get multiple masterdetails with/without filter + * + * @author jagankumar-egov + * + * @example + * // returns useQuery object + * Digit.Hooks.useCustomMDMS( + * "stateid", + * "modulename", + * [ + * { name:"masterdetail1",filter:"[?(@.active == true)]"}, + * { name:"masterdetail2" } + * ], + * { // all configs supported by the usequery + * default:(data)=>{ + * format + * return formattedData; + * } + * }) + * + * @returns {Object} Returns the object of the useQuery from react-query. + */ +const useCustomMDMS = (tenantId, moduleName, masterDetails = [], config = {}) => { + return useQuery([tenantId, moduleName, masterDetails], () => MdmsService.getMultipleTypesWithFilter(tenantId, moduleName, masterDetails), config); +}; + +export default useCustomMDMS; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDocumentSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDocumentSearch.js new file mode 100644 index 00000000000..e121f159550 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDocumentSearch.js @@ -0,0 +1,47 @@ +import { useQuery, useQueryClient } from "react-query"; +import PropTypes from "prop-types"; + + +const useDocumentSearch = (documents=[], config = {}) => { + const client = useQueryClient(); + const tenant = Digit.ULBService.getStateId(); + const filesArray = documents?.map((value) => value?.fileStoreId); + + const { isLoading, error, data } = useQuery([filesArray.join('')], () => Digit.UploadServices.Filefetch(filesArray, tenant),{enabled:filesArray&&filesArray.length>0, + /* It will return back the same document object with fileUrl link and response */ + select: (data) => { + return documents.map(document=>{ + return { + ...document, + fileURL:data?.data?.[document?.fileStoreId]&&Digit.Utils.getFileUrl(data.data[document?.fileStoreId]), + url:data?.data?.[document?.fileStoreId]&&Digit.Utils.getFileUrl(data.data[document?.fileStoreId]), + fileResponse:data?.data?.[document?.fileStoreId]||"" + } + }) + }, + ...config}); + return { isLoading, error, data: { pdfFiles: data }, revalidate: () => client.invalidateQueries([filesArray.join('')]) }; +}; + +/** + * Used to get the documents file url based on the given documents array + */ +export default useDocumentSearch; + + +useDocumentSearch.propTypes = { + /** + * document array for which we get file urls + */ + documents: PropTypes.array, + /** + * any config to use query + */ + config: PropTypes.object, +}; + +useDocumentSearch.defaultProps = { + documents: [], + config: {} +}; + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDynamicData.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDynamicData.js new file mode 100644 index 00000000000..64dc9eb1857 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useDynamicData.js @@ -0,0 +1,17 @@ +import { useQuery } from "react-query"; +import { endOfToday, start } from "date-fns"; + +import { format, subMonths } from "date-fns"; + +const useDynamicData = ({moduleCode ,tenantId, filters, t }) => { + + + switch(moduleCode){ + + default: + return {isLoading: false, error: false, data: null, isSuccess: false}; + } + + }; + +export default useDynamicData; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useEmployeeSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useEmployeeSearch.js new file mode 100644 index 00000000000..93651fcd599 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useEmployeeSearch.js @@ -0,0 +1,10 @@ +import { useQuery } from "react-query"; + +const useEmployeeSearch = (tenantId, filters, config = {}) => { + if (filters.roles) { + filters.roles = filters.roles.map((role) => role.code).join(","); + } + return useQuery(["EMPLOYEE_SEARCH", filters], () => Digit.UserService.employeeSearch(tenantId, filters), config); +}; + +export default useEmployeeSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGenderMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGenderMDMS.js new file mode 100644 index 00000000000..6eaa892f9ec --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGenderMDMS.js @@ -0,0 +1,18 @@ +import { useQuery } from "react-query"; +import { MdmsService } from "../services/elements/MDMS"; + +const useGenderMDMS = (tenantId, moduleCode, type, config = {}) => { + const useGenderDetails = () => { + return useQuery("GENDER_DETAILS", () => MdmsService.getGenderType(tenantId, moduleCode ,type), config); + }; + + + switch (type) { + case "GenderType": + return useGenderDetails(); + } +}; + + + +export default useGenderMDMS; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSAboutJSON.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSAboutJSON.js new file mode 100644 index 00000000000..d9cac815d52 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSAboutJSON.js @@ -0,0 +1,7 @@ +import { useQuery } from "react-query"; + +const useGetDSSAboutJSON = (tenantId) => { + return useQuery(["About", tenantId], () => Digit.MDMSService.getDSSAboutJSONData(tenantId)); + }; + +export default useGetDSSAboutJSON; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSFAQsJSON.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSFAQsJSON.js new file mode 100644 index 00000000000..ae096a594d9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetDSSFAQsJSON.js @@ -0,0 +1,7 @@ +import { useQuery } from "react-query"; + +const useGetDSSFAQsJSON = (tenantId) => { + return useQuery(["FAQS", tenantId], () => Digit.MDMSService.getDSSFAQsJSONData(tenantId)); + }; + +export default useGetDSSFAQsJSON; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetFAQsJSON.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetFAQsJSON.js new file mode 100644 index 00000000000..7ea9d25bb33 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useGetFAQsJSON.js @@ -0,0 +1,7 @@ +import { useQuery } from "react-query"; + +const useGetFAQsJSON = (tenantId) => { + return useQuery(["FAQ_S", tenantId], () => Digit.MDMSService.getFAQsJSONData(tenantId)); + }; + +export default useGetFAQsJSON; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useHowItWorksJSON.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useHowItWorksJSON.js new file mode 100644 index 00000000000..2f20e699334 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useHowItWorksJSON.js @@ -0,0 +1,7 @@ +import { useQuery } from "react-query"; + +const useGetHowItWorksJSON = (tenantId) => { + return useQuery(["HOW_IT_WORKS", tenantId], () => Digit.MDMSService.getHowItWorksJSONData(tenantId)); + }; + +export default useGetHowItWorksJSON; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInbox.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInbox.js new file mode 100644 index 00000000000..2f6bed8496b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInbox.js @@ -0,0 +1,11 @@ +import React from "react"; +import { useQuery } from "react-query"; +import { InboxGeneral } from "../services/elements/InboxService" + +const useInbox = ({tenantId, filters, config}) => useQuery( + ["INBOX_DATA",tenantId, ...Object.keys(filters)?.map( e => filters?.[e] )], + () => InboxGeneral.Search({inbox: {...filters}}), + { ...config } + ) + +export default useInbox; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/filterFn.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/filterFn.js new file mode 100644 index 00000000000..7736e52c1af --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/filterFn.js @@ -0,0 +1,108 @@ +export const filterFunctions = { + PT: (filtersArg) => { + let { uuid } = Digit.UserService.getUser()?.info || {}; + + const searchFilters = {}; + const workflowFilters = {}; + + const { propertyIds, mobileNumber, limit, offset, sortBy, sortOrder, total, applicationStatus, services } = filtersArg || {}; + + if (filtersArg?.acknowledgementIds) { + searchFilters.acknowledgementIds = filtersArg?.acknowledgementIds; + } + if (filtersArg?.propertyIds) { + searchFilters.propertyIds = propertyIds; + } + if (filtersArg?.oldpropertyids) { + searchFilters.oldpropertyids = filtersArg?.oldpropertyids; + } + if (applicationStatus && applicationStatus?.[0]) { + workflowFilters.applicationStatus = applicationStatus.map((status) => status.code).join(","); + } + if (filtersArg?.locality?.length) { + searchFilters.locality = filtersArg?.locality.map((item) => item.code.split("_").pop()).join(","); + } + + if (filtersArg?.locality?.code) { + searchFilters.locality = filtersArg?.locality?.code; + } + + if (filtersArg?.uuid && filtersArg?.uuid.code === "ASSIGNED_TO_ME") { + workflowFilters.assignee = uuid; + } + if (mobileNumber) { + searchFilters.mobileNumber = mobileNumber; + } + if (propertyIds) { + searchFilters.propertyIds = propertyIds; + } + if (sortBy) { + searchFilters.sortBy = sortBy; + } + if (sortOrder) { + searchFilters.sortOrder = sortOrder; + } + if (services) { + workflowFilters.businessServices = services.join(); + } + if (limit) { + searchFilters.limit = limit; + } + if (offset) { + searchFilters.offset = offset; + } + + return { searchFilters, workflowFilters }; + }, + TL: (filtersArg) => { + let { uuid } = Digit.UserService.getUser()?.info || {}; + + const searchFilters = {}; + const workflowFilters = {}; + + const { propertyIds, mobileNumber, limit, offset, sortBy, sortOrder, total, applicationStatus, services } = filtersArg || {}; + + if (filtersArg?.acknowledgementIds) { + searchFilters.acknowledgementIds = filtersArg?.acknowledgementIds; + } + if (filtersArg?.propertyIds) { + searchFilters.propertyIds = propertyIds; + } + if (filtersArg?.oldpropertyids) { + searchFilters.oldpropertyids = filtersArg?.oldpropertyids; + } + if (applicationStatus && applicationStatus?.[0]) { + workflowFilters.applicationStatus = applicationStatus.map((status) => status.code).join(","); + } + if (filtersArg?.locality?.length) { + searchFilters.locality = filtersArg?.locality.map((item) => item.code.split("_").pop()).join(","); + } + + if (filtersArg?.uuid && filtersArg?.uuid.code === "ASSIGNED_TO_ME") { + workflowFilters.assignee = uuid; + } + if (mobileNumber) { + searchFilters.mobileNumber = mobileNumber; + } + if (propertyIds) { + searchFilters.propertyIds = propertyIds; + } + if (sortBy) { + searchFilters.sortBy = sortBy; + } + if (sortOrder) { + searchFilters.sortOrder = sortOrder; + } + if (services) { + workflowFilters.businessServices = services.join(); + } + if (limit) { + searchFilters.limit = limit; + } + if (offset) { + searchFilters.offset = offset; + } + + return { searchFilters, workflowFilters }; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/newFilterFn.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/newFilterFn.js new file mode 100644 index 00000000000..33242762bf9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/newFilterFn.js @@ -0,0 +1,52 @@ +export const filterFunctions = { + PT: (filtersArg) => { + let { uuid } = Digit.UserService.getUser()?.info || {}; + + const searchFilters = {}; + const workflowFilters = {}; + + const { propertyIds, mobileNumber, limit, offset, sortBy, sortOrder, total, applicationStatus, services } = filtersArg || {}; + + if (filtersArg?.acknowledgementIds) { + searchFilters.applicationNumber = filtersArg?.acknowledgementIds; + } + if (filtersArg?.propertyIds) { + searchFilters.propertyId = propertyIds; + } + if (filtersArg?.oldpropertyids) { + searchFilters.oldpropertyids = filtersArg?.oldpropertyids; + } + if (applicationStatus && applicationStatus?.[0]) { + workflowFilters.status = applicationStatus.map((status) => status.uuid); + if (applicationStatus?.some((e) => e.nonActionableRole)) { + searchFilters.fetchNonActionableRecords = true; + } + } + if (filtersArg?.locality?.length) { + searchFilters.locality = filtersArg?.locality.map((item) => item.code.split("_").pop()); + } + if (filtersArg?.uuid && filtersArg?.uuid.code === "ASSIGNED_TO_ME") { + workflowFilters.assignee = uuid; + } + if (mobileNumber) { + searchFilters.mobileNumber = mobileNumber; + } + if (services) { + workflowFilters.businessService = services; + } + searchFilters["isInboxSearch"] = true; + searchFilters["creationReason"] = ["CREATE", "MUTATION", "UPDATE"]; + workflowFilters["moduleName"] = "PT"; + + // if (limit) { + // searchFilters.limit = limit; + // } + // if (offset) { + // searchFilters.offset = offset; + // } + + // workflowFilters.businessService = "PT.CREATE"; + // searchFilters.mobileNumber = "9898568989"; + return { searchFilters, workflowFilters, limit, offset, sortBy, sortOrder }; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/searchFields.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/searchFields.js new file mode 100644 index 00000000000..05cd3d163db --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/searchFields.js @@ -0,0 +1,67 @@ +const inboxSearchFields = { + PT: [ + { + label: "PT_PROPERTY_APPLICATION_NO", + name: "acknowledgementIds", + roles: [], + }, + { + label: "ES_SEARCH_UNIQUE_PROPERTY_ID", + name: "propertyIds", + // minLength: "10", + roles: [], + }, + { + label: "ES_SEARCH_APPLICATION_MOBILE_NO", + name: "mobileNumber", + type: "mobileNumber", + maxLength: 10, + minLength: 0, + roles: [], + pattern: "^$|[6-9][0-9]{9}", + errorMessages: { + pattern: "", + minLength: "", + maxLength: "", + }, + }, + ], +}; + +const searchFieldsForSearch = { + PT: [ + { + label: "ES_INBOX_LOCALITY", + name: "locality", + type: "Locality", + isMendatory: true, + }, + { + label: "ES_INBOX_UNIQUE_PROPERTY_ID", + name: "propertyIds", + roles: [], + }, + { + label: "ES_SEARCH_EXISTING_PROPERTY_ID", + name: "oldpropertyids", + title: "ES_SEARCH_APPLICATION_MOBILE_INVALID", + roles: [], + }, + { + label: "ES_SEARCH_APPLICATION_MOBILE_NO", + name: "mobileNumber", + type: "mobileNumber", + maxLength: 10, + minLength: 0, + roles: [], + pattern: "^$|[6-9][0-9]{9}", + errorMessages: { + pattern: "", + minLength: "", + maxLength: "", + }, + }, + ], +}; + +export const getSearchFields = (isInbox) => (isInbox ? inboxSearchFields : searchFieldsForSearch); diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useInboxGeneral.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useInboxGeneral.js new file mode 100644 index 00000000000..c8c9b04d71d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useInboxGeneral.js @@ -0,0 +1,148 @@ +import { useTranslation } from "react-i18next"; +import { useQuery, useQueryClient } from "react-query"; + +import { filterFunctions } from "./filterFn"; +import { getSearchFields } from "./searchFields"; + +const inboxConfig = (tenantId, filters) => ({ + +}); + +const defaultCombineResponse = ({ totalCount, ...d }, wf) => { + return { totalCount, searchData: { ...d }, workflowData: { ...wf } }; +}; + +const defaultRawSearchHandler = ({ totalCount, ...data }, searchKey, businessIdAlias) => { + return { [searchKey]: data[searchKey].map((e) => ({ totalCount, ...e })) }; +}; + +const defaultCatchSearch = (Err) => { + if ( + Err?.response?.data?.Errors?.some( + (e) => + e.code === "EG_PT_INVALID_SEARCH" && + e.message === " Search is not allowed on empty Criteria, Atleast one criteria should be provided with tenantId for EMPLOYEE" + ) + ) + return []; + throw Err; +}; + +/** + * + * @param {*} data + * @param {Array of Objects containing async or pure functions} middlewares + * @returns {object} + */ + +const callMiddlewares = async (data, middlewares) => { + let applyBreak = false; + let itr = -1; + let _break = () => (applyBreak = true); + let _next = async (data) => { + if (!applyBreak && ++itr < middlewares.length) { + let key = Object.keys(middlewares[itr])[0]; + let nextMiddleware = middlewares[itr][key]; + let isAsync = nextMiddleware.constructor.name === "AsyncFunction"; + if (isAsync) return await nextMiddleware(data, _break, _next); + else return nextMiddleware(data, _break, _next); + } else return data; + }; + let ret = await _next(data); + return ret || []; +}; + +const useInboxGeneral = ({ + tenantId, + businessService, + filters, + rawWfHandler = (d) => d, + rawSearchHandler = defaultRawSearchHandler, + combineResponse = defaultCombineResponse, + isInbox = true, + wfConfig = {}, + searchConfig = {}, + middlewaresWf = [], + middlewareSearch = [], + catchSearch = defaultCatchSearch, +}) => { + const client = useQueryClient(); + const { t } = useTranslation(); + + const { services, fetchFilters, searchResponseKey, businessIdAliasForSearch, businessIdsParamForSearch } = inboxConfig()[businessService]; + + let { workflowFilters, searchFilters } = fetchFilters(filters); + + const { data: processInstances, isFetching: wfFetching, isFetched, isSuccess: wfSuccess } = useQuery( + ["WORKFLOW_INBOX", businessService, workflowFilters], + () => + Digit.WorkflowService.getAllApplication(tenantId, { businessServices: services.join(), ...workflowFilters }) + .then(rawWfHandler) + .then((data) => callMiddlewares(data.ProcessInstances, middlewaresWf)), + { + enabled: isInbox, + select: (d) => { + return d; + }, + ...wfConfig, + } + ); + + const applicationNoFromWF = processInstances?.map((e) => e.businessId).join() || ""; + + if (isInbox && applicationNoFromWF && !searchFilters[businessIdAliasForSearch]) + searchFilters = { [businessIdsParamForSearch]: applicationNoFromWF, ...searchFilters }; + + const { _searchFn } = inboxConfig(tenantId, { ...searchFilters })[businessService]; + + /** + * Convert Wf Array to Object + */ + + const processInstanceBuisnessIdMap = processInstances?.reduce((object, item) => { + return { ...object, [item?.["businessId"]]: item }; + }, {}); + + const allowSearch = isInbox ? isFetched && wfSuccess && !!searchFilters[businessIdsParamForSearch] : true; + + const searchResult = useQuery( + ["SEARCH_INBOX", businessService, searchFilters, workflowFilters, isInbox], + () => { + if (allowSearch) + return _searchFn() + .then((d) => rawSearchHandler(d, searchResponseKey, businessIdAliasForSearch)) + .then((data) => callMiddlewares(data[searchResponseKey], middlewareSearch)) + .catch(catchSearch); + }, + { + enabled: allowSearch, + select: (d) => { + return d.map((searchResult) => ({ + totalCount: d.totalCount, + ...combineResponse(searchResult, processInstanceBuisnessIdMap?.[searchResult?.[businessIdAliasForSearch]]), + })); + }, + ...searchConfig, + } + ); + + const revalidate = () => { + client.refetchQueries(["WORKFLOW_INBOX"]); + client.refetchQueries(["SEARCH_INBOX"]); + }; + + client.setQueryData(`FUNCTION_RESET_INBOX_${businessService}`, { revalidate }); + + return { + ...searchResult, + revalidate, + searchResponseKey, + businessIdsParamForSearch, + businessIdAliasForSearch, + + searchFields: getSearchFields(isInbox)[businessService], + wfFetching, + }; +}; + +export default useInboxGeneral; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useNewInbox.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useNewInbox.js new file mode 100644 index 00000000000..71e31c0f483 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useInboxGeneral/useNewInbox.js @@ -0,0 +1,76 @@ +import { useTranslation } from "react-i18next"; +import { useQuery, useQueryClient } from "react-query"; + +import { filterFunctions } from "./newFilterFn"; +import { getSearchFields } from "./searchFields"; +import { InboxGeneral } from "../../services/elements/InboxService"; + +const inboxConfig = (tenantId, filters) => ({ + +}); + +const callMiddlewares = async (data, middlewares) => { + let applyBreak = false; + let itr = -1; + let _break = () => (applyBreak = true); + let _next = async (data) => { + if (!applyBreak && ++itr < middlewares.length) { + let key = Object.keys(middlewares[itr])[0]; + let nextMiddleware = middlewares[itr][key]; + let isAsync = nextMiddleware.constructor.name === "AsyncFunction"; + if (isAsync) return await nextMiddleware(data, _break, _next); + else return nextMiddleware(data, _break, _next); + } else return data; + }; + let ret = await _next(data); + return ret || []; +}; + +const useNewInboxGeneral = ({ tenantId, ModuleCode, filters, middleware = [], config = {} }) => { + const client = useQueryClient(); + const { t } = useTranslation(); + const { fetchFilters, searchResponseKey, businessIdAliasForSearch, businessIdsParamForSearch } = inboxConfig()[ModuleCode]; + let { workflowFilters, searchFilters, limit, offset, sortBy, sortOrder } = fetchFilters(filters); + + const query = useQuery( + ["INBOX", workflowFilters, searchFilters, ModuleCode, limit, offset, sortBy, sortOrder], + () => + InboxGeneral.Search({ + inbox: { tenantId, processSearchCriteria: workflowFilters, moduleSearchCriteria: { ...searchFilters, sortBy, sortOrder }, limit, offset }, + }), + { + select: (data) => { + const { statusMap, totalCount } = data; + // client.setQueryData(`INBOX_STATUS_MAP_${ModuleCode}`, (oldStatusMap) => { + // if (!oldStatusMap) return statusMap; + // else return [...oldStatusMap.filter((e) => statusMap.some((f) => f.stateId === e.stateId))]; + // }); + + client.setQueryData(`INBOX_STATUS_MAP_${ModuleCode}`, statusMap); + + if (data.items.length) { + return data.items?.map((obj) => ({ + searchData: obj.businessObject, + workflowData: obj.ProcessInstance, + statusMap, + totalCount, + })); + } else { + return [{ statusMap, totalCount, dataEmpty: true }]; + } + }, + retry: false, + ...config, + } + ); + + return { + ...query, + searchResponseKey, + businessIdsParamForSearch, + businessIdAliasForSearch, + searchFields: getSearchFields(true)[ModuleCode], + }; +}; + +export default useNewInboxGeneral; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocalities.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocalities.js new file mode 100644 index 00000000000..8c550eb22fb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocalities.js @@ -0,0 +1,17 @@ +import { useQuery } from "react-query"; +import { getLocalities } from "../services/molecules/getLocalities"; +import { LocalityService } from "../services/elements/Localities"; + +const useLocalities = (tenant, boundaryType = "admin", config, t) => { + return useQuery(["BOUNDARY_DATA", tenant, boundaryType], () => getLocalities[boundaryType.toLowerCase()](tenant), { + select: (data) => { + return LocalityService.get(data).map((key) => { + return { ...key, i18nkey: t(key.i18nkey) }; + }); + }, + staleTime: Infinity, + ...config, + }); +}; + +export default useLocalities; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocation.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocation.js new file mode 100644 index 00000000000..0e5cfa320e5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useLocation.js @@ -0,0 +1,15 @@ +import { useQuery } from 'react-query'; +import { LocationService } from "../services/elements/Location"; + +const useLocation = (tenantId, locationType, config = {}) => { + switch(locationType) { + case 'Locality': + return useQuery(["LOCALITY_DETAILS", tenantId ], () => LocationService.getLocalities(tenantId), config); + case 'Ward': + return useQuery(["WARD_DETAILS", tenantId ], () => LocationService.getWards(tenantId), config); + default: + break + } +} + +export default useLocation; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useMDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useMDMS.js new file mode 100644 index 00000000000..ec3579d93a6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useMDMS.js @@ -0,0 +1,44 @@ +import { MdmsService } from "../services/elements/MDMS"; +import { useQuery } from "react-query"; + +const useMDMS = (tenantId, moduleCode, type, config = {}, payload = []) => { + const usePaymentGateway = () => { + return useQuery("PAYMENT_GATEWAY", () => MdmsService.getPaymentGateway(tenantId, moduleCode, type), { + select: (data) => { + return data?.[moduleCode]?.[type].filter((e) => e.active).map(({ gateway }) => gateway); + }, + ...config, + }); + }; + + const useReceiptKey = () => { + return useQuery("RECEIPT_KEY", () => MdmsService.getReceiptKey(tenantId, moduleCode, type), config); + }; + + const useBillsGenieKey = () => { + return useQuery("BILLS_GENIE_KEY", () => MdmsService.getBillsGenieKey(tenantId, moduleCode, type), config); + }; + + const useFSTPPlantInfo = () => { + return useQuery("FSTP_PLANTINFO", () => MdmsService.getFSTPPlantInfo(tenantId, moduleCode, type), config); + }; + + const _default = () => { + return useQuery([tenantId, moduleCode, type], () => MdmsService.getMultipleTypes(tenantId, moduleCode, type), config); + }; + + switch (type) { + case "PaymentGateway": + return usePaymentGateway(); + case "ReceiptKey": + return useReceiptKey(); + case "FSTPPlantInfo": + return useFSTPPlantInfo(); + case "BillsGenieKey": + return useBillsGenieKey(); + default: + return _default(); + } +}; + +export default useMDMS; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useModuleTenants.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useModuleTenants.js new file mode 100644 index 00000000000..25e51a94e97 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useModuleTenants.js @@ -0,0 +1,39 @@ +import React from "react"; +import { useQuery } from "react-query"; +import { useTranslation } from "react-i18next"; + +const useModuleTenants = (module, config = {}) => { + const { t } = useTranslation(); + + return useQuery(["ULB_TENANTS", module], () => Digit.SessionStorage.get("initData"), { + select: (data) => ({ + ddr: data.modules + .find((e) => e.module === module) + .tenants.map((tenant) => ({ + ...tenant, + ulbKey: t(`TENANT_TENANTS_${tenant?.code?.toUpperCase?.()?.replace(".", "_")}`), + ddrKey: t( + `DDR_${data.tenants + .filter((t) => t.code === tenant.code)?.[0] + .city?.districtTenantCode?.toUpperCase?.() + .replace(".", "_")}` + ), + })) + .filter((item, i, arr) => i === arr.findIndex((t) => t.ddrKey === item.ddrKey)), + ulb: data.modules + .find((e) => e.module === module) + .tenants.map((tenant) => ({ + ...tenant, + ulbKey: t(`TENANT_TENANTS_${tenant?.code?.toUpperCase?.()?.replace(".", "_")}`), + ddrKey: t( + `DDR_${data.tenants + .filter((t) => t.code === tenant.code)?.[0] + .city?.districtTenantCode?.toUpperCase?.() + .replace(".", "_")}` + ), + })), + }), + ...config, + }); +}; +export default useModuleTenants; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/usePrivacyContext.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/usePrivacyContext.js new file mode 100644 index 00000000000..fea0afdfd01 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/usePrivacyContext.js @@ -0,0 +1,18 @@ +import React, { useContext } from "react"; + +/** + * Custom hook which can gives the privacy functions to access + * + * @author jagankumar-egov + * + * Feature :: Privacy + * + * @example + * const { privacy , updatePrivacy } = Digit.Hooks.usePrivacyContext() + * + * @returns {Object} Returns the object which contains privacy value and updatePrivacy method + */ +export const usePrivacyContext = () => { + const { privacy, updatePrivacy, ...rest } = useContext(Digit.Contexts.PrivacyProvider); + return { privacy, updatePrivacy, ...rest }; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useQueryParams.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useQueryParams.js new file mode 100644 index 00000000000..b4275c4d56b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useQueryParams.js @@ -0,0 +1,11 @@ +const useQueryParams = () => { + const queryString = window.location.search; + const urlParams = new URLSearchParams(queryString); + const params = {}; + urlParams.forEach((value, key) => { + params[key] = value; + }); + return params; +}; + +export default useQueryParams; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useRouteSubscription.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useRouteSubscription.js new file mode 100644 index 00000000000..dd586b5cb83 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useRouteSubscription.js @@ -0,0 +1,17 @@ +import React, { useEffect, useState } from "react"; + +const useRouteSubscription = (pathname) => { + const [classname, setClassname] = useState("citizen"); + useEffect(() => { + const isEmployeeUrl = Digit.Utils.detectDsoRoute(pathname); + if (isEmployeeUrl && classname === "citizen") { + setClassname("employee"); + } else if (!isEmployeeUrl && classname === "employee") { + setClassname("citizen"); + } + }, [pathname]); + + return classname; +}; + +export default useRouteSubscription; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useSessionStorage.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useSessionStorage.js new file mode 100644 index 00000000000..b6860376a31 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useSessionStorage.js @@ -0,0 +1,30 @@ +import { useState } from "react"; + +const useSessionStorage = (key, initialValue) => { + const [storedValue, setStoredValue] = useState(() => { + try { + const data = Digit.SessionStorage.get(key); + return data ? data : initialValue; + } catch (err) { + return initialValue; + } + }); + + const setValue = (value) => { + try { + const valueToStore = value instanceof Function ? value(storedValue) : value; + setStoredValue(valueToStore); + Digit.SessionStorage.set(key, valueToStore); + } catch (err) { + } + }; + + const clearValue = () => { + setStoredValue(initialValue); + Digit.SessionStorage.set(key, initialValue); + }; + + return [storedValue, setValue, clearValue]; +}; + +export default useSessionStorage; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStaticData.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStaticData.js new file mode 100644 index 00000000000..f777480903e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStaticData.js @@ -0,0 +1,7 @@ +import { useQuery } from "react-query"; + +const useStaticData = (tenantId) => { + return useQuery(["MODULE_LEVEL_HOME_PAGE_STATIC_DATA", tenantId], () => Digit.MDMSService.getStaticDataJSON(tenantId)); + }; + +export default useStaticData; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStatusGeneral.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStatusGeneral.js new file mode 100644 index 00000000000..aff17dcc6e6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStatusGeneral.js @@ -0,0 +1,42 @@ +import { useQuery } from "react-query"; + +const useApplicationStatusGeneral = ({ businessServices = [], tenantId }, config) => { + tenantId = tenantId || Digit.ULBService.getCurrentTenantId(); + + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo.info.roles.map((roleData) => roleData.code); + + const fetch = async () => + await Digit.WorkflowService.init(tenantId, businessServices.join()).then((res) => { + const { BusinessServices: data } = res; + return data; + }); + + const select = (data) => { + let states = []; + const filteredData = data.filter((e) => businessServices.includes(e.businessService)); + filteredData.forEach((service) => { + states = [...states, ...service.states.map((e) => ({ ...e, stateBusinessService: service.businessService }))]; + }); + + const addRoleToState = (state) => { + const roles = state.actions?.map((act) => act.roles).flat(); + return { ...state, roles }; + }; + + const roleStateMapArray = states?.map(addRoleToState).filter((e) => !!e.state); + + const userRoleStates = roleStateMapArray.filter(({ roles }) => roles?.some((role) => userRoles.includes(role))); + const otherRoleStates = roleStateMapArray + .filter(({ roles }) => !roles?.some((role) => userRoles.includes(role))) + .map((e) => ({ ...e, nonActionableRole: true })); + + return { userRoleStates, otherRoleStates }; + }; + + const queryData = useQuery(["workflow_states", tenantId, ...businessServices], () => fetch(), { select, ...config }); + + return queryData; +}; + +export default useApplicationStatusGeneral; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStore.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStore.js new file mode 100644 index 00000000000..27d4ccc135f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useStore.js @@ -0,0 +1,11 @@ +import { useQuery } from "react-query"; +import StoreData from "../services/molecules/StoreData"; + +const useStore = { + getInitData: () => + useQuery(["STORE_DATA"], () => StoreData.getInitData(), { + staleTime: Infinity, + }), +}; + +export default useStore; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useTenants.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useTenants.js new file mode 100644 index 00000000000..c3e8acd1fd7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useTenants.js @@ -0,0 +1,13 @@ +import { useQuery } from "react-query"; + +const alphabeticalSortFunctionForTenantsBasedOnName = (firstEl, secondEl) =>{ + if (firstEl.name.toUpperCase() < secondEl.name.toUpperCase() ) { + return -1 + } + if (firstEl.name.toUpperCase() > secondEl.name.toUpperCase() ) { + return 1 + } + return 0 +} + +export const useTenants = () => useQuery(["ALL_TENANTS"], () => Digit.SessionStorage.get("initData").tenants.sort(alphabeticalSortFunctionForTenantsBasedOnName)) diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useUpdateCustom.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useUpdateCustom.js new file mode 100644 index 00000000000..83c298bd9a7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useUpdateCustom.js @@ -0,0 +1,17 @@ +import { useMutation } from "react-query"; +import ApplicationUpdateActionsCustom from "../services/elements/ApplicationUpdateActionsCustom"; + +/** + * Custom hook which can make api call to update API of any module + * + * @author nipunarora-eGov + * + * returns data from update api call + */ + + +const useUpdateCustom = ( url ) => { + return useMutation((applicationData) => ApplicationUpdateActionsCustom({url,body:applicationData})); +}; + +export default useUpdateCustom; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useWorkflowDetailsV2.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useWorkflowDetailsV2.js new file mode 100644 index 00000000000..d6388d3c6f0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/useWorkflowDetailsV2.js @@ -0,0 +1,19 @@ +import { useQuery, useQueryClient } from "react-query"; + +const useWorkflowDetailsV2 = ({ tenantId, id, moduleCode, role = "CITIZEN", serviceData = {}, getStaleData, getTripData = false, config }) => { + const queryClient = useQueryClient(); + + const staleDataConfig = { staleTime: Infinity }; + + const { isLoading, error, isError, data } = useQuery( + ["workFlowDetailsWorks", tenantId, id, moduleCode, role, config], + () => Digit.WorkflowService.getDetailsByIdV2({ tenantId, id, moduleCode, role, getTripData }), + getStaleData ? { ...staleDataConfig, ...config } : config + ); + + if (getStaleData) return { isLoading, error, isError, data }; + + return { isLoading, error, isError, data, revalidate: () => queryClient.invalidateQueries(["workFlowDetailsWorks", tenantId, id, moduleCode, role]) }; +}; + +export default useWorkflowDetailsV2; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/userSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/userSearch.js new file mode 100644 index 00000000000..0506a95227f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/userSearch.js @@ -0,0 +1,8 @@ +import { useQuery, useQueryClient } from "react-query"; +import { UserService } from "../services/elements/User"; + +export const useUserSearch = (tenantId, data, filters, options = {}) => { + const client = useQueryClient(); + const queryData = useQuery(["USER_SEARCH", filters, data], () => UserService.userSearch(tenantId, data, filters), options); + return { ...queryData, revalidate: () => client.invalidateQueries(["USER_SEARCH", filters, data]) }; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/workflow.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/workflow.js new file mode 100644 index 00000000000..2549ed5d027 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/hooks/workflow.js @@ -0,0 +1,19 @@ +import { useQuery, useQueryClient } from "react-query"; + +const useWorkflowDetails = ({ tenantId, id, moduleCode, role = "CITIZEN", serviceData = {}, getStaleData, getTripData = false,config }) => { + const queryClient = useQueryClient(); + + const staleDataConfig = { staleTime: Infinity }; + + const { isLoading, error, isError, data } = useQuery( + ["workFlowDetails", tenantId, id, moduleCode, role, config], + () => Digit.WorkflowService.getDetailsById({ tenantId, id, moduleCode, role, getTripData }), + getStaleData ? { ...staleDataConfig, ...config } : config + ); + + if (getStaleData) return { isLoading, error, isError, data }; + + return { isLoading, error, isError, data, revalidate: () => queryClient.invalidateQueries(["workFlowDetails", tenantId, id, moduleCode, role]) }; +}; + +export default useWorkflowDetails; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/index.js new file mode 100644 index 00000000000..5a7d61a4d9f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/index.js @@ -0,0 +1,90 @@ +import i18next from "i18next"; +import Enums from "./enums/index"; +import mergeConfig from "./config/mergeConfig"; +import { useStore } from "./services/index"; +import { initI18n } from "./translations/index"; + +import { Storage, PersistantStorage } from "./services/atoms/Utils/Storage"; +import { UploadServices } from "./services/atoms/UploadServices"; +import JsDictionary from "./services/atoms/JsDictionary"; + +import { LocationService } from "./services/elements/Location"; +import { LocalityService } from "./services/elements/Localities"; +import { CustomService } from "./services/elements/CustomService"; +import { LocalizationService } from "./services/elements/Localization/service"; +import { LoginService } from "./services/elements/Login"; +import { PGRService } from "./services/elements/PGR"; +import { PaymentService } from "./services/elements/Payment"; +import * as dateUtils from "./services/atoms/Utils/Date"; +import Download from "./services/atoms/Download"; +import { WorkflowService } from "./services/elements/WorkFlow"; +import { MdmsService } from "./services/elements/MDMS"; +import { Complaint } from "./services/elements/Complaint"; +import { UserService } from "./services/elements/User"; +import HrmsService from "./services/elements/HRMS"; +import { InboxGeneral } from "./services/elements/InboxService"; +import EventsServices from "./services/elements/Events"; + + +import ShareFiles from "./services/molecules/ShareFiles"; +import { GetServiceDefinitions } from "./services/molecules/ServiceDefinitions"; +import { ULBService } from "./services/molecules/Ulb"; +import { ComponentRegistryService } from "./services/elements/ComponentRegistry"; +import StoreData from "./services/molecules/StoreData"; + +import Contexts from "./contexts"; +import Hooks from "./hooks"; +import Utils from "./utils"; +import { subFormRegistry } from "./subFormRegistry"; +import AccessControlService from "./services/elements/Access"; + +const setupLibraries = (Library, props) => { + window.Digit = window.Digit || {}; + window.Digit[Library] = window.Digit[Library] || {}; + window.Digit[Library] = { ...window.Digit[Library], ...props }; +}; + +const initLibraries = () => { + setupLibraries("SessionStorage", Storage); + setupLibraries("PersistantStorage", PersistantStorage); + setupLibraries("UserService", UserService); + setupLibraries("ULBService", ULBService); + + setupLibraries("Config", { mergeConfig }); + setupLibraries("Services", { useStore }); + setupLibraries("Enums", Enums); + setupLibraries("LocationService", LocationService); + setupLibraries("CustomService",CustomService) + setupLibraries("LocalityService", LocalityService); + setupLibraries("LoginService", LoginService); + setupLibraries("LocalizationService", LocalizationService); + setupLibraries("PGRService", PGRService); + setupLibraries("HRMSService", HrmsService); + setupLibraries("PaymentService", PaymentService); + setupLibraries("DateUtils", dateUtils); + setupLibraries("WorkflowService", WorkflowService); + setupLibraries("MDMSService", MdmsService); + setupLibraries("UploadServices", UploadServices); + setupLibraries("JsDictionary", JsDictionary); + setupLibraries("GetServiceDefinitions", GetServiceDefinitions); + setupLibraries("Complaint", Complaint); + setupLibraries("ComponentRegistryService", ComponentRegistryService); + setupLibraries("StoreData", StoreData); + setupLibraries("EventsServices", EventsServices); + + setupLibraries("InboxGeneral", InboxGeneral); + setupLibraries("ShareFiles", ShareFiles); + setupLibraries("Contexts", Contexts); + setupLibraries("Hooks", Hooks); + setupLibraries("Customizations", {}); + setupLibraries("Utils", Utils); + setupLibraries("Download", Download); + + setupLibraries("AccessControlService", AccessControlService); + + return new Promise((resolve) => { + initI18n(resolve); + }); +}; + +export { initLibraries, Enums, Hooks, subFormRegistry }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/ApiCacheService.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/ApiCacheService.js new file mode 100644 index 00000000000..31bbe25c694 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/ApiCacheService.js @@ -0,0 +1,64 @@ +import { PersistantStorage } from "./Utils/Storage"; + +const defaultApiCachingSettings = [ + { + serviceName: "localization", + cacheTimeInSecs: 86400, + }, + { + serviceName: "access/v1/actions", + cacheTimeInSecs: 86400, + }, + { + serviceName: "user/_search", + cacheTimeInSecs: 86400, + }, + { + serviceName: "egov-mdms-service", + cacheTimeInSecs: 3600, + debounceTimeInMS: 100, + moduleSettings: [ + { + moduleName: "FSM", + cacheTimeInSecs: 7200, + }, + ], + }, +]; + +const storageKey = "cachingService"; +const getCachedSetting = () => { + if (Digit.ApiCacheSetting) { + return Digit.ApiCacheSetting; + } + const setting = PersistantStorage.get(storageKey) || defaultApiCachingSettings; + Digit.ApiCacheSetting = setting; + return setting; +}; +const getSetting = (serviceName, moduleName) => { + const setting = getCachedSetting(); + const serviceSetting = setting.find((item) => item.serviceName === serviceName); + const responseSetting = { + cacheTimeInSecs: serviceSetting.cacheTimeInSecs, + debounceTimeInMS: serviceSetting.debounceTimeInMS || 100, + }; + if (!moduleName) { + return responseSetting; + } + const moduleSettings = serviceSetting?.moduleSettings?.find((item) => item.moduleName === moduleName); + if (!moduleSettings) { + return responseSetting; + } + return { + cacheTimeInSecs: moduleSettings.cacheTimeInSecs || responseSetting.cacheTimeInSecs, + debounceTimeInMS: moduleSettings.debounceTimeInMS || responseSetting.debounceTimeInMS, + }; +}; +export const ApiCacheService = { + saveSetting: (setting) => { + PersistantStorage.set(storageKey, setting || defaultApiCachingSettings); + }, + getSettingByServiceUrl: (serviceUrl, moduleName) => { + return getSetting(serviceUrl.split("/")[1], moduleName); + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Download.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Download.js new file mode 100644 index 00000000000..9e044c47da0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Download.js @@ -0,0 +1,208 @@ +import ReactDOM from "react-dom"; +import html2canvas from "html2canvas"; +import XLSX from "xlsx"; +import domtoimage from "dom-to-image"; + +const changeClasses=(class1,class2)=>{ + var elements = document.getElementsByClassName(class1) + Array.prototype.map.call(elements, function(testElement){ + testElement.classList.add(class2); + testElement.classList.remove(class1); + }); +} + +const revertCss=()=>{ + changeClasses("dss-white-pre-temp",'dss-white-pre-line'); +} + +const applyCss=()=>{ + changeClasses('dss-white-pre-line',"dss-white-pre-temp"); +} + +const Download = { + Image: (node, fileName, share, resolve = null) => { + const saveAs = (uri, filename) => { + const link = document.createElement("a"); + + if (typeof link.download === "string") { + link.href = uri; + link.download = filename; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + } else { + window.open(uri); + } + }; + + const element = ReactDOM.findDOMNode(node.current); + html2canvas(element, { + scrollY: -window.scrollY, + scrollX: 0, + useCORS: true, + scale: 1.5, + }).then((canvas) => { + return share + ? canvas.toBlob((blob) => resolve(new File([blob], `${fileName}.jpeg`, { type: "image/jpeg" })), "image/jpeg", 1) + : saveAs(canvas.toDataURL("image/jpeg", 1), `${fileName}.jpeg`); + }); + }, + + Excel: (data, filename) => { + const file = filename.substring(0,30); + const wb = XLSX.utils.book_new(); + let ws = null; + ws = XLSX.utils.json_to_sheet(data) + wb.SheetNames.push(file); + wb.Sheets[file] = ws; + XLSX.writeFile(wb, `${file}.xlsx`); + }, + + PDF: (node, fileName, share, resolve = null) => { + + + + const saveAs = (uri, filename) => { + if(window.mSewaApp && window.mSewaApp.isMsewaApp()){ + window.mSewaApp.downloadBase64File(uri, filename); + } + const link = document.createElement("a"); + + if (typeof link.download === "string") { + link.href = uri; + link.download = filename; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + } else { + window.open(uri); + } + }; + const dataURItoBlob = (dataURI) => { + var binary = atob(dataURI.split(',')[1]); + var array = []; + for (var i = 0; i < binary.length; i++) { + array.push(binary.charCodeAt(i)); + } + return new Blob([new Uint8Array(array)], { type: 'image/jpeg' }); + }; + changeClasses('dss-white-pre-line',"dss-white-pre-temp"); + + applyCss(); + const element = ReactDOM.findDOMNode(node.current); + + + return domtoimage.toJpeg(element, { + quality: 1, + bgcolor: 'white', + filter:node=>!node?.className?.includes?.("divToBeHidden"), + style:{ + margin:'25px' + } + }).then(function (dataUrl) { +/* to enable pdf + var htmlImage = new Image(); + htmlImage.src = dataUrl; + var pdf = new jsPDF( 'l', 'pt', [element.offsetWidth, element.offsetHeight] ); + pdf.setFontStyle?.("Bold"); + pdf.setFontSize?.(30); + pdf.text?.(325, 40, 'Certificate'); + // e(imageData, format, x, y, width, height, alias, compression, rotation) + pdf.addImage?.( htmlImage, 25, 50, 50, element.offsetWidth, element.offsetHeight ); + pdf.save?.( fileName +'.pdf' ); + */ + changeClasses("dss-white-pre-temp",'dss-white-pre-line'); + + revertCss(); + var blobData = dataURItoBlob(dataUrl); + revertCss(); + return share + ? resolve(new File([blobData], `${fileName}.jpeg`, { type: "image/jpeg" })) + : saveAs(dataUrl, `${fileName}.jpeg`) + }); + + + /* + const getPDF = (canvas) => { + const width = canvas.width; + const height = canvas.height; + const o = width > height ? "l" : "p"; + const format = "a4"; + + return new jsPDF(o, "mm", format); + }; + + const element = ReactDOM.findDOMNode(node.current); + return html2canvas(element, { + scrollY: -window.scrollY, + scrollX: 0, + useCORS: true, + scale: 1.5, + windowWidth: document.documentElement.offsetWidth, + windowHeight: document.documentElement.offsetHeight, + }).then((canvas) => { + const pdf = getPDF(canvas); + const jpegImage = canvas.toDataURL("image/jpeg"); + const imgProps = pdf.getImageProperties(jpegImage); + const margin = 0.1; + const pageHeight = 295; + // const pdfWidth = pdf.internal.pageSize.width * (1 - margin); + const pdfWidth = (imgProps.width * pageHeight) / (imgProps.height * 1.2) + const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width; + const x = (pdf.internal.pageSize.width - pdfWidth) / 2; + let position = 5; + // let heightLeft = pdfHeight; + pdf.addImage(jpegImage, "JPEG", x, position, pdfWidth, pdfHeight, "a", "FAST"); + // heightLeft -= pageHeight; + // while (heightLeft > 0) { + // position += heightLeft - pdfHeight; + // pdf.addPage(); + // pdf.addImage(jpegImage, "JPEG", x, position, pdfWidth, pdfHeight, "a", "FAST"); + // heightLeft -= pageHeight; + // } + return share ? new File([pdf.output("blob")], `${fileName}.pdf`, { type: "application/pdf" }) : pdf.save(`${fileName}.pdf`); + }); + */ + }, + + IndividualChartImage: (node, fileName, share, resolve = null) => { + const saveAs = (uri, filename) => { + if(window.mSewaApp && window.mSewaApp.isMsewaApp()){ + window.mSewaApp.downloadBase64File(uri, filename); + } + const link = document.createElement("a"); + + if (typeof link.download === "string") { + link.href = uri; + link.download = filename; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + } else { + window.open(uri); + } + }; + const dataURItoBlob = (dataURI) => { + var binary = atob(dataURI.split(',')[1]); + var array = []; + for (var i = 0; i < binary.length; i++) { + array.push(binary.charCodeAt(i)); + } + return new Blob([new Uint8Array(array)], { type: 'image/jpeg' }); + }; + changeClasses('dss-white-pre-line',"dss-white-pre-temp"); + const element = ReactDOM.findDOMNode(node.current); + return domtoimage.toJpeg(element, { + quality: 1, + bgcolor: 'white' + }).then(function (dataUrl) { + var blobData = dataURItoBlob(dataUrl); + changeClasses("dss-white-pre-temp",'dss-white-pre-line'); + return share + ? resolve(new File([blobData], `${fileName}.jpeg`, { type: "image/jpeg" })) + : saveAs(dataUrl, `${fileName}.jpeg`) + }); + + }, +}; +export default Download; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/JsDictionary.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/JsDictionary.js new file mode 100644 index 00000000000..45d3a347fd1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/JsDictionary.js @@ -0,0 +1,24 @@ +class JsDictionary { + constructor(defaultFiller){ + this.defaultFiller = defaultFiller || [] + // [["key1", "valu1"],["key2", "value2"]] + } + + set(key, value){ + const __mutatedMap = this.defaultFiller.push([key, value]) + return __mutatedMap + } + + get(){ + + } + + delete(key){ + const __indexofKeyToDelete = this.defaultFiller.findIndex( e => e[0] === key ) + const __mutatedMap = this.defaultFiller.splice(__indexofKeyToDelete, 1) + return __mutatedMap + } + +} + +export default new JsDictionary([]) \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/UploadServices.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/UploadServices.js new file mode 100644 index 00000000000..493b743342e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/UploadServices.js @@ -0,0 +1,51 @@ +import Axios from "axios"; +import Urls from "./urls"; +export const UploadServices = { + Filestorage: async (module, filedata, tenantId) => { + const formData = new FormData(); + + formData.append("file", filedata, filedata.name); + formData.append("tenantId", tenantId); + formData.append("module", module); + let tenantInfo=window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE")?`?tenantId=${tenantId}`:""; + var config = { + method: "post", + url:`${Urls.FileStore}${tenantInfo}`, + data: formData, + headers: { "auth-token": Digit.UserService.getUser() ? Digit.UserService.getUser()?.access_token : null}, + }; + + return Axios(config); + }, + + MultipleFilesStorage: async (module, filesData, tenantId) => { + const formData = new FormData(); + const filesArray = Array.from(filesData) + filesArray?.forEach((fileData, index) => fileData ? formData.append("file", fileData, fileData.name) : null); + formData.append("tenantId", tenantId); + formData.append("module", module); + let tenantInfo=window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE")?`?tenantId=${tenantId}`:""; + var config = { + method: "post", + url:`${Urls.FileStore}${tenantInfo}`, + data: formData, + headers: { 'Content-Type': 'multipart/form-data',"auth-token": Digit.UserService.getUser().access_token }, + }; + + return Axios(config); + }, + + Filefetch: async (filesArray, tenantId) => { + let tenantInfo=window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE")?`?tenantId=${tenantId}`:""; + var config = { + method: "get", + url:`${Urls.FileFetch}${tenantInfo}`, + params: { + tenantId: tenantId, + fileStoreIds: filesArray?.join(","), + }, + }; + const res = await Axios(config); + return res; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Date.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Date.js new file mode 100644 index 00000000000..3b3cfc5bc0d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Date.js @@ -0,0 +1,39 @@ +import { format, toDate } from "date-fns"; + +export const ConvertTimestampToDate = (timestamp, dateFormat = "d-MMM-yyyy") => { + return timestamp ? format(toDate(timestamp), dateFormat) : null; +}; + +export const ConvertEpochToDate = (dateEpoch) => { + if (dateEpoch == null || dateEpoch == undefined || dateEpoch == "") { + return "NA"; + } + const dateFromApi = new Date(dateEpoch); + let month = dateFromApi.getMonth() + 1; + let day = dateFromApi.getDate(); + let year = dateFromApi.getFullYear(); + month = (month > 9 ? "" : "0") + month; + day = (day > 9 ? "" : "0") + day; + return `${day}/${month}/${year}`; +}; + +export const ConvertEpochToTimeInHours = (dateEpoch) => { + if (dateEpoch == null || dateEpoch == undefined || dateEpoch == "") { + return "NA"; + } + const dateFromApi = new Date(dateEpoch); + let hour = dateFromApi.getHours(); + let min = dateFromApi.getMinutes(); + let period = hour > 12 ? "PM" : "AM"; + hour = hour > 12 ? hour - 12 : hour; + hour = (hour > 9 ? "" : "0") + hour; + min = (min > 9 ? "" : "0") + min; + return `${hour}:${min} ${period}`; +}; + +export const getDayfromTimeStamp = (timestamp) => { + var a = new Date(timestamp); + var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']; + var dayOfWeek = days[a.getDay()] + return dayOfWeek +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/ParsingUtils.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/ParsingUtils.js new file mode 100644 index 00000000000..f056008748c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/ParsingUtils.js @@ -0,0 +1,53 @@ +import XLSX from 'xlsx'; + +export const parseXlsToJson = (event,setter) => { + event.preventDefault() + + const file = event.target.files[0]; + const reader = new FileReader(); + reader.onload = (e) => { + const data = new Uint8Array(e.target.result); + const workbook = XLSX.read(data, { type: 'array' }); + const sheetName = workbook.SheetNames[0]; // Assuming you want the first sheet + + const result = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName]); + setter(()=>result) + }; + + reader.readAsArrayBuffer(file); +} + +export const parseXlsToJsonMultipleSheets = (uploadEvent) => { + const allowedFileTypes = ['application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', 'application/vnd.ms-excel']; + + return new Promise((resolve, reject) => { + const uploadedFile = uploadEvent.target.files[0]; + + if (!allowedFileTypes.includes(uploadedFile.type)) { + reject(new Error('WBH_LOC_INAVLID_FILY_TYPE')); + return; + } + const reader = new FileReader(); + + reader.onload = function(event) { + const arrayBuffer = event.target.result; + const workbook = XLSX.read(arrayBuffer, { type: 'arraybuffer' }); + const jsonData = {}; + + workbook.SheetNames.forEach(sheetName => { + const worksheet = workbook.Sheets[sheetName]; + const jsonSheetData = XLSX.utils.sheet_to_json(worksheet); + jsonData[sheetName] = jsonSheetData; + }); + + resolve(jsonData); + }; + + reader.onerror = function(error) { + reject(error); + }; + + reader.readAsArrayBuffer(uploadEvent.target.files[0]); + }); +} + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Request.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Request.js new file mode 100644 index 00000000000..93e927cfa1f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Request.js @@ -0,0 +1,211 @@ +import Axios from "axios"; + +/** + * Custom Request to make all api calls + * + * @author jagankumar-egov + * + */ + +Axios.interceptors.response.use( + (res) => res, + (err) => { + const isEmployee = window.location.pathname.split("/").includes("employee"); + if (err?.response?.data?.Errors) { + for (const error of err.response.data.Errors) { + if (error.message.includes("InvalidAccessTokenException")) { + localStorage.clear(); + sessionStorage.clear(); + window.location.href = + (isEmployee ? `/${window?.contextPath}/employee/user/login` : `/${window?.contextPath}/citizen/login`) + + `?from=${encodeURIComponent(window.location.pathname + window.location.search)}`; + } else if ( + error?.message?.toLowerCase()?.includes("internal server error") || + error?.message?.toLowerCase()?.includes("some error occured") + ) { + window.location.href = + (isEmployee ? `/${window?.contextPath}/employee/user/error` : `/${window?.contextPath}/citizen/error`) + + `?type=maintenance&from=${encodeURIComponent(window.location.pathname + window.location.search)}`; + } else if (error.message.includes("ZuulRuntimeException")) { + window.location.href = + (isEmployee ? `/${window?.contextPath}/employee/user/error` : `/${window?.contextPath}/citizen/error`) + + `?type=notfound&from=${encodeURIComponent(window.location.pathname + window.location.search)}`; + } + } + } + throw err; + } +); + +const requestInfo = () => ({ + authToken: Digit.UserService.getUser()?.access_token || null, +}); + +const authHeaders = () => ({ + "auth-token": Digit.UserService.getUser()?.access_token || null, +}); + +const userServiceData = () => ({ userInfo: Digit.UserService.getUser()?.info }); + +window.Digit = window.Digit || {}; +window.Digit = { ...window.Digit, RequestCache: window.Digit.RequestCache || {} }; +export const Request = async ({ + method = "POST", + url, + data = {}, + headers = {}, + useCache = false, + params = {}, + auth, + urlParams = {}, + userService, + locale = true, + authHeader = false, + setTimeParam = true, + userDownload = false, + noRequestInfo = false, + multipartFormData = false, + multipartData = {}, + reqTimestamp = false, +}) => { + const ts = new Date().getTime(); + if (method.toUpperCase() === "POST") { + + data.RequestInfo = { + apiId: "Rainmaker", + }; + if (auth || !!Digit.UserService.getUser()?.access_token) { + data.RequestInfo = { ...data.RequestInfo, ...requestInfo() }; + } + if (userService) { + data.RequestInfo = { ...data.RequestInfo, ...userServiceData() }; + } + if (locale) { + data.RequestInfo = { ...data.RequestInfo, msgId: `${ts}|${Digit.StoreData.getCurrentLanguage()}` }; + } + + if (noRequestInfo) { + delete data.RequestInfo; + } + + /* + Feature :: Privacy + + Desc :: To send additional field in HTTP Requests inside RequestInfo Object as plainAccessRequest + */ + const privacy = Digit.Utils.getPrivacyObject(); + if (privacy && !url.includes("/edcr/rest/dcr/")) { + if(!noRequestInfo){ + data.RequestInfo = { ...data.RequestInfo, plainAccessRequest: { ...privacy } }; + } + } + } + + const headers1 = { + "Content-Type": "application/json", + Accept: window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE") ? "application/pdf,application/json" : "application/pdf", + }; + + if (authHeader) headers = { ...headers, ...authHeaders() }; + + if (userDownload) headers = { ...headers, ...headers1 }; + + let key = ""; + if (useCache) { + key = `${method.toUpperCase()}.${url}.${btoa(escape(JSON.stringify(params, null, 0)))}.${btoa(escape(JSON.stringify(data, null, 0)))}`; + const value = window.Digit.RequestCache[key]; + if (value) { + return value; + } + } else if (setTimeParam) { + params._ = Date.now(); + } + if (reqTimestamp) { + data.RequestInfo = { ...data.RequestInfo, ts: Number(ts) }; + } + + let _url = url + .split("/") + .map((path) => { + let key = path.split(":")?.[1]; + return urlParams[key] ? urlParams[key] : path; + }) + .join("/"); + + if (multipartFormData) { + const multipartFormDataRes = await Axios({ + method, + url: _url, + data: multipartData.data, + params, + headers: { "Content-Type": "multipart/form-data", "auth-token": Digit.UserService.getUser()?.access_token || null }, + }); + return multipartFormDataRes; + } + /* + Feature :: Single Instance + + Desc :: Fix for central instance to send tenantID in all query params + */ + const tenantInfo = + Digit.SessionStorage.get("userType") === "citizen" + ? Digit.ULBService.getStateId() + : Digit.ULBService.getCurrentTenantId() || Digit.ULBService.getStateId(); + if (!params["tenantId"] && window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE")) { + params["tenantId"] = tenantInfo; + } + + const res = userDownload + ? await Axios({ method, url: _url, data, params, headers, responseType: "arraybuffer" }) + : await Axios({ method, url: _url, data, params, headers }); + + if (userDownload) return res; + + const returnData = res?.data || res?.response?.data || {}; + if (useCache && res?.data && Object.keys(returnData).length !== 0) { + window.Digit.RequestCache[key] = returnData; + } + return returnData; +}; + +/** + * + * @param {*} serviceName + * + * preHook: + * ({params, data}) => ({params, data}) + * + * postHook: + * ({resData}) => ({resData}) + * + */ + +export const ServiceRequest = async ({ + serviceName, + method = "POST", + url, + data = {}, + headers = {}, + useCache = false, + params = {}, + auth, + reqTimestamp, + userService, +}) => { + const preHookName = `${serviceName}Pre`; + const postHookName = `${serviceName}Post`; + + let reqParams = params; + let reqData = data; + if (window[preHookName] && typeof window[preHookName] === "function") { + let preHookRes = await window[preHookName]({ params, data }); + reqParams = preHookRes.params; + reqData = preHookRes.data; + } + const resData = await Request({ method, url, data: reqData, headers, useCache, params: reqParams, auth, userService,reqTimestamp }); + + if (window[postHookName] && typeof window[postHookName] === "function") { + return await window[postHookName](resData); + } + return resData; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Storage.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Storage.js new file mode 100644 index 00000000000..e53725bb611 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/Utils/Storage.js @@ -0,0 +1,55 @@ +const localStoreSupport = () => { + try { + return "sessionStorage" in window && window["sessionStorage"] !== null; + } catch (e) { + return false; + } +}; + +const k = (key) => `Digit.${key}`; +const getStorage = (storageClass) => ({ + get: (key) => { + if (localStoreSupport() && key) { + let valueInStorage = storageClass.getItem(k(key)); + if (!valueInStorage || valueInStorage === "undefined") { + return null; + } + const item = JSON.parse(valueInStorage); + if (Date.now() > item.expiry) { + storageClass.removeItem(k(key)); + return null; + } + return item.value; + } else if (typeof window !== "undefined") { + return window?.eGov?.Storage && window.eGov.Storage[k(key)].value; + } else { + return null; + } + }, + set: (key, value, ttl = 86400) => { + const item = { + value, + ttl, + expiry: Date.now() + ttl * 1000, + }; + if (localStoreSupport()) { + storageClass.setItem(k(key), JSON.stringify(item)); + } else if (typeof window !== "undefined") { + window.eGov = window.eGov || {}; + window.eGov.Storage = window.eGov.Storage || {}; + window.eGov.Storage[k(key)] = item; + } + }, + del: (key) => { + if (localStoreSupport()) { + storageClass.removeItem(k(key)); + } else if (typeof window !== "undefined") { + window.eGov = window.eGov || {}; + window.eGov.Storage = window.eGov.Storage || {}; + delete window.eGov.Storage[k(key)]; + } + }, +}); + +export const Storage = getStorage(window.sessionStorage); +export const PersistantStorage = getStorage(window.localStorage); diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js new file mode 100644 index 00000000000..8f48cc54f81 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/atoms/urls.js @@ -0,0 +1,225 @@ +const Urls = { + MDMS: `/egov-mdms-service/v1/_search`, + WorkFlow: `/egov-workflow-v2/egov-wf/businessservice/_search`, + WorkFlowProcessSearch: `/egov-workflow-v2/egov-wf/process/_search`, + localization: `/localization/messages/v1/_search`, + location: { + localities: `/egov-location/location/v11/boundarys/_search?hierarchyTypeCode=ADMIN&boundaryType=Locality`, + wards: `/egov-location/location/v11/boundarys/_search?hierarchyTypeCode=ADMIN&boundaryType=Ward`, + revenue_localities: `/egov-location/location/v11/boundarys/_search?hierarchyTypeCode=REVENUE&boundaryType=Locality`, + }, + + pgr_search: `/pgr-services/v2/request/_search`, + pgr_update: `/pgr-services/v2/request/_update`, + filter_data: `https://run.mocky.io/v3/597a50a0-90e5-4a45-b82e-8a2186b760bd`, + FileStore: "/filestore/v1/files", + + FileFetch: "/filestore/v1/files/url", + PGR_Create: `/pgr-services/v2/request/_create`, + pgr_count: `/pgr-services/v2/request/_count`, + + OTP_Send: "/user-otp/v1/_send", + Authenticate: "/user/oauth/token", + RegisterUser: "/user/citizen/_create", + ChangePassword: "/user/password/nologin/_update", + ChangePassword1: "/user/password/_update", + UserProfileUpdate: "/user/profile/_update", + EmployeeSearch: "/egov-hrms/employees/_search", + + InboxSearch: "/works-inbox-service/v2/_search", + + UserSearch: "/user/_search", + UserLogout: "/user/_logout", + + Shortener: "/egov-url-shortening/shortener", + + works: { + create:"/loi-service/v1/_create", + estimateSearch:"/estimate-service/estimate/v1/_search", + loiSearch:"/loi-service/v1/_search", + createEstimate:"/estimate-service/estimate/v1/_create", + approvedEstimateSearch:"/estimate-service/estimate/v1/_search", + searchEstimate:"/estimate-service/estimate/v1/_search", + updateLOI:"/loi-service/v1/_update", + updateEstimate:"/estimate-service/estimate/v1/_update", + download_pdf:"/egov-pdf/download/WORKSESTIMATE/estimatepdf" + }, + + fsm: { + search: "/fsm/v1/_search", + create: "/fsm/v1/_create", + update: "/fsm/v1/_update", + vendorSearch: "/vendor/v1/_search", + vehicleSearch: "/vehicle/v1/_search", + audit: "/fsm/v1/_audit", + vehicleTripSearch: "/vehicle/trip/v1/_search", + billingSlabSearch: "/fsm-calculator/v1/billingSlab/_search", + vehilceUpdate: "/vehicle/trip/v1/_update", + createVendor: "/vendor/v1/_create", + updateVendor: "/vendor/v1/_update", + createVehicle: "/vehicle/v1/_create", + updateVehicle: "/vehicle/v1/_update", + driverSearch: "/vendor/driver/v1/_search", + createDriver: "/vendor/driver/v1/_create", + updateDriver: "/vendor/driver/v1/_update", + vehicleTripCreate: "/vehicle/trip/v1/_create", + }, + + payment: { + fetch_bill: "/billing-service/bill/v2/_fetchbill", + demandSearch: "/billing-service/demand/_search", + create_reciept: "/collection-services/payments/_create", + print_reciept: "/collection-services/payments", + generate_pdf: "/pdf-service/v1/_create", + create_citizen_reciept: "/pg-service/transaction/v1/_create", + update_citizen_reciept: "/pg-service/transaction/v1/_update", + search_bill: "/billing-service/bill/v2/_search", + reciept_search: "/collection-services/payments/:buisnessService/_search", + obps_Reciept_Search: "/collection-services/payments/_search", + billAmendmentSearch: "/billing-service/amendment/_search", + getBulkPdfRecordsDetails: "/pdf-service/v1/_getBulkPdfRecordsDetails", + }, + + pt: { + fectch_property: "/property-services/property/_search", + fetch_payment_details: "/billing-service/bill/v2/_fetchbill", + create: "/property-services/property/_create", + search: "/property-services/property/_search", + update: "/property-services/property/_update", + pt_calculation_estimate: "/pt-calculator-v2/propertytax/v2/_estimate", + assessment_create: "/property-services/assessment/_create", + assessment_search: "/property-services/assessment/_search", + payment_search: "/collection-services/payments/PT/_search", + pt_calculate_mutation: "/pt-calculator-v2/propertytax/mutation/_calculate", + }, + + dss: { + dashboardConfig: "/dashboard-analytics/dashboard/getDashboardConfig", + getCharts: "/dashboard-analytics/dashboard/getChartV2", + }, + + mcollect: { + search: "/echallan-services/eChallan/v1/_search", + create: "/echallan-services/eChallan/v1/_create?", + fetch_bill: "/billing-service/bill/v2/_fetchbill?", + search_bill: "/egov-searcher/bill-genie/mcollectbills/_get", + search_bill_pt: "/egov-searcher/bill-genie/billswithaddranduser/_get", + update: "/echallan-services/eChallan/v1/_update", + download_pdf: "/egov-pdf/download/UC/mcollect-challan", + receipt_download: "/egov-pdf/download/PAYMENT/consolidatedreceipt", + bill_download: "/egov-pdf/download/BILL/consolidatedbill", + count: "/echallan-services/eChallan/v1/_count", + }, + hrms: { + search: "/egov-hrms/employees/_search", + count: "/egov-hrms/employees/_count", + create: "/egov-hrms/employees/_create", + update: "/egov-hrms/employees/_update", + }, + tl: { + create: "/tl-services/v1/_create", + search: "/tl-services/v1/_search", + fetch_payment_details: "/billing-service/bill/v2/_fetchbill", + download_pdf: "/egov-pdf/download/TL/", + update: "/tl-services/v1/_update", + billingslab: "/tl-calculator/billingslab/_search", + }, + receipts: { + receipt_download: "/egov-pdf/download/PAYMENT/consolidatedreceipt", + payments: "/collection-services/payments", + count: "/egov-hrms/employees/_count", + }, + obps: { + scrutinyDetails: "/edcr/rest/dcr/scrutinydetails", + comparisionReport: "/edcr/rest/dcr/occomparison", + create: "/bpa-services/v1/bpa/_create", + nocSearch: "/noc-services/v1/noc/_search", + updateNOC: "/noc-services/v1/noc/_update", + update: "/bpa-services/v1/bpa/_update", + bpaSearch: "/bpa-services/v1/bpa/_search", + bpaRegSearch: "/tl-services/v1/BPAREG/_search", + bpaRegCreate: "/tl-services/v1/BPAREG/_create", + bpaRegGetBill: "/tl-calculator/v1/BPAREG/_getbill", + bpaRegUpdate: "/tl-services/v1/BPAREG/_update", + receipt_download: "/egov-pdf/download/PAYMENT/consolidatedreceipt", + edcrreportdownload: "/bpa-services/v1/bpa/_permitorderedcr", + getSearchDetails: "/inbox/v1/dss/_search" + }, + + edcr: { + create: "/edcr/rest/dcr/scrutinize", + }, + + events: { + search: "/egov-user-event/v1/events/_search", + update: "/egov-user-event/v1/events/lat/_update", + updateEvent: "/egov-user-event/v1/events/_update", + updateEventCDG: "/egov-user-event/v1/events/lat/_update", + count: "/egov-user-event/v1/events/notifications/_count", + create: "/egov-user-event/v1/events/_create", + }, + + ws: { + water_create: "/ws-services/wc/_create", + sewarage_create: "/sw-services/swc/_create", + water_search: "/ws-services/wc/_search", + sewarage_search: "/sw-services/swc/_search", + water_update: "/ws-services/wc/_update", + sewarage_update: "/sw-services/swc/_update", + ws_calculation_estimate: "/ws-calculator/waterCalculator/_estimate", + sw_calculation_estimate: "/sw-calculator/sewerageCalculator/_estimate", + ws_connection_search: "/ws-calculator/meterConnection/_search", + sw_payment_search: "/collection-services/payments/SW/_search", + ws_payment_search: "/collection-services/payments/WS/_search", + billAmendmentCreate: "/billing-service/amendment/_create", + billAmendmentUpdate: "/billing-service/amendment/_update", + ws_meter_conncetion_create: "/ws-calculator/meterConnection/_create", + sw_meter_conncetion_create: "/sw-calculator/meterConnection/_create", + wns_group_bill: "/egov-pdf/download/WNS/wnsgroupbill", + cancel_group_bill: "/pdf-service/v1/_cancelProcess", + wns_generate_pdf: "/egov-pdf/download/WNS/wnsbill", + water_applyAdhocTax : "/ws-calculator/waterCalculator/_applyAdhocTax", + sewerage_applyAdhocTax: "/sw-calculator/sewerageCalculator/_applyAdhocTax", + getSearchDetails: "/inbox/v1/dss/_search", + }, + + engagement: { + document: { + search: "/egov-document-uploader/egov-du/document/_search", + create: "/egov-document-uploader/egov-du/document/_create", + delete: "/egov-document-uploader/egov-du/document/_delete", + update: "/egov-document-uploader/egov-du/document/_update", + }, + surveys: { + create: "/egov-survey-services/egov-ss/survey/_create", + update: "/egov-survey-services/egov-ss/survey/_update", + search: "/egov-survey-services/egov-ss/survey/_search", + delete: "/egov-survey-services/egov-ss/survey/_delete", + submitResponse: "/egov-survey-services/egov-ss/survey/response/_submit", + showResults: "/egov-survey-services/egov-ss/survey/response/_results", + }, + }, + + attendencemgmt: { + mustorRoll: { + estimate: "/muster-roll/v1/_estimate", + create: "/muster-roll/v1/_create", + update: "/muster-roll/v1/_update", + search: "/muster-roll/v1/_search" + } + }, + + noc: { + nocSearch: "/noc-services/v1/noc/_search", + }, + reports: { + reportSearch: "/report/", + }, + bills:{ + cancelBill:"/billing-service/bill/v2/_cancelbill" + }, + access_control: "/access/v1/actions/mdms/_get", + billgenie: "/egov-searcher", +}; + +export default Urls; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Access.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Access.js new file mode 100644 index 00000000000..cbc74bc6fdd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Access.js @@ -0,0 +1,21 @@ +import { ServiceRequest } from "../atoms/Utils/Request"; +import Urls from "../atoms/urls"; + +const AccessControlService = { + getAccessControl: (roles = []) => + ServiceRequest({ + url: Urls.access_control, + method: "POST", + auth: true, + useCache: true, + userService: true, + data: { + roleCodes: roles, + tenantId: Digit.ULBService.getStateId(), + actionMaster: "actions-test", + enabled: true, + }, + reqTimestamp: true, + }), +}; +export default AccessControlService; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ApplicationUpdateActionsCustom.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ApplicationUpdateActionsCustom.js new file mode 100644 index 00000000000..1477fc981fe --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ApplicationUpdateActionsCustom.js @@ -0,0 +1,14 @@ +import { CustomService } from "./CustomService"; + + +const ApplicationUpdateActionsCustom = async ({ url, body }) => { + try { + //here need to update this object to send + const response = await CustomService.getResponse({ url, body,useCache:false,setTimeParam:false }); + return response; + } catch (error) { + throw new Error(error?.response?.data?.Errors[0].message); + } +}; + +export default ApplicationUpdateActionsCustom; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Bill.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Bill.js new file mode 100644 index 00000000000..37c198bfa60 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Bill.js @@ -0,0 +1,34 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +const BillingService = { + search_bill: ({ tenantId, filters }) => + Request({ + url: `${Urls.billgenie}${filters.url}`, + useCache: false, + method: "POST", + data: { + searchCriteria: { + tenantId: tenantId, + ...filters, + }, + }, + auth: true, + userService: false, + }), + cancel_bill:(filters) => + Request({ + url: Urls?.bills?.cancelBill, + useCache: false, + method: "POST", + data: { + UpdateBillCriteria: { + ...filters, + }, + }, + auth: true, + userService: false, + }), +} + +export default BillingService diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Complaint.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Complaint.js new file mode 100644 index 00000000000..6fc521f467f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Complaint.js @@ -0,0 +1,87 @@ +export const Complaint = { + create: async ({ + cityCode, + complaintType, + description, + landmark, + city, + district, + region, + state, + pincode, + localityCode, + localityName, + uploadedImages, + mobileNumber, + name, + }) => { + const tenantId = Digit.ULBService.getCurrentTenantId(); + const defaultData = { + service: { + tenantId: cityCode, + serviceCode: complaintType, + description: description, + additionalDetail: {}, + source: Digit.Utils.browser.isWebview() ? "mobile" : "web", + address: { + landmark: landmark, + city: city, + district: district, + region: region, + state: state, + pincode: pincode, + locality: { + code: localityCode, + name: localityName, + }, + geoLocation: {}, + }, + }, + workflow: { + action: "APPLY", + verificationDocuments: uploadedImages, + }, + }; + + if (Digit.SessionStorage.get("user_type") === "employee") { + defaultData.service.citizen = { + name: name, + type: "CITIZEN", + mobileNumber: mobileNumber, + roles: [ + { + id: null, + name: "Citizen", + code: "CITIZEN", + tenantId: tenantId, + }, + ], + tenantId: tenantId, + }; + } + const response = await Digit.PGRService.create(defaultData, cityCode); + return response; + }, + + assign: async (complaintDetails, action, employeeData, comments, uploadedDocument, tenantId) => { + complaintDetails.workflow.action = action; + complaintDetails.workflow.assignes = employeeData ? [employeeData.uuid] : null; + complaintDetails.workflow.comments = comments; + uploadedDocument + ? (complaintDetails.workflow.verificationDocuments = [ + { + documentType: "PHOTO", + fileStoreId: uploadedDocument, + documentUid: "", + additionalDetails: {}, + }, + ]) + : null; + + if (!uploadedDocument) complaintDetails.workflow.verificationDocuments = []; + + //TODO: get tenant id + const response = await Digit.PGRService.update(complaintDetails, tenantId); + return response; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ComponentRegistry.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ComponentRegistry.js new file mode 100644 index 00000000000..2d8c5c23d63 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/ComponentRegistry.js @@ -0,0 +1,19 @@ +import ComponentRegistry from "../../utils/componentRegistry"; +const componentRegistry = new ComponentRegistry(); + +export const ComponentRegistryService = { + getComponent: (id) => { + return componentRegistry.getComponent(id); + }, + + setComponent: (id, component = {}) => { + return componentRegistry.setComponent(id, component); + }, + + setupRegistry: (components) => { + // should be call only once at the starting + return componentRegistry.setAllComponents(components); + }, + + getRegistry: () => componentRegistry, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/CustomService.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/CustomService.js new file mode 100644 index 00000000000..994b087f137 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/CustomService.js @@ -0,0 +1,19 @@ +import { Request } from "../atoms/Utils/Request"; + +export const CustomService = { + getResponse: ({ url, params, body, plainAccessRequest,useCache=true,userService=true,setTimeParam=true,userDownload=false}) => + Request({ + url: url, + data: body, + useCache, + userService, + method: "POST", + auth: true, + params: params, + plainAccessRequest: plainAccessRequest, + userDownload:userDownload, + setTimeParam + }) +}; + + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/DSS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/DSS.js new file mode 100644 index 00000000000..fe9f2cf0a7b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/DSS.js @@ -0,0 +1,45 @@ +import { getCustomFiltersDynamicValues, getFilterOptionsForConfig } from "../../utils/dss"; +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; +import { MdmsService } from "./MDMS"; + +export const DSSService = { + getDashboardConfig: (moduleCode) => + Request({ + url: Urls.dss.dashboardConfig + `/${moduleCode}`, + useCache: false, + userService: false, + method: "GET", + authHeader: true, + }), + getCharts: (data) => + Request({ + url: Urls.dss.getCharts, + useCache: false, + userService: false, + method: "POST", + auth: true, + data, + }), + getFiltersConfigData: (data) => getFilterOptionsForConfig(data), + getCustomFiltersDynamicValues: async (data) => { + let tenantId = Digit.ULBService.getCurrentTenantId() || Digit.ULBService.getStateId(); + let mdmsResp = await MdmsService.call(tenantId, { + moduleDetails: [ + { + moduleName: "dss-dashboard", + masterDetails: [ + { + name: "CustomFilterValues", + }, + ], + }, + ] + }) + if (!mdmsResp) mdmsResp = {}; + if (!mdmsResp?.tenantId) { + _.set(mdmsResp, 'tenantId', tenantId) + } + return getCustomFiltersDynamicValues(data, mdmsResp); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Engagement.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Engagement.js new file mode 100644 index 00000000000..e0f1bdfac79 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Engagement.js @@ -0,0 +1,42 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const Engagement = { + search: (filters = {}) => + Request({ + url: Urls.engagement.document.search, + useCache: false, + method: "POST", + auth: true, + userService: false, + params: { ...filters }, + }), + create: (details) => + Request({ + url: Urls.engagement.document.create, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + locale: true + }), + delete: (details) => + Request({ + url: Urls.engagement.document.delete, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), + update: (details) => + Request({ + url: Urls.engagement.document.update, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Events.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Events.js new file mode 100644 index 00000000000..047b4fe33e7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Events.js @@ -0,0 +1,64 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +const Events = { + Search: ({tenantId, data, filter= {}, auth = false}) => { + // const userType = Digit.UserService.getType(); + // if(userType==="employee") auth = true + // else auth = false + //reverting these changes as it is working fine without sending authToken + return Request({ + url: Urls.events.search, + useCache: false, + data: data, + method: "POST", + auth, + userService: false, + params: { tenantId, ...filter }, + }) + }, + ClearNotification: ({tenantId}) => Request({ + url: Urls.events.update, + useCache: false, + method: "POST", + auth: true, + userService: false, + params: { tenantId }, + }), + NotificationCount: ({tenantId}) => Request({ + url: Urls.events.count, + useCache: false, + method: "POST", + auth: true, + userService: false, + params: { tenantId }, + }), + Create: (data) => + Request({ + url: Urls.events.create, + useCache: false, + method: "POST", + auth: true, + data: data, + userService: false, + }), + Update: (data) => + Request({ + url: window?.globalConfigs?.getConfig("ENABLE_SINGLEINSTANCE") ? Urls.events.updateEventCDG : Urls.events.updateEvent , + useCache: false, + method: "POST", + auth: true, + data: data, + userService: false, + }), + EventDetails: async (tenantId, filter) => { + const eventRes = await Events.Search({ tenantId, filter }); + if (eventRes?.events?.length < 1) return; + const [event] = eventRes?.events; + const fileStoresIds = event?.eventDetails?.documents?.map(document => document?.fileStoreId); + const uploadedFilesData = fileStoresIds?.length > 0 ? await Digit.UploadServices.Filefetch(fileStoresIds, tenantId) : null + return {...event, uploadedFilesData} + } +} + +export default Events \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/HRMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/HRMS.js new file mode 100644 index 00000000000..1fe9a3f4267 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/HRMS.js @@ -0,0 +1,46 @@ +import { roundToNearestMinutes } from "date-fns/esm"; +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +const HrmsService = { + search: (tenantId, filters, searchParams) => + Request({ + url: Urls.hrms.search, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId, ...filters, ...searchParams }, + }), + create: (data, tenantId) => + Request({ + data: data, + url: Urls.hrms.create, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId }, + }), + update: (data, tenantId) => + Request({ + data: data, + url: Urls.hrms.update, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId }, + }), + count: (tenantId) => + Request({ + url: Urls.hrms.count, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId }, + }), +}; + +export default HrmsService; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/InboxService.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/InboxService.js new file mode 100644 index 00000000000..6b6b45e8d51 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/InboxService.js @@ -0,0 +1,15 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const InboxGeneral = { + Search: ({ ...filters }) =>{ + return Request({ + url: Urls.InboxSearch, + useCache: false, + method: "POST", + auth: true, + userService: true, + data: { ...filters }, + }) + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localities.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localities.js new file mode 100644 index 00000000000..0ef16e7acaf --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localities.js @@ -0,0 +1,25 @@ +import { LocalizationService } from "./Localization/service"; + +const ADMIN_CODE = ({ tenantId, hierarchyType }) => { + return tenantId.replace(".", "_").toUpperCase() + "_" + hierarchyType.code; +}; + +const getI18nKeys = (localitiesWithLocalizationKeys) => { + return localitiesWithLocalizationKeys.map((locality) => ({ + code: locality.code, + message: locality.name, + })); +}; + +const getLocalities = (tenantBoundry) => { + const adminCode = ADMIN_CODE(tenantBoundry); + const localitiesWithLocalizationKeys = tenantBoundry.boundary.map((boundaryObj) => ({ + ...boundaryObj, + i18nkey: adminCode + "_" + boundaryObj.code, + })); + return localitiesWithLocalizationKeys; +}; + +export const LocalityService = { + get: (tenantBoundry) => getLocalities(tenantBoundry), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localization/service.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localization/service.js new file mode 100644 index 00000000000..993767db43e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Localization/service.js @@ -0,0 +1,93 @@ +import Urls from "../../atoms/urls"; +import { PersistantStorage } from "../../atoms/Utils/Storage"; +import i18next from "i18next"; +import { Request } from "../../atoms/Utils/Request"; +import { ApiCacheService } from "../../atoms/ApiCacheService"; + +const LOCALE_LIST = (locale) => `Locale.${locale}.List`; +const LOCALE_ALL_LIST = () => `Locale.List`; +const LOCALE_MODULE = (locale, module) => `Locale.${locale}.${module}`; + +const TransformArrayToObj = (traslationList) => { + return traslationList.reduce( + // eslint-disable-next-line + (obj, item) => ((obj[item.code] = item.message), obj), + {} + ); + // return trasformedTraslation; +}; + +const getUnique = (arr) => { + return arr.filter((value, index, self) => self.indexOf(value) === index); +}; + +const LocalizationStore = { + getCaheData: (key) => PersistantStorage.get(key), + setCacheData: (key, value) => { + const cacheSetting = ApiCacheService.getSettingByServiceUrl(Urls.localization); + PersistantStorage.set(key, value, cacheSetting.cacheTimeInSecs); + }, + getList: (locale) => LocalizationStore.getCaheData(LOCALE_LIST(locale)) || [], + setList: (locale, namespaces) => LocalizationStore.setCacheData(LOCALE_LIST(locale), namespaces), + getAllList: () => LocalizationStore.getCaheData(LOCALE_ALL_LIST()) || [], + setAllList: (namespaces) => LocalizationStore.setCacheData(LOCALE_ALL_LIST(), namespaces), + store: (locale, modules, messages) => { + const AllNamespaces = LocalizationStore.getAllList(); + const Namespaces = LocalizationStore.getList(locale); + modules.forEach((module) => { + if (!Namespaces.includes(module)) { + Namespaces.push(module); + const moduleMessages = messages.filter((message) => message.module === module); + LocalizationStore.setCacheData(LOCALE_MODULE(locale, module), moduleMessages); + } + }); + LocalizationStore.setCacheData(LOCALE_LIST(locale), Namespaces); + LocalizationStore.setAllList(getUnique([...AllNamespaces, ...Namespaces])); + }, + get: (locale, modules) => { + const storedModules = LocalizationStore.getList(locale); + const newModules = modules.filter((module) => !storedModules.includes(module)); + const messages = []; + storedModules.forEach((module) => { + messages.push(...LocalizationStore.getCaheData(LOCALE_MODULE(locale, module))); + }); + return [newModules, messages]; + }, + + updateResources: (locale, messages) => { + let locales = TransformArrayToObj(messages); + i18next.addResources(locale, "translations", locales); + }, +}; + +export const LocalizationService = { + getLocale: async ({ modules = [], locale = Digit.Utils.getDefaultLanguage(), tenantId }) => { + if (locale.indexOf(Digit.Utils.getLocaleRegion()) === -1) { + locale += Digit.Utils.getLocaleRegion(); + } + const [newModules, messages] = LocalizationStore.get(locale, modules); + if (newModules.length > 0) { + const data = await Request({ url: Urls.localization, params: { module: newModules.join(","), locale, tenantId }, useCache: false }); + messages.push(...data.messages); + setTimeout(() => LocalizationStore.store(locale, newModules, data.messages), 100); + } + LocalizationStore.updateResources(locale, messages); + return messages; + }, + changeLanguage: (locale, tenantId) => { + const modules = LocalizationStore.getList(locale); + const allModules = LocalizationStore.getAllList(); + const uniqueModules = allModules.filter((module) => !modules.includes(module)); + LocalizationService.getLocale({ modules: uniqueModules, locale, tenantId }); + localStorage.setItem("Employee.locale", locale); + localStorage.setItem("Citizen.locale", locale); + Digit.SessionStorage.set("locale", locale); + i18next.changeLanguage(locale); + }, + updateResources: (locale = Digit.Utils.getDefaultLanguage(), messages) => { + if (locale.indexOf(Digit.Utils.getLocaleRegion()) === -1) { + locale += Digit.Utils.getLocaleRegion(); + } + LocalizationStore.updateResources(locale, messages); + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Location.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Location.js new file mode 100644 index 00000000000..02634225055 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Location.js @@ -0,0 +1,30 @@ +import Urls from "../atoms/urls"; +import { ServiceRequest } from "../atoms/Utils/Request"; + +export const LocationService = { + getLocalities: (tenantId) => { + return ServiceRequest({ + serviceName: "getLocalities", + url: Urls.location.localities, + params: { tenantId: tenantId }, + useCache: true, + }); + }, + getRevenueLocalities: async (tenantId) => { + const response = await ServiceRequest({ + serviceName: "getRevenueLocalities", + url: Urls.location.revenue_localities, + params: { tenantId: tenantId }, + useCache: true, + }); + return response; + }, + getWards: (tenantId) => { + return ServiceRequest({ + serviceName: "getWards", + url: Urls.location.wards, + params: { tenantId: tenantId }, + useCache: true, + }); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Login.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Login.js new file mode 100644 index 00000000000..c02ecf6c01b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Login.js @@ -0,0 +1,50 @@ +import Axios from "axios"; +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const LoginService = { + sendOtp: (details, stateCode) => + Request({ + url: Urls.OTP_Send, + data: details, + auth: false, + method: "POST", + params: { tenantId: stateCode }, + }), + authenticate: async (details, stateCode) => { + const params = new URLSearchParams(); + Object.entries(details).forEach(([key, value]) => params.append(key, value)); + params.append("scope", "read"); + params.append("grant_type", "password"); + const config = { + url: Urls.Authenticate, + method: "post", + params, + headers: { + authorization: `Basic ${window?.globalConfigs?.getConfig("JWT_TOKEN")||"ZWdvdi11c2VyLWNsaWVudDo="}`, + "Content-Type": "application/x-www-form-urlencoded", + }, + }; + + return Axios(config); + }, + registerUser: async (details, stateCode) => + Request({ + url: Urls.Register_User, + data: { + User: details, + }, + method: "POST", + params: { tenantId: stateCode }, + }), + updateUser: async (details, stateCode) => + Request({ + url: Urls.UserProfileUpdate, + auth: true, + data: { + user: details, + }, + method: "POST", + params: { tenantId: stateCode }, + }), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js new file mode 100644 index 00000000000..8f791f7503f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/MDMS.js @@ -0,0 +1,1730 @@ +//HAVE TO CHANGE THI +import { ApiCacheService } from "../atoms/ApiCacheService"; +import Urls from "../atoms/urls"; +import { Request, ServiceRequest } from "../atoms/Utils/Request"; +import { PersistantStorage } from "../atoms/Utils/Storage"; + +// export const stringReplaceAll = (str = "", searcher = "", replaceWith = "") => { +// if (searcher == "") return str; +// while (str.includes(searcher)) { +// str = str.replace(searcher, replaceWith); +// } +// return str; +// }; + +const SortByName = (na, nb) => { + if (na < nb) { + return -1; + } + if (na > nb) { + return 1; + } + return 0; +}; + +const GetCitiesWithi18nKeys = (MdmsRes, moduleCode) => { + const cityList = (MdmsRes.tenant.citymodule && MdmsRes.tenant.citymodule.find((module) => module.code === moduleCode).tenants) || []; + const citiesMap = cityList.map((city) => city.code); + const cities = MdmsRes.tenant.tenants + .filter((city) => citiesMap.includes(city.code)) + .map(({ code, name, logoId, emailId, address, contactNumber }) => ({ + code, + name, + logoId, + emailId, + address, + contactNumber, + i18nKey: "TENANT_TENANTS_" + code.replace(".", "_").toUpperCase(), + })) + .sort((cityA, cityB) => { + const na = cityA.name.toLowerCase(), + nb = cityB.name.toLowerCase(); + return SortByName(na, nb); + }); + return cities; +}; + +const initRequestBody = (tenantId) => ({ + MdmsCriteria: { + tenantId, + moduleDetails: [ + { + moduleName: "common-masters", + masterDetails: [{ name: "Department" }, { name: "Designation" }, { name: "StateInfo" }, { name: "wfSlaConfig" }, { name: "uiHomePage" }], + }, + { + moduleName: "tenant", + masterDetails: [{ name: "tenants" }, { name: "citymodule" }], + }, + { + moduleName: "DIGIT-UI", + masterDetails: [{ name: "ApiCachingSettings" }], + }, + ], + }, +}); + +const getCriteria = (tenantId, moduleDetails) => { + return { + MdmsCriteria: { + tenantId, + ...moduleDetails, + }, + }; +}; + +export const getGeneralCriteria = (tenantId, moduleCode, type) => ({ + details: { + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: type, + }, + ], + }, + ], + }, +}); + +export const getMultipleTypes = (tenantId, moduleCode, types) => ({ + details: { + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: types.map((type) => ({ name: type })), + }, + ], + }, +}); +export const getMultipleTypesWithFilter = (moduleCode, masterDetails) => ({ + details: { + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: masterDetails, + }, + ], + }, +}); + +const getReceiptKey = (tenantId, moduleCode) => ({ + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "uiCommonPay", + }, + ], + }, + ], + }, +}); + +const getBillsGenieKey = (tenantId, moduleCode) => ({ + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "BusinessService", + }, + ], + }, + { + moduleName: "tenant", + masterDetails: [{ name: "tenants" }, { name: "citymodule" }], + }, + { + moduleName: "common-masters", + masterDetails: [{name: "uiCommonPay"}] + } + ], + }, +}); + +const getModuleServiceDefsCriteria = (tenantId, moduleCode) => ({ + type: "serviceDefs", + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: `RAINMAKER-${moduleCode}`, + masterDetails: [ + { + name: "ServiceDefs", + }, + ], + }, + ], + }, +}); + +const getSanitationTypeCriteria = (tenantId, moduleCode) => ({ + type: "SanitationType", + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "SanitationType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getPitTypeCriteria = (tenantId, moduleCode) => ({ + type: "PitType", + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PitType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getApplicationChannelCriteria = (tenantId, moduleCode) => ({ + type: "ApplicationChannel", + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "ApplicationChannel", + filter: null, + }, + ], + }, + ], + }, +}); + +const getPropertyTypeCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PropertyType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getPropertyUsageCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PropertyType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getCommonFieldsCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "CommonFieldsConfig", + filter: null, + }, + ], + }, + ], + }, +}); + +const getPreFieldsCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PreFieldsConfig", + filter: null, + }, + ], + }, + ], + }, +}); + +const getPostFieldsCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PostFieldsConfig", + filter: null, + }, + ], + }, + ], + }, +}); + +const getConfig = (tenantId, moduleCode) => ({ + type: "Config", + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "Config", + }, + ], + }, + ], + }, +}); + +const getVehicleTypeCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "VehicleMakeModel", + filter: null, + }, + ], + }, + ], + }, +}); + +const getChecklistCriteria = (tenantId, moduleCode) => ({ + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "CheckList", + filter: null, + }, + ], + }, + ], + }, +}); + +const getSlumLocalityCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "Slum", + }, + ], + }, + ], + }, +}); +const getPropertyOwnerTypeCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "OwnerType" }], + }, + ], + }, +}); + +const getSubPropertyOwnerShipCategoryCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "SubOwnerShipCategory" }], + }, + ], + }, +}); +const getPropertyOwnerShipCategoryCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "OwnerShipCategory" }], + }, + ], + }, +}); + +const getTradeOwnerShipCategoryCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "OwnerShipCategory" }], + }, + ], + }, +}); + +const getDocumentRequiredScreenCategory = (tenantId, moduleCode) => ({ + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "Documents", + }, + ], + }, + ], + }, +}); + +const getDefaultMapConfig = (tenantId, moduleCode) => ({ + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "MapConfig", + }, + ], + }, + ], + }, +}); + +const getUsageCategoryList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "UsageCategory" }], + }, + ], + }, +}); + +const getPTPropertyTypeList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "PropertyType" }], + }, + ], + }, +}); + +const getTLStructureTypeList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "StructureType" }], + }, + ], + }, +}); + +const getTLAccessoriesTypeList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "AccessoriesCategory" }], + }, + ], + }, +}); + +const getTLFinancialYearList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "FinancialYear", filter: `[?(@.module == "TL")]` }], + }, + ], + }, +}); + +const getPTFloorList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "Floor" }], + }, + ], + }, +}); + +const getReasonCriteria = (tenantId, moduleCode, type, payload) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: payload.map((mdmsLoad) => ({ + name: mdmsLoad, + })), + }, + ], + }, +}); + +const getBillingServiceForBusinessServiceCriteria = (filter) => ({ + moduleDetails: [ + { + moduleName: "BillingService", + masterDetails: [ + { name: "BusinessService", filter }, + { + name: "TaxHeadMaster", + }, + { + name: "TaxPeriod", + }, + ], + }, + ], +}); + +const getRoleStatusCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "RoleStatusMapping", + filter: null, + }, + ], + }, + ], + }, +}); +const getRentalDetailsCategoryCriteria = (tenantId, moduleCode) => ({ + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "RentalDetails", + }, + ], + }, + ], + }, +}); + +const getChargeSlabsCategoryCriteria = (tenantId, moduleCode) => ({ + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "ChargeSlabs", + }, + ], + }, + ], + }, +}); + +const getGenderTypeList = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "GenderType", + }, + ], + }, + ], + }, +}); + +const getMeterStatusTypeList = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "ws-services-calculation", + masterDetails: [ + { + name: "MeterStatus", + filter: `$.*.name` + }, + ], + }, + ], + +}); + +const getBillingPeriodValidation = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "ws-services-masters", + masterDetails: [ + { + name: "billingPeriod", + filter: "*" + }, + ], + }, + ], +}); + +const getDssDashboardCriteria = (tenantId, moduleCode) => ({ + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "dashboard-config", + }, + ], + }, + ], + }, +}); + +const getMCollectBillingServiceCriteria = (tenantId, moduleCode, type, filter) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "BusinessService", filter: filter }], + }, + ], + }, +}); + +const getTradeUnitsDataList = (tenantId, moduleCode, type, filter) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "TradeType", filter: filter }], + }, + ], + }, +}); + +const getMCollectApplicationStatusCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "applicationStatus" }], + }, + ], + }, +}); + +const getHrmsEmployeeRolesandDesignations = () => ({ + moduleDetails: [ + { + moduleName: "common-masters", + masterDetails: [ + { name: "Department", filter: "[?(@.active == true)]" }, + { name: "Designation", filter: "[?(@.active == true)]" }, + ], + }, + { + moduleName: "tenant", + masterDetails: [{ name: "tenants" }], + }, + { + moduleName: "ACCESSCONTROL-ROLES", + masterDetails: [{ name: "roles", filter: "$.[?(@.code!='CITIZEN')]" }], + }, + { moduleName: "egov-location", masterDetails: [{ name: "TenantBoundary" }] }, + ], +}); +const getFSTPPlantCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "FSTPPlantInfo" }], + }, + ], + }, +}); +const getCancelReceiptReason = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "CancelReceiptReason" }], + }, + ], + }, +}); +const getReceiptStatus = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "ReceiptStatus" }], + }, + ], + }, +}); +const getCancelReceiptReasonAndStatus = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [{ name: "ReceiptStatus" }, { name: "uiCommonPay" }], + }, + ], + }, +}); + +const getDocumentTypesCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "DocTypeMapping", + }, + ], + }, + ], + }, +}); + +const getTradeTypeRoleCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "TradeTypetoRoleMapping", + }, + ], + }, + ], + }, +}); + +const getFSTPORejectionReasonCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "FSTPORejectionReason", + filter: null, + }, + ], + }, + ], + }, +}); + +const getFSMPaymentTypeCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "PaymentType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getFSMTripNumberCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "TripNumber", + filter: null, + }, + ], + }, + ], + }, +}); + +const getFSMReceivedPaymentTypeCriteria = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: moduleCode, + masterDetails: [ + { + name: "ReceivedPaymentType", + filter: null, + }, + ], + }, + ], + }, +}); + +const getWSTaxHeadMasterCritera = (tenantId, moduleCode, type) => ({ + type, + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: "BillingService", + masterDetails: [ + { + name: "TaxHeadMaster", + filter: null, + }, + ], + }, + ], + }, +}); + +const getHowItWorksJSON = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "common-masters", + masterDetails: [ + { + name: "howItWorks", + }, + ], + }, + ], +}); + +const getFAQsJSON = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "common-masters", + masterDetails: [ + { + name: "faqs", + }, + ], + }, +], +}); +const getDSSFAQsJSON = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "dss-dashboard", + masterDetails: [ + { + name: "FAQs", + }, + ], + }, +], +}); +const getDSSAboutJSON = (tenantId) => ({ + moduleDetails: [ + { + moduleName: "dss-dashboard", + masterDetails: [ + { + name: "About", + }, + ], + }, +], +}); + +const getStaticData = () => ({ + moduleDetails: [ + { + moduleName: "common-masters", + masterDetails: [ + { + name: "StaticData", + }, + ], + }, + ], +}); + +const GetEgovLocations = (MdmsRes) => { + return MdmsRes["egov-location"].TenantBoundary[0].boundary.children.map((obj) => ({ + name: obj.localname, + i18nKey: obj.localname, + })); +}; + +const GetServiceDefs = (MdmsRes, moduleCode) => MdmsRes[`RAINMAKER-${moduleCode}`].ServiceDefs.filter((def) => def.active); + +const GetSanitationType = (MdmsRes) => MdmsRes["FSM"].SanitationType.filter((type) => type.active); + +const GetPitType = (MdmsRes) => + MdmsRes["FSM"].PitType.filter((item) => item.active).map((type) => ({ ...type, i18nKey: `PITTYPE_MASTERS_${type.code}` })); + +const GetApplicationChannel = (MdmsRes) => + MdmsRes["FSM"].ApplicationChannel.filter((type) => type.active).map((channel) => ({ + ...channel, + i18nKey: `ES_APPLICATION_DETAILS_APPLICATION_CHANNEL_${channel.code}`, + })); + +const GetPropertyType = (MdmsRes) => + MdmsRes["FSM"].PropertyType.filter((property) => property.active && !property.propertyType).map((item) => ({ + ...item, + i18nKey: `PROPERTYTYPE_MASTERS_${item.code}`, + code: item.code, + })); + +const GetPropertySubtype = (MdmsRes) => + MdmsRes["FSM"].PropertyType.filter((property) => property.active && property.propertyType).map((item) => ({ + ...item, + i18nKey: `PROPERTYTYPE_MASTERS_${item.code}`, + code: item.code, + })); + +const GetVehicleType = (MdmsRes) => + MdmsRes["Vehicle"].VehicleMakeModel.filter((vehicle) => vehicle.active) + .filter((vehicle) => vehicle.make) + .map((vehicleDetails) => { + return { + ...vehicleDetails, + i18nKey: `COMMON_MASTER_VEHICLE_${vehicleDetails.code}`, + }; + }); + +const GetVehicleMakeModel = (MdmsRes) => + MdmsRes["Vehicle"].VehicleMakeModel.filter((vehicle) => vehicle.active) + .map((vehicleDetails) => { + return { + ...vehicleDetails, + i18nKey: `COMMON_MASTER_VEHICLE_${vehicleDetails.code}`, + }; + }); + +const GetSlumLocalityMapping = (MdmsRes, tenantId) => + MdmsRes["FSM"].Slum.filter((type) => type.active).reduce((prev, curr) => { + return prev[curr.locality] + ? { + ...prev, + [curr.locality]: [ + ...prev[curr.locality], + { + ...curr, + i18nKey: `${tenantId.toUpperCase().replace(".", "_")}_${curr.locality}_${curr.code}`, + }, + ], + } + : { + ...prev, + [curr.locality]: [ + { + ...curr, + i18nKey: `${tenantId.toUpperCase().replace(".", "_")}_${curr.locality}_${curr.code}`, + }, + ], + }; + }, {}); + +const GetPropertyOwnerShipCategory = (MdmsRes) => + MdmsRes["PropertyTax"].OwnerShipCategory.filter((ownerShip) => ownerShip.active).map((ownerShipDetails) => { + return { + ...ownerShipDetails, + i18nKey: `COMMON_MASTER_OWNER_TYPE_${ownerShipDetails.code}`, + }; + }); + +const GetTradeOwnerShipCategory = (MdmsRes) => + MdmsRes["common-masters"].OwnerShipCategory.filter((ownerShip) => ownerShip.active).map((ownerShipDetails) => { + return { + ...ownerShipDetails, + i18nKey: `COMMON_MASTER_OWNER_TYPE_${ownerShipDetails.code}`, + }; + }); + +const GetPropertyOwnerType = (MdmsRes) => + MdmsRes["PropertyTax"].OwnerType.filter((owner) => owner.active).map((ownerDetails) => { + return { + ...ownerDetails, + i18nKey: `PROPERTYTAX_OWNERTYPE_${ownerDetails.code}`, + }; + }); + +const getSubPropertyOwnerShipCategory = (MdmsRes) => { + MdmsRes["PropertyTax"].SubOwnerShipCategory.filter((category) => category.active).map((subOwnerShipDetails) => { + return { + ...subOwnerShipDetails, + i18nKey: `PROPERTYTAX_BILLING_SLAB_${subOwnerShipDetails.code}`, + }; + }); + sessionStorage.setItem("getSubPropertyOwnerShipCategory", JSON.stringify(MdmsRes)); +}; + +const getDocumentRequiredScreen = (MdmsRes) => { + MdmsRes["PropertyTax"].Documents.filter((Documents) => Documents.active).map((dropdownData) => { + return { + ...Documents, + i18nKey: `${dropdownData.code}`, + }; + }); +}; + +const getTLDocumentRequiredScreen = (MdmsRes) => { + MdmsRes["TradeLicense"].Documents.filter((Documents) => Documents.active).map((dropdownData) => { + return { + ...Documents, + i18nKey: `${dropdownData.code}`, + }; + }); +}; + +const getMapConfig = (MdmsRes) => { + MdmsRes["PropertyTax"].MapConfig.filter((MapConfig) => MapConfig).map((MapData) => { + return { + ...MapConfig, + defaultconfig: MapData.defaultConfig, + }; + }); +}; + +const getUsageCategory = (MdmsRes) => + MdmsRes["PropertyTax"].UsageCategory.filter((UsageCategory) => UsageCategory.active).map((UsageCategorylist) => { + return { + ...UsageCategorylist, + i18nKey: `PROPERTYTAX_BILLING_SLAB_${UsageCategorylist.code}`, + }; + }); + +const getPTPropertyType = (MdmsRes) => + MdmsRes["PropertyTax"].UsageCategory.filter((PropertyType) => PropertyType.active).map((PTPropertyTypelist) => { + return { + ...UsageCategorylist, + i18nKey: `COMMON_PROPTYPE_${Digit.Utils.locale.stringReplaceAll(PTPropertyTypelist.code, ".", "_")}`, + }; + }); + +const getTLStructureType = (MdmsRes) => + MdmsRes["common-masters"].StructureType.filter((StructureType) => StructureType.active).map((TLStructureTypeList) => { + return { + ...TLStructureTypeList, + i18nKey: `COMMON_MASTERS_STRUCTURETYPE_${Digit.Utils.locale.stringReplaceAll(TLStructureTypeList.code, ".", "_")}`, + }; + }); + +const getTLAccessoriesType = (MdmsRes) => + MdmsRes["TradeLicense"].AccessoriesCategory.filter((AccessoriesCategory) => AccessoriesCategory.active).map((TLAccessoryTypeList) => { + return { + ...TLAccessoryTypeList, + i18nKey: `TRADELICENSE_ACCESSORIESCATEGORY_${Digit.Utils.locale.stringReplaceAll(TLAccessoryTypeList.code, ".", "_")}`, + }; + }); + +const getTLFinancialYear = (MdmsRes) => + MdmsRes["egf-master"].FinancialYear.filter((FinancialYear) => FinancialYear.active && FinancialYear.module === "TL").map((FinancialYearList) => { + return { + ...FinancialYearList, + //i18nKey: `TRADELICENSE_ACCESSORIESCATEGORY_${stringReplaceAll(TLAccessoryTypeList.code, ".", "_")}`, + }; + }); +const getFloorList = (MdmsRes) => + MdmsRes["PropertyTax"].Floor.filter((PTFloor) => PTFloor.active).map((PTFloorlist) => { + return { + ...PTFloorlist, + i18nKey: `PROPERTYTAX_FLOOR_${PTFloorlist.code}`, + }; + }); + +const GetReasonType = (MdmsRes, type, moduleCode) => + Object.assign( + {}, + ...Object.keys(MdmsRes[moduleCode]).map((collection) => ({ + [collection]: MdmsRes[moduleCode][collection] + .filter((reason) => reason.active) + .map((reason) => ({ + ...reason, + i18nKey: `ES_ACTION_REASON_${reason.code}`, + })), + })) + ); + +const getRentalDetailsCategory = (MdmsRes) => { + MdmsRes["PropertyTax"].RentalDetails.filter((category) => category.active).map((RentalDetailsInfo) => { + return { + ...RentalDetailsInfo, + i18nKey: `PROPERTYTAX_BILLING_SLAB_${RentalDetailsInfo.code}`, + }; + }); +}; + +const getChargeSlabsCategory = (MdmsRes) => { + MdmsRes["PropertyTax"].ChargeSlabs.filter((category) => category.active).map((ChargeSlabsInfo) => { + return { + ...ChargeSlabsInfo, + }; + }); +}; + +const getGenderType = (MdmsRes) => { + return MdmsRes["common-masters"].GenderType.filter((GenderType) => GenderType.active).map((genderDetails) => { + return { + ...genderDetails, + i18nKey: `PT_COMMON_GENDER_${genderDetails.code}`, + }; + }); + //return MdmsRes; +}; + +const TLGenderType = (MdmsRes) => { + MdmsRes["common-masters"].GenderType.filter((GenderType) => GenderType.active).map((genders) => { + return { + ...genders, + i18nKey: `TL_GENDER_${genders.code}`, + }; + }); +}; + +const PTGenderType = (MdmsRes) => { + MdmsRes["common-masters"].GenderType.filter((GenderType) => GenderType.active).map((formGender) => { + return { + ...formGender, + i18nKey: `PT_FORM3_${formGender.code}`, + }; + }); +}; + +const HRGenderType = (MdmsRes) => { + MdmsRes["common-masters"].GenderType.filter((GenderType) => GenderType.active).map((comGender) => { + return { + ...comGender, + i18nKey: `COMMON_GENDER_${comGender.code}`, + }; + }); +}; + +const GetMCollectBusinessService = (MdmsRes) => + MdmsRes["BillingService"].BusinessService.map((businesServiceDetails) => { + return { + ...businesServiceDetails, + i18nKey: `BILLINGSERVICE_BUSINESSSERVICE_${businesServiceDetails.code}`, + }; + }); + +const GetMCollectApplicationStatus = (MdmsRes) => + MdmsRes["mCollect"].applcationStatus.map((appStatusDetails) => { + return { + ...appStatusDetails, + i18nKey: `BILLINGSERVICE_BUSINESSSERVICE_${appStatusDetails.code}`, + }; + }); + +const getFSMGenderType = (MdmsRes) => { + return MdmsRes["common-masters"].GenderType.map((genderDetails) => { + return { + ...genderDetails, + i18nKey: `COMMON_GENDER_${genderDetails.code}`, + }; + }); +}; + +const GetFSTPORejectionReason = (MdmsRes) => { + return MdmsRes["Vehicle"].FSTPORejectionReason.filter((reason) => reason.active).map((reasonDetails) => { + return { + ...reasonDetails, + i18nKey: `ES_ACTION_REASON_${reasonDetails.code}`, + }; + }); +}; + +const GetPaymentType = (MdmsRes) => { + return MdmsRes["FSM"].PaymentType.filter((option) => option.active).map((reasonDetails) => { + return { + ...reasonDetails, + i18nKey: `ES_ACTION_${reasonDetails.code}`, + }; + }); +}; + +const GetTripNumber = (MdmsRes) => { + return MdmsRes["FSM"].TripNumber.filter((option) => option.active).map((reasonDetails) => { + return { + ...reasonDetails, + i18nKey: `ES_ACTION_TRIP_${reasonDetails.code}`, + }; + }); +}; + +const GetReceivedPaymentType = (MdmsRes) => { + return MdmsRes["FSM"].ReceivedPaymentType.filter((option) => option.active).map((reasonDetails) => { + return { + ...reasonDetails, + i18nKey: `ES_ACTION_${reasonDetails.code}`, + }; + }); +}; + +const getDssDashboard = (MdmsRes) => MdmsRes["dss-dashboard"]["dashboard-config"]; + +const GetRoleStatusMapping = (MdmsRes) => MdmsRes["DIGIT-UI"].RoleStatusMapping; +const GetCommonFields = (MdmsRes, moduleCode) => + moduleCode.toUpperCase() === "PROPERTYTAX" ? MdmsRes["PropertyTax"].CommonFieldsConfig : MdmsRes["FSM"].CommonFieldsConfig; + +const GetPreFields = (MdmsRes) => MdmsRes["FSM"].PreFieldsConfig; + +const GetPostFields = (MdmsRes) => MdmsRes["FSM"].PostFieldsConfig; + +const GetFSTPPlantInfo = (MdmsRes) => MdmsRes["FSM"]?.FSTPPlantInfo; + +const GetDocumentsTypes = (MdmsRes) => MdmsRes["BPA"].DocTypeMapping; + +const GetChecklist = (MdmsRes) => MdmsRes["BPA"].CheckList; + +const transformResponse = (type, MdmsRes, moduleCode, tenantId) => { + switch (type) { + case "citymodule": + return GetCitiesWithi18nKeys(MdmsRes, moduleCode); + case "egovLocation": + return GetEgovLocations(MdmsRes); + case "serviceDefs": + return GetServiceDefs(MdmsRes, moduleCode); + case "ApplicationChannel": + return GetApplicationChannel(MdmsRes); + case "SanitationType": + return GetSanitationType(MdmsRes); + case "PropertyType": + return GetPropertyType(MdmsRes); + case "PropertySubtype": + return GetPropertySubtype(MdmsRes); + case "PitType": + return GetPitType(MdmsRes); + case "VehicleType": + return GetVehicleType(MdmsRes); + case "VehicleMakeModel": + return GetVehicleMakeModel(MdmsRes); + case "Slum": + return GetSlumLocalityMapping(MdmsRes, tenantId); + case "OwnerShipCategory": + return GetPropertyOwnerShipCategory(MdmsRes); + case "TLOwnerShipCategory": + return GetTradeOwnerShipCategory(MdmsRes); + case "OwnerType": + return GetPropertyOwnerType(MdmsRes); + case "SubOwnerShipCategory": + return getSubPropertyOwnerShipCategory(MdmsRes); + case "Documents": + return getDocumentRequiredScreen(MdmsRes); + case "TLDocuments": + return getTLDocumentRequiredScreen(MdmsRes); + case "MapConfig": + return getMapConfig(MdmsRes); + case "UsageCategory": + return getUsageCategory(MdmsRes); + case "PTPropertyType": + return getPTPropertyType(MdmsRes); + case "StructureType": + return getTLStructureType(MdmsRes); + case "AccessoryCategory": + return getTLAccessoriesType(MdmsRes); + case "FinancialYear": + return getTLFinancialYear(MdmsRes); + case "Floor": + return getFloorList(MdmsRes); + case "Reason": + return GetReasonType(MdmsRes, type, moduleCode); + case "RoleStatusMapping": + return GetRoleStatusMapping(MdmsRes); + case "CommonFieldsConfig": + return GetCommonFields(MdmsRes, moduleCode); + case "PreFieldsConfig": + return GetPreFields(MdmsRes); + case "PostFieldsConfig": + return GetPostFields(MdmsRes); + case "RentalDeatils": + return getRentalDetailsCategory(MdmsRes); + case "ChargeSlabs": + return getChargeSlabsCategory(MdmsRes); + case "DssDashboard": + return getDssDashboard(MdmsRes); + case "BusinessService": + return GetMCollectBusinessService(MdmsRes); + case "applcatonStatus": + return GetMCollectApplicationStatus(MdmsRes); + case "FSTPPlantInfo": + return GetFSTPPlantInfo(MdmsRes); + case "GenderType": + return getGenderType(MdmsRes); + case "TLGendertype": + return TLGenderType(MdmsRes); + case "PTGenderType": + return PTGenderType(MdmsRes); + case "HRGenderType": + return HRGenderType(MdmsRes); + case "DocumentTypes": + return GetDocumentsTypes(MdmsRes); + case "CheckList": + return GetChecklist(MdmsRes); + case "FSMGenderType": + return getFSMGenderType(MdmsRes); + case "FSTPORejectionReason": + return GetFSTPORejectionReason(MdmsRes); + case "PaymentType": + return GetPaymentType(MdmsRes); + case "TripNumber": + return GetTripNumber(MdmsRes); + case "ReceivedPaymentType": + return GetReceivedPaymentType(MdmsRes); + default: + return MdmsRes; + } +}; + +const getCacheSetting = (moduleName) => { + return ApiCacheService.getSettingByServiceUrl(Urls.MDMS, moduleName); +}; + +const mergedData = {}; +const mergedPromises = {}; +const callAllPromises = (success, promises = [], resData) => { + promises.forEach((promise) => { + if (success) { + promise.resolve(resData); + } else { + promise.reject(resData); + } + }); +}; +const mergeMDMSData = (data, tenantId) => { + if (!mergedData[tenantId] || Object.keys(mergedData[tenantId]).length === 0) { + mergedData[tenantId] = data; + } else { + data.MdmsCriteria.moduleDetails.forEach((dataModuleDetails) => { + const moduleName = dataModuleDetails.moduleName; + const masterDetails = dataModuleDetails.masterDetails; + let found = false; + mergedData[tenantId].MdmsCriteria.moduleDetails.forEach((moduleDetail) => { + if (moduleDetail.moduleName === moduleName) { + found = true; + moduleDetail.masterDetails = [...moduleDetail.masterDetails, ...masterDetails]; + } + }); + if (!found) { + mergedData[tenantId].MdmsCriteria.moduleDetails.push(dataModuleDetails); + } + }); + } +}; +const debouncedCall = ({ serviceName, url, data, useCache, params }, resolve, reject) => { + if (!mergedPromises[params.tenantId] || mergedPromises[params.tenantId].length === 0) { + const cacheSetting = getCacheSetting(); + setTimeout(() => { + let callData = JSON.parse(JSON.stringify(mergedData[params.tenantId])); + mergedData[params.tenantId] = {}; + let callPromises = [...mergedPromises[params.tenantId]]; + mergedPromises[params.tenantId] = []; + ServiceRequest({ + serviceName, + url, + data: callData, + useCache, + params, + }) + .then((data) => { + callAllPromises(true, callPromises, data); + }) + .catch((err) => { + callAllPromises(false, callPromises, err); + }); + }, cacheSetting.debounceTimeInMS || 500); + } + mergeMDMSData(data, params.tenantId); + if (!mergedPromises[params.tenantId]) { + mergedPromises[params.tenantId] = []; + } + mergedPromises[params.tenantId].push({ resolve, reject }); +}; + +export const MdmsService = { + init: (stateCode) => + ServiceRequest({ + serviceName: "mdmsInit", + url: Urls.MDMS, + data: initRequestBody(stateCode), + useCache: true, + params: { tenantId: stateCode }, + }), + call: (tenantId, details) => { + return new Promise((resolve, reject) => + debouncedCall( + { + serviceName: "mdmsCall", + url: Urls.MDMS, + data: getCriteria(tenantId, details), + useCache: true, + params: { tenantId }, + }, + resolve, + reject + ) + ); + }, + getDataByCriteria: async (tenantId, mdmsDetails, moduleCode) => { + const key = `MDMS.${tenantId}.${moduleCode}.${mdmsDetails.type}.${JSON.stringify(mdmsDetails.details)}`; + const inStoreValue = PersistantStorage.get(key); + if (inStoreValue) { + return inStoreValue; + } + const { MdmsRes } = await MdmsService.call(tenantId, mdmsDetails.details); + const responseValue = transformResponse(mdmsDetails.type, MdmsRes, moduleCode.toUpperCase(), tenantId); + const cacheSetting = getCacheSetting(mdmsDetails.details.moduleDetails[0].moduleName); + PersistantStorage.set(key, responseValue, cacheSetting.cacheTimeInSecs); + return responseValue; + }, + getServiceDefs: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getModuleServiceDefsCriteria(tenantId, moduleCode), moduleCode); + }, + getSanitationType: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getSanitationTypeCriteria(tenantId, moduleCode), moduleCode); + }, + getApplicationChannel: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getApplicationChannelCriteria(tenantId, moduleCode), moduleCode); + }, + getPropertyType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPropertyTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getPropertyUsage: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPropertyUsageCriteria(tenantId, moduleCode, type), moduleCode); + }, + getPropertySubtype: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPropertyTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getPitType: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getPitTypeCriteria(tenantId, moduleCode), moduleCode); + }, + getVehicleType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getVehicleTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getChecklist: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getChecklistCriteria(tenantId, moduleCode), moduleCode); + }, + getPaymentRules: (tenantId, filter) => { + return MdmsService.call(tenantId, getBillingServiceForBusinessServiceCriteria(filter)); + }, + + getCustomizationConfig: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getConfig(tenantId, moduleCode), moduleCode); + }, + getSlumLocalityMapping: (tenantId, moduleCode, type) => + MdmsService.getDataByCriteria(tenantId, getSlumLocalityCriteria(tenantId, moduleCode, type), moduleCode), + + getReason: (tenantId, moduleCode, type, payload) => + MdmsService.getDataByCriteria(tenantId, getReasonCriteria(tenantId, moduleCode, type, payload), moduleCode), + + getRoleStatus: (tenantId, moduleCode, type) => + MdmsService.getDataByCriteria(tenantId, getRoleStatusCriteria(tenantId, moduleCode, type), moduleCode), + + getCommonFieldsConfig: (tenantId, moduleCode, type, payload) => + MdmsService.getDataByCriteria(tenantId, getCommonFieldsCriteria(tenantId, moduleCode, type, payload), moduleCode), + + getPreFieldsConfig: (tenantId, moduleCode, type, payload) => + MdmsService.getDataByCriteria(tenantId, getPreFieldsCriteria(tenantId, moduleCode, type, payload), moduleCode), + + getPostFieldsConfig: (tenantId, moduleCode, type, payload) => + MdmsService.getDataByCriteria(tenantId, getPostFieldsCriteria(tenantId, moduleCode, type, payload), moduleCode), + + getPropertyOwnerShipCategory: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPropertyOwnerShipCategoryCriteria(tenantId, moduleCode, type), moduleCode); + }, + + GetTradeOwnerShipCategory: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getTradeOwnerShipCategoryCriteria(tenantId, moduleCode, type), moduleCode); + }, + + getPropertyOwnerType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPropertyOwnerTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getPropertySubOwnerShipCategory: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getSubPropertyOwnerShipCategoryCriteria(tenantId, moduleCode, type), moduleCode); + }, + getDocumentRequiredScreen: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getDocumentRequiredScreenCategory(tenantId, moduleCode), moduleCode); + }, + getTLDocumentRequiredScreen: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getDocumentRequiredScreenCategory(tenantId, moduleCode), moduleCode); + }, + getTradeUnitsData: (tenantId, moduleCode, type, filter) => { + return MdmsService.getDataByCriteria(tenantId, getTradeUnitsDataList(tenantId, moduleCode, type, filter), moduleCode); + }, + getMapConfig: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getDefaultMapConfig(tenantId, moduleCode), moduleCode); + }, + getUsageCategory: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getUsageCategoryList(tenantId, moduleCode), moduleCode); + }, + getPTPropertyType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPTPropertyTypeList(tenantId, moduleCode), moduleCode); + }, + getTLStructureType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getTLStructureTypeList(tenantId, moduleCode), moduleCode); + }, + getTLAccessoriesType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getTLAccessoriesTypeList(tenantId, moduleCode), moduleCode); + }, + getTLFinancialYear: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getTLFinancialYearList(tenantId, moduleCode), moduleCode); + }, + getFloorList: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getPTFloorList(tenantId, moduleCode, type), moduleCode); + }, + getRentalDetails: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getRentalDetailsCategoryCriteria(tenantId, moduleCode), moduleCode); + }, + getChargeSlabs: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getChargeSlabsCategoryCriteria(tenantId, moduleCode), moduleCode); + }, + getDssDashboard: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getDssDashboardCriteria(tenantId, moduleCode), moduleCode); + }, + getPaymentGateway: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGeneralCriteria(tenantId, moduleCode, type), moduleCode); + }, + getReceiptKey: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getReceiptKey(tenantId, moduleCode), moduleCode); + }, + getHelpText: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGeneralCriteria(tenantId, moduleCode, type), moduleCode); + }, + getMCollectBillingService: (tenantId, moduleCode, type, filter) => { + return MdmsService.getDataByCriteria(tenantId, getMCollectBillingServiceCriteria(tenantId, moduleCode, type, filter), moduleCode); + }, + getMCollectApplcationStatus: (tenantId, moduleCode, type, filter) => { + return MdmsService.getDataByCriteria(tenantId, getMCollectApplicationStatusCriteria(tenantId, moduleCode, type, filter), moduleCode); + }, + getHrmsEmployeeRolesandDesignation: (tenantId) => { + return MdmsService.call(tenantId, getHrmsEmployeeRolesandDesignations()); + }, + getHrmsEmployeeTypes: (tenantId, moduleCode, type, filter) => { + return MdmsService.getDataByCriteria(tenantId, getGeneralCriteria(tenantId, moduleCode, type), moduleCode); + }, + getHrmsEmployeeReason: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGeneralCriteria(tenantId, moduleCode, type), moduleCode); + }, + getMultipleTypes: (tenantId, moduleCode, types) => { + return MdmsService.getDataByCriteria(tenantId, getMultipleTypes(tenantId, moduleCode, types), moduleCode); + }, + getMultipleTypesWithFilter: (tenantId, moduleCode, types) => { + return MdmsService.getDataByCriteria(tenantId, getMultipleTypesWithFilter(moduleCode, types), moduleCode); + }, + getFSTPPlantInfo: (tenantId, moduleCode, types) => { + return MdmsService.getDataByCriteria(tenantId, getFSTPPlantCriteria(tenantId, moduleCode, types), moduleCode); + }, + getCancelReceiptReason: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getCancelReceiptReason(tenantId, moduleCode), moduleCode); + }, + getReceiptStatus: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getReceiptStatus(tenantId, moduleCode), moduleCode); + }, + getCancelReceiptReasonAndStatus: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getCancelReceiptReasonAndStatus(tenantId, moduleCode), moduleCode); + }, + + getGenderType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGenderTypeList(tenantId, moduleCode, type), moduleCode); + }, + + TLGenderType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGenderTypeList(tenantId, moduleCode, type), moduleCode); + }, + + PTGenderType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGenderTypeList(tenantId, moduleCode, type), moduleCode); + }, + + HRGenderType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGenderTypeList(tenantId, moduleCode, type), moduleCode); + }, + + getDocumentTypes: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getDocumentTypesCriteria(tenantId, moduleCode, type), moduleCode); + }, + + getTradeTypeRoleTypes: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getTradeTypeRoleCriteria(tenantId, moduleCode, type), moduleCode); + }, + + getFSMGenderType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getGenderTypeList(tenantId, moduleCode, type), moduleCode); + }, + + getFSTPORejectionReason: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getFSTPORejectionReasonCriteria(tenantId, moduleCode, type), moduleCode); + }, + + getFSMPaymentType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getFSMPaymentTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getBillsGenieKey: (tenantId, moduleCode) => { + return MdmsService.getDataByCriteria(tenantId, getBillsGenieKey(tenantId, moduleCode), moduleCode); + }, + + getFSMTripNumber: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getFSMTripNumberCriteria(tenantId, moduleCode, type), moduleCode); + }, + + getFSMReceivedPaymentType: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getFSMReceivedPaymentTypeCriteria(tenantId, moduleCode, type), moduleCode); + }, + getWSTaxHeadMaster: (tenantId, moduleCode, type) => { + return MdmsService.getDataByCriteria(tenantId, getWSTaxHeadMasterCritera(tenantId, moduleCode, type), moduleCode); + }, + + getMeterStatusType: (tenantId) => { + return MdmsService.call(tenantId, getMeterStatusTypeList(tenantId)); + }, + + getBillingPeriod: (tenantId) => { + return MdmsService.call(tenantId, getBillingPeriodValidation(tenantId)); + }, + getHowItWorksJSONData: (tenantId) => { + return MdmsService.call(tenantId, getHowItWorksJSON(tenantId)); + }, + getFAQsJSONData: (tenantId) => { + return MdmsService.call(tenantId, getFAQsJSON(tenantId)); + }, + getDSSFAQsJSONData: (tenantId) => { + return MdmsService.call(tenantId, getDSSFAQsJSON(tenantId)); + }, + + getDSSAboutJSONData: (tenantId) => { + return MdmsService.call(tenantId, getDSSAboutJSON(tenantId)); + }, + getStaticDataJSON: (tenantId) => { + return MdmsService.call(tenantId, getStaticData()); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/PGR.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/PGR.js new file mode 100644 index 00000000000..d0bce116930 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/PGR.js @@ -0,0 +1,61 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const PGRService = { + search: (tenantId, filters = {}) => { + return Request({ + url: Urls.pgr_search, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId: tenantId, ...filters }, + }); + }, + create: (details, tenantId) => + Request({ + url: Urls.PGR_Create, + data: details, + useCache: true, + method: "POST", + params: { tenantId }, + auth: true, + userService: true, + }), + update: (details) => + Request({ + url: Urls.pgr_update, + data: details, + useCache: true, + auth: true, + method: "POST", + params: { tenantId: details.tenantId }, + userService: true, + }), + count: (tenantId, params) => + Request({ + url: Urls.pgr_count, + useCache: true, + auth: true, + method: "POST", + params: { tenantId, ...params }, + }), + + employeeSearch: (tenantId, roles) => { + return Request({ + url: Urls.EmployeeSearch, + params: { tenantId, roles }, + auth: true, + }); + }, + + PGROpensearch: ({ tenantId, filters }) => + Request({ + url: Urls.pgr_search, + useCache: false, + method: "POST", + auth: false , + userService: false, + params: { tenantId, ...filters }, + }), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Payment.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Payment.js new file mode 100644 index 00000000000..d54d5a62a08 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Payment.js @@ -0,0 +1,143 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const PaymentService = { + fetchBill: (tenantId, filters = {}) => + Request({ + url: Urls.payment.fetch_bill, + useCache: false, + method: "POST", + auth: false, + userService: false, + params: { tenantId, ...filters }, + }) + .then((d) => { + return d; + }) + .catch((err) => { + if (err?.response?.data?.Errors?.[0]?.code === "EG_BS_BILL_NO_DEMANDS_FOUND") return { Bill: [] }; + else throw err; + }), + searchBill: (tenantId, filters = {}) => + Request({ + url: Urls.payment.search_bill, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId, ...filters }, + }), + searchAmendment: (tenantId, filters = {}) => { + return Request({ + url: Urls.payment.billAmendmentSearch, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId, ...filters }, + }); + }, + createReciept: (tenantId, details = {}) => + Request({ + url: Urls.payment.create_reciept, + useCache: false, + method: "POST", + auth: true, + userService: true, + locale: true, + params: { tenantId }, + data: { ...details }, + }), + + getReciept: (tenantId, businessservice, filters = {}) => + Request({ + url: + businessservice && businessservice !== "BPAREG" + ? `${Urls.payment.print_reciept}/${businessservice}/_search` + : `${Urls.payment.print_reciept}/_search`, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId, ...filters }, + }), + + generatePdf: (tenantId, data = {}, key) => + Request({ + url: Urls.payment.generate_pdf, + useCache: false, + method: "POST", + auth: true, + userService: true, + locale: true, + params: { tenantId, key }, + data: data, + }), + + printReciept: (tenantId, filters = {}) => + Request({ + url: Urls.FileFetch, + useCache: false, + method: "GET", + auth: true, + userService: true, + params: { tenantId, ...filters }, + }), + + createCitizenReciept: (tenantId, details = {}) => + Request({ + url: Urls.payment.create_citizen_reciept, + useCache: false, + method: "POST", + auth: false, + userService: false, + params: { tenantId }, + data: { ...details }, + }), + + updateCitizenReciept: (transactionId) => + Request({ + url: Urls.payment.update_citizen_reciept, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { transactionId }, + }), + + demandSearch: (tenantId, consumerCode, businessService) => + Request({ + url: Urls.payment.demandSearch, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { tenantId, consumerCode, businessService }, + }), + + recieptSearch: (tenantId, businessService, params) => + Request({ + url: + businessService === "BPAREG" && !params?.isEmployee /* || businessService.includes("BPA.") && !params?.isEmployee ) */ + ? Urls.payment.obps_Reciept_Search + : Urls.payment.reciept_search, + urlParams: + businessService === "BPAREG" && !params?.isEmployee /* || businessService.includes("BPA.") && !params?.isEmployee) */ + ? {} + : { buisnessService: businessService }, + method: "POST", + // do not change this directly add a param if needed + auth: true, + params: { tenantId, ...params }, + }), + + getBulkPdfRecordsDetails: (filters) => + Request({ + url: Urls.payment.getBulkPdfRecordsDetails, + useCache: false, + method: "POST", + auth: true, + userService: true, + params: { ...filters }, + }), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js new file mode 100644 index 00000000000..e887d760cf8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/Surveys.js @@ -0,0 +1,61 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; + +export const Surveys = { + search: (filters = {}) => + Request({ + url: Urls.engagement.surveys.search, + useCache: false, + method: "POST", + auth: true, + userService: false, + params: { ...filters }, + }), + create: (details) => + Request({ + url: Urls.engagement.surveys.create, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + locale: true + }), + delete: (details) => + Request({ + url: Urls.engagement.surveys.delete, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), + update: (details) => + Request({ + url: Urls.engagement.surveys.update, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), + submitResponse: (details) => + Request({ + url: Urls.engagement.surveys.submitResponse, + data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + }), + showResults: (details) => + Request({ + url: Urls.engagement.surveys.showResults, + // data: details, + useCache: true, + userService: true, + method: "POST", + auth: true, + params:{surveyId:details.surveyId} + }), +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/UrlShortener.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/UrlShortener.js new file mode 100644 index 00000000000..3886b332aa9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/UrlShortener.js @@ -0,0 +1,15 @@ +import { Request } from "../atoms/Utils/Request"; +import Urls from "../atoms/urls"; + +const UrlShortener = (fileStoreId) => + Request({ + data: { url: fileStoreId }, + url: Urls.Shortener, + useCache: false, + method: "POST", + auth: false, + userService: false, + noRequestInfo: true, + }); + +export default UrlShortener; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/User/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/User/index.js new file mode 100644 index 00000000000..3cac213ee44 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/User/index.js @@ -0,0 +1,139 @@ +import Urls from "../../atoms/urls"; +import { Request, ServiceRequest } from "../../atoms/Utils/Request"; +import { Storage } from "../../atoms/Utils/Storage"; + +export const UserService = { + authenticate: async(details) => { + const data = new URLSearchParams(); + Object.entries(details).forEach(([key, value]) => data.append(key, value)); + data.append("scope", "read"); + data.append("grant_type", "password"); + + let authResponse= await ServiceRequest({ + serviceName: "authenticate", + url: Urls.Authenticate, + data, + headers: { + authorization: `Basic ${window?.globalConfigs?.getConfig("JWT_TOKEN")||"ZWdvdi11c2VyLWNsaWVudDo="}`, + "Content-Type": "application/x-www-form-urlencoded", + }, + }); + const invalidRoles = window?.globalConfigs?.getConfig("INVALIDROLES") || []; + if (invalidRoles && invalidRoles.length > 0 && authResponse && authResponse?.UserRequest?.roles?.some((role) => invalidRoles.includes(role.code))) { + throw new Error("ES_ERROR_USER_NOT_PERMITTED"); + } + return authResponse; + }, + logoutUser: () => { + let user = UserService.getUser(); + if (!user || !user.info || !user.access_token) return false; + const { type } = user.info; + return ServiceRequest({ + serviceName: "logoutUser", + url: Urls.UserLogout, + data: { access_token: user?.access_token }, + auth: true, + params: { tenantId: type === "CITIZEN" ? Digit.ULBService.getStateId() : Digit.ULBService.getCurrentTenantId() }, + }); + }, + getType: () => { + return Storage.get("userType") || "citizen"; + }, + setType: (userType) => { + Storage.set("userType", userType); + Storage.set("user_type", userType); + }, + getUser: () => { + return Digit.SessionStorage.get("User"); + }, + logout: async () => { + const userType = UserService.getType(); + try { + await UserService.logoutUser(); + } catch (e) { + } + finally{ + window.localStorage.clear(); + window.sessionStorage.clear(); + if (userType === "citizen") { + window.location.replace(`/${window?.contextPath}/citizen`); + } else { + window.location.replace(`/${window?.contextPath}/employee/user/language-selection`); + } + } + }, + sendOtp: (details, stateCode) => + ServiceRequest({ + serviceName: "sendOtp", + url: Urls.OTP_Send, + data: details, + auth: false, + params: { tenantId: stateCode }, + }), + setUser: (data) => { + return Digit.SessionStorage.set("User", data); + }, + setExtraRoleDetails: (data) => { + const userDetails = Digit.SessionStorage.get("User"); + return Digit.SessionStorage.set("User", { ...userDetails, extraRoleInfo: data }); + }, + getExtraRoleDetails: () => { + return Digit.SessionStorage.get("User")?.extraRoleInfo; + }, + registerUser: (details, stateCode) => + ServiceRequest({ + serviceName: "registerUser", + url: Urls.RegisterUser, + data: { + User: details, + }, + params: { tenantId: stateCode }, + }), + updateUser: async (details, stateCode) => + ServiceRequest({ + serviceName: "updateUser", + url: Urls.UserProfileUpdate, + auth: true, + data: { + user: details, + }, + params: { tenantId: stateCode }, + }), + hasAccess: (accessTo) => { + const user = Digit.UserService.getUser(); + if (!user || !user.info) return false; + const { roles } = user.info; + return roles && Array.isArray(roles) && roles.filter((role) => accessTo.includes(role.code)).length; + }, + + changePassword: (details, stateCode) => + ServiceRequest({ + serviceName: "changePassword", + url: Digit.SessionStorage.get("User")?.info ? Urls.ChangePassword1 : Urls.ChangePassword, + data: { + ...details, + }, + auth: true, + params: { tenantId: stateCode }, + }), + + employeeSearch: (tenantId, filters) => { + return Request({ + url: Urls.EmployeeSearch, + params: { tenantId, ...filters }, + auth: true, + }); + }, + userSearch: async (tenantId, data, filters) => { + + return ServiceRequest({ + url: Urls.UserSearch, + params: { ...filters }, + method: "POST", + auth: true, + useCache: true, + userService: true, + data: data.pageSize ? { tenantId, ...data } : { tenantId, ...data, pageSize: "100" }, + }); + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/WorkFlow.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/WorkFlow.js new file mode 100644 index 00000000000..6f00237c305 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/elements/WorkFlow.js @@ -0,0 +1,410 @@ +import Urls from "../atoms/urls"; +import { Request } from "../atoms/Utils/Request"; +import cloneDeep from "lodash/cloneDeep"; + +const getThumbnails = async (ids, tenantId, documents = []) => { + + + const res = await Digit.UploadServices.Filefetch(ids, tenantId); + if (res.data.fileStoreIds && res.data.fileStoreIds.length !== 0) { + return { + thumbs: res.data.fileStoreIds.map((o) => o.url.split(",")[3] || o.url.split(",")[0]), + images: res.data.fileStoreIds.map((o) => Digit.Utils.getFileUrl(o.url)) + }; + } else { + return null; + } + +}; + +const makeCommentsSubsidariesOfPreviousActions = async (wf) => { + const TimelineMap = new Map(); + const tenantId = wf?.[0]?.tenantId; + let fileStoreIdsList = []; + let res = {}; + + for (const eventHappened of wf) { + if (eventHappened?.documents) { + eventHappened.thumbnailsToShow = await getThumbnails(eventHappened?.documents?.map(e => e?.fileStoreId), eventHappened?.tenantId, eventHappened?.documents) + } + if (eventHappened.action === "COMMENT") { + const commentAccumulator = TimelineMap.get("tlCommentStack") || [] + TimelineMap.set("tlCommentStack", [...commentAccumulator, eventHappened]) + } + else { + const eventAccumulator = TimelineMap.get("tlActions") || [] + const commentAccumulator = TimelineMap.get("tlCommentStack") || [] + eventHappened.wfComments = [...commentAccumulator, ...eventHappened.comment ? [eventHappened] : []] + TimelineMap.set("tlActions", [...eventAccumulator, eventHappened]) + TimelineMap.delete("tlCommentStack") + } + } + const response = TimelineMap.get("tlActions") + return response +} + +const getThumbnailsV2 = async (ids, tenantId, documents = []) => { + + const res = await Digit.UploadServices.Filefetch(ids, tenantId); + if (res.data.fileStoreIds && res.data.fileStoreIds.length !== 0) { + return { + thumbs: res.data.fileStoreIds.map((o) => o.url.split(",")[3] || o.url.split(",")[0]), + images: res.data.fileStoreIds.map((o) => Digit.Utils.getFileUrl(o.url)) + }; + } else { + return null; + } +}; + +const makeCommentsSubsidariesOfPreviousActionsV2 = async (wf) => { + const TimelineMap = new Map(); + // const tenantId = window.location.href.includes("/obps/") ? Digit.ULBService.getStateId() : wf?.[0]?.tenantId; + + + for (const eventHappened of wf) { + + //currenlty in workflow documentUid is getting populated so while update we are sending fileStoreId in documentUid field + if (eventHappened?.documents) { + eventHappened.thumbnailsToShow = await getThumbnailsV2(eventHappened?.documents?.map(e => e?.documentUid || e?.fileStoreId), eventHappened?.tenantId, eventHappened?.documents) + } + + + } + +} + +const getAssignerDetails = (instance, nextStep, moduleCode) => { + let assigner = instance?.assigner + if (moduleCode === "FSM" || moduleCode === "FSM_POST_PAY_SERVICE") { + if (instance.state.applicationStatus === "CREATED") { + assigner = instance?.assigner + } else { + assigner = nextStep?.assigner || instance?.assigner + } + } else { + assigner = instance?.assigner + } + return assigner +} + +export const WorkflowService = { + init: (stateCode, businessServices) => { + return Request({ + url: Urls.WorkFlow, + useCache: true, + method: "POST", + params: { tenantId: stateCode, businessServices }, + auth: true, + }); + }, + + getByBusinessId: (stateCode, businessIds, params = {}, history = true) => { + return Request({ + url: Urls.WorkFlowProcessSearch, + useCache: false, + method: "POST", + params: { tenantId: stateCode, businessIds: businessIds, ...params, history }, + auth: true, + }); + }, + getDetailsByIdV2: async ({ tenantId, id, moduleCode }) => { + + //process instance search + const workflow = await Digit.WorkflowService.getByBusinessId(tenantId, id); + const applicationProcessInstance = cloneDeep(workflow?.ProcessInstances); + //business service search + const businessServiceResponse = (await Digit.WorkflowService.init(tenantId, moduleCode))?.BusinessServices[0]?.states; + + if (workflow && workflow.ProcessInstances) { + const processInstances = workflow.ProcessInstances; + const nextStates = processInstances[0]?.nextActions.map((action) => ({ action: action?.action, nextState: processInstances[0]?.state.uuid })); + const nextActions = nextStates.map((id) => ({ + action: id.action, + state: businessServiceResponse?.find((state) => state.uuid === id.nextState), + })); + + /* To check state is updatable and provide edit option*/ + const currentState = businessServiceResponse?.find((state) => state.uuid === processInstances[0]?.state.uuid); + + // if current state is editable then we manually append an edit action + //(doing only for muster) + //beacuse in other module edit action is defined in workflow + + // if (currentState && currentState?.isStateUpdatable && moduleCode==="muster-roll-approval" ) { + // nextActions.push({ action: "EDIT", state: currentState }); + // } + // Check when to add Edit action(In Estimate only when send back to originator action is taken) + + const getStateForUUID = (uuid) => businessServiceResponse?.find((state) => state.uuid === uuid); + + //this actionState is used in WorkflowActions component + const actionState = businessServiceResponse + ?.filter((state) => state.uuid === processInstances[0]?.state.uuid) + .map((state) => { + let _nextActions = state.actions?.map?.((ac) => { + let actionResultantState = getStateForUUID(ac.nextState); + let assignees = actionResultantState?.actions?.reduce?.((acc, act) => { + return [...acc, ...act.roles]; + }, []); + return { ...actionResultantState, assigneeRoles: assignees, action: ac.action, roles: ac.roles }; + }); + // if (state?.isStateUpdatable && moduleCode==="MR") { + // _nextActions.push({ action: "RE-SUBMIT", ...state, roles: state?.actions?.[0]?.roles }) + // } + //CHECK WHEN EDIT ACTION TO BE SHOWN + return { ...state, nextActions: _nextActions, roles: state?.action, roles: state?.actions?.reduce((acc, el) => [...acc, ...el.roles], []) }; + })?.[0]; + + + //mapping nextActions with suitable roles + const actionRolePair = nextActions?.map((action) => ({ + action: action?.action, + roles: action.state?.actions?.map((action) => action.roles).join(","), + })); + + + if (processInstances.length > 0) { + // const EnrichedWfData = await makeCommentsSubsidariesOfPreviousActions(processInstances) + //if any documents are there this fn will add thumbnails to show + + await makeCommentsSubsidariesOfPreviousActionsV2(processInstances) + + let timeline = processInstances.map((instance, ind) => { + let checkPoint = { + performedAction: instance.action, + status: instance.state.applicationStatus, + state: instance.state.state, + assigner: instance?.assigner, + rating: instance?.rating, + // wfComment: instance?.wfComments?.map(e => e?.comment), + comment:instance?.comment, + wfDocuments: instance?.documents, + thumbnailsToShow: { thumbs: instance?.thumbnailsToShow?.thumbs, fullImage: instance?.thumbnailsToShow?.images }, + assignes: instance.assignes, + caption: instance.assignes ? instance.assignes?.map((assignee) => ({ name: assignee.name, mobileNumber: assignee.mobileNumber })) : null, + auditDetails: { + created: Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.createdTime), + lastModified: Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.lastModifiedTime), + lastModifiedEpoch: instance.auditDetails.lastModifiedTime, + }, + isTerminateState : instance?.state?.isTerminateState + }; + return checkPoint; + }); + + + const details = { + timeline, + nextActions:actionRolePair, + actionState, + applicationBusinessService: workflow?.ProcessInstances?.[0]?.businessService, + processInstances: applicationProcessInstance, + }; + + + return details; + } + } else { + throw new Error("error fetching workflow services"); + } + return {}; + }, + getDetailsById: async ({ tenantId, id, moduleCode, role, getTripData }) => { + const workflow = await Digit.WorkflowService.getByBusinessId(tenantId, id); + const applicationProcessInstance = cloneDeep(workflow?.ProcessInstances); + const getLocationDetails = window.location.href.includes("/obps/") || window.location.href.includes("noc/inbox"); + const moduleCodeData = getLocationDetails ? applicationProcessInstance?.[0]?.businessService : moduleCode; + const businessServiceResponse = (await Digit.WorkflowService.init(tenantId, moduleCodeData))?.BusinessServices[0]?.states; + if (workflow && workflow.ProcessInstances) { + const processInstances = workflow.ProcessInstances; + const nextStates = processInstances[0]?.nextActions.map((action) => ({ action: action?.action, nextState: processInstances[0]?.state.uuid })); + const nextActions = nextStates.map((id) => ({ + action: id.action, + state: businessServiceResponse?.find((state) => state.uuid === id.nextState), + })); + + /* To check state is updatable and provide edit option*/ + const currentState = businessServiceResponse?.find((state) => state.uuid === processInstances[0]?.state.uuid); + if (currentState && currentState?.isStateUpdatable) { + if (moduleCode === "FSM" || moduleCode === "FSM_POST_PAY_SERVICE" || moduleCode === "FSM_VEHICLE_TRIP" || moduleCode === "PGR" || moduleCode === "OBPS") null; + else nextActions.push({ action: "EDIT", state: currentState }); + } + + const getStateForUUID = (uuid) => businessServiceResponse?.find((state) => state.uuid === uuid); + + const actionState = businessServiceResponse + ?.filter((state) => state.uuid === processInstances[0]?.state.uuid) + .map((state) => { + let _nextActions = state.actions?.map?.((ac) => { + let actionResultantState = getStateForUUID(ac.nextState); + let assignees = actionResultantState?.actions?.reduce?.((acc, act) => { + return [...acc, ...act.roles]; + }, []); + return { ...actionResultantState, assigneeRoles: assignees, action: ac.action, roles: ac.roles }; + }); + if(state?.isStateUpdatable) { + _nextActions.push({ action: "EDIT", ...state, roles: state?.actions?.[0]?.roles}) + } + return { ...state, nextActions: _nextActions, roles: state?.action, roles: state?.actions?.reduce((acc, el) => [...acc, ...el.roles], []) }; + })?.[0]; + + // HANDLING ACTION for NEW VEHICLE LOG FROM UI SIDE + const action_newVehicle = [{ + "action": "READY_FOR_DISPOSAL", + "roles": "FSM_EMP_FSTPO,FSM_EMP_FSTPO" + }] + + const actionRolePair = nextActions?.map((action) => ({ + action: action?.action, + roles: action.state?.actions?.map((action) => action.roles).join(","), + })); + + if (processInstances.length > 0) { + const TLEnrichedWithWorflowData = await makeCommentsSubsidariesOfPreviousActions(processInstances) + let timeline = TLEnrichedWithWorflowData.map((instance, ind) => { + let checkPoint = { + performedAction: instance.action, + status: moduleCode === "BS.AMENDMENT" ? instance.state.state :instance.state.applicationStatus, + state: instance.state.state, + assigner: getAssignerDetails(instance, TLEnrichedWithWorflowData[ind - 1], moduleCode), + rating: instance?.rating, + wfComment: instance?.wfComments.map(e => e?.comment), + wfDocuments: instance?.documents, + thumbnailsToShow: { thumbs: instance?.thumbnailsToShow?.thumbs, fullImage: instance?.thumbnailsToShow?.images }, + assignes: instance.assignes, + caption: instance.assignes ? instance.assignes.map((assignee) => ({ name: assignee.name, mobileNumber: assignee.mobileNumber })) : null, + auditDetails: { + created: Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.createdTime), + lastModified: Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.lastModifiedTime), + lastModifiedEpoch: instance.auditDetails.lastModifiedTime, + }, + timeLineActions: instance.nextActions + ? instance.nextActions.filter((action) => action.roles.includes(role)).map((action) => action?.action) + : null, + }; + return checkPoint; + }); + + if (getTripData) { + try { + const filters = { + businessService: 'FSM_VEHICLE_TRIP', + refernceNos: id + }; + const tripSearchResp = await Digit.FSMService.vehicleSearch(tenantId, filters) + if (tripSearchResp && tripSearchResp.vehicleTrip && tripSearchResp.vehicleTrip.length) { + const numberOfTrips = tripSearchResp.vehicleTrip.length + let cretaedTime = 0 + let lastModifiedTime = 0 + let waitingForDisposedCount = 0 + let disposedCount = 0 + let waitingForDisposedAction = [] + let disposedAction = [] + for (const data of tripSearchResp.vehicleTrip) { + const resp = await Digit.WorkflowService.getByBusinessId(tenantId, data.applicationNo) + resp?.ProcessInstances?.map((instance, ind) => { + if (instance.state.applicationStatus === "WAITING_FOR_DISPOSAL") { + waitingForDisposedCount++ + cretaedTime = Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.createdTime) + lastModifiedTime = Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.lastModifiedTime) + waitingForDisposedAction = [{ + performedAction: instance.action, + status: instance.state.applicationStatus, + state: instance.state.state, + assigner: instance?.assigner, + rating: instance?.rating, + thumbnailsToShow: { thumbs: instance?.thumbnailsToShow?.thumbs, fullImage: instance?.thumbnailsToShow?.images }, + assignes: instance.assignes, + caption: instance.assignes ? instance.assignes.map((assignee) => ({ name: assignee.name, mobileNumber: assignee.mobileNumber })) : null, + auditDetails: { + created: cretaedTime, + lastModified: lastModifiedTime, + }, + numberOfTrips: numberOfTrips + }] + } + if (instance.state.applicationStatus === "DISPOSED") { + disposedCount++ + cretaedTime = instance.auditDetails.createdTime > cretaedTime ? Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.createdTime) : cretaedTime + lastModifiedTime = instance.auditDetails.lastModifiedTime > lastModifiedTime ? Digit.DateUtils.ConvertEpochToDate(instance.auditDetails.lastModifiedTime) : lastModifiedTime + disposedAction = [{ + performedAction: instance.action, + status: instance.state.applicationStatus, + state: instance.state.state, + assigner: instance?.assigner, + rating: instance?.rating, + thumbnailsToShow: { thumbs: instance?.thumbnailsToShow?.thumbs, fullImage: instance?.thumbnailsToShow?.images }, + assignes: instance.assignes, + caption: instance.assignes ? instance.assignes.map((assignee) => ({ name: assignee.name, mobileNumber: assignee.mobileNumber })) : null, + auditDetails: { + created: cretaedTime, + lastModified: lastModifiedTime, + }, + numberOfTrips: disposedCount + }] + } + }) + } + + let tripTimeline = [] + const disposalInProgressPosition = timeline.findIndex((data) => data.status === "DISPOSAL_IN_PROGRESS") + if (disposalInProgressPosition !== -1) { + timeline[disposalInProgressPosition].numberOfTrips = numberOfTrips + timeline.splice(disposalInProgressPosition + 1, 0, ...waitingForDisposedAction) + tripTimeline = disposedAction + } else { + tripTimeline = disposedAction.concat(waitingForDisposedAction) + } + const feedbackPosition = timeline.findIndex((data) => data.status === "CITIZEN_FEEDBACK_PENDING") + if (feedbackPosition !== -1) { + timeline.splice(feedbackPosition + 1, 0, ...tripTimeline) + } else { + timeline = tripTimeline.concat(timeline) + } + } + } catch (err) { } + } + + // HANDLING ACTION FOR NEW VEHICLE LOG FROM UI SIDE + const nextActions = location.pathname.includes("new-vehicle-entry") ? action_newVehicle : actionRolePair; + + if (role !== "CITIZEN" && moduleCode === "PGR") { + const onlyPendingForAssignmentStatusArray = timeline?.filter(e => e?.status === "PENDINGFORASSIGNMENT") + const duplicateCheckpointOfPendingForAssignment = onlyPendingForAssignmentStatusArray.at(-1) + // const duplicateCheckpointOfPendingForAssignment = timeline?.find( e => e?.status === "PENDINGFORASSIGNMENT") + timeline.push({ + ...duplicateCheckpointOfPendingForAssignment, + status: "COMPLAINT_FILED", + }); + } + + if (timeline[timeline.length - 1].status !== "CREATED" && (moduleCode === "FSM" || moduleCode === "FSM_POST_PAY_SERVICE")) + timeline.push({ + status: "CREATED", + }); + + const details = { + timeline, + nextActions, + actionState, + applicationBusinessService: workflow?.ProcessInstances?.[0]?.businessService, + processInstances: applicationProcessInstance, + }; + return details; + } + } else { + throw new Error("error fetching workflow services"); + } + return {}; + }, + + getAllApplication: (tenantId, filters) => { + return Request({ + url: Urls.WorkFlowProcessSearch, + useCache: false, + method: "POST", + params: { tenantId, ...filters }, + auth: true, + }); + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/index.js new file mode 100644 index 00000000000..d74d967a9de --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/index.js @@ -0,0 +1,3 @@ +import { useStore, useInitStore } from "../hooks/store"; + +export { useStore, useInitStore }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/DSS/getDSSDashboardData.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/DSS/getDSSDashboardData.js new file mode 100644 index 00000000000..cdc4605ad33 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/DSS/getDSSDashboardData.js @@ -0,0 +1,11 @@ +import useDssMDMS from "../../../hooks/dss/useMDMS"; + +export const getDSSDashboardData = (stateCode, mdmsType, moduleCode) => { + const { data: dssConfig, isLoading: configLoading, isSuccess: configLoaded } = useDssMDMS(stateCode, mdmsType, moduleCode); + return [ + { + queryKey: ["DSS_DASHBOARD_DATA", mdmsType, moduleCode], + queryFn: () => dssConfig, + }, + ]; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ServiceDefinitions.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ServiceDefinitions.js new file mode 100644 index 00000000000..17c076705d8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ServiceDefinitions.js @@ -0,0 +1,57 @@ +import { MdmsService } from "../elements/MDMS"; +import { Storage } from "../atoms/Utils/Storage"; + +export const GetServiceDefinitions = { + get: async (tenantId) => { + const criteria = { + type: "serviceDefs", + details: { + tenantId: tenantId, + moduleDetails: [ + { + moduleName: "RAINMAKER-PGR", + masterDetails: [ + { + name: "ServiceDefs", + }, + ], + }, + ], + }, + }; + + const serviceDefs = await MdmsService.getDataByCriteria(tenantId, criteria, "PGR"); + Storage.set("serviceDefinitions", serviceDefs); + return serviceDefs; + }, + getMenu: async (stateCode, t) => { + var Menu = []; + const response = await GetServiceDefinitions.get(stateCode); + await Promise.all( + response.map((def) => { + if (!Menu.find((e) => e.key === def.menuPath)) { + def.menuPath === "" + ? Menu.push({ + name: t("SERVICEDEFS.OTHERS"), + key: def.menuPath, + }) + : Menu.push({ + name: t("SERVICEDEFS." + def.menuPath.toUpperCase()), + key: def.menuPath, + }); + } + }) + ); + return Menu; + }, + + getSubMenu: async (tenantId, selectedType, t) => { + const fetchServiceDefs = await GetServiceDefinitions.get(tenantId); + return fetchServiceDefs + .filter((def) => def.menuPath === selectedType.key) + .map((id) => ({ + key: id.serviceCode, + name: t("SERVICEDEFS." + id.serviceCode.toUpperCase()), + })); + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ShareFiles.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ShareFiles.js new file mode 100644 index 00000000000..99988a0d525 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/ShareFiles.js @@ -0,0 +1,75 @@ +import Download from "../atoms/Download"; +import { UploadServices } from "../atoms/UploadServices"; +import UrlShortener from "../elements/UrlShortener"; + +const isMobileOrTablet = () => { + return (/(android|iphone|ipad|mobile)/i.test(navigator.userAgent)); +} + +const ShareFiles = { + targetLink: (target, shortUrl) => { + switch (target) { + case "mail": + return window.open(`mailto:?body=${encodeURIComponent(shortUrl)}`, "_blank"); + case "whatsapp": + return window.open('https://' + (isMobileOrTablet() ? 'api' : 'web') + '.whatsapp.com/send?text=' + encodeURIComponent(shortUrl), "_blank"); + default: + return window.open(shortUrl, "_blank"); + } + }, + + getShortener: async (tenantId, data) => { + const fileUploadId = await UploadServices.Filestorage("DSS", data, tenantId); + const fileUrl = await UploadServices.Filefetch([fileUploadId.data.files[0].fileStoreId], fileUploadId.data.files[0].tenantId); + return UrlShortener(Digit.Utils.getFileUrl(fileUrl.data[fileUploadId.data.files[0].fileStoreId])); + }, + + PDF: async (tenantId, node, filename, target) => { + const pdfData = await Download.PDF(node, filename, true); + if (!target && navigator.share) { + return navigator.share({ + files: [pdfData], + title: filename, + }); + } + const shortUrl = await ShareFiles.getShortener(tenantId, pdfData); + return ShareFiles.targetLink(target, shortUrl); + }, + + Image: async (tenantId, node, filename, target) => { + const imageData = await new Promise((resolve) => Download.Image(node, filename, true, resolve)); + if (!target && navigator.share) { + return navigator.share({ + files: [imageData], + title: filename, + }); + } + const shortUrl = await ShareFiles.getShortener(tenantId, imageData); + return ShareFiles.targetLink(target, shortUrl); + }, + + IndividualChartImage: async (tenantId, node, filename, target) => { + const imageData = await new Promise((resolve) => Download.IndividualChartImage(node, filename, true, resolve)); + if (!target && navigator.share) { + return navigator.share({ + files: [imageData], + title: filename, + }); + } + const shortUrl = await ShareFiles.getShortener(tenantId, imageData); + return ShareFiles.targetLink(target, shortUrl); + }, + DownloadImage: async (tenantId, node, filename, target) => { + const imageData = await new Promise((resolve) => Download.PDF(node, filename, true, resolve)); + if (!target && navigator.share) { + return navigator.share({ + files: [imageData], + title: filename, + }); + } + const shortUrl = await ShareFiles.getShortener(tenantId, imageData); + return ShareFiles.targetLink(target, shortUrl); + }, +}; + +export default ShareFiles; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js new file mode 100644 index 00000000000..c8dacd95506 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Store/service.js @@ -0,0 +1,119 @@ +import { LocalizationService } from "../../elements/Localization/service"; +import { MdmsService } from "../../elements/MDMS"; +import { Storage } from "../../atoms/Utils/Storage"; +import { ApiCacheService } from "../../atoms/ApiCacheService"; + +const getImgUrl = (url, fallbackUrl) => { + if (!url && fallbackUrl) { + return fallbackUrl; + } + if (url?.includes("s3.ap-south-1.amazonaws.com")) { + const baseDomain = window?.location?.origin; + return url.replace("https://s3.ap-south-1.amazonaws.com", baseDomain); + } + return url; +}; +const addLogo = (id, url, fallbackUrl = "") => { + const containerDivId = "logo-img-container"; + let containerDiv = document.getElementById(containerDivId); + if (!containerDiv) { + containerDiv = document.createElement("div"); + containerDiv.id = containerDivId; + containerDiv.style = "position: absolute; top: 0; left: -9999px;"; + document.body.appendChild(containerDiv); + } + const img = document.createElement("img"); + img.src = getImgUrl(url, fallbackUrl); + img.id = `logo-${id}`; + containerDiv.appendChild(img); +}; + +const renderTenantLogos = (stateInfo, tenants) => { + addLogo(stateInfo.code, stateInfo.logoUrl); + tenants.forEach((tenant) => { + addLogo(tenant.code, tenant.logoId, stateInfo.logoUrl); + }); +}; + +export const StoreService = { + getInitData: () => { + return Storage.get("initData"); + }, + + getBoundries: async (tenants) => { + let allBoundries = []; + allBoundries = tenants.map((tenant) => { + return Digit.LocationService.getLocalities(tenant.code); + }); + return await Promise.all(allBoundries); + }, + getRevenueBoundries: async (tenants) => { + let allBoundries = []; + allBoundries = tenants.map((tenant) => { + return Digit.LocationService.getRevenueLocalities(tenant.code); + }); + return await Promise.all(allBoundries); + }, + digitInitData: async (stateCode, enabledModules) => { + const { MdmsRes } = await MdmsService.init(stateCode); + const stateInfo = MdmsRes["common-masters"]?.StateInfo?.[0]||{}; + const uiHomePage = MdmsRes["common-masters"]?.uiHomePage?.[0]||{}; + const localities = {}; + const revenue_localities = {}; + const initData = { + languages: stateInfo.hasLocalisation ? stateInfo.languages : [{ label: "ENGLISH", value: Digit.Utils.getDefaultLanguage() }], + stateInfo: { + code: stateInfo.code, + name: stateInfo.name, + logoUrl: stateInfo.logoUrl, + statelogo: stateInfo.statelogo, + logoUrlWhite: stateInfo.logoUrlWhite, + bannerUrl: stateInfo.bannerUrl, + }, + localizationModules: stateInfo.localizationModules, + modules: MdmsRes?.tenant?.citymodule?.filter((module) => module?.active)?.filter((module) => enabledModules?.includes(module?.code))?.sort((x,y)=>x?.order-y?.order), + uiHomePage: uiHomePage + }; + + + initData.selectedLanguage = Digit.SessionStorage.get("locale") || initData.languages[0].value; + + ApiCacheService.saveSetting(MdmsRes["DIGIT-UI"]?.ApiCachingSettings); + + const moduleTenants = initData.modules + .map((module) => module.tenants) + .flat() + .reduce((unique, ele) => (unique.find((item) => item.code === ele.code) ? unique : [...unique, ele]), []); + initData.tenants = MdmsRes?.tenant?.tenants + .map((tenant) => ({ i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, ...tenant })); + // .filter((item) => !!moduleTenants.find((mt) => mt.code === item.code)) + // .map((tenant) => ({ i18nKey: `TENANT_TENANTS_${tenant.code.replace(".", "_").toUpperCase()}`, ...tenant })); + + await LocalizationService.getLocale({ + modules: [ + `rainmaker-common`, + `rainmaker-${stateCode.toLowerCase()}` + ], + locale: initData.selectedLanguage, + tenantId: stateCode, + }); + Storage.set("initData", initData); + initData.revenue_localities = revenue_localities; + initData.localities = localities; + setTimeout(() => { + renderTenantLogos(stateInfo, initData.tenants); + }, 0); + return initData; + }, + defaultData: async (stateCode, moduleCode, language) => { + let moduleCodes = []; + if(typeof moduleCode !== "string") moduleCode.forEach(code => { moduleCodes.push(`rainmaker-${code.toLowerCase()}`) }); + const LocalePromise = LocalizationService.getLocale({ + modules: typeof moduleCode == "string" ? [`rainmaker-${moduleCode.toLowerCase()}`] : moduleCodes, + locale: language, + tenantId: stateCode, + }); + await LocalePromise; + return {}; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/StoreData.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/StoreData.js new file mode 100644 index 00000000000..dcc5e2f8475 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/StoreData.js @@ -0,0 +1,8 @@ +import { StoreService } from "./Store/service"; + +const StoreData = { + getInitData: () => StoreService.getInitData(), + getCurrentLanguage: () => Digit.SessionStorage.get("locale") || Digit.Utils.getDefaultLanguage(), +}; + +export default StoreData; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Ulb/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Ulb/index.js new file mode 100644 index 00000000000..e5249335b20 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/Ulb/index.js @@ -0,0 +1,148 @@ +import { StoreService } from "../Store/service"; +import { UserService } from "../../elements/User"; + +/** + * Custom service which can be used to + * get current tenantId + * get state tenant + * get current ulb + * get citizen selected tenant + * get all ulbs of employee + * + * @author jagankumar-egov + * + * @example + * Digit.ULBService.getCurrentTenantId() + * + * @returns {Object} Returns based on the called function + */ +export const ULBService = { + /** + * Custom method to get employee's current selected city + * + * @author jagankumar-egov + * + * @example + * Digit.ULBService.getCurrentTenantId() + * + * @returns {String} + */ + getCurrentTenantId: () => { + // TODO: change when setter is done. + const user = UserService.getUser(); + if (user?.extraRoleInfo) { + const isDsoRoute = Digit.Utils.detectDsoRoute(window.location.pathname); + if (isDsoRoute) { + return user.extraRoleInfo?.tenantId; + } + } + //TODO: fix tenant id from userinfo + const tenantId = + user?.info?.type === "EMPLOYEE" && user?.info?.tenantId ? user?.info?.tenantId : window?.globalConfigs.getConfig("STATE_LEVEL_TENANT_ID"); + return tenantId; + }, + /** + * Custom method to get current environment home / state tenant + * + * @author jagankumar-egov + * + * @example + * Digit.ULBService.getStateId() + * + * @returns {String} + */ + getStateId: () => { + return window?.globalConfigs?.getConfig("STATE_LEVEL_TENANT_ID"); + }, + /** + * Custom method to get employee's current ulb object + * + * @author jagankumar-egov + * + * @example + * Digit.ULBService.getCurrentUlb() + * + * @returns {Object} + */ + getCurrentUlb: () => { + const initData = StoreService.getInitData(); + const tenantId = ULBService.getCurrentTenantId(); + return initData.tenants.find((tenant) => tenant.code === tenantId); + } + /** + * Custom method to get citizen's current selected city + * + * @author jagankumar-egov + * + * @example + * Digit.ULBService.getCitizenCurrentTenant() -> will return selected home city if not loggedin users city if not state tenant + * + * Digit.ULBService.getCitizenCurrentTenant(true) -> will return selected home city + * + * @returns {String} + */, + getCitizenCurrentTenant: (selectedCity=false) => { + const homeCity=Digit.SessionStorage.get("CITIZEN.COMMON.HOME.CITY")?.code; + if(selectedCity){ + return homeCity; + } + return homeCity|| Digit.UserService.getUser()?.info?.permanentCity || ULBService.getStateId(); + }, + /** + * Custom method to get all ulb's which the loggedin employee has access to + * + * + * @example + * Digit.ULBService.getUserUlbs() + * + * @returns {Array} array of objects in the following structure + * + * [ { + * i18nKey:"", + * value:"", + * code:"", + * name:"" + * }] + */ + getUserUlbs: (userRole = "") => { + const stringReplaceAll = (str = "", searcher = "", replaceWith = "") => { + if (searcher == "") return str; + while (str?.includes(searcher)) { + str = str?.replace(searcher, replaceWith); + } + return str; + }; + + const userloggedValues = Digit.SessionStorage.get("citizen.userRequestObject"); + let teantsArray = [], + filteredArray = []; + if (userRole === "") { + userloggedValues?.info?.roles?.forEach((role) => teantsArray.push(role.tenantId)); + let unique = teantsArray.filter((item, i, ar) => ar.indexOf(item) === i); + + unique?.forEach((uniCode) => { + filteredArray.push({ + i18nKey: `TENANT_TENANTS_${stringReplaceAll(uniCode, ".", "_")?.toUpperCase()}`, + value: uniCode, + code: uniCode, + name: uniCode.substring(uniCode.indexOf(".") + 1), + }); + }); + return filteredArray; + } else { + userloggedValues?.info?.roles?.forEach((role) => { + if (userRole === role.code) teantsArray.push(role.tenantId); + }); + let unique = teantsArray.filter((item, i, ar) => ar.indexOf(item) === i); + unique?.forEach((uniCode) => { + filteredArray.push({ + i18nKey: `TENANT_TENANTS_${stringReplaceAll(uniCode, ".", "_")?.toUpperCase()}`, + value: uniCode, + code: uniCode, + name: uniCode.substring(uniCode.indexOf(".") + 1), + }); + }); + return filteredArray; + } + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/getLocalities.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/getLocalities.js new file mode 100644 index 00000000000..84c713e4e48 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/services/molecules/getLocalities.js @@ -0,0 +1,13 @@ +import { LocationService } from "../elements/Location"; +import { StoreService } from "./Store/service"; + +export const getLocalities = { + admin: async (tenant) => { + await StoreService.defaultData(tenant, tenant, Digit.StoreData.getCurrentLanguage()); + return (await LocationService.getLocalities(tenant)).TenantBoundary[0]; + }, + revenue: async (tenant) => { + await StoreService.defaultData(tenant, tenant, Digit.StoreData.getCurrentLanguage()); + return (await LocationService.getRevenueLocalities(tenant)).TenantBoundary[0]; + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/subFormRegistry.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/subFormRegistry.js new file mode 100644 index 00000000000..0ffa4ecd055 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/subFormRegistry.js @@ -0,0 +1,43 @@ +export class SubformRegistry { + constructor(registry = {}) { + this._registry = registry; + } + + getSubform = (key) => this._registry[key]; + + addSubForm = (key, config) => (this._registry[key] = config); + + changeConfig = async (key, callBack) => { + let config = this.getSubform(key); + let newConfig = await callBack(config); + this._registry[key] = newConfig; + }; + + addMiddleware = ( + subFormKey, + middlewareKey, + middlewareFn, + { functionName, preceedingName = "", preceedingIndex = null, exceedingName = "", exceedingIndex = null } + ) => { + let config = this.getSubform(subFormKey); + let { middlewares } = config; + const setPreceedingIndex = (preceedingIndex) => { + let firstChunk = middlewares.splice(0, preceedingIndex + 1); + middlewares = [...firstChunk, { [functionName]: middlewareFn }, ...middlewares]; + }; + + const setExceedingIndex = (exceedingIndex) => { + let firstChunk = middlewares.splice(0, exceedingIndex); + middlewares = [...firstChunk, { [functionName]: middlewareFn }, ...middlewares]; + }; + + if (preceedingIndex) setPreceedingIndex(preceedingIndex); + else if (exceedingIndex) setExceedingIndex(exceedingIndex); + else if (preceedingName) { + let element = middlewares.filter((e) => Object.keys(e)[0] === preceedingName)[0] || null; + } else if (exceedingName) { + } + }; +} + +export const subFormRegistry = new SubformRegistry({}); diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/translations/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/translations/index.js new file mode 100644 index 00000000000..9c54bbea397 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/translations/index.js @@ -0,0 +1,61 @@ +import i18next from "i18next"; +import { initReactI18next } from "react-i18next"; +import ReactPostprocessor from "i18next-react-postprocessor"; + +const i18nextConfig = () => ({ + lng: Digit.StoreData.getCurrentLanguage(), + fallbackLng: Digit.Utils.getDefaultLanguage(), + debug: false, + ns: ["translations"], + defaultNS: "translations", + keySeparator: false, + saveMissing: false, + saveMissingTo: "current", + interpolation: { + escapeValue: false, + formatSeparator: ",", + }, + postProcess: [`reactPostprocessor`, "templatePostprocessor"], + react: { + useSuspense: true, + bindI18n: "loaded", + bindI18nStore: "added", + }, + resources: { + [Digit.Utils.getDefaultLanguage()]: { + translations: { + welcome: "Welcome", + }, + }, + }, +}); + +function replaceLiterals(text = "", dynamicValues = {}) { + let returnText = text; + const regex = /[^\{\{][\{]\w+/; + if (regex.exec(text) !== null) { + Object.keys(dynamicValues).forEach((key) => { + returnText = returnText.replace(`{${key.toUpperCase()}}`, dynamicValues[key]); + }); + } + return returnText; +} + +const templatePostprocessor = { + type: "postProcessor", + name: "templatePostprocessor", + process: function (value, key, options, translator) { + return replaceLiterals(value, options); + }, +}; + +export const initI18n = (callback) => { + return i18next + .use(new ReactPostprocessor()) + .use(templatePostprocessor) + .use(initReactI18next) + .init(i18nextConfig(), () => { + window.i18next = i18next; + callback(); + }); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/browser.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/browser.js new file mode 100644 index 00000000000..56074b71c90 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/browser.js @@ -0,0 +1,35 @@ +const checkWebview = () => { + const ua = navigator.userAgent; + let rules = [ + // if it says it's a webview, let's go with that + "WebView", + // iOS webview will be the same as safari but missing "Safari" + "(iPhone|iPod|iPad)(?!.*Safari)", + // Android Lollipop and Above: webview will be the same as native but it will contain "wv" + // Android KitKat to lollipop webview will put {version}.0.0.0 + "Android.*(wv|.0.0.0)", + // old chrome android webview agent + "Linux; U; Android", + ]; + + const webviewRegExp = new RegExp("(" + rules.join("|") + ")", "ig"); + return !!ua.match(webviewRegExp); +}; + +const mobileCheck = () => { + let check = false; + (function (a) { + if ( + /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test( + a + ) || + /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test( + a.substr(0, 4) + ) + ) + check = true; + })(navigator.userAgent || navigator.vendor || window.opera); + return check; +}; + +export default { isWebview: checkWebview, isMobile: mobileCheck }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/componentRegistry.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/componentRegistry.js new file mode 100644 index 00000000000..8c1a5a2bbec --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/componentRegistry.js @@ -0,0 +1,23 @@ +class ComponentRegistry { + constructor() { + this._registry = {}; + } + + getComponent(id) { + return this._registry[id]; + } + + setComponent(id, component) { + this._registry[id] = component; + return true; + } + + setAllComponents(components) { + Object.entries(components).forEach(([key, value]) => { + this.setComponent(key, value); + }); + return this._registry; + } +} + +export default ComponentRegistry; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/date.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/date.js new file mode 100644 index 00000000000..c6a547946a3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/date.js @@ -0,0 +1,20 @@ +function getDate(timestamp) { + const dt = timestamp ? new Date(timestamp) : new Date(); + let dd = dt.getDate(); + let mm = dt.getMonth() + 1; + var yyyy = dt.getFullYear(); + + if (dd < 10) { + dd = "0" + dd; + } + + if (mm < 10) { + mm = "0" + mm; + } + + return yyyy + "-" + mm + "-" + dd; +} + +const monthNames = ["Jan", "Feb", "March", "Apr", "May", "June", "July", "Aug", "Sep", "Oct", "Nov", "Dec"]; + +export { getDate, monthNames }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/dss/dynamicRequestGenerator.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/dss/dynamicRequestGenerator.js new file mode 100644 index 00000000000..9d5d4b2a820 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/dss/dynamicRequestGenerator.js @@ -0,0 +1,101 @@ +import { Request } from "../../services/atoms/Utils/Request"; +export const getFilterValue = (filter) => { + if (filter?.source?.type == 'request') { + return getRequestFilterValues(filter); + } else if (filter?.source?.type == 'list') { + return getListFilterValues(filter); + } else return; +} + +const getRequestFilterValues = (filter) => { + return new Promise((resolve, reject) => { + try { + let request = getRequestPayload(filter.source); + Request(request).then((res) => { + var jp = require('jsonpath'); + let keys = jp.query(res, filter.source.keyPath); + let values = jp.query(res, filter.source.valuesPath); + let filtersValues = []; + if (keys && values && keys.length && values.length && keys.length == values.length) { + keys.forEach((key, idx) => { + filtersValues.push({'key': key, 'value': values[idx]}) + }) + } + resolve({'id': filter.id, 'values': filtersValues}) + }).catch(err => { + resolve({'id': filter.id, 'values': null}) + }) + } catch (error) { + reject(error); + } + }) +} + +const getListFilterValues = (filter) => { + return new Promise((resolve, reject) => { + let listValue = filter.source.list; + var jp = require('jsonpath'); + let keys = jp.query(listValue, filter.source.keyPath); + let values = jp.query(listValue, filter.source.valuesPath); + let filtersValues = []; + if (keys && values && keys.length && values.length && keys.length == values.length) { + keys.forEach((key, idx) => { + filtersValues.push({'key': key, 'value': values[idx]}) + }) + } + resolve({'id': filter.id, 'values': filtersValues}) + }) +} + +const getRequestPayload = (filterConfig) => { + let request = {}; + request["method"] = filterConfig?.requestMethod ? filterConfig.requestMethod : "POST"; + request["url"] = filterConfig?.hostUrl ? filterConfig.hostUrl + filterConfig.requestUrl : filterConfig.requestUrl; + request["authHeader"] = true; + request["useCache"] = true; + request["userService"] = true; + request["locale"] = true; + if (filterConfig?.requestBody && filterConfig.requestBody.length) { + request["data"] = JSON.parse(filterConfig.requestBody); + } + return request; +} + +export const getParsedRequest = (filterSource, filterValues) => { + var jp = require('jsonpath'); + if (filterSource?.requestUrl && filterSource?.requestUrl.length) { + let replacableList = getReplacableValues(filterSource.requestUrl); + replacableList.forEach((str) => { + let value = jp.query(filterValues, str); + filterSource.requestUrl = filterSource.requestUrl.replace(`{${str}}`, value) + }) + } + if (filterSource?.requestBody && filterSource?.requestBody.length) { + let replacableList = getReplacableValues(filterSource.requestBody); + replacableList.forEach((str) => { + let value = jp.query(filterValues, str); + filterSource.requestBody = filterSource.requestBody.replace(`{${str}}`, value) + }) + } + return filterSource; +} + +const getReplacableValues = (requestString) => { + let replacableValues = []; + let isReplacable = false; + let replacableStr = ""; + for (let idx=0; idx { + const currencyFormatter = new Intl.NumberFormat("en-IN", { currency: "INR" }); + + switch (denomination) { + case "Lac": + return `₹ ${currencyFormatter.format((value / 100000).toFixed(2) || 0)} ${t("ES_DSS_LAC")}`; + case "Cr": + return `₹ ${currencyFormatter.format((value / 10000000).toFixed(2) || 0)} ${t("ES_DSS_CR")}`; + case "Unit": + return `₹ ${currencyFormatter.format(value?.toFixed(2) || 0)}`; + default: + return ""; + } +}; + +export const formatter = (value, symbol, unit, commaSeparated = true, t) => { + if (!value && value !== 0) return ""; + switch (symbol) { + case "amount": + return amountFormatter(value, unit, t); + //this case needs to be removed as backend should handle case sensitiviy from their end + case "Amount": + return amountFormatter(value, unit, t); + case "number": + if (!commaSeparated) { + return parseInt(value); + } + const Nformatter = new Intl.NumberFormat("en-IN"); + return Nformatter.format(value); + case "percentage": + const Pformatter = new Intl.NumberFormat("en-IN", { maximumSignificantDigits: 3 }); + return `${Pformatter.format(value.toFixed(2))} %`; + default: + return ""; + } +}; + +export const getDuration = (startDate, endDate) => { + let noOfDays = (new Date(endDate).getTime() - new Date(startDate).getTime()) / (1000 * 3600 * 24); + if (noOfDays > 91) { + return "month"; + } + if (noOfDays < 90 && noOfDays >= 14) { + return "week"; + } + if (noOfDays <= 14) { + return "day"; + } +}; + +export const getInitialRange = () => { + const startDate = addMonths(startOfYear(new Date()), 3); + const endDate = addMonths(endOfYear(new Date()), 3); + const title = `${format(startDate, "MMM d, yy")} - ${format(endDate, "MMM d, yy")}`; + const duration = Digit.Utils.dss.getDuration(startDate, endDate); + return { startDate, endDate, title, duration }; +}; + +export const getDatesBackFromToday = (numberOfDays) => { + const endDate = endOfDay(new Date()); + const startDate = startOfDay(addDays(new Date(), - (numberOfDays-1))); + const title = `${format(startDate, "MMM d, yy")} - ${format(endDate, "MMM d, yy")}`; + const duration = Digit.Utils.dss.getDuration(startDate, endDate); + return { startDate, endDate, title, duration }; +}; + +export const getDateDiffrenence = (startDate, endDate) => { + return differenceInDays(startDate, endDate); +} + +export const getDefaultFinacialYear = () => { + const currDate = new Date().getMonth(); + if (currDate < 3) { + return { + startDate: subYears(addMonths(startOfYear(new Date()), 3), 1), + endDate: endOfToday(new Date()), + // endDate: subYears(addMonths(endOfYear(new Date()), 3), 1), RAIN-5752 : to keep date till current date and not a financial year + + }; + } else { + return { + startDate: addMonths(startOfYear(new Date()), 3), + endDate: endOfToday(new Date()), +// endDate: addMonths(endOfYear(new Date()), 3), + + }; + } +}; + +/* Used in DSS to get the current module id */ +export const getCurrentModuleName=()=>{ + const allPaths= window.location.pathname.split('/'); + return allPaths[allPaths.length-1]; +} + +/* Used in DSS to get the filtered ulbs for selected city */ +export const checkSelected = (e, selectedDDRs) => { + if (!selectedDDRs || selectedDDRs?.length == 0) { + return true; + } else if (selectedDDRs.find((ddr) => ddr.ddrKey == e.ddrKey)) { + return true; + } else { + return false; + } +}; + + +/* Used in DSS to get the filtered ulbs for selected city for global filter*/ +export const getCitiesAvailable = (e, selectedDDRs) => { + if (!selectedDDRs || selectedDDRs?.length == 0) { + return true; + } else if (selectedDDRs.find((ddr) => ddr == e.ddrKey)) { + return true; + } else { + return false; + } +}; + +export const getCustomFiltersDynamicValues = async (filterConfig, dynamicValues) => { + if (filterConfig && dynamicValues) { + filterConfig = filterConfig.map((filter) => { + if (filter?.source?.type == 'request') { + filter.source = getParsedRequest(filter.source, dynamicValues); + } + return filter; + }) + } + return filterConfig; +} + +export const getFilterOptionsForConfig = async (filterConfig) => { + let filtersData = {}; + if (filterConfig) { + let requests = []; + filterConfig.forEach((filter) => { + if (filter?.source) { + requests.push(getFilterValue(filter)) + } + }) + await Promise.all(requests).then((res) => { + if (res && res.length) { + res.forEach((filterRes) => { + if (filterRes?.id && filterRes?.values) + filtersData[filterRes.id] = filterRes?.values; + }) + } + }); + } + return filtersData; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fileType.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fileType.js new file mode 100644 index 00000000000..1eb15cfa65d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fileType.js @@ -0,0 +1,7 @@ +const getFileTypeFromFileStoreURL = (filestoreURL) => { + if(filestoreURL.includes(".pdf")) return "pdf" + if(filestoreURL.includes(".jpg") || filestoreURL.includes(".jpeg") || filestoreURL.includes(".png") || filestoreURL.includes(".webp")) return "image" + else return "image" +} + +export default getFileTypeFromFileStoreURL \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fonts.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fonts.js new file mode 100644 index 00000000000..da43efdb324 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fonts.js @@ -0,0 +1,2 @@ +export const Fonts = { + }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fsm/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fsm/index.js new file mode 100644 index 00000000000..8f93bafae51 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/fsm/index.js @@ -0,0 +1,94 @@ +export const getPropertyTypeLocale = (value) => { + return `PROPERTYTYPE_MASTERS_${value?.split(".")[0]}`; +}; + +export const getPropertySubtypeLocale = (value) => `PROPERTYTYPE_MASTERS_${value}`; + +export const getVehicleType = (vehicle, t) => { + return (vehicle?.i18nKey && vehicle?.capacity && `${t(vehicle.i18nKey)} - ${vehicle.capacity} ${t("CS_COMMON_CAPACITY_LTRS")}`) || null; +}; + +export const updateConfiguration = ({ config, defaultConfig, detailsConfig, customConfiguration, isDefaultConfig }) => { + const fieldSectionNamesInsideConfig = []; + const detailsConfigCopy = { ...detailsConfig }; + + customConfiguration.forEach((detail) => { + // Adding custom fields to FieldSection fields array (body) + if (detailsConfigCopy[detail.name] && detail.addFields) { + detailsConfigCopy[detail.name].body.push(...detail.addFields); + } + + let body = []; + + // adding fields to body array + if (detail?.fieldsOrder?.length > 0) { + // fields order + detail.fieldsOrder.forEach((fieldName) => { + if (detailsConfigCopy[detail.name]) { + body.push(detailsConfigCopy[detail.name].body.find((value) => value.name === fieldName)); + } + }); + + // adding remaining fields to the body array which are not in detail?.fieldsOrder + if (detail?.allFields) { + detailsConfigCopy[detail.name]?.body?.forEach((field) => { + if (!detail?.fieldsOrder?.includes(field.name)) { + body.push(detailsConfigCopy[detail.name].body.find((value) => value.name === field.name)); + } + }); + } + } else { + body = detailsConfigCopy[detail.name].body; + } + + // remove fields + if (detail?.removeFields) { + detail?.removeFields?.forEach((fieldName) => { + body = body.filter((field) => field.name !== fieldName); + }); + } + + // adding FieldSection to config + if (detailsConfigCopy[detail.name]) { + config.push({ + head: detailsConfigCopy[detail.name].head, + body, + }); + fieldSectionNamesInsideConfig.push(detail.name); + } + }); + + // adding remaining FieldSection to config + if (isDefaultConfig) { + defaultConfig?.forEach((fieldSectionName) => { + if (!fieldSectionNamesInsideConfig.includes(fieldSectionName) && detailsConfigCopy[fieldSectionName]) { + config.push(detailsConfigCopy[fieldSectionName]); + fieldSectionNamesInsideConfig.push(fieldSectionName); + } + }); + } +}; + +// How to use above updateConfiguration function +// let config = []; + +// const defaultConfig = ["applicationDetails", "propertyDetails", "locationDetails", "paymentDetails"]; + +// const { Customizations } = window.Digit; +// let employeeCustomizations = false; + +// if (Customizations?.FSM?.getEmployeeApplicationCustomization) { +// employeeCustomizations = Customizations?.FSM?.getEmployeeApplicationCustomization(defaultConfig, t); +// } + +// if (employeeCustomizations?.config?.length > 0) { +// updateConfiguration({ +// config, +// defaultConfig, +// detailsConfig, +// customConfiguration: employeeCustomizations?.config, +// isDefaultConfig: employeeCustomizations?.defaultConfig, +// }); +// } else { +// defaultConfig.forEach((fieldSectionName) => config.push(detailsConfig[fieldSectionName])); +// } diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/index.js new file mode 100644 index 00000000000..460e4d7d599 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/index.js @@ -0,0 +1,382 @@ +import BrowserUtil from "./browser"; +import * as date from "./date"; +import * as dss from "./dss"; +import * as locale from "./locale"; +import * as obps from "./obps"; +import * as pt from "./pt"; +import * as privacy from "./privacy"; +import PDFUtil, { downloadReceipt ,downloadPDFFromLink,downloadBill ,getFileUrl} from "./pdf"; +import getFileTypeFromFileStoreURL from "./fileType"; +import preProcessMDMSConfig from "./preProcessMDMSConfig"; +import preProcessMDMSConfigInboxSearch from "./preProcessMDMSConfigInboxSearch"; +import * as parsingUtils from "../services/atoms/Utils/ParsingUtils" +const GetParamFromUrl = (key, fallback, search) => { + if (typeof window !== "undefined") { + search = search || window.location.search; + const params = new URLSearchParams(search); + return params.has(key) ? params.get(key) : fallback; + } + return fallback; +}; + +const getPattern = (type) => { + switch (type) { + case "Name": + return /^[^{0-9}^\$\"<>?\\\\~!@#$%^()+={}\[\]*,/_:;“”‘’]{1,50}$/i; + case "SearchOwnerName": + return /^[^{0-9}^\$\"<>?\\\\~!@#$%^()+={}\[\]*,/_:;“”‘’]{3,50}$/i; + case "MobileNo": + return /^[6789][0-9]{9}$/i; + case "Amount": + return /^[0-9]{0,8}$/i; + case "NonZeroAmount": + return /^[1-9][0-9]{0,7}$/i; + case "DecimalNumber": + return /^\d{0,8}(\.\d{1,2})?$/i; + case "Email": + return /^(?=^.{1,64}$)((([^<>()\[\]\\.,;:\s$*@'"]+(\.[^<>()\[\]\\.,;:\s@'"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,})))$/i; + case "Address": + return /^[^\$\"<>?\\\\~`!@$%^()+={}\[\]*:;“”‘’]{1,500}$/i; + case "PAN": + return /^[A-Za-z]{5}\d{4}[A-Za-z]{1}$/i; + case "TradeName": + return /^[-@.\/#&+\w\s]*$/; + case "Date": + return /^[12]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/i; + case "UOMValue": + return /^(0)*[1-9][0-9]{0,5}$/i; + case "OperationalArea": + return /^(0)*[1-9][0-9]{0,6}$/i; + case "NoOfEmp": + return /^(0)*[1-9][0-9]{0,6}$/i; + case "GSTNo": + return /^\d{2}[A-Z]{5}\d{4}[A-Z]{1}\d[Z]{1}[A-Z\d]{1}$/i; + case "DoorHouseNo": + return /^[^\$\"'<>?~`!@$%^={}\[\]*:;“”‘’]{1,50}$/i; + case "BuildingStreet": + return /^[^\$\"'<>?\\\\~`!@$%^()+={}\[\]*.:;“”‘’]{1,64}$/i; + case "Pincode": + return /^[1-9][0-9]{5}$/i; + case "Landline": + return /^[0-9]{11}$/i; + case "PropertyID": + return /^[a-zA-z0-9\s\\/\-]$/i; + case "ElectricityConnNo": + return /^.{1,15}$/i; + case "DocumentNo": + return /^[0-9]{1,15}$/i; + case "eventName": + return /^[^\$\"<>?\\\\~`!@#$%^()+={}\[\]*,.:;“”]{1,65}$/i; + case "eventDescription": + return /^[^\$\"'<>?\\\\~`!@$%^()+={}\[\]*.:;“”‘’]{1,500}$/i; + case "cancelChallan": + return /^[^\$\"'<>?\\\\~`!@$%^()+={}\[\]*.:;“”‘’]{1,100}$/i; + case "FireNOCNo": + return /^[a-zA-Z0-9-]*$/i; + case "consumerNo": + return /^[a-zA-Z0-9/-]*$/i; + case "AadharNo": + return /^([0-9]){12}$/; + case "ChequeNo": + return /^(?!0{6})[0-9]{6}$/; + case "Comments": + return /^[^\$\"'<>?\\\\~`!@$%^()+={}\[\]*.:;“”‘’]{1,50}$/i; + case "OldLicenceNo": + return /^[a-zA-Z0-9-/]{0,64}$/; + case "bankAccountNo": + return /^\d{9,18}$/; + case "IFSC": + return /^[A-Z]{4}0[A-Z0-9]{6}$/; + case "ApplicationNo": + return /^[a-zA-z0-9\s\\/\-]$/i; + } +}; +/* +Digit.Utils.getUnique() +get unique elements from an array */ +const getUnique = (arr) => { + return arr.filter((value, index, self) => self.indexOf(value) === index); +}; + +/* +Digit.Utils.createFunction() +get function from a string */ +const createFunction = (functionAsString) => { + return Function("return " + functionAsString)(); +}; + +const getStaticMapUrl = (latitude, longitude) => { + const key = globalConfigs?.getConfig("GMAPS_API_KEY"); + return `https://maps.googleapis.com/maps/api/staticmap?markers=${latitude},${longitude}&zoom=15&size=400x400&key=${key}&style=element:geometry%7Ccolor:0xf5f5f5&style=element:labels.icon%7Cvisibility:off&style=element:labels.text.fill%7Ccolor:0x616161&style=element:labels.text.stroke%7Ccolor:0xf5f5f5&style=feature:administrative.land_parcel%7Celement:labels.text.fill%7Ccolor:0xbdbdbd&style=feature:poi%7Celement:geometry%7Ccolor:0xeeeeee&style=feature:poi%7Celement:labels.text.fill%7Ccolor:0x757575&style=feature:poi.park%7Celement:geometry%7Ccolor:0xe5e5e5&style=feature:poi.park%7Celement:labels.text.fill%7Ccolor:0x9e9e9e&style=feature:road%7Celement:geometry%7Ccolor:0xffffff&style=feature:road.arterial%7Celement:labels.text.fill%7Ccolor:0x757575&style=feature:road.highway%7Celement:geometry%7Ccolor:0xdadada&style=feature:road.highway%7Celement:labels.text.fill%7Ccolor:0x616161&style=feature:road.local%7Celement:labels.text.fill%7Ccolor:0x9e9e9e&style=feature:transit.line%7Celement:geometry%7Ccolor:0xe5e5e5&style=feature:transit.station%7Celement:geometry%7Ccolor:0xeeeeee&style=feature:water%7Celement:geometry%7Ccolor:0xc9c9c9&style=feature:water%7Celement:labels.text.fill%7Ccolor:0x9e9e9e`; +}; + +/** + * Custom util to get the default region + * + * @author jagankumar-egov + * + * @example + * Digit.Hooks.Utils.getLocaleRegion() + * + * @returns {string} + */ +const getLocaleRegion = () => { + return window?.globalConfigs?.getConfig("LOCALE_REGION") || "IN"; +}; +/** + * Custom util to get the default locale + * + * @author jagankumar-egov + * + * @example + * Digit.Hooks.Utils.getLocaleDefault() + * + * @returns {string} + */ +const getLocaleDefault = () => { + return globalConfigs?.getConfig("LOCALE_DEFAULT") || "en"; +}; + +/** + * Custom util to get the default language + * + * @author jagankumar-egov + * + * @example + * Digit.Hooks.Utils.getDefaultLanguage() + * + * @returns {string} + */ +const getDefaultLanguage = () => { + return `${getLocaleDefault()}_${getLocaleRegion()}`; +}; + +const detectDsoRoute = (pathname) => { + const employeePages = ["search", "inbox", "dso-dashboard", "dso-application-details", "user"]; + + return employeePages.some((url) => pathname.split("/").includes(url)); +}; + +const routeSubscription = (pathname) => { + let classname = "citizen"; + const isEmployeeUrl = detectDsoRoute(pathname); + if (isEmployeeUrl && classname === "citizen") { + return (classname = "employee"); + } else if (!isEmployeeUrl && classname === "employee") { + return (classname = "citizen"); + } +}; + + +/* to check the employee (loggedin user ) has given role */ +const didEmployeeHasRole = (role = "") => { + const tenantId = Digit.ULBService.getCurrentTenantId(); + const userInfo = Digit.UserService.getUser(); + const rolearray = userInfo?.info?.roles.filter((item) => { + if (item.code === role && item.tenantId === tenantId) return true; + }); + return rolearray?.length > 0; +}; + +/* to check the employee (loggedin user ) has given roles */ +const didEmployeeHasAtleastOneRole = (roles = []) => { + return roles.some((role) => didEmployeeHasRole(role)); +}; + +const pgrAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const pgrRoles = ["PGR_LME", "PGR-ADMIN", "CSR", "CEMP", "FEMP", "DGRO", "ULB Operator", "GRO", "GO", "RO", "GA"]; + + const PGR_ACCESS = userRoles?.filter((role) => pgrRoles.includes(role)); + + return PGR_ACCESS?.length > 0; +}; + +const fsmAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const fsmRoles = [ + "FSM_CREATOR_EMP", + "FSM_EDITOR_EMP", + "FSM_VIEW_EMP", + "FSM_REPORT_VIEWER", + "FSM_DASHBOARD_VIEWER", + "FSM_ADMIN", + "FSM_DSO", + "FSM_DRIVER", + "FSM_EMP_FSTPO", + "FSM_COLLECTOR", + ]; + + const FSM_ACCESS = userRoles?.filter((role) => fsmRoles?.includes(role)); + + return FSM_ACCESS?.length > 0; +}; + +const NOCAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + + const NOC_ROLES = [ + "FIRE_NOC_APPROVER" + ] + + const NOC_ACCESS = userRoles?.filter((role) => NOC_ROLES?.includes(role)); + + return NOC_ACCESS?.length > 0; +}; + +const BPAREGAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + + const BPAREG_ROLES = ["BPAREG_APPROVER", "BPAREG_DOC_VERIFIER"]; + + const BPAREG_ACCESS = userRoles?.filter((role) => BPAREG_ROLES?.includes(role)); + + return BPAREG_ACCESS?.length > 0; +}; + +const BPAAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + + const BPA_ROLES = [ + "BPA_VERIFIER", + "CEMP", + "BPA_APPROVER", + "BPA_FIELD_INSPECTOR", + "BPA_NOC_VERIFIER", + "AIRPORT_AUTHORITY_APPROVER", + "FIRE_NOC_APPROVER", + "NOC_DEPT_APPROVER", + "BPA_NOC_VERIFIER", + "BPA_TOWNPLANNER", + "BPA_ENGINEER", + "BPA_BUILDER", + "BPA_STRUCTURALENGINEER", + "BPA_SUPERVISOR", + "BPA_DOC_VERIFIER", + "EMPLOYEE", + ]; + + const BPA_ACCESS = userRoles?.filter((role) => BPA_ROLES?.includes(role)); + + return BPA_ACCESS?.length > 0; +}; + +const ptAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const ptRoles = ["PT_APPROVER", "PT_CEMP", "PT_DOC_VERIFIER", "PT_FIELD_INSPECTOR"]; + + const PT_ACCESS = userRoles?.filter((role) => ptRoles?.includes(role)); + + return PT_ACCESS?.length > 0; +}; + +const tlAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const tlRoles = ["TL_CEMP", "TL_APPROVER", "TL_FIELD_INSPECTOR", "TL_DOC_VERIFIER"]; + + const TL_ACCESS = userRoles?.filter((role) => tlRoles?.includes(role)); + + return TL_ACCESS?.length > 0; +}; + +const mCollectAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const mCollectRoles = ["UC_EMP"]; + + const MCOLLECT_ACCESS = userRoles?.filter((role) => mCollectRoles?.includes(role)); + + return MCOLLECT_ACCESS?.length > 0; +}; + +const receiptsAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles.map((roleData) => roleData?.code); + const receiptsRoles = ["CR_PT"]; + const RECEIPTS_ACCESS = userRoles?.filter((role) => receiptsRoles?.includes(role)); + return RECEIPTS_ACCESS?.length > 0; +}; +const hrmsRoles = ["HRMS_ADMIN"]; +const hrmsAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const HRMS_ACCESS = userRoles?.filter((role) => hrmsRoles?.includes(role)); + return HRMS_ACCESS?.length > 0; +}; + +const wsAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const waterRoles = ["WS_CEMP", "WS_APPROVER", "WS_FIELD_INSPECTOR", "WS_DOC_VERIFIER","WS_CLERK"]; + + const WS_ACCESS = userRoles?.filter((role) => waterRoles?.includes(role)); + + return WS_ACCESS?.length > 0; +}; + +const swAccess = () => { + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + const sewerageRoles = ["SW_CEMP", "SW_APPROVER", "SW_FIELD_INSPECTOR", "SW_DOC_VERIFIER","SW_CLERK"]; + + const SW_ACCESS = userRoles?.filter((role) => sewerageRoles?.includes(role)); + + return SW_ACCESS?.length > 0; +}; + +/* to get the MDMS config module name */ +const getConfigModuleName = () => { + return window?.globalConfigs?.getConfig("UICONFIG_MODULENAME") || "commonUiConfig"; +}; +export default { + pdf: PDFUtil, + createFunction, + downloadReceipt, + downloadBill, + downloadPDFFromLink, + downloadBill, + getFileUrl, + getFileTypeFromFileStoreURL, + browser: BrowserUtil, + locale, + date, + GetParamFromUrl, + getStaticMapUrl, + detectDsoRoute, + routeSubscription, + pgrAccess, + fsmAccess, + BPAREGAccess, + BPAAccess, + dss, + obps, + pt, + ptAccess, + NOCAccess, + mCollectAccess, + receiptsAccess, + didEmployeeHasRole, + didEmployeeHasAtleastOneRole, + hrmsAccess, + getPattern, + hrmsRoles, + getUnique, + tlAccess, + wsAccess, + swAccess, + getConfigModuleName, + preProcessMDMSConfig, + preProcessMDMSConfigInboxSearch, + parsingUtils, + ...privacy, + getDefaultLanguage, + getLocaleDefault, + getLocaleRegion +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/locale.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/locale.js new file mode 100644 index 00000000000..fc21d805373 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/locale.js @@ -0,0 +1,110 @@ +/** + * Custom utils related for all locale related items + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.locale. ** () + * + * + */ + +export const getLocalityCode = (locality, tenantId) => { + if (typeof locality === "string") return locality.includes("_") ? locality : `${tenantId.replace(".", "_").toUpperCase()}_ADMIN_${locality}`; + else if (locality.code) return locality.code.includes("_") ? locality : `${tenantId.replace(".", "_").toUpperCase()}_ADMIN_${locality.code}`; +}; + +export const getRevenueLocalityCode = (locality, tenantId) => { + if (typeof locality === "string") return locality.includes("_") ? locality : `${tenantId.replace(".", "_").toUpperCase()}_REVENUE_${locality}`; + else if (locality.code) return locality.code.includes("_") ? locality : `${tenantId.replace(".", "_").toUpperCase()}_REVENUE_${locality.code}`; +}; + +export const stringReplaceAll = (str = "", searcher = "", replaceWith = "") => { + if (searcher === "") return str; + while (str.includes(searcher)) { + str = str.replace(searcher, replaceWith); + } + return str; +}; + +/* method to check not null if not returns false*/ +export const checkForNotNull = (value = "") => { + return value && value != null && value != undefined && value != "" ? true : false; +}; + +export const convertDotValues = (value = "") => { + return ( + (checkForNotNull(value) && ((value.replaceAll && value.replaceAll(".", "_")) || (value.replace && stringReplaceAll(value, ".", "_")))) || "NA" + ); +}; + +export const convertToLocale = (value = "", key = "") => { + let convertedValue = convertDotValues(value)?.toUpperCase(); + if (convertedValue == "NA") { + return "COMMON_NA"; + } + return `${key}_${convertedValue}`; +}; + +export const getMohallaLocale = (value = "", tenantId = "") => { + let convertedValue = convertDotValues(tenantId); + if (convertedValue == "NA" || !checkForNotNull(value)) { + return "COMMON_NA"; + } + convertedValue = convertedValue.toUpperCase(); + return convertToLocale(value, `${convertedValue}_REVENUE`); +}; + +export const getCityLocale = (value = "") => { + let convertedValue = convertDotValues(value); + if (convertedValue == "NA" || !checkForNotNull(value)) { + return "COMMON_NA"; + } + convertedValue = convertedValue.toUpperCase(); + return convertToLocale(convertedValue, `TENANT_TENANTS`); +}; + +/* to convert the dropdown data to locale data */ +export const convertToLocaleData = (dropdownValues = [], key = "", t) => { + return dropdownValues.map((ele) => { + ele["i18text"] = convertToLocale(ele.code, key); + if (t) { + ele["i18text"] = t(ele["i18text"]); + } + return ele; + }); +}; + +/** + * Custom util to format the code for localisation + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.locale.getTransformedLocale( + * code) + * + * @returns {Array} Returns the Array of object + */ +export const getTransformedLocale = (label) => { + if (typeof label === "number") return label; + label = label?.trim(); + return label && label.toUpperCase().replace(/[.:-\s\/]/g, "_"); +}; + +/** + * Custom util to sort the dropdowns based on Alphabeticaly order by localising the codes + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.locale.sortDropdownNames( + * options, + * optionKey, + * t) + * + * @returns {Array} Returns the Array of object + */ +export const sortDropdownNames = (options = [], optionkey = "i18nKey", t) => { + return options?.sort((a, b) => t(a?.[optionkey])?.localeCompare?.(t(b?.[optionkey]))); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/obps/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/obps/index.js new file mode 100644 index 00000000000..e1da9d150c6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/obps/index.js @@ -0,0 +1,23 @@ +export const calculateRiskType = (riskTypes, plotArea, blocks) => { + const buildingHeight = blocks?.reduce((acc, block) => { + return Math.max(acc, block.building.buildingHeight) + }, Number.NEGATIVE_INFINITY); + + const risk = riskTypes?.find(riskType => { + if (riskType.riskType === "HIGH" && (plotArea > riskType?.fromPlotArea || buildingHeight >= riskType?.fromBuildingHeight)) { + return true; + } + + if (riskType.riskType === "MEDIUM" && ((plotArea >= riskType?.fromPlotArea && plotArea <= riskType?.toPlotArea) || + (buildingHeight >= riskType?.fromBuildingHeight && buildingHeight <= riskType?.toBuildingHeight))) { + return true; + } + + if (riskType?.riskType === "LOW" && plotArea < riskType.toPlotArea && buildingHeight < riskType.toBuildingHeight) { + return true; + } + + return false; + }) + return risk?.riskType; +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pdf.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pdf.js new file mode 100644 index 00000000000..5b7442d1482 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pdf.js @@ -0,0 +1,1083 @@ +import { Fonts } from "./fonts"; + +const pdfMake = require("pdfmake/build/pdfmake.js"); +// const pdfFonts = require("pdfmake/build/vfs_fonts.js"); +// pdfMake.vfs = pdfFonts.pdfMake.vfs; + +let pdfFonts = { + // Roboto: { + // normal: "https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-Regular.ttf", + // bold: "https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.66/fonts/Roboto/Roboto-Medium.ttf" + // }, + Hind: { + normal: "Hind-Regular.ttf", + bold: "Hind-Bold.ttf", + }, + en_IN: { + normal: "Hind-Regular.ttf", + bold: "Hind-Bold.ttf", + }, + pn_IN: { + normal: "BalooPaaji2-Regular.ttf", + bold: "BalooPaaji2-Bold.ttf", + }, + od_IN: { + normal: "BalooBhaina2-Regular.ttf", + bold: "BalooBhaina2-Bold.ttf", + }, + hi_IN: { + normal: "Hind-Regular.ttf", + bold: "Hind-Bold.ttf", + }, +}; +pdfMake.vfs = Fonts; + +pdfMake.fonts = pdfFonts; + +const downloadPDFFileUsingBase64 = (receiptPDF, filename) => { + if ( + window && + window.mSewaApp && + window.mSewaApp.isMsewaApp && + window.mSewaApp.isMsewaApp() && + window.mSewaApp.downloadBase64File && + window.Digit.Utils.browser.isMobile() + ) { + // we are running under webview + receiptPDF.getBase64((data) => { + window.mSewaApp.downloadBase64File(data, filename); + }); + } else { + // we are running in browser + receiptPDF.download(filename); + } +}; + +function getBase64Image(tenantId) { + try { + const img = document.getElementById(`logo-${tenantId}`); + var canvas = document.createElement("canvas"); + canvas.width = img.width; + canvas.height = img.height; + var ctx = canvas.getContext("2d"); + ctx.drawImage(img, 0, 0); + return canvas.toDataURL("image/png"); + } catch (e) { + return ""; + } +} + +const defaultLogo = + "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABBtJREFUWAntV11oVEcUnjN3mzXm111toQ8lWOtLTbIG0YgpMdQ05CEv0iTU1hhR7EMRWYuKSkteVExJBRGkpaUk0ChRSYtpKam4sbE0ia7RSNaS0uIfWtT4E8Xs5u7O8Vy7c3f27t2fh4W+ZF7OmfN9c86Ze2bOvZex/3mAGv/RIU9xJCL2IWIdAS7C/Nyhtbm8l39XeVKfOrLcHZoOHmCA7zJkC6VdSmAQRoYBAHbCXZBzED726xKT0kwgGnyUgpdI0JBEEMD4B+4dV3pU+9Mvyl4NMTZKAV5X7cl0APC5P127BqBNqBwuJ5Gw2G8NbmDIGEcQR+9/u6pAcg0ZYtiRaXCDT75rHnT0bjF0dZgJkLP3VEDVEakcj58ti7MBJOWrPFUHJurUuaGbCVCd5llBdQ4Yw7GnUaM9Fal4JjptJCGGmQA964upnPBXHCYOTSciDMGcp1qnYpzBBXVu6LEEGHxOByViJURJX7m2+W+qmKax3cn4Kk/qdJgnnXOdHXIupZnA/B1jw5TP+wzgngSpLEhX6ahLy/dKm5Su7WODBK4l/I60JZPkJ0DcuvxPLvxr5ZjXUAL45crchxD00A12OR3apTyv/67E7CQerndOztwto9uymPI1N2RwOcMwgBYorigah5qBsN36WVtCCZI9kqqu8Td0DG2mhlJKdb8JGvQOrV86YMevPDZagjpuQoFLqPY3gDtOjawvH7TjZpRAZeelesHwON3jQtUJtej2kdalu1RbZZe/QSB0U6L5ph0AObB9wy0Vn5m2qJI2geWd19yI09eo8SywLjbmdMgaRjZ4+gx9RffV13BGD1BXNV5kCYMzrW641dOvAnGnVgVMHYLUPu2DGxxk4iPJFeFwfbLgL7lcfCi5UqZNgK7WIkm2k4AxHARLyaUSJuBpE6AtBuwCmzaAGM5Tc6neMW7UQdoEcnOdv9Cpv24GjFNAAPCvpalwTuFP1J5vy7kqqRtGOGjfqDZDT5vAQNPbzzTgzQmOAWZotXe4xXNeOj3T9OYTjUMzHU1Le4YQImwdaimndh8/0t4CSV/T83fR1PRUI9W8lALc4jla3x/ryv6UuCqrvh+bp+t6IwL81weQn6abMqFyZnX5BDIugVyQifT52hxD7HyVAFFKb8nreVg46K354bHd2qwn0H6u9i0dI9S2scIMSN8YHHDjnmrfz6YtqmQ1gZ7xxpyJ+5MX6ROYDqplADzPAc2zs/rXv1Qk7TVUyen0iclHDbbBjYWIc3UR3mb1kdUEQGC5NYA6p1dzAp7VBKjulgakhjf+sqwNKoNOGO8i9Uxz8H6KEkzKAvzRimX1Cex+58w/9O2/nT4S4v7/jKDUyo/vrfZ1WxPI6i2Qzvf/VrtKRMJbKewSeiI3aJcn96w++53EVfkCw79XQZYr/EsAAAAASUVORK5CYII="; +const jsPdfGenerator = async ({ breakPageLimit = null, tenantId, logo, name, email, phoneNumber, heading, details, t = (text) => text }) => { + + const emailLeftMargin = + email.length <= 15 + ? 190 + : email.length <= 20 + ? 150 + : email.length <= 25 + ? 130 + : email.length <= 30 + ? 90 + : email.length <= 35 + ? 50 + : email.length <= 40 + ? 10 + : email.length <= 45 + ? 0 + : email.length <= 50 + ? -20 + : email.length <= 55 + ? -70 + : email.length <= 60 + ? -100 + : -60; + + const dd = { + pageMargins: [40, 80, 40, 30], + header: { + columns: [ + { + image: logo || getBase64Image(tenantId) || defaultLogo, + width: 50, + margin: [10, 10], + }, + { + text: name, + margin: [20, 25], + font: "Hind", + fontSize: 14, + bold: true, + }, + { + text: email, + margin: [emailLeftMargin, 25, 0, 25], + font: "Hind", + fontSize: 11, + color: "#464747", + }, + { + text: phoneNumber, + color: "#6f777c", + font: "Hind", + fontSize: 11, + margin: [-65, 45, 0, 25], + }, + ], + }, + + footer: function (currentPage, pageCount) { + return { + columns: [ + { text: `${name} / ${heading}`, margin: [15, 0, 0, 0], fontSize: 11, color: "#6f777c", width: 400, font: "Hind" }, + { text: `Page ${currentPage}`, alignment: "right", margin: [0, 0, 25, 0], fontSize: 11, color: "#6f777c", font: "Hind" }, + ], + }; + }, + content: [ + { + text: heading, + font: "Hind", + fontSize: 24, + bold: true, + margin: [-25, 5, 0, 0], + }, + ...createContent(details, phoneNumber, breakPageLimit), + { + text: t("PDF_SYSTEM_GENERATED_ACKNOWLEDGEMENT"), + font: "Hind", + fontSize: 11, + color: "#6f777c", + margin: [-25, 32], + }, + ], + defaultStyle: { + font: "Hind", + }, + }; + pdfMake.vfs = Fonts; + let locale = Digit.SessionStorage.get("locale") || Digit.Utils.getDefaultLanguage(); + let Hind = pdfFonts[locale] || pdfFonts["Hind"]; + pdfMake.fonts = { Hind: { ...Hind } }; + const generatedPDF = pdfMake.createPdf(dd); + downloadPDFFileUsingBase64(generatedPDF, "acknowledgement.pdf"); +}; + + +/** + * Util function that can be used + * to download WS connection acknowledgement pdfs + * Data is passed to this function from this file + * packages\modules\ws\src\utils\getWSAcknowledgementData.js + * @author nipunarora-egov + * + * @example + * Digit.Utils.pdf.generatev1() + * + * @returns Downloads a pdf + */ +const jsPdfGeneratorv1 = async ({ breakPageLimit = null, tenantId, logo, name, email, phoneNumber, heading, details, headerDetails, t = (text) => text }) => { + const emailLeftMargin = + email.length <= 15 + ? 190 + : email.length <= 20 + ? 150 + : email.length <= 25 + ? 130 + : email.length <= 30 + ? 90 + : email.length <= 35 + ? 50 + : email.length <= 40 + ? 10 + : email.length <= 45 + ? 0 + : email.length <= 50 + ? -20 + : email.length <= 55 + ? -70 + : email.length <= 60 + ? -100 + : -60; + + const dd = { + pageMargins: [40, 40, 40, 30], + header: {}, + footer: function (currentPage, pageCount) { + return { + columns: [ + { text: `${name} / ${heading}`, margin: [15, 0, 0, 0], fontSize: 11, color: "#6f777c", width: 400, font: "Hind" }, + { text: `Page ${currentPage}`, alignment: "right", margin: [0, 0, 25, 0], fontSize: 11, color: "#6f777c", font: "Hind" }, + ], + }; + }, + content: [ + ...createHeader(headerDetails,logo,tenantId), + // { + // text: heading, + // font: "Hind", + // fontSize: 24, + // bold: true, + // margin: [-25, 5, 0, 0], + // }, + ...createContentDetails(details), + { + text: t("PDF_SYSTEM_GENERATED_ACKNOWLEDGEMENT"), + font: "Hind", + fontSize: 11, + color: "#6f777c", + margin: [-25, 32], + }, + ], + defaultStyle: { + font: "Hind", + }, + }; + + pdfMake.vfs = Fonts; + let locale = Digit.SessionStorage.get("locale") || Digit.Utils.getDefaultLanguage(); + let Hind = pdfFonts[locale] || pdfFonts["Hind"]; + pdfMake.fonts = { Hind: { ...Hind } }; + const generatedPDF = pdfMake.createPdf(dd); + downloadPDFFileUsingBase64(generatedPDF, "acknowledgement.pdf"); +}; + +export default { generate: jsPdfGenerator ,generatev1:jsPdfGeneratorv1}; + +const createBodyContentBillAmend = (table,t) => { + let bodyData = [] + bodyData.push({ + text: t(table?.title), + color: "#F47738", + style: "header", + fontSize: 14, + bold: true, + margin: [0, 15, 0, 10] + }) + bodyData.push({ + layout:{ + fillColor:function(rowIndex,node,columnIndex){ + if(rowIndex === (table?.tableRows?.length)) { + return "#F47738" + } + return (rowIndex % 2 === 0) ? "#F47738" : null; + }, + fillOpacity:function(rowIndex,node,columnIndex) { + if (rowIndex === (table?.tableRows?.length)) { + return 1; + } + return (rowIndex % 2 === 0) ? 0.15 : 1; + } + }, + table:{ + headerRows:1, + widths: ["*", "*", "*", "*"], + body:[ + table?.headers?.map(header =>{ + return { + text:t(header), + style:"header", + fontSize:11, + bold:true, + border: [false, false, false, false] + } + }), + ...table?.tableRows?.map(row => { + return [ + { + text:t(row?.[0]), + style:"header", + fontSize:11, + border: [false, false, false, false] + }, + { + text: t(row?.[1]), + style: "header", + fontSize: 11, + border: [false, false, false, false] + }, + { + text: t(row?.[2]), + style: "header", + fontSize: 11, + border: [false, false, false, false] + }, + { + text: t(row?.[3]), + style: "header", + fontSize: 11, + border: [false, false, false, false] + } + ] + }) + ] + } + }) + return bodyData +} + +const createHeaderBillAmend = (headerDetails, logo, tenantId,t) => { + + let headerData = []; + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + margin: [-40, -40, -40, 40], + table: { + widths: ['5%', 'auto', '*'], + body: [ + [ + { + image: logo || getBase64Image(tenantId) || defaultLogo, + // width: 50, + margin: [10, 10], + fit: [50, 50], + //width: 50, + //margin: [10, 10] + }, + { + text: headerDetails?.header, //"Amritsar Municipal Corporation", + margin: [40, 10, 2, 4], + style: "header", + // italics: true, + fontSize: 18, + bold: true + }, + { + text: headerDetails?.typeOfApplication, //"New Sewerage Connection", + bold: true, + fontSize: 16, + alignment: "right", + margin: [-40, 10, 2, 0], + color: "#F47738" + } + ], + [ + { text: "" }, + { + text: headerDetails?.subHeader, //"Municipal Corporation Amritsar, Town Hall, Amritsar, Punjab.", + margin: [40, -45, -2, -5], + style: "header", + // italics: true, + fontSize: 10, + bold: true + }, + + { + text: headerDetails?.date, //"28/03/2022", + bold: true, + fontSize: 16, + margin: [0, -45, 10, 0], + alignment: "right", + color: "#F47738" + } + ], + [ + { text: "" }, + + { + text: headerDetails?.description, //"0183-2545155 | www.amritsarcorp.com | cmcasr@gmail.com", + margin: [40, -40, 2, 10], + style: "header", + // italics: true, + fontSize: 10, + bold: true + }, + { + text: "", + } + ] + ] + } + }); + headerDetails?.values?.forEach((header, index) => { + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + margin: [-40, -40, -40, 20], + table: { + widths: ['30%', '*'], + body: [ + [ + { + text: header?.title, + margin: index == 0 ? [40, 0, 2, 10] : [40, 10, 2, 10], + style: "header", + fontSize: 10, + bold: true + }, + { + text: header?.value, + bold: true, + fontSize: 10, + alignment: "left", + margin: index == 0 ? [0, 0, 2, 10] : [0, 10, 2, 10], + } + ] + ] + } + }) + }) + //push demand revision details old way + + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + margin: [-40, -25, -1000000, 20], + table: { + widths: ['30%', '*'], + body: [ + [ + { + text: headerDetails?.DemandRevision?.title, + margin: [40, 0, 2, 20], + style: "header", + fontSize: 13, + bold: true + } + ] + ] + } + }) + + headerDetails?.DemandRevision?.values?.forEach((header, index) => { + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + margin: [-40, -40, -40, 20], + table: { + widths: ['30%', '*'], + body: [ + [ + { + text: header?.title, + margin: index == 0 ? [40, 0, 2, 10] : [40, 10, 2, 10], + style: "header", + fontSize: 10, + bold: true + }, + { + text: header?.value, + bold: false, + fontSize: 10, + alignment: "left", + margin: index == 0 ? [0, 0, 2, 10] : [0, 10, 2, 10], + } + ] + ] + } + }) + }) + + //attachment details + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + margin: [-40, -25, -1000000, 20], + table: { + widths: ['30%', '*'], + body: [ + [ + { + text: headerDetails?.Attachments?.title, + margin: [40, 0, 2, 110], + style: "header", + fontSize: 13, + bold: true + } + ] + ] + } + }) + + headerData.push({ + layout: "noBorders", + ul: headerDetails?.Attachments?.values, + margin:[0,-130,0,40] + }) + + return headerData; +} + +const createBodyContent = (details) => { + let detailsHeaders = [] + details.map((table,index) =>{ + if (table?.isAttachments && table.values) { + detailsHeaders.push({ + style: 'tableExample', + layout: "noBorders", + margin: [0, 13, 0, 5], + table: { + body: [ + [ + { + text: table?.title, + color: "#F47738", + style: "header", + fontSize: 14, + bold: true + } + ] + ] + } + }) + detailsHeaders.push({ + layout:'noBorders', + ul: table?.values + }) + return + } + detailsHeaders.push({ + layout:'noBorders', + table:{ + headerRows:1, + widths:["*","*","*"], + body:[ + table?.title?.map(t=>{ + return { + text:t, + color: "#F47738", + style: "header", + fontSize: 14, + bold: true, + margin:[0,15,0,0] + } + }), + ...table?.values?.map((value,index) => { + return [ + { + text:value?.val1, + style: "header", + fontSize: 10, + bold: true + }, + { + text: value?.val2, + fontSize: 10 + }, + { + text: value?.val3, + fontSize: 10 + } + ] + }) + ] + } + }) + }) + + return detailsHeaders +} + +function createContentDetails(details) { + let detailsHeaders = []; + details.forEach((detail, index) => { + if (detail?.title) { + detailsHeaders.push({ + style: 'tableExample', + layout: "noBorders", + margin:[0,13,0,5], + table: { + body: [ + [ + { + text: detail?.title, + color: "#F47738", + style: "header", + fontSize: 14, + bold: true + } + ] + ] + } + }) + } + if (detail?.isAttachments && detail.values) { + detailsHeaders.push({ + ul: detail?.values + }) + } else { + detail?.values?.forEach(indData => { + detailsHeaders.push({ + style: 'tableExample', + layout: "noBorders", + table: { + widths: ['40%', '*'], + body: [ + [ + { + text: indData?.title, + style: "header", + fontSize: 10, + bold: true + }, + + { + text: indData?.value, + fontSize: 10 + } + ] + ] + } + }) + }) + } + }); + return detailsHeaders; +} + +function createHeader(headerDetails,logo,tenantId) { + let headerData = []; + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + "margin": [-40, -40, -40, 40], + table: { + widths: ['5%', 'auto', '*'], + body: [ + [ + // { + // margin: [40, 10, 2, 2], + // "image": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABBtJREFUWAntV11oVEcUnjN3mzXm111toQ8lWOtLTbIG0YgpMdQ05CEv0iTU1hhR7EMRWYuKSkteVExJBRGkpaUk0ChRSYtpKam4sbE0ia7RSNaS0uIfWtT4E8Xs5u7O8Vy7c3f27t2fh4W+ZF7OmfN9c86Ze2bOvZex/3mAGv/RIU9xJCL2IWIdAS7C/Nyhtbm8l39XeVKfOrLcHZoOHmCA7zJkC6VdSmAQRoYBAHbCXZBzED726xKT0kwgGnyUgpdI0JBEEMD4B+4dV3pU+9Mvyl4NMTZKAV5X7cl0APC5P127BqBNqBwuJ5Gw2G8NbmDIGEcQR+9/u6pAcg0ZYtiRaXCDT75rHnT0bjF0dZgJkLP3VEDVEakcj58ti7MBJOWrPFUHJurUuaGbCVCd5llBdQ4Yw7GnUaM9Fal4JjptJCGGmQA964upnPBXHCYOTSciDMGcp1qnYpzBBXVu6LEEGHxOByViJURJX7m2+W+qmKax3cn4Kk/qdJgnnXOdHXIupZnA/B1jw5TP+wzgngSpLEhX6ahLy/dKm5Su7WODBK4l/I60JZPkJ0DcuvxPLvxr5ZjXUAL45crchxD00A12OR3apTyv/67E7CQerndOztwto9uymPI1N2RwOcMwgBYorigah5qBsN36WVtCCZI9kqqu8Td0DG2mhlJKdb8JGvQOrV86YMevPDZagjpuQoFLqPY3gDtOjawvH7TjZpRAZeelesHwON3jQtUJtej2kdalu1RbZZe/QSB0U6L5ph0AObB9wy0Vn5m2qJI2geWd19yI09eo8SywLjbmdMgaRjZ4+gx9RffV13BGD1BXNV5kCYMzrW641dOvAnGnVgVMHYLUPu2DGxxk4iPJFeFwfbLgL7lcfCi5UqZNgK7WIkm2k4AxHARLyaUSJuBpE6AtBuwCmzaAGM5Tc6neMW7UQdoEcnOdv9Cpv24GjFNAAPCvpalwTuFP1J5vy7kqqRtGOGjfqDZDT5vAQNPbzzTgzQmOAWZotXe4xXNeOj3T9OYTjUMzHU1Le4YQImwdaimndh8/0t4CSV/T83fR1PRUI9W8lALc4jla3x/ryv6UuCqrvh+bp+t6IwL81weQn6abMqFyZnX5BDIugVyQifT52hxD7HyVAFFKb8nreVg46K354bHd2qwn0H6u9i0dI9S2scIMSN8YHHDjnmrfz6YtqmQ1gZ7xxpyJ+5MX6ROYDqplADzPAc2zs/rXv1Qk7TVUyen0iclHDbbBjYWIc3UR3mb1kdUEQGC5NYA6p1dzAp7VBKjulgakhjf+sqwNKoNOGO8i9Uxz8H6KEkzKAvzRimX1Cex+58w/9O2/nT4S4v7/jKDUyo/vrfZ1WxPI6i2Qzvf/VrtKRMJbKewSeiI3aJcn96w++53EVfkCw79XQZYr/EsAAAAASUVORK5CYII=" + // }, + { + image: logo || getBase64Image(tenantId) || defaultLogo, + // width: 50, + margin: [10, 10], + fit: [50,50], + //width: 50, + //margin: [10, 10] + }, + { + text: headerDetails?.[0]?.header, //"Amritsar Municipal Corporation", + margin: [40, 10, 2, 4], + style: "header", + // italics: true, + fontSize: 18, + bold: true + }, + { + text: headerDetails?.[0]?.typeOfApplication, //"New Sewerage Connection", + bold: true, + fontSize: 16, + alignment: "right", + margin: [-40, 10, 2, 0], + color: "#F47738" + } + ], + [ + { text: "" }, + { + text: headerDetails?.[0]?.subHeader, //"Municipal Corporation Amritsar, Town Hall, Amritsar, Punjab.", + margin: [40, -45, -2, -5], + style: "header", + // italics: true, + fontSize: 10, + bold: true + }, + + { + text: headerDetails?.[0]?.date, //"28/03/2022", + bold: true, + fontSize: 16, + margin: [0, -50, 10, 0], + alignment: "right", + color: "#F47738" + } + ], + [ + { text: "" }, + + { + text: headerDetails?.[0]?.description, //"0183-2545155 | www.amritsarcorp.com | cmcasr@gmail.com", + margin: [40, -40, 2, 10], + style: "header", + // italics: true, + fontSize: 10, + bold: true + }, + { + text: "", + } + ] + ] + } + }); + headerDetails?.[0]?.values?.forEach((header, index) => { + headerData.push({ + style: 'tableExample', + layout: "noBorders", + fillColor: "#f7e0d4", + "margin": [-40, -40, -40, 20], + table: { + widths: ['30%', '*'], + body: [ + [ + { + text: header?.title, + margin: index == 0 ? [40, 0, 2, 10] : [40, 10, 2, 10], + style: "header", + fontSize: 10, + bold: true + }, + { + text: header?.value, + bold: true, + fontSize: 10, + alignment: "left", + margin: index == 0 ? [0, 0, 2, 10] : [0, 10, 2, 10], + } + ] + ] + } + }) + }) + + return headerData; +} + + +function createContent(details, phoneNumber, breakPageLimit = null) { + const data = []; + + details.forEach((detail, index) => { + if (detail?.values?.length > 0) { + let column1 = []; + let column2 = []; + + if ( breakPageLimit ? (index + 1) % breakPageLimit === 0 : (index + 1) % 7 === 0) { + data.push({ + text: "", + margin: [-25, 0, 0, 200], + }); + } + + data.push({ + text: `${detail.title}`, + font: "Hind", + fontSize: 18, + bold: true, + margin: [-25, 20, 0, 20], + }); + + const newArray = []; + let count = 0; + let arrayNumber = 0; + + detail.values.forEach((value, index) => { + if (count <= 3) { + if (!newArray[arrayNumber]) { + newArray[arrayNumber] = []; + } + if (value) { + newArray[arrayNumber].push(value); + } + count++; + } + if (count === 4) { + count = 0; + arrayNumber++; + } + }); + + newArray.forEach((value) => { + if (value?.length === 2) { + createContentForDetailsWithLengthOfTwo(value, data, column1, column2, detail.values.length > 3 ? 10 : 0); + } else if (value?.length === 1 || value?.length === 3) { + createContentForDetailsWithLengthOfOneAndThree(value, data, column1, column2, detail.values.length > 3 ? 10 : 0); + } else { + value.forEach((value, index) => { + let margin = [-25, 0, 0, 5]; + if (index === 1) margin = [15, 0, 0, 5]; + if (index === 2) margin = [26, 0, 0, 5]; + if (index === 3) margin = [30, 0, 0, 5]; + column1.push({ + text: value.title, + font: "Hind", + fontSize: 11, + bold: true, + margin, + }); + if (index === 1) margin = [15, 0, 0, 10]; + if (index === 2) margin = [26, 0, 0, 10]; + if (index === 3) margin = [30, 0, 0, 10]; + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + margin, + color: "#1a1a1a", + width: "25%", + }); + }); + data.push({ columns: column1 }); + data.push({ columns: column2 }); + column1 = []; + column2 = []; + } + }); + } + }); + + return data; +} + +function createContentForDetailsWithLengthOfTwo(values, data, column1, column2, num = 0) { + values.forEach((value, index) => { + if (index === 0) { + column1.push({ + text: value.title, + font: "Hind", + fontSize: 12, + bold: true, + margin: [-25, num - 10, -25, 0], + }); + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + margin: [-25, 5, 0, 0], + color: "#1a1a1a", + width: "25%", + }); + } else { + column1.push({ + text: value.title, + font: "Hind", + fontSize: 12, + bold: true, + margin: [-115, num - 10, -115, 0], + }); + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + margin: [15, 5, 0, 0], + color: "#1a1a1a", + width: "25%", + }); + } + }); + data.push({ columns: column1 }); + data.push({ columns: column2 }); +} + +function createContentForDetailsWithLengthOfOneAndThree(values, data, column1, column2, num = 0) { + values.forEach((value, index) => { + if (index === 0) { + column1.push({ + text: value.title, + font: "Hind", + fontSize: 12, + bold: true, + margin: values.length > 1 ? [-25, -5, 0, 0] : [-25, 0, 0, 0], + }); + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + color: "#1a1a1a", + margin: values.length > 1 ? [-25, 5, 0, 0] : [-25, 5, 0, 0], + width: "25%", + }); + } else if (index === 2) { + column1.push({ + text: value.title, + font: "Hind", + fontSize: 12, + bold: true, + margin: [-60, -5, 0, 0], + }); + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + margin: [26, 5, 0, 0], + color: "#1a1a1a", + width: "25%", + }); + } else { + column1.push({ + text: value.title, + font: "Hind", + fontSize: 12, + bold: true, + margin: [-28, -5, 0, 0], + }); + column2.push({ + text: value.value, + font: "Hind", + fontSize: 9, + margin: [15, 5, 0, 0], + color: "#1a1a1a", + width: "25%", + }); + } + }); + data.push({ columns: column1 }); + data.push({ columns: column2 }); +} + +// EXAMPLE +// , + +const downloadPdf = (blob, fileName) => { + if (window.mSewaApp && window.mSewaApp.isMsewaApp() && window.mSewaApp.downloadBase64File) { + var reader = new FileReader(); + reader.readAsDataURL(blob); + reader.onloadend = function () { + var base64data = reader.result; + window.mSewaApp.downloadBase64File(base64data, fileName); + }; + } else { + const link = document.createElement("a"); + // create a blobURI pointing to our Blob + link.href = URL.createObjectURL(blob); + link.download = fileName; + // some browser needs the anchor to be in the doc + document.body.append(link); + link.click(); + link.remove(); + // in case the Blob uses a lot of memory + setTimeout(() => URL.revokeObjectURL(link.href), 7000); + } +}; + +/* Download Receipts */ + +export const downloadReceipt = async ( + consumerCode, + businessService, + pdfKey = "consolidatedreceipt", + tenantId = Digit.ULBService.getCurrentTenantId(), + receiptNumber = null +) => { + const response = await Digit.ReceiptsService.receipt_download(businessService, consumerCode, tenantId, pdfKey, receiptNumber); + const responseStatus = parseInt(response.status, 10); + if (responseStatus === 201 || responseStatus === 200) { + let filename = receiptNumber ? `receiptNumber-${receiptNumber}.pdf` : `consumer-${consumerCode}.pdf`; + downloadPdf(new Blob([response.data], { type: "application/pdf" }), filename); + } +}; +/* Download Bills */ + +export const downloadBill = async ( + consumerCode, + businessService, + pdfKey = "consolidatedbill", + tenantId = Digit.ULBService.getCurrentTenantId(), +) => { + const response = await Digit.ReceiptsService.bill_download(businessService, consumerCode, tenantId, pdfKey); + const responseStatus = parseInt(response.status, 10); + if (responseStatus === 201 || responseStatus === 200) { + let filename = consumerCode ? `consumerCode-${consumerCode}.pdf` : `consumer-${consumerCode}.pdf`; + downloadPdf(new Blob([response.data], { type: "application/pdf" }), filename); + } +}; + +export const getFileUrl = (linkText = "") => { + const linkList = (linkText && typeof linkText == "string" && linkText.split(",")) || []; + let fileURL = ""; + linkList && + linkList.map((link) => { + if (!link.includes("large") && !link.includes("medium") && !link.includes("small")) { + fileURL = link; + } + }); + return fileURL; +}; + +/* Use this util function to download the file from any s3 links */ +export const downloadPDFFromLink = async (link, openIn = "_blank") => { + var response = await fetch(link, { + responseType: "arraybuffer", + headers: { + "Content-Type": "application/json", + Accept: "application/pdf", + }, + method: "GET", + mode: "cors", + }).then((res) => res.blob()); + if (window.mSewaApp && window.mSewaApp.isMsewaApp() && window.mSewaApp.downloadBase64File) { + var reader = new FileReader(); + reader.readAsDataURL(response); + reader.onloadend = function () { + var base64data = reader.result; + window.mSewaApp.downloadBase64File(base64data, decodeURIComponent(link.split("?")[0].split("/").pop().slice(13))); + }; + } else { + var a = document.createElement("a"); + document.body.appendChild(a); + a.style = "display: none"; + let url = window.URL.createObjectURL(response); + a.href = url; + a.download = decodeURIComponent(link.split("?")[0].split("/").pop().slice(13)); + a.click(); + window.URL.revokeObjectURL(url); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfig.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfig.js new file mode 100644 index 00000000000..5d3aa0742a9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfig.js @@ -0,0 +1,128 @@ + +import _ from "lodash"; + +/* +PRE-PROCESS MDMS CONFIG +----------------------- +@Author - Hariom Sinha + +Usually FormComposer configs needs some dependendent params to drive the rendering and functionality. In MDMS config, we cannot inject those params. +So, this component is developed to help convert any MDMS config to a FormComposer enabled config by injecting multiple params. +As of now, two params are introduced - + a. translate + b. updateDependent + c. convertStringToRegEx + Based on the newer requirement, this utility can be enhanced to support extra types of params. + +How to use this Pre-Process Utility - +1. Fetch any config from MDMS. +2. In each input object of the config, set preProcess object with required Params. + ex - + { + isMandatory: false, + key: "noSubProject_locality", + type: "radioordropdown", + label: "WORKS_LOCALITY", + disable: false, + preProcess : { + translate : ["populators.error"], + updateDependent : ["populators.options"] + }, + populators: { + name: "noSubProject_locality", + optionsKey: "i18nKey", + error: "WORKS_REQUIRED_ERR", + required: false, + optionsCustomStyle : { + top : "2.5rem" + }, + options: [] + }, + }, +3. Both 'translate' and 'updateDependent' supports multiple JSON paths. This means that we can inject multiple params at a time in the same input object. +4. Any component who wants to transform MDMS config to FormComposer config using this Pre-Process Utility should pass the dependencies based on their requirement. + Example, if one needs to update the dropdown value based on other dropdown field change, then the component can pass that Param as state. + The Component should make calls to this config only when the dependent state changes, to avoid performance issues. + + const config = useMemo( + () => Digit.Utils.preProcessMDMSConfig(t, createProjectConfig, { + updateDependent : [ + { + key : 'withSubProject_project_subScheme', + value : [withSubProjectSubSchemeOptions] + } + ] + }), + [withSubProjectSubSchemeOptions]); +5. Translation and convertStringToRegEx will be handled by the Pre-Preprocess on its own. No params are required for this. +*/ + + +const translate = (config, index, inputIndex, t) => { + + let input = config?.form[index].body[inputIndex]; + //iterate all translate keys and handle translation + for(let toTranslate = 0; toTranslate { + let input = config?.form[index].body[inputIndex]; + //iterate all update options keys and add options as params + for(let toUpdate = 0; toUpdatedependent?.key === inputKey)?.[0]?.value?.[toUpdate])); + } + + return config; +} + +const convertStringToRegEx = (config, index, inputIndex) => { + + let input = config?.form[index].body[inputIndex]; + //iterate all translate keys and handle translation + for(let toValidate = 0; toValidate { + //Do not loop preProcess object, to avoid unnecessary 'translate' and 'updateDependent' calls + //To add any new transform object, simply add a new if statement + if(preProcesses?.translate) { + config = translate(config, index, inputIndex, t); + } + if(preProcesses?.updateDependent) { + config = updateDependent(config, index, inputIndex, inputKey, dependencyConfig); + } + if(preProcesses?.convertStringToRegEx) { + config = convertStringToRegEx(config, index, inputIndex, inputKey); + } + return config; +} + +const preProcessMDMSConfig = (t, config, dependencyConfig) => { + config?.form?.map((section, index)=>{ + section?.body?.map((input, inputIndex)=>{ + let preProcesses = input?.preProcess; + if(preProcesses){ + config = transform(preProcesses, config, index, inputIndex, input?.key, t, dependencyConfig); + } + }) + }) + return config; +} + +export default preProcessMDMSConfig; + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfigInboxSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfigInboxSearch.js new file mode 100644 index 00000000000..05743c9347a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/preProcessMDMSConfigInboxSearch.js @@ -0,0 +1,110 @@ + +import _ from "lodash"; + +/* +PRE-PROCESS MDMS CONFIG +----------------------- +@Author - Hariom Sinha + +Usually FormComposer configs needs some dependendent params to drive the rendering and functionality. In MDMS config, we cannot inject those params. +So, this component is developed to help convert any MDMS config to a FormComposer enabled config by injecting multiple params. +As of now, two params are introduced - + a. translate + b. updateDependent + c. convertStringToRegEx + Based on the newer requirement, this utility can be enhanced to support extra types of params. + +How to use this Pre-Process Utility - +1. Fetch any config from MDMS. +2. In each input object of the config, set preProcess object with required Params. + ex - + { + isMandatory: false, + key: "noSubProject_locality", + type: "radioordropdown", + label: "WORKS_LOCALITY", + disable: false, + preProcess : { + translate : ["populators.error"], + updateDependent : ["populators.options"] + }, + populators: { + name: "noSubProject_locality", + optionsKey: "i18nKey", + error: "WORKS_REQUIRED_ERR", + required: false, + optionsCustomStyle : { + top : "2.5rem" + }, + options: [] + }, + }, +3. Both 'translate' and 'updateDependent' supports multiple JSON paths. This means that we can inject multiple params at a time in the same input object. +4. Any component who wants to transform MDMS config to FormComposer config using this Pre-Process Utility should pass the dependencies based on their requirement. + Example, if one needs to update the dropdown value based on other dropdown field change, then the component can pass that Param as state. + The Component should make calls to this config only when the dependent state changes, to avoid performance issues. + + const config = useMemo( + () => Digit.Utils.preProcessMDMSConfig(t, createProjectConfig, { + updateDependent : [ + { + key : 'withSubProject_project_subScheme', + value : [withSubProjectSubSchemeOptions] + } + ] + }), + [withSubProjectSubSchemeOptions]); +5. Translation and convertStringToRegEx will be handled by the Pre-Preprocess on its own. No params are required for this. +*/ + +const convertStringToRegEx = (target) => { + //iterate all translate keys and handle translation + for(let toValidate = 0; toValidate { + //iterate all translate keys and handle translation + for(let toUpdate = 0; toUpdatedependent?.key === inputKey)?.[0]?.value)); + + _.set(target, keyToUpdate, dependentObject); + } + return target; +} + +const transform = (preProcesses, target, inputIndex, inputKey, t, dependencyConfig) => { + //Do not loop preProcess object, to avoid unnecessary 'translate' and 'updateDependent' calls + //To add any new transform object, simply add a new if statement + if(preProcesses?.convertStringToRegEx) { + target = convertStringToRegEx(target); + } + if(preProcesses?.updateDependent) { + target = updateDependent(target, dependencyConfig, inputKey); + } + return target; +} + +const preProcessMDMSConfigInboxSearch = (t, config, jsonpath, dependencyConfig) => { + let targetConfig = _.get(config, jsonpath); + let updatedConfig = []; + //Iterate the entire jsonpath array and push the updated objects in the new res array. + //Set the updated res in place of the targetConfig + targetConfig?.map((target, inputIndex) => { + let preProcesses = target?.preProcess; + updatedConfig.push(transform(preProcesses, target, inputIndex, target?.key, t, dependencyConfig)); + }) + _.set(config, jsonpath, updatedConfig); + return config; +} + +export default preProcessMDMSConfigInboxSearch; + diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/privacy.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/privacy.js new file mode 100644 index 00000000000..ae2d62c50a8 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/privacy.js @@ -0,0 +1,107 @@ +/** + * Contains all utils used for Privacy + * + * @author jagankumar-egov + * + * Feature :: Privacy + */ + +/** + * Custom util to get the privacy object of current screen + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.getPrivacyObject() + * + * @returns {object} Returns the privacy object + */ +export const getPrivacyObject = () => { + const privacyObj = getAllPrivacyObject(); + return privacyObj?.[window.location.pathname] || {}; +}; + +/** + * Custom util to get the complete privacy object. + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.getAllPrivacyObject() + * + * @returns {object} Returns the key value pair of privacy object in every screens + */ +export const getAllPrivacyObject = () => { + return Digit.SessionStorage.get("PRIVACY_OBJECT") || {}; +}; + +/** + * Custom util to update the privacy object. + * + * @author jagankumar-egov + * + * @example + * Digit.Utils.setPrivacyObject({}) + * + */ +export const setPrivacyObject = (updatedPrivacyValue = {}) => { + return Digit.SessionStorage.set("PRIVACY_OBJECT", { ...updatedPrivacyValue }); +}; + +/** + * Main Util to update the privacy + * + * @author jagankumar-egov + * + * Feature :: Privacy + * + * @example + * Digit.Utils.updatePrivacy(uuid, fieldName) + * + * @returns {object} Returns the updated privacy object + */ +export const updatePrivacy = (uuid, fieldName) => { + const privacyObj = Digit.Utils.getAllPrivacyObject(); + const plainRequestFields = + privacyObj?.[window.location.pathname]?.recordId === uuid ? privacyObj?.[window.location.pathname]?.plainRequestFields || [] : []; + const newObj = { + ...privacyObj, + [window.location.pathname]: { recordId: uuid, plainRequestFields: Array.isArray(fieldName) ? [...fieldName, ...plainRequestFields] : [fieldName, ...plainRequestFields] }, + }; + Digit.Utils.setPrivacyObject({ ...newObj }); + return newObj; +}; + +/** + * Core Component Logic for showing the unmask button and for which fields will be controlled by + * mdms -> DataSecurity -> SecurityPolicy.json + * + * @author jagankumar-egov + * + * Feature :: Privacy + * + * @example + * Digit.Utils.checkPrivacy(mdmsObj, privacyDetail) + * + * @returns {boolean} Returns the show or hide in boolean type + */ + +export const checkPrivacy = (mdmsObj, privacyDetail) => { + if (mdmsObj?.attributes?.some((ele) => (ele?.name === privacyDetail?.fieldName || privacyDetail?.fieldName?.includes(ele?.name) )&& ele?.defaultVisibility === "MASKED")) { + return true; + } + const userInfo = Digit.UserService.getUser(); + const userRoles = userInfo?.info?.roles?.map((roleData) => roleData?.code); + if ( + mdmsObj?.roleBasedDecryptionPolicy?.some( + (ele) => + ele?.roles?.some((e) => userRoles?.includes(e)) && + ele?.attributeAccessList?.some( + (ele) => (ele?.attribute === privacyDetail?.fieldName || privacyDetail?.fieldName?.includes(ele?.attribute)) && ele?.firstLevelVisibility === "MASKED" && ele?.secondLevelVisibility === "PLAIN" + ) + ) + ) { + return true; + } + return false; +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pt/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pt/index.js new file mode 100644 index 00000000000..ec8ff0468f6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/libraries/src/utils/pt/index.js @@ -0,0 +1,65 @@ +export const getPropertyTypeLocale = (value) => { + return `PROPERTYTAX_BILLING_SLAB_${value?.split(".")[0]}`; +}; + +export const getPropertySubtypeLocale = (value) => `PROPERTYTAX_BILLING_SLAB_${value}`; + +export const stringReplaceAll = (str = "", searcher = "", replaceWith = "") => { + if (searcher === "") return str; + while (str.includes(searcher)) { + str = str.replace(searcher, replaceWith); + } + return str; +}; + +/* method to check not null if not returns false*/ +export const checkForNotNull = (value = "") => { + return value && value != null && value != undefined && value != "" ? true : false; +}; + +export const convertDotValues = (value = "") => { + return ( + (checkForNotNull(value) && ((value.replaceAll && value.replaceAll(".", "_")) || (value.replace && stringReplaceAll(value, ".", "_")))) || "NA" + ); +}; + +export const convertToLocale = (value = "", key = "") => { + let convertedValue = convertDotValues(value); + if (convertedValue === "NA") { + return "PT_NA"; + } + return `${key}_${convertedValue}`; +}; +export const getMohallaLocale = (value = "", tenantId = "") => { + let convertedValue = convertDotValues(tenantId); + if (convertedValue === "NA" || !checkForNotNull(value)) { + return "PT_NA"; + } + convertedValue = convertedValue.toUpperCase(); + return convertToLocale(value, `${convertedValue}_REVENUE`); +}; + +export const getCityLocale = (value = "") => { + let convertedValue = convertDotValues(value); + if (convertedValue === "NA" || !checkForNotNull(value)) { + return "PT_NA"; + } + convertedValue = convertedValue.toUpperCase(); + return convertToLocale(convertedValue, `TENANT_TENANTS`); +}; + +export const convertDateToEpoch = (dateString, dayStartOrEnd = "dayend") => { + //example input format : "2018-10-02" + try { + const parts = dateString.match(/(\d{4})-(\d{1,2})-(\d{1,2})/); + const DateObj = new Date(Date.UTC(parts[1], parts[2] - 1, parts[3])); + DateObj.setMinutes(DateObj.getMinutes() + DateObj.getTimezoneOffset()); + if (dayStartOrEnd === "dayend") { + DateObj.setHours(DateObj.getHours() + 24); + DateObj.setSeconds(DateObj.getSeconds() - 1); + } + return DateObj.getTime(); + } catch (e) { + return dateString; + } +}; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/README.md b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/README.md new file mode 100644 index 00000000000..dcf4b64180f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/README.md @@ -0,0 +1,77 @@ + + +# digit-ui-module-common + +## Install + +```bash +npm install --save @egovernments/digit-ui-module-common +``` + +## Limitation + +```bash +This Package is more specific to DIGIT-UI's can be used across mission's for Payments +``` + +## Usage + +After adding the dependency make sure you have this dependency in + +```bash +frontend/micro-ui/web/package.json +``` + +```json +"@egovernments/digit-ui-module-common":"^1.5.0", +``` + +then navigate to App.js + +```bash + frontend/micro-ui/web/src/App.js +``` + + +```jsx +/** add this import **/ + +import { paymentConfigs, PaymentLinks, PaymentModule } from "@egovernments/digit-ui-module-common"; + +/** inside enabledModules add this new module key **/ + +const enabledModules = ["Payment"]; + +/** inside init Function call this function **/ + +const initDigitUI = () => { + window?.Digit.ComponentRegistryService.setupRegistry({ + PaymentModule, + ...paymentConfigs, + PaymentLinks, + }); +}; +``` + +# Changelog + +```bash +1.8.0-beta workbench base version beta release +1.7.0 urban 2.9 +1.6.0 urban 2.8 +1.5.31 updated the readme content +1.5.30 Fixes mannual receipt date range validation, Cheque and card number validation for FSM +1.5.29 version upgraded for fixes in payment modules +1.5.28 base version +``` + +# Contributors + +[jagankumar-egov] [Tulika-eGov] [vamshikrishnakole-wtt-egov] [nabeelmd-eGov] [anil-egov] + +## Published from DIGIT Core +Digit Dev Repo (https://github.com/egovernments/Digit-Core/tree/digit-ui-core) + +## License + +MIT © [jagankumar-egov](https://github.com/jagankumar-egov) \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/package.json b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/package.json new file mode 100644 index 00000000000..d6c652f598e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/package.json @@ -0,0 +1,34 @@ +{ + "name": "@egovernments/digit-ui-module-common", + "version": "1.8.0-beta", + "license": "MIT", + "main": "dist/index.js", + "module": "dist/index.modern.js", + "source": "src/Module.js", + "files": [ + "dist" + ], + "scripts": { + "start": "microbundle-crl watch --no-compress --format modern,cjs", + "build": "microbundle-crl --compress --no-sourcemap --format cjs", + "prepublish": "yarn build" + }, + "dependencies": { + "@egovernments/digit-ui-react-components": "1.5.23", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-hook-form": "6.15.8", + "react-i18next": "11.16.2", + "react-query": "3.6.1", + "react-router-dom": "5.3.0" + }, + "author": "JaganKumar ", + "keywords": [ + "digit", + "egov", + "dpg", + "digit-ui", + "common", + "payment" + ] +} \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/Module.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/Module.js new file mode 100644 index 00000000000..8e922b1cfed --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/Module.js @@ -0,0 +1 @@ +export * from "./payments"; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/index.js new file mode 100644 index 00000000000..695e38ccf3b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/index.js @@ -0,0 +1,3 @@ +import { SubformComposer } from "./subform-composer"; + +export { SubformComposer }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/subform-composer.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/subform-composer.js new file mode 100644 index 00000000000..98dd3df4551 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/subform-composer.js @@ -0,0 +1,72 @@ +import { Card, CardHeader } from "@egovernments/digit-ui-react-components"; +import React, { useCallback, useEffect, useMemo, useState } from "react"; +import { useForm, Controller } from "react-hook-form"; +import { subFormRegistry } from "@egovernments/digit-ui-libraries"; + +export const SubformComposer = ({ _key, ...props }) => { + const config = subFormRegistry._registry[_key]; + const { setValue, setError, control, watch, getValues } = useForm({ shouldFocusError: true }); + const [state, setState] = useState(config?.state); + + const _setState = useCallback((obj) => { + setState((oldState) => ({ ...oldState, ...obj })); + }, []); + + const clearState = useCallback(() => { + setState(config.state); + }, []); + + const formData = watch(); + + useEffect(() => { + (async () => { + props.getSubFormValue(await callMiddlewares(formData)); + })(); + }, [formData]); + + const callMiddlewares = useCallback(async (data) => { + let applyBreak = false; + let itr = -1; + let _break = () => (applyBreak = true); + let _next = async (data) => { + if (!applyBreak && ++itr < config?.middlewares.length) { + let key = Object.keys(config?.middlewares[itr])[0]; + let nextMiddleware = config?.middlewares[itr][key]; + let isAsync = nextMiddleware.constructor.name === "AsyncFunction"; + if (isAsync) return await nextMiddleware(data, _break, _next); + else return nextMiddleware(data, _break, _next); + } else return data; + }; + let ret = await _next(data); + return ret; + }, []); + + const allFields = useMemo(() => (config && [...config?.fields, ...config?.addedFields]) || [], [config]); + + return ( + + + + {_key} + {allFields.map(({ label, component, customProps, defaultValue, name }, index) => { + let _customProps = typeof customProps === "function" ? customProps(state, _setState) : customProps; + let _defaultValue = typeof defaultValue === "function" ? defaultValue(state, _setState) : defaultValue; + return ( +
+ {label &&
{label}
} +
+ component({ ...props, setState: _setState, setValue, setError, state, getValues }, _customProps)} + /> +
+
+ ); + })} +
+ +
+ ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/testForm-config.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/testForm-config.js new file mode 100644 index 00000000000..42c48e5e887 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/hoc/testForm-config.js @@ -0,0 +1,148 @@ +import React from "react"; +import { Dropdown, SearchIconSvg } from "@egovernments/digit-ui-react-components"; + +const middleWare_1 = async (data, _break, _next) => { + data.a = "a"; + return await _next(data); +}; + +const middleWare_2 = async (data, _break, _next) => { + data.b = "b"; + // _break(); + return await _next(data); +}; + +const middleWare_3 = async (data, _break, _next) => { + data.c = "c"; + if (data.b === "b") { + try { + const res = await window.fetch(`https://ifsc.razorpay.com/hdfc0000090`); + if (res.ok) { + const { BANK, BRANCH } = await res.json(); + data.BANKFROMMiddleWare = BANK; + } else alert("Wrong IFSC Code"); + } catch (er) { + alert("Something Went Wrong !"); + } + } + return await _next(data); +}; + +const asyncData = { + a: ["1", "2", "3"], + b: ["4", "5", "6"], + c: ["7", "8", "9"], + j: ["10", "11", "12"], + k: ["22", "45"], + l: ["456"], +}; + +export const testForm = { + addedFields: [], + middlewares: [{ middleWare_1 }, { middleWare_2 }, { middleWare_3 }], + + state: { firstDDoptions: ["a", "b", "c"], secondDDoptions: asyncData.a, thirdDDoptions: ["d", "e", "f"] }, + + fields: [ + { + label: "first", + name: "pehla", + defaultValue: "b", + customProps: (state) => ({ isMendatory: true, option: state.firstDDoptions }), + component: (props, customProps) => ( + { + props.setState({ secondDDoptions: asyncData[d] }); + props.setValue("doosra", ""); + props.onChange(d); + }} + selected={props.value} + {...customProps} + /> + ), + validations: {}, + }, + { + label: "second", + name: "doosra", + customProps: (state) => ({ isMendatory: true, option: state.secondDDoptions }), + defaultValue: (state) => state.secondDDoptions[1], + component: (props, customProps) => ( + { + props.onChange(d); + }} + selected={props.value} + {...customProps} + /> + ), + }, + { + label: "third", + name: "teesra", + customProps: (state) => ({ isMendatory: true, option: state.thirdDDoptions }), + defaultValue: "d", + component: (props, customProps) => ( + { + props.onChange(d); + }} + selected={props.value} + {...customProps} + /> + ), + }, + { + label: "IFSC", + name: "ifsc", + customProps: { + isMendatory: true, + setBankDetailsFromIFSC: async (props) => { + try { + const res = await window.fetch(`https://ifsc.razorpay.com/${props.getValues("ifsc")}`); + if (res.ok) { + const { BANK, BRANCH } = await res.json(); + props.setValue("bank", BANK); + props.setValue("branch", BRANCH); + } else alert("Wrong IFSC Code"); + } catch (er) { + alert("Something Went Wrong !"); + } + }, + }, + defaultValue: "", + component: (props, customProps) => ( +
+ { + props.setState({ ifsc: e.target.value }); + props.onChange(e.target.value); + }} + /> + +
+ ), + }, + { + label: "Bank", + name: "bank", + defaultValue: "d", + component: (props, customProps) => , + }, + { + label: "Branch", + name: "branch", + defaultValue: "d", + component: (props, customProps) => , + }, + ], +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/index.js new file mode 100644 index 00000000000..94de35555cc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/index.js @@ -0,0 +1,64 @@ +import { Loader } from "@egovernments/digit-ui-react-components"; +import React, { useEffect } from "react"; +import { useParams, useHistory, useRouteMatch, useLocation } from "react-router-dom"; +import Routes from "./routes"; +// import { myBillMap } from "./myBillsKeysMap"; + +export const MyBills = ({ stateCode }) => { + const { businessService } = useParams(); + const { tenantId: _tenantId, isDisoconnectFlow } = Digit.Hooks.useQueryParams(); + + const { isLoading: storeLoading, data: store } = Digit.Services.useStore({ + stateCode, + moduleCode: businessService, + language: Digit.StoreData.getCurrentLanguage(), + }); + + const history = useHistory(); + const { url } = useRouteMatch(); + const location = useLocation(); + + const { tenantId } = Digit.UserService.getUser()?.info || location?.state || { tenantId: _tenantId } || {}; + + if (!tenantId && !location?.state?.fromSearchResults) { + history.replace(`/${window?.contextPath}/citizen/login`, { from: url }); + } + + const { isLoading, data } = Digit.Hooks.useFetchCitizenBillsForBuissnessService( + { businessService }, + { refetchOnMount: true, enabled: !location?.state?.fromSearchResults } + ); + const { isLoading: mdmsLoading, data: mdmsBillingData } = Digit.Hooks.useGetPaymentRulesForBusinessServices(tenantId); + + const billsList = data?.Bill || []; + + const getPaymentRestrictionDetails = () => { + const payRestrictiondetails = mdmsBillingData?.MdmsRes?.BillingService?.BusinessService; + let updatedBussinessService = ((businessService === "WS" || businessService === "SW") && isDisoconnectFlow === "true") ? "DISCONNECT" : businessService; + if (payRestrictiondetails?.length) return payRestrictiondetails.filter((e) => e.code == updatedBussinessService)?.[0]||{ + isAdvanceAllowed: false, + isVoucherCreationEnabled: true, + minAmountPayable: 100, + partPaymentAllowed: false, + }; + else + return { + // isAdvanceAllowed: false, + // isVoucherCreationEnabled: true, + // minAmountPayable: 100, + // partPaymentAllowed: true, + }; + }; + + const getProps = () => ({ billsList, paymentRules: getPaymentRestrictionDetails(), businessService }); + + if (mdmsLoading) { + return ; + } + + return ( + + + + ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-summary.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-summary.js new file mode 100644 index 00000000000..9df15ba9231 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-summary.js @@ -0,0 +1,105 @@ +import React, { useState } from "react"; +import { useTranslation } from "react-i18next"; +import ArrearTable from "./arrear-table"; + +const styles = { + buttonStyle: { display: "flex", justifyContent: "flex-end", color: "#f47738" }, + headerStyle: { + marginTop: "10px", + fontSize: "16px", + fontWeight: "700", + lineHeight: "24px", + color: " rgba(11, 12, 12, var(--text-opacity))", + }, +}; + +const ArrearSummary = ({ bill = {} }) => { + const { t } = useTranslation(); + const formatTaxHeaders = (billDetail = {}) => { + let formattedFees = {}; + const { billAccountDetails = [] } = billDetail; + billAccountDetails.map((taxHead) => { + formattedFees[taxHead.taxHeadCode] = { value: taxHead.amount, order: taxHead.order }; + }); + formattedFees["CS_BILL_NO"] = { value: billDetail?.billNumber || "NA", order: -2 }; + formattedFees["CS_BILL_DUEDATE"] = { + value: (billDetail?.expiryDate && new Date(billDetail?.expiryDate).toLocaleDateString()) || "NA", + order: -1, + }; + formattedFees["TL_COMMON_TOTAL_AMT"] = { value: billDetail.amount, order: 10 }; + return formattedFees; + }; + + const getFinancialYears = (from, to) => { + const fromDate = new Date(from); + const toDate = new Date(to); + if (toDate.getYear() - fromDate.getYear() != 0) { + return `FY${fromDate.getYear() + 1900}-${toDate.getYear() - 100}`; + } + return `${fromDate.toLocaleDateString()}-${toDate.toLocaleDateString()}`; + }; + + let fees = {}; + let sortedBillDetails = bill?.billDetails?.sort((a, b) => b.fromPeriod - a.fromPeriod) || []; + sortedBillDetails = [...sortedBillDetails]; + const arrears = sortedBillDetails?.reduce((total, current, index) => (index === 0 ? total : total + current.amount), 0) || 0; + let arrearsAmount = `₹ ${arrears?.toFixed?.(0) || Number(0).toFixed(0)}`; + + sortedBillDetails.shift(); + sortedBillDetails.map((bill) => { + let fee = formatTaxHeaders(bill); + fees[getFinancialYears(bill.fromPeriod, bill.toPeriod)] = fee; + }); + + let head = {}; + fees + ? Object.keys(fees).map((key, ind) => { + let value = []; + Object.keys(fees[key]).map((key1) => { + head[key1] = (fees[key] && fees[key][key1] && fees[key][key1].order) || 0; + }); + }) + : "NA"; + let keys = []; + + keys = Object.keys(head); + keys.sort((x, y) => head[x] - head[y]); + + const [showArrear, setShowArrear] = useState(false); + + if (arrears == 0 || arrears < 0) { + return ; + } + return ( + +
{t("CS_ARREARS_DETAILS")}
+ {showArrear && } + {!showArrear && ( +
+ +
+ )} + {showArrear && ( +
+ +
+ )} +
+ ); +}; + +export default ArrearSummary; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-table.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-table.js new file mode 100644 index 00000000000..22fabff393a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/arrear-table.js @@ -0,0 +1,103 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; + +const styles = { + root: { + width: "100%", + marginTop: "2px", + overflowX: "auto", + boxShadow: "none", + }, + table: { + minWidth: 700, + backgroundColor: "rgba(250, 250, 250, var(--bg-opacity))", + }, + cell: { + maxWidth: "7em", + minWidth: "1em", + border: "1px solid #e8e7e6", + padding: "4px 5px", + fontSize: "0.8em", + textAlign: "left", + lineHeight: "1.5em", + }, + cellHeader: { + overflow: "hidden", + textOverflow: "ellipsis", + }, + cellLeft: { + // position: 'sticky', + // backgroundColor:'rgba(250, 250, 250, var(--bg-opacity))', + // left: 0 + }, + cellRight: { + // position: 'sticky', + // backgroundColor:'rgba(250, 250, 250, var(--bg-opacity))', + // right: 0 + }, +}; + +const ArrearTable = ({ className = "table", headers = [], values = [], arrears = 0 }) => { + const { t } = useTranslation(); + return ( + +
+ + + + + {headers.map((header, ind) => { + let styleRight = headers.length == ind + 1 ? styles.cellRight : {}; + return ( + + ); + })} + + + + {Object.values(values).map((row, ind) => ( + + + {headers.map((header, i) => { + let styleRight = headers.length == i + 1 ? styles.cellRight : {}; + return ( + + ); + })} + + ))} + + + {headers.map((header, ind) => { + if (ind == headers.length - 1) { + return ( + + ); + } else if (ind == headers.length - 2) { + return ( + + ); + } else { + return ; + } + })} + + +
{t("CS_BILL_PERIOD")} + {t(header)} +
+ {Object.keys(values)[ind]} + + {i > 1 && "₹"} + {(row[header] && row[header]["value"]) || "0"} +
+ {arrears} + + {t("COMMON_ARREARS_TOTAL")} +
+
+
+ ); +}; + +export default ArrearTable; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-details.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-details.js new file mode 100644 index 00000000000..dcf0f047fce --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-details.js @@ -0,0 +1,270 @@ +import { Card, CardSubHeader, Header, KeyNote, Loader, RadioButtons, SubmitBar, TextInput } from "@egovernments/digit-ui-react-components"; +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { useHistory, useLocation, useParams } from "react-router-dom"; +import ArrearSummary from "./arrear-summary"; +import BillSumary from "./bill-summary"; +import { stringReplaceAll } from "./utils"; + +const BillDetails = ({ paymentRules, businessService }) => { + const { t } = useTranslation(); + const history = useHistory(); + const { state, pathname, search } = useLocation(); + const userInfo = Digit.UserService.getUser(); + let { consumerCode } = useParams(); + const { workflow: wrkflow, tenantId: _tenantId, authorization, ConsumerName } = Digit.Hooks.useQueryParams(); + const [bill, setBill] = useState(state?.bill); + const tenantId = state?.tenantId || _tenantId || Digit.UserService.getUser().info?.tenantId; + const propertyId = state?.propertyId; + if (wrkflow === "WNS" && consumerCode.includes("?")) consumerCode = consumerCode.substring(0, consumerCode.indexOf("?")); + const { data, isLoading } = state?.bill + ? { isLoading: false } + : Digit.Hooks.useFetchPayment({ + tenantId, + businessService, + consumerCode: wrkflow === "WNS" ? stringReplaceAll(consumerCode, "+", "/") : consumerCode, + }); + + let Useruuid = data?.Bill?.[0]?.userId || ""; + let requestCriteria = [ + "/user/_search", + {}, + { data: { uuid: [Useruuid] } }, + { recordId: Useruuid, plainRequestFields: ["mobileNumber"] }, + { + enabled: Useruuid ? true : false, + cacheTime: 100, + }, + ]; + + const { isLoading: isUserLoading, data: userData, revalidate } = Digit.Hooks.useCustomAPIHook(...requestCriteria); + + const { isLoading: isFSMLoading, isError, error, data: application, error: errorApplication } = Digit.Hooks.fsm.useApplicationDetail( + t, + tenantId, + consumerCode, + { enabled: pathname.includes("FSM") ? true : false }, + "CITIZEN" + ); + let { minAmountPayable, isAdvanceAllowed } = paymentRules; + minAmountPayable = wrkflow === "WNS" ? 100 : minAmountPayable; + const billDetails = bill?.billDetails?.sort((a, b) => b.fromPeriod - a.fromPeriod)?.[0] || []; + const Arrears = + bill?.billDetails + ?.sort((a, b) => b.fromPeriod - a.fromPeriod) + ?.reduce((total, current, index) => (index === 0 ? total : total + current.amount), 0) || 0; + + const { key, label } = Digit.Hooks.useApplicationsForBusinessServiceSearch({ businessService }, { enabled: false }); + + const getBillingPeriod = () => { + const { fromPeriod, toPeriod } = billDetails; + if (fromPeriod && toPeriod) { + let from, to; + if (wrkflow === "mcollect" || wrkflow === "WNS") { + from = + new Date(fromPeriod).getDate().toString() + + " " + + Digit.Utils.date.monthNames[new Date(fromPeriod).getMonth()]?.toString() + + " " + + new Date(fromPeriod).getFullYear().toString(); + to = + new Date(toPeriod).getDate() + + " " + + Digit.Utils.date.monthNames[new Date(toPeriod).getMonth()] + + " " + + new Date(toPeriod).getFullYear(); + return from + " - " + to; + } + from = new Date(billDetails.fromPeriod).getFullYear().toString(); + to = new Date(billDetails.toPeriod).getFullYear().toString(); + if (from === to) { + if(window.location.href.includes("BPA")) + { + if(new Date(data?.Bill?.[0]?.billDate).getMonth()+1 < 4) + { + let newfrom = (parseInt(from)-1).toString(); + return "FY " + newfrom + "-" + to; + } + else + { + let newTo = (parseInt(to)+1).toString(); + return "FY " + from + "-" + newTo; + } + } + else + return "FY " + from; + } + return "FY " + from + "-" + to; + } else return "N/A"; + }; + + const getBillBreakDown = () => billDetails?.billAccountDetails || []; + + const getTotal = () => bill?.totalAmount || 0; + const getAdvanceAmount = () => application?.pdfData?.advanceAmount; + + const [paymentType, setPaymentType] = useState(t("CS_PAYMENT_FULL_AMOUNT")); + const [amount, setAmount] = useState(getTotal()); + const [paymentAllowed, setPaymentAllowed] = useState(true); + const [formError, setError] = useState(""); + + if (authorization === "true" && !userInfo?.access_token) { + localStorage.clear(); + sessionStorage.clear(); + window.location.href = `/${window?.contextPath}/citizen/login?from=${encodeURIComponent(pathname + search)}`; + } + useEffect(() => { + window.scroll({ top: 0, behavior: "smooth" }); + }, []); + + useEffect(() => { + if (paymentType == t("CS_PAYMENT_FULL_AMOUNT")) setAmount(getTotal()); + }, [paymentType, bill]); + + useEffect(() => { + let changeAdvanceAllowed = isAdvanceAllowed; + if (isAdvanceAllowed && wrkflow === "WNS") changeAdvanceAllowed = false; + const allowPayment = minAmountPayable && amount >= minAmountPayable && !changeAdvanceAllowed && amount <= getTotal() && !formError; + if (paymentType != t("CS_PAYMENT_FULL_AMOUNT")) setPaymentAllowed(allowPayment); + else setPaymentAllowed(true); + }, [paymentType, amount]); + + useEffect(() => { + if (!isFSMLoading && application?.pdfData?.applicationStatus === "PENDING_APPL_FEE_PAYMENT") { + setPaymentAllowed(true); + setPaymentType(t("CS_PAYMENT_ADV_COLLECTION")); + } + }); + + useEffect(() => { + if (!bill && data) { + let requiredBill = data.Bill.filter((e) => e.consumerCode == (wrkflow === "WNS" ? stringReplaceAll(consumerCode, "+", "/") : consumerCode))[0]; + setBill(requiredBill); + } + }, [isLoading]); + + const onSubmit = () => { + let paymentAmount = + paymentType === t("CS_PAYMENT_FULL_AMOUNT") + ? getTotal() + : amount || businessService === "FSM.TRIP_CHARGES" + ? application?.pdfData?.advanceAmount + : amount; + if (window.location.href.includes("mcollect")) { + history.push(`/${window?.contextPath}/citizen/payment/collect/${businessService}/${consumerCode}?workflow=mcollect`, { + paymentAmount, + tenantId: billDetails.tenantId, + }); + } else if (wrkflow === "WNS") { + history.push(`/${window?.contextPath}/citizen/payment/billDetails/${businessService}/${consumerCode}/${paymentAmount}?workflow=WNS&ConsumerName=${ConsumerName}`, { + paymentAmount, + tenantId: billDetails.tenantId, + name: bill.payerName, + mobileNumber: bill.mobileNumber && bill.mobileNumber?.includes("*") ? userData?.user?.[0]?.mobileNumber : bill.mobileNumber, + }); + } else if (businessService === "PT") { + history.push(`/${window?.contextPath}/citizen/payment/billDetails/${businessService}/${consumerCode}/${paymentAmount}`, { + paymentAmount, + tenantId: billDetails.tenantId, + name: bill.payerName, + mobileNumber: bill.mobileNumber && bill.mobileNumber?.includes("*") ? userData?.user?.[0]?.mobileNumber : bill.mobileNumber, }); + } else { + history.push(`/${window?.contextPath}/citizen/payment/collect/${businessService}/${consumerCode}`, { paymentAmount, tenantId: billDetails.tenantId, propertyId: propertyId }); + } + }; + + const onChangeAmount = (value) => { + setError(""); + if (isNaN(value) || value.includes(".")) { + setError("AMOUNT_INVALID"); + } else if (!isAdvanceAllowed && value > getTotal()) { + setError("CS_ADVANCED_PAYMENT_NOT_ALLOWED"); + } else if (value < minAmountPayable) { + setError("CS_CANT_PAY_BELOW_MIN_AMOUNT"); + } + setAmount(value); + }; + + if (isLoading || isFSMLoading) return ; + + return ( + +
{t("CS_PAYMENT_BILL_DETAILS")}
+ +
+ + {businessService !== "PT.MUTATION" && businessService !== "FSM.TRIP_CHARGES" && ( + + )} + {businessService?.includes("PT") || + (wrkflow === "WNS" && billDetails?.currentBillNo && )} + {businessService?.includes("PT") || + (wrkflow === "WNS" && billDetails?.currentExpiryDate && ( + + ))} + {businessService === "FSM.TRIP_CHARGES" ? ( +
+ + + {application?.pdfData?.applicationStatus !== "PENDING_APPL_FEE_PAYMENT" ? ( + + ) : null} +
+ ) : ( + + )} + +
+ +
+
+ {t("CS_COMMON_PAYMENT_AMOUNT")} + {businessService === "FSM.TRIP_CHARGES" ? null : ( + + )} + +
+ + ₹ + + {paymentType !== t("CS_PAYMENT_FULL_AMOUNT") ? ( + businessService === "FSM.TRIP_CHARGES" ? ( + {}} value={getAdvanceAmount()} disable={true} /> + ) : ( + onChangeAmount(e.target.value)} value={amount} disable={getTotal() === 0} /> + ) + ) : ( + {}} disable={true} /> + )} + {formError === "CS_CANT_PAY_BELOW_MIN_AMOUNT" ? ( + + {t(formError)}: {"₹" + minAmountPayable} + + ) : ( + {t(formError)} + )} +
+ +
+
+
+ ); +}; + +export default BillDetails; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-summary.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-summary.js new file mode 100644 index 00000000000..5cf0ea864e1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/bill-summary.js @@ -0,0 +1,47 @@ +import React, { useEffect } from "react"; +import { useTranslation } from "react-i18next"; + +const BillSumary = ({ billAccountDetails, total, businessService, arrears }) => { + const { t } = useTranslation(); + const { workflow: ModuleWorkflow } = Digit.Hooks.useQueryParams(); + + useEffect(() => { + ModuleWorkflow === "mcollect" && billAccountDetails && billAccountDetails.map((ob) => { + if(ob.taxHeadCode.includes("CGST")) + ob.order = 3; + else if(ob.taxHeadCode.includes("SGST")) + ob.order = 4; + }) + },[billAccountDetails]) + return ( + +
+ {billAccountDetails + .sort((a, b) => a.order - b.order) + .map((amountDetails, index) => { + return ( +
+
{t(amountDetails.taxHeadCode)}
+
₹ {Math.abs(amountDetails?.amount?.toFixed(2))}
+
+ ); + })} + + { +
+
{t("COMMON_ARREARS")}
+
₹ {Math.abs(arrears?.toFixed?.(2) || Number(0).toFixed(2))}
+
+ } + +
+
+
{t("CS_PAYMENT_TOTAL_AMOUNT")}
+
₹ {Number(total).toFixed(2)}
+
+
+
+ ); +}; + +export default BillSumary; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/utils.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/utils.js new file mode 100644 index 00000000000..7a580f0139e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/utils.js @@ -0,0 +1,7 @@ +export const stringReplaceAll = (str = "", searcher = "", replaceWith = "") => { + if (searcher == "") return str; + while (str.includes(searcher)) { + str = str.replace(searcher, replaceWith); + } + return str; + }; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/yearwise-bills.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/yearwise-bills.js new file mode 100644 index 00000000000..ea8aa25a58b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/bill-details/yearwise-bills.js @@ -0,0 +1,73 @@ +import React, { useState } from "react"; +import { useTranslation } from "react-i18next"; + +const YearWiseBilltable = ({ bill, ...props }) => { + const { t } = useTranslation(); + const [showDetails, setShowDetails] = useState(true); + const yearWiseBills = bill?.billDetails?.sort((a, b) => b.fromPeriod - a.fromPeriod); + + const getFinancialYear = (_bill) => { + const { fromPeriod, toPeriod } = _bill; + let from = new Date(fromPeriod).getFullYear().toString(); + let to = new Date(toPeriod).getFullYear().toString(); + return from + "-" + to.slice(-2); + }; + + const thStyle = { whiteSpace: "break-spaces", paddingBottom: "13px" }; + + return ( + + {showDetails ? ( +
+
+
+ + { + + + + {yearWiseBills?.[0]?.billAccountDetails + ?.sort((a, b) => a.order - b.order) + ?.map((head, index) => ( + + ))} + + + + } + + {yearWiseBills?.map((bill, ind) => { + const sorted_tax_heads = bill?.billAccountDetails?.sort((a, b) => a.order - b.order); + return ( + + + {sorted_tax_heads.map((e, i) => ( + + ))} + + + ); + })} + +
+ {t("ES_FINANCIAL_YEAR")} + + {t(head.taxHeadCode)} + + {t("ES_TOTAL_TAX").split(" ")[0] + "\n" + t("ES_TOTAL_TAX").split(" ")[1]} +
{getFinancialYear(bill)}{e.amount}{bill.amount}
+
+
+
setShowDetails(false)} className="filter-button"> + {t("ES_COMMON_HIDE_DETAILS")} +
+
+ ) : ( +
setShowDetails(true)} className="filter-button"> + {t("ES_COMMON_VIEW_DETAILS")} +
+ )} +
+ ); +}; +export default YearWiseBilltable; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/index.js new file mode 100644 index 00000000000..812d541bcae --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/index.js @@ -0,0 +1,21 @@ +import React from "react"; +import { Route, Switch, useRouteMatch } from "react-router-dom"; +import { BillList } from "./my-bills/my-bills"; +import BillDetails from "./bill-details/bill-details"; +import { BackButton } from "@egovernments/digit-ui-react-components"; + +const BillRoutes = ({ billsList, paymentRules, businessService }) => { + const { url: currentPath, ...match } = useRouteMatch(); + + return ( + + + + } /> + } /> + + + ); +}; + +export default BillRoutes; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bill.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bill.js new file mode 100644 index 00000000000..617d8a0590a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bill.js @@ -0,0 +1,35 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import { Card, KeyNote, SubmitBar } from "@egovernments/digit-ui-react-components"; +import { Link, useHistory } from "react-router-dom"; + +// import { getKeyNotesConfig } from "./keynotesConfig"; + +const MyBill = ({ bill, currentPath, businessService, getKeyNotesConfig }) => { + const { t } = useTranslation(); + const history = useHistory(); + + const onSubmit = () => { + history.push(`${currentPath}/${bill.consumerCode}`, { tenantId:bill?.tenantId }); + }; + + return ( + + {typeof getKeyNotesConfig === "function" && ( + + {getKeyNotesConfig(businessService, t)["my-bill"].map((obj, index) => { + const value = obj.keyPath.reduce((acc, key) => { + if (typeof key === "function") acc = key(acc); + else acc = acc[key]; + return acc; + }, bill); + return ; + })} + + + )} + + ); +}; + +export default MyBill; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bills.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bills.js new file mode 100644 index 00000000000..2191941f8e5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/bills/routes/my-bills/my-bills.js @@ -0,0 +1,94 @@ +import React, { useState, useEffect, useMemo } from "react"; +import { ArrowLeft, Header, Loader } from "@egovernments/digit-ui-react-components"; +import { useTranslation } from "react-i18next"; +import { Link, useHistory } from "react-router-dom"; + +import MyBill from "./my-bill"; + +export const BillList = ({ billsList, currentPath, businessService }) => { + const { t } = useTranslation(); + const history = useHistory(); + + const consumerCodes = billsList.map((bill) => bill.consumerCode); + // const { mobileNumber } = Digit.UserService.getUser()?.info; + + const searchResult = Digit.Hooks.useApplicationsForBusinessServiceSearch({ filters: { consumerCodes: consumerCodes.join() }, businessService }); + + /* + call the relevant business search and find what key is being used as consumerCode in bills it is as follows :- + + FSM -> applicationNo + PT -> propertyId + + */ + + const keyForConsumerCode = searchResult.key; + + const [applicationList, setApplicationList] = useState([]); + const [getKeyNotesConfig, setConfig] = useState(() => Digit.ComponentRegistryService?.getComponent("getBillDetailsConfigWithBusinessService")); + const billableApplicationsObj = useMemo(() => ({}), []); + const billsListObj = useMemo(() => ({}), []); + + useEffect(() => { + if (searchResult.data) searchResult.refetch(); + }, []); + + useEffect(() => { + if (searchResult.data) { + const billableApps = searchResult.data.filter((property) => consumerCodes.includes(property[keyForConsumerCode])); + const billableIDs = billableApps.map((e) => e[keyForConsumerCode]); + + billableApps.forEach((app) => { + billableApplicationsObj[app[keyForConsumerCode]] = app; + }); + + + billsList.forEach((bill) => { + billsListObj[bill.consumerCode] = bill; + }); + + const newBillsList = billableIDs.map((e) => ({ ...billsListObj[e], ...billableApplicationsObj[e] })); + setApplicationList(newBillsList); + } + }, [searchResult.data, getKeyNotesConfig]); + + if (searchResult.isLoading) { + return ; + } + + return ( + +
+ {/*
*/} +
{t("CS_TITLE_MY_BILLS") + ` (${applicationList.length})`}
+ {applicationList?.length > 0 && + getKeyNotesConfig && + applicationList.map((bill, index) => ( +
+ +
+ ))} + {!applicationList?.length > 0 &&

{t("CS_BILLS_TEXT_NO_BILLS_FOUND")}

} + {/*
*/} + {businessService === "PT" && ( +

+ {t("PT_TEXT_NOT_ABLE_TO_FIND_THE_PROPERTY")} + + {t("PT_COMMON_CLICK_HERE")} + +

+ )} +
+
+ ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/index.js new file mode 100644 index 00000000000..8bbbef59a99 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/index.js @@ -0,0 +1,39 @@ +import React from "react"; +import { Switch, Route, useRouteMatch } from "react-router-dom"; +import { PrivateRoute } from "@egovernments/digit-ui-react-components"; +import PayersDetails from "./payers-details"; + +import { MyBills } from "./bills"; +import { SelectPaymentType } from "./payment-type/index"; +import { SuccessfulPayment, FailedPayment } from "./response"; + +const CitizenPayment = ({ stateCode, cityCode, moduleCode }) => { + const { path: currentPath } = useRouteMatch(); + const commonProps = { stateCode, cityCode, moduleCode }; + + return ( + +
+ + + + + + + + + + + + + + + + + +
+
+ ); +}; + +export default CitizenPayment; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/keynotesConfig.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/keynotesConfig.js new file mode 100644 index 00000000000..0e9378815fb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/keynotesConfig.js @@ -0,0 +1,104 @@ +import React from "react"; + +export const getKeyNotesConfig = (businessService, t) => { + const businessId = businessService?.toLowerCase().split(".")[0]; + + switch (businessId) { + case "pt": + return { + "my-bill": [ + { + keyValue: "CS_COMMON_AMOUNT_DUE", + keyPath: [ + (d) => { + const overdueBy = new Date().getTime() - new Date(d.billDetails[0]?.toPeriod).getTime(); + const days = Math.floor(overdueBy / (86400 * 1000)); + return ( + + {"₹" + d["totalAmount"]} + {days >= 0 ? ( + {` ( ${t( + "CS_PAYMENT_OVERDUE" + )} ${days} ${t(days === 1 ? "CS_COMMON_DAY" : "CS_COMMON_DAYS")})`} + ) : null} + + ); + }, + ], + fallback: "N/A", + noteStyle: { fontWeight: "bold", fontSize: "24px", paddingTop: "5px" }, + }, + { + keyValue: "PT_PROPERTY_ID", + keyPath: ["propertyId"], + fallback: "", + }, + { + keyValue: "CS_OWNER_NAME", + keyPath: ["owners", 0, "name"], + fallback: "ES_TITLE_FSM", + }, + { + keyValue: "PT_PROPERTY_ADDRESS", + keyPath: ["address", "locality", "name"], + fallback: "CS_APPLICATION_TYPE_DESLUDGING", + }, + { + keyValue: "CS_PAYMENT_BILLING_PERIOD", + keyPath: [ + "billDetails", + (d) => { + const { fromPeriod, toPeriod } = d[0]; + if (fromPeriod && toPeriod) { + let from = new Date(fromPeriod).getFullYear().toString(); + let to = new Date(toPeriod).getFullYear().toString(); + return "FY " + from + "-" + to; + } else return "N/A"; + }, + ], + fallback: "N/A", + }, + { + keyValue: "PT_DUE_DATE", + keyPath: [ + "billDetails", + (d) => { + if (!d[0]?.toPeriod) return "N/A"; + const date = new Date(d[0]?.toPeriod); + const month = Digit.Utils.date.monthNames[date.getMonth()]; + return `${date.getDate()} ${month} ${date.getFullYear()}`; + }, + ], + fallback: "N/A", + }, + ], + response: [], + }; + + /** + + */ + + case "fsm": + return { + "my-bill": [ + { + keyValue: "CS_COMMON_AMOUNT_DUE", + keyPath: ["totalAmount", (d) => d.toFixed(2), (d) => "₹" + d], + fallback: "N/A", + noteStyle: { fontWeight: "bold", fontSize: "24px", paddingTop: "5px" }, + }, + ], + response: [], + }; + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payers-details/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payers-details/index.js new file mode 100644 index 00000000000..f2dbfdc9936 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payers-details/index.js @@ -0,0 +1,241 @@ +import React, { useState, useEffect } from "react"; +import { + Header, + Card, + RadioButtons, + SubmitBar, + BackButton, + Loader, + TextInput, + MobileNumber, + CheckBox, + CitizenConsentForm +} from "@egovernments/digit-ui-react-components"; +import { useTranslation } from "react-i18next"; +import { useForm } from "react-hook-form"; +import { useParams, useHistory, useLocation } from "react-router-dom"; +import { stringReplaceAll } from "../bills/routes/bill-details/utils"; + +const SelectPaymentType = (props) => { + const optionFirst = { + code: "PAY_BY_OWNER", + i18nKey: "PT_PAY_BY_OWNER", + name: "I am making the payment as the owner/ consumer of the service", + }; + + const optionSecound = { + code: "PAY_BEHALF_OWNER", + i18nKey: "PT_PAY_BEHALF_OWNER", + name: "I am making the payment on behalf of the owner/ consumer of the service", + }; + + const userInfo = Digit.UserService.getUser()?.info; + const payersActiveName = userInfo?.name; + const payersActiveMobileNumber = userInfo?.mobileNumber; + + const { t } = useTranslation(); + const history = useHistory(); + const { state, ...location } = useLocation(); + const { consumerCode, businessService, paymentAmt } = useParams(); + const { workflow: wrkflow, tenantId: _tenantId, ConsumerName } = Digit.Hooks.useQueryParams(); + const [bill, setBill] = useState(state?.bill); + const tenantId = state?.tenantId || _tenantId || Digit.UserService.getUser().info?.tenantId; + const isLoggedIn = Digit.UserService.getUser() + + + const { data, isLoading } = state?.bill ? { isLoading: false } : Digit.Hooks.useFetchPayment({ tenantId, businessService, consumerCode }); + + let Useruuid = data?.Bill?.[0]?.userId || ""; + let requestCriteria = [ + "/user/_search", + {}, + {data : {uuid:[Useruuid]}}, + { recordId: Useruuid, plainRequestFields: ["mobileNumber"] }, + { + enabled: Useruuid ? true : false, + cacheTime: 100, + } + ] + const { isLoading : isUserLoading, data: userData, revalidate } = Digit.Hooks.useCustomAPIHook(...requestCriteria); + + const billDetails = bill?.billDetails?.sort((a, b) => b.fromPeriod - a.fromPeriod)?.[0] || []; + const Arrears = + bill?.billDetails + ?.sort((a, b) => b.fromPeriod - a.fromPeriod) + ?.reduce((total, current, index) => (index === 0 ? total : total + current.amount), 0) || 0; + + const [paymentType, setPaymentType] = useState(optionFirst); + const [payersName, setPayersName] = useState(""); + const [payersMobileNumber, setPayersMobileNumber] = useState(""); + const { control, handleSubmit } = useForm(); + const [canSubmit, setCanSubmit] = useState(false); + const [mobileNumberError, setmobileNumberError] = useState(null); + const [isCheckBox, setIsCheckBox] = useState(false); + const [isCCFEnabled, setisCCFEnabled] = useState(false); + const [mdmsConfig, setMdmsConfig] = useState(""); + + const { isLoading: citizenConcentFormLoading, data:ccfData } = Digit.Hooks.useCustomMDMS(Digit.ULBService.getStateId(), "common-masters", [{ name: "CitizenConsentForm" }]); + + function setTermsAndPolicyDetails(e) { + setIsCheckBox(e.target.checked) + } + + const checkDisbaled = () => { + if (isCCFEnabled?.isCitizenConsentFormEnabled && !isLoggedIn?.access_token) { + const isData = paymentType?.code !== optionSecound?.code ? false : userInfo ? false : !canSubmit; + let isEnabled = false + if (!isData && isCheckBox) isEnabled = false; + else isEnabled = true; + return isEnabled; + } else { + return paymentType?.code !== optionSecound?.code ? false : userInfo ? false : !canSubmit + } + } + + useEffect(()=> { + if (ccfData?.["common-masters"]?.CitizenConsentForm?.[0]?.isCitizenConsentFormEnabled) { + setisCCFEnabled(ccfData?.["common-masters"]?.CitizenConsentForm?.[0]) + } + }, [ccfData]); + + const onLinkClick = (e) => { + setMdmsConfig(e.target.id) +} + + const checkLabels = () => { + return + {isCCFEnabled?.checkBoxLabels?.map((data, index) => { + return + {/* {index == 0 && "CCF"} */} + {data?.linkPrefix && {t(`${data?.linkPrefix}_`)}} + {data?.link && { onLinkClick(e) }} style={{ color: "#F47738", cursor: "pointer" }}>{t(`${data?.link}_`)}} + {data?.linkPostfix && {t(`${data?.linkPostfix}_`)}} + {(index == isCCFEnabled?.checkBoxLabels?.length - 1) && t("LABEL")} + + })} + + } + + + useEffect(() => { + if (!bill && data) { + let requiredBill = data?.Bill?.filter((e) => e.consumerCode == consumerCode)[0]; + setBill(requiredBill); + } + }, [isLoading]); + + const onChangePayersMobileNumber = (e) => { + setmobileNumberError(null); + let validation = "^\\d{10}$"; + if (!e.match(validation)) { + setmobileNumberError("CORE_COMMON_PHONENO_INVALIDMSG"); + setCanSubmit(false); + } + setPayersMobileNumber(e); + + e.length == 10 && payersName != "" ? setCanSubmit(true) : setCanSubmit(false); + }; + + const onChangePayersName = (value) => { + setPayersName(value); + value.length !== 0 && mobileNumberError != "CORE_COMMON_PHONENO_INVALIDMSG" && payersName != "" && payersMobileNumber != "" ? setCanSubmit(true) : setCanSubmit(false); + }; + + const onSubmit = () => { + if(wrkflow === "WNS") + { + history.push(`/${window?.contextPath}/citizen/payment/collect/${businessService}/${consumerCode}?workflow=WNS&consumerCode=${stringReplaceAll(consumerCode, "+", "/")}`, { + paymentAmount: paymentAmt, + tenantId: billDetails.tenantId, + name: paymentType?.code !== optionSecound?.code && ConsumerName !== "undefined" ? ConsumerName : userInfo ? payersActiveName : payersName, + mobileNumber: paymentType?.code !== optionSecound?.code ? (bill?.mobileNumber?.includes("*") ? userData?.user?.[0]?.mobileNumber : bill?.mobileNumber ) : userInfo ? payersActiveMobileNumber : payersMobileNumber, + }); + } + else{ + history.push(`/${window?.contextPath}/citizen/payment/collect/${businessService}/${consumerCode}`, { + paymentAmount: paymentAmt, + tenantId: billDetails.tenantId, + name: paymentType?.code !== optionSecound?.code ? bill?.payerName : userInfo ? payersActiveName : payersName, + mobileNumber: paymentType?.code !== optionSecound?.code ? (bill?.mobileNumber?.includes("*") ? userData?.user?.[0]?.mobileNumber : bill?.mobileNumber ) : userInfo ? payersActiveMobileNumber : payersMobileNumber, + }); + } + }; + + if (isLoading || isUserLoading || citizenConcentFormLoading) { + return ; + } + + return ( + + {t("CS_COMMON_BACK")} +
+ {/*
{t("PAYMENT_CS_HEADER")}
*/} +
{t("PT_PAYERS_DETAILS_HEADER")}
+ + {t(mobileNumberError)} + +
+ {paymentType?.code !== optionFirst?.code && !userInfo ? ( +
+ + {t("PT_PAYERS_MOBILE_NO")} + + + + {t("PT_PAYERS_NAME")} + onChangePayersName(e.target.value)} + value={payersName} + /> + +
+ ) : null} +
+ + {isCCFEnabled?.isCitizenConsentFormEnabled && !isLoggedIn?.access_token &&
+ + + +
} + + +
+
+
+ ); +}; + +export default SelectPaymentType; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payment-type/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payment-type/index.js new file mode 100644 index 00000000000..0bac57d4a66 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/payment-type/index.js @@ -0,0 +1,144 @@ +import React, { useEffect, useState } from "react"; +import { + Header, + Card, + RadioButtons, + SubmitBar, + BackButton, + CardLabel, + CardLabelDesc, + CardSectionHeader, + InfoBanner, + Loader, + Toast, + CardText, +} from "@egovernments/digit-ui-react-components"; +import { useTranslation } from "react-i18next"; +import { useForm, Controller } from "react-hook-form"; +import { useParams, useHistory, useLocation, Redirect } from "react-router-dom"; +import { stringReplaceAll } from "../bills/routes/bill-details/utils"; + +export const SelectPaymentType = (props) => { + const { state = {} } = useLocation(); + const userInfo = Digit.UserService.getUser(); + const [showToast, setShowToast] = useState(null); + const { tenantId: __tenantId, authorization, workflow: wrkflow , consumerCode : connectionNo } = Digit.Hooks.useQueryParams(); + const paymentAmount = state?.paymentAmount; + const { t } = useTranslation(); + const history = useHistory(); + const { pathname, search } = useLocation(); + // const menu = ["AXIS"]; + let { consumerCode, businessService } = useParams(); + const tenantId = state?.tenantId || __tenantId || Digit.ULBService.getCurrentTenantId(); + const propertyId = state?.propertyId; + const stateTenant = Digit.ULBService.getStateId(); + const { control, handleSubmit } = useForm(); + const { data: menu, isLoading } = Digit.Hooks.useCommonMDMS(stateTenant, "DIGIT-UI", "PaymentGateway"); + const { data: paymentdetails, isLoading: paymentLoading } = Digit.Hooks.useFetchPayment( + { tenantId: tenantId, consumerCode: wrkflow === "WNS" ? connectionNo : consumerCode, businessService }, + {} + ); + if (window.location.href.includes("ISWSCON") || wrkflow === "WNS") consumerCode = decodeURIComponent(consumerCode); + if( wrkflow === "WNS") consumerCode = stringReplaceAll(consumerCode,"+","/") + useEffect(() => { + if (paymentdetails?.Bill && paymentdetails.Bill.length == 0) { + setShowToast({ key: true, label: "CS_BILL_NOT_FOUND" }); + } + }, [paymentdetails]); + useEffect(() => { + localStorage.setItem("BillPaymentEnabled", "true"); + }, []); + const { name, mobileNumber } = state; + + const billDetails = paymentdetails?.Bill ? paymentdetails?.Bill[0] : {}; + + const onSubmit = async (d) => { + const filterData = { + Transaction: { + tenantId: billDetails?.tenantId, + txnAmount: paymentAmount || billDetails.totalAmount, + module: businessService, + billId: billDetails.id, + consumerCode: consumerCode, + productInfo: "Common Payment", + gateway: d.paymentType, + taxAndPayments: [ + { + billId: billDetails.id, + amountPaid: paymentAmount || billDetails.totalAmount, + }, + ], + user: { + name: (name || userInfo?.info?.name || billDetails?.payerName).trim(), + mobileNumber: mobileNumber || userInfo?.info?.mobileNumber || billDetails?.mobileNumber, + tenantId: billDetails?.tenantId, + }, + // success + callbackUrl: window.location.href.includes("mcollect") || wrkflow === "WNS" + ? `${window.location.protocol}//${window.location.host}/${window?.contextPath}/citizen/payment/success/${businessService}/${wrkflow === "WNS"? encodeURIComponent(consumerCode):consumerCode}/${tenantId}?workflow=${wrkflow === "WNS"? wrkflow : "mcollect"}` + : `${window.location.protocol}//${window.location.host}/${window?.contextPath}/citizen/payment/success/${businessService}/${wrkflow === "WNS"? encodeURIComponent(consumerCode):consumerCode}/${tenantId}?propertyId=${propertyId}`, + additionalDetails: { + isWhatsapp: false, + }, + }, + }; + + try { + const data = await Digit.PaymentService.createCitizenReciept(billDetails?.tenantId, filterData); + const redirectUrl = data?.Transaction?.redirectUrl; + window.location = redirectUrl; + } catch (error) { + let messageToShow = "CS_PAYMENT_UNKNOWN_ERROR_ON_SERVER"; + if (error.response?.data?.Errors?.[0]) { + const { code, message } = error.response?.data?.Errors?.[0]; + messageToShow = code; + } + setShowToast({ key: true, label: t(messageToShow) }); + } + }; + + if (authorization === "true" && !userInfo.access_token) { + localStorage.clear(); + sessionStorage.clear(); + window.location.href = `/${window?.contextPath}/citizen/login?from=${encodeURIComponent(pathname + search)}`; + } + + if (isLoading || paymentLoading) { + return ; + } + + return ( + + {t("CS_COMMON_BACK")} +
+
{t("PAYMENT_CS_HEADER")}
+ +
+ {t("PAYMENT_CS_TOTAL_AMOUNT_DUE")} + ₹ { paymentAmount !== undefined ? Number(paymentAmount).toFixed(2) : Number(billDetails?.totalAmount).toFixed(2)} +
+ {t("PAYMENT_CS_SELECT_METHOD")} + {menu?.length && ( + } + /> + )} + {!showToast && } +
+
+ + {showToast && ( + { + setShowToast(null); + }} + /> + )} +
+ ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/response/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/response/index.js new file mode 100644 index 00000000000..9cc35b94fa6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/citizen/response/index.js @@ -0,0 +1,426 @@ +import { Banner, Card, CardText, Loader, Row, StatusTable, SubmitBar, DownloadPrefixIcon } from "@egovernments/digit-ui-react-components"; +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { useQueryClient } from "react-query"; +import { Link, useParams } from "react-router-dom"; + +export const SuccessfulPayment = (props)=>{ + if(localStorage.getItem("BillPaymentEnabled")!=="true"){ + window.history.forward(); + return null; + } + return +} + + + const WrapPaymentComponent = (props) => { + const { t } = useTranslation(); + const queryClient = useQueryClient(); + const { eg_pg_txnid: egId, workflow: workflw, propertyId } = Digit.Hooks.useQueryParams(); + const [printing, setPrinting] = useState(false); + const [allowFetchBill, setallowFetchBill] = useState(false); + const { businessService: business_service, consumerCode, tenantId } = useParams(); + const { data: bpaData = {}, isLoading: isBpaSearchLoading, isSuccess: isBpaSuccess, error: bpaerror } = Digit?.Hooks?.obps?.useOBPSSearch( + "", {}, tenantId, { applicationNo: consumerCode }, {}, {enabled:(window.location.href.includes("bpa") || window.location.href.includes("BPA"))} + )||{}; + + const { isLoading, data, isError } = Digit.Hooks.usePaymentUpdate({ egId }, business_service, { + retry: false, + staleTime: Infinity, + refetchOnWindowFocus: false, + }); + + const { label } = Digit.Hooks.useApplicationsForBusinessServiceSearch({ businessService: business_service }, { enabled: false }); + + // const { data: demand } = Digit.Hooks.useDemandSearch( + // { consumerCode, businessService: business_service }, + // { enabled: !isLoading, retry: false, staleTime: Infinity, refetchOnWindowFocus: false } + // ); + + // const { data: billData, isLoading: isBillDataLoading } = Digit.Hooks.useFetchPayment( + // { tenantId, consumerCode, businessService: business_service }, + // { enabled: allowFetchBill, retry: false, staleTime: Infinity, refetchOnWindowFocus: false } + // ); + + const { data: reciept_data, isLoading: recieptDataLoading } = Digit.Hooks.useRecieptSearch( + { + tenantId, + businessService: business_service, + receiptNumbers: data?.payments?.Payments?.[0]?.paymentDetails[0].receiptNumber, + }, + { + retry: false, + staleTime: Infinity, + refetchOnWindowFocus: false, + select: (dat) => { + return dat.Payments[0]; + }, + enabled: allowFetchBill, + } + ); + + const { data: generatePdfKey } = Digit.Hooks.useCommonMDMS(tenantId, "common-masters", "ReceiptKey", { + select: (data) => + data["common-masters"]?.uiCommonPay?.filter(({ code }) => business_service?.includes(code))[0]?.receiptKey || "consolidatedreceipt", + retry: false, + staleTime: Infinity, + refetchOnWindowFocus: false, + }); + + const payments = data?.payments; + + useEffect(() => { + return () => { + localStorage.setItem("BillPaymentEnabled","false") + queryClient.clear(); + }; + }, []); + + useEffect(() => { + if (data && data.txnStatus && data.txnStatus !== "FAILURE") { + setallowFetchBill(true); + } + }, [data]); + + if (isLoading || recieptDataLoading) { + return ; + } + + const applicationNo = data?.applicationNo; + + const isMobile = window.Digit.Utils.browser.isMobile(); + + + if (isError || !payments || !payments.Payments || payments.Payments.length === 0 || data.txnStatus === "FAILURE") { + return ( + + + {t("CS_PAYMENT_FAILURE_MESSAGE")} + {!(business_service?.includes("PT")) ? ( + + + + ) : ( + + + + +
+ {t("CORE_COMMON_GO_TO_HOME")} +
+
+ )} +
+ ); + } + + const paymentData = data?.payments?.Payments[0]; + const amount = reciept_data?.paymentDetails?.[0]?.totalAmountPaid; + const transactionDate = paymentData?.transactionDate; + const printCertificate = async () => { + //const tenantId = Digit.ULBService.getCurrentTenantId(); + const state = tenantId; + const applicationDetails = await Digit.TLService.search({ applicationNumber: consumerCode, tenantId }); + const generatePdfKeyForTL = "tlcertificate"; + + if (applicationDetails) { + let response = await Digit.PaymentService.generatePdf(state, { Licenses: applicationDetails?.Licenses }, generatePdfKeyForTL); + const fileStore = await Digit.PaymentService.printReciept(state, { fileStoreIds: response.filestoreIds[0] }); + window.open(fileStore[response.filestoreIds[0]], "_blank"); + } + }; + + const printReciept = async () => { + if (printing) return; + setPrinting(true); + const tenantId = paymentData?.tenantId; + const state = Digit.ULBService.getStateId(); + let response = { filestoreIds: [payments.Payments[0]?.fileStoreId] }; + if (!paymentData?.fileStoreId) { + response = await Digit.PaymentService.generatePdf(state, { Payments: [payments.Payments[0]] }, generatePdfKey); + } + const fileStore = await Digit.PaymentService.printReciept(state, { fileStoreIds: response.filestoreIds[0] }); + if (fileStore && fileStore[response.filestoreIds[0]]) { + window.open(fileStore[response.filestoreIds[0]], "_blank"); + } + setPrinting(false); + }; + + const convertDateToEpoch = (dateString, dayStartOrEnd = "dayend") => { + //example input format : "2018-10-02" + try { + const parts = dateString.match(/(\d{4})-(\d{1,2})-(\d{1,2})/); + const DateObj = new Date(Date.UTC(parts[1], parts[2] - 1, parts[3])); + DateObj.setMinutes(DateObj.getMinutes() + DateObj.getTimezoneOffset()); + if (dayStartOrEnd === "dayend") { + DateObj.setHours(DateObj.getHours() + 24); + DateObj.setSeconds(DateObj.getSeconds() - 1); + } + return DateObj.getTime(); + } catch (e) { + return dateString; + } + }; + + const printPdf = (blob) => { + const fileURL = URL.createObjectURL(blob); + var myWindow = window.open(fileURL); + if (myWindow != undefined) { + myWindow.addEventListener("load", (event) => { + myWindow.focus(); + myWindow.print(); + }); + } + }; + + const downloadPdf = (blob, fileName) => { + if (window.mSewaApp && window.mSewaApp.isMsewaApp() && window.mSewaApp.downloadBase64File) { + var reader = new FileReader(); + reader.readAsDataURL(blob); + reader.onloadend = function () { + var base64data = reader.result; + mSewaApp.downloadBase64File(base64data, fileName); + }; + } else { + const link = document.createElement("a"); + // create a blobURI pointing to our Blob + link.href = URL.createObjectURL(blob); + link.download = fileName; + // some browser needs the anchor to be in the doc + document.body.append(link); + link.click(); + link.remove(); + // in case the Blob uses a lot of memory + setTimeout(() => URL.revokeObjectURL(link.href), 7000); + } + }; + + const getPermitOccupancyOrderSearch = async(order, mode="download") => { + let queryObj = { applicationNo: bpaData?.[0]?.applicationNo }; + let bpaResponse = await Digit.OBPSService.BPASearch(bpaData?.[0]?.tenantId, queryObj); + const edcrResponse = await Digit.OBPSService.scrutinyDetails(bpaData?.[0]?.tenantId, { edcrNumber: bpaData?.[0]?.edcrNumber }); + let bpaDataDetails = bpaResponse?.BPA?.[0], edcrData = edcrResponse?.edcrDetail?.[0]; + let currentDate = new Date(); + bpaDataDetails.additionalDetails.runDate = convertDateToEpoch( + currentDate.getFullYear() + "-" + (currentDate.getMonth() + 1) + "-" + currentDate.getDate() + ); + let reqData = { ...bpaDataDetails, edcrDetail: [{ ...edcrData }] }; + let response = await Digit.PaymentService.generatePdf(bpaDataDetails?.tenantId, { Bpa: [reqData] }, order); + const fileStore = await Digit.PaymentService.printReciept(bpaDataDetails?.tenantId, { fileStoreIds: response.filestoreIds[0] }); + window.open(fileStore[response?.filestoreIds[0]], "_blank"); + + reqData["applicationType"] = bpaDataDetails?.additionalDetails?.applicationType; + let edcrresponse = await Digit.OBPSService.edcr_report_download({ BPA: { ...reqData } }); + const responseStatus = parseInt(edcrresponse.status, 10); + if (responseStatus === 201 || responseStatus === 200) { + mode == "print" + ? printPdf(new Blob([edcrresponse.data], { type: "application/pdf" })) + : downloadPdf(new Blob([edcrresponse.data], { type: "application/pdf" }), `edcrReport.pdf`); + } + }; + + const getBillingPeriod = (billDetails) => { + const { taxPeriodFrom, taxPeriodTo, fromPeriod, toPeriod } = billDetails || {}; + if (taxPeriodFrom && taxPeriodTo) { + let from = new Date(taxPeriodFrom).getFullYear().toString(); + let to = new Date(taxPeriodTo).getFullYear().toString(); + return "FY " + from + "-" + to; + } else if (fromPeriod && toPeriod) { + if (workflw === "mcollect") { + let from = + new Date(fromPeriod).getDate().toString() + + " " + + Digit.Utils.date.monthNames[new Date(fromPeriod).getMonth() ].toString() + + " " + + new Date(fromPeriod).getFullYear().toString(); + let to = + new Date(toPeriod).getDate() + + " " + + Digit.Utils.date.monthNames[new Date(toPeriod).getMonth()] + + " " + + new Date(toPeriod).getFullYear(); + return from + " - " + to; + } + else if(workflw === "WNS") + { + let from = + new Date(fromPeriod).getDate().toString() + + "/" + + (new Date(fromPeriod).getMonth() + 1).toString() + + "/" + + new Date(fromPeriod).getFullYear().toString(); + let to = + new Date(toPeriod).getDate() + + "/" + + (new Date(toPeriod).getMonth() + 1) + + "/" + + new Date(toPeriod).getFullYear(); + return from + " - " + to; + } + let from = new Date(fromPeriod).getFullYear().toString(); + let to = new Date(toPeriod).getFullYear().toString(); + return "FY " + from + "-" + to; + } else return "N/A"; + }; + + let bannerText; + if (workflw) { + bannerText = `CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE`; + } else { + if (paymentData?.paymentDetails?.[0]?.businessService && paymentData?.paymentDetails?.[0]?.businessService?.includes("BPA")) { + let nameOfAchitect = sessionStorage.getItem("BPA_ARCHITECT_NAME"); + let parsedArchitectName = nameOfAchitect ? JSON.parse(nameOfAchitect) : "ARCHITECT"; + bannerText = `CITIZEN_SUCCESS_${paymentData?.paymentDetails[0]?.businessService.replace(/\./g, "_")}_${parsedArchitectName}_PAYMENT_MESSAGE`; + } else if (business_service?.includes("WS") || business_service?.includes("SW")) { + bannerText = t(`CITIZEN_SUCCESS_${paymentData?.paymentDetails[0].businessService.replace(/\./g, "_")}_WS_PAYMENT_MESSAGE`); + } else { + bannerText = paymentData?.paymentDetails[0]?.businessService ? `CITIZEN_SUCCESS_${paymentData?.paymentDetails[0]?.businessService.replace(/\./g, "_")}_PAYMENT_MESSAGE` : t("CITIZEN_SUCCESS_UC_PAYMENT_MESSAGE"); + } + } + + // https://dev.digit.org/collection-services/payments/FSM.TRIP_CHARGES/_search?tenantId=pb.amritsar&consumerCodes=107-FSM-2021-02-18-063433 + + // if (billDataLoading) return ; + + const rowContainerStyle = { + padding: "4px 0px", + justifyContent: "space-between", + }; + + const ommitRupeeSymbol = ["PT"].includes(business_service); + + if ((window.location.href.includes("bpa") || window.location.href.includes("BPA")) && isBpaSearchLoading) return + + return ( + + + + + } + message={t("CS_COMMON_PAYMENT_COMPLETE")} + info={t("CS_COMMON_RECIEPT_NO")} + applicationNumber={paymentData?.paymentDetails[0].receiptNumber} + successful={true} + /> + {t(`${bannerText}_DETAIL`)} + + + {/** TODO : move this key and value into the hook based on business Service */} + {(business_service === "PT" || workflw) && ( + + )} + + {(business_service === "PT" || workflw) && ( + + )} + + + + {(business_service !== "PT" || workflw) && ( + + )} + +
+ {business_service == "TL" ? ( +
+ + + + + {t("TL_RECEIPT")} +
+ ) : null} + {business_service == "TL" ? ( +
+ + + + + {t("TL_CERTIFICATE")} +
+ ) : null} + {bpaData?.[0]?.businessService === "BPA_OC" && (bpaData?.[0]?.status==="APPROVED" || bpaData?.[0]?.status==="PENDING_SANC_FEE_PAYMENT") ? ( +
getPermitOccupancyOrderSearch("occupancy-certificate")}> + + {t("BPA_OC_CERTIFICATE")} +
+ ) : null} + {bpaData?.[0]?.businessService === "BPA_LOW" ? ( +
getPermitOccupancyOrderSearch("buildingpermit-low")}> + + {t("BPA_PERMIT_ORDER")} +
+ ) : null} + {bpaData?.[0]?.businessService === "BPA" && (bpaData?.[0]?.businessService !== "BPA_LOW") && (bpaData?.[0]?.businessService !== "BPA_OC") && (bpaData?.[0]?.status==="PENDING_SANC_FEE_PAYMENT" || bpaData?.[0]?.status==="APPROVED")? ( +
getPermitOccupancyOrderSearch("buildingpermit")}> + + {t("BPA_PERMIT_ORDER")} +
+ ) : null} +
+ {business_service?.includes("PT") &&
+ +
} + {business_service?.includes("PT") ? ( +
+ {t("CS_DOWNLOAD_RECEIPT")} +
+ ) : null} + {!(business_service == "TL") || !(business_service?.includes("PT")) && } + {!(business_service == "TL") || !(business_service?.includes("PT")) && ( +
+ {t("CORE_COMMON_GO_TO_HOME")} +
+ )} + {business_service == "TL" && ( + + + + )} +
+ ); +}; + +export const FailedPayment = (props) => { + const { addParams, clearParams } = props; + const { t } = useTranslation(); + const { consumerCode } = useParams(); + + const getMessage = () => "Failure !"; + return ( + + + {t("ES_COMMON_TRACK_COMPLAINT_TEXT")} + + ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/employee/IFrameInterface/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/employee/IFrameInterface/index.js new file mode 100644 index 00000000000..28bc48cb6c3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/modules/common/src/payments/employee/IFrameInterface/index.js @@ -0,0 +1,51 @@ +import { Header, Loader } from "@egovernments/digit-ui-react-components"; +import React, { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { useParams } from "react-router-dom"; + + +const IFrameInterface = (props) => { + const { stateCode } = props; + const { moduleName, pageName } = useParams(); + + const { t } = useTranslation(); + const [url, setUrl] = useState(""); + const [title, setTitle] = useState(""); + + const { data, isLoading } = Digit.Hooks.dss.useMDMS(stateCode, "common-masters", ["uiCommonConstants"], { + select: (data) => { + let formattedResponse = data?.["common-masters"]?.["uiCommonConstants"]?.[0] || {}; + return formattedResponse; + }, + enabled: true, + }); + + useEffect(() => { + const pageObject = data?.[moduleName]?.["iframe-routes"]?.[pageName] || {}; + const isOrign = pageObject?.["isOrigin"] || false; + const domain = isOrign ? (process.env.NODE_ENV === "development" ? "https://qa.digit.org" : document.location.origin) : pageObject?.["domain"]; + const contextPath = pageObject?.["routePath"] || ""; + const title = pageObject?.["title"] || ""; + let url = `${domain}${contextPath}`; + setUrl(url); + setTitle(title); + }, [data, moduleName, pageName]); + + if (isLoading) { + return ; + } + + if (!url) { + return
No Iframe To Load
; + } + return ( + +
{t(title)}
+
+ +
: +
+ {t("COMMON_URL_NOT_FOUND")} +
} + + : null} +
+ ); +}; + +export default CitizenConsentForm; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenHomeCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenHomeCard.js new file mode 100644 index 00000000000..1f131101dbe --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenHomeCard.js @@ -0,0 +1,26 @@ +import React from "react"; +import { Link } from "react-router-dom"; + +const CitizenHomeCard = ({ header, links = [], state, Icon, Info, isInfo = false, styles }) => { + return ( +
+
+

{header}

+ +
+ +
+ {links.map((e, i) => ( +
+ + {e.i18nKey} + +
+ ))} +
+
{isInfo ? : null}
+
+ ); +}; + +export default CitizenHomeCard; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenInfoLabel.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenInfoLabel.js new file mode 100644 index 00000000000..652146cf887 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CitizenInfoLabel.js @@ -0,0 +1,22 @@ +import React from "react"; +import { InfoBannerIcon } from "./svgindex"; + +const CitizenInfoLabel = (props) => { + //if type is "component", then props will come from props?.props. + //if the component has props passed directly, then props will be used. + props = props?.props ? props?.props : props; + const showInfo = props?.showInfo ? props?.showInfo : true; + + return ( +
+ {showInfo &&
+ +

{props?.info}

+
+ } +

{props?.text}

+
+ ); +}; + +export default CitizenInfoLabel; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CollapseAndExpandGroups.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CollapseAndExpandGroups.js new file mode 100644 index 00000000000..473440b077f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CollapseAndExpandGroups.js @@ -0,0 +1,46 @@ +import React, { useState } from "react"; +import { useTranslation } from "react-i18next"; +import { SVG } from "./SVG"; +import PropTypes from "prop-types"; + +const CollapseAndExpandGroups = ({ children, groupElements = false, groupHeader = "", headerLabel = "", headerValue = "", customClass = "" ,showHelper=false,collapseState=false}) => { + const { t } = useTranslation(); + const [collapse, setCollapse] = useState(collapseState); + return ( +
+ {groupHeader &&
{t(groupHeader)}
} + {groupElements && ( +
+ {headerLabel} + {headerValue} +
setCollapse((prev) => !prev)} className="digit-icon-toggle "> + {!collapse && ( + + {showHelper&&
{t("COMMON_CORE_COLLAPSE")}
} + +
+ )} + {collapse && ( + + {showHelper&&
{t("COMMON_CORE_EXPAND")}
} + +
+ )} +
+
+ )} +
{children}
+
+ ); +}; + +CollapseAndExpandGroups.propTypes = { + children: PropTypes.node, + style: PropTypes.object, + customClass: PropTypes.string, + groupElements: PropTypes.bool, + groupHeader: PropTypes.string, + headerLabel: PropTypes.string, + headerValue: PropTypes.string, +}; +export default CollapseAndExpandGroups; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.js new file mode 100644 index 00000000000..b2e4fa88ad2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.js @@ -0,0 +1,59 @@ +import React from "react"; +import PropTypes from "prop-types"; + +export const CheckPoint = (props) => { + return ( +
+

+
+ {props.label} + {props.info ?

{props.info}

: null} + {props.customChild ? props.customChild : null} +
+
+ ); +}; + +export const ConnectingCheckPoints = (props) => { + if (props.children && props.children.length >= 1) { + return ( + + {props.children.map((child, index) => { + return props.children.length === ++index ? ( +
{child}
+ ) : ( +
+ {child} +
+
+ ); + })} +
+ ); + } else { + return null; + } +}; + +CheckPoint.propTypes = { + /** + * Is checkpoint completed or not? + */ + isCompleted: PropTypes.bool, + /** + * key value + */ + key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + /** + * checkpoint content + */ + label: PropTypes.string, + info: PropTypes.string, +}; + +CheckPoint.defaultProps = { + isCompleted: false, + key: 0, + label: "", + info: "", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.stories.js new file mode 100644 index 00000000000..72a8513e99c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ConnectingCheckPoints.stories.js @@ -0,0 +1,19 @@ +import React from "react"; + +import { CheckPoint } from "./ConnectingCheckPoints"; + +export default { + title: "Atom/CheckPoint", + component: CheckPoint, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + isCompleted: true, + key: 234234, + label: "First checkpoint", + info: "This is the first checkpoint", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CustomButton.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CustomButton.js new file mode 100644 index 00000000000..a1ba8a10b8f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/CustomButton.js @@ -0,0 +1,13 @@ +import React from "react"; + +const CustomButton = ({ text, onClick, selected }) => { + return ( + + + + ); +}; + +export default CustomButton; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DatePicker.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DatePicker.js new file mode 100644 index 00000000000..6436ffed23b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DatePicker.js @@ -0,0 +1,72 @@ +import React, { useState, useRef } from "react"; +import { CalendarIcon } from "../atoms/svgindex"; +import PropTypes from "prop-types"; + +const DatePicker = (props) => { + // const [date, setDate] = useState(() => props.initialDate || null); + const dateInp = useRef(); + + function defaultFormatFunc(date) { + if (date) { + const operationDate = typeof date === "string" ? new Date(date) : date; + const years = operationDate?.getFullYear(); + const month = operationDate?.getMonth() + 1; + const _date = operationDate?.getDate(); + return _date && month && years ? `${_date}/${month}/${years}` : ""; + } + return ""; + } + + const getDatePrint = () => props?.formattingFn?.(props?.date) || defaultFormatFunc(props?.date); + const selectDate = (e) => { + const date = e.target.value; + // setDate(date); + props?.onChange?.(date); + }; + let addStyle = {}; + if (Digit.UserService.getType() === "citizen") { + addStyle = { maxWidth: "540px" }; + } + return ( +
+ + {/* + */} + + +
+ ); +}; + +DatePicker.propTypes = { + disabled: PropTypes.bool, + date: PropTypes.any, + min: PropTypes.any, + max: PropTypes.any, + defaultValue: PropTypes.any, + onChange: PropTypes.func, +}; + +export default DatePicker; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.js new file mode 100644 index 00000000000..9f0fbed244f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.js @@ -0,0 +1,25 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Calender } from "./svgindex"; + +const DateWrap = (props) => { + return ( +
+ +

{props.date}

+
+ ); +}; + +DateWrap.propTypes = { + /** + * date + */ + date: PropTypes.any, +}; + +DateWrap.defaultProps = { + date: 0, +}; + +export default DateWrap; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.stories.js new file mode 100644 index 00000000000..230abdd47d5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DateWrap.stories.js @@ -0,0 +1,19 @@ +import React from "react"; + +import DateWrap from "./DateWrap"; + +export default { + title: "Atom/DateWrap", + component: DateWrap, + argTypes: { + date: { control: "date" }, + }, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + date: 1607498172995, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.js new file mode 100644 index 00000000000..bd4fa92d8c6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.js @@ -0,0 +1,23 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const DescriptionText = (props) => { + return ( +
+

{props.text}

+
+ ); +}; + +DescriptionText.propTypes = { + /** + * DescriptionText contents + */ + date: PropTypes.string, +}; + +DescriptionText.defaultProps = { + text: "", +}; + +export default DescriptionText; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.stories.js new file mode 100644 index 00000000000..7c996644594 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DescriptionText.stories.js @@ -0,0 +1,16 @@ +import React from "react"; + +import DescriptionText from "./DescriptionText"; + +export default { + title: "Atom/DescriptionText", + component: DescriptionText, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + text: "This is the description", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.js new file mode 100644 index 00000000000..c08c85899d3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.js @@ -0,0 +1,43 @@ +import React from "react"; +import PropTypes from "prop-types"; +import {PDFSvg} from "./svgindex" + +const ImageOrPDFIcon = ({source, index, last=false, onClick}) => { + return Digit.Utils.getFileTypeFromFileStoreURL(source) === "pdf" ? + + : + issue thumbnail onClick(source, index)}> +} + +const DisplayPhotos = (props) => { + return ( +
+ {props.srcs.map((source, index) => { + return + })} +
+ ); +}; + +DisplayPhotos.propTypes = { + /** + * images + */ + srcs: PropTypes.array, + /** + * optional click handler + */ + onClick: PropTypes.func, +}; + +DisplayPhotos.defaultProps = { + srcs: [], +}; + +export default DisplayPhotos; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.stories.js new file mode 100644 index 00000000000..9946593f32d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/DisplayPhotos.stories.js @@ -0,0 +1,20 @@ +import React from "react"; + +import DisplayPhotos from "./DisplayPhotos"; + +export default { + title: "Atom/DisplayPhotos", + component: DisplayPhotos, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + srcs: [ + "https://randomwordgenerator.com/img/picture-generator/5ee6d1454b53b10ff3d8992cc12c30771037dbf85254794e722679d49445_640.jpg", + "https://randomwordgenerator.com/img/picture-generator/55e3d1404351ab14f1dc8460962e33791c3ad6e04e507440762a7cd49348cc_640.jpg", + "https://randomwordgenerator.com/img/picture-generator/57e0d1444250a414f1dc8460962e33791c3ad6e04e50744077297bd59445c2_640.jpg", + ], +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.js new file mode 100644 index 00000000000..9958174f10d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.js @@ -0,0 +1,295 @@ +import PropTypes from "prop-types"; +import React, { useEffect, useRef, useState } from "react"; +import { ArrowDown,SearchIcon } from "./svgindex"; + +const TextField = (props) => { + const [value, setValue] = useState(props.selectedVal ? props.selectedVal : ""); + + useEffect(() => { + if (!props.keepNull) + if( props.selectedVal) + setValue(props.selectedVal) + else + { setValue(""); props.setFilter("") } + else setValue(""); + }, [props.selectedVal, props.forceSet]); + + function inputChange(e) { + if (props.freeze) return; + + setValue(e.target.value); + props.setFilter(e.target.value); + } + + function broadcastToOpen() { + if (!props.disable) { + props.dropdownDisplay(true); + } + } + + function broadcastToClose() { + props.dropdownDisplay(false); + } + + /* Custom function to scroll and select in the dropdowns while using key up and down */ + const keyChange = (e) => { + if (e.key == "ArrowDown") { + props.setOptionIndex((state) => (state + 1 == props.addProps.length ? 0 : state + 1)); + if (props.addProps.currentIndex + 1 == props.addProps.length) { + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(0, 0); + } else { + props?.addProps?.currentIndex > 2 && e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0, 45); + } + e.preventDefault(); + } else if (e.key == "ArrowUp") { + props.setOptionIndex((state) => (state !== 0 ? state - 1 : props.addProps.length - 1)); + if (props.addProps.currentIndex == 0) { + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(100000, 100000); + } else { + props?.addProps?.currentIndex > 2 && e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0, -45); + } + e.preventDefault(); + } else if (e.key == "Enter") { + props.addProps.selectOption(props.addProps.currentIndex); + e.preventDefault(); + } + }; + + return ( + { + broadcastToClose(); + props?.onBlur?.(e); + if (props.selectedVal !== props.filterVal) { + setTimeout(() => { + props.setforceSet((val) => val + 1); + }, 1000); + } + }} + onKeyDown={keyChange} + readOnly={props.disable} + autoFocus={props.autoFocus} + placeholder={props.placeholder} + autoComplete={"off"} + style={props.style} + /> + ); +}; + +const translateDummy = (text) => { + return text; +}; + +const Dropdown = (props) => { + const user_type = Digit.SessionStorage.get("userType"); + const [dropdownStatus, setDropdownStatus] = useState(false); + const [selectedOption, setSelectedOption] = useState(props.selected ? props.selected : null); + const [filterVal, setFilterVal] = useState(""); + const [forceSet, setforceSet] = useState(0); + const [optionIndex, setOptionIndex] = useState(-1); + const optionRef = useRef(null); + const hasCustomSelector = props.customSelector ? true : false; + const t = props.t || translateDummy; + + useEffect(() => { + setSelectedOption(props.selected); + }, [props.selected]); + + function dropdownSwitch() { + if (!props.disable) { + var current = dropdownStatus; + if (!current) { + document.addEventListener("mousedown", handleClick, false); + } + setDropdownStatus(!current); + props?.onBlur?.(); + } + } + + function handleClick(e) { + if (!optionRef.current || !optionRef.current.contains(e.target)) { + document.removeEventListener("mousedown", handleClick, false); + setDropdownStatus(false); + } + } + + function dropdownOn(val) { + const waitForOptions = () => setTimeout(() => setDropdownStatus(val), 500); + const timerId = waitForOptions(); + return () => { + clearTimeout(timerId); + }; + } + + function onSelect(val) { + if (val !== selectedOption || props.allowMultiselect) { + props.select(val); + setSelectedOption(val); + setDropdownStatus(false); + } else { + setSelectedOption(val); + setforceSet(forceSet + 1); + } + } + + function setFilter(val) { + setFilterVal(val); + } + + let filteredOption = + (props.option && props.option?.filter((option) => t(option[props.optionKey])?.toUpperCase()?.indexOf(filterVal?.toUpperCase()) > -1)) || []; + function selectOption(ind) { + onSelect(filteredOption[ind]); + } + + if(props.isBPAREG && selectedOption) + { + let isSelectedSameAsOptions = props.option?.filter((ob) => ob?.code === selectedOption?.code)?.length > 0; + if(!isSelectedSameAsOptions) setSelectedOption(null) + } + + return ( +
+ {hasCustomSelector && ( +
+ {props.customSelector} + {props.showArrow && } +
+ )} + {!hasCustomSelector && ( +
+ + {props.showSearchIcon ?null:} + {props.showSearchIcon ?:null} +
+ )} + {dropdownStatus ? ( + props.optionKey ? ( +
+ {filteredOption && + filteredOption.map((option, index) => { + return ( +
onSelect(option)} + > + {option.icon && {option.icon} } + {props.isPropertyAssess?
{props.t ? props.t(option[props.optionKey]) : option[props.optionKey]}
: + {props.t ? props.t(option[props.optionKey]) : option[props.optionKey]}} +
+ ); + })} + {filteredOption && filteredOption.length === 0 && ( +
{ + + }}> + { {props.t ? props.t("CMN_NOOPTION") : "CMN_NOOPTION"}} +
+ )} +
+ ) : ( +
+ {props.option + ?.filter((option) => option?.toUpperCase().indexOf(filterVal?.toUpperCase()) > -1) + .map((option, index) => { + return ( +

onSelect(option)} + > + {option} +

+ ); + })} +
+ ) + ) : null} +
+ ); +}; + +Dropdown.propTypes = { + customSelector: PropTypes.any, + showArrow: PropTypes.bool, + selected: PropTypes.any, + style: PropTypes.object, + option: PropTypes.array, + optionKey: PropTypes.any, + select: PropTypes.any, + t: PropTypes.func, +}; + +Dropdown.defaultProps = { + customSelector: null, + showArrow: true, +}; + +export default Dropdown; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.stories.js new file mode 100644 index 00000000000..0898c7e44e2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Dropdown.stories.js @@ -0,0 +1,18 @@ +import React from "react"; + +import Dropdown from "./Dropdown"; + +export default { + title: "Atom/Dropdown", + component: Dropdown, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + selected: "first", + option: ["first", "second", "third"], + optionKey: 0, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EllipsisMenu.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EllipsisMenu.js new file mode 100644 index 00000000000..a26a49de1da --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EllipsisMenu.js @@ -0,0 +1,33 @@ +import React, { useRef, useState } from "react"; +import { Ellipsis } from "./svgindex"; + +const Menu = ({ menu, displayKey, onSelect }) => ( +
+ {menu.map((item, index) => ( +
onSelect(item)} key={index}> + {item.icon} + {item[displayKey]} +
+ ))} +
+); + +const EllipsisMenu = ({ menuItems, displayKey, onSelect }) => { + const menuRef = useRef(); + const [active, setActive] = useState(false); + Digit.Hooks.useClickOutside(menuRef, () => setActive(false), active); + + function onItemSelect(item) { + setActive(false); + onSelect(item); + } + + return ( +
+ setActive(true)} /> + {active ? : null} +
+ ); +}; + +export default EllipsisMenu; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeAppContainer.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeAppContainer.js new file mode 100644 index 00000000000..3aaed46b4fc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeAppContainer.js @@ -0,0 +1,7 @@ +import React from "react"; + +const EmployeeAppContainer = (props) => { + return
{props.children}
; +}; + +export default EmployeeAppContainer; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeModuleCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeModuleCard.js new file mode 100644 index 00000000000..05bb8f8beea --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EmployeeModuleCard.js @@ -0,0 +1,85 @@ +import React, { Fragment } from "react"; +import { ArrowRightInbox } from "./svgindex"; +import { useHistory, useLocation, Link } from "react-router-dom"; + + +const EmployeeModuleCard = ({ Icon, moduleName, kpis = [], links = [], isCitizen = false, className, styles, longModuleName=false }) => { + const history = useHistory(); + + return ( +
+
+
+ {moduleName} + {Icon} +
+
+ {kpis.length !== 0 && ( +
+ {kpis.map(({ count, label, link }, index) => ( +
+
+ {count || "-"} +
+
+ + {link ? history.push(`${link}`,{count})}>{label} : null} +
+
+ ))} +
+ )} +
+ {links.map(({ count, label, link }, index) => ( + + {link ? {label} : null} + {count ? ( + <> + history.push(`${link}`)}>{count || "-"} + + + + + ) : null} + + ))} +
+
+
+
+ ); +}; + +const ModuleCardFullWidth = ({ moduleName, links = [], isCitizen = false, className, styles, headerStyle, subHeader, subHeaderLink }) => { + return ( +
+
+ +
+
+ {links.map(({ count, label, link }, index) => ( + + {link ? (link?.includes(`${window?.contextPath}/`)?{label}:{label}) : null} + + ))} +
+
+
+
+ ); +}; + +export { EmployeeModuleCard, ModuleCardFullWidth }; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ErrorMessage.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ErrorMessage.js new file mode 100644 index 00000000000..c82e041c9fb --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ErrorMessage.js @@ -0,0 +1,25 @@ +import React, { useEffect, useState } from "react"; + +const ErrorMessage = ({ name, formState, formData, config, setError, clearErrors }) => { + useEffect(() => { + const { pattern, errMsg } = config.inputs.find((i) => i.name === name); + const regex = new RegExp(pattern); + if (!regex.test(formData?.[name]) && pattern) { + setError(name, { type: "pattern", message: errMsg }); + } else { + clearErrors(name); + } + }, [formData?.[name]]); + + return ( + + {Object.keys(formState?.dirtyFields)?.includes(name) || formState?.isSubmitted ? ( +

{formState?.errors?.[name].messsage}

+ ) : ( + + )} + + ); +}; + +export default ErrorMessage; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EventCalendarView.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EventCalendarView.js new file mode 100644 index 00000000000..e4f51b632ad --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/EventCalendarView.js @@ -0,0 +1,14 @@ +import React from "react" + +const EventCalendarView = ({onGroundEventMonth, onGroundEventDate}) => { + return
+
+

{onGroundEventMonth}

+
+
+

{onGroundEventDate}

+
+
+} + +export default EventCalendarView \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/GreyOutText.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/GreyOutText.js new file mode 100644 index 00000000000..a099557d896 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/GreyOutText.js @@ -0,0 +1,5 @@ +import React from "react"; + +const GreyOutText = (props) =>
{props.children}
; + +export default GreyOutText; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Hamburger.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Hamburger.js new file mode 100644 index 00000000000..17bf671d683 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Hamburger.js @@ -0,0 +1,10 @@ +import React from "react"; +import { HamburgerIcon } from "./svgindex"; + +const Hamburger = ({ handleClick, color }) => ( + + + +); + +export default Hamburger; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Header.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Header.js new file mode 100644 index 00000000000..9ea57f5a8ad --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Header.js @@ -0,0 +1,11 @@ +import React from "react"; + +const Header = (props) => { + return ( +
+ {props.children} +
+ ); +}; + +export default Header; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.js new file mode 100644 index 00000000000..328964c3fdc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.js @@ -0,0 +1,26 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const HeaderBar = (props) => { + return ( +
+ {props.start ?
{props.start}
: null} + {props.main ?
{props.main}
: null} + {props.end ?
{props.end}
: null} +
+ ); +}; + +HeaderBar.propTypes = { + start: PropTypes.any, + main: PropTypes.any, + end: PropTypes.any, +}; + +HeaderBar.defaultProps = { + start: "", + main: "", + end: "", +}; + +export default HeaderBar; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.stories.js new file mode 100644 index 00000000000..f9e9cd87430 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HeaderBar.stories.js @@ -0,0 +1,18 @@ +import React from "react"; + +import HeaderBar from "./HeaderBar"; + +export default { + title: "Atom/HeaderBar", + component: HeaderBar, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + start: "First", + main: "Second", + end: "Third", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.js new file mode 100644 index 00000000000..74bfcee80a0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.js @@ -0,0 +1,21 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Link } from "react-router-dom"; + +const HomeLink = ({ to, children }) => ( +
+ {children} +
+); + +HomeLink.propTypes = { + to: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), + children: PropTypes.string, +}; + +HomeLink.defaultProps = { + to: "#", + children: "Link", +}; + +export default HomeLink; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.stories.js new file mode 100644 index 00000000000..96812f9407d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HomeLink.stories.js @@ -0,0 +1,22 @@ +import React from "react"; +import { BrowserRouter as Router } from "react-router-dom"; + +import HomeLink from "./HomeLink"; + +export default { + title: "Atom/HomeLink", + component: HomeLink, +}; + +const Template = (args) => ( + + + +); + +export const Default = Template.bind({}); + +Default.args = { + to: "https://google.com", + children: "Google", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HorizontalNav.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HorizontalNav.js new file mode 100644 index 00000000000..ef6a5c26a8d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/HorizontalNav.js @@ -0,0 +1,42 @@ +import React, {useState} from 'react' +import { useTranslation } from 'react-i18next' + + + + +const HorizontalNav = ({ configNavItems, activeLink, setActiveLink, showNav = false, children, customStyle = {}, customClassName = "", inFormComposer = true, navClassName = "", navStyles = {} }) => { + const { t } = useTranslation() + + const setActive = (item) => { + setActiveLink(item.name) + } + + const MenuItem = ({ item }) => { + let itemComponent = item.code; + + const Item = () => ( + +
{t(itemComponent)}
+
+ ); + + return ( + + ); + }; + return ( +
+ {showNav &&
+ {configNavItems?.map((item, index) => ( +
setActive(item)}> + +
+ ))} +
+ } + {children} +
+ ) +} + +export default HorizontalNav \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageUploadHandler.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageUploadHandler.js new file mode 100644 index 00000000000..906d3af5343 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageUploadHandler.js @@ -0,0 +1,112 @@ +import React, { useCallback, useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; +import Toast from "./Toast"; +import UploadImages from "./UploadImages"; + +export const ImageUploadHandler = (props) => { + // const __initImageIds = Digit.SessionStorage.get("PGR_CREATE_IMAGES"); + // const __initThumbnails = Digit.SessionStorage.get("PGR_CREATE_THUMBNAILS"); + const [image, setImage] = useState(null); + const [uploadedImagesThumbs, setUploadedImagesThumbs] = useState(null); + const [uploadedImagesIds, setUploadedImagesIds] = useState(props.uploadedImages); + + const [rerender, setRerender] = useState(1); + const [imageFile, setImageFile] = useState(null); + const [isDeleting, setIsDeleting] = useState(false); + const [error, setError] = useState(""); + + useEffect(() => { + if (image) { + uploadImage(); + } + }, [image]); + + useEffect(() => { + if (!isDeleting) { + (async () => { + if (uploadedImagesIds !== null) { + await submit(); + setRerender(rerender + 1); + props.onPhotoChange(uploadedImagesIds); + } + })(); + } else { + setIsDeleting(false); + } + }, [uploadedImagesIds]); + + useEffect(() => { + if (imageFile && imageFile.size > 2097152) { + setError("File is too large"); + } else { + setImage(imageFile); + } + }, [imageFile]); + + const addUploadedImageIds = useCallback( + (imageIdData) => { + if (uploadedImagesIds === null) { + var arr = []; + } else { + arr = uploadedImagesIds; + } + return [...arr, imageIdData.data.files[0].fileStoreId]; + }, + [uploadedImagesIds] + ); + + function getImage(e) { + setError(null); + setImageFile(e.target.files[0]); + } + + const uploadImage = useCallback(async () => { + const response = await Digit.UploadServices.Filestorage("property-upload", image, props.tenantId); + setUploadedImagesIds(addUploadedImageIds(response)); + }, [addUploadedImageIds, image]); + + function addImageThumbnails(thumbnailsData) { + var keys = Object.keys(thumbnailsData.data); + var index = keys.findIndex((key) => key === "fileStoreIds"); + if (index > -1) { + keys.splice(index, 1); + } + var thumbnails = []; + // if (uploadedImagesThumbs !== null) { + // thumbnails = uploadedImagesThumbs.length > 0 ? uploadedImagesThumbs.filter((thumb) => thumb.key !== keys[0]) : []; + // } + + const newThumbnails = keys.map((key) => { + return { image: thumbnailsData.data[key].split(",")[2], key }; + }); + + setUploadedImagesThumbs([...thumbnails, ...newThumbnails]); + } + + const submit = useCallback(async () => { + if (uploadedImagesIds !== null && uploadedImagesIds.length > 0) { + const res = await Digit.UploadServices.Filefetch(uploadedImagesIds, props.tenantId); + addImageThumbnails(res); + } + }, [uploadedImagesIds]); + + function deleteImage(img) { + setIsDeleting(true); + var deleteImageKey = uploadedImagesThumbs.filter((o, index) => o.image === img); + + var uploadedthumbs = uploadedImagesThumbs; + var newThumbsList = uploadedthumbs.filter((thumbs) => thumbs != deleteImageKey[0]); + + var newUploadedImagesIds = uploadedImagesIds.filter((key) => key !== deleteImageKey[0].key); + setUploadedImagesThumbs(newThumbsList); + setUploadedImagesIds(newUploadedImagesIds); + Digit.SessionStorage.set("PGR_CREATE_IMAGES", newUploadedImagesIds); + } + + return ( + + {error && setError(null)} />} + o.image) : []} /> + + ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.js new file mode 100644 index 00000000000..adbf068ea9a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.js @@ -0,0 +1,24 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const ImageViewer = (props) => { + return ( +
+ + + + + +
+ ); +}; + +ImageViewer.propTypes = { + imageSrc: PropTypes.string, +}; + +ImageViewer.defaultProps = { + imageSrc: "", +}; + +export default ImageViewer; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.stories.js new file mode 100644 index 00000000000..7cd6864bce1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/ImageViewer.stories.js @@ -0,0 +1,21 @@ +import React from "react"; +import { BrowserRouter as Router } from "react-router-dom"; + +import ImageViewer from "./ImageViewer"; + +export default { + title: "Atom/ImageViewer", + component: ImageViewer, +}; + +const Template = (args) => ( + + + +); + +export const Default = Template.bind({}); + +Default.args = { + imageSrc: "https://randomwordgenerator.com/img/picture-generator/5ee6d1454b53b10ff3d8992cc12c30771037dbf85254794e722679d49445_640.jpg", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxLinks.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxLinks.js new file mode 100644 index 00000000000..0307e267452 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxLinks.js @@ -0,0 +1,33 @@ +import React from "react" +import Card from "../atoms/Card" +import { useTranslation } from "react-i18next"; +import { Link } from "react-router-dom"; + +const InboxLinks = ({logoIcon, headerText, links, customClass}) => { + + const { t } = useTranslation(); + + const GetLogo = () =>
+ + {logoIcon} + {" "} + {t(headerText)} +
+ + return +
+ {GetLogo()} +
+ {links.map(({ link, text, hyperlink = false, accessTo = [] }, index) => { + return ( + + {hyperlink ? {t(text)} : {t(text)}} + + ); + })} +
+
+
+} + +export default InboxLinks \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxSearchLinks.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxSearchLinks.js new file mode 100644 index 00000000000..9d340be0190 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InboxSearchLinks.js @@ -0,0 +1,43 @@ +import React, { useState, useEffect } from "react" +import { useTranslation } from "react-i18next"; +import { Link } from "react-router-dom"; +import { PropertyHouse, BioMetricIcon,WorksMgmtIcon} from "./svgindex"; + +const getIconComponent = (iconName="")=>{ + return require("@egovernments/digit-ui-react-components")?.[iconName]; +} + +const InboxSearchLinks = ({headerText, links, businessService, customClass="", logoIcon}) => { + + const { t } = useTranslation(); + const { roles: userRoles } = Digit.UserService.getUser().info; + const [linksToShow, setLinksToShow] = useState([]); + const IconComponent=getIconComponent(logoIcon?.component); + useEffect(() => { + let linksToShow = links.filter(({ roles }) => roles.some((role) => userRoles.map(({ code }) => code).includes(role)) || !roles?.length); + setLinksToShow(linksToShow); + }, []); + const renderHeader = () =>
+ + {logoIcon?.component && IconComponent && } + + {t(headerText)} +
+ return ( +
+ {renderHeader()} +
+ {linksToShow.map(({ url, text, hyperlink = false}, index) => { + return ( + + {hyperlink ? {t(text)} : {t(text)}} + + ); + })} +
+
+ ) + +} + +export default InboxSearchLinks; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InfoBanner.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InfoBanner.js new file mode 100644 index 00000000000..a56e96e8f0e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InfoBanner.js @@ -0,0 +1,16 @@ +import React from "react"; +import { ErrorSvg, InfoBannerIcon } from "./svgindex"; + +const InfoBanner = ({ label, text }) => { + return ( +
+
+ +

{label}

+
+

{text}

+
+ ); +}; + +export default InfoBanner; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InputTextAmount.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InputTextAmount.js new file mode 100644 index 00000000000..48d6bc940dd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/InputTextAmount.js @@ -0,0 +1,408 @@ +import TextInput from "./TextInput"; + +import React, { forwardRef, useImperativeHandle, useMemo, useRef, useEffect, useState } from "react"; +import { + cleanValue, + fixedDecimalValue, + formatValue, + getLocaleConfig, + getIntlConfig, + getSuffix, + isNumber, + padTrimValue, + repositionCursor, +} from "./amtUtils"; + +/* Amount component by default round offs and formats for amount */ + +const InputTextAmount = ({ value, prefix = "₹ ",intlConfig = getIntlConfig(prefix), onChange, inputRef,...otherProps }) => { + return ; +}; + +export default InputTextAmount; + +export const CurrencyInput = forwardRef( + ( + { + allowDecimals = true, + allowNegativeValue = true, + id, + name, + className, + customInput, + decimalsLimit, + defaultValue, + disabled = false, + maxLength: userMaxLength, + value: userValue, + onValueChange, + fixedDecimalLength, + placeholder, + decimalScale, + prefix, + suffix, + intlConfig, + step, + min, + max, + disableGroupSeparators = false, + disableAbbreviations = false, + decimalSeparator: _decimalSeparator, + groupSeparator: _groupSeparator, + onChange, + onFocus, + onBlur, + onKeyDown, + onKeyUp, + transformRawValue, + otherProps, + inputRef:inputRefFrom, + ...props + }, + ref + ) => { + if (_decimalSeparator && isNumber(_decimalSeparator)) { + throw new Error("decimalSeparator cannot be a number"); + } + + if (_groupSeparator && isNumber(_groupSeparator)) { + throw new Error("groupSeparator cannot be a number"); + } + + const localeConfig = useMemo(() => getLocaleConfig(intlConfig), [intlConfig]); + const decimalSeparator = _decimalSeparator || localeConfig.decimalSeparator || ""; + const groupSeparator = _groupSeparator || localeConfig.groupSeparator || ""; + + if (decimalSeparator && groupSeparator && decimalSeparator === groupSeparator && disableGroupSeparators === false) { + throw new Error("decimalSeparator cannot be the same as groupSeparator"); + } + + const formatValueOptions = { + decimalSeparator, + groupSeparator, + disableGroupSeparators, + intlConfig, + prefix: prefix || localeConfig.prefix, + suffix: suffix, + }; + + const cleanValueOptions = { + decimalSeparator, + groupSeparator, + allowDecimals, + decimalsLimit: decimalsLimit || fixedDecimalLength || 2, + allowNegativeValue, + disableAbbreviations, + prefix: prefix || localeConfig.prefix, + transformRawValue, + }; + + const formattedStateValue = + defaultValue !== undefined && defaultValue !== null + ? formatValue({ ...formatValueOptions, decimalScale, value: String(defaultValue) }) + : userValue !== undefined && userValue !== null + ? formatValue({ ...formatValueOptions, decimalScale, value: String(userValue) }) + : ""; + + const [stateValue, setStateValue] = useState(formattedStateValue); + const [dirty, setDirty] = useState(false); + const [cursor, setCursor] = useState(0); + const [changeCount, setChangeCount] = useState(0); + const [lastKeyStroke, setLastKeyStroke] = useState(null); + const inputRef = useRef(inputRefFrom); + useImperativeHandle(ref, () => inputRef.current); + + /** + * Process change in value + */ + const processChange = (value, selectionStart) => { + setDirty(true); + + const { modifiedValue, cursorPosition } = repositionCursor({ + selectionStart, + value, + lastKeyStroke, + stateValue, + groupSeparator, + }); + + const stringValue = cleanValue({ value: modifiedValue, ...cleanValueOptions }); + + if (userMaxLength && stringValue.replace(/-/g, "").length > userMaxLength) { + return; + } + + if (stringValue === "" || stringValue === "-" || stringValue === decimalSeparator) { + onValueChange && onValueChange(undefined, name, { float: null, formatted: "", value: "" }); + setStateValue(stringValue); + return; + } + + const stringValueWithoutSeparator = decimalSeparator ? stringValue.replace(decimalSeparator, ".") : stringValue; + + const numberValue = parseFloat(stringValueWithoutSeparator); + + const formattedValue = formatValue({ + value: stringValue, + ...formatValueOptions, + }); + + if (cursorPosition !== undefined && cursorPosition !== null) { + // Prevent cursor jumping + let newCursor = cursorPosition + (formattedValue.length - value.length); + newCursor = newCursor <= 0 ? (prefix ? prefix.length : 0) : newCursor; + + setCursor(newCursor); + setChangeCount(changeCount + 1); + } + + setStateValue(formattedValue); + + if (onValueChange) { + const values = { + float: numberValue, + formatted: formattedValue, + value: stringValue, + }; + onValueChange(stringValue, name, values); + } + }; + + /** + * Handle change event + */ + const handleOnChange = (event) => { + const { + target: { value, selectionStart }, + } = event; + + processChange(value, selectionStart); + + onChange && onChange(event); + }; + + /** + * Handle focus event + */ + const handleOnFocus = (event) => { + onFocus && onFocus(event); + return stateValue ? stateValue.length : 0; + }; + + /** + * Handle blur event + * + * Format value by padding/trimming decimals if required by + */ + const handleOnBlur = (event) => { + const { + target: { value }, + } = event; + + const valueOnly = cleanValue({ value, ...cleanValueOptions }); + + if (valueOnly === "-" || !valueOnly) { + setStateValue(""); + onBlur && onBlur(event); + return; + } + + const fixedDecimals = fixedDecimalValue(valueOnly, decimalSeparator, fixedDecimalLength); + + const newValue = padTrimValue(fixedDecimals, decimalSeparator, decimalScale !== undefined ? decimalScale : fixedDecimalLength); + + const numberValue = parseFloat(newValue.replace(decimalSeparator, ".")); + + const formattedValue = formatValue({ + ...formatValueOptions, + value: newValue, + }); + + if (onValueChange) { + onValueChange(newValue, name, { + float: numberValue, + formatted: formattedValue, + value: newValue, + }); + } + + setStateValue(formattedValue); + + onBlur && onBlur(event); + }; + + /** + * Handle key down event + * + * Increase or decrease value by step + */ + const handleOnKeyDown = (event) => { + const { key } = event; + + setLastKeyStroke(key); + + if (step && (key === "ArrowUp" || key === "ArrowDown")) { + event.preventDefault(); + setCursor(stateValue.length); + + const currentValue = + parseFloat( + userValue !== undefined && userValue !== null + ? String(userValue).replace(decimalSeparator, ".") + : cleanValue({ value: stateValue, ...cleanValueOptions }) + ) || 0; + const newValue = key === "ArrowUp" ? currentValue + step : currentValue - step; + + if (min !== undefined && newValue < min) { + return; + } + + if (max !== undefined && newValue > max) { + return; + } + + const fixedLength = String(step).includes(".") ? Number(String(step).split(".")[1].length) : undefined; + + processChange(String(fixedLength ? newValue.toFixed(fixedLength) : newValue).replace(".", decimalSeparator)); + } + + onKeyDown && onKeyDown(event); + }; + + /** + * Handle key up event + * + * Move cursor if there is a suffix to prevent user typing past suffix + */ + const handleOnKeyUp = (event) => { + const { + key, + currentTarget: { selectionStart }, + } = event; + if (key !== "ArrowUp" && key !== "ArrowDown" && stateValue !== "-") { + const suffix = getSuffix(stateValue, { groupSeparator, decimalSeparator }); + + if (suffix && selectionStart && selectionStart > stateValue.length - suffix.length) { + /* istanbul ignore else */ + if (inputRef.current) { + const newCursor = stateValue.length - suffix.length; + inputRef.current.setSelectionRange(newCursor, newCursor); + } + } + } + + onKeyUp && onKeyUp(event); + }; + + useEffect(() => { + // prevent cursor jumping if editing value + if (dirty && stateValue !== "-" && inputRef.current && document.activeElement === inputRef.current) { + inputRef.current.setSelectionRange(cursor, cursor); + } + }, [stateValue, cursor, inputRef, dirty, changeCount]); + + /** + * If user has only entered "-" or decimal separator, + * keep the char to allow them to enter next value + */ + const getRenderValue = () => { + if (userValue !== undefined && userValue !== null && stateValue !== "-" && (!decimalSeparator || stateValue !== decimalSeparator)) { + return formatValue({ + ...formatValueOptions, + decimalScale: dirty ? undefined : decimalScale, + value: String(userValue), + }); + } + + return stateValue; + }; + + const inputProps = { + type: "text", + inputMode: "decimal", + id, + name, + className, + onChange: handleOnChange, + onBlur: handleOnBlur, + onFocus: handleOnFocus, + onKeyDown: handleOnKeyDown, + onKeyUp: handleOnKeyUp, + placeholder, + disabled, + value: getRenderValue(), + ref: inputRef, + ...props, + }; + + if (customInput) { + const CustomInput = customInput; + return ; + } + + return ; + } +); + +CurrencyInput.displayName = "CurrencyInput"; + +export const InputAmountWrapper = ({ref,...props}) => { + const limit = 1000; + const prefix = props?.prefix; + + const [errorMessage, setErrorMessage] = useState(""); + const [className, setClassName] = useState(""); + const [value, setValue] = useState(props?.defaultValue); + const [values, setValues] = useState(); + const [rawValue, setRawValue] = useState(" "); + + useEffect(() => { + props.onValueChange(value); + }, [value]); + + /** + * Handle validation + */ + const handleOnValueChange = (value, _, values) => { + setValues(values); + setRawValue(value === undefined ? "undefined" : value || " "); + + if (!value) { + setClassName(""); + setValue(""); + return; + } + + if (Number.isNaN(Number(value))) { + // setErrorMessage('Please enter a valid number'); + // setClassName('is-invalid'); + return; + } + + if (Number(value) > limit) { + // setErrorMessage(`Max: ${prefix}${limit}`); + // setClassName('is-invalid'); + setValue(value); + return; + } + + // setClassName('is-valid'); + setValue(value); + }; + + return ( + + ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.js new file mode 100644 index 00000000000..f8f9d1c0076 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.js @@ -0,0 +1,38 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { UnMaskComponent } from ".."; +const KeyNote = ({ keyValue, note, caption, noteStyle, children, privacy }) => { + return ( +
+

{keyValue}

+
+

{note}

+ { privacy && ( + + {/* + Feature :: Privacy + privacy object set to the Mask Component + */} + + + )} +
+

{caption}

+ {children} +
+ ); +}; + +KeyNote.propTypes = { + keyValue: PropTypes.string, + note: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + noteStyle: PropTypes.any, +}; + +KeyNote.defaultProps = { + keyValue: "", + note: "", + noteStyle: {}, +}; + +export default KeyNote; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.stories.js new file mode 100644 index 00000000000..666f23cd024 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/KeyNote.stories.js @@ -0,0 +1,17 @@ +import React from "react"; + +import KeyNote from "./KeyNote"; + +export default { + title: "Atom/KeyNote", + component: KeyNote, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + keyValue: "note1", + note: "My first note", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Label.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Label.js new file mode 100644 index 00000000000..88f27bef117 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Label.js @@ -0,0 +1,7 @@ +import React from "react"; + +const Label = (props) => { + return

{props.children}

; +}; + +export default Label; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LabelFieldPair.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LabelFieldPair.js new file mode 100644 index 00000000000..7548b9c38b9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LabelFieldPair.js @@ -0,0 +1,11 @@ +import React from "react"; + +const LabelFieldPair = (props) => { + return ( +
+ {props.children} +
+ ); +}; + +export default LabelFieldPair; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.js new file mode 100644 index 00000000000..427fa0bc808 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.js @@ -0,0 +1,25 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const LinkButton = (props) => { + return ( + + {props.label} + + ); +}; + +LinkButton.propTypes = { + /** + * LinkButton contents + */ + label: PropTypes.any, + /** + * Optional click handler + */ + onClick: PropTypes.func, +}; + +LinkButton.defaultProps = {}; + +export default LinkButton; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.stories.js new file mode 100644 index 00000000000..b07c5b09df9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkButton.stories.js @@ -0,0 +1,16 @@ +import React from "react"; + +import LinkButton from "./LinkButton"; + +export default { + title: "Atom/LinkButton", + component: LinkButton, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + label: "Link", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkLabel.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkLabel.js new file mode 100644 index 00000000000..f008e2c7ea1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LinkLabel.js @@ -0,0 +1,11 @@ +import React from "react"; + +const LinkLabel = (props) => { + return ( + + ); +}; + +export default LinkLabel; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.js new file mode 100644 index 00000000000..062bf7ecc3e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.js @@ -0,0 +1,23 @@ +import React from "react"; +import PropTypes from "prop-types"; + +export const Loader = ({ page = false }) => ( +
+
+
+
+
+
+
+); + +Loader.propTypes = { + /** + * Is this is page or a module? + */ + page: PropTypes.bool, +}; + +Loader.defaultProps = { + page: false, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.stories.js new file mode 100644 index 00000000000..b5200ae1b3b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Loader.stories.js @@ -0,0 +1,20 @@ +import React from "react"; + +import { Loader } from "./Loader"; + +export default { + title: "Atom/Loader", + component: Loader, +}; + +const Template = (args) => ; + +export const Module = Template.bind({}); +Module.args = { + page: false, +}; + +export const Page = Template.bind({}); +Page.args = { + page: true, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LocationSearch.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LocationSearch.js new file mode 100644 index 00000000000..86f321eb310 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/LocationSearch.js @@ -0,0 +1,394 @@ +import React, { useEffect } from "react"; +import { SearchIconSvg } from "./svgindex"; +import { Loader } from "@googlemaps/js-api-loader"; + +let defaultBounds = {}; + +const updateDefaultBounds = (center) => { + if (!center.lat || !center.lng) { + return; + } + defaultBounds = { + north: center.lat + 0.1, + south: center.lat - 0.1, + east: center.lng + 0.1, + west: center.lng - 0.1, + }; +}; +const GetPinCode = (places) => { + let postalCode = null; + places?.address_components?.forEach((place) => { + let hasPostalCode = place.types.includes("postal_code"); + postalCode = hasPostalCode ? place.long_name : null; + }); + return postalCode; +}; + +const getName = (places) => { + let name = ""; + places?.address_components?.forEach((place) => { + let hasName = place.types.includes("sublocality_level_2") || place.types.includes("sublocality_level_1"); + if (hasName) { + name = hasName ? place.long_name : null; + } + }); + return name; +}; + +const loadGoogleMaps = (callback) => { + const key = globalConfigs?.getConfig("GMAPS_API_KEY"); + const loader = new Loader({ + apiKey: key, + version: "weekly", + libraries: ["places"], + }); + + loader + .load() + .then(() => { + if (callback) callback(); + }) + .catch((e) => { + // do something + }); +}; + +const mapStyles = [ + { + elementType: "geometry", + stylers: [ + { + color: "#f5f5f5", + }, + ], + }, + { + elementType: "labels.icon", + stylers: [ + { + visibility: "off", + }, + ], + }, + { + elementType: "labels.text.fill", + stylers: [ + { + color: "#616161", + }, + ], + }, + { + elementType: "labels.text.stroke", + stylers: [ + { + color: "#f5f5f5", + }, + ], + }, + { + featureType: "administrative.land_parcel", + elementType: "labels.text.fill", + stylers: [ + { + color: "#bdbdbd", + }, + ], + }, + { + featureType: "poi", + elementType: "geometry", + stylers: [ + { + color: "#eeeeee", + }, + ], + }, + { + featureType: "poi", + elementType: "labels.text.fill", + stylers: [ + { + color: "#757575", + }, + ], + }, + { + featureType: "poi.park", + elementType: "geometry", + stylers: [ + { + color: "#e5e5e5", + }, + ], + }, + { + featureType: "poi.park", + elementType: "labels.text.fill", + stylers: [ + { + color: "#9e9e9e", + }, + ], + }, + { + featureType: "road", + elementType: "geometry", + stylers: [ + { + color: "#ffffff", + }, + ], + }, + { + featureType: "road.arterial", + elementType: "labels.text.fill", + stylers: [ + { + color: "#757575", + }, + ], + }, + { + featureType: "road.highway", + elementType: "geometry", + stylers: [ + { + color: "#dadada", + }, + ], + }, + { + featureType: "road.highway", + elementType: "labels.text.fill", + stylers: [ + { + color: "#616161", + }, + ], + }, + { + featureType: "road.local", + elementType: "labels.text.fill", + stylers: [ + { + color: "#9e9e9e", + }, + ], + }, + { + featureType: "transit.line", + elementType: "geometry", + stylers: [ + { + color: "#e5e5e5", + }, + ], + }, + { + featureType: "transit.station", + elementType: "geometry", + stylers: [ + { + color: "#eeeeee", + }, + ], + }, + { + featureType: "water", + elementType: "geometry", + stylers: [ + { + color: "#c9c9c9", + }, + ], + }, + { + featureType: "water", + elementType: "labels.text.fill", + stylers: [ + { + color: "#9e9e9e", + }, + ], + }, +]; + +const setLocationText = (location, onChange, isPlaceRequired=false) => { + const geocoder = new google.maps.Geocoder(); + geocoder.geocode( + { + location, + }, + function (results, status) { + if (status === "OK") { + if (results[0]) { + let pincode = GetPinCode(results[0]); + const infoWindowContent = document.getElementById("pac-input"); + infoWindowContent.value = getName(results[0]); + if (onChange) { + if(isPlaceRequired) + onChange(pincode, { longitude: location.lng, latitude: location.lat }, infoWindowContent.value); + else + onChange(pincode, { longitude: location.lng, latitude: location.lat }); + } + } + } + } + ); +}; + +const onMarkerDragged = (marker, onChange, isPlaceRequired = false) => { + if (!marker) return; + const { latLng } = marker; + const currLat = latLng.lat(); + const currLang = latLng.lng(); + const location = { + lat: currLat, + lng: currLang, + }; + if(isPlaceRequired) + setLocationText(location, onChange, true); + else + setLocationText(location, onChange); +}; + +const initAutocomplete = (onChange, position, isPlaceRequired=false) => { + const map = new window.google.maps.Map(document.getElementById("map"), { + center: position, + zoom: 15, + mapTypeId: "roadmap", + styles: mapStyles, + }); // Create the search box and link it to the UI element. + + const input = document.getElementById("pac-input"); + updateDefaultBounds(position); + const options = { + bounds: defaultBounds, + componentRestrictions: { country: "in" }, + fields: ["address_components", "geometry", "icon", "name"], + origin: position, + strictBounds: false, + types: ["address"], + }; + const searchBox = new window.google.maps.places.Autocomplete(input, options); + // map.controls[google.maps.ControlPosition.TOP_LEFT].push(input); // Bias the SearchBox results towards current map's viewport. + + map.addListener("bounds_changed", () => { + searchBox.setBounds(map.getBounds()); + }); + + let markers = [ + new window.google.maps.Marker({ + map, + title: "a", + position: position, + draggable: true, + clickable: true, + }), + ]; + + if(isPlaceRequired) + setLocationText(position, onChange,true); + else + setLocationText(position, onChange); + + // Listen for the event fired when the user selects a prediction and retrieve + // more details for that place. + markers[0].addListener("dragend", (marker) => onMarkerDragged(marker, onChange, isPlaceRequired)); + searchBox.addListener("place_changed", () => { + const place = searchBox.getPlace(); + + if (!place) { + return; + } // Clear out the old markers. + let pincode = GetPinCode(place); + if (pincode) { + const { geometry } = place; + const geoLocation = { + latitude: geometry.location.lat(), + longitude: geometry.location.lng(), + }; + if(isPlaceRequired) + onChange(pincode, geoLocation, place.name); + else + onChange(pincode, geoLocation); + } + markers.forEach((marker) => { + marker.setMap(null); + }); + markers = []; // For each place, get the icon, name and location. + + const bounds = new window.google.maps.LatLngBounds(); + if (!place.geometry) { + return; + } + + markers.push( + new window.google.maps.Marker({ + map, + title: place.name, + position: place.geometry.location, + draggable: true, + clickable: true, + }) + ); + markers[0].addListener("dragend", (marker) => onMarkerDragged(marker, onChange, isPlaceRequired)); + if (place.geometry.viewport) { + // Only geocodes have viewport. + bounds.union(place.geometry.viewport); + } else { + bounds.extend(place.geometry.location); + } + + map.fitBounds(bounds); + }); +}; + +const LocationSearch = (props) => { + useEffect(() => { + async function mapScriptCall() { + const getLatLng = (position) => { + initAutocomplete(props.onChange, { lat: position.coords.latitude, lng: position.coords.longitude }, props.isPlaceRequired); + }; + const getLatLngError = (error) => { + let defaultLatLong = {}; + if (props?.isPTDefault) { + defaultLatLong = props?.PTdefaultcoord?.defaultConfig || { lat: 31.6160638, lng: 74.8978579 }; + } else { + defaultLatLong = { + lat: 31.6160638, + lng: 74.8978579, + }; + } + initAutocomplete(props.onChange, defaultLatLong, props.isPlaceRequired); + }; + + const initMaps = () => { + if (props.position?.latitude && props.position?.longitude) { + getLatLng({ coords: props.position }); + } else if (navigator?.geolocation) { + navigator.geolocation.getCurrentPosition(getLatLng, getLatLngError); + } else { + getLatLngError(); + } + }; + + loadGoogleMaps(initMaps); + } + mapScriptCall(); + }, []); + + return ( +
+
+ {/* */} + + +
+
+
+ ); +}; + +export default LocationSearch; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.js new file mode 100644 index 00000000000..34722b99ce3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.js @@ -0,0 +1,30 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const Menu = (props) => { + const keyPrefix = props.localeKeyPrefix || "CS_ACTION"; + + return ( +
+ {props.options.map((option, index) => { + return ( +
props.onSelect(option)}> +

{props.t ? props.t(Digit.Utils.locale.getTransformedLocale(option.forcedName || `${keyPrefix}_${props.optionKey ? option[props.optionKey] : option}`)) : option}

+
+ ); + })} +
+ ); +}; + +Menu.propTypes = { + options: PropTypes.array, + onSelect: PropTypes.func, +}; + +Menu.defaultProps = { + options: [], + onSelect: () => {}, +}; + +export default Menu; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.stories.js new file mode 100644 index 00000000000..36f6d1f78c3 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Menu.stories.js @@ -0,0 +1,15 @@ +import React from "react"; + +import Menu from "./Menu"; + +export default { + title: "Atom/Menu", + component: Menu, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); +Default.args = { + options: ["first", "second", "third"], +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MobileNumber.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MobileNumber.js new file mode 100644 index 00000000000..9686908db5f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MobileNumber.js @@ -0,0 +1,67 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const MobileNumber = (props) => { + const user_type = Digit.SessionStorage.get("userType"); + + const onChange = (e) => { + let val = e.target.value; + if (isNaN(val) || [" ", "e", "E"].some((e) => val.includes(e)) || val.length > (props.maxLength || 10)) { + val = val.slice(0, -1); + } + props?.onChange?.(val); + }; + + return ( + +
+ {!props.hideSpan ? ( + + +91 + + ) : null} +
+ +
+
+
+ ); +}; + +MobileNumber.propTypes = { + userType: PropTypes.string, + isMandatory: PropTypes.bool, + name: PropTypes.string, + placeholder: PropTypes.string, + onChange: PropTypes.func, + ref: PropTypes.func, + value: PropTypes.any, +}; + +MobileNumber.defaultProps = { + isMandatory: false, +}; + +export default MobileNumber; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/WorkflowPopup.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/WorkflowPopup.js new file mode 100644 index 00000000000..dc73540c26a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/WorkflowPopup.js @@ -0,0 +1,112 @@ +import React,{ useState,useEffect } from 'react' +import { Loader } from "../Loader" +import configEstimateModal from './config/configEstimateModal' +import Modal from '../../hoc/Modal' +import { FormComposer } from '../../hoc/FormComposer' + + +const Heading = (props) => { + return

{props.label}

; +}; + +const Close = () => ( + + + + +); + +const CloseBtn = (props) => { + return ( +
+ +
+ ); +}; + + +const WorkflowPopup = ({ applicationDetails,...props}) => { + const { + action, + tenantId, + t, + closeModal, + submitAction, + businessService, + moduleCode + } = props + + const enableAssignee = Digit?.Customizations?.["commonUiConfig"]?.enableHrmsSearch(businessService,action) + // const [approvers,setApprovers] = useState([]) + const [config,setConfig] = useState(null) + const [modalSubmit,setModalSubmit] = useState(true) + //hrms user search + let { isLoading: isLoadingHrmsSearch, isError, error, data: assigneeOptions } = Digit.Hooks.hrms.useHRMSSearch({ roles: action?.assigneeRoles?.toString(), isActive: true }, tenantId, null, null, { enabled: action?.assigneeRoles?.length > 0 && enableAssignee }); + + assigneeOptions = assigneeOptions?.Employees + assigneeOptions?.map(emp => emp.nameOfEmp = emp?.user?.name || t("ES_COMMON_NA")) + + useEffect(() => { + if(businessService==="muster-roll-approval" && action.action==="APPROVE"){ + setModalSubmit(false) + } + }, [businessService]) + + + useEffect(() => { + if(assigneeOptions?.length >=0){ + setConfig( + configEstimateModal(t,action,assigneeOptions,businessService, moduleCode) + ) + } + else { + setConfig( + configEstimateModal(t, action, undefined, businessService, moduleCode) + ) + } + + }, [assigneeOptions]) + + const _submit = (data) => { + //here call an UICustomizaton fn to update the payload for update call(businessService based) + const updatePayload = Digit?.Customizations?.["commonUiConfig"]?.updatePayload(applicationDetails, data, action, businessService) + //calling submitAction + submitAction(updatePayload, action) + + } + + const modalCallBack = (setValue, formData, formState, reset, setError, clearErrors, trigger, getValues) => { + Digit?.Customizations?.["commonUiConfig"]?.enableModalSubmit(businessService,action,setModalSubmit,formData) + } + + if(isLoadingHrmsSearch) return + + return action && config?.form ? ( + } + headerBarEnd={} + actionCancelLabel={t(config.label.cancel)} + actionCancelOnSubmit={closeModal} + actionSaveLabel={t(config.label.submit)} + actionSaveOnSubmit={() => { }} + formId="modal-action" + isDisabled = {!modalSubmit} + > + + + + ) : ( + + ); +} + +export default WorkflowPopup \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/config/configEstimateModal.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/config/configEstimateModal.js new file mode 100644 index 00000000000..bda9ca66040 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/config/configEstimateModal.js @@ -0,0 +1,400 @@ +import Dropdown from '../../Dropdown'; +import { Loader } from '../../Loader'; +import React, { useState } from 'react' + +const configEstimateModal = ( + t, + action, + approvers, + businessService, + moduleCode +) => { + + const {action:actionString} = action + const bsEstimate = Digit?.Customizations?.["commonUiConfig"]?.getBusinessService("estimate"); + const bsContract = Digit?.Customizations?.["commonUiConfig"]?.getBusinessService("contract"); + const bsMuster = Digit?.Customizations?.["commonUiConfig"]?.getBusinessService("muster roll"); + const bsPurchaseBill = Digit?.Customizations?.["commonUiConfig"]?.getBusinessService("works.purchase"); + + const configMap = { + [bsEstimate]: { + "default":{ + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:true + }, + upload:{ + isMandatory:false, + show:true, + allowedFileTypes:/(.*?)(pdf|vnd.openxmlformats-officedocument.wordprocessingml.document|msword|vnd.ms-excel|vnd.openxmlformats-officedocument.spreadsheetml.sheet|csv|jpeg)$/i + } + }, + "REJECT": { + comments: { + isMandatory: true, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "SENDBACK": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "SENDBACKTOORIGINATOR": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "APPROVE": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + } + }, + [bsContract]: { + "default":{ + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:true + }, + upload:{ + isMandatory:false, + show:true, + allowedFileTypes:/(.*?)(pdf|vnd.openxmlformats-officedocument.wordprocessingml.document|msword|vnd.ms-excel|vnd.openxmlformats-officedocument.spreadsheetml.sheet|csv|jpeg)$/i + } + }, + "REJECT": { + comments: { + isMandatory: true, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "SEND_BACK": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "VERIFY_AND_FORWARD": { + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:true + }, + upload:{ + isMandatory:false, + show:true + } + }, + "SEND_BACK_TO_ORIGINATOR": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + "APPROVE": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + } + }, + }, + [bsMuster]:{ + "default":{ + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:true + }, + upload:{ + isMandatory:false, + show:true, + allowedFileTypes:/(.*?)(pdf|vnd.openxmlformats-officedocument.wordprocessingml.document|msword|vnd.ms-excel|vnd.openxmlformats-officedocument.spreadsheetml.sheet|csv|jpeg)$/i + } + }, + "APPROVE": { + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + }, + acceptTerms: { + isMandatory:true, + show:true + } + }, + "REJECT": { + comments: { + isMandatory: true, + show: true, + }, + upload: { + isMandatory: false, + show: true + }, + }, + "SENDBACK":{ + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + }, + acceptTerms: { + isMandatory:false, + show:false + } + }, + "SENDBACKTOCBO":{ + comments: { + isMandatory: false, + show: true, + }, + assignee: { + isMandatory: false, + show: false + }, + upload: { + isMandatory: false, + show: true + }, + acceptTerms: { + isMandatory:false, + show:false + } + } + }, + [bsPurchaseBill]:{ + "default":{ + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:false + }, + upload:{ + isMandatory:false, + show:true + } + }, + "VERIFY_AND_FORWARD":{ + comments:{ + isMandatory:false, + show:true, + }, + assignee:{ + isMandatory:false, + show:true + }, + upload:{ + isMandatory:false, + show:true + } + }, + "REJECT":{ + comments:{ + isMandatory:true, + show:true, + }, + assignee:{ + isMandatory:false, + show:false + }, + upload:{ + isMandatory:false, + show:true + } + } + } + } +//field can have (comments,assignee,upload) + const fetchIsMandatory = (field) => { + + if(configMap?.[businessService]?.[actionString]){ + return configMap?.[businessService]?.[actionString]?.[field]?.isMandatory ? configMap?.[businessService]?.[actionString]?.[field]?.isMandatory : false + }else{ + return configMap?.[businessService]?.default?.[field]?.isMandatory ? configMap?.[businessService]?.default?.[field]?.isMandatory: false + } + } + const fetchIsShow = (field) => { + + if (configMap?.[businessService]?.[actionString]) { + return configMap?.[businessService]?.[actionString]?.[field]?.show ? configMap?.[businessService]?.[actionString]?.[field]?.show : false + } else { + return configMap?.[businessService]?.default?.[field]?.show ? configMap?.[businessService]?.default?.[field]?.show:false + } + + } + + return { + label: { + heading: Digit.Utils.locale.getTransformedLocale(`WF_MODAL_HEADER_${businessService}_${action.action}`), + submit: Digit.Utils.locale.getTransformedLocale(`WF_MODAL_SUBMIT_${businessService}_${action.action}`), + cancel: "WF_MODAL_CANCEL", + }, + form: [ + { + body: [ + { + label: " ", + type: "checkbox", + disable: false, + isMandatory:false, + populators: { + name: "acceptTerms", + title: "MUSTOR_APPROVAL_CHECKBOX", + isMandatory: false, + labelStyles: {marginLeft:"40px"}, + customLabelMarkup: true, + hideInForm: !fetchIsShow("acceptTerms") + } + }, + { + label: t("WF_MODAL_APPROVER"), + type: "dropdown", + isMandatory: fetchIsMandatory("assignee"), + disable: false, + key:"assignees", + populators: { + name: "assignee", + optionsKey: "nameOfEmp", + options: approvers, + hideInForm: !fetchIsShow("assignee"), + "optionsCustomStyle": { + "top": "2.3rem" + } + }, + }, + { + label: t("WF_MODAL_COMMENTS"), + type: "textarea", + isMandatory: fetchIsMandatory("comments"), + populators: { + name: "comments", + hideInForm:!fetchIsShow("comments"), + validation:{ + maxLength:{ + value:1024, + message:t("WORKS_COMMENT_LENGTH_EXCEEDED_1024") + } + } + }, + }, + { + type: "multiupload", + label: t("WORKFLOW_MODAL_UPLOAD_FILES"), + populators: { + name: "documents", + allowedMaxSizeInMB: 5, + maxFilesAllowed: 1, + allowedFileTypes:configMap?.[businessService]?.default?.upload?.allowedFileTypes, + hintText:t("WORKS_DOC_UPLOAD_HINT"), + showHintBelow:true, + customClass: "upload-margin-bottom", + errorMessage: t("WORKS_FILE_UPLOAD_CUSTOM_ERROR_MSG"), + hideInForm:!fetchIsShow("upload") + } + } + ] + } + ] + } +} + +export default configEstimateModal \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/index.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/index.js new file mode 100644 index 00000000000..f3c3cca1608 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Modals/index.js @@ -0,0 +1,13 @@ +import React, { useState, useEffect } from "react"; + + +import WorkflowPopup from "./WorkflowPopup"; + +const ActionModal = (props) => { + //here we can render different modals based on respective modules + return ; + + +}; + +export default ActionModal; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiLink.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiLink.js new file mode 100644 index 00000000000..d62b4bd8269 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiLink.js @@ -0,0 +1,45 @@ +import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react"; +import LinkButton from "./LinkButton"; +import { PrimaryDownlaodIcon } from "./svgindex"; +import { useTranslation } from "react-i18next"; + +const MultiLink = forwardRef(({ className, onHeadClick, displayOptions = false, options, label, icon, showOptions, setShowOptions = () => {}, downloadBtnClassName, downloadOptionsClassName, optionsClassName, style, optionsStyle, reportStyles }, ref) => { + const { t } = useTranslation(); + const menuRef = useRef(); + const [showMenu, setshowMenu] = useState(false); + const handleOnClick = () => { + if(!(setShowOptions.toString().replace(/\s+/g,``) === "function(){}" ||setShowOptions.toString().replace(/\s+/g,``) === "()=>{}")) + { + setShowOptions(false); + setshowMenu(false); + } + } + Digit.Hooks.useClickOutside(menuRef, handleOnClick, showMenu); + + useMemo(() => { + setshowMenu(displayOptions); + },[displayOptions]) + + const MenuWrapper = React.forwardRef((props, ref) => { + return
+ {options.map((option, index) => ( +
option.onClick()} key={index} className={`multilink-option`}> + {option?.icon} + {option.label} +
+ ))} +
+ }) + + return ( +
+
+ {icon ? icon : } + +
+ {showMenu ? : null} +
+ ); +}); + +export default MultiLink; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiSelectDropdown.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiSelectDropdown.js new file mode 100644 index 00000000000..9ed5e1c52b1 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/MultiSelectDropdown.js @@ -0,0 +1,142 @@ +import React, { useEffect, useReducer, useRef, useState } from "react"; +import { ArrowDown, CheckSvg } from "./svgindex"; +import { useTranslation } from "react-i18next"; +import RemoveableTag from "./RemoveableTag"; +const MultiSelectDropdown = ({ options, optionsKey, selected = [], onSelect, defaultLabel = "", defaultUnit = "",BlockNumber=1,isOBPSMultiple=false,props={},isPropsNeeded=false,ServerStyle={}, config}) => { + const [active, setActive] = useState(false); + const [searchQuery, setSearchQuery] = useState(); + const [optionIndex, setOptionIndex] = useState(-1); + const dropdownRef = useRef(); + const { t } = useTranslation(); + + function reducer(state, action){ + switch(action.type){ + case "ADD_TO_SELECTED_EVENT_QUEUE": + return [...state, {[optionsKey]: action.payload?.[1]?.[optionsKey], propsData: action.payload} ] + case "REMOVE_FROM_SELECTED_EVENT_QUEUE": + const newState = state.filter( + (e) => e?.[optionsKey] !== action.payload?.[1]?.[optionsKey] + ); + onSelect(newState.map((e) => e.propsData), props); // Update the form state here + return newState; + case "REPLACE_COMPLETE_STATE": + return action.payload + default: + return state + } + } + + useEffect(() => { + dispatch({type: "REPLACE_COMPLETE_STATE", payload: fnToSelectOptionThroughProvidedSelection(selected) }) + },[selected?.length]) + + function fnToSelectOptionThroughProvidedSelection(selected){ + return selected?.map( e => ({[optionsKey]: e?.[optionsKey], propsData: [null, e]})) + } + + const [alreadyQueuedSelectedState, dispatch] = useReducer(reducer, selected, fnToSelectOptionThroughProvidedSelection) + + useEffect(()=> { + if(!active){ + onSelect(alreadyQueuedSelectedState?.map( e => e.propsData), props) + } + },[active]) + + + function handleOutsideClickAndSubmitSimultaneously(){ + setActive(false) + } + + Digit.Hooks.useClickOutside(dropdownRef, handleOutsideClickAndSubmitSimultaneously , active, {capture: true} ); + const filtOptns = + searchQuery?.length > 0 ? options.filter((option) => t(option[optionsKey]&&typeof option[optionsKey]=="string" && option[optionsKey].toUpperCase()).toLowerCase().indexOf(searchQuery.toLowerCase()) >= 0) : options; + + function onSearch(e) { + setSearchQuery(e.target.value); + } + + function onSelectToAddToQueue(...props){ + const isChecked = arguments[0].target.checked + isChecked ? dispatch({type: "ADD_TO_SELECTED_EVENT_QUEUE", payload: arguments }) : dispatch({type: "REMOVE_FROM_SELECTED_EVENT_QUEUE", payload: arguments }) + } + +/* Custom function to scroll and select in the dropdowns while using key up and down */ + const keyChange = (e) => { + if (e.key == "ArrowDown") { + setOptionIndex(state =>state+1== filtOptns.length?0:state+1); + if(optionIndex+1== filtOptns.length){ + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(0,0) + }else{ + optionIndex>2&& e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0,45) + } + e.preventDefault(); + } else if (e.key == "ArrowUp") { + setOptionIndex(state => state!==0? state - 1: filtOptns.length-1); + if(optionIndex===0){ + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(100000,100000) + }else{ + optionIndex>2&&e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0,-45) + } + e.preventDefault(); + }else if(e.key=="Enter"){ + onSelectToAddToQueue(e,filtOptns[optionIndex]); + } + } + + const MenuItem = ({ option, index }) => ( +
+ selectedOption[optionsKey] === option[optionsKey]) ? true : false} + onChange={(e) => isPropsNeeded?onSelectToAddToQueue(e, option,props):isOBPSMultiple?onSelectToAddToQueue(e, option,BlockNumber):onSelectToAddToQueue(e, option)} + style={{minWidth: "24px", width: "100%"}} + /> +
+ +
+

{t(option[optionsKey]&&typeof option[optionsKey]=="string" && option[optionsKey])}

+
+ ); + + const Menu = () => { + const filteredOptions = + searchQuery?.length > 0 ? options.filter((option) => t(option[optionsKey]&&typeof option[optionsKey]=="string" && option[optionsKey].toUpperCase()).toLowerCase().indexOf(searchQuery.toLowerCase()) >= 0) : options; + return filteredOptions?.map((option, index) => ); + }; + + return ( +
+
+
+ setActive(true)} value={searchQuery} onChange={onSearch} /> +
+

{alreadyQueuedSelectedState.length > 0 ? `${alreadyQueuedSelectedState.length} ${defaultUnit}` : defaultLabel}

+ +
+
+ {active ? ( +
+ +
+ ) : null} + +
+ {config?.isDropdownWithChip ?
+ {alreadyQueuedSelectedState.length > 0 && + alreadyQueuedSelectedState.map((value, index) => { + return onSelectToAddToQueue(e, value,props) + : (e) => onSelectToAddToQueue(e, value) + } />; + })} +
: null} +
+ ); +}; + +export default MultiSelectDropdown; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NavBar.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NavBar.js new file mode 100644 index 00000000000..27b7643d928 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NavBar.js @@ -0,0 +1,194 @@ +import React, { useRef, useState } from "react"; +import { Link, useLocation } from "react-router-dom"; +import { useTranslation } from "react-i18next"; +import SubMenu from "./SubMenu"; +import { + HomeIcon, + BPAHomeIcon, + PersonIcon, + DocumentIconSolid, + DropIcon, + CollectionsBookmarIcons, + FinanceChartIcon, + ComplaintIcon, + SearchIcon, + CollectionIcon, + PropertyHouse, + CaseIcon, + PTIcon, + PGRIcon, + MCollectIcon, + OBPSIcon, + WSICon, + FSMIcon, + Phone, + LogoutIcon, + EditPencilIcon, + LanguageIcon, +} from "./svgindex"; +import { BirthIcon, DeathIcon, FirenocIcon } from ".."; + +const IconsObject = { + CommonPTIcon: , + OBPSIcon: , + propertyIcon: , + TLIcon: , + PGRIcon: , + FSMIcon: , + WSIcon: , + BirthIcon: , + DeathIcon: , + FirenocIcon: , + MCollectIcon: , + BillsIcon: , + home: , + announcement: , + business: , + store: , + assignment: , + receipt: , + "business-center": , + description: , + "water-tap": , + "collections-bookmark": , + "insert-chart": , + edcr: , + collections: , + "open-complaints": , + HomeIcon: , + EditPencilIcon: , + LogoutIcon: , + Phone: , + LanguageIcon: , +}; +const NavBar = ({ open, toggleSidebar, profileItem, menuItems, onClose, Footer, isEmployee, search, setSearch }) => { + const node = useRef(); + const location = useLocation(); + const { pathname } = location; + const { t } = useTranslation(); + Digit.Hooks.useClickOutside(node, open ? onClose : null, open); + + const MenuItem = ({ item }) => { + let itemComponent; + if (item.type === "component") { + itemComponent = item.action; + } else { + itemComponent = item.text; + } + const leftIconArray = item.icon || item.icon?.type?.name; + const leftIcon = leftIconArray ? IconsObject[leftIconArray] : IconsObject.BillsIcon; + const Item = () => ( + + {leftIcon} +
{itemComponent}
+
+ ); + + if (item.type === "external-link") { + return ( + + + + ); + } + if (item.type === "link") { + if (item.link.indexOf(`/${window?.contextPath}`) === -1 && isEmployee) { + const getOrigin = window.location.origin; + return ( + + + + ); + } + return ( + + + + ); + } + + if (item.type === "dynamic") { + if (isEmployee) { + return ; + } + } + return ; + }; + + const renderSearch = () => { + return ( +
+
+
+
+ + setSearch(e.target.value)} + /> +
+
+
+
+ ); + }; + return ( + +
+
+
+ {profileItem} +
+ {isEmployee ? renderSearch() : null} + {menuItems?.map((item, index) => ( +
+ +
+ ))} +
+
{Footer}
+
+
+
+
+
+ ); +}; + +export default NavBar; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NoResultsFound.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NoResultsFound.js new file mode 100644 index 00000000000..fdceb7aef91 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/NoResultsFound.js @@ -0,0 +1,15 @@ +import React from "react"; +import { NoResultsFoundIcon } from "./svgindex"; +import { useTranslation } from "react-i18next"; + +const NoResultsFound = () => { + const {t} = useTranslation(); + return ( +
+ + {t("COMMON_NO_RESULTS_FOUND")} +
+ ) +} + +export default NoResultsFound; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.js new file mode 100644 index 00000000000..5d4555e7dfd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.js @@ -0,0 +1,98 @@ +import React, { useEffect, useRef, useState } from "react"; +import PropTypes from "prop-types"; + +const BACKSPACE = 8; + +const SingleInput = ({ isFocus, onChange, onFocus, value, ...rest }) => { + const inputRef = useRef(); + useEffect(() => { + if (isFocus) { + inputRef.current.focus(); + } + }, [isFocus]); + + return ( + + ); +}; + +const OTPInput = (props) => { + const [activeInput, setActiveInput] = useState(0); + + const isInputValueValid = (value) => { + return typeof value === "string" && value.trim().length === 1; + }; + + const changeCodeAtFocus = (value) => { + const { onChange } = props; + const otp = getOtpValue(); + otp[activeInput] = value[0]; + const otpValue = otp.join(""); + onChange(otpValue); + }; + + const focusNextInput = () => { + setActiveInput((activeInput) => Math.min(activeInput + 1, props.length - 1)); + }; + + const focusPrevInput = () => { + setActiveInput((activeInput) => Math.max(activeInput - 1, 0)); + }; + + const getOtpValue = () => (props.value ? props.value.toString().split("") : []); + + const handleKeyDown = (event) => { + if (event.keyCode === BACKSPACE || event.key === "Backspace") { + event.preventDefault(); + changeCodeAtFocus(""); + focusPrevInput(); + } + }; + + function inputChange(event) { + const { value } = event.target; + changeCodeAtFocus(value); + if (isInputValueValid(value)) { + focusNextInput(); + } + } + + const OTPStack = []; + const otp = getOtpValue(); + for (let i = 0; i < props.length; i++) { + OTPStack.push( + { + setActiveInput(i); + e.target.select(); + }} + value={otp[i]} + /> + ); + } + + return
{OTPStack}
; +}; + +OTPInput.propTypes = { + length: PropTypes.number, +}; + +OTPInput.defaultProps = { + length: 0, +}; + +export default OTPInput; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.stories.js new file mode 100644 index 00000000000..3844f362f09 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OTPInput.stories.js @@ -0,0 +1,16 @@ +import React from "react"; + +import OTPInput from "./OTPInput"; + +export default { + title: "Atom/OTPInput", + component: OTPInput, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + length: 4, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OpenLinkContainer.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OpenLinkContainer.js new file mode 100644 index 00000000000..b7aed26cf55 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/OpenLinkContainer.js @@ -0,0 +1,29 @@ +import React, { useState } from "react"; +import PropTypes from "prop-types"; +import { NotificationBell } from "./svgindex"; + +const OpenLinkContainer = ({ img,}) => { + return ( +
+
+ +
+
+ ); +}; + +OpenLinkContainer.propTypes = { + img: PropTypes.string, +}; + +OpenLinkContainer.defaultProps = { + img: undefined, +}; + +export default OpenLinkContainer; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Paragraph.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Paragraph.js new file mode 100644 index 00000000000..cb1d2dd8526 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Paragraph.js @@ -0,0 +1,11 @@ +import React from "react"; + +const Paragraph = (props) => { + const {value, customClassName, customStyle, inputRef} = props; + + return ( +

{value}

+ ) +} + +export default Paragraph; \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopUp.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopUp.js new file mode 100644 index 00000000000..1180dc8a126 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopUp.js @@ -0,0 +1,7 @@ +import React from "react"; + +const PopUp = ({className, ...props}) => { + return
{props.children}
; +}; + +export default PopUp; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopupHeadingLabel.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopupHeadingLabel.js new file mode 100644 index 00000000000..df950fa20d7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PopupHeadingLabel.js @@ -0,0 +1,20 @@ +import React from "react" + +const PopupHeadingLabel = ({IconSVG, headingLabel, onResetSortForm}) => { + return
+
+ +

{headingLabel}:

+
+ + + + + +
+} + +export default PopupHeadingLabel \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PrivateRoute.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PrivateRoute.js new file mode 100644 index 00000000000..a671b35ebd7 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/PrivateRoute.js @@ -0,0 +1,29 @@ +import React from "react"; +import { Route, Redirect } from "react-router-dom"; + +export const PrivateRoute = ({ component: Component, roles, ...rest }) => { + return ( + { + const user = Digit.UserService.getUser(); + const userType = Digit.UserService.getType(); + function getLoginRedirectionLink (){ + if(userType === "employee"){ + return `/${window?.contextPath}/employee/user/language-selection` + } + else{ + return `/${window?.contextPath}/citizen/login` + } + } + if (!user || !user.access_token) { + // not logged in so redirect to login page with the return url + return ; + } + + // logged in so return component + return ; + }} + /> + ); +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.js new file mode 100644 index 00000000000..5b501fb4afc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.js @@ -0,0 +1,91 @@ +import React, { useEffect, useState } from "react"; +import PropTypes from "prop-types"; +import isEqual from "lodash/isEqual"; +import { useTranslation } from "react-i18next"; + +const RadioButtons = (props) => { + const { t } = useTranslation(); + var selected = props.selectedOption; + function selectOption(value) { + //selected = value; + props.onSelect(value); + } + + return ( +
+ {props?.options?.map((option, ind) => { + if (props?.optionsKey && !props?.isDependent) { + return ( +
+ + selectOption(option)} + disabled={props?.disabled} + name={props.name} + ref={props.inputRef} + /> + + + +
+ ); + } else if (props?.optionsKey && props?.isDependent) { + return ( +
+ + selectOption(option)} + disabled={props?.disabled} + name={props.name} + ref={props.inputRef} + /> + + + +
+ ); + } else { + return ( +
+ + selectOption(option)} + disabled={props?.disabled} + name={props.name} + ref={props.inputRef} + /> + + + +
+ ); + } + })} +
+ ); +}; + +RadioButtons.propTypes = { + selectedOption: PropTypes.any, + onSelect: PropTypes.func, + options: PropTypes.any, + optionsKey: PropTypes.string, + innerStyles: PropTypes.any, + style: PropTypes.any, +}; + +RadioButtons.defaultProps = {}; + +export default RadioButtons; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.stories.js new file mode 100644 index 00000000000..07122bb0e95 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RadioButtons.stories.js @@ -0,0 +1,19 @@ +import React from "react"; + +import RadioButtons from "./RadioButtons"; + +export default { + title: "Atom/RadioButtons", + component: RadioButtons, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + selectedOption: "first", + onSelect: undefined, + options: ["first", "second"], + optionsKey: "", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.js new file mode 100644 index 00000000000..309e3d6e9a5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.js @@ -0,0 +1,45 @@ +import React, { useRef } from "react"; +import { StarFilled } from "./svgindex"; +import { StarEmpty } from "./svgindex"; +import PropTypes from "prop-types"; + +const Rating = (props) => { + var stars = []; + const star = useRef(null); + + for (var i = 1; i <= props.maxRating; i++) { + if (i - props.currentRating <= 0) { + const index = i; + // stars.push(star filledprops.onFeedback(e,ref)}/>) + stars.push( props.onFeedback(e, star, index)} />); + } else if (i - props.currentRating > 0 && i - props.currentRating < 1) { + const index = i; + stars.push( props.onFeedback(e, star, index)} percentage={Math.round(((props.currentRating - parseInt(props.currentRating)) * 100))} />) + } else { + const index = i; + // stars.push(star emptyprops.onFeedback(e,ref)}/>) + stars.push( props.onFeedback(e, star, index)} />); + } + } + + return ( +
+ {props.text ? props.text : ""} {stars} +
+ ); +}; + +Rating.propTypes = { + maxRating: PropTypes.number, + currentRating: PropTypes.number, + onFeedback: PropTypes.func, +}; + +Rating.defaultProps = { + maxRating: 5, + id: '0', + currentRating: 0, + onFeedback: () => {}, +}; + +export default Rating; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.stories.js new file mode 100644 index 00000000000..2aadb7da6b9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Rating.stories.js @@ -0,0 +1,18 @@ +import React from "react"; + +import Rating from "./Rating"; + +export default { + title: "Atom/Rating", + component: Rating, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + maxRating: 5, + currentRating: 0, + onFeedback: () => {}, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Reason.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Reason.js new file mode 100644 index 00000000000..085011dcaca --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Reason.js @@ -0,0 +1,29 @@ +import React,{Fragment} from "react"; +import { useTranslation } from "react-i18next"; +// TODO @Nipun localise +const Reason = ({ headComment, otherComment, additionalComment }) => { + const { t } = useTranslation() + const getMarkup = () => { + if(additionalComment) { + return
+

{t("COMMON_CERTIFY_ONE")}

+
+

+ {t("ES_COMMON_NOTE")}{t("COMMON_CERTIFY_TWO")} +

+
+ + } + else { + return
+

{headComment}

+

{otherComment}

+
+ } + } + return ( + getMarkup() + ); +} + +export default Reason; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RemoveableTag.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RemoveableTag.js new file mode 100644 index 00000000000..1f7fe96fe04 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RemoveableTag.js @@ -0,0 +1,13 @@ +import React from "react"; +import { Close } from "./svgindex"; + +const RemoveableTag = ({ text, onClick, extraStyles,disabled = false }) => ( +
+ {text} + + + +
+); + +export default RemoveableTag; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RoundedLabel.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RoundedLabel.js new file mode 100644 index 00000000000..aa2fa5e0a8a --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/RoundedLabel.js @@ -0,0 +1,5 @@ +import React from "react"; + +const RoundedLabel = ({ count }) => (count ?
{count}
: ); + +export default RoundedLabel; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SVG.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SVG.js new file mode 100644 index 00000000000..b24afb197ae --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SVG.js @@ -0,0 +1,1561 @@ +import { + Rotation3D, + SixFtApart, + Rotate360, + Accessibility, + AccessibilityNew, + Accessible, + AccessibleForward, + AccountBalance, + AccountBalanceWallet, + AccountBox, + AccountCircle, + AddAlert, + AddBusiness, + AddChart, + AddExpense, + AddExpenseTwo, + AddIcCall, + AddLocation, + AddLocationAlt, + AddModerator, + AddRoad, + AddShoppingCart, + AddTask, + AddToDrive, + AdminPanelSettings, + Agriculture, + Alarm, + AlarmAdd, + AlarmOff, + AlarmOn, + AllInbox, + AllOut, + AlternateEmail, + AltRoute, + Analytics, + Anchor, + Android, + Announcement, + Api, + AppBlocking, + AppRegistration, + Approval, + Apps, + AppSettingsAlt, + Architecture, + ArrowBack, + ArrowBackIos, + ArrowCircleDown, + ArrowCircleUp, + ArrowDownward, + ArrowDropDown, + ArrowDropDownCircle, + ArrowDropUp, + ArrowForward, + ArrowForwardIos, + ArrowForwardIosAlt, + ArrowLeft, + ArrowRight, + ArrowRightAlt, + ArrowUpward, + Article, + AspectRatio, + Assessment, + Assignment, + AssignmentInd, + AssignmentLate, + AssignmentReturn, + AssignmentReturned, + AssignmentTurnedIn, + AssistantDirection, + AssistantNavigation, + Atm, + AttachEmail, + Attachment, + Attractions, + AutoDelete, + AutoRenew, + Backup, + BackupTable, + Badge, + BakeryDining, + BatchPrediction, + BeenHere, + BikeScooter, + Book, + Bookmark, + BookmarkBorder, + Bookmarks, + BookOnline, + BreakfastDining, + BrunchDining, + BugReport, + Build, + BuildCircle, + BusAlert, + Business, + Cached, + Cake, + CalendarToday, + CalendarViewDay, + Call, + CallEnd, + CallMade, + CallMerge, + CallMissed, + CallMissedOutgoing, + CallReceived, + CallSplit, + CameraEnhance, + Campaign, + Cancel, + CancelPresentation, + CancelScheduleSend, + CardGiftcard, + CardMembership, + CardTravel, + CarRental, + CarRepair, + Category, + Celebration, + CellWifi, + ChangeHistory, + Chat, + ChatBubble, + ChatBubbleOutline, + Check, + CheckCircle, + CheckCircleOutline, + ChevronLeft, + ChevronRight, + ChromeReaderMode, + CircleNotifications, + Class, + CleanHands, + CleaningServices, + ClearAll, + Clock, + Close, + CloseFullscreen, + Cloud, + CloudCircle, + CloudDone, + CloudDownload, + CloudOff, + CloudQueue, + CloudUpload, + Code, + Comment, + CommentBank, + Commute, + CompareArrows, + CompassCalibration, + Compress, + ConnectWithoutContact, + Construction, + Contactless, + ContactMail, + ContactPage, + ContactPhone, + Contacts, + ContactSupport, + Copyright, + Coronavirus, + CreateNewFolder, + CreditCard, + Cut, + Dangerous, + Dashboard, + DashboardCustomize, + DateRange, + Deck, + Delete, + DeleteForever, + DeleteOutline, + DeliveryDining, + DepartureBoard, + Description, + DesignServices, + DesktopAccessDisabled, + DialerSip, + Dialpad, + DinnerDining, + Directions, + DirectionsBike, + DirectionsBoat, + DirectionsBus, + DirectionsCar, + DirectionsRailway, + DirectionsRun, + DirectionsSubway, + DirectionsTransit, + DirectionsWalk, + DisabledByDefault, + Dns, + Domain, + DomainDisabled, + DomainVerification, + Done, + DoneAll, + DoneOutline, + DonutLarge, + DonutSmall, + DoubleArrow, + DragIndicator, + DriveFileMove, + DriveFileMoveOutline, + DriveFileRenameOutline, + DriveFolderUpload, + DryCleaning, + DSOTruck, + Duo, + DynamicForm, + East, + Eco, + Edit, + EditAttributes, + EditLocation, + EditOff, + EditRoad, + Eject, + Elderly, + ElectricalServices, + ElectricBike, + ElectricCar, + ElectricMoped, + ElectricRickshaw, + ElectricScooter, + Email, + EmojiEmotions, + EmojiEvents, + EmojiFlags, + EmojiFoodBeverage, + EmojiNature, + EmojiObjects, + EmojiPeople, + EmojiSymbols, + EmojiTransportation, + Engineering, + Error, + ErrorOutline, + EuroSymbol, + Event, + EventSeat, + EvStation, + ExitToApp, + Expand, + ExpandLess, + ExpandMore, + Explore, + ExploreOff, + Extension, + Face, + Facebook, + FactCheck, + Fastfood, + Favorite, + FavoriteBorder, + Feedback, + Festival, + File, + FileDownload, + FileDownloadDone, + FilePresent, + FileUpload, + FilterAlt, + FilterListAlt, + FindInPage, + FindReplace, + Fingerprint, + Fireplace, + FirstPageAlt, + FirstPage, + FitScreen, + Flaky, + Flight, + FlightLand, + FlightTakeoff, + FlipToBack, + FlipToFront, + Folder, + FolderOpen, + FolderShared, + FollowTheSigns, + Forum, + ForwardToInbox, + Fullscreen, + FullscreenExit, + Gavel, + GetApp, + Gif, + Grade, + Grading, + GridView, + Group, + GroupAdd, + Groups, + GroupWork, + GTranslate, + Hail, + Handyman, + Hardware, + Help, + HelpCenter, + HelpOutline, + HighlightAlt, + HighlightOff, + History, + HistoryEdu, + HistoryToggleOff, + Home, + HomeFilled, + HomeRepairService, + HomeWork, + HorizontalSplit, + Hotel, + HourglassBottom, + HourglassDisabled, + HourglassEmpty, + HourglassFull, + HourglassTop, + Http, + Https, + Hvac, + Icecream, + IconSwerage, + IconSwerageAlt, + ImportantDevices, + ImportContacts, + ImportExport, + Info, + InfoOutline, + Input, + IntegrationInstructions, + InvertColors, + InvertColorsOff, + IosShare, + KingBed, + Label, + LabelImportant, + LabelImportantOutline, + LabelOff, + LabelOutline, + TranslateLanguage, + Language, + LastPageAlt, + LastPage, + Launch, + Layers, + LayersClear, + Leaderboard, + LegendToggle, + Lightbulb, + LightbulbOutline, + LineStyle, + LineWeight, + Liquor, + List, + ListAlt, + LiveHelp, + LocalActivity, + LocalAirport, + LocalAtm, + LocalBar, + LocalCafe, + LocalCarWash, + LocalConvenienceStore, + LocalDining, + LocalDrink, + LocalFireDepartment, + LocalFlorist, + LocalGasStation, + LocalGroceryStore, + LocalHospital, + LocalHotel, + LocalLaundryService, + LocalLibrary, + LocalMall, + LocalMovies, + LocalOffer, + LocalParking, + LocalPharmacy, + LocalPhone, + LocalPizza, + LocalPlay, + LocalPolice, + LocalPostOffice, + LocalPrintshop, + LocalSee, + LocalShipping, + LocalTaxi, + LocationCity, + LocationOff, + LocationOn, + LocationPin, + Lock, + LockClock, + LockOpen, + LockOutline, + Login, + Logout, + Loyalty, + Luggage, + LunchDining, + MailOutline, + Map, + MapsUgc, + MarkAsUnread, + MarkChatRead, + MarkChatUnread, + MarkEmailRead, + MarkEmailUnread, + MarkunreadMailbox, + Masks, + Maximize, + Mediation, + MedicalServices, + Menu, + MenuBook, + MenuOpen, + Message, + MilitaryTech, + Minimize, + MiscellaneousServices, + MobileScreenShare, + ModelTraining, + Money, + Mood, + MoodBad, + Moped, + MoreHoriz, + MoreTime, + MoreVert, + MultipleStop, + Museum, + MyLocation, + Nat, + Navigation, + NearMe, + NearMeDisabled, + NextPlan, + Nightlife, + NightlightRound, + NightsStay, + NoLuggage, + NoMeals, + NoResultsFoundIcon, + NoMealsOuline, + North, + NorthEast, + NorthWest, + NoSim, + NotAccessible, + NoteAdd, + NotificationImportant, + Notifications, + NotificationsActive, + NotificationsNone, + NotificationsOff, + NotificationsPaused, + NotListedLocation, + NoTransfer, + NotStarted, + TorchNoun, + OfflineBolt, + OfflinePin, + OfflineShare, + OnlinePrediction, + Opacity, + OpenInBrowser, + OpenInFull, + OpenInNew, + OpenWith, + Outbond, + Outbox, + OutdoorGrill, + OutgoingMail, + Outlet, + Pages, + Pageview, + PanTool, + Park, + PartyMode, + PausePresentation, + Payment, + Payments, + PedalBike, + Pending, + PendingActions, + People, + PeopleAlt, + PeopleOutline, + PermCameraMic, + PermContactCalendar, + PermDataSetting, + PermDeviceInformation, + PermIdentity, + PermMedia, + PermPhoneMsg, + PermScanWifi, + Person, + PersonAdd, + PersonAddAlt, + PersonAddSecondary, + PersonAddDisabled, + PersonOutline, + PersonPin, + PersonPinCircle, + PersonRemove, + PersonRemoveAlt, + PersonSearch, + PestControl, + PestControlRodent, + Pets, + Phone, + PhoneDisabled, + PhoneEnabled, + PhonelinkErase, + PhonelinkLock, + PhonelinkRing, + PhonelinkSetup, + PictureInPicture, + PictureInPictureAlt, + PinDrop, + PivotTableChart, + Place, + Plagiarism, + PlayForWork, + Plumbing, + PlusOne, + Poll, + Polymer, + Population, + PortableWifiOff, + PowerSettingsNew, + PregnantWoman, + PresentToAll, + Preview, + Print, + PrintDisabled, + PrivacyTip, + Psychology, + Public, + PublicOff, + PublishedWithChanges, + QrCode, + QrCodeScanner, + QueryBuilder, + QuestionAnswer, + Quickreply, + RailwayAlert, + RamenDining, + RateReview, + ReadMore, + Receipt, + Recommend, + RecordVoiceOver, + Redeem, + ReduceCapacity, + Refresh, + RemoveDone, + RemoveModerator, + RemoveShoppingCart, + Reorder, + ReportProblem, + RequestPage, + RequestQuote, + Restaurant, + RestaurantMenu, + Restore, + RestoreFromTrash, + RestorePage, + RingVolume, + Room, + RoundedCorner, + Rowing, + RssFeed, + Rtt, + Rule, + RuleFolder, + RunCircle, + Sanitizer, + Satellite, + SavedSearch, + Schedule, + ScheduleSend, + School, + Science, + ScreenShare, + Search, + SearchOff, + Segment, + SelfImprovement, + SendAndArchive, + SentimentDissatisfied, + SentimentNeutral, + SentimentSatisfied, + SentimentSatisfiedAlt, + SentimentVeryDissatisfied, + SentimentVerySatisfied, + SetMeal, + Settings, + SettingsApplications, + SettingsBackupRestore, + SettingsBluetooth, + SettingsBrightness, + SettingsCell, + SettingsEthernet, + SettingsInputAntenna, + SettingsInputComponent, + SettingsInputComposite, + SettingsInputHdmi, + SettingsInputVideo, + SettingsOverscan, + SettingsPhone, + SettingsPower, + SettingsRemote, + SettingsVoice, + Share, + Shop, + ShoppingBag, + ShoppingBasket, + ShoppingCart, + ShopAlt, + Sick, + SingleBed, + SmartButton, + SnippetFolder, + Source, + South, + SouthEast, + SouthWest, + SpeakerNotes, + SpeakerNotesOff, + SpeakerPhone, + SpellCheck, + Sports, + SportsBaseball, + SportsBasketball, + SportsCricket, + SportsEsports, + SportsFootball, + SportsGolf, + SportsHandball, + SportsHockey, + SportsKabaddi, + SportsMma, + SportsMotorsports, + SportsRugby, + SportsSoccer, + SportsTennis, + SportsVolleyball, + StarRate, + Stars, + StayCurrentLandscape, + StayCurrentPortrait, + StayPrimaryLandscape, + StayPrimaryPortrait, + StickyNotesSecondary, + ScreenShareStop, + Store, + StoreMallDirectory, + StreetView, + SubdirectoryArrowLeft, + SubdirectoryArrowRight, + Subject, + SubtitlesOff, + Subway, + SupervisedUserCircle, + SupervisorAccount, + Support, + SwapCalls, + SwapHorizontal, + SwapHorizontalCircle, + SwapVertical, + SwapVerticalCircle, + Swipe, + SwitchAccount, + SwitchLeft, + SwitchRight, + SyncAlt, + SystemUpdateAlt, + Tab, + TableView, + TabUnselected, + TakeOutDining, + TaxiAlert, + Terrain, + TextRotateUp, + TextRotateVertical, + TextRotationAngleDown, + TextRotationAngleUp, + TextRotationDown, + TextRotationNone, + SMSText, + TextSnippet, + TheaterComedy, + Theaters, + ThumbDown, + ThumbDownAlt, + ThumbDownOffAlt, + ThumbsUpDown, + ThumbUp, + ThumbUpAlt, + ThumbUpOffAlt, + Timeline, + Toc, + Today, + Toll, + Topic, + Torch, + TouchApp, + Tour, + TrackChanges, + Traffic, + Train, + Tram, + TransferWithinStation, + TransitEnterExit, + Translate, + TrendingDown, + TrendingFlat, + TrendingUp, + TripOrigin, + TurnedIn, + TurnedInNot, + TwoWheeler, + UnfoldLess, + UnfoldMore, + Unpublished, + Unsubscribe, + Update, + UpdateExpense, + UpdateExpenseSecondary, + Upgrade, + UploadFile, + Verified, + VerifiedUser, + VerticalSplit, + ViewAgenda, + ViewArray, + ViewCarousel, + ViewColumn, + ViewDay, + ViewHeadline, + ViewInAr, + ViewList, + ViewModule, + ViewQuilt, + ViewSidebar, + ViewStream, + ViewWeek, + Visibility, + VisibilityOff, + Voicemail, + VoiceOverOff, + VolunteerActivism, + VpnKey, + Warning, + WatchLater, + WaterfallChart, + West, + Whatsapp, + Whatshot, + WifiCalling, + WifiProtectedSetup, + WineBar, + Work, + WorkOff, + WorkOutline, + WorkspacesFilled, + WorkspacesOutline, + WrongLocation, + Wysiwyg, + YoutubeSearchedFor, + ZoomIn, + ZoomOut, + ZoomOutMap, + } from "@egovernments/digit-ui-svg-components"; + + + + export const SVG={ + Rotation3D, + SixFtApart, + Rotate360, + Accessibility, + AccessibilityNew, + Accessible, + AccessibleForward, + AccountBalance, + AccountBalanceWallet, + AccountBox, + AccountCircle, + AddAlert, + AddBusiness, + AddChart, + AddExpense, + AddExpenseTwo, + AddIcCall, + AddLocation, + AddLocationAlt, + AddModerator, + AddRoad, + AddShoppingCart, + AddTask, + AddToDrive, + AdminPanelSettings, + Agriculture, + Alarm, + AlarmAdd, + AlarmOff, + AlarmOn, + AllInbox, + AllOut, + AlternateEmail, + AltRoute, + Analytics, + Anchor, + Android, + Announcement, + Api, + AppBlocking, + AppRegistration, + Approval, + Apps, + AppSettingsAlt, + Architecture, + ArrowBack, + ArrowBackIos, + ArrowCircleDown, + ArrowCircleUp, + ArrowDownward, + ArrowDropDown, + ArrowDropDownCircle, + ArrowDropUp, + ArrowForward, + ArrowForwardIos, + ArrowForwardIosAlt, + ArrowLeft, + ArrowRight, + ArrowRightAlt, + ArrowUpward, + Article, + AspectRatio, + Assessment, + Assignment, + AssignmentInd, + AssignmentLate, + AssignmentReturn, + AssignmentReturned, + AssignmentTurnedIn, + AssistantDirection, + AssistantNavigation, + Atm, + AttachEmail, + Attachment, + Attractions, + AutoDelete, + AutoRenew, + Backup, + BackupTable, + Badge, + BakeryDining, + BatchPrediction, + BeenHere, + BikeScooter, + Book, + Bookmark, + BookmarkBorder, + Bookmarks, + BookOnline, + BreakfastDining, + BrunchDining, + BugReport, + Build, + BuildCircle, + BusAlert, + Business, + Cached, + Cake, + CalendarToday, + CalendarViewDay, + Call, + CallEnd, + CallMade, + CallMerge, + CallMissed, + CallMissedOutgoing, + CallReceived, + CallSplit, + CameraEnhance, + Campaign, + Cancel, + CancelPresentation, + CancelScheduleSend, + CardGiftcard, + CardMembership, + CardTravel, + CarRental, + CarRepair, + Category, + Celebration, + CellWifi, + ChangeHistory, + Chat, + ChatBubble, + ChatBubbleOutline, + Check, + CheckCircle, + CheckCircleOutline, + ChevronLeft, + ChevronRight, + ChromeReaderMode, + CircleNotifications, + Class, + CleanHands, + CleaningServices, + ClearAll, + Clock, + Close, + CloseFullscreen, + Cloud, + CloudCircle, + CloudDone, + CloudDownload, + CloudOff, + CloudQueue, + CloudUpload, + Code, + Comment, + CommentBank, + Commute, + CompareArrows, + CompassCalibration, + Compress, + ConnectWithoutContact, + Construction, + Contactless, + ContactMail, + ContactPage, + ContactPhone, + Contacts, + ContactSupport, + Copyright, + Coronavirus, + CreateNewFolder, + CreditCard, + Cut, + Dangerous, + Dashboard, + DashboardCustomize, + DateRange, + Deck, + Delete, + DeleteForever, + DeleteOutline, + DeliveryDining, + DepartureBoard, + Description, + DesignServices, + DesktopAccessDisabled, + DialerSip, + Dialpad, + DinnerDining, + Directions, + DirectionsBike, + DirectionsBoat, + DirectionsBus, + DirectionsCar, + DirectionsRailway, + DirectionsRun, + DirectionsSubway, + DirectionsTransit, + DirectionsWalk, + DisabledByDefault, + Dns, + Domain, + DomainDisabled, + DomainVerification, + Done, + DoneAll, + DoneOutline, + DonutLarge, + DonutSmall, + DoubleArrow, + DragIndicator, + DriveFileMove, + DriveFileMoveOutline, + DriveFileRenameOutline, + DriveFolderUpload, + DryCleaning, + DSOTruck, + Duo, + DynamicForm, + East, + Eco, + Edit, + EditAttributes, + EditLocation, + EditOff, + EditRoad, + Eject, + Elderly, + ElectricalServices, + ElectricBike, + ElectricCar, + ElectricMoped, + ElectricRickshaw, + ElectricScooter, + Email, + EmojiEmotions, + EmojiEvents, + EmojiFlags, + EmojiFoodBeverage, + EmojiNature, + EmojiObjects, + EmojiPeople, + EmojiSymbols, + EmojiTransportation, + Engineering, + Error, + ErrorOutline, + EuroSymbol, + Event, + EventSeat, + EvStation, + ExitToApp, + Expand, + ExpandLess, + ExpandMore, + Explore, + ExploreOff, + Extension, + Face, + Facebook, + FactCheck, + Fastfood, + Favorite, + FavoriteBorder, + Feedback, + Festival, + File, + FileDownload, + FileDownloadDone, + FilePresent, + FileUpload, + FilterAlt, + FilterListAlt, + FindInPage, + FindReplace, + Fingerprint, + Fireplace, + FirstPageAlt, + FirstPage, + FitScreen, + Flaky, + Flight, + FlightLand, + FlightTakeoff, + FlipToBack, + FlipToFront, + Folder, + FolderOpen, + FolderShared, + FollowTheSigns, + Forum, + ForwardToInbox, + Fullscreen, + FullscreenExit, + Gavel, + GetApp, + Gif, + Grade, + Grading, + GridView, + Group, + GroupAdd, + Groups, + GroupWork, + GTranslate, + Hail, + Handyman, + Hardware, + Help, + HelpCenter, + HelpOutline, + HighlightAlt, + HighlightOff, + History, + HistoryEdu, + HistoryToggleOff, + Home, + HomeFilled, + HomeRepairService, + HomeWork, + HorizontalSplit, + Hotel, + HourglassBottom, + HourglassDisabled, + HourglassEmpty, + HourglassFull, + HourglassTop, + Http, + Https, + Hvac, + Icecream, + IconSwerage, + IconSwerageAlt, + ImportantDevices, + ImportContacts, + ImportExport, + Info, + InfoOutline, + Input, + IntegrationInstructions, + InvertColors, + InvertColorsOff, + IosShare, + KingBed, + Label, + LabelImportant, + LabelImportantOutline, + LabelOff, + LabelOutline, + TranslateLanguage, + Language, + LastPageAlt, + LastPage, + Launch, + Layers, + LayersClear, + Leaderboard, + LegendToggle, + Lightbulb, + LightbulbOutline, + LineStyle, + LineWeight, + Liquor, + List, + ListAlt, + LiveHelp, + LocalActivity, + LocalAirport, + LocalAtm, + LocalBar, + LocalCafe, + LocalCarWash, + LocalConvenienceStore, + LocalDining, + LocalDrink, + LocalFireDepartment, + LocalFlorist, + LocalGasStation, + LocalGroceryStore, + LocalHospital, + LocalHotel, + LocalLaundryService, + LocalLibrary, + LocalMall, + LocalMovies, + LocalOffer, + LocalParking, + LocalPharmacy, + LocalPhone, + LocalPizza, + LocalPlay, + LocalPolice, + LocalPostOffice, + LocalPrintshop, + LocalSee, + LocalShipping, + LocalTaxi, + LocationCity, + LocationOff, + LocationOn, + LocationPin, + Lock, + LockClock, + LockOpen, + LockOutline, + Login, + Logout, + Loyalty, + Luggage, + LunchDining, + MailOutline, + Map, + MapsUgc, + MarkAsUnread, + MarkChatRead, + MarkChatUnread, + MarkEmailRead, + MarkEmailUnread, + MarkunreadMailbox, + Masks, + Maximize, + Mediation, + MedicalServices, + Menu, + MenuBook, + MenuOpen, + Message, + MilitaryTech, + Minimize, + MiscellaneousServices, + MobileScreenShare, + ModelTraining, + Money, + Mood, + MoodBad, + Moped, + MoreHoriz, + MoreTime, + MoreVert, + MultipleStop, + Museum, + MyLocation, + Nat, + Navigation, + NearMe, + NearMeDisabled, + NextPlan, + Nightlife, + NightlightRound, + NightsStay, + NoLuggage, + NoMeals, + NoMealsOuline, + NoResultsFoundIcon, + North, + NorthEast, + NorthWest, + NoSim, + NotAccessible, + NoteAdd, + NotificationImportant, + Notifications, + NotificationsActive, + NotificationsNone, + NotificationsOff, + NotificationsPaused, + NotListedLocation, + NoTransfer, + NotStarted, + TorchNoun, + OfflineBolt, + OfflinePin, + OfflineShare, + OnlinePrediction, + Opacity, + OpenInBrowser, + OpenInFull, + OpenInNew, + OpenWith, + Outbond, + Outbox, + OutdoorGrill, + OutgoingMail, + Outlet, + Pages, + Pageview, + PanTool, + Park, + PartyMode, + PausePresentation, + Payment, + Payments, + PedalBike, + Pending, + PendingActions, + People, + PeopleAlt, + PeopleOutline, + PermCameraMic, + PermContactCalendar, + PermDataSetting, + PermDeviceInformation, + PermIdentity, + PermMedia, + PermPhoneMsg, + PermScanWifi, + Person, + PersonAdd, + PersonAddAlt, + PersonAddSecondary, + PersonAddDisabled, + PersonOutline, + PersonPin, + PersonPinCircle, + PersonRemove, + PersonRemoveAlt, + PersonSearch, + PestControl, + PestControlRodent, + Pets, + Phone, + PhoneDisabled, + PhoneEnabled, + PhonelinkErase, + PhonelinkLock, + PhonelinkRing, + PhonelinkSetup, + PictureInPicture, + PictureInPictureAlt, + PinDrop, + PivotTableChart, + Place, + Plagiarism, + PlayForWork, + Plumbing, + PlusOne, + Poll, + Polymer, + Population, + PortableWifiOff, + PowerSettingsNew, + PregnantWoman, + PresentToAll, + Preview, + Print, + PrintDisabled, + PrivacyTip, + Psychology, + Public, + PublicOff, + PublishedWithChanges, + QrCode, + QrCodeScanner, + QueryBuilder, + QuestionAnswer, + Quickreply, + RailwayAlert, + RamenDining, + RateReview, + ReadMore, + Receipt, + Recommend, + RecordVoiceOver, + Redeem, + ReduceCapacity, + Refresh, + RemoveDone, + RemoveModerator, + RemoveShoppingCart, + Reorder, + ReportProblem, + RequestPage, + RequestQuote, + Restaurant, + RestaurantMenu, + Restore, + RestoreFromTrash, + RestorePage, + RingVolume, + Room, + RoundedCorner, + Rowing, + RssFeed, + Rtt, + Rule, + RuleFolder, + RunCircle, + Sanitizer, + Satellite, + SavedSearch, + Schedule, + ScheduleSend, + School, + Science, + ScreenShare, + Search, + SearchOff, + Segment, + SelfImprovement, + SendAndArchive, + SentimentDissatisfied, + SentimentNeutral, + SentimentSatisfied, + SentimentSatisfiedAlt, + SentimentVeryDissatisfied, + SentimentVerySatisfied, + SetMeal, + Settings, + SettingsApplications, + SettingsBackupRestore, + SettingsBluetooth, + SettingsBrightness, + SettingsCell, + SettingsEthernet, + SettingsInputAntenna, + SettingsInputComponent, + SettingsInputComposite, + SettingsInputHdmi, + SettingsInputVideo, + SettingsOverscan, + SettingsPhone, + SettingsPower, + SettingsRemote, + SettingsVoice, + Share, + Shop, + ShoppingBag, + ShoppingBasket, + ShoppingCart, + ShopAlt, + Sick, + SingleBed, + SmartButton, + SnippetFolder, + Source, + South, + SouthEast, + SouthWest, + SpeakerNotes, + SpeakerNotesOff, + SpeakerPhone, + SpellCheck, + Sports, + SportsBaseball, + SportsBasketball, + SportsCricket, + SportsEsports, + SportsFootball, + SportsGolf, + SportsHandball, + SportsHockey, + SportsKabaddi, + SportsMma, + SportsMotorsports, + SportsRugby, + SportsSoccer, + SportsTennis, + SportsVolleyball, + StarRate, + Stars, + StayCurrentLandscape, + StayCurrentPortrait, + StayPrimaryLandscape, + StayPrimaryPortrait, + StickyNotesSecondary, + ScreenShareStop, + Store, + StoreMallDirectory, + StreetView, + SubdirectoryArrowLeft, + SubdirectoryArrowRight, + Subject, + SubtitlesOff, + Subway, + SupervisedUserCircle, + SupervisorAccount, + Support, + SwapCalls, + SwapHorizontal, + SwapHorizontalCircle, + SwapVertical, + SwapVerticalCircle, + Swipe, + SwitchAccount, + SwitchLeft, + SwitchRight, + SyncAlt, + SystemUpdateAlt, + Tab, + TableView, + TabUnselected, + TakeOutDining, + TaxiAlert, + Terrain, + TextRotateUp, + TextRotateVertical, + TextRotationAngleDown, + TextRotationAngleUp, + TextRotationDown, + TextRotationNone, + SMSText, + TextSnippet, + TheaterComedy, + Theaters, + ThumbDown, + ThumbDownAlt, + ThumbDownOffAlt, + ThumbsUpDown, + ThumbUp, + ThumbUpAlt, + ThumbUpOffAlt, + Timeline, + Toc, + Today, + Toll, + Topic, + Torch, + TouchApp, + Tour, + TrackChanges, + Traffic, + Train, + Tram, + TransferWithinStation, + TransitEnterExit, + Translate, + TrendingDown, + TrendingFlat, + TrendingUp, + TripOrigin, + TurnedIn, + TurnedInNot, + TwoWheeler, + UnfoldLess, + UnfoldMore, + Unpublished, + Unsubscribe, + Update, + UpdateExpense, + UpdateExpenseSecondary, + Upgrade, + UploadFile, + Verified, + VerifiedUser, + VerticalSplit, + ViewAgenda, + ViewArray, + ViewCarousel, + ViewColumn, + ViewDay, + ViewHeadline, + ViewInAr, + ViewList, + ViewModule, + ViewQuilt, + ViewSidebar, + ViewStream, + ViewWeek, + Visibility, + VisibilityOff, + Voicemail, + VoiceOverOff, + VolunteerActivism, + VpnKey, + Warning, + WatchLater, + WaterfallChart, + West, + Whatsapp, + Whatshot, + WifiCalling, + WifiProtectedSetup, + WineBar, + Work, + WorkOff, + WorkOutline, + WorkspacesFilled, + WorkspacesOutline, + WrongLocation, + Wysiwyg, + YoutubeSearchedFor, + ZoomIn, + ZoomOut, + ZoomOutMap, + } \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchComponent.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchComponent.js new file mode 100644 index 00000000000..1b10c02ab7b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchComponent.js @@ -0,0 +1,160 @@ +import React, { useContext, useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import { useTranslation } from "react-i18next"; +import { InboxContext } from "../hoc/InboxSearchComposerContext"; +import RenderFormFields from "../molecules/RenderFormFields"; +import Header from "../atoms/Header"; +import LinkLabel from '../atoms/LinkLabel'; +import SubmitBar from "../atoms/SubmitBar"; +import Toast from "../atoms/Toast"; +import { FilterIcon, RefreshIcon } from "./svgindex"; + +const SearchComponent = ({ uiConfig, header = "", screenType = "search", fullConfig, data}) => { + const { t } = useTranslation(); + const { state, dispatch } = useContext(InboxContext) + const [showToast,setShowToast] = useState(null) + let updatedFields = []; + const {apiDetails} = fullConfig + + if (fullConfig?.postProcessResult){ + //conditions can be added while calling postprocess function to pass different params + Digit?.Customizations?.[apiDetails?.masterName]?.[apiDetails?.moduleName]?.postProcess(data, uiConfig) + } + + const { + register, + handleSubmit, + setValue, + getValues, + reset, + watch, + trigger, + control, + formState, + errors, + setError, + clearErrors, + unregister, + } = useForm({ + defaultValues: uiConfig?.defaultValues, + }); + const formData = watch(); + const checkKeyDown = (e) => { + const keyCode = e.keyCode ? e.keyCode : e.key ? e.key : e.which; + if (keyCode === 13) { + // e.preventDefault(); + } + }; + + useEffect(() => { + updatedFields = Object.values(formState?.dirtyFields) + }, [formState]) + + const onSubmit = (data) => { + + //here -> added a custom validator function, if required add in UICustomizations + const isAnyError = Digit?.Customizations?.[apiDetails?.masterName]?.[apiDetails?.moduleName]?.customValidationCheck ? Digit?.Customizations?.[apiDetails?.masterName]?.[apiDetails?.moduleName]?.customValidationCheck(data) : false + if(isAnyError) { + setShowToast(isAnyError) + setTimeout(closeToast,3000) + return + } + + if(updatedFields.length >= uiConfig?.minReqFields) { + // here based on screenType call respective dispatch fn + dispatch({ + type: uiConfig?.type === "filter" ? "filterForm" : "searchForm", + state: { + ...data + } + }) + } else { + setShowToast({ warning: true, label: t("ES_COMMON_MIN_SEARCH_CRITERIA_MSG") }) + setTimeout(closeToast, 3000); + } + } + + const clearSearch = () => { + reset(uiConfig?.defaultValues) + dispatch({ + type: "clearSearchForm", + state: { ...uiConfig?.defaultValues } + //need to pass form with empty strings + }) + dispatch({ + type:"clearTableForm" + }) + } + + const closeToast = () => { + setShowToast(null); + } + + const handleFilterRefresh = () => { + reset(uiConfig?.defaultValues) + dispatch({ + type: "clearFilterForm", + state: { ...uiConfig?.defaultValues } + //need to pass form with empty strings + }) + } + + const renderHeader = () => { + switch(uiConfig?.type) { + case "filter" : { + return ( +
+
+
{t(header)}
+
+
+ ) + } + default : { + return
{t(header)}
+ } + } + } + + return ( + +
+ {header && renderHeader()} +
checkKeyDown(e)}> +
+ {uiConfig?.showFormInstruction &&

{t(uiConfig?.showFormInstruction)}

} +
+ +
+ { uiConfig?.secondaryLabel && {t(uiConfig?.secondaryLabel)} } + { uiConfig?.primaryLabel && } +
+
+
+
+ { showToast && + } +
+
+ ) +} + +export default SearchComponent \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchableDropdown.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchableDropdown.js new file mode 100644 index 00000000000..935a1647ab0 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SearchableDropdown.js @@ -0,0 +1,312 @@ +import PropTypes from "prop-types"; +import React, { useEffect, useRef, useState } from "react"; +import { ArrowDown, SearchIcon } from "./svgindex"; + +const TextField = (props) => { + const {value,setValue} = props + + useEffect(() => { + if (!props.keepNull) + if (props.selectedVal) + setValue(props.selectedVal) + else { setValue(""); props.setFilter("") } + else setValue(""); + }, [props.selectedVal, props.forceSet]); + + function inputChange(e) { + if (props.freeze) return; + + setValue(e.target.value); + props.setFilter(e.target.value); + } + + function broadcastToOpen() { + if (!props.disable) { + props.dropdownDisplay(true); + } + } + + function broadcastToClose() { + props.dropdownDisplay(false); + } + + /* Custom function to scroll and select in the dropdowns while using key up and down */ + const keyChange = (e) => { + if (e.key == "ArrowDown") { + props.setOptionIndex((state) => (state + 1 == props.addProps.length ? 0 : state + 1)); + if (props.addProps.currentIndex + 1 == props.addProps.length) { + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(0, 0); + } else { + props?.addProps?.currentIndex > 2 && e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0, 45); + } + e.preventDefault(); + } else if (e.key == "ArrowUp") { + props.setOptionIndex((state) => (state !== 0 ? state - 1 : props.addProps.length - 1)); + if (props.addProps.currentIndex == 0) { + e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollTo?.(100000, 100000); + } else { + props?.addProps?.currentIndex > 2 && e?.target?.parentElement?.parentElement?.children?.namedItem("jk-dropdown-unique")?.scrollBy?.(0, -45); + } + e.preventDefault(); + } else if (e.key == "Enter") { + props.addProps.selectOption(props.addProps.currentIndex); + } + }; + + return ( + { + broadcastToClose(); + props?.onBlur?.(e); + if (props.selectedVal !== props.filterVal) { + setTimeout(() => { + props.setforceSet((val) => val + 1); + }, 1000); + } + }} + onKeyDown={keyChange} + readOnly={props.disable} + autoFocus={props.autoFocus} + placeholder={props.placeholder} + autoComplete={"off"} + style={props.style} + /> + ); +}; + +const translateDummy = (text) => { + return text; +}; + +const Dropdown = (props) => { + + const {tableRow,setTableRow} = props; + + const user_type = Digit.SessionStorage.get("userType"); + const [dropdownStatus, setDropdownStatus] = useState(false); + const [selectedOption, setSelectedOption] = useState(props.selected ? props.selected : null); + const [filterVal, setFilterVal] = useState(""); + const [forceSet, setforceSet] = useState(0); + const [optionIndex, setOptionIndex] = useState(-1); + const optionRef = useRef(null); + const hasCustomSelector = props.customSelector ? true : false; + const t = props.t || translateDummy; + + useEffect(() => { + setSelectedOption(props.selected); + }, [props.selected]); + + function dropdownSwitch() { + if (!props.disable) { + var current = dropdownStatus; + if (!current) { + document.addEventListener("mousedown", handleClick, false); + } + setDropdownStatus(!current); + props?.onBlur?.(); + } + } + + function handleClick(e) { + if (!optionRef.current || !optionRef.current.contains(e.target)) { + document.removeEventListener("mousedown", handleClick, false); + setDropdownStatus(false); + } + } + + function dropdownOn(val) { + const waitForOptions = () => setTimeout(() => setDropdownStatus(val), 500); + const timerId = waitForOptions(); + return () => { + clearTimeout(timerId); + }; + } + + function onSelect(val) { + + if (val !== selectedOption || props.allowMultiselect) { + props.select(val); + setSelectedOption(val); + setDropdownStatus(false); + + //here update the tableState + setTableRow((prevState) => { + //just for static screen purposes + const newObj = { + "name": "Name New", + "aadhar": val, + "acno": "1212-1212-1212", + "ifsc": "1313-1313-1331" + } + return [...prevState,newObj] + }) + } else { + setSelectedOption(val); + setforceSet(forceSet + 1); + + + } + } + + function setFilter(val) { + setFilterVal(val); + } + + let filteredOption = + (props.option && props.option?.filter((option) => t(option[props.optionKey])?.toUpperCase()?.indexOf(filterVal?.toUpperCase()) > -1)) || []; + function selectOption(ind) { + onSelect(filteredOption[ind]); + } + + if (props.isBPAREG && selectedOption) { + let isSelectedSameAsOptions = props.option?.filter((ob) => ob?.code === selectedOption?.code)?.length > 0; + if (!isSelectedSameAsOptions) setSelectedOption(null) + } + + return ( +
+ {hasCustomSelector && ( +
+ {props.customSelector} + {props.showArrow && } +
+ )} + {!hasCustomSelector && ( +
+ + {props.showSearchIcon ? null : } + {props.showSearchIcon ? : null} +
+ )} + {dropdownStatus ? ( + props.optionKey ? ( +
+ {filteredOption && + filteredOption.map((option, index) => { + return ( +
onSelect(option)} + > + {option.icon && {option.icon} } + {props.isPropertyAssess ?
{props.t ? props.t(option[props.optionKey]) : option[props.optionKey]}
: + {props.t ? props.t(option[props.optionKey]) : option[props.optionKey]}} +
+ ); + })} + {filteredOption && filteredOption.length === 0 && ( +
{ + + }}> + { {props.t ? props.t("CMN_NOOPTION") : "CMN_NOOPTION"}} +
+ )} +
+ ) : ( +
+ {props.option + ?.filter((option) => option?.toUpperCase().indexOf(filterVal?.toUpperCase()) > -1) + .map((option, index) => { + return ( +

onSelect(option)} + > + {option} +

+ ); + })} +
+ ) + ) : null} +
+ ); +}; + +Dropdown.propTypes = { + customSelector: PropTypes.any, + showArrow: PropTypes.bool, + selected: PropTypes.any, + style: PropTypes.object, + option: PropTypes.array, + optionKey: PropTypes.any, + select: PropTypes.any, + t: PropTypes.func, +}; + +Dropdown.defaultProps = { + customSelector: null, + showArrow: true, +}; + +export default Dropdown; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SectionalDropdown.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SectionalDropdown.js new file mode 100644 index 00000000000..726f8304dc9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SectionalDropdown.js @@ -0,0 +1,90 @@ +import React, { useEffect, useState } from "react"; +import { ArrowDown } from "./svgindex"; + +const TextField = (props) => { + const [value, setValue] = useState(props.selectedVal ? props.selectedVal : ""); + + useEffect(() => { + props.selectedVal ? setValue(props.selectedVal) : null; + }, [props.selectedVal]); + + function inputChange(e) { + setValue(e.target.value); + props.setFilter(e.target.value); + } + + return ; +}; + +const SectionalDropdown = (props) => { + const [dropdownStatus, setDropdownStatus] = useState(false); + const [selectedOption, setSelectedOption] = useState(props.selected ? props.selected : null); + const [filterVal, setFilterVal] = useState(""); + + useEffect(() => { + setSelectedOption(props.selected); + }, [props.selected]); + + function dropdownSwitch() { + var current = dropdownStatus; + setDropdownStatus(!current); + } + + function dropdownOn() { + setDropdownStatus(true); + } + + function onSelect(selectedOption) { + props.select(selectedOption); + setSelectedOption(selectedOption); + setDropdownStatus(false); + } + + function setFilter(val) { + setFilterVal(val); + } + + return ( +
+
+ + +
+ {dropdownStatus ? ( +
+ {props.menuData + .filter((subMenu) => subMenu.options.filter((option) => option[props.displayKey].toUpperCase().includes(filterVal.toUpperCase()))) + .map((subMenu, index) => { + return ( + +

{subMenu.heading}

+ {subMenu.options.map((option, index) => { + return ( +

onSelect(option)}> + {props.t ? props.t(option[props.displayKey]) : option[props.displayKey]} +

+ ); + })} +
+ ); + })} +
+ ) : null} +
+ ); +}; + +export default SectionalDropdown; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StandaloneSearchBar.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StandaloneSearchBar.js new file mode 100644 index 00000000000..b4700aa1858 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StandaloneSearchBar.js @@ -0,0 +1,10 @@ +import React from "react" +import { SearchIconSvg } from "./svgindex" +const StandaloneSearchBar = ({placeholder}) => { + return
+ + +
+} + +export default StandaloneSearchBar \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StatusTable.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StatusTable.js new file mode 100644 index 00000000000..e83a23936e6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/StatusTable.js @@ -0,0 +1,108 @@ +import React from "react"; +import { UnMaskComponent } from ".."; + +export const LastRow = (props) => { + return ( +
+

{props.label}

+

{props.text}

+
+ ); +}; + +export const Row = (props) => { + let value = props.text; + let valueStyle = props.textStyle || {}; + let labelStyle = props.labelStyle || {}; + if (Array.isArray(props.text)) { + value = props.text.map((val, index) => { + if (val?.className) { + return ( +

+ {val?.value} + {/* + Feature :: Privacy + privacy object set to the Mask Component + */} + {props?.privacy && ( + + + + )} +

+ ); + } + return ( +

+ {val} + {props?.privacy && ( + + {/* + Feature :: Privacy + privacy object set to the Mask Component + */} + + + )} +

+ ); + }); + } + // display: inline-flex; + // width: fit-content; + // margin-left: 10px; + // } + + return ( +
+

{props.label}{props?.isMandotary && '*'}

+
+ { + props?.isValueLink ? (

{value}

) :

{value}

+ } + {props?.privacy && ( + + + + )} + {props.caption &&
{props.caption}
} +
+ {props.actionButton ? ( +
+ {props.actionButton} +
+ ) : null} +
+ ); +}; + +export const MediaRow = (props) => { + return ( +
+

{props.label}

+ {props.children} +
+ ); +}; + +export const StatusTable = (props) => { + const employee = Digit.SessionStorage.get("user_type") === "employee" ? true : false; + if (props.dataObject) { + return ( +
+ {Object.keys(props.dataObject).map((name, index) => { + if (++index === Object.keys(props.dataObject).length) { + return ; + } + return ; + })} +
+ ); + } else { + return ( +
+ {props.children} +
+ ); + } +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubMenu.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubMenu.js new file mode 100644 index 00000000000..d74ff7573fc --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubMenu.js @@ -0,0 +1,105 @@ +import React, { useState } from "react"; +import { Link, useLocation } from "react-router-dom"; +import { + PTIcon, + OBPSIcon, + PropertyHouse, + CaseIcon, + PGRIcon, + FSMIcon, + WSICon, + MCollectIcon, + CollectionIcon, + HomeIcon, + ComplaintIcon, + PersonIcon, + DocumentIconSolid, + DropIcon, + CollectionsBookmarIcons, + FinanceChartIcon, +} from "./svgindex"; + +const IconsObject = { + CommonPTIcon: , + OBPSIcon: , + propertyIcon: , + TLIcon: , + PGRIcon: , + FSMIcon: , + WSIcon: , + MCollectIcon: , + BillsIcon: , + home: , + announcement: , + business: , + store: , + assignment: , + receipt: , + "business-center": , + description: , + "water-tap": , + "collections-bookmark": , + "insert-chart": , + edcr: , + collections: , +}; +const SubMenu = ({ item, t, isEmployee }) => { + const [subnav, setSubnav] = useState(false); + const location = useLocation(); + const { pathname } = location; + const showSubnav = () => setSubnav(!subnav); + + const leftIconCitizenArray = item.icon; + const leftIconCitizen = IconsObject[leftIconCitizenArray] || IconsObject.BillsIcon; + + const leftIconEmployeeItems = item?.icon?.split?.(":")?.[1] || ""; + + const leftIconEmployee = IconsObject[leftIconEmployeeItems] || IconsObject.collections; + + return ( + +
+
+
+ {isEmployee ? leftIconEmployee : leftIconCitizen} + {isEmployee ? item.moduleName : t(Digit.Utils.locale.getTransformedLocale(`ACTION_TEST_${item.moduleName}`))} +
+
{item.links && subnav}
+
+
+ + {subnav && + item.links + .sort((a, b) => a.orderNumber - b.orderNumber) + .map((item, index) => { + if (item.navigationURL.indexOf(`/${window?.contextPath}`) === -1) { + const getOrigin = window.location.origin; + return ( + +
+ {item.label || item.displayName} +
+
+ ); + } + return ( + +
+ {item.label || item.displayName} +
+ + ); + })} +
+ ); +}; + +export default SubMenu; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.js new file mode 100644 index 00000000000..bef3395df49 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.js @@ -0,0 +1,41 @@ +import React, { forwardRef } from "react"; +import PropTypes from "prop-types"; + +const SubmitBar = forwardRef((props, ref) => { + return ( + + ); +}); + +SubmitBar.propTypes = { + /** + * Is it a normal button or submit button? + */ + submit: PropTypes.any, + /** + * style for the button + */ + style: PropTypes.object, + /** + * SubmitButton contents + */ + label: PropTypes.string, + /** + * Optional click handler + */ + onSubmit: PropTypes.func, +}; + +SubmitBar.defaultProps = {}; + +export default SubmitBar; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.stories.js new file mode 100644 index 00000000000..ef9f73c0a43 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/SubmitBar.stories.js @@ -0,0 +1,28 @@ +import React from "react"; + +import SubmitBar from "./SubmitBar"; + +export default { + title: "Atom/SubmitBar", + component: SubmitBar, +}; + +const Template = (args) => ; + +export const SubmitButton = Template.bind({}); + +SubmitButton.args = { + submit: true, + style: {}, + label: "Submit", + onSubmit: undefined, +}; + +export const NormalButton = Template.bind({}); + +NormalButton.args = { + submit: false, + style: {}, + label: "Click me", + onSubmit: undefined, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TLCaption.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TLCaption.js new file mode 100644 index 00000000000..e13fe31dff5 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TLCaption.js @@ -0,0 +1,40 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import Reason from "./Reason"; +import TelePhone from "./TelePhone" +import DisplayPhotos from "./DisplayPhotos"; +import UnMaskComponent from "./UnMaskComponent"; + + + +const TLCaption = ({ data, OpenImage, privacy = {} }) => { + + const { t } = useTranslation(); + return ( +
+ {data.date &&

{data.date}

} +

{data.name}

+ {data.mobileNumber && + +

    

+ +
} + {data.source &&

{t("ES_APPLICATION_DETAILS_APPLICATION_CHANNEL_" + data.source.toUpperCase())}

} + {data.comment && } + {data.additionalComment && } + {data?.wfComment.length>0 ?
{data?.wfComment?.map(e => +
+

{t("WF_COMMON_COMMENTS")}

+

{e}

+
+ )}
: null} + + {data?.thumbnailsToShow?.thumbs?.length > 0 ?
+

{t("CS_COMMON_ATTACHMENTS")}

+ { OpenImage(src, index, data?.thumbnailsToShow) }} /> +
: null} +
+ ); +}; + +export default TLCaption; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Table.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Table.js new file mode 100644 index 00000000000..bc335c1482c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/Table.js @@ -0,0 +1,274 @@ +import React, { useEffect, useState, useRef, forwardRef } from "react"; +import { useGlobalFilter, usePagination, useRowSelect, useSortBy, useTable } from "react-table"; +import { ArrowBack, ArrowForward, ArrowToFirst, ArrowToLast, SortDown, SortUp, DoubleTickIcon } from "./svgindex"; +import CheckBox from "./CheckBox"; +import ActionBar from "./ActionBar"; +import SubmitBar from "./SubmitBar"; +import Toast from "./Toast"; + +const noop = () => {}; + +const IndeterminateCheckbox = forwardRef( + ({ indeterminate, ...rest }, ref) => { + const defaultRef = useRef() + const resolvedRef = ref || defaultRef + + useEffect(() => { + resolvedRef.current.indeterminate = indeterminate + }, [resolvedRef, indeterminate]) + + return ( + + + + ) + } +) +const getNoColumnBorder=(noColumnBorder)=>noColumnBorder?({ + cellspacing:"0" ,cellpadding:"0" +}):null; +const Table = ({ + className = "table", + t, + data, + columns, + getCellProps, + currentPage = 0, + pageSizeLimit = 10, + disableSort = true, + autoSort = false, + initSortId = "", + onSearch = false, + manualPagination = true, + totalRecords, + onNextPage, + onPrevPage, + globalSearch, + onSort = noop, + onPageSizeChange, + onLastPage, + onFirstPage, + isPaginationRequired = true, + sortParams = [], + showAutoSerialNo = false, + customTableWrapperClassName = "", + styles = {}, + tableTopComponent, + tableRef, + isReportTable = false, + showCheckBox = false, + actionLabel = 'CS_COMMON_DOWNLOAD', + tableSelectionHandler = () => {}, + onClickRow= ()=>{}, + rowClassName = "", + noColumnBorder=false +}) => { + const { + getTableProps, + getTableBodyProps, + headerGroups, + rows, + prepareRow, + page, + canPreviousPage, + canNextPage, + pageOptions, + pageCount, + gotoPage, + nextPage, + previousPage, + setPageSize, + setGlobalFilter, + state: { pageIndex, pageSize, sortBy, globalFilter, selectedRowIds }, + } = useTable( + { + columns, + data, + initialState: { pageIndex: currentPage, pageSize: pageSizeLimit, sortBy: autoSort ? [{ id: initSortId, desc: false }] : sortParams }, + pageCount: totalRecords > 0 ? Math.ceil(totalRecords / pageSizeLimit) : -1, + manualPagination: manualPagination, + disableMultiSort: false, + disableSortBy: disableSort, + manualSortBy: autoSort ? false : true, + autoResetPage: false, + autoResetSortBy: false, + disableSortRemove: true, + disableGlobalFilter: onSearch === false ? true : false, + globalFilter: globalSearch || "text", + useControlledState: (state) => { + return React.useMemo(() => ({ + ...state, + pageIndex: manualPagination ? currentPage : state.pageIndex, + })); + }, + }, + useGlobalFilter, + useSortBy, + usePagination, + useRowSelect, + hooks => { + if(showCheckBox) { + hooks.visibleColumns.push(columns => [ + { + id: 'selection', + Header: ({ getToggleAllPageRowsSelectedProps }) => ( +
+ +
+ ), + Cell: ({ row }) => ( +
+ +
+ ), + }, + ...columns, + ]) + } + } + ); + let isTotalColSpanRendered = false; + const [toast, setToast] = useState({show : false, label : "", error : false}); + + useEffect(() => { + onSort(sortBy); + }, [onSort, sortBy]); + + + useEffect(() => setGlobalFilter(onSearch), [onSearch, setGlobalFilter,data]); + + const handleSelection = async () => { + const selectedRows = rows?.filter(ele => Object.keys(selectedRowIds)?.includes(ele?.id)) + const response = await tableSelectionHandler(selectedRows,t) + setToast({show: true, label: t(response?.label), error: !response?.isSuccess}) + } + + const handleToastClose = () => { + setToast({show : false, label : "", error : false}) + } + + useEffect(()=>{ + if(toast?.show) { + setTimeout(()=>{ + handleToastClose(); + },3000); + } + },[toast?.show]) + + //note -> adding data prop in dependency array to trigger filter whenever state of the table changes + //use case -> without this if we enter string to search and then click on it's attendence checkbox or skill selector for that matter then the global filtering resets and whole table is shown + return ( + + + {tableTopComponent ? tableTopComponent : null} + + + {headerGroups.map((headerGroup) => ( + + {showAutoSerialNo && ( + + )} + {headerGroup.headers.map((column) => ( + + ))} + + ))} + + + {page.map((row, i) => { + // rows.slice(0, 10).map((row, i) => { + prepareRow(row); + return ( + onClickRow(row)} className={rowClassName}> + {showAutoSerialNo && } + {row.cells.map((cell) => { + return ( + + ); + })} + + ); + })} + +
+ {showAutoSerialNo && typeof showAutoSerialNo == "string" ? t(showAutoSerialNo) : t("TB_SNO")} + + {column.render("Header")} + {column.isSorted ? column.isSortedDesc ? : : ""} +
{i + 1} + {cell.attachment_link ? ( + + {cell.render("Cell")} + + ) : ( + {cell.render("Cell")} + )} +
+
+ {isPaginationRequired && ( +
+ {`${t("CS_COMMON_ROWS_PER_PAGE")} :`} + + + + {pageIndex * pageSize + 1} + {"-"} + {manualPagination + ? (currentPage + 1) * pageSizeLimit > totalRecords + ? totalRecords + : (currentPage + 1) * pageSizeLimit + : pageIndex * pageSize + page?.length}{" "} + {/* {(pageIndex + 1) * pageSizeLimit > rows.length ? rows.length : (pageIndex + 1) * pageSizeLimit}{" "} */} + {totalRecords ? `of ${manualPagination ? totalRecords : rows.length}` : ""} + {" "} + + {/* to go to first and last page we need to do a manual pagination , it can be updated later*/} + {!manualPagination && pageIndex != 0 && gotoPage(0)} className={"cp"} />} + {canPreviousPage && manualPagination && onFirstPage && manualPagination && onFirstPage()} className={"cp"} />} + {canPreviousPage && (manualPagination ? onPrevPage() : previousPage())} className={"cp"} />} + {canNextPage && (manualPagination ? onNextPage() : nextPage())} className={"cp"} />} + {!manualPagination && pageIndex != pageCount - 1 && gotoPage(pageCount - 1)} className={"cp"} />} + {rows.length == pageSizeLimit && canNextPage && manualPagination && onLastPage && ( + manualPagination && onLastPage()} className={"cp"} /> + )} + {/* to go to first and last page we need to do a manual pagination , it can be updated later*/} +
+ )} + { Object.keys(selectedRowIds)?.length > 0 && ( + + + +

{`${Object.keys(selectedRowIds)?.length} ${t("COMMON_SELECTED")}`}

+
+ +
)} + {toast?.show && } +
+ ); +}; + +export default Table; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.js new file mode 100644 index 00000000000..3b7e1860b6b --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.js @@ -0,0 +1,27 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Phone } from "./svgindex"; + +const TelePhone = ({ mobile, text }) => ( + + {text} +
+ +
+
+); + +TelePhone.propTypes = { + mobile: PropTypes.any, + text: PropTypes.string, +}; + +TelePhone.defaultProps = { + mobile: "", + text: "", +}; + +export default TelePhone; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.stories.js new file mode 100644 index 00000000000..69764f33bac --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TelePhone.stories.js @@ -0,0 +1,16 @@ +import React from "react"; + +import TelePhone from "./TelePhone"; + +export default { + title: "Atom/TelePhone", + component: TelePhone, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); +Default.args = { + mobile: "9292929929", + text: "Joe Doe", +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.js new file mode 100644 index 00000000000..957dbb0c40f --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.js @@ -0,0 +1,45 @@ +import React from "react"; +import PropTypes from "prop-types"; + +const TextArea = (props) => { + const user_type = Digit.SessionStorage.get("userType"); + + return ( + + + {

{props.hintText}

} +
+ ); +}; + +TextArea.propTypes = { + userType: PropTypes.string, + name: PropTypes.string.isRequired, + ref: PropTypes.func, + value: PropTypes.string, + onChange: PropTypes.func, + id: PropTypes.string, +}; + +TextArea.defaultProps = { + ref: undefined, + onChange: undefined, +}; + +export default TextArea; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.stories.js new file mode 100644 index 00000000000..afe730836cd --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/atoms/TextArea.stories.js @@ -0,0 +1,18 @@ +import React from "react"; + +import TextArea from "./TextArea"; + +export default { + title: "Atom/TextArea", + component: TextArea, +}; + +const Template = (args) => + + ); + }); + + return ( +
+ + {!childrenAtTheBottom && children} + {inputs} + {forcedError && !showErrorBelowChildren && {t(forcedError)}} + {childrenAtTheBottom && children} + {forcedError && showErrorBelowChildren && {t(forcedError)}} + +
+ ); +}; + +FormStep.propTypes = { + config: PropTypes.shape({}), + onSelect: PropTypes.func, + onSkip: PropTypes.func, + onAdd: PropTypes.func, + t: PropTypes.func, +}; + +FormStep.defaultProps = { + config: {}, + onSelect: undefined, + onSkip: undefined, + onAdd: undefined, + t: (value) => value, +}; + +export default FormStep; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/FormStep.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/FormStep.stories.js new file mode 100644 index 00000000000..33618f20523 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/FormStep.stories.js @@ -0,0 +1,18 @@ +import React from "react"; + +import FormStep from "./FormStep"; + +export default { + title: "Molecule/FormStep", + component: FormStep, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + config: { + inputs: [{ type: "text", name: "firstName", label: "First Name", error: "This field is required", validation: null }], + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.js new file mode 100644 index 00000000000..46002483135 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.js @@ -0,0 +1,60 @@ +import React from "react"; +import PropTypes from "prop-types"; + +import Card from "../atoms/Card"; +import CardHeader from "../atoms/CardHeader"; +import CardText from "../atoms/CardText"; +import SubmitBar from "../atoms/SubmitBar"; +import LinkButton from "../atoms/LinkButton"; +import CardCaption from "../atoms/CardCaption"; +import TextInput from "../atoms/TextInput"; + +const InputCard = ({ + t, + children, + texts = {}, + submit = false, + inputs = [], + inputRef, + onNext, + onSkip, + isDisable, + onAdd, + isMultipleAllow = false, + cardStyle = {}, +}) => { + const isMobile = window.Digit.Utils.browser.isMobile(); + // TODO: inputs handle + return ( + + {texts.headerCaption && {t(texts.headerCaption)}} + {texts?.header && {t(texts.header)}} + {texts?.cardText && {t(texts.cardText)}} + {children} + {texts.submitBarLabel ? : null} + {texts.skipLabel ? {t(texts.skipLabel)} : null} + {texts.skipText ? : null} + {isMultipleAllow && texts.addMultipleText ? : null} + + ); +}; + +InputCard.propTypes = { + text: PropTypes.object, + submit: PropTypes.bool, + onNext: PropTypes.func, + onSkip: PropTypes.func, + onAdd: PropTypes.func, + t: PropTypes.func, +}; + +InputCard.defaultProps = { + texts: {}, + submit: false, + onNext: undefined, + onSkip: undefined, + onAdd: undefined, + t: (value) => value, +}; + +export default InputCard; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.stories.js new file mode 100644 index 00000000000..0b94f76fda2 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/InputCard.stories.js @@ -0,0 +1,22 @@ +import React from "react"; + +import InputCard from "./InputCard"; + +export default { + title: "Molecule/InputCard", + component: InputCard, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + texts: { + headerCaption: "Header Caption", + header: "Header", + cardText: "Card Text", + nextText: "Next", + skipText: "Skip", + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/Localities.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/Localities.js new file mode 100644 index 00000000000..68eb85aa176 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/Localities.js @@ -0,0 +1,29 @@ +import React from "react"; +import { Loader } from "../atoms/Loader"; +import Dropdown from "../atoms/Dropdown"; +import { useTranslation } from "react-i18next"; + +const Localities = ({ selectLocality, tenantId, boundaryType, keepNull, selected, optionCardStyles, style, disable, disableLoader, sortFn }) => { + const { t } = useTranslation(); + + const { data: tenantlocalties, isLoading } = Digit.Hooks.useBoundaryLocalities(tenantId, boundaryType, { enabled: !disable }, t); + if (isLoading && !disableLoader) { + return ; + } + + return ( + + ); + //

ABCD

+}; + +export default Localities; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationDropdownWrapper.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationDropdownWrapper.js new file mode 100644 index 00000000000..585702856d9 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationDropdownWrapper.js @@ -0,0 +1,97 @@ +import React,{Fragment,useState,useEffect} from 'react' +import MultiSelectDropdown from '../atoms/MultiSelectDropdown' +import Dropdown from '../atoms/Dropdown' +import { Loader } from '../atoms/Loader' +import { useTranslation } from 'react-i18next' +const LocationDropdownWrapper = ({populators,formData,props,inputRef,errors,setValue}) => { + //based on type (ward/locality) we will render dropdowns respectively + //here we will render two types of dropdown based on allowMultiSelect boolean + // for singleSelect render + + const [options,setOptions] = useState([]) + + const tenantId = Digit.ULBService.getCurrentTenantId() + const headerLocale = Digit.Utils.locale.getTransformedLocale(tenantId); + const { t } = useTranslation() + const { isLoading, data: wardsAndLocalities } = Digit.Hooks.useLocation( + tenantId, 'Ward', + { + select: (data) => { + + const wards = [] + const localities = {} + data?.TenantBoundary[0]?.boundary.forEach((item) => { + localities[item?.code] = item?.children.map(item => ({ code: item.code, name: item.name, i18nKey: `${headerLocale}_ADMIN_${item?.code}`, label: item?.label })) + wards.push({ code: item.code, name: item.name, i18nKey: `${headerLocale}_ADMIN_${item?.code}` }) + }); + + return { + wards, localities + } + } + }); + + + useEffect(() => { + if(wardsAndLocalities) { + if(populators.type==="ward"){ + setOptions(wardsAndLocalities?.wards) + } + else{ + //here you need to set the localities based on the selected ward + let locs = [] + const selectedWardsCodes = formData?.ward?.map(row=>row.code) + selectedWardsCodes?.forEach(code=>{ + locs=[...locs,...wardsAndLocalities?.localities?.[code]] + }) + setOptions(locs) + } + } + }, [wardsAndLocalities,formData?.ward]) + + + if(isLoading) return + + return ( + <> + {populators.allowMultiSelect &&
+ { + if(populators.type === "ward"){ + setValue('locality',[]) + } + props.onChange(e?.map(row => { return row?.[1] ? row[1] : null }).filter(e => e)) + }} + selected={props?.value} + defaultLabel={t(populators?.defaultText)} + defaultUnit={t(populators?.selectedText)} + config={populators} + /> +
} + {!populators.allowMultiSelect && + { + props.onChange([e], populators.name); + }} + selected={props.value?.[0] || populators.defaultValue} + defaultValue={props.value?.[0] || populators.defaultValue} + t={t} + errorStyle={errors?.[populators.name]} + optionCardStyles={populators?.optionsCustomStyle} + /> + } + + ) +} + +export default LocationDropdownWrapper \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.js new file mode 100644 index 00000000000..a894348905d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.js @@ -0,0 +1,107 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { useTranslation } from "react-i18next"; + +import Card from "../atoms/Card"; +import CardHeader from "../atoms/CardHeader"; +import CardText from "../atoms/CardText"; +import CardLabelError from "../atoms/CardLabelError"; +import LocationSearch from "../atoms/LocationSearch"; +import SubmitBar from "../atoms/SubmitBar"; +import LinkButton from "../atoms/LinkButton"; + +const LocationSearchCard = ({ + header, + cardText, + nextText, + t, + skipAndContinueText, + forcedError, + skip, + onSave, + onChange, + position, + disabled, + cardBodyStyle = {}, + isPTDefault, + PTdefaultcoord, + isPlaceRequired, + handleRemove, + Webview=false, + isPopUp=false, +}) => { + let isDisabled = false || disabled; + const onLocationChange = (val, location) => { + isDisabled = val ? false : true; + onChange(val, location); + }; + + const onLocationChangewithPlace = (val, location, place) => { + isDisabled = val ? false : true; + onChange(val, location, place); + }; + + return ( + + {header} +
+ {isPopUp && + + + + + +
+ } + style={{width: "100px", display:"inline"}} + onClick={(e) => handleRemove()} + />} + + {/* Click and hold to drop the pin to complaint location. If you are not + able to pin the location you can skip the continue for next step. */} + {cardText} + + + + {forcedError && {t(forcedError)}} +
+ + {skip ? : null} +
+ ); +}; + +LocationSearchCard.propTypes = { + header: PropTypes.string, + cardText: PropTypes.string, + nextText: PropTypes.string, + skipAndContinueText: PropTypes.string, + skip: PropTypes.func, + onSave: PropTypes.func, + onChange: PropTypes.func, + position: PropTypes.any, + isPTDefault: PropTypes.any, + PTdefaultcoord: PropTypes.any, + isPlaceRequired: PropTypes.any, +}; + +LocationSearchCard.defaultProps = { + header: "", + cardText: "", + nextText: "", + skipAndContinueText: "", + skip: () => {}, + onSave: null, + onChange: () => {}, + position: undefined, + isPTDefault: false, + PTdefaultcoord: {}, + isPlaceRequired: false, + handleRemove: () => {}, + Webview:false, + isPopUp:false, +}; + +export default LocationSearchCard; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.stories.js new file mode 100644 index 00000000000..96517792e00 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/LocationSearchCard.stories.js @@ -0,0 +1,20 @@ +import React from "react"; + +import LocationSearchCard from "./LocationSearchCard"; + +export default { + title: "Molecule/LocationSearchCard", + component: LocationSearchCard, +}; + +const Template = (args) => ; + +export const Default = Template.bind({}); + +Default.args = { + header: "Header", + cardText: "Card Text", + nextText: "Next Text", + skipAndContinueText: "Skip", + skip: true, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/MultiUploadWrapper.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/MultiUploadWrapper.js new file mode 100644 index 00000000000..6cca7471a71 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/MultiUploadWrapper.js @@ -0,0 +1,145 @@ +import React, { useEffect, useReducer, useState } from "react" +import UploadFile from "../atoms/UploadFile" + +const displayError = ({ t, error, name }, customErrorMsg) => ( + +
{customErrorMsg ? t(customErrorMsg) : t(error)}
+
{customErrorMsg ? '' : `${t('ES_COMMON_DOC_FILENAME')} : ${name} ...`}
+
+) + +const fileValidationStatus = (file, regex, maxSize, t) => { + + const status = { valid: true, name: file?.name?.substring(0, 15), error: '' }; + if (!file) return; + + if (!regex.test(file.type) && (file.size / 1024 / 1024) > maxSize) { + status.valid = false; status.error = t(`NOT_SUPPORTED_FILE_TYPE_AND_FILE_SIZE_EXCEEDED_5MB`); + } + + if (!regex.test(file.type)) { + status.valid = false; status.error = t(`NOT_SUPPORTED_FILE_TYPE`); + } + + if ((file.size / 1024 / 1024) > maxSize) { + status.valid = false; status.error = t(`FILE_SIZE_EXCEEDED_5MB`); + } + + return status; +} +const checkIfAllValidFiles = (files, regex, maxSize, t, maxFilesAllowed, state) => { + if (!files.length || !regex || !maxSize) return [{}, false]; + + // added another condition files.length > 0 , for when user uploads files more than maxFilesAllowed in one go the + const uploadedFiles = state.length + 1 + if ( maxFilesAllowed && (uploadedFiles > maxFilesAllowed || files.length > maxFilesAllowed)) return [[{ valid: false, name: files[0]?.name?.substring(0, 15), error: t(`FILE_LIMIT_EXCEEDED`)}],true] + + // Adding a check for fileSize > maxSize + // const maxSizeInBytes = maxSize * 1000000 + // if(files?.some(file => file.size > maxSizeInBytes)){ + // return [[{ valid: false, name: "", error: t(`FILE_SIZE_EXCEEDED_5MB`) }], true] + // } + + const messages = []; + let isInValidGroup = false; + for (let file of files) { + const fileStatus = fileValidationStatus(file, regex, maxSize, t); + if (!fileStatus.valid) { + isInValidGroup = true; + } + messages.push(fileStatus); + } + + return [messages, isInValidGroup]; +} + +// can use react hook form to set validations @neeraj-egov +const MultiUploadWrapper = ({ t, module = "PGR", tenantId = Digit.ULBService.getStateId(), getFormState, requestSpecifcFileRemoval, extraStyleName = "", setuploadedstate = [], showHintBelow, hintText, allowedFileTypesRegex = /(.*?)(jpg|jpeg|webp|aif|png|image|pdf|msword|openxmlformats-officedocument)$/i, allowedMaxSizeInMB = 10, acceptFiles = "image/*, .jpg, .jpeg, .webp, .aif, .png, .image, .pdf, .msword, .openxmlformats-officedocument, .dxf", maxFilesAllowed, customClass="", customErrorMsg,containerStyles }) => { + const FILES_UPLOADED = "FILES_UPLOADED" + const TARGET_FILE_REMOVAL = "TARGET_FILE_REMOVAL" + + const [fileErrors, setFileErrors] = useState([]); + const [enableButton, setEnableButton] = useState(true) + + const uploadMultipleFiles = (state, payload) => { + const { files, fileStoreIds } = payload; + const filesData = Array.from(files) + const newUploads = filesData?.map((file, index) => [file.name, { file, fileStoreId: fileStoreIds[index] }]) + return [...state, ...newUploads] + } + + const removeFile = (state, payload) => { + const __indexOfItemToDelete = state.findIndex(e => e[1].fileStoreId.fileStoreId === payload.fileStoreId.fileStoreId) + const mutatedState = state.filter((e, index) => index !== __indexOfItemToDelete) + setFileErrors([]) + return [...mutatedState] + } + + const uploadReducer = (state, action) => { + switch (action.type) { + case FILES_UPLOADED: + return uploadMultipleFiles(state, action.payload) + case TARGET_FILE_REMOVAL: + return removeFile(state, action.payload) + default: + break; + } + } + + const [state, dispatch] = useReducer(uploadReducer, [...setuploadedstate]) + + const onUploadMultipleFiles = async (e) => { + setEnableButton(false) + setFileErrors([]) + const files = Array.from(e.target.files); + + if (!files.length) return; + const [validationMsg, error] = checkIfAllValidFiles(files, allowedFileTypesRegex, allowedMaxSizeInMB, t, maxFilesAllowed, state); + + if (!error) { + try { + const { data: { files: fileStoreIds } = {} } = await Digit.UploadServices.MultipleFilesStorage(module, e.target.files, tenantId) + setEnableButton(true) + return dispatch({ type: FILES_UPLOADED, payload: { files: e.target.files, fileStoreIds } }) + } catch (err) { + setEnableButton(true) + } + } else { + setFileErrors(validationMsg) + setEnableButton(true) + } + } + + useEffect(() => getFormState(state), [state]) + + useEffect(() => { + requestSpecifcFileRemoval ? dispatch({ type: TARGET_FILE_REMOVAL, payload: requestSpecifcFileRemoval }) : null + }, [requestSpecifcFileRemoval]) + + return ( +
+ onUploadMultipleFiles(e)} + removeTargetedFile={(fileDetailsData) => dispatch({ type: TARGET_FILE_REMOVAL, payload: fileDetailsData })} + uploadedFiles={state} + multiple={true} + showHintBelow={showHintBelow} + hintText={hintText} + extraStyleName={extraStyleName} + onDelete={() => { + setFileErrors([]) + }} + accept={acceptFiles} + message={t(`WORKS_NO_FILE_SELECTED`)} + customClass={customClass} + enableButton={enableButton} + /> + + {fileErrors.length ? fileErrors.map(({ valid, name, type, size, error }) => ( + valid ? null : displayError({ t, error, name }, customErrorMsg) + )) : null} + +
) +} + +export default MultiUploadWrapper \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/OnGroundEventCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/OnGroundEventCard.js new file mode 100644 index 00000000000..317c79faac6 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/OnGroundEventCard.js @@ -0,0 +1,28 @@ +import React from "react" +import EventCalendarView from "../atoms/EventCalendarView" +import { MapMarker, Clock } from "../atoms/svgindex" + +const OnGroundEventCard = ({onClick = () => null, name, id, eventDetails, onGroundEventMonth="MAR", onGroundEventDate="12 - 16", onGroundEventName="To the moon", onGroundEventLocation="Moon", onGroundEventTimeRange="10:00 am - 1:00 pm", eventCategory, showEventCatergory }) => { + + const onEventCardClick = () => onClick(id) + + return
+ +
+

{name}

+ {!showEventCatergory ?
+ +

{eventDetails?.address}

+
: null} + {!showEventCatergory ?
+ +

{onGroundEventTimeRange}

+
: null} + {showEventCatergory ?
+

{eventCategory}

+
: null} +
+
+} + +export default OnGroundEventCard \ No newline at end of file diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PageBasedInput.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PageBasedInput.js new file mode 100644 index 00000000000..0615e05fa7d --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PageBasedInput.js @@ -0,0 +1,19 @@ +import React from "react"; +import Card from "../atoms/Card"; +import SubmitBar from "../atoms/SubmitBar"; + +const PageBasedInput = ({ children, texts, onSubmit }) => { + return ( +
+ + {children} + + +
+ +
+
+ ); +}; + +export default PageBasedInput; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PitDimension.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PitDimension.js new file mode 100644 index 00000000000..733d555764c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/PitDimension.js @@ -0,0 +1,52 @@ +import React from "react"; +import TextInput from "../atoms/TextInput"; +import CardText from "../atoms/CardText"; + +const DimentionInput = ({ name, value, onChange, disable }) => ( + +); + +const PitDimension = ({ sanitationType, t, size = {}, handleChange, disable = false }) => { + return sanitationType?.dimension === "dd" ? ( +
+
+ + + {t("CS_FILE_PROPERTY_DIAMETER")} + +
+ x +
+ + + {t("CS_FILE_PROPERTY_HEIGHT")} + +
+
+ ) : ( +
+
+ + + {t("CS_FILE_PROPERTY_LENGTH")} + +
+ x +
+ + + {t("CS_FILE_PROPERTY_WIDTH")} + +
+ x +
+ + + {t("CS_FILE_PROPERTY_HEIGHT")} + +
+
+ ); +}; + +export default PitDimension; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RadioOrSelect.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RadioOrSelect.js new file mode 100644 index 00000000000..75e201cc812 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RadioOrSelect.js @@ -0,0 +1,55 @@ +import React from "react"; +import RadioButtons from "../atoms/RadioButtons"; +import Dropdown from "../atoms/Dropdown"; + +const RadioOrSelect = ({ + options, + onSelect, + optionKey, + selectedOption, + isMandatory, + t, + labelKey, + dropdownStyle = {}, + isDependent = false, + disabled = false, + optionCardStyles, + isPTFlow=false, + isDropDown = false, + innerStyles = {}, + inputStyle = {} +}) => { + return ( + + {options?.length < 5 && !isDropDown ? ( + + ) : ( + + )} + + ); +}; + +export default RadioOrSelect; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.js new file mode 100644 index 00000000000..104a6339a52 --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.js @@ -0,0 +1,108 @@ +import React, { useState } from "react"; +import { useForm } from "react-hook-form"; +import PropTypes from "prop-types"; + +import TextArea from "../atoms/TextArea"; +import CardLabel from "../atoms/CardLabel"; +import Rating from "../atoms/Rating"; +import CheckBox from "../atoms/CheckBox"; +import Card from "../atoms/Card"; +import CardHeader from "../atoms/CardHeader"; +import SubmitBar from "../atoms/SubmitBar"; +import RadioButtons from "../atoms/RadioButtons"; +import Dropdown from "../atoms/Dropdown"; + +const RatingCard = ({ config, onSelect, t }) => { + const { register, watch, handleSubmit } = useForm(); + const [comments, setComments] = useState(""); + const [rating, setRating] = useState(0); + + const onSubmit = (data) => { + data.rating = rating; + onSelect(data); + }; + + const feedback = (e, ref, index) => { + setRating(index); + }; + + const segments = config.inputs?.map((input, index) => { + if (input.type === "rate") { + return ( + + {t(input.label)} + {input?.error} + feedback(e, ref, i)} /> + + ); + } + + if (input.type === "checkbox") { + return ( + + {t(input.label)} + {input.checkLabels && + input.checkLabels.map((label, index) => )} + + ); + } + + if (input.type === "radio") { + return ( + + {t(input.label)} + + + ); + } + + if (input.type === "textarea") { + return ( + + {t(input.label)} + + + ); + } + + if (input.type === "dropDown") { + return ( + + {t(input.label)} + + + ); + } + }); + return ( +
+ + {t(config.texts.header)} + {segments} + + +
+ ); +}; + +RatingCard.propTypes = { + config: PropTypes.object, + onSubmit: PropTypes.func, + t: PropTypes.func, +}; + +RatingCard.defaultProps = { + config: {}, + onSubmit: undefined, + t: (value) => value, +}; + +export default RatingCard; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.stories.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.stories.js new file mode 100644 index 00000000000..ee8a52c619e --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RatingCard.stories.js @@ -0,0 +1,37 @@ +import React from "react"; + +import RatingCard from "./RatingCard"; + +export default { + title: "Molecule/RatingCard", + component: RatingCard, +}; + +const Template = (args) => ; + +export const InputTypeRate = Template.bind({}); + +InputTypeRate.args = { + config: { + inputs: [{ type: "rate", label: "Label" }], + texts: { header: "Header", submitBarLabel: "Submit" }, + }, +}; + +export const InputTypeCheckbox = Template.bind({}); + +InputTypeCheckbox.args = { + config: { + inputs: [{ type: "checkbox", label: "Label", checkLabels: ["Check Label"] }], + texts: { header: "Header", submitBarLabel: "Submit" }, + }, +}; + +export const InputTypeTextArea = Template.bind({}); + +InputTypeTextArea.args = { + config: { + inputs: [{ type: "textarea", label: "Label", name: "name" }], + texts: { header: "Header", submitBarLabel: "Submit" }, + }, +}; diff --git a/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RenderFormFields.js b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RenderFormFields.js new file mode 100644 index 00000000000..7449cb69a8c --- /dev/null +++ b/frontend/workbench-ui/web/micro-ui-internals/packages/react-components/src/molecules/RenderFormFields.js @@ -0,0 +1,349 @@ +import React from 'react'; +import { useTranslation } from "react-i18next"; +import { Controller } from "react-hook-form"; +import CardLabelError from "../atoms/CardLabelError"; +import LabelFieldPair from '../atoms/LabelFieldPair'; +import CardLabel from "../atoms/CardLabel"; +import TextInput from "../atoms/TextInput"; +import TextArea from "../atoms/TextArea"; +import CustomDropdown from './CustomDropdown'; +import MobileNumber from '../atoms/MobileNumber'; +import DateRangeNew from './DateRangeNew'; +import MultiUploadWrapper from "./MultiUploadWrapper"; +import MultiSelectDropdown from '../atoms/MultiSelectDropdown'; +import LocationDropdownWrapper from './LocationDropdownWrapper'; +import WorkflowStatusFilter from './WorkflowStatusFilter'; +import ApiDropdown from './ApiDropdown'; +const RenderFormFields = ({data,...props}) => { + + const { t } = useTranslation(); + const { fields, control, formData, errors, register, setValue, getValues, setError, clearErrors, apiDetails} = props + + const fieldSelector = (type, populators, isMandatory, disable = false, component, config) => { + const Component = typeof component === "string" ? Digit.ComponentRegistryService.getComponent(component) : component; + let customValidations = config?.additionalValidation ? Digit?.Customizations?.[apiDetails?.masterName]?.[apiDetails?.moduleName]?.additionalValidations(config?.additionalValidation?.type, formData, config?.additionalValidation?.keys) : null + const customRules = customValidations ? { validate: customValidations} : {} + switch (type) { + case "date": + case "text": + case "number": + case "password": + case "time": + return ( + ( + + )} + name={populators.name} + rules={{required: isMandatory, ...populators.validation, ...customRules }} + control={control} + /> + ); + + case "textarea": + return ( + ( +