Compare commits

...

5 Commits

Author SHA1 Message Date
victorAnumudu 5c223ba641 margin added to offer interest table 2023-06-18 08:20:29 +01:00
victorAnumudu cc0e2c2c6b offer interest process API added 2023-06-18 08:14:22 +01:00
ameye 3df97c0760 Merge branch 'return-to-wallet-fixed' of WrenchBoard/Users-Wrench into master 2023-06-17 22:29:15 +00:00
ameye 6d742e92b5 Merge branch 'wallet-add-icon' of WrenchBoard/Users-Wrench into master 2023-06-17 22:29:08 +00:00
victorAnumudu 63f4658449 Icon padding fixed 2023-06-17 22:19:57 +01:00
5 changed files with 115 additions and 31 deletions
+12 -13
View File
@@ -33,7 +33,7 @@ function Balance({wallet, coupon}) {
:
wallet.data.length ?
wallet.data.map((item, index)=> (
<div key={index} className="md:flex items-center flex-wrap my-3 border-t-2 border-slate-400 wallet-box">
<div key={index} className="p-3 md:flex items-center flex-wrap my-3 border-t-2 border-slate-400 wallet-box">
<div className='text-slate-900 w-full md:w-1/2 flex space-x-3 items-start justify-start'>
<div className='balance-info bal-col1'>
<p className='py-2'></p>
@@ -53,19 +53,18 @@ function Balance({wallet, coupon}) {
<div className='w-full my-2 md:my-0 md:w-1/2 flex space-x-2 items-center justify-start md:justify-end'>
{
item.action_type != 'AC_AD_FD_ONLY' ?
<Link to='transfer-fund' className='lg:flex hidden user-balance cursor-pointer lg:w-[152px] w-[150px] h-[48px]
items-center rounded-full relative bg-purple pr-1.5 pl-4 lg:text-xl text-lg font-bold text-white'>Transfer</Link>:''
<Link to='transfer-fund' className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-purple lg:text-xl text-lg font-bold text-white'>Transfer</Link>:''
}
<Link to='add-fund' className='lg:flex hidden user-balance cursor-pointer lg:w-[162px] w-[180px] h-[48px]
items-center rounded-full relative bg-green pr-1.5 pl-4 lg:text-xl text-lg font-bold text-white'>
<span className="lg:block">
<svg xmlns="http://www.w3.org/2000/svg" width="38"
height="38" viewBox="0 0 42 42" fill="none"><path
d="M21 0C16.8466 0 12.7865 1.23163 9.33303 3.53914C5.8796 5.84665 3.18798 9.1264 1.59854 12.9636C0.00909901 16.8009 -0.406771 21.0233 0.403518 25.0969C1.21381 29.1705 3.21386 32.9123 6.15077 35.8492C9.08767 38.7861 12.8295 40.7862 16.9031 41.5965C20.9767 42.4068 25.1991 41.9909 29.0364 40.4015C32.8736 38.812 36.1534 36.1204 38.4609 32.667C40.7684 29.2135 42 25.1534 42 21C41.994 15.4323 39.7796 10.0944 35.8426 6.15741C31.9056 2.22045 26.5677 0.00602189 21 0ZM28 22.75H22.75V28C22.75 28.4641 22.5656 28.9092 22.2374 29.2374C21.9093 29.5656 21.4641 29.75 21 29.75C20.5359 29.75 20.0908 29.5656 19.7626 29.2374C19.4344 28.9092 19.25 28.4641 19.25 28V22.75H14C13.5359 22.75 13.0908 22.5656 12.7626 22.2374C12.4344 21.9092 12.25 21.4641 12.25 21C12.25 20.5359 12.4344 20.0907 12.7626 19.7626C13.0908 19.4344 13.5359 19.25 14 19.25H19.25V14C19.25 13.5359 19.4344 13.0908 19.7626 12.7626C20.0908 12.4344 20.5359 12.25 21 12.25C21.4641 12.25 21.9093 12.4344 22.2374 12.7626C22.5656 13.0908 22.75 13.5359 22.75 14V19.25H28C28.4641 19.25 28.9093 19.4344 29.2374 19.7626C29.5656 20.0907 29.75 20.5359 29.75 21C29.75 21.4641 29.5656 21.9092 29.2374 22.2374C28.9093 22.5656 28.4641 22.75 28 22.75Z"
fill="white"></path>
</svg>
</span>
Add Credit</Link>
<Link to='add-fund' className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-green lg:text-xl text-lg font-bold text-white'>
<span className="">
<svg xmlns="http://www.w3.org/2000/svg" width="38"
height="38" viewBox="0 0 42 42" fill="none"><path
d="M21 0C16.8466 0 12.7865 1.23163 9.33303 3.53914C5.8796 5.84665 3.18798 9.1264 1.59854 12.9636C0.00909901 16.8009 -0.406771 21.0233 0.403518 25.0969C1.21381 29.1705 3.21386 32.9123 6.15077 35.8492C9.08767 38.7861 12.8295 40.7862 16.9031 41.5965C20.9767 42.4068 25.1991 41.9909 29.0364 40.4015C32.8736 38.812 36.1534 36.1204 38.4609 32.667C40.7684 29.2135 42 25.1534 42 21C41.994 15.4323 39.7796 10.0944 35.8426 6.15741C31.9056 2.22045 26.5677 0.00602189 21 0ZM28 22.75H22.75V28C22.75 28.4641 22.5656 28.9092 22.2374 29.2374C21.9093 29.5656 21.4641 29.75 21 29.75C20.5359 29.75 20.0908 29.5656 19.7626 29.2374C19.4344 28.9092 19.25 28.4641 19.25 28V22.75H14C13.5359 22.75 13.0908 22.5656 12.7626 22.2374C12.4344 21.9092 12.25 21.4641 12.25 21C12.25 20.5359 12.4344 20.0907 12.7626 19.7626C13.0908 19.4344 13.5359 19.25 14 19.25H19.25V14C19.25 13.5359 19.4344 13.0908 19.7626 12.7626C20.0908 12.4344 20.5359 12.25 21 12.25C21.4641 12.25 21.9093 12.4344 22.2374 12.7626C22.5656 13.0908 22.75 13.5359 22.75 14V19.25H28C28.4641 19.25 28.9093 19.4344 29.2374 19.7626C29.5656 20.0907 29.75 20.5359 29.75 21C29.75 21.4641 29.5656 21.9092 29.2374 22.2374C28.9093 22.5656 28.4641 22.75 28 22.75Z"
fill="white"></path>
</svg>
</span>
<span className='text-white'>Add Credit</span>
</Link>
</div>
</div>
))
@@ -1,18 +1,24 @@
import React, { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import Layout from "../Partials/Layout";
import CommonHead from "../UserHeader/CommonHead";
import { useNavigate } from "react-router-dom";
import usersService from "../../services/UsersService";
import { handlePagingFunc } from "../Pagination/HandlePagination";
import PaginatedList from "../Pagination/PaginatedList";
import LoadingSpinner from "../Spinners/LoadingSpinner";
import OthersInterestedTable from "./OthersInterestedTable";
export default function ManageInterestOffer(props) {
const navigate = useNavigate()
const apiCall = new usersService()
let [redirectTime, setRedirectTime] = useState(5)
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);
@@ -28,6 +34,36 @@ export default function ManageInterestOffer(props) {
setValue(value);
};
//FUNCTION TO ACCEPT/REJECT OFFER INTEREST
const interestOfferProcess = ({target:{name}}) => {
setRequestStatus(prev => ({...prev, loading: true, processType: name}))
let reqData = { // API PAYLOADS
proc: name.toUpperCase(),
client_uid : props.offerDetails?.client_uid,
offer_code : props.offerDetails?.offer_code,
offer_uid: props.offerDetails?.offer_uid,
}
apiCall.offersInterestProc(reqData).then(res => {
if(res.status != 200 || res.data.internal_return < 0){
setRequestStatus({loading: false, status: false, message: 'Unable to complete request', processType: ''})
return
}
setInterval(() => { // SETS REDIRECT COUNT DOWN
setRedirectTime(prev => prev - 1)
}, 1000);
setRequestStatus({loading: false, status: true, message: `Offer ${name}ed`, processType: ''})
setTimeout(()=>{
navigate('/offer-interest', {replace: true})
},5000)
}).catch(err => {
setRequestStatus({loading: false, status: false, message: 'Opps! something went wrong. Try again', processType: ''})
}).finally(()=>{
setTimeout(()=>{
setRequestStatus({loading: false, status: false, message: '', processType: ''})
},5000)
})
}
useEffect(()=>{
// run API to get message to replace message array above, add reload variable as dependence array
},[])
@@ -188,19 +224,58 @@ export default function ManageInterestOffer(props) {
{/* 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 flex flex-col justify-center items-center gap-10">
<button
type="button"
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
>
<span className="text-white">Accept</span>
</button>
<button
type="button"
className="px-2 py-1 h-11 flex justify-center items-center border-gradient text-base rounded-full text-white"
>
<span className="text-gradient">Reject</span>
</button>
<div className="w-full h-full">
<div className="mt-0 sm:mt-10 flex sm:flex-col justify-center items-center gap-10">
{requestStatus.loading && requestStatus.processType == 'accept' ?
<LoadingSpinner color='sky-blue' size='10' />
:
<button
type="button"
name='accept'
disabled={requestStatus.loading}
onClick={interestOfferProcess}
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
>
Accept
</button>
}
{requestStatus.loading && requestStatus.processType == 'reject' ?
<LoadingSpinner color='sky-blue' size='10' />
:
<button
type="button"
name='reject'
disabled={requestStatus.loading}
onClick={interestOfferProcess}
className="px-2 py-1 h-11 flex justify-center items-center border-gradient text-base rounded-full text-black"
>
Reject
</button>
}
</div>
{/* ERROR DISPLAY */}
<div className="w-full">
{/* error or success display */}
{requestStatus.message != "" && requestStatus.processType != 'sendmeassge' &&
(!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 or success display */}
</div>
</div>
{/* END of BUTTON section */}
@@ -29,7 +29,7 @@ export default function OffersInterestTable({offerInterestList, className}) {
return (
<div
className={`update-table w-full p-8 bg-white dark:bg-dark-white rounded-2xl section-shadow min-h-[520px] ${
className={`update-table w-full my-8 p-8 bg-white dark:bg-dark-white rounded-2xl section-shadow min-h-[520px] ${
className || ""
}`}
>
-2
View File
@@ -11,8 +11,6 @@
}
.wallet-box{
background-color: aliceblue;
height: 120px;
padding: 5px;
border-radius: 20px;
}
.bal-col1{
+12
View File
@@ -666,6 +666,18 @@ class usersService {
return this.postAuxEnd("/offersinterestlist", postData);
}
// END POINT FOR PROCESSING OFFER INTEREST
offersInterestProc(reqData) {
var postData = {
uid: localStorage.getItem("uid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token"),
action: 13034,
...reqData
};
return this.postAuxEnd("/offersinterestproc", postData);
}
// END POINT FOR WORKER TO MARK TASK AS COMPLETED
workerJobAction(reqData) {
var postData = {