Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
J
jinfa-platform
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
shenshaokai
jinfa-platform
Commits
e1f83b31
Commit
e1f83b31
authored
Jan 13, 2021
by
XieZhiXiong
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 添加授信余额还款
parent
5a4b27c1
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
372 additions
and
22 deletions
+372
-22
index.less
src/components/BalancePayModal/index.less
+75
-0
index.tsx
src/components/BalancePayModal/index.tsx
+215
-0
index.tsx
...tion/quotaMenage/detail/components/IntroduceRow/index.tsx
+82
-22
No files found.
src/components/BalancePayModal/index.less
0 → 100644
View file @
e1f83b31
.title {
display: inline-block;
width: 122px;
font-weight: 400;
}
.amount {
font-size: 24px;
font-weight: 500;
color: #172B4D;
}
.amount1 {
font-size: 16px;
}
.amount2 {
font-size: 16px;
color: #E63F3B;
}
.payContainer {
margin: 90px 0;
text-align: center;
.title {
font-size: 14px;
font-weight: 400;
color: #6B778C;
margin-bottom: 24px;
}
.inputBox {
position: relative;
width: 336px;
margin: 0 auto;
display: flex;
justify-content: space-between;
font-weight: bold;
.codeItem {
width: 48px;
height: 48px;
line-height: 0.5;
text-align: center;
background: #FFFFFF;
border: 1px solid #EBECF0;
font-size: 80px;
}
.codeInput {
height: 48px;
position: absolute;
outline: none;
color: transparent;
caret-color: #EBECF0;
font-size: 28px;
padding: 0 14px;
letter-spacing: 48px;
width: 336px;
border: none;
background: none;
-webkit-appearance: none;
&:focus {
border: none !important;
box-shadow: 0 0 0 0 #fff;
}
&::-webkit-input-safebox-button {
display: none;
}
}
}
}
src/components/BalancePayModal/index.tsx
0 → 100644
View file @
e1f83b31
/*
* @Author: XieZhiXiong
* @Date: 2021-01-13 15:37:09
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-01-13 17:23:25
* @Description: 余额支付弹窗
*/
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Modal
,
Input
,
Spin
,
Space
,
Button
,
message
}
from
'antd'
;
import
classNames
from
'classnames'
;
import
{
PublicApi
}
from
'@/services/api'
;
import
{
encryptedByAES
}
from
'@/utils/cryptoAes'
;
import
styles
from
'./index.less'
;
interface
BalancePayModalProps
{
/**
* 是否可见
*/
visible
:
boolean
,
/**
* 隐藏事件
*/
onCancel
:
()
=>
void
,
/**
* 确认按钮 loading
*/
confirmLoading
?:
boolean
,
/**
* 提交事件
*/
onSubmit
:
(
values
:
any
)
=>
void
,
/**
* 上级会员id
*/
parentMemberId
:
number
,
/**
* 上级会员角色id
*/
parentMemberRoleId
:
number
,
/**
* 需要支付的金额
*/
payAmount
:
number
,
}
const
PWD_LEN
=
6
;
const
NUMBER_ARR
=
[
0
,
1
,
2
,
3
,
4
,
5
];
const
BalancePayModal
:
React
.
FC
<
BalancePayModalProps
>
=
(
props
:
BalancePayModalProps
)
=>
{
const
{
visible
,
confirmLoading
,
onCancel
,
onSubmit
,
parentMemberId
,
parentMemberRoleId
,
payAmount
,
}
=
props
;
const
[
pwd
,
setPwd
]
=
useState
(
''
);
const
[
step
,
setStep
]
=
useState
(
0
);
const
[
userBalance
,
setUserBalance
]
=
useState
(
0
);
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
getBalance
=
()
=>
{
if
(
!
parentMemberId
||
!
parentMemberRoleId
||
loading
)
{
return
;
}
setLoading
(
true
);
PublicApi
.
getPayAssetAccountGetUserBalance
({
parentMemberId
:
`
${
parentMemberId
}
`
,
parentMemberRoleId
:
`
${
parentMemberRoleId
}
`
,
payType
:
`
${
2
}
`
,
// 会员支付
}).
then
(
res
=>
{
if
(
res
.
code
===
1000
)
{
setUserBalance
(
res
.
data
);
}
}).
finally
(()
=>
{
setLoading
(
false
);
});
};
useEffect
(()
=>
{
if
(
visible
)
{
getBalance
();
}
},
[
visible
]);
const
handleConfirmPay
=
()
=>
{
if
(
payAmount
>
userBalance
)
{
message
.
error
(
'余额不足'
);
return
;
}
if
(
!
pwd
)
{
message
.
error
(
'请输入支付密码'
);
return
;
}
if
(
pwd
.
length
!==
PWD_LEN
)
{
message
.
error
(
'请输入完整的支付密码'
);
return
;
}
if
(
onSubmit
)
{
onSubmit
({
passWord
:
encryptedByAES
(
pwd
),
});
}
};
const
handleCancel
=
()
=>
{
setStep
(
0
);
if
(
onCancel
)
{
onCancel
();
}
};
const
handlePwdChange
=
(
e
)
=>
{
setPwd
(
e
.
target
.
value
);
}
return
(
<
Modal
title=
"余额支付"
width=
{
576
}
visible=
{
visible
}
confirmLoading=
{
confirmLoading
}
onCancel=
{
handleCancel
}
footer=
{
(
<>
{
step
===
0
&&
(
<
Space
>
<
Button
onClick=
{
onCancel
}
>
取消
</
Button
>
<
Button
type=
"primary"
onClick=
{
()
=>
setStep
(
1
)
}
disabled=
{
loading
||
userBalance
===
0
}
>
支付
</
Button
>
</
Space
>
)
}
{
step
===
1
&&
(
<
Button
type=
"primary"
onClick=
{
handleConfirmPay
}
loading=
{
confirmLoading
}
block
>
确认支付
</
Button
>
)
}
</>
)
}
>
<
Spin
spinning=
{
loading
}
>
{
step
===
0
&&
(
<>
<
p
style=
{
{
fontWeight
:
'bold'
}
}
>
账户余额
</
p
>
<
p
>
<
span
className=
{
styles
.
title
}
>
账户可用余额(元):
</
span
>
<
span
className=
{
styles
.
amount
}
>
{
userBalance
}
</
span
>
</
p
>
<
p
>
<
span
className=
{
styles
.
title
}
>
本次需支付(元):
</
span
>
<
span
className=
{
classNames
(
styles
.
amount
,
styles
.
amount2
)
}
>
{
payAmount
}
</
span
>
</
p
>
</>
)
}
{
step
===
1
&&
(
<
div
className=
{
styles
.
payContainer
}
>
<
p
className=
{
styles
.
title
}
>
请输入支付密码
</
p
>
<
div
className=
{
styles
.
inputBox
}
>
{
NUMBER_ARR
.
map
((
item
,
index
)
=>
(
<
div
className=
{
styles
.
codeItem
}
key=
{
index
}
>
{
pwd
[
index
]?.
replace
(
/
[
0-9
]
/g
,
'·'
)
}
</
div
>
))
}
<
Input
.
Password
className=
{
styles
.
codeInput
}
value=
{
pwd
}
maxLength=
{
PWD_LEN
}
onChange=
{
handlePwdChange
}
visibilityToggle=
{
false
}
id=
"balancePay"
autoFocus
/>
</
div
>
</
div
>
)
}
</
Spin
>
</
Modal
>
);
};
export
default
BalancePayModal
;
\ No newline at end of file
src/pages/payandSettle/creditApplication/quotaMenage/detail/components/IntroduceRow/index.tsx
View file @
e1f83b31
...
@@ -15,10 +15,14 @@ import {
...
@@ -15,10 +15,14 @@ import {
import
{
createFormActions
,
FormEffectHooks
}
from
'@formily/antd'
;
import
{
createFormActions
,
FormEffectHooks
}
from
'@formily/antd'
;
import
lodash
from
'lodash'
;
import
lodash
from
'lodash'
;
import
{
PublicApi
}
from
'@/services/api'
;
import
{
PublicApi
}
from
'@/services/api'
;
import
{
PAY_CHANNEL_WECHAT
}
from
'@/constants'
;
import
{
PAY_CHANNEL_WECHAT
,
PAY_CHANNEL_BALANCE
,
}
from
'@/constants'
;
import
MellowCard
from
'@/components/MellowCard'
;
import
MellowCard
from
'@/components/MellowCard'
;
import
{
Pie
}
from
'@/components/Charts'
;
import
{
Pie
}
from
'@/components/Charts'
;
import
StatusTag
from
'@/components/StatusTag'
;
import
StatusTag
from
'@/components/StatusTag'
;
import
BalancePayModal
from
'@/components/BalancePayModal'
;
import
TradeRecord
,
{
RecordParams
,
RecordRes
}
from
'../TradeRecord'
;
import
TradeRecord
,
{
RecordParams
,
RecordRes
}
from
'../TradeRecord'
;
import
WxPayModal
from
'../WxPayModal'
;
import
WxPayModal
from
'../WxPayModal'
;
import
RefundModal
from
'../RefundModal'
;
import
RefundModal
from
'../RefundModal'
;
...
@@ -74,6 +78,10 @@ export interface BillDetailData {
...
@@ -74,6 +78,10 @@ export interface BillDetailData {
* 收款人角色Id
* 收款人角色Id
*/
*/
memberRoleId
:
number
memberRoleId
:
number
/**
* 最终确定还款的金额
*/
repayQuota
?:
number
};
};
export
interface
BillRecordParams
extends
RecordParams
{
export
interface
BillRecordParams
extends
RecordParams
{
...
@@ -126,6 +134,7 @@ interface IntroduceRowState {
...
@@ -126,6 +134,7 @@ interface IntroduceRowState {
wxPayUrl
:
string
;
wxPayUrl
:
string
;
wxPayPrice
:
number
;
wxPayPrice
:
number
;
balancePayVisible
:
boolean
;
};
};
class
IntroduceRow
extends
React
.
Component
<
IntroduceRowProps
,
IntroduceRowState
>
{
class
IntroduceRow
extends
React
.
Component
<
IntroduceRowProps
,
IntroduceRowState
>
{
...
@@ -148,6 +157,7 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -148,6 +157,7 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
wxPayVisible
:
false
,
wxPayVisible
:
false
,
wxPayUrl
:
''
,
wxPayUrl
:
''
,
wxPayPrice
:
0
,
wxPayPrice
:
0
,
balancePayVisible
:
false
,
};
};
}
}
...
@@ -209,24 +219,24 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -209,24 +219,24 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
handleRepaymentSubmit
=
values
=>
{
handleRepaymentSubmit
=
values
=>
{
const
{
tradeType
,
tradeChannel
}
=
values
;
const
{
tradeType
,
tradeChannel
}
=
values
;
const
{
billId
}
=
this
.
state
;
const
{
billId
,
billInfo
}
=
this
.
state
;
switch
(
tradeType
)
{
switch
(
tradeType
)
{
// 线上支付
// 线上支付
case
1
:
{
case
1
:
{
this
.
setState
({
repaymentSubmitLoading
:
true
});
switch
(
tradeChannel
)
{
PublicApi
.
postPayCreditApplyCreditRepay
({
// 微信支付
billId
,
case
PAY_CHANNEL_WECHAT
:
{
...
values
,
this
.
setState
({
repaymentSubmitLoading
:
true
});
}).
then
(
res
=>
{
PublicApi
.
postPayCreditApplyCreditRepay
({
if
(
res
.
code
!==
1000
)
{
billId
,
return
;
...
values
,
}
}).
then
(
res
=>
{
message
.
destroy
();
if
(
res
.
code
!==
1000
)
{
return
;
}
message
.
destroy
();
switch
(
tradeChannel
)
{
// 微信支付
case
PAY_CHANNEL_WECHAT
:
{
this
.
setState
({
visibleRepayment
:
false
});
this
.
setState
({
visibleRepayment
:
false
});
this
.
setState
({
this
.
setState
({
wxPayPrice
:
values
.
repayQuota
,
wxPayPrice
:
values
.
repayQuota
,
...
@@ -235,16 +245,28 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -235,16 +245,28 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
this
.
payRecordId
=
`
${
res
.
data
.
recordId
}
`
;
this
.
payRecordId
=
`
${
res
.
data
.
recordId
}
`
;
this
.
handleWxPayVisible
(
true
);
this
.
handleWxPayVisible
(
true
);
break
;
}).
finally
(()
=>
{
}
this
.
setState
({
repaymentSubmitLoading
:
false
});
});
break
;
}
// 余额支付
case
PAY_CHANNEL_BALANCE
:
{
this
.
setState
({
visibleRepayment
:
false
,
billInfo
:
{
...
billInfo
,
repayQuota
:
values
.
repayQuota
,
},
});
this
.
handleBalancePayVisible
(
true
);
break
;
}
default
:
{
default
:
{
message
.
warning
(
'暂不支持该支付渠道,请先选择其他支付渠道'
);
message
.
warning
(
'暂不支持该支付渠道,请先选择其他支付渠道'
);
}
}
}
}).
finally
(()
=>
{
}
this
.
setState
({
repaymentSubmitLoading
:
false
});
});
break
;
break
;
}
}
...
@@ -264,6 +286,29 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -264,6 +286,29 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
}
}
};
};
// 余额支付确认
handleBalancePaySubmit
=
values
=>
{
const
{
billId
,
repaymentValues
}
=
this
.
state
;
this
.
setState
({
repaymentSubmitLoading
:
true
});
PublicApi
.
postPayCreditApplyCreditRepay
({
billId
,
...
repaymentValues
,
...
values
,
}).
then
(
res
=>
{
if
(
res
.
code
!==
1000
)
{
return
;
}
setTimeout
(()
=>
{
this
.
handleBalancePayVisible
(
false
);
this
.
getBillDetail
(
this
.
state
.
billId
);
},
500
);
}).
finally
(()
=>
{
this
.
setState
({
repaymentSubmitLoading
:
false
});
});
};
// 线下支付确认
handleUploadVoucherSubmit
=
values
=>
{
handleUploadVoucherSubmit
=
values
=>
{
const
{
payProveList
=
[]
}
=
values
;
const
{
payProveList
=
[]
}
=
values
;
const
{
repaymentValues
,
billId
}
=
this
.
state
;
const
{
repaymentValues
,
billId
}
=
this
.
state
;
...
@@ -317,6 +362,10 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -317,6 +362,10 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
this
.
setState
({
wxPayVisible
:
!!
flag
});
this
.
setState
({
wxPayVisible
:
!!
flag
});
};
};
handleBalancePayVisible
=
flag
=>
{
this
.
setState
({
balancePayVisible
:
!!
flag
});
};
handleCheckResult
=
():
Promise
<
{
success
:
Boolean
}
>
=>
{
handleCheckResult
=
():
Promise
<
{
success
:
Boolean
}
>
=>
{
return
new
Promise
((
resolve
,
reject
)
=>
{
return
new
Promise
((
resolve
,
reject
)
=>
{
PublicApi
.
getPayCreditApplyGetCreditRepayResult
({
PublicApi
.
getPayCreditApplyGetCreditRepayResult
({
...
@@ -368,6 +417,7 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -368,6 +417,7 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
wxPayVisible
,
wxPayVisible
,
wxPayUrl
,
wxPayUrl
,
wxPayPrice
,
wxPayPrice
,
balancePayVisible
,
}
=
this
.
state
;
}
=
this
.
state
;
const
WxPayModalPros
=
{
const
WxPayModalPros
=
{
...
@@ -547,6 +597,16 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
...
@@ -547,6 +597,16 @@ class IntroduceRow extends React.Component<IntroduceRowProps, IntroduceRowState>
onCancel=
{
()
=>
this
.
setState
({
visibleUploadVoucher
:
false
})
}
onCancel=
{
()
=>
this
.
setState
({
visibleUploadVoucher
:
false
})
}
onSubmit=
{
this
.
handleUploadVoucherSubmit
}
onSubmit=
{
this
.
handleUploadVoucherSubmit
}
/>
/>
<
BalancePayModal
visible=
{
balancePayVisible
}
parentMemberId=
{
billInfo
?.
memberId
}
parentMemberRoleId=
{
billInfo
?.
memberRoleId
}
onCancel=
{
()
=>
this
.
handleBalancePayVisible
(
false
)
}
onSubmit=
{
this
.
handleBalancePaySubmit
}
confirmLoading=
{
repaymentSubmitLoading
}
payAmount=
{
billInfo
?.
repayQuota
}
/>
<
WxPayModal
<
WxPayModal
{
...
WxPayModalPros
}
{
...
WxPayModalPros
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment