From 2546b65e3d6a9b5b55b31854197b525dcd2cf306 Mon Sep 17 00:00:00 2001 From: SwethaKrish4 <110164892+SwethaKrish4@users.noreply.github.com> Date: Mon, 3 Jun 2024 20:29:38 +0530 Subject: [PATCH] MOSIP-32711: Added submit flow in request policy (#408) Signed-off-by: SwethaKrish4 <110164892+SwethaKrish4@users.noreply.github.com> --- pmp-reactjs-ui/public/i18n/ara.json | 10 +- pmp-reactjs-ui/public/i18n/eng.json | 10 +- pmp-reactjs-ui/public/i18n/fra.json | 10 +- pmp-reactjs-ui/src/AppRoutes.js | 5 + .../src/pages/policies/PoliciesFilter.js | 46 ++++++-- .../src/pages/policies/RequestPolicy.js | 100 ++++++++++++++++-- .../policies/RequestPolicyConfirmation.js | 67 ++++++++++++ .../src/svg/success_message_icon.svg | 22 ++++ 8 files changed, 249 insertions(+), 21 deletions(-) create mode 100644 pmp-reactjs-ui/src/pages/policies/RequestPolicyConfirmation.js create mode 100644 pmp-reactjs-ui/src/svg/success_message_icon.svg diff --git a/pmp-reactjs-ui/public/i18n/ara.json b/pmp-reactjs-ui/public/i18n/ara.json index 68d13a3c3..14d12a895 100644 --- a/pmp-reactjs-ui/public/i18n/ara.json +++ b/pmp-reactjs-ui/public/i18n/ara.json @@ -143,12 +143,16 @@ "clearForm": "شكل واضح", "cancel": "يلغي", "submit": "يُقدِّم", - "errorInResponse": "يوجد خطأ ما في جلب التفاصيل لجميع مجموعات السياسات المعتمدة. حاول مرة أخرى في وقت لاحق", - "errorInFetchingPolicyNames": "يوجد خطأ ما في جلب أسماء السياسات. حاول مرة أخرى في وقت لاحق" + "errorInResponse": "يوجد خطأ ما في جلب التفاصيل لجميع مجموعات السياسات المعتمدة. حاول مرة أخرى في وقت لاحق!", + "errorInFetchingPolicyNames": "يوجد خطأ ما في جلب أسماء السياسات. حاول مرة أخرى في وقت لاحق!", + "errorInMapPolicy": "هناك بعض الخطأ في طلب سياسة جديدة. حاول مرة أخرى في وقت لاحق!", + "policySuccessHeader": "تم إرسال السياسة بنجاح!", + "policySuccessMsg":"تم إرسال عملية طلب السياسة بنجاح. الموافقة في انتظار المشرف." }, "commons": { "home": "بيت", - "search": "يبحث" + "search": "يبحث", + "goBack": "عُد" }, "serverError": { "PMS_COR_001": "معلمة الإدخال مفقود", diff --git a/pmp-reactjs-ui/public/i18n/eng.json b/pmp-reactjs-ui/public/i18n/eng.json index 8d1b5b27c..57fc17854 100644 --- a/pmp-reactjs-ui/public/i18n/eng.json +++ b/pmp-reactjs-ui/public/i18n/eng.json @@ -143,12 +143,16 @@ "clearForm": "Clear Form", "cancel": "Cancel", "submit": "Submit", - "errorInResponse": "There is some error in fetching the details for all approved policy groups. Try again later", - "errorInFetchingPolicyNames": "There is some error in fetching the policy names. Try again later" + "errorInResponse": "There is some error in fetching the details for all approved policy groups. Try again later!", + "errorInFetchingPolicyNames": "There is some error in fetching the policy names. Try again later!", + "errorInMapPolicy": "There is some error in requesting a new policy. Try again later!", + "policySuccessHeader": "Policy Submitted Successfully!", + "policySuccessMsg":"Policy request process has been successfully submitted. Approval is pending with admin." }, "commons": { "home": "Home", - "search": "Search" + "search": "Search", + "goBack": "Go Back" }, "serverError": { "PMS_COR_001": "Missing Input Parameter", diff --git a/pmp-reactjs-ui/public/i18n/fra.json b/pmp-reactjs-ui/public/i18n/fra.json index 09325d6ad..d08de4fff 100644 --- a/pmp-reactjs-ui/public/i18n/fra.json +++ b/pmp-reactjs-ui/public/i18n/fra.json @@ -144,12 +144,16 @@ "clearForm": "Forme claire", "cancel": "Annuler", "submit": "Soumettre", - "errorInResponse": "Une erreur s'est produite lors de la récupération des détails de tous les groupes de stratégies approuvés. Réessayez plus tard", - "errorInFetchingPolicyNames": "Une erreur s'est produite lors de la récupération des noms de stratégie. Réessayez plus tard" + "errorInResponse": "Une erreur s'est produite lors de la récupération des détails de tous les groupes de stratégies approuvés. Réessayez plus tard!", + "errorInFetchingPolicyNames": "Une erreur s'est produite lors de la récupération des noms de stratégie. Réessayez plus tard!", + "errorInMapPolicy": "Il y a une erreur lors de la demande d'une nouvelle politique. Réessayez plus tard!", + "policySuccessHeader": "Politique soumise avec succès !", + "policySuccessMsg":"Le processus de demande de politique a été soumis avec succès. L'approbation est en attente auprès de l'administrateur." }, "commons": { "home": "Maison", - "search": "Recherche" + "search": "Recherche", + "goBack": "Retourner" }, "serverError": { "PMS_COR_001": "Paramètre d'entrée manquant", diff --git a/pmp-reactjs-ui/src/AppRoutes.js b/pmp-reactjs-ui/src/AppRoutes.js index d3a944857..7f286f10e 100644 --- a/pmp-reactjs-ui/src/AppRoutes.js +++ b/pmp-reactjs-ui/src/AppRoutes.js @@ -6,6 +6,7 @@ import Policies from './pages/policies/Policies.js'; import Dashboard from './pages/dashboard/Dashboard.js'; import ViewPolicyDetails from './pages/policies/ViewPolicyDetails.js'; import RequestPolicy from './pages/policies/RequestPolicy'; +import RequestPolicyConfirmation from './pages/policies/RequestPolicyConfirmation.js'; function AppRoutes() { @@ -37,6 +38,10 @@ function AppRoutes() { { path: 'requestPolicy', element: , + }, + { + path: 'requestPolicyConfirmation', + element: , } ], }, diff --git a/pmp-reactjs-ui/src/pages/policies/PoliciesFilter.js b/pmp-reactjs-ui/src/pages/policies/PoliciesFilter.js index 6900b17cd..6e4884de4 100644 --- a/pmp-reactjs-ui/src/pages/policies/PoliciesFilter.js +++ b/pmp-reactjs-ui/src/pages/policies/PoliciesFilter.js @@ -2,7 +2,7 @@ import { useState, useEffect } from 'react'; import DropdownComponent from '../common/fields/DropdownComponent.js'; import { useTranslation } from 'react-i18next'; -import { createDropdownDataList } from '../../utils/AppUtils.js'; +import { getPartnerTypeDescription, getStatusCode } from '../../utils/AppUtils.js'; function PoliciesFilter({ filteredPoliciesList, onFilterChange }) { const { t } = useTranslation(); @@ -13,12 +13,46 @@ function PoliciesFilter({ filteredPoliciesList, onFilterChange }) { const [statusData, setStatusData] = useState([]); useEffect(() => { + const getData = (fieldName) => { + let dataArr = []; + dataArr.push({ + fieldCode: "", + fieldValue: "" + }); + filteredPoliciesList.forEach(item => { + let alreadyAdded = false; + dataArr.forEach(item1 => { + if (item1.fieldValue === item[fieldName]) { + alreadyAdded = true; + } + }); + if (!alreadyAdded) { + if (fieldName === "partnerType") { + dataArr.push({ + fieldCode: getPartnerTypeDescription(item[fieldName], t), + fieldValue: item[fieldName] + }); + } else if (fieldName === "status") { + dataArr.push({ + fieldCode: getStatusCode(item[fieldName], t), + fieldValue: item[fieldName] + }); + } else { + dataArr.push({ + fieldCode: item[fieldName], + fieldValue: item[fieldName] + }); + } + } + }); + return dataArr; + } const fetchData = async () => { - setPartnerIdData(createDropdownDataList('partnerId', filteredPoliciesList, t)); - setPartnerTypeData(createDropdownDataList('partnerType', filteredPoliciesList, t)); - setPolicyGroupNameData(createDropdownDataList('policyGroupName', filteredPoliciesList, t)); - setPolicyNameData(createDropdownDataList('policyName', filteredPoliciesList, t)); - setStatusData(createDropdownDataList('status', filteredPoliciesList, t)); + setPartnerIdData(getData('partnerId')); + setPartnerTypeData(getData('partnerType')); + setPolicyGroupNameData(getData('policyGroupName')); + setPolicyNameData(getData('policyName')); + setStatusData(getData('status')); }; fetchData(); }, [filteredPoliciesList, t]); diff --git a/pmp-reactjs-ui/src/pages/policies/RequestPolicy.js b/pmp-reactjs-ui/src/pages/policies/RequestPolicy.js index 1d36e2aeb..533573b02 100644 --- a/pmp-reactjs-ui/src/pages/policies/RequestPolicy.js +++ b/pmp-reactjs-ui/src/pages/policies/RequestPolicy.js @@ -1,7 +1,7 @@ import { useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import { useTranslation } from "react-i18next"; -import { getPartnerManagerUrl, getPolicyManagerUrl, handleServiceErrors, createDropdownDataList, moveToPolicies } from '../../utils/AppUtils'; +import { getPartnerManagerUrl, getPolicyManagerUrl, handleServiceErrors, moveToPolicies } from '../../utils/AppUtils'; import { HttpService } from '../../services/HttpService'; import LoadingIcon from "../common/LoadingIcon"; import ErrorMessage from "../common/ErrorMessage"; @@ -16,6 +16,7 @@ function RequestPolicy() { const [errorCode, setErrorCode] = useState(""); const [errorMsg, setErrorMsg] = useState(""); const [partnerId, setPartnerId] = useState(""); + const [policyId, setPolicyId] = useState(""); const [policyName, setPolicyName] = useState(""); const [partnerType, setPartnerType] = useState(""); const [policyGroupName, setPolicyGroupName] = useState(""); @@ -42,7 +43,7 @@ function RequestPolicy() { if (responseData && responseData.response) { const resData = responseData.response; setPartnerData(resData); - setPartnerIdDropdownData(createDropdownDataList('partnerId', partnerData, t)); + setPartnerIdDropdownData(createPartnerIdDropdownData('partnerId', partnerData)); console.log('Response data:', partnerData.length); } else { handleServiceErrors(responseData, setErrorCode, setErrorMsg); @@ -59,6 +60,54 @@ function RequestPolicy() { fetchData(); }, [partnerData.length, t]); + const createPartnerIdDropdownData = (fieldName, dataList) => { + let dataArr = []; + dataArr.push({ + fieldCode: "", + fieldValue: "" + }); + dataList.forEach(item => { + let alreadyAdded = false; + dataArr.forEach(item1 => { + if (item1.fieldValue === item[fieldName]) { + alreadyAdded = true; + } + }); + if (!alreadyAdded) { + dataArr.push({ + fieldCode: item[fieldName], + fieldValue: item[fieldName] + }); + } + }); + return dataArr; + } + + const createPoliciesDropdownData = (fieldName, dataList) => { + let dataArr = []; + dataArr.push({ + fieldCode: "", + fieldValue: "", + fieldDescription: "" + }); + dataList.forEach(item => { + let alreadyAdded = false; + dataArr.forEach(item1 => { + if (item1.fieldValue === item[fieldName]) { + alreadyAdded = true; + } + }); + if (!alreadyAdded) { + dataArr.push({ + fieldCode: item[fieldName], + fieldValue: item.id, + fieldDescription: item.descr + }); + } + }); + return dataArr; + } + const onChangePartnerId = async (fieldName, selectedValue) => { setPartnerId(selectedValue); // Find the selected partner data @@ -72,7 +121,11 @@ function RequestPolicy() { }; const onChangePolicyName = (fieldName, selectedValue) => { - setPolicyName(selectedValue); + setPolicyId(selectedValue); + const selectedPolicy = policiesDropdownData.find(item => item.fieldValue === selectedValue); + if (selectedPolicy) { + setPolicyName(selectedPolicy.fieldCode); + } }; const getListofPolicies = async (policyGroupName) => { @@ -87,7 +140,7 @@ function RequestPolicy() { const responseData = response.data; if (responseData && responseData.response) { const resData = responseData.response; - setPoliciesDropdownData(createDropdownDataList('name', resData, t)); + setPoliciesDropdownData(createPoliciesDropdownData('name', resData)); console.log(`Response data: ${resData.length}`); } else { handleServiceErrors(responseData, setErrorCode, setErrorMsg); @@ -108,8 +161,43 @@ function RequestPolicy() { setPolicyGroupName(""); setPolicyName(""); setPartnerComments(""); + setPoliciesDropdownData([]); }; + const clickOnSubmit = async () => { + setErrorCode(""); + setErrorMsg(""); + setDataLoaded(false); + let request = { + request: { + partnerId: partnerId, + policyId: policyId, + policyName: policyName, + requestDetail: partnerComments, + useCaseDescription: partnerComments + }, + } + try { + const response = await HttpService.post(getPartnerManagerUrl(`/partners/${partnerId}/policy/map`, process.env.NODE_ENV), request); + if (response) { + const responseData = response.data; + if (responseData && responseData.response) { + const resData = responseData.response; + navigate('/partnermanagement/requestPolicyConfirmation'); + console.log(`Response data: ${resData.length}`); + } else { + handleServiceErrors(responseData, setErrorCode, setErrorMsg); + } + } else { + setErrorMsg(t('requestPolicy.errorInMapPolicy')); + } + setDataLoaded(true); + } catch (err) { + setErrorMsg(err); + console.log("Error fetching data: ", err); + } + } + const isFormValid = () => { return partnerId && policyName && partnerComments; }; @@ -201,7 +289,7 @@ function RequestPolicy() { onDropDownChangeEvent={onChangePolicyName} fieldNameKey='requestPolicy.policyName*' placeHolderKey='requestPolicy.selectPolicyName' - selectedDropdownValue={policyGroupName} + selectedDropdownValue={policyName} searchKey='commons.search' styleSet={styleForSearch}> @@ -223,7 +311,7 @@ function RequestPolicy() {
- +
diff --git a/pmp-reactjs-ui/src/pages/policies/RequestPolicyConfirmation.js b/pmp-reactjs-ui/src/pages/policies/RequestPolicyConfirmation.js new file mode 100644 index 000000000..ec52981dd --- /dev/null +++ b/pmp-reactjs-ui/src/pages/policies/RequestPolicyConfirmation.js @@ -0,0 +1,67 @@ +import React from 'react' +import { useNavigate } from "react-router-dom"; +import { useTranslation } from "react-i18next"; +import { getUserProfile } from '../../services/UserProfileService'; +import { isLangRTL } from '../../utils/AppUtils'; + +import backArrow from '../../svg/back_arrow.svg'; +import successIcon from '../../svg/success_message_icon.svg'; + +function RequestPolicyConfirmation() { + + const navigate = useNavigate(); + const { t } = useTranslation(); + const isLoginLanguageRTL = isLangRTL(getUserProfile().langCode); + + const moveToHome = () => { + navigate('/partnermanagement') + }; + + const moveToPolicies = () => { + navigate('/partnermanagement/policies') + }; + + return ( +
+
+
+ +
+

{t('requestPolicy.requestPolicy')}

+
+

moveToHome()} className="font-semibold text-tory-blue text-xs cursor-pointer"> + {t('commons.home')} / +

+

moveToPolicies()} className="font-semibold text-tory-blue text-xs cursor-pointer"> + {t('requestPolicy.policies')} +

+
+
+
+
+
+ +
+

+ {t('requestPolicy.policySuccessHeader')} +

+

+ {t('requestPolicy.policySuccessMsg')} +

+
+ + +
+
+
+
+
+
+ ) +} + +export default RequestPolicyConfirmation; \ No newline at end of file diff --git a/pmp-reactjs-ui/src/svg/success_message_icon.svg b/pmp-reactjs-ui/src/svg/success_message_icon.svg new file mode 100644 index 000000000..4943753d3 --- /dev/null +++ b/pmp-reactjs-ui/src/svg/success_message_icon.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + +