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

added in List view active or inactive contacts

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-23 18:22:01 +05:30
parent 1b575a7d5f
commit 0d09bfda04
1 changed files with 55 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
src/components/Directory/CardViewDirectory.jsx
View File

@ -1,13 +1,23 @@
import React from "react"; import React from "react";
import Avatar from "../common/Avatar"; import Avatar from "../common/Avatar";
import {getBucketNameById} from "./DirectoryUtils"; import { getBucketNameById } from "./DirectoryUtils";
import {useBuckets} from "../../hooks/useDirectory"; import { useBuckets } from "../../hooks/useDirectory";
import { getPhoneIcon } from "./DirectoryUtils"; import { getPhoneIcon } from "./DirectoryUtils";
const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModal, setOpen_contact, setIsOpenModalNote, IsDeleted} ) => const CardViewDirectory = ({
{ IsActive,
const {buckets} = useBuckets() contact,
setSelectedContact,
setIsOpenModal,
setOpen_contact,
setIsOpenModalNote,
IsDeleted,
}) => {
const { buckets } = useBuckets();
return ( return (
<div className="card text-start border-1" style={{background:`${!IsActive ? "#f8f6f6":""}`}}> <div
className="card text-start border-1"
style={{ background: `${!IsActive ? "#f8f6f6" : ""}` }}
>
<div className="card-body px-1 py-2 pb-0"> <div className="card-body px-1 py-2 pb-0">
<div className="d-flex justify-content-between"> <div className="d-flex justify-content-between">
<div className="d-flex align-items-center"> <div className="d-flex align-items-center">
@ -40,25 +50,23 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
></i> ></i>
</button> </button>
<ul className="dropdown-menu dropdown-menu-end w-auto"> <ul className="dropdown-menu dropdown-menu-end w-auto">
<li <li
onClick={() => { onClick={() => {
if (!IsActive) { setSelectedContact(contact);
setSelectedContact(contact); setIsOpenModal(true);
setIsOpenModal(true); }}
}
}} >
style={{
cursor: IsActive ? 'not-allowed' : 'pointer',
opacity: IsActive ? 0.6 : 1,
}}
>
<a className="dropdown-item px-2 py-0"> <a className="dropdown-item px-2 py-0">
<i className="bx bx-pencil bx-xs me-2"></i> <i className="bx bx-pencil bx-xs me-2"></i>
<span className="align-left small-text">Modify</span> <span className="align-left small-text">Modify</span>
</a> </a>
</li> </li>
<li> <li>
<a className="dropdown-item px-2 py-0" onClick={()=> IsDeleted(contact.id)}> <a
className="dropdown-item px-2 py-0"
onClick={() => IsDeleted(contact.id)}
>
<i className="bx bx-trash bx-xs me-2"></i> <i className="bx bx-trash bx-xs me-2"></i>
<span className="align-left small-text">Delete</span> <span className="align-left small-text">Delete</span>
</a> </a>
@ -69,23 +77,23 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
</div> </div>
<ul className="list-inline m-0 ps-4"> <ul className="list-inline m-0 ps-4">
<li className="list-inline-item me-1" style={{fontSize:"10px"}}> <li className="list-inline-item me-1" style={{ fontSize: "10px" }}>
<i className="bx bx-building bx-xs"></i> <i className="bx bx-building bx-xs"></i>
</li> </li>
<li className="list-inline-item" style={{fontSize:"10px"}}> <li className="list-inline-item" style={{ fontSize: "10px" }}>
{contact.organization} {contact.organization}
</li> </li>
</ul> </ul>
</div> </div>
<div className="card-footer text-start px-1 py-1" onClick={() => <div
{ className="card-footer text-start px-1 py-1"
if ( IsActive ) onClick={() => {
{ if (IsActive) {
setIsOpenModalNote(true);
setIsOpenModalNote(true) setOpen_contact(contact);
setOpen_contact(contact) }
} }}
}}> >
<hr className="my-0" /> <hr className="my-0" />
{contact.contactEmails[0] && ( {contact.contactEmails[0] && (
<ul className="list-inline my-1 "> <ul className="list-inline my-1 ">
@ -101,7 +109,11 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
{contact.contactPhones[0] && ( {contact.contactPhones[0] && (
<ul className="list-inline m-0"> <ul className="list-inline m-0">
<li className="list-inline-item me-2"> <li className="list-inline-item me-2">
<i className={` ${getPhoneIcon(contact.contactPhones[0].label)} bx-xs`} ></i> <i
className={` ${getPhoneIcon(
contact.contactPhones[0].label
)} bx-xs`}
></i>
</li> </li>
<li className="list-inline-item small-text"> <li className="list-inline-item small-text">
{contact.contactPhones[0]?.phoneNumber} {contact.contactPhones[0]?.phoneNumber}
@ -118,19 +130,18 @@ const CardViewDirectory = ( {IsActive,contact, setSelectedContact, setIsOpenModa
</li> </li>
</ul> </ul>
<ul className="list-inline m-0"> <ul className="list-inline m-0">
{contact.bucketIds.map((bucketId) => ( {contact.bucketIds.map((bucketId) => (
<React.Fragment key={bucketId}> <React.Fragment key={bucketId}>
<li className="list-inline-item me-1"> <li className="list-inline-item me-1">
<i className="bx bx-pin bx-xs"></i> <i className="bx bx-pin bx-xs"></i>
</li> </li>
<li className="list-inline-item small-text"> <li className="list-inline-item small-text">
{getBucketNameById(buckets, bucketId)} {getBucketNameById(buckets, bucketId)}
</li> </li>
</React.Fragment> </React.Fragment>
))} ))}
</ul> </ul>
</div> </div>
</div> </div>
); );