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

Merge branch 'JobList-Categories' of WrenchBoard/Users-Wrench into master

Browse Source
This commit is contained in:
Olusesan Ameye
2023-06-22 10:37:26 +00:00
committed by Gogs
parent bab0296f4f 5769332e74
commit 9e1a68f81a
1 changed files with 30 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/MarketPlace/PopUp/MarketPopUp.jsx
+30 -14
View File
@@ -4,6 +4,7 @@ import { toast } from "react-toastify";
import { Form, Formik } from "formik"; import { Form, Formik } from "formik";
import usersService from "../../../services/UsersService"; import usersService from "../../../services/UsersService";
import LoadingSpinner from "../../Spinners/LoadingSpinner"; import LoadingSpinner from "../../Spinners/LoadingSpinner";
import { PriceFormatter } from "../../Helpers/PriceFormatter";
const MarketPopUp = ({ details, onClose, situation, marketInt }) => { const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
const [marketMsg, setMarketMsg] = useState({ const [marketMsg, setMarketMsg] = useState({
@@ -96,14 +97,18 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
[apiCall, details, onClose, textValue] [apiCall, details, onClose, textValue]
); );
console.log('Checking my mangeInt',manageInt) let thePrice = PriceFormatter(
details?.price * 0.01,
details?.currency_code,
details?.currency
);
// let addedIntDate = marketInt?.added?.split(" ")[0]; // let addedIntDate = marketInt?.added?.split(" ")[0];
let expireIntDate = marketInt?.expire?.split(" ")[0]; let expireIntDate = marketInt?.expire?.split(" ")[0];
return ( return (
<ModalCom action={onClose} situation={situation} className="edit-popup"> <ModalCom action={onClose} situation={situation} className="edit-popup">
<div className="logout-modal-wrapper md:w-[750px] md:h-[700px] h-full bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto"> <div className="logout-modal-wrapper md:w-[750px] md:h-[660px] h-full bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
<div className="logout-modal-header w-full flex items-center justify-between lg:p-6 px-[30px] py-[23px]"> <div className="logout-modal-header w-full flex items-center justify-between lg:p-6 px-[30px] py-[23px]">
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide"> <h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
{details.offer_code} {details.offer_code}
@@ -112,8 +117,8 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
</div> </div>
<div className="md:flex bg-white rounded-lg"> <div className="md:flex bg-white rounded-lg">
<div className="p-4 w-full md:w-3/4 md:border-r-1"> <div className="p-4 w-full md:w-[75%] md:border-r-1">
<div className="min-h-[290px]"> <div className="min-h-[263px]">
<h2 className="font-semibold text-slate-900 dark:text-black tracking-wide"> <h2 className="font-semibold text-slate-900 dark:text-black tracking-wide">
{details?.title} {details?.title}
</h2> </h2>
@@ -128,7 +133,7 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
name: "", name: "",
content: { content: {
text: `Timeline: ${details.timeline_days} day(s) -- `, text: `Timeline: ${details.timeline_days} day(s) -- `,
bold: `Budget: ${details.price} naira`, bold: `Budget: ${thePrice}`,
}, },
}, },
{ {
@@ -138,7 +143,7 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
}, },
].map(({ name, content, danger }, idx) => ( ].map(({ name, content, danger }, idx) => (
<div className={`my-3 md:flex items-center`} key={idx}> <div className={`my-3 md:flex items-center`} key={idx}>
<label className="w-full md:w-1/4 text-slate-900 tracking-wide font-semibold"> <label className="w-full md:w-[19%] text-slate-900 tracking-wide font-semibold whitespace-pre-wrap">
{name} {name}
</label> </label>
<div <div
@@ -156,15 +161,19 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
}} }}
/> />
) : ( ) : (
<p className={`w-full md:w-3/4 text-slate-900`}> <p className={`w-full text-slate-900`}>
{name !== "Delivery Detail" ? ( {name !== "Delivery Detail" ? (
<> <>
{typeof content !== "object" ? content : null} {typeof content !== "object" ? content : null}
{typeof content === "object" && ( {typeof content === "object" && (
<span className="flex items-center gap-2"> <>
{content?.text} <hr className="mb-1" />
<strong>{content?.bold}</strong> <span className="flex items-center gap-2">
</span> {content?.text}
<strong>{content?.bold}</strong>
</span>
<hr className="mt-1" />
</>
)} )}
</> </>
) : ( ) : (
@@ -207,15 +216,15 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
</div> </div>
</div> </div>
<div className="w-full md:w-1/4 h-full "> <div className="w-full md:w-[23%] h-full ">
<div className="w-[90%] mx-auto bg-[#f1f8ff] p-4 rounded-md md:min-h-[550px] flex flex-col justify-between"> <div className="mx-auto bg-[#f1f8ff] p-4 rounded-md md:min-h-[498px] flex flex-col justify-between">
<div className="w-full flex flex-col justify-center py-4 gap-2"> <div className="w-full flex flex-col justify-center py-4 gap-2">
<p className="w-full text-slate-900 tracking-wide my-1"> <p className="w-full text-slate-900 tracking-wide my-1">
Interested in the task? Interested in the task?
</p> </p>
<hr /> <hr />
<button <button
className="bg-[#57cd89] text-center text-lg font-semibold text-white py-2 px-4 rounded-md inline-flex flex-col items-center justify-center" className="bg-[#57cd89] text-center text-lg font-semibold text-white py-2 px-4 rounded-md inline-flex sm:flex-col flex-row sm:gap-0 gap-1 items-center justify-center"
name="market-interest" name="market-interest"
onClick={marketCalls} onClick={marketCalls}
> >
@@ -251,6 +260,13 @@ const MarketPopUp = ({ details, onClose, situation, marketInt }) => {
<p className="my-1">Expire: {expireIntDate}</p> <p className="my-1">Expire: {expireIntDate}</p>
</div> </div>
</div> </div>
<button
className="self-end w-[150px] mt-2 h-[52px] rounded-md text-base bg-transparent border border-red-500 text-red-500 mx-auto"
name="cancel"
onClick={onClose}
>
Cancel
</button>
</div> </div>
{/* END OF ACTION SECTION */} {/* END OF ACTION SECTION */}
</div> </div>