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

added fun as props to open edit modal

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-19 11:51:33 +05:30
parent f8f43b62c6
commit bc50e58150
1 changed files with 52 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,17 +1,21 @@
import React from "react"; import React from "react";
import Avatar from "../common/Avatar"; import Avatar from "../common/Avatar";
const CardViewDirectory = ({contact}) => { const CardViewDirectory = ({ contact,setSelectedContact , setIsOpenModal}) => {
return ( return (
<div class="card text-start "> <div class="card text-start border-1">
<div class="card-body d-flex justify-content-between px-1 py-2"> <div class="card-body d-flex justify-content-between px-1 py-2">
<div className="d-flex align-items-center"> <div className="d-flex align-items-center">
<Avatar <Avatar
size="xs" size="xs"
firstName={(contact?.name || "").trim().split(" ")[0]?.charAt(0) || ""} firstName={
lastName={(contact?.name || "").trim().split(" ")[1]?.charAt(0) || ""} (contact?.name || "").trim().split(" ")[0]?.charAt(0) || ""
/> <p className="fs-6 m-0">{contact.name}</p> }
lastName={
(contact?.name || "").trim().split(" ")[1]?.charAt(0) || ""
}
/>{" "}
<p className="m-0">{contact.name}</p>
</div> </div>
<div> <div>
<div className="dropdown z-2 "> <div className="dropdown z-2 ">
@ -31,7 +35,11 @@ const CardViewDirectory = ({contact}) => {
></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={() =>
{
setSelectedContact(contact)
setIsOpenModal(true)
}}>
<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>
@ -48,30 +56,43 @@ const CardViewDirectory = ({contact}) => {
</div> </div>
</div> </div>
<div class="card-footer text-start px-1 py-1"> <div class="card-footer text-start px-1 py-1">
<hr className="my-0"/> <hr className="my-0" />
{contact.contactEmails[0] && <ul className="list-inline my-1 "> {contact.contactEmails[0] && (
<li className="list-inline-item me-2"> <ul className="list-inline my-1 ">
<i className="bx bx-envelope bx-xs"></i> <li className="list-inline-item me-2">
</li> <i className="bx bx-envelope bx-xs"></i>
<li className="list-inline-item small-text">{contact.contactEmails[ 0 ]?.emailAddress}</li> </li>
</ul>} <li className="list-inline-item small-text">
{contact.contactEmails[0]?.emailAddress}
</li>
</ul>
)}
{contact.contactPhones[0] && <ul className="list-inline m-0"> {contact.contactPhones[0] && (
<li className="list-inline-item me-2"> <ul className="list-inline m-0">
<i className="bx bx-phone bx-xs"></i> <li className="list-inline-item me-2">
</li> <i className="bx bx-phone bx-xs"></i>
<li className="list-inline-item small-text">{contact.contactPhones[ 0 ]?.phoneNumber}</li> </li>
</ul>} <li className="list-inline-item small-text">
{contact.contactPhones[0]?.phoneNumber}
<ul className="list-inline m-0"> </li>
<li className="list-inline-item me-2"> </ul>
<i className="bx bx-merge bx-xs"></i> )}
</li>
<li className="list-inline-item small-text">
{contact.contactCategory.name}
</li>
</ul>
<ul className="list-inline m-0">
<li className="list-inline-item me-2">
<i className="bx bx-building bx-xs"></i>
</li>
<li className="list-inline-item small-text">
{contact.organization}
</li>
<li className="list-inline-item me-2">
<i className="bx bx-merge bx-xs"></i>
</li>
<li className="list-inline-item small-text">
{contact.contactCategory.name}
</li>
</ul>
</div> </div>
</div> </div>
); );