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

set up triggle for open contact profile modal

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-20 18:18:37 +05:30
parent 7feaac1a94
commit d9053837a6
1 changed files with 66 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,61 +1,77 @@
import React from "react"; import React from "react";
import Avatar from "../common/Avatar"; import Avatar from "../common/Avatar";
const CardViewDirectory = ({ contact,setSelectedContact , setIsOpenModal}) => { const CardViewDirectory = ({ contact, setSelectedContact, setIsOpenModal,setOpen_contact,setIsOpenModalNote }) => {
return ( return (
<div class="card text-start border-1"> <div class="card text-start border-1">
<div class="card-body d-flex justify-content-between px-1 py-2"> <div class="card-body px-1 py-2 pb-0">
<div className="d-flex align-items-center"> <div className="d-flex justify-content-between">
<Avatar <div className="d-flex align-items-center">
size="xs" <Avatar
firstName={ size="xs"
(contact?.name || "").trim().split(" ")[0]?.charAt(0) || "" firstName={
} (contact?.name || "").trim().split(" ")[0]?.charAt(0) || ""
lastName={ }
(contact?.name || "").trim().split(" ")[1]?.charAt(0) || "" lastName={
} (contact?.name || "").trim().split(" ")[1]?.charAt(0) || ""
/>{" "} }
<p className="m-0">{contact.name}</p> />{" "}
</div> <p className="m-0">{contact.name}</p>
<div> </div>
<div className="dropdown z-2 "> <div>
<button <div className="dropdown z-2 ">
type="button" <button
className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0" type="button"
data-bs-toggle="dropdown" className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0"
aria-expanded="false" data-bs-toggle="dropdown"
> aria-expanded="false"
<i >
className="bx bx-dots-vertical-rounded bx-sm text-muted p-0" <i
data-bs-toggle="tooltip" className="bx bx-dots-vertical-rounded bx-sm text-muted p-0"
data-bs-offset="0,8" data-bs-toggle="tooltip"
data-bs-placement="top" data-bs-offset="0,8"
data-bs-custom-class="tooltip-dark" data-bs-placement="top"
title="More Action" data-bs-custom-class="tooltip-dark"
></i> title="More Action"
</button> ></i>
<ul className="dropdown-menu dropdown-menu-end w-auto"> </button>
<li onClick={() => <ul className="dropdown-menu dropdown-menu-end w-auto">
{ <li
setSelectedContact(contact) onClick={() => {
setIsOpenModal(true) setSelectedContact(contact);
}}> setIsOpenModal(true);
<a className="dropdown-item px-2 py-0"> }}
<i className="bx bx-pencil bx-xs me-2"></i> >
<span className="align-left small-text">Modify</span> <a className="dropdown-item px-2 py-0">
</a> <i className="bx bx-pencil bx-xs me-2"></i>
</li> <span className="align-left small-text">Modify</span>
<li> </a>
<a className="dropdown-item px-2 py-0"> </li>
<i className="bx bx-trash bx-xs me-2"></i> <li>
<span className="align-left small-text">Delete</span> <a className="dropdown-item px-2 py-0">
</a> <i className="bx bx-trash bx-xs me-2"></i>
</li> <span className="align-left small-text">Delete</span>
</ul> </a>
</li>
</ul>
</div>
</div> </div>
</div> </div>
<ul className="list-inline m-0 ps-4">
<li className="list-inline-item me-1" style={{fontSize:"10px"}}>
<i className="bx bx-building bx-xs"></i>
</li>
<li className="list-inline-item" style={{fontSize:"10px"}}>
{contact.organization}
</li>
</ul>
</div> </div>
<div class="card-footer text-start px-1 py-1"> <div class="card-footer text-start px-1 py-1" onClick={() =>
{
setIsOpenModalNote(true)
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 ">
@ -80,12 +96,6 @@ const CardViewDirectory = ({ contact,setSelectedContact , setIsOpenModal}) => {
)} )}
<ul className="list-inline m-0"> <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"> <li className="list-inline-item me-2">
<i className="bx bx-merge bx-xs"></i> <i className="bx bx-merge bx-xs"></i>
</li> </li>