From 5915506e75e2039c1db1bdc2c5b6c1bc66505c2a Mon Sep 17 00:00:00 2001 From: Abishek Date: Fri, 27 Sep 2024 10:06:17 +0530 Subject: [PATCH 1/2] Cherrrypicked from summary-screen1 --- .../packages/modules/microplan/src/Module.js | 12 + .../microplan/src/components/DataMgmtTable.js | 58 +++ .../microplan/src/components/FileComponent.js | 70 +++ .../microplan/src/components/HeaderComp.js | 30 ++ .../src/components/HeaderPlusThreeInput.js | 34 ++ .../src/components/ThreeInputComp.js | 52 ++ .../src/configs/SetupMicroplanConfig.js | 26 + .../microplan/src/pages/SummaryScreen.js | 483 ++++++++++++++++++ 8 files changed, 765 insertions(+) create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/DataMgmtTable.js create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/FileComponent.js create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/ThreeInputComp.js create mode 100644 health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js index 34749ef06fb..e0350a9ec08 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js @@ -9,6 +9,12 @@ import CampaignDetails from "./components/CampaignDetails"; import { ProviderContext } from "./utils/context"; import BoundarySelection from "./components/BoundarySelection"; import HypothesisWrapper from "./components/HypothesisWrapper"; +import DataMgmtTable from "./components/DataMgmtTable"; +import FileComponent from "./components/FileComponent"; +import HeaderComp from "./components/HeaderComp"; +import HeaderPlusThreeInput from "./components/HeaderPlusThreeInput"; +import ThreeInputComp from "./components/ThreeInputComp"; +import SummaryScreen from "./pages/SummaryScreen"; export const MicroplanModule = ({ stateCode, userType, tenants }) => { const { path, url } = useRouteMatch(); @@ -43,6 +49,12 @@ const componentsToRegister = { MicroplanDetails, BoundarySelection, HypothesisWrapper, + DataMgmtTable, + FileComponent, + HeaderComp, + HeaderPlusThreeInput, + ThreeInputComp, + SummaryScreen }; diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/DataMgmtTable.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/DataMgmtTable.js new file mode 100644 index 00000000000..e5546d4cae5 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/DataMgmtTable.js @@ -0,0 +1,58 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import { EditIcon } from "@egovernments/digit-ui-react-components"; +import { DeleteIconv2 } from "@egovernments/digit-ui-react-components"; +import { FileIcon } from "@egovernments/digit-ui-react-components"; +import { Button } from "@egovernments/digit-ui-react-components"; +import { Card } from "@egovernments/digit-ui-react-components"; +import { CardSubHeader } from "@egovernments/digit-ui-react-components"; +import { InboxSearchComposer } from "@egovernments/digit-ui-react-components"; + +import { Table } from '@egovernments/digit-ui-react-components'; + + +const DataMgmtTable = ({ file, index, handleFileDelete, handleRedirect, setShowPreview }) => { + + + const { t } = useTranslation(); + const columns = [ + { Header: 'Vehicle type', accessor: 'vehicleType' }, + { Header: 'Manufacturer', accessor: 'manufacturer' }, + { Header: 'Model', accessor: 'model' }, + { Header: 'Capacity(in Bales)', accessor: 'cap' }, + + ]; + + const data = [ + { vehicleType: 'Truck', manufacturer: "Draft", model: 'Household',cap:"70" }, + { vehicleType: 'Motorcycle', manufacturer: "Draft", model: 'Household',cap:"2" }, + { vehicleType: 'Motorcycle', manufacturer: "Draft", model: 'Household', cap:"2" }, + ]; + return ( +
+ + {/* Second card */} + + +
+ Vehicles +
+ { + return { + style: { + padding: "20px 18px", + fontSize: "16px", + whiteSpace: "normal", + }, + }; + }} + t={t} + /> + + + ); +}; + +export default DataMgmtTable; \ No newline at end of file diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/FileComponent.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/FileComponent.js new file mode 100644 index 00000000000..00f85072a74 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/FileComponent.js @@ -0,0 +1,70 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import { EditIcon } from "@egovernments/digit-ui-react-components"; +import { DeleteIconv2 } from "@egovernments/digit-ui-react-components"; +import { FileIcon } from "@egovernments/digit-ui-react-components"; +import { Button } from "@egovernments/digit-ui-react-components"; +import { Card } from "@egovernments/digit-ui-react-components"; +import { CardSubHeader } from "@egovernments/digit-ui-react-components"; +import { InboxSearchComposer } from "@egovernments/digit-ui-react-components"; +import { Table } from '@egovernments/digit-ui-react-components'; + +const FileComponent = ({ title,fileName,editHandler,deleteHandler}) => { + const {t}=useTranslation(); + return ( +
+ + {/* First card */} +
+ {title} + +
+ +
+ {/* Left side: File Icon */} +
setShowPreview(true)} + > + +
{fileName}
+
+ + {/* Right side: Edit and Delete Buttons */} +
+ {/* Edit Icon and Button */} +
handleRedirect(1)}> + {/* {t("CAMPAIGN_EDIT")} */} +
+ + {/* Delete Button */} +
+
+ + +
+ ); +}; + +export default FileComponent; + \ No newline at end of file diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js new file mode 100644 index 00000000000..48df697d658 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js @@ -0,0 +1,30 @@ +import React from 'react'; +import { Card } from '@egovernments/digit-ui-react-components'; +import { Header } from '@egovernments/digit-ui-react-components'; +import { useTranslation } from 'react-i18next'; +const HeaderComp = ({ title,styles = {} }) => { + // Define default styles + const {t}=useTranslation(); + const defaultStyles = { + marginTop: 0, + fontSize: "1.5rem", + color: "#0B4B66", + }; + + // Merge default styles with the custom styles passed as a prop + const mergedStyles = { ...defaultStyles, ...styles }; + console.log("headerComp",title); + console.log("headerComp1",typeof title); + + + return ( +
+ {/* Apply the merged styles */} +
+ {t(title)} +
+
+ ); +}; + +export default HeaderComp; diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js new file mode 100644 index 00000000000..3f6b0df8929 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js @@ -0,0 +1,34 @@ +import React from 'react'; +import ThreeInputComp from './ThreeInputComp'; +import HeaderComp from './HeaderComp'; +import { useTranslation } from 'react-i18next'; + +const HeaderPlusThreeInput = ({ title, threeInputArr }) => { + const { t } = useTranslation(); + console.log("hello", title, threeInputArr); + + return ( +
+ + + { + threeInputArr.map((arr) => { + console.log("hello1", arr); + console.log("hello2", arr[0], arr[1], arr[2], arr[3]); + + return ( + + ); + }) + } + +
+ ); +}; + +export default HeaderPlusThreeInput; diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/ThreeInputComp.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/ThreeInputComp.js new file mode 100644 index 00000000000..913efeadf00 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/ThreeInputComp.js @@ -0,0 +1,52 @@ +import React, { useState, useEffect, Fragment } from "react"; +import { useTranslation } from "react-i18next"; +import { Card, Header, LabelFieldPair, Button } from "@egovernments/digit-ui-react-components"; +import { Dropdown, FieldV1 } from "@egovernments/digit-ui-components"; +import { TextInput } from "@egovernments/digit-ui-react-components"; + +const ThreeInputComp = ( {output, input1, input2, input3} ) => { + + const { t } = useTranslation(); + + const onSelect = (selectedValue) => { + console.log("Selected value:", selectedValue); + }; + console.log("threeinut",output, input1, input2, input3); + return ( +
+ {/* Header component */} + + {/* Card Component */} + + {/* Loop through some data to render LabelFieldPair */} + +
+ + {t(output)} +
=
+ + {/* < value={input1} type="text" styles={{ width: "17rem", marginBottom: "0" }}/> */} + + + + + + {/* */} + + {/* */} + + + + + + + {/* Divider */} +
+
+ + +
+ ); +}; + +export default ThreeInputComp; diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/configs/SetupMicroplanConfig.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/configs/SetupMicroplanConfig.js index a11147861f9..5f6dd677aa0 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/configs/SetupMicroplanConfig.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/configs/SetupMicroplanConfig.js @@ -207,6 +207,32 @@ export const MicroplanConfig = (totalFormData, dataParams, isSubmitting, summary }, ], }, + { + stepCount:"8", + key:"8", + name:"SUMMARY_SCREEN", + body: [ + { + isMandatory: false, + key: "summaryscreen", + type: "component", + skipAPICall: false, + resourceToUpdate:"PLAN", + component: "SummaryScreen", + withoutLabel: true, + withoutLabelFieldPair:true, + disable: false, + customProps: { + module: "HCM", + sessionData: totalFormData, + isSubmitting:false, + }, + populators: { + name: "projectType", + }, + }, + ], + } ] } diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js new file mode 100644 index 00000000000..6bc70eb9788 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js @@ -0,0 +1,483 @@ +import React, { Fragment, useEffect, useRef, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { useHistory } from "react-router-dom"; +import { Button, EditIcon, Header, Loader, ViewComposer } from "@egovernments/digit-ui-react-components"; +import { InfoBannerIcon, Toast } from "@egovernments/digit-ui-components"; +import { DownloadIcon } from "@egovernments/digit-ui-react-components"; +import { useParams } from "react-router-dom/cjs/react-router-dom.min"; + + + +const SummaryScreen = () => { + const { t } = useTranslation(); + const history = useHistory(); + const { name } = useParams(); + const tenantId = Digit.ULBService.getCurrentTenantId(); + + const [totalFormData, setTotalFormData] = Digit.Hooks.useSessionStorage("MICROPLAN_DATA", {}); + + + const data = { + cards: [ + { + navigationKey: "card1", + sections: + + [ + { + type: "DATA", + cardHeader: { value: t("CAMPAIGN_DETAILS"), inlineStyles: { marginTop: 0, marginBottom:"0.5rem",fontSize: "1.5rem" } }, + cardSecondaryAction: ( +
{console.log("hello edit")}}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: t("CAMPAIGN_TYPE"), + value: totalFormData.CAMPAIGN_DETAILS?.campaignDetails?.campaignType?.code || "NA", + + }, + { + key: t("CMAPAIGN_DISEASE"), + value: totalFormData.CAMPAIGN_DETAILS?.campaignDetails?.disease?.code || "NA", + }, + { + key: t("RESOURCE_DISTRIBUTION_STRATEGY"), + // value: Digit.Utils.date.convertEpochToDate(data?.[0]?.startDate) || t("CAMPAIGN_SUMMARY_NA"), + value: totalFormData.CAMPAIGN_DETAILS?.campaignDetails?.distributionStrat?.resourceDistributionStrategyCode || "NA" + }, + + ], + inlineStyles: { + marginBottom: "0rem", + }, + // values: data31(), + + + }, + ] + + + },{ + navigationKey: "card1", + sections: [ + { + type: "DATA", + cardHeader: { value: t("Name of microplan"), inlineStyles: { marginTop: 0, fontSize: "1.5rem" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: t("NAME_OF_MICROPLAN"), + value: totalFormData?.MICROPLAN_DETAILS?.microplanDetails?.microplanName || "NA" + + }, + ], + // values:data32(), + + + }, + + ], + + + }, + + + { + navigationKey: "card2", + sections: [ + { + type: "DATA", + cardHeader: { value: t("CAMPAIGN_DETAILS"), inlineStyles: { marginTop: 0, fontSize: "1.5rem" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "Campaign Registration Process", + value: "House to House", + }, + { + key: "Campaign Distribution Process", + value: "House to House", + }, + { + key: "Registration & Distribution", + // value: Digit.Utils.date.convertEpochToDate(data?.[0]?.startDate) || t("CAMPAIGN_SUMMARY_NA"), + value: "Together" + }, + ], + }, + + ] + }, + { + navigationKey: "card2", + sections: [ + { + type: "DATA", + cardHeader: { value: t("General Estimation"), inlineStyles: { marginTop: 0, fontSize: "1.5rem", color: " #0B4B66" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "Average people in a household", + value: "4", + }, + { + key: "Number of bednets per bale", + value: "50" + }, + { + key: "Number of people per bednet ", + value: "50" + }, + ], + }, + + ] + },{ + navigationKey: "card2", + sections: [ + { + type: "DATA", + cardHeader: { value: t("Household Registration information"), inlineStyles: { marginTop: 0, fontSize: "1.5rem", color: " #0B4B66" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "No of days for household registration", + value: "4", + }, + { + key: "Number of beneficiaries to be registered by a registration team per day", + value: "50" + }, + { + key: "Number of members per household registration team ", + value: "4" + }, + { + key: "Number of registration teams per monitor", + value: "4" + }, + { + key: "Number of monitors per supervisor for household registration", + value: "4" + }, + ], + }, + + ], + },{ + navigationKey: "card2", + sections: [ + { + type: "DATA", + cardHeader: { value: t("Campaign commodities"), inlineStyles: { marginTop: 0, fontSize: "1.5rem", color: " #0B4B66" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "Number of households per sticker roll", + value: "20", + }, + + ], + }, + + ] + },{ + navigationKey: "card2", + sections: [ + { + type: "DATA", + cardHeader: { value: t("Campaign vehicles"), inlineStyles: { marginTop: 0, fontSize: "1.5rem", color: " #0B4B66" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "Capacity of vehicle 1(bales)", + value: "20", + }, + { + key: "Capacity of vehicle 2(bales)", + value: "20", + }, + + + ], + }, + + ] + },{ + navigationKey: "card3", + sections: [ + { + type: "DATA", + cardHeader: { value: t("DATA_VALIDATION_RULE"), inlineStyles: { marginTop: 0, fontSize: "1.5rem", color: " #0B4B66" } }, + cardSecondaryAction: ( +
handleRedirect(1)}> + {t(`CAMPAIGN_EDIT`)} + +
+ ), + values: [ + { + key: "Maximum population of a village", + value: "74784784", + }, + { + key: "Maximum population of a village", + value: "74784784", + }, + { + key: "Acceptable change of percentage with respect to the uploaded populatin data", + value: "10%", + isMandatory: true + }, + + + ], + }, + + ] + + + }, ,{ + navigationKey: "card5", + sections: + + [ + { + + type: "COMPONENT", + component: "FormulaConfiguration", + props: { + }, + }, + ] + + + },{ + navigationKey: "card6", + sections: + + [ + { + + type: "COMPONENT", + component: "UserAccessManagement", + props: { + }, + }, + ] + + + },{ + navigationKey: "card7", + sections: + + [ + { + + type: "COMPONENT", + component: "FileComponent", + props: { + title:"Population", + fileName:"file.xlsx", + editHandler:()=>{}, + deleteHandler:()=>{}, + + }, + }, + ] + + + },{ + navigationKey: "card7", + sections: + + [ + { + + type: "COMPONENT", + component: "FileComponent", + props: { + title:"Facilities", + fileName:"file.xlsx", + editHandler:()=>{}, + deleteHandler:()=>{}, + + }, + }, + ] + + + },{ + navigationKey: "card7", + sections: + + [ + { + + type: "COMPONENT", + component: "DataMgmtTable", + props: { + + + }, + }, + ] + + + },{ + navigationKey: "card8", + sections: + + [ + { + + type: "COMPONENT", + component: "HeaderPlusThreeInput", + + props: { + + title:"GENERAL_ESTIMATION", + threeInputArr:[["Number of households per boundary","Population of the boundary","Divided by","Average people HJ/H"], + [ "Number of bednets per boundary","Population of the boundary","Divided by","Average people HJ/H"], + [ "Number of bales per boundary","Population of the boundary","Divided by","Average people HJ/H"] + + ] + + }, + }, + ] + + + },{ + navigationKey: "card8", + sections: + + [ + { + + type: "COMPONENT", + component: "HeaderPlusThreeInput", + + props: { + + title:"HOUSEHOLD_REGISTRATION_INFORMATION", + threeInputArr:[["Number of hosueholds registered","Population of the boundary","Divided by","Average people HJ/H"], + [ "Number of houdeholds registered per boundary","Population of the boundary","Divided by","Average people HJ/H"], + [ "Number of Supervisors per Boundary","Population of the boundary","Divided by","Average people HJ/H"] + + ] + + }, + }, + ] + + + },{ + navigationKey: "card8", + sections: + + [ + { + + type: "COMPONENT", + component: "HeaderPlusThreeInput", + + props: { + + title:"CAMPAIGN_COMMODITIES", + threeInputArr:[["Number of sticker rolls per boundary","Population of the boundary","Divided by","Average people HJ/H"], ] + + }, + }, + ] + + + }, + + ], + horizontalNav: { + showNav: true, + configNavItems: [ + + + { + name: "card1", + active: true, + code: "MICROPLAN_DETAILS", + }, + { + name: "card7", + active: true, + code: "DATA_MGMT", + }, + + + { + name: "card2", + active: true, + code: "MICROPLAN_ASSUMPTIONS", + }, + + + // ,{ + // name: "card5", + // active: true, + // code: "FORMULA_CONFIGURATION", + // }, + // { + // name: "card6", + // active: true, + // code: "USER_ACCESS_MGMT", + // }, + { + name: "card8", + active: true, + code: "FORMULA_CONFIGURATION", + }, + + ], + activeByDefault: "card1", + }, + + } + // console.log("data",data); + return ( + + ) +} + + +export default SummaryScreen \ No newline at end of file From 66ef9a81b239a37c0f9bbcddb808bb5363c103ae Mon Sep 17 00:00:00 2001 From: Abishek Date: Fri, 27 Sep 2024 11:03:16 +0530 Subject: [PATCH 2/2] Removed console.log made css changes --- .../example/public/index.html | 2 +- .../packages/css/package.json | 2 +- .../css/src/components/microplan.scss | 99 +++++++++++++++++++ .../packages/css/src/index.scss | 5 + .../css/src/pages/employee/formulaConfig.scss | 30 ++++++ .../packages/modules/microplan/src/Module.js | 3 +- .../microplan/src/components/HeaderComp.js | 3 +- .../src/components/HeaderPlusThreeInput.js | 5 +- .../src/components/ThreeInputComp.js | 57 ++++++----- .../src/pages/{ => employee}/SummaryScreen.js | 53 +++++----- .../microplan/src/pages/employee/index.js | 3 + 11 files changed, 207 insertions(+), 55 deletions(-) create mode 100644 health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss rename health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/{ => employee}/SummaryScreen.js (95%) diff --git a/health/micro-ui/web/micro-ui-internals/example/public/index.html b/health/micro-ui/web/micro-ui-internals/example/public/index.html index af293726305..8300e813682 100644 --- a/health/micro-ui/web/micro-ui-internals/example/public/index.html +++ b/health/micro-ui/web/micro-ui-internals/example/public/index.html @@ -18,7 +18,7 @@ - + diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/package.json b/health/micro-ui/web/micro-ui-internals/packages/css/package.json index c798bce6ba1..bbcd8df519a 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/css/package.json +++ b/health/micro-ui/web/micro-ui-internals/packages/css/package.json @@ -1,6 +1,6 @@ { "name": "@egovernments/digit-ui-css", - "version": "1.0.70-campaign", + "version": "1.0.71-campaign", "license": "MIT", "main": "dist/index.css", "author": "Jagankumar ", diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss index e69de29bb2d..dcccf02eb4a 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss +++ b/health/micro-ui/web/micro-ui-internals/packages/css/src/components/microplan.scss @@ -0,0 +1,99 @@ +.search-tabs-container { + display: flex; + justify-content: space-between; + background-color: #eee; + + .search-tab-head { + padding: 10px 35px; + font-weight: 700; + font-size: 1rem; + border: 1px solid #d6d5d4; + border-radius: 0.5rem 0.5rem 0 0; + } + + .search-tab-head-selected { + padding: 10px 35px; + color: rgb(244, 119, 56); + background-color: #fff; + border: 1px solid #f47738; + border-radius: 0.5rem 0.5rem 0 0; + border-bottom: 4px solid rgb(244, 119, 56); + font-weight: 700; + font-size: 1.125rem; + margin-bottom: -1rem; + } + + .search-tab-head-selected:focus { + outline: 0; + } + } + +/* Parent container */ +.dm-parent-container { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.5rem 1rem; + background-color: #fff; + margin: 0.5rem 0; + } + + /* Uploaded file container (left side) */ + .dm-uploaded-file-container-sub { + display: flex; + align-items: center; + cursor: pointer; + } + + .dm-icon { + margin-right: 0.5rem; /* Space between icon and filename */ + } + + .dm-file-name { + color: #505a5f; + font-weight: 700; + font-size: 0.875rem; /* Smaller text size */ + } + + /* Actions container (right side) */ + .dm-actions-container { + display: flex; + align-items: center; + gap: 0.75rem; /* Space between edit and delete buttons */ + } + + /* Edit container */ + .dm-campaign-preview-edit-container { + display: flex; + align-items: center; + cursor: pointer; + } + + .dm-campaign-preview-edit-container span { + /*margin-right: 0.25rem;*/ + font-size: 0.875rem; + font-weight: 500; + color: #dc5a32; /* Orange color for the text */ + } + + /* Button styles */ + .dm-workbench-download-template-btn { + border: 1px solid #dc5a32; /* Orange border */ + background-color: transparent; + color: #dc5a32; /* Orange text */ + padding: 0.25rem 0.5rem; + border-radius: 4px; + font-size: 0.875rem; /* Small font size */ + font-weight: 500; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + } + + /* Hover effect for the button */ + .dm-hover:hover { + background-color: #fbe9e6; + border-color: #dc5a32; + } + \ No newline at end of file diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/index.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/index.scss index ff5ace2af3e..38b429723cd 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/css/src/index.scss +++ b/health/micro-ui/web/micro-ui-internals/packages/css/src/index.scss @@ -9,5 +9,10 @@ @import "tailwindcss/utilities"; @import "./components/microplanning.scss"; +@import "./components/microplan.scss"; + @import "./pages/employee/index.scss"; @import "./pages/employee/campaign.scss"; +@import "./pages/employee/formulaConfig.scss"; + + diff --git a/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss b/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss new file mode 100644 index 00000000000..11e2af94301 --- /dev/null +++ b/health/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/formulaConfig.scss @@ -0,0 +1,30 @@ +.formula-label-field{ + display: flex; + gap:1.5rem; + } + .equals-icon { + font-family: 'Roboto Condensed'; /* Set font family */ + font-size: 2.5rem; /* Set font size to 2.5rem */ + font-weight: 700; /* Set font weight */ + line-height: 2.93rem; /* Set line height to 2.93rem */ + text-align: left; /* Align text to the left */ + + width: 1.31rem; /* Set width to 1.31rem */ + height: 2.38rem; /* Set height to 2.38rem */ + gap: 0; /* Set gap to 0rem */ + opacity: 100; /* Set opacity to 0 */ + } + + .formula-label-field > span { + width: 20rem; + font-size: 1.2rem; + margin-right: 2rem; + font-weight: bold; + } + +/* styles.css */ +.header-comp-blue { + margin-top: 0; /* Set margin-top to 0 */ + font-size: 2rem; /* Set font size to 1.5rem */ + color: #0B4B66 !important; /* Set text color */ +} diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js index e0350a9ec08..e1c2047ce37 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/Module.js @@ -14,7 +14,7 @@ import FileComponent from "./components/FileComponent"; import HeaderComp from "./components/HeaderComp"; import HeaderPlusThreeInput from "./components/HeaderPlusThreeInput"; import ThreeInputComp from "./components/ThreeInputComp"; -import SummaryScreen from "./pages/SummaryScreen"; +import SummaryScreen from "./pages/employee/SummaryScreen"; export const MicroplanModule = ({ stateCode, userType, tenants }) => { const { path, url } = useRouteMatch(); @@ -55,6 +55,7 @@ const componentsToRegister = { HeaderPlusThreeInput, ThreeInputComp, SummaryScreen + }; diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js index 48df697d658..7586f97a071 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderComp.js @@ -13,8 +13,7 @@ const HeaderComp = ({ title,styles = {} }) => { // Merge default styles with the custom styles passed as a prop const mergedStyles = { ...defaultStyles, ...styles }; - console.log("headerComp",title); - console.log("headerComp1",typeof title); + return ( diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js index 3f6b0df8929..a4b9c2d50eb 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/components/HeaderPlusThreeInput.js @@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'; const HeaderPlusThreeInput = ({ title, threeInputArr }) => { const { t } = useTranslation(); - console.log("hello", title, threeInputArr); + return (
@@ -13,8 +13,7 @@ const HeaderPlusThreeInput = ({ title, threeInputArr }) => { { threeInputArr.map((arr) => { - console.log("hello1", arr); - console.log("hello2", arr[0], arr[1], arr[2], arr[3]); + return ( { +const ThreeInputComp = ({ output, input1, input2, input3 }) => { const { t } = useTranslation(); const onSelect = (selectedValue) => { - console.log("Selected value:", selectedValue); + }; - console.log("threeinut",output, input1, input2, input3); + return (
{/* Header component */} @@ -19,31 +19,44 @@ const ThreeInputComp = ( {output, input1, input2, input3} ) => { {/* Card Component */} {/* Loop through some data to render LabelFieldPair */} - -
- - {t(output)} -
=
- {/* < value={input1} type="text" styles={{ width: "17rem", marginBottom: "0" }}/> */} - - - +
+ + {t(output)} +
=
- {/* */} - {/* */} + + + - - - - {/* Divider */} -
-
- + + + + + + {/* Divider */} +
+
+
); diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/SummaryScreen.js similarity index 95% rename from health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js rename to health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/SummaryScreen.js index 6bc70eb9788..2b168a17bdd 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/SummaryScreen.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/SummaryScreen.js @@ -28,7 +28,7 @@ const SummaryScreen = () => { type: "DATA", cardHeader: { value: t("CAMPAIGN_DETAILS"), inlineStyles: { marginTop: 0, marginBottom:"0.5rem",fontSize: "1.5rem" } }, cardSecondaryAction: ( -
{console.log("hello edit")}}> +
{}}> {t(`CAMPAIGN_EDIT`)}
@@ -270,37 +270,40 @@ const SummaryScreen = () => { ] - }, ,{ - navigationKey: "card5", - sections: + }, + // { + // navigationKey: "card5", + // sections: - [ - { + // [ + // { - type: "COMPONENT", - component: "FormulaConfiguration", - props: { - }, - }, - ] + // type: "COMPONENT", + // component: "FormulaConfiguration", + // props: { + // }, + // }, + // ] - },{ - navigationKey: "card6", - sections: + // }, + // { + // navigationKey: "card6", + // sections: - [ - { + // [ + // { - type: "COMPONENT", - component: "UserAccessManagement", - props: { - }, - }, - ] + // type: "COMPONENT", + // component: "UserAccessManagement", + // props: { + // }, + // }, + // ] - },{ + // }, + { navigationKey: "card7", sections: @@ -473,7 +476,7 @@ const SummaryScreen = () => { }, } - // console.log("data",data); + return ( ) diff --git a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/index.js b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/index.js index 9e267137d30..898eea32995 100644 --- a/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/index.js +++ b/health/micro-ui/web/micro-ui-internals/packages/modules/microplan/src/pages/employee/index.js @@ -5,6 +5,7 @@ import { Switch,useLocation } from "react-router-dom"; import SetupMicroplan from "./SetupMicroplan"; import { useMyContext } from "../../utils/context"; import MicroplanSearch from "./MicroplanSearch"; +import SummaryScreen from "./SummaryScreen"; const bredCrumbStyle={ maxWidth: "min-content" }; const ProjectBreadCrumb = ({ location }) => { @@ -71,6 +72,8 @@ const App = ({ path, stateCode, userType, tenants }) => { } /> } /> + } /> + );