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

Adding color in Select Bucket at Create contact.

Browse Source
This commit is contained in:
Kartik Sharma 2025-12-09 11:02:50 +05:30
parent a6dfc7b7b0
commit a0257c1252
2 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Directory/ManageContact.jsx
View File

@ -21,6 +21,7 @@ import InputSuggestions from "../common/InputSuggestion";
import Label from "../common/Label";
import { AppFormController } from "../../hooks/appHooks/useAppForm";
import SelectField from "../common/Forms/SelectField";
import { BUCKET_BG_CLASSES } from "../../utils/constants";
const ManageContact = ({ contactId, closeModal }) => {
// fetch master data
@ -180,6 +181,7 @@ const ManageContact = ({ contactId, closeModal }) => {
};
const isPending = updating || creating;
return (
<FormProvider {...methods}>
<form className="p-2 p-sm-0" onSubmit={handleSubmit(onSubmit)}>
@ -467,13 +469,14 @@ const ManageContact = ({ contactId, closeModal }) => {
>
{bucketsLoaging && <p>Loading...</p>}
{buckets?.map((item) => (
{buckets?.map((item, index) => (
<div
key={item.id}
className="card p-3 shadow-sm flex-shrink-0"
className={`card p-2 shadow-sm flex-shrink-0 ${BUCKET_BG_CLASSES [index % BUCKET_BG_CLASSES.length]}`}
onClick={() => handleCheckboxChange(item.id)}
>
<div className="form-check">
<div className="form-check m-0">
<input
type="checkbox"
className="form-check-input"
@ -481,14 +484,17 @@ const ManageContact = ({ contactId, closeModal }) => {
checked={watchBucketIds.includes(item.id)}
onChange={() => handleCheckboxChange(item.id)}
/>
<label className="form-check-label ms-2" htmlFor={`item-${item.id}`}>
<label className="form-check-label ms-0" htmlFor={`item-${item.id}`}>
{item.name}
</label>
</div>
</div>
))}
</div>
</div>
<div className="text-start mt-3 mb-3">
{errors.bucketIds && (
<small className="danger-text">{errors.bucketIds.message}</small>
)}

13
src/utils/constants.jsx
View File

@ -258,3 +258,16 @@ export const JOBS_STATUS_IDS = [
label: "On Hold",
},
];
export const BUCKET_BG_CLASSES = [
"bg-label-primary bg-opacity-10",
"bg-label-secondary bg-opacity-10",
"bg-label-success bg-opacity-10",
"bg-label-info bg-opacity-10",
"bg-label-warning bg-opacity-10",
"bg-label-danger bg-opacity-10",
"bg-label-dark bg-opacity-10",
"bg-label-primary bg-opacity-25",
"bg-label-success bg-opacity-25",
"bg-label-info bg-opacity-25",
];