WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

Merge branch 'job-message-tab' of WrenchBoard/Users-Wrench into master

Browse Source
This commit is contained in:
Olusesan Ameye
2023-07-15 19:32:33 +00:00
committed by Gogs
parent bbe0777496 6ae408029d
commit b027e20c20
2 changed files with 51 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/MyActiveJobs/ActiveJobMessage.jsx
+41 -39
View File
@@ -19,46 +19,48 @@ export default function ActiveJobMessage({ activeJobMesList }) {
}
return (
<div className='flex flex-col justify-between h-full'>
<table className="wallet-activity w-full table-auto border-collapse text-left">
<thead className='border-b-2'>
<tr className='text-slate-600'>
<th className="p-2"></th>
</tr>
</thead>
{activeJobMesList.data.length ?
(
<tbody>
{currentActiveJobMesList.map((item, index) => (
<tr key={index} className='text-slate-500'>
<td>
<div className={`msg_box ${item.who}`}>
<div className="msg_header">{item.msg_date} {item.msg_firstname}</div>
<span className="p-2" dangerouslySetInnerHTML={{__html: item.message}}></span>
</div>
<div className='flex flex-col justify-between'>
<div className="w-full min-h-[450px] max-h-[450px] overflow-y-scroll">
<table className="wallet-activity w-full table-auto border-collapse text-left">
<thead className='border-b-2'>
<tr className='text-slate-600'>
<th className="p-2"></th>
</tr>
</thead>
{activeJobMesList.data.length ?
(
<tbody>
{currentActiveJobMesList.map((item, index) => (
<tr key={index} className='text-slate-500'>
<td>
<div className={`msg_box ${item.who}`}>
<div className="msg_header">{item.msg_date} {item.msg_firstname}</div>
<span className="p-2" dangerouslySetInnerHTML={{__html: item.message}}></span>
</div>
</td>
</tr>
))}
</tbody>
)
:
activeJobMesList.error ?
(
<tbody>
<tr className='text-slate-500'>
<td className="p-2" colSpan={4}>Opps! an error occurred. Please try again!</td>
</tr>
</tbody>
)
:
<tbody>
<tr className='text-slate-500'>
<td className="p-2" colSpan={4}>No Message Found!</td>
</tr>
</tbody>
}
</table>
</td>
</tr>
))}
</tbody>
)
:
activeJobMesList.error ?
(
<tbody>
<tr className='text-slate-500'>
<td className="p-2" colSpan={4}>Opps! an error occurred. Please try again!</td>
</tr>
</tbody>
)
:
<tbody>
<tr className='text-slate-500'>
<td className="p-2" colSpan={4}>No Message Found!</td>
</tr>
</tbody>
}
</table>
</div>
{/* PAGINATION BUTTON */}
<PaginatedList onClick={handlePagination} prev={currentPage == 0 ? true : false} next={currentPage+Number(process.env.REACT_APP_ITEM_PER_PAGE) >= activeJobMesList?.data?.length ? true : false} data={activeJobMesList?.data} start={indexOfFirstItem} stop={indexOfLastItem} />
src/components/MyActiveJobs/ActiveJobs.jsx
+10 -8
View File
@@ -367,23 +367,25 @@ function ActiveJobs(props) {
{/* TEXTAREA SECTION */}
<div className="mt-5">
<div className="">
{/* <p className="relative py-2 my-2 text-lg font-bold text-slate-600 dark:text-black border-b-2 border-slate-300 tracking-wide after:absolute after:-bottom-0.5 after:content-[''] after:w-[100px] after:h-[2px] after:bg-sky-blue after:left-0">Message(s)</p> */}
<div className="my-2 flex items-center border-b border-slate-300">
<div
className="pl-7 my-2 flex items-center border-b border-slate-300 gap-3"
// className='ml-7 flex justify-start items-center gap-3'
>
<button
name="message"
onClick={(e) => setTab(e.target.name)}
className={`p-2 text-lg font-bold text-slate-600 dark:text-white border ${
tab == "message" ? "border-sky-blue" : "border-slate-300"
} tracking-wide transition duration-200`}
className={`px-4 py-1 rounded-t-2xl ${
tab == "message" ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
}`}
>
Send Message
</button>
<button
name="files"
onClick={(e) => setTab(e.target.name)}
className={`p-2 text-lg font-bold text-slate-600 dark:text-white border ${
tab == "files" ? "border-sky-blue" : "border-slate-300"
} tracking-wide transition duration-200`}
className={`px-4 py-1 rounded-t-2xl ${
tab == "files" ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
}`}
>
Send Files
</button>