|
|
|
@@ -7,6 +7,8 @@ import * as Yup from "yup";
|
|
|
|
|
import usersService from '../../../../services/UsersService';
|
|
|
|
|
import LoadingSpinner from '../../../Spinners/LoadingSpinner';
|
|
|
|
|
import { PriceFormatter } from '../../../Helpers/PriceFormatter';
|
|
|
|
|
import { tableReload } from '../../../../store/TableReloads';
|
|
|
|
|
import { useDispatch } from 'react-redux';
|
|
|
|
|
|
|
|
|
|
const validationSchema = Yup.object().shape({
|
|
|
|
|
// amount: Yup.string()
|
|
|
|
@@ -22,10 +24,14 @@ const validationSchema = Yup.object().shape({
|
|
|
|
|
amount: Yup.number('Please enter a number')
|
|
|
|
|
.min(1, "Price must be greater than 0")
|
|
|
|
|
.required("Amount is required"),
|
|
|
|
|
comment: Yup.string()
|
|
|
|
|
.required("Comment is required"),
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
|
|
|
|
|
const dispatch = useDispatch()
|
|
|
|
|
|
|
|
|
|
const apiUrl = new usersService()
|
|
|
|
|
|
|
|
|
|
const [startTransfer, setStartTransfer] = useState({loading:true, data: {}})
|
|
|
|
@@ -40,15 +46,64 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
to: `${familyData.firstname} ${familyData.lastname}`,
|
|
|
|
|
comment: ''
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// FUNCTION TO PERFORM FAMILY TRANSFER
|
|
|
|
|
const handleAddFund = (values) => {
|
|
|
|
|
setRequestStatus({loading:true, status:false, message:''})
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
action() // TO CLOSE THE MODAL
|
|
|
|
|
}, 3000)
|
|
|
|
|
// let reqData = {...values}
|
|
|
|
|
console.log(values)
|
|
|
|
|
|
|
|
|
|
let senderBal = startTransfer?.data?.origing_current_balance || '' // SENDER'S ACCOUNT BALANCE
|
|
|
|
|
let senderLimit = startTransfer?.data?.origing_transfer_limit || '' // SENDER'S TRANSFER LIMIT
|
|
|
|
|
|
|
|
|
|
let reqData = { // API REQUEST DATA
|
|
|
|
|
family_uid : familyData.uid,
|
|
|
|
|
wallet_uid : wallet.wallet_uid,
|
|
|
|
|
origing_wallet_uid : startTransfer?.data?.origing_wallet_uid,
|
|
|
|
|
currency : startTransfer?.data?.currency,
|
|
|
|
|
amount : values.amount*100,
|
|
|
|
|
description : values.comment,
|
|
|
|
|
family_transfer_mode : 100,
|
|
|
|
|
action : 22014
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if(!senderBal || !senderLimit){ // RETURNS UNAUTHORIZED, IF SENDER BAL OR LIMIT IS NOT AVAILABLE
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:'Unauthorized, try again later'})
|
|
|
|
|
return setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
}, 5000)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if(values.amount > senderBal*0.01){ // CHECKS TO SEE IF SENDER IS SENDING MORE THAN HIS BALANCE
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:'You cannot send more than your balance'})
|
|
|
|
|
return setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
}, 5000)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if(values.amount > senderLimit*0.01){ // CHECKS TO SEE IF SENDER IS SENDING MORE THAN HIS LIMIT
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:`You cannot exceed ${senderLimit*0.01} ${startTransfer?.data?.origing_currency.charAt(0).toUpperCase() + startTransfer?.data?.origing_currency.slice(1).toLowerCase()}`})
|
|
|
|
|
return setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
}, 5000)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
apiUrl.familyTransfer(reqData).then(({data}) => {
|
|
|
|
|
if(data.internal_return < 0 || data.credit_confirm == '' || data.pay_confirm == ''){
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:'Transfer Failed'})
|
|
|
|
|
return setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
}, 5000)
|
|
|
|
|
}
|
|
|
|
|
setRequestStatus({loading:false, status:true, message:'Transfer Successful'})
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
dispatch(tableReload({ type: "WALLETTABLE" })); // UPDATES PARENT WALLET ACCOUNT
|
|
|
|
|
action() // TO CLOSE THE MODAL
|
|
|
|
|
}, 5000)
|
|
|
|
|
}).catch(error => {
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:'Network Error, try again'})
|
|
|
|
|
setTimeout(()=>{
|
|
|
|
|
setRequestStatus({loading:false, status:false, message:''})
|
|
|
|
|
}, 5000)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// LOAD FAMILY START TRANSFER
|
|
|
|
@@ -60,7 +115,6 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
}
|
|
|
|
|
apiUrl.familyTransferStart(reqData).then(response => {
|
|
|
|
|
setStartTransfer({loading:false, data:response?.data })
|
|
|
|
|
// console.log('reqData', response.data)
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
setStartTransfer({loading:false, data: {}})
|
|
|
|
|
})
|
|
|
|
@@ -68,7 +122,7 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<ModalCom action={action} situation={situation}>
|
|
|
|
|
<div className="relative logout-modal-wrapper lg:w-[450px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
|
|
|
|
|
<div className="relative logout-modal-wrapper lg:w-[500px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
|
|
|
|
|
<div className="logout-modal-header w-full flex items-center justify-between lg:px-10 lg:py-8 px-[30px] py-[23px] border-b border-light-purple dark:border-[#5356fb29] ">
|
|
|
|
|
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
|
|
|
|
|
Add Fund
|
|
|
|
@@ -116,12 +170,12 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
<div className="field w-full mb-[0.5rem]">
|
|
|
|
|
<InputCom
|
|
|
|
|
placeholder="0"
|
|
|
|
|
label="Amount:"
|
|
|
|
|
label={`Amount (${startTransfer?.data?.currency})`}
|
|
|
|
|
name="amount"
|
|
|
|
|
type="text"
|
|
|
|
|
parentClass="flex items-center gap-1 w-full"
|
|
|
|
|
labelClass="flex-[0.2] mb-0"
|
|
|
|
|
inputClass={`flex-[0.8] input-curve lg border border-[#dce4e9] ${props.errors.amount && props.touched.amount ? 'border border-red-500' : ''}`}
|
|
|
|
|
labelClass="flex-[0.3] mb-0"
|
|
|
|
|
inputClass={`flex-[0.7] input-curve lg border border-[#dce4e9] ${props.errors.amount && props.touched.amount ? 'border border-red-500' : ''}`}
|
|
|
|
|
fieldClass="px-2 text-right"
|
|
|
|
|
value={props.values.amount}
|
|
|
|
|
inputHandler={props.handleChange}
|
|
|
|
@@ -132,12 +186,12 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
<div className="field w-full mb-[0.5rem]">
|
|
|
|
|
<InputCom
|
|
|
|
|
placeholder="From"
|
|
|
|
|
label="From:"
|
|
|
|
|
label={`From (${startTransfer?.data?.origing_currency})`}
|
|
|
|
|
name="from"
|
|
|
|
|
type="text"
|
|
|
|
|
parentClass="flex items-center gap-1 w-full"
|
|
|
|
|
labelClass="flex-[0.2] mb-0"
|
|
|
|
|
inputClass={`flex-[0.8] input-curve lg border border-[#dce4e9]`}
|
|
|
|
|
labelClass="flex-[0.3] mb-0"
|
|
|
|
|
inputClass={`flex-[0.7] input-curve lg border border-[#dce4e9]`}
|
|
|
|
|
fieldClass="px-2 text-right"
|
|
|
|
|
value={props.values.from}
|
|
|
|
|
disable={true}
|
|
|
|
@@ -152,8 +206,8 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
name="to"
|
|
|
|
|
type="text"
|
|
|
|
|
parentClass="flex items-center gap-1 w-full"
|
|
|
|
|
labelClass="flex-[0.2] mb-0"
|
|
|
|
|
inputClass={`flex-[0.8] input-curve lg border border-[#dce4e9]`}
|
|
|
|
|
labelClass="flex-[0.3] mb-0"
|
|
|
|
|
inputClass={`flex-[0.7] input-curve lg border border-[#dce4e9]`}
|
|
|
|
|
fieldClass="px-2 text-right"
|
|
|
|
|
value={props.values.to}
|
|
|
|
|
disable={true}
|
|
|
|
@@ -165,14 +219,15 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
<div className="w-full">
|
|
|
|
|
<label
|
|
|
|
|
htmlFor="Job Delivery Details"
|
|
|
|
|
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1'
|
|
|
|
|
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1"
|
|
|
|
|
>
|
|
|
|
|
Comment
|
|
|
|
|
{/* {props.errors.comment && props.touched.comment && <span className='text-sm text-red-500'>{' '}{props.errors.comment}</span>} */}
|
|
|
|
|
</label>
|
|
|
|
|
<textarea
|
|
|
|
|
// id="Job Delivery Details"
|
|
|
|
|
rows="2"
|
|
|
|
|
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px] border`}
|
|
|
|
|
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px] border ${props.errors.comment && props.touched.comment ? 'border border-red-500' : ''}`}
|
|
|
|
|
style={{ resize: "none" }}
|
|
|
|
|
name="comment"
|
|
|
|
|
value={props.values.comment}
|
|
|
|
@@ -189,8 +244,8 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
{requestStatus.message != "" &&
|
|
|
|
|
(!requestStatus.status ? (
|
|
|
|
|
<div
|
|
|
|
|
// className={`relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
className={`pb-1 absolute bottom-0 left-1/2 -translate-x-1/2 text-[#912741] rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
className={`relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
// className={`pb-1 absolute bottom-0 left-1/2 -translate-x-1/2 text-[#912741] rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
|
|
|
|
|
>
|
|
|
|
|
{requestStatus.message}
|
|
|
|
@@ -198,8 +253,8 @@ function FamilyAddFundPopout({action, situation, wallet, familyData}) {
|
|
|
|
|
) : (
|
|
|
|
|
requestStatus.status && (
|
|
|
|
|
<div
|
|
|
|
|
// className={`relative p-4 text-green-700 bg-slate-200 border-slate-800 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
className={`pb-1 absolute bottom-0 left-1/2 -translate-x-1/2 text-green-700 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
className={`relative p-4 text-green-700 bg-slate-200 border-slate-800 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
// className={`pb-1 absolute bottom-0 left-1/2 -translate-x-1/2 text-green-700 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
|
|
|
|
>
|
|
|
|
|
{requestStatus.message}
|
|
|
|
|
</div>
|
|
|
|
|