|
|
|
@@ -4,8 +4,8 @@ import Layout from "../Partials/Layout";
|
|
|
|
|
import CommonHead from "../UserHeader/CommonHead";
|
|
|
|
|
|
|
|
|
|
import usersService from "../../services/UsersService";
|
|
|
|
|
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
|
|
|
|
import PaginatedList from "../Pagination/PaginatedList";
|
|
|
|
|
// import { handlePagingFunc } from "../Pagination/HandlePagination";
|
|
|
|
|
// import PaginatedList from "../Pagination/PaginatedList";
|
|
|
|
|
import LoadingSpinner from "../Spinners/LoadingSpinner";
|
|
|
|
|
import OthersInterestedTable from "./OthersInterestedTable";
|
|
|
|
|
|
|
|
|
@@ -15,25 +15,50 @@ export default function ManageInterestOffer(props) {
|
|
|
|
|
|
|
|
|
|
let [redirectTime, setRedirectTime] = useState(5)
|
|
|
|
|
|
|
|
|
|
let [messageToSend, setMessageToSend] = useState('')
|
|
|
|
|
|
|
|
|
|
let [tab, setTab] = useState("info"); //message STATE FOR SWITCHING BETWEEN TABS
|
|
|
|
|
|
|
|
|
|
let [requestStatus, setRequestStatus] = useState({loading: false, status: false, message: '', processType: ''})
|
|
|
|
|
|
|
|
|
|
const messageList = {data: [1,2,3,4,5,6]} // TO BE REMOVED AND REPLACE WITH REAL MESSAGE FROM API CALL
|
|
|
|
|
const [currentPage, setCurrentPage] = useState(0);
|
|
|
|
|
const indexOfFirstItem = Number(currentPage);
|
|
|
|
|
const indexOfLastItem = Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
|
|
|
|
const currentMessageList = messageList?.data?.slice(indexOfFirstItem, indexOfLastItem);
|
|
|
|
|
const messageList = {data: [1,2,3,4,5,6,7,8,95,6,7,8,9]} // TO BE REMOVED AND REPLACE WITH REAL MESSAGE FROM API CALL
|
|
|
|
|
// const [currentPage, setCurrentPage] = useState(0);
|
|
|
|
|
// const indexOfFirstItem = Number(currentPage);
|
|
|
|
|
// const indexOfLastItem = Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
|
|
|
|
// const currentMessageList = messageList?.data?.slice(indexOfFirstItem, indexOfLastItem);
|
|
|
|
|
|
|
|
|
|
const handlePagination = (e) => {
|
|
|
|
|
handlePagingFunc(e, setCurrentPage);
|
|
|
|
|
};
|
|
|
|
|
// const handlePagination = (e) => {
|
|
|
|
|
// handlePagingFunc(e, setCurrentPage);
|
|
|
|
|
// };
|
|
|
|
|
|
|
|
|
|
const [selectTab, setValue] = useState("today");
|
|
|
|
|
const filterHandler = (value) => {
|
|
|
|
|
setValue(value);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
//FUNCTION TO HANDLE ON CHANGE MESSAGE IN TEXTAREA
|
|
|
|
|
const onMessageChange = ({target:{value}}) => {
|
|
|
|
|
if(messageToSend.length > 149){
|
|
|
|
|
setRequestStatus({loading: false, status: false, message: 'max of 150 characters', processType: 'sendmessage'})
|
|
|
|
|
}else{
|
|
|
|
|
setRequestStatus({loading: false, status: false, message: '', processType: 'sendmessage'})
|
|
|
|
|
}
|
|
|
|
|
setMessageToSend(value)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//FUNCTION TO SEND MESSAGE TO CLIENT
|
|
|
|
|
const sendMessage = () => {
|
|
|
|
|
setRequestStatus(prev => ({...prev, loading: true, processType: 'sendmessage'}))
|
|
|
|
|
if(!messageToSend){
|
|
|
|
|
setRequestStatus({loading: false, status: false, message: 'Please enter message to send', processType: 'sendmessage'})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if(messageToSend.length > 149){
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
console.log('GOOD TO GO')
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//FUNCTION TO ACCEPT/REJECT OFFER INTEREST
|
|
|
|
|
const interestOfferProcess = ({target:{name}}) => {
|
|
|
|
|
setRequestStatus(prev => ({...prev, loading: true, processType: name}))
|
|
|
|
@@ -180,23 +205,53 @@ export default function ManageInterestOffer(props) {
|
|
|
|
|
</div>
|
|
|
|
|
:
|
|
|
|
|
<div className="message-details w-full border-t">
|
|
|
|
|
<div className="my-0 w-full flex items-center gap-5">
|
|
|
|
|
<div className="w-3/4">
|
|
|
|
|
<p className="text-base font-bold text-dark-gray dark:text-white tracking-wide">Message to dummy name</p>
|
|
|
|
|
<textarea rows={2} autoFocus={true} className="p-2 text-base font-bold text-dark-gray dark:text-white dark:bg-dark-gray border tracking-wide w-full resize-none rounded-md outline-none" />
|
|
|
|
|
<p className="my-1 text-base text-dark-gray dark:text-white tracking-wide">To: <span className="font-bold">{props.offerDetails?.client_name}</span></p>
|
|
|
|
|
<div className="w-full flex items-center gap-5">
|
|
|
|
|
<div className="w-full">
|
|
|
|
|
<textarea
|
|
|
|
|
value={messageToSend}
|
|
|
|
|
onChange={onMessageChange}
|
|
|
|
|
rows={2} autoFocus={true}
|
|
|
|
|
className="p-2 text-base font-bold text-dark-gray dark:text-white dark:bg-dark-gray border tracking-wide w-full resize-none rounded-md outline-none"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="w-1/4 flex flex-col justify-center items-center">
|
|
|
|
|
<div className="flex justify-end items-center">
|
|
|
|
|
<button
|
|
|
|
|
type="button"
|
|
|
|
|
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
|
|
|
|
onClick={sendMessage}
|
|
|
|
|
// className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
|
|
|
|
className="w-[100px] h-[50px] bg-sky-blue text-center text-lg font-semibold text-white rounded-md shadow-md flex justify-center items-center"
|
|
|
|
|
>
|
|
|
|
|
<span className="text-white">Send</span>
|
|
|
|
|
Send
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
{/* ERROR DISPLAY FOR MESSAGE SENDING */}
|
|
|
|
|
<div className="w-full">
|
|
|
|
|
{/* error or success display */}
|
|
|
|
|
{requestStatus.message != "" && requestStatus.processType == 'sendmessage' &&
|
|
|
|
|
(!requestStatus.status ? (
|
|
|
|
|
<div
|
|
|
|
|
className={`relative p-4 my-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
>
|
|
|
|
|
{requestStatus.message}
|
|
|
|
|
</div>
|
|
|
|
|
) : (
|
|
|
|
|
requestStatus.status && (
|
|
|
|
|
<div
|
|
|
|
|
className={`relative p-4 my-4 text-green-700 bg-slate-200 border-slate-800 mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
>
|
|
|
|
|
{`${requestStatus.message} redirecting.... ${redirectTime}sec`}
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
))}
|
|
|
|
|
</div>
|
|
|
|
|
{/* END OF ERROR DISPLAY FOR MESSAGE SENDING */}
|
|
|
|
|
|
|
|
|
|
{/* message list */}
|
|
|
|
|
<div className="min-h-[100px] max-h-[200px] overflow-y-auto">
|
|
|
|
|
{currentMessageList.map((item, index)=>(
|
|
|
|
|
<div className="my-1 min-h-[100px] max-h-[200px] border-t overflow-y-scroll">
|
|
|
|
|
{messageList.data.map((item, index)=>(
|
|
|
|
|
<div key={index} className="my-2 w-full flex items-center gap-1">
|
|
|
|
|
<p className="text-base font-bold text-dark-gray dark:text-white tracking-wide">2023-04-06-from { }<span className="font-normal">Dummy name</span></p>
|
|
|
|
|
<p className="text-base font-bold text-dark-gray dark:text-white tracking-wide">I am testing message</p>
|
|
|
|
@@ -205,7 +260,7 @@ export default function ManageInterestOffer(props) {
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
{/* PAGINATION BUTTON */}
|
|
|
|
|
<PaginatedList
|
|
|
|
|
{/* <PaginatedList
|
|
|
|
|
onClick={handlePagination}
|
|
|
|
|
prev={currentPage == 0 ? true : false}
|
|
|
|
|
next={
|
|
|
|
@@ -217,7 +272,7 @@ export default function ManageInterestOffer(props) {
|
|
|
|
|
data={messageList?.data}
|
|
|
|
|
start={indexOfFirstItem}
|
|
|
|
|
stop={indexOfLastItem}
|
|
|
|
|
/>
|
|
|
|
|
/> */}
|
|
|
|
|
{/* END OF PAGINATION BUTTON */}
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
@@ -263,7 +318,7 @@ export default function ManageInterestOffer(props) {
|
|
|
|
|
{/* ERROR DISPLAY */}
|
|
|
|
|
<div className="w-full">
|
|
|
|
|
{/* error or success display */}
|
|
|
|
|
{requestStatus.message != "" && requestStatus.processType != 'sendmeassge' &&
|
|
|
|
|
{requestStatus.message != "" && requestStatus.processType != 'sendmessage' &&
|
|
|
|
|
(!requestStatus.status ? (
|
|
|
|
|
<div
|
|
|
|
|
className={`relative p-4 my-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|