offer interest page update
This commit was merged in pull request #750.
This commit is contained in:
victorAnumudu
@@ -6,10 +6,18 @@ import CommonHead from "../UserHeader/CommonHead";
|
||||
import usersService from "../../services/UsersService";
|
||||
import LoadingSpinner from "../Spinners/LoadingSpinner";
|
||||
import OthersInterestedTable from "./OthersInterestedTable";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { tableReload } from "../../store/TableReloads";
|
||||
import { PriceFormatter } from "../Helpers/PriceFormatter";
|
||||
|
||||
export default function ManageInterestOffer(props) {
|
||||
|
||||
const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
|
||||
|
||||
let walletBal = walletDetails?.data?.filter(wallet => wallet.code == props?.offerDetails?.currency_code) // USER WALLET BALANCE FOR CORRESPONDING TASK CURRENCY
|
||||
|
||||
let clientAdded = new Date(props.offerDetails?.client_added)
|
||||
|
||||
const dispatch = useDispatch()
|
||||
const navigate = useNavigate()
|
||||
const apiCall = new usersService()
|
||||
@@ -183,12 +191,21 @@ export default function ManageInterestOffer(props) {
|
||||
<button
|
||||
name="message"
|
||||
onClick={(e) => setTab(e.target.name)}
|
||||
className={`px-4 py-1 rounded-t-2xl ${
|
||||
className={`px-4 py-1 rounded-t-2xl flex gap-2 ${
|
||||
tab == "message" ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
|
||||
}`}
|
||||
>
|
||||
Messages ({messageList.data.length})
|
||||
</button>
|
||||
<button
|
||||
name="details"
|
||||
onClick={(e) => setTab(e.target.name)}
|
||||
className={`px-4 py-1 rounded-t-2xl ${
|
||||
tab == "details" ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
|
||||
}`}
|
||||
>
|
||||
Delivery Details
|
||||
</button>
|
||||
</div>
|
||||
{/* END OF switch button */}
|
||||
|
||||
@@ -202,7 +219,10 @@ export default function ManageInterestOffer(props) {
|
||||
</div>
|
||||
<div className="my-3 md:my-0 flex items-center gap-1">
|
||||
<span className="w-[200px] text-lg font-bold text-dark-gray dark:text-white tracking-wide">Member Since</span>
|
||||
<span className="min-w-[100px] text-sm font-bold text-dark-gray dark:text-white tracking-wide">{props.offerDetails?.client_added}</span>
|
||||
<span className="min-w-[100px] text-sm font-bold text-dark-gray dark:text-white tracking-wide">
|
||||
{clientAdded.getFullYear()}{" - "}
|
||||
{clientAdded.getMonth() < 9 ? '0'+ (clientAdded.getMonth() + 1) : clientAdded.getMonth() + 1}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="my-3 flex items-center gap-1">
|
||||
@@ -230,7 +250,7 @@ export default function ManageInterestOffer(props) {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
: tab == 'message' ?
|
||||
<div className="message-details w-full border-t">
|
||||
<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">
|
||||
@@ -294,14 +314,31 @@ export default function ManageInterestOffer(props) {
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
: tab == 'details' ?
|
||||
<div className="info-details w-full border-t">
|
||||
<h1 className="my-3 text-base font-medium text-dark-gray dark:text-white tracking-wide">{props?.offerDetails?.description}</h1>
|
||||
</div>
|
||||
:
|
||||
null
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
{/* END OF Detail section */}
|
||||
|
||||
{/* BUTTON section */}
|
||||
<div className="p-4 w-full min-h-full bg-sky-100 dark:bg-dark-gray col-span-1">
|
||||
<div className="w-full h-full">
|
||||
{/* Wallet balance and reward */}
|
||||
<div className='mb-4 border-b-2 flex flex-col justify-center items-center gap-4'>
|
||||
<div className='w-full flex flex-col lg:flex-row justify-center items-center gap-2'>
|
||||
<p className="text-lg font-bold text-dark-gray dark:text-white tracking-wide">Wallet:</p>
|
||||
<span className="font-medium text-dark-gray dark:text-white">{PriceFormatter(walletBal[0]?.amount * 0.01,props?.offerDetails?.currency_code,props?.offerDetails?.currency)}</span>
|
||||
</div>
|
||||
<div className='w-full flex flex-col lg:flex-row justify-center items-center gap-2'>
|
||||
<p className="text-lg font-bold text-dark-gray dark:text-white tracking-wide">Reward:</p>
|
||||
<span className="font-medium text-dark-gray dark:text-white">{PriceFormatter(props?.offerDetails?.price * 0.01,props?.offerDetails?.currency_code,props?.offerDetails?.currency)}</span>
|
||||
</div>
|
||||
</div>
|
||||
{/* BUTTON section */}
|
||||
<div className="w-full">
|
||||
<div className="h-full flex sm:flex-col justify-center items-center gap-10">
|
||||
{requestStatus.loading && requestStatus.processType == 'accept' ?
|
||||
<LoadingSpinner color='sky-blue' size='10' />
|
||||
@@ -333,6 +370,7 @@ export default function ManageInterestOffer(props) {
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
{/* END of BUTTON section */}
|
||||
|
||||
{/* ERROR DISPLAY */}
|
||||
<div className="w-full">
|
||||
@@ -357,7 +395,6 @@ export default function ManageInterestOffer(props) {
|
||||
{/* End of error or success display */}
|
||||
</div>
|
||||
</div>
|
||||
{/* END of BUTTON section */}
|
||||
</div>
|
||||
</div>
|
||||
{/* END OF manage offer section */}
|
||||
|
||||
Reference in New Issue
Block a user