diff --git a/src/components/Organization/AssignOrg.jsx b/src/components/Organization/AssignOrg.jsx index b35402ed..06f86431 100644 --- a/src/components/Organization/AssignOrg.jsx +++ b/src/components/Organization/AssignOrg.jsx @@ -89,179 +89,194 @@ const AssignOrg = ({ setStep }) => { if (isMasterserviceLoading || isLoading) return
Loading....
; + const showTwoColumns = startStep === 3 && flowType !== "default"; return (
- {/* Organization Info Display */} -
-
-
- logo

{orgData.name}

-
-
- + {/* Left Column */} +
+ {/* Organization Info Display */} +
+
+ logo +

{orgData.name}

+
-
-
Organization Info
- {/* Contact Info */} -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {/* Form */} -
-
- {/* Show fields only if flowType is NOT default */} - {flowType !== "default" && ( - <> - {/* Organization Type */} -
- -
- {orgType?.data.map((type) => ( -
- - -
- ))} -
- {errors.organizationTypeId && ( - - {errors.organizationTypeId.message} - - )} -
+ {/* Assigned Services */} + {flowType !== "default" && projectServices?.length > 0 && ( +
+ - {/* Services */} -
- - {mergedServices?.map((service) => ( -
- - -
- ))} - {errors.serviceIds && ( -
- {errors.serviceIds.message} -
- )} -
- - )} - - {/* Buttons: Always visible */} -
- - +
+ {projectServices.map((service) => ( + + {service.name} + + ))} +
+
- + )}
+ + {/* Right Column */} + {showTwoColumns && ( +
+ {/* Form Section */} +
+ {flowType !== "default" && ( + <> + {/* Organization Type */} +
+ +
+ {orgType?.data.map((type) => ( +
+ + +
+ ))} +
+ {errors.organizationTypeId && ( + {errors.organizationTypeId.message} + )} +
+ + {/* Services */} +
+ + + {/* FIXED HEIGHT + SCROLLBAR */} +
+ {mergedServices + ?.slice() // copy array + .sort((a, b) => a.name.localeCompare(b.name)) + .map((service) => ( +
+
+
+ + +
+ + + + {service.description?.length > 80 + ? service.description.substring(0, 80) + "..." + : service.description} + +
+
+
+
+ ))} +
+ {errors.serviceIds && ( +
{errors.serviceIds.message}
+ )} +
+ + )} +
+
+ )} + {/* Buttons */} +
+ + +
+ ); }; diff --git a/src/components/Organization/ManagOrg.jsx b/src/components/Organization/ManagOrg.jsx index bd38cd9c..13a501d0 100644 --- a/src/components/Organization/ManagOrg.jsx +++ b/src/components/Organization/ManagOrg.jsx @@ -164,7 +164,7 @@ const ManagOrg = () => {
{ - const { onClose, startStep, flowType, onOpen, prevStep, orgData } = - useOrganizationModal(); +const OrgPickerFromSPId = () => { + const { onOpen, prevStep, flowType } = useOrganizationModal(); const clientQuery = useQueryClient(); + + const [activeTab, setActiveTab] = useState("search"); // search | create + const [SPRID, setSPRID] = useState(""); + const { register, handleSubmit, @@ -28,127 +27,129 @@ const OrgPickerFromSPId = ({ title, placeholder }) => { defaultValues: { spridSearchText: "" }, }); - const [SPRID, setSPRID] = useState(""); - - const { data, isLoading, isError, error, refetch } = - useOrganizationBySPRID(SPRID); + const { data, isLoading } = useOrganizationBySPRID(SPRID); const onSubmit = (formdata) => { setSPRID(formdata.spridSearchText); }; - const handleCrateOrg = () => { + const handleCreateOrg = () => { clientQuery.removeQueries({ queryKey: ["organization"] }); onOpen({ startStep: 4, orgData: null }); }; + const SP = watch("spridSearchText"); + return ( -
-
-
- {/* Input Section */} -
- - -
+
+ {/* Tabs */} +
    +
  • + +
  • +
  • + +
  • +
- {/* Button Section */} -
- -
-
- + {/* Tab Content */} + {activeTab === "search" && ( + <> +
+
-
- {" "} - {errors.spridSearchText && ( -

- {errors.spridSearchText.message} -

- )} -
+ {/* Search Input */} +
+ + +
- {/* ---- Organization list ---- */} - {isLoading ? ( - - ) : data && data?.data.length > 0 ? ( -
-
- {data.data.map((org) => ( -
-
- logo -
-
- {org.name} -
- - SPRID :{" "} - - {org.sprid} -
-
- Address: -
{org.address}
-
-
- {" "} + {/* Search Button (always at end) */} +
+ +
+ +
+ + + {errors.spridSearchText && ( +

{errors.spridSearchText.message}

+ )} + + {isLoading ? ( + + ) : data && data?.data.length > 0 ? ( +
+ {data.data.map((org) => ( +
+
logo
+
+ {org.name} +
+ SPRID : + {org.sprid} +
+
+ Address: +
{org.address}
+
-
- ))} -
-
- ) : SPRID ? ( -
- No organization found for "{SPRID}" -
- ) : null} -
- - Do not have SPRID or could not find organization ? - - -
+ ))} +
+ ) : SPRID ? ( +
+ No organization found for "{SPRID}" +
+ ) : null} + + )} - {/* ---- Footer buttons ---- */} -
- {flowType !== "default" && ( + {activeTab === "create" && ( +
+ + {/* Do not have SPRID or want to create a new organization? */} + + +
+ )} + + {/* Footer Back button */} + {flowType !== "default" && ( +
- )} -
+
+ )}
); }; diff --git a/src/components/Organization/OrgPickerfromTenant.jsx b/src/components/Organization/OrgPickerfromTenant.jsx index ef01ad7f..19a71d2e 100644 --- a/src/components/Organization/OrgPickerfromTenant.jsx +++ b/src/components/Organization/OrgPickerfromTenant.jsx @@ -40,44 +40,46 @@ const OrgPickerfromTenant = ({ title }) => { const contactList = [ { key: "name", - label: "Name", + label: ( +
+ Name +
+ ), getValue: (org) => (
{org?.name || "N/A"}
), - align: "text-start", + align: "text-start" }, { key: "sprid", label: "SPRID", getValue: (org) => ( {org?.sprid || "N/A"} ), - align: "text-center", + align: "text-start", }, ]; return (
-
+
setSearchText?.(e.target.value)} - className="form-control form-control-sm w-auto" + className="form-control form-control-sm w-75" placeholder="Enter Organization Name" />
@@ -126,7 +128,8 @@ const OrgPickerfromTenant = ({ title }) => { onOpen({ startStep: 3, orgData: row }) } > - + +
@@ -138,10 +141,9 @@ const OrgPickerfromTenant = ({ title }) => {
) : null} -
+
- Could not find organization in your database? Please search within the - global database. + Could not find organization in your database? Create New Organization