diff --git a/src/assets/images/card.svg b/src/assets/images/card.svg new file mode 100644 index 0000000..443c6ff --- /dev/null +++ b/src/assets/images/card.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/images/grid-view.svg b/src/assets/images/grid-view.svg new file mode 100644 index 0000000..e3f02b5 --- /dev/null +++ b/src/assets/images/grid-view.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/src/assets/images/list-view.png b/src/assets/images/list-view.png new file mode 100644 index 0000000..8d3b049 Binary files /dev/null and b/src/assets/images/list-view.png differ diff --git a/src/assets/images/master.svg b/src/assets/images/master.svg new file mode 100644 index 0000000..f5c1a88 --- /dev/null +++ b/src/assets/images/master.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/images/visa.svg b/src/assets/images/visa.svg new file mode 100644 index 0000000..c1b6e91 --- /dev/null +++ b/src/assets/images/visa.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/components/MyWallet/AddFundDollars.jsx b/src/components/MyWallet/AddFundDollars.jsx index c79980a..7a5a903 100644 --- a/src/components/MyWallet/AddFundDollars.jsx +++ b/src/components/MyWallet/AddFundDollars.jsx @@ -1,8 +1,10 @@ -import React,{useState} from 'react' +import React,{useEffect, useState} from 'react' import { useNavigate } from 'react-router-dom' import InputCom from '../Helpers/Inputs/InputCom'; import PaginatedList from '../Pagination/PaginatedList'; import { handlePagingFunc } from '../Pagination/HandlePagination'; +import LoadingSpinner from '../Spinners/LoadingSpinner'; +import usersService from '../../services/UsersService'; import { Form, Formik } from "formik"; import * as Yup from "yup"; @@ -56,17 +58,18 @@ const initialValues = { function AddFundDollars(props) { const navigate = useNavigate() + let apiCall = new usersService() let [tab, setTab] = useState("previous"); //STATE FOR SWITCHING BETWEEN TABS let [prevCardDetails, setPrevCardDetails] = useState(null) // STATE TO HOLD PREVIOUS CARD SELECTED - let previousCards = {data:[1,2]} //USER PREVIOUS CARDS // TO BE REPLACED LATER FROM DATA FROM API + let [payListCard, setPayListCard] = useState({loading: true, data:[]}) //USER PREVIOUS CARDS const [currentPage, setCurrentPage] = useState(0); const indexOfFirstItem = Number(currentPage); const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE); - const currentPreviousCards = previousCards?.data?.slice(indexOfFirstItem, indexOfLastItem); + const currentPreviousCards = payListCard?.data?.slice(indexOfFirstItem, indexOfLastItem); const handlePagination = (e) => { handlePagingFunc(e,setCurrentPage) @@ -95,6 +98,15 @@ function AddFundDollars(props) { props.setInput('') } + useEffect(()=>{ + apiCall.payListCard().then(res => { + setPayListCard({loading: false, data: res.data.result_list}) + }).catch(err => { + console.log('PAYCARDLIST ERROR', err) + setPayListCard({loading: false, data: []}) + }) + }, []) + return ( <>

Payment Method

@@ -125,18 +137,24 @@ function AddFundDollars(props) { {/* previous tab */} {tab == 'previous' ?
- {previousCards?.data?.length ? + { payListCard.loading ? + + : + payListCard?.data?.length ? {currentPreviousCards.map((item, index)=>( - + @@ -168,7 +186,7 @@ function AddFundDollars(props) { } {/* PAGINATION BUTTON */}
- = previousCards?.data?.length ? true : false} data={previousCards?.data} start={indexOfFirstItem} stop={indexOfLastItem} /> + = payListCard?.data?.length ? true : false} data={payListCard?.data} start={indexOfFirstItem} stop={indexOfLastItem} />
{/* END OF PAGINATION BUTTON */} diff --git a/src/services/UsersService.js b/src/services/UsersService.js index 7d796bc..d9546c5 100644 --- a/src/services/UsersService.js +++ b/src/services/UsersService.js @@ -719,6 +719,16 @@ class usersService { return this.postAuxEnd("/faq", postData); } + // END POINT TO GET LIST OF USER PREVIOUS CARDS + payListCard() { + var postData = { + uid: localStorage.getItem("uid"), + member_id: localStorage.getItem("member_id"), + sessionid: localStorage.getItem("session_token"), + action: 11055 + }; + return this.postAuxEnd("/paylistcard", postData); + } /* - 20:27:30.118 FLOG_MAX [757411]: REQ_STRING(username) - 20:27:30.118 FLOG_MAX [757411]: REQ_STRING(password)
-
+
-

Master Card

-

Bank **************3535

-

Verified

+

{item.description} Card

+

Bank **************{item.digits}

+
+

{item.added}

+

Verified

+