admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge pull request 'UI updation in Organization view and Search button' (#444) from Kartik_Bug#1388 into Issues_Oct_1W

Browse Source 
Reviewed-on: #444
merged
This commit is contained in:
pramod.mahajan 2025-10-08 13:23:05 +00:00
commit 00353b23d6
3 changed files with 116 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

117
src/components/Organization/AssignOrg.jsx
View File

@ -92,17 +92,17 @@ const AssignOrg = ({ setStep }) => {
return ( return (
<div className="row text-black text-start mb-3"> <div className="row text-black text-start mb-3">
{/* Organization Info Display */} {/* Organization Info Display */}
<div className="col-12 mb-3"> <div className="col-12 mb-4">
<div className="d-flex justify-content-between align-items-center text-start mb-1"> <div className="d-flex justify-content-between align-items-center">
<div className="d-flex flex-row gap-2 align-items-center text-wrap"> <div className="d-flex flex-row gap-2 align-items-center text-wrap">
<img <img
src="/public/assets/img/orgLogo.png" src="/public/assets/img/orgLogo.png"
alt="logo" alt="logo"
width={40} width={40}
height={40} height={40}
/> <p className="fw-semibold fs-6 m-0">{orgData.name}</p> />
<p className="fw-semibold fs-5 mt-2 m-0">{orgData.name}</p>
</div> </div>
<div className="text-end">
<button <button
type="button" type="button"
onClick={handleEdit} onClick={handleEdit}
@ -112,75 +112,73 @@ const AssignOrg = ({ setStep }) => {
</button> </button>
</div> </div>
</div> </div>
<div className="col-12 fw-semibold mb-4 mt-2 fs-6">
<i className="bx bx-sm bx-info-circle me-1" /> Organization Info
</div> </div>
<div className="d-flex text-secondary mb-2"> <i className="bx bx-sm bx-info-circle me-1" /> Organization Info</div>
{/* Contact Info */} {/* Contact Person */}
<div className="col-md-6 mb-3"> <div className="col-12 mb-4">
<div className="d-flex"> <div className="row">
<label <div className="col-md-4 col-12 fw-semibold mb-2 mb-md-0">
className="form-label me-2 mb-0 fw-semibold"
style={{ minWidth: "130px" }}
>
<i className="bx bx-sm bx-user me-1" /> Contact Person : <i className="bx bx-sm bx-user me-1" /> Contact Person :
</label> </div>
<div className="text-muted">{orgData.contactPerson}</div> <div className="col-md-8 col-12 text-muted">{orgData.contactPerson}</div>
</div> </div>
</div> </div>
<div className="col-md-6 mb-3">
<div className="d-flex"> {/* Contact Number */}
<label <div className="col-12 mb-4">
className="form-label me-2 mb-0 fw-semibold" <div className="row">
style={{ minWidth: "130px" }} <div className="col-md-4 col-12 fw-semibold mb-2 mb-md-0">
> <i className="bx bx-sm bx-phone me-1" /> Contact Number :
<i className='bx bx-sm me-1 bx-phone'></i> Contact Number : </div>
</label> <div className="col-md-8 col-12 text-muted">{orgData.contactNumber}</div>
<div className="text-muted">{orgData.contactNumber}</div>
</div> </div>
</div> </div>
<div className="col-md-6 mb-3">
<div className="d-flex"> {/* Email */}
<label <div className="col-12 mb-4">
className="form-label me-2 mb-0 fw-semibold" <div className="row">
style={{ minWidth: "130px" }} <div className="col-md-4 col-12 fw-semibold mb-2 mb-md-0">
> <i className="bx bx-sm bx-envelope me-1" /> Email Address :
<i className='bx bx-sm me-1 bx-envelope'></i> Email Address : </div>
</label> <div className="col-md-8 col-12 text-muted">{orgData.email}</div>
<div className="text-muted">{orgData.email}</div>
</div> </div>
</div> </div>
<div className="col-12 mb-3">
<div className="d-flex"> {/* SPRID */}
<label <div className="col-12 mb-4">
className="form-label me-2 mb-0 fw-semibold" <div className="row">
style={{ maxWidth: "130px" }} <div className="col-md-4 col-12 fw-semibold mb-2 mb-md-0">
> <i className="bx bx-sm bx-barcode me-1" /> Service Provider Id :
<i className="bx bx-sm me-1 bx-barcode"></i> </div>
Service Provider Id (SPRID) : <div className="col-md-8 col-12 text-muted">{orgData.sprid}</div>
</label>
<div className="text-muted">{orgData.sprid}</div>
</div> </div>
</div> </div>
<div className="col-12 mb-3">
<div className="d-flex"> {/* Address */}
<label <div className="col-12 mb-4">
className="form-label me-1 mb-0 fw-semibold" <div className="row">
style={{ minWidth: "130px" }} <div className="col-md-4 col-12 fw-semibold mb-2 mb-md-0">
> <i className="bx bx-sm bx-map me-1" /> Address :
<i className='bx bx-sm me-1 bx-map'></i> Address : </div>
</label> <div className="col-md-8 col-12 text-muted">{orgData.address}</div>
<div className="text-muted text-start">{orgData.address}</div>
</div> </div>
</div> </div>
{/* Form */} {/* Form */}
<div className="text-black text-start"> <div className="col-12 text-black text-start">
<form onSubmit={handleSubmit(onSubmit)}> <form onSubmit={handleSubmit(onSubmit)}>
{/* Show fields only if flowType is NOT default */}
{flowType !== "default" && ( {flowType !== "default" && (
<> <>
{/* Organization Type */} {/* Organization Type */}
<div className="mb-3 text-start"> <div className="mb-4">
<Label htmlFor="organizationTypeId" className="mb-3 fw-semibold" required> <Label
htmlFor="organizationTypeId"
className="mb-3 fw-semibold"
required
>
Organization Type Organization Type
</Label> </Label>
<div className="d-flex flex-wrap gap-3 mt-1"> <div className="d-flex flex-wrap gap-3 mt-1">
@ -213,12 +211,13 @@ const AssignOrg = ({ setStep }) => {
</div> </div>
{/* Services */} {/* Services */}
<div className="mb-3"> <div className="mb-4">
<Label htmlFor="serviceIds" className="mb-3 fw-semibold" required> <Label htmlFor="serviceIds" className="mb-3 fw-semibold" required>
Select Services Select Services
</Label> </Label>
<div className="d-flex flex-column gap-3">
{mergedServices?.map((service) => ( {mergedServices?.map((service) => (
<div key={service.id} className="form-check mb-3"> <div key={service.id} className="form-check">
<input <input
type="checkbox" type="checkbox"
value={service.id} value={service.id}
@ -228,6 +227,7 @@ const AssignOrg = ({ setStep }) => {
<label className="form-check-label">{service.name}</label> <label className="form-check-label">{service.name}</label>
</div> </div>
))} ))}
</div>
{errors.serviceIds && ( {errors.serviceIds && (
<div className="text-danger small"> <div className="text-danger small">
{errors.serviceIds.message} {errors.serviceIds.message}
@ -237,7 +237,7 @@ const AssignOrg = ({ setStep }) => {
</> </>
)} )}
{/* Buttons: Always visible */} {/* Buttons */}
<div className="d-flex justify-content-between mt-5"> <div className="d-flex justify-content-between mt-5">
<button <button
type="button" type="button"
@ -262,6 +262,7 @@ const AssignOrg = ({ setStep }) => {
</form> </form>
</div> </div>
</div> </div>
); );
}; };

14
src/components/Organization/OrgPickerFromSPId.jsx
View File

@ -45,7 +45,7 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
onSubmit={handleSubmit(onSubmit)} onSubmit={handleSubmit(onSubmit)}
> >
<div className="d-flex flex-row align-items-center gap-2"> <div className="d-flex flex-row align-items-center gap-2">
<Label className="text-secondary">Search by SPRID</Label> <Label className="fw-semibold">Search by SPRID</Label>
<input <input
type="search" type="search"
{...register("spridSearchText")} {...register("spridSearchText")}
@ -72,10 +72,10 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
{isLoading ? ( {isLoading ? (
<OrgCardSkeleton /> <OrgCardSkeleton />
) : data && data?.data.length > 0 ? ( ) : data && data?.data.length > 0 ? (
<div className="py-2 text-tiny text-center"> <div className="py-2 text-tiny text-center mt-5">
<div className="d-flex flex-column gap-2 border-0 bg-none"> <div className="d-flex flex-column gap-2 border-0 bg-none">
{data.data.map((org) => ( {data.data.map((org) => (
<div className="d-flex flex-row gap-2 text-start text-black "> <div className="d-flex flex-row gap-4 text-start text-black ">
<div className="mt-1"> <div className="mt-1">
<img <img
src="/public/assets/img/orgLogo.png" src="/public/assets/img/orgLogo.png"
@ -85,8 +85,8 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
/> />
</div> </div>
<div className="d-flex flex-column p-0 m-0 cursor-pointer"> <div className="d-flex flex-column p-0 m-0 cursor-pointer">
<span className="fs-6 fw-semibold">{org.name}</span> <span className="fs-5 fw-semibold">{org.name}</span>
<div className="d-flex gap-2"> <div className="d-flex gap-2 mt-2">
<small <small
className=" fw-semibold text-uppercase" className=" fw-semibold text-uppercase"
style={{ letterSpacing: "1px" }} style={{ letterSpacing: "1px" }}
@ -95,11 +95,11 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
</small> </small>
<small className="fs-6">{org.sprid}</small> <small className="fs-6">{org.sprid}</small>
</div> </div>
<div className="d-flex flex-row gap-2"> <div className="d-flex flex-row gap-2 mt-2">
<small className="text-small fw-semibold">Address:</small> <small className="text-small fw-semibold">Address:</small>
<div className="d-flex text-wrap">{org.address}</div> <div className="d-flex text-wrap">{org.address}</div>
</div> </div>
<div className="m-0 p-0"> <div className="m-0 p-0 mt-4">
{" "} {" "}
<button <button
type="submit" type="submit"

47
src/components/Organization/ViewOrganization.jsx
View File

@ -22,8 +22,7 @@ const VieworgDataanization = ({ orgId }) => {
</div> </div>
<div className="text-end"> <div className="text-end">
<span <span
className={`badge bg-label-${ className={`badge bg-label-${data?.isActive ? "primary" : "secondary"
data?.isActive ? "primary" : "secondary"
} `} } `}
> >
{data?.isActive ? "Active" : "In-Active"}{" "} {data?.isActive ? "Active" : "In-Active"}{" "}
@ -31,27 +30,27 @@ const VieworgDataanization = ({ orgId }) => {
</div> </div>
</div> </div>
</div> </div>
<div className="d-flex text-secondary mb-2"> <div className="d-flex fw-semibold fs-6 mb-4 mt-2">
{" "} {" "}
<i className="bx bx-sm bx-info-circle me-1" /> Organization Info <i className="bx bx-sm bx-info-circle me-1" /> Organization Info
</div> </div>
{/* Contact Info */} {/* Contact Info */}
<div className="col-md-6 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-2 mb-0 fw-semibold" className="form-label me-2 mb-1 fw-semibold"
style={{ minWidth: "130px" }} style={{ minWidth: "200px" }}
> >
<i className="bx bx-sm bx-user me-1" /> Contact Person : <i className="bx bx-sm bx-user me-1" /> Contact Person :
</label> </label>
<div className="text-muted">{data?.contactPerson}</div> <div className="text-muted">{data?.contactPerson}</div>
</div> </div>
</div> </div>
<div className="col-md-6 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-2 mb-0 fw-semibold" className="form-label me-2 mb-1 fw-semibold"
style={{ minWidth: "130px" }} style={{ minWidth: "200px" }}
> >
<i className="bx bx-sm me-1 bx-phone"></i> Contact Number : <i className="bx bx-sm me-1 bx-phone"></i> Contact Number :
</label> </label>
@ -61,44 +60,44 @@ const VieworgDataanization = ({ orgId }) => {
<div className="col-md-12 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-2 mb-0 fw-semibold" className="form-label me-2 mb-1 fw-semibold"
style={{ minWidth: "130px" }} style={{ minWidth: "200px" }}
> >
<i className="bx bx-sm me-1 bx-envelope"></i> Email Address : <i className="bx bx-sm me-1 bx-envelope"></i> Email Address :
</label> </label>
<div className="text-muted">{data?.email}</div> <div className="text-muted">{data?.email}</div>
</div> </div>
</div> </div>
<div className="col-6 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-2 mb-0 fw-semibold" className="form-label me-2 mb-1 fw-semibold"
style={{ maxWidth: "130px" }} style={{ maxWidth: "250px" }}
> >
<i className="bx bx-sm me-1 bx-barcode"></i> <i className="bx bx-sm me-2 bx-barcode"></i>
Service Provider Id (SPRID) : Service Provider Id (SPRID) :
</label> </label>
<div className="text-muted">{data?.sprid}</div> <div className="text-muted ms-1">{data?.sprid}</div>
</div> </div>
</div> </div>
<div className="col-6 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-2 mb-0 fw-semibold" className="form-label me-2 mb-1 fw-semibold"
style={{ maxWidth: "130px" }}
> >
<i className="bx bx-sm me-1 bx-group"></i> <i className="bx bx-sm me-2 bx-group"></i>
Employees : Employees :
</label> </label>
<div className="text-muted">{data?.activeEmployeeCount}</div> <div className="text-muted" style={{ marginLeft: "104px" }}>{data?.activeEmployeeCount}</div>
</div> </div>
</div> </div>
<div className="col-12 mb-3"> <div className="col-md-12 mb-3">
<div className="d-flex"> <div className="d-flex">
<label <label
className="form-label me-1 mb-0 fw-semibold" className="form-label me-1 mb-1 fw-semibold"
style={{ minWidth: "130px" }} style={{ minWidth: "207px" }}
> >
<i className="bx bx-sm me-1 bx-map"></i> Address : <i className="bx bx-sm me-1 bx-map"></i> Address :
</label> </label>