65 lines
2.0 KiB
JavaScript
65 lines
2.0 KiB
JavaScript
import React from 'react'
|
|
import IconButton from '../../components/common/IconButton';
|
|
|
|
|
|
const DirectoryListTableHeader = ( {children, IsActive} ) =>
|
|
{
|
|
return (
|
|
<div className="table-responsive text-nowrap py-2">
|
|
<table className="table px-2">
|
|
<thead>
|
|
<tr>
|
|
<th colSpan={2}>
|
|
<div className="d-flex align-items-center gap-1">
|
|
<IconButton
|
|
size={12}
|
|
iconClass="bx bx-user"
|
|
color="secondary"
|
|
onClick={() => alert("User icon clicked")}
|
|
/>
|
|
<span>Name</span>
|
|
</div>
|
|
</th>
|
|
<th className="px-2 text-start">
|
|
<div className="d-flex text-center align-items-center gap-1 justify-content-start">
|
|
<IconButton
|
|
size={12}
|
|
iconClass="bx bx-envelope"
|
|
color="primary"
|
|
/>
|
|
<span>Email</span>
|
|
</div>
|
|
</th>
|
|
<th className="mx-2">
|
|
<div className="d-flex align-items-center m-0 p-0 gap-1">
|
|
<IconButton
|
|
size={12}
|
|
iconClass="bx bx-phone"
|
|
color="warning"
|
|
onClick={() => alert("User icon clicked")}
|
|
/>
|
|
<span>Phone</span>
|
|
</div>
|
|
</th>
|
|
<th className="mx-2">
|
|
<div className="d-flex align-items-center gap-1">
|
|
<IconButton
|
|
size={12}
|
|
iconClass="bx bxs-grid-alt"
|
|
color="info"
|
|
/>
|
|
<span>Organization</span>
|
|
</div>
|
|
</th>
|
|
<th className="mx-2">Category</th>
|
|
{IsActive && <th>Action</th>}
|
|
</tr>
|
|
</thead>
|
|
<tbody className="table-border-bottom-0 overflow-auto">
|
|
{children}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
};
|
|
export default DirectoryListTableHeader; |