Commit 6612812b authored by 前端-钟卫鹏's avatar 前端-钟卫鹏

fix: 资金账户-充值-提现

parent 0914afdb
......@@ -60,8 +60,8 @@ const AccountLists: React.FC<{}> = () => {
},
{
title: '账户余额',
dataIndex: 'accountStatus',
key: 'accountStatus',
dataIndex: 'accountBalance',
key: 'accountBalance',
render: text => `¥${text}`
},
{
......@@ -74,7 +74,7 @@ const AccountLists: React.FC<{}> = () => {
title: '可用余额',
dataIndex: 'usableBalance',
key: 'usableBalance',
render: (t, r) => `¥${r.accountStatus - r.lockBalance}`
render: (t, r) => `¥${r.accountBalance - r.lockBalance}`
},
{
title: '会员状态',
......
......@@ -91,8 +91,8 @@ const AccountDetail: React.FC<{}> = () => {
},
{
title: '操作角色',
dataIndex: 'parentMemberRoleName',
key: 'parentMemberRoleName',
dataIndex: ['memberAssetAccount','parentMemberRoleName'],
key: 'id',
},
{
title: '状态',
......
import React, { useState, useEffect, useRef, ReactNode } from 'react'
import { history } from 'umi'
import { Card, Space, Row, Col, Button, Table } from 'antd'
import { Card, Space, Row, Col, Button, Table, Modal } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import ReutrnEle from '@/components/ReturnEle'
import styles from './index.less'
......@@ -11,16 +11,19 @@ import { ColumnType } from 'antd/lib/table/interface'
import ModalForm from '@/components/ModalForm'
import { createFormActions } from '@formily/antd'
import { rechargeSchema } from './schema'
import { memberStatusMap, moveStatusMap, statusMap } from '../../constant'
import { memberStatusMap, moveStatusMap, operationMap, statusMap } from '../../constant'
import { PublicApi } from '@/services/api'
import { StandardTable } from 'god'
const schemaActions = createFormActions()
const AccountDetail: React.FC<{}> = () => {
const modalRef = useRef<any>()
const refTrade = useRef<any>({})
const refMove = useRef<any>({})
const [ details, setDetails ] = useState<any>({ accountBalance: 0, lockBalance: 0})
const [dealRecord, setDealRecord] = useState<any>([])
const [moveRecord, setMoveRecord] = useState<any>([])
const [pageId, setPageId] = useState<any>()
const [isBtnLoading, setIsBtnLoading] = useState<boolean>(false)
useEffect(() => {
getAccountInfo()
......@@ -28,15 +31,30 @@ const AccountDetail: React.FC<{}> = () => {
const getAccountInfo = async () => {
const { id } = history.location.query
setPageId(id)
let res = await PublicApi.getPayAssetAccountGetAssetAccount({id})
const { code, data } = res
setDetails(data)
if(code === 1000){
let tradeRecord = await PublicApi.getPayAssetAccountGetAccountTradeRecord({memberAssetAccountId: data.id + ''})
let statusRecord = await PublicApi.getPayAssetAccountGetAccountStatusRecord({memberAssetAccountId: data.id + ''})
setDealRecord(tradeRecord.data)
setMoveRecord(statusRecord.data)
}
}
// 获取交易记录
const fetchTradeData = (params) => {
return new Promise((resolve, reject) => {
PublicApi.getPayAssetAccountGetAccountTradeRecord({memberAssetAccountId: history.location.query.id + '', ...params}).then(res => {
const { data } = res
resolve(data)
})
})
}
// 获取流转记录
const fetchMoveData = (params) => {
return new Promise((resolve, reject) => {
PublicApi.getPayAssetAccountGetAccountStatusRecord({memberAssetAccountId: history.location.query.id + ''}).then(res => {
const { data } = res
resolve(data)
})
})
}
const columns: ColumnType<any>[] = [
......@@ -60,6 +78,7 @@ const AccountDetail: React.FC<{}> = () => {
title: '交易项目',
dataIndex: 'operation',
key: 'operation',
render: (t, r) => operationMap[t]
},
{
title: '交易金额(元)',
......@@ -119,6 +138,7 @@ const AccountDetail: React.FC<{}> = () => {
];
const handleConfirm = () => {
setIsBtnLoading(true)
schemaActions.submit()
}
......@@ -127,7 +147,21 @@ const AccountDetail: React.FC<{}> = () => {
}
const handleSubmit = (value) => {
console.log(value)
// 提交重置
let parasm = {
memberAssetAccountId: pageId,
money: Number(value.money),
type: value['type'][0]
}
PublicApi.postPayAssetAccountRecharge(parasm).then(res => {
if(res.code === 1000){
getAccountInfo()
refTrade.current.reload()
refMove.current.reload()
}
modalRef.current.setVisible(false)
setIsBtnLoading(false)
})
}
const handleRecharge = () => {
......@@ -149,7 +183,7 @@ const AccountDetail: React.FC<{}> = () => {
<div className={styles.statistic}>
<div className={styles['statistic-title']}>可用余额(元):</div>
<div className={styles['statistic-amount']}>
{`${details.accountBalance - details.lockBalance}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
{`${(details.accountBalance*100 - details.lockBalance*100)/100}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
</div>
</div>
<div className={styles['repayment-end']}>
......@@ -212,12 +246,23 @@ const AccountDetail: React.FC<{}> = () => {
</Space>
<Space direction="vertical" style={{width:'100%'}}>
<Card headStyle={{borderBottom:'none'}} title="交易记录">
<Table dataSource={dealRecord} columns={columns} />
<StandardTable
columns={columns}
currentRef={refTrade}
fetchTableData={(params: any) => fetchTradeData(params)}
/>
</Card>
</Space>
<Space direction="vertical" style={{width:'100%'}}>
<Card headStyle={{borderBottom:'none'}} title="流转记录">
<Table dataSource={moveRecord} columns={moveColumns} />
<StandardTable
columns={moveColumns}
currentRef={refMove}
fetchTableData={(params: any) => fetchMoveData(params)}
tableProps={{
pagination: false
}}
/>
</Card>
</Space>
<ModalForm
......@@ -228,6 +273,11 @@ const AccountDetail: React.FC<{}> = () => {
confirm={handleConfirm}
onSubmit={handleSubmit}
cancel={handleCannel}
modalProps={{
okText: "确定充值",
confirmLoading: isBtnLoading,
destroyOnClose: true
}}
// effects={($, {setFieldState}) => {
// $('onFieldInputChange', 'money').subscribe(parentState => {
// console.log(parentState.value)
......
import React, { useState, useEffect, useRef, ReactNode } from 'react'
import { history } from 'umi'
import { Card, Space, Steps, Row, Col, Button, InputNumber, Table } from 'antd'
import { Card, Space, Steps, Row, Col, Button, InputNumber, Table, message } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import ReutrnEle from '@/components/ReturnEle'
import styles from './index.less'
......@@ -8,15 +8,19 @@ import StatusTag from '@/components/StatusTag'
import cx from 'classnames'
import moment from 'moment'
import { ColumnType } from 'antd/lib/table/interface'
import { memberStatusMap, statusMap } from '../../constant'
import { memberStatusMap, operationMap, statusMap } from '../../constant'
import { PublicApi } from '@/services/api'
import { GetSettleAccountsCorporateAccountConfigResponse } from '@/services/SettleApi'
import { StandardTable } from 'god'
const { Step } = Steps;
const AccountDetail: React.FC<{}> = () => {
const refTrade = useRef<any>({})
const [ details, setDetails ] = useState<any>({ accountBalance: 0, lockBalance: 0})
const [dealRecord, setDealRecord] = useState<any>()
const [withdrawAmount, setWidthdrawAmount] = useState<number>(0)
const [withdrawAmount, setWidthdrawAmount] = useState<any>(0)
const [bankDetail, setBankDetail] = useState<GetSettleAccountsCorporateAccountConfigResponse>()
const [btnLoading, setBtnLoading] = useState<boolean>(false)
useEffect(() => {
getAccountInfo()
......@@ -28,11 +32,20 @@ const AccountDetail: React.FC<{}> = () => {
const { code, data } = res
setDetails(data)
if(code === 1000){
let tradeRecord = await PublicApi.getPayAssetAccountGetAccountTradeRecord({memberAssetAccountId: data.id + ''})
setDealRecord(tradeRecord.data)
let bankRes = await PublicApi.getSettleAccountsCorporateAccountConfig({memberId: data.memberId})
setBankDetail(bankRes.data)
}
}
const fetchTradeData = (params) => {
return new Promise((resolve, reject) => {
PublicApi.getPayAssetAccountGetAccountTradeRecord({memberAssetAccountId: history.location.query.id + '', ...params}).then(res => {
const { data } = res
resolve(data)
})
})
}
const columns: ColumnType<any>[] = [
{
title: '交易流水号',
......@@ -54,6 +67,7 @@ const AccountDetail: React.FC<{}> = () => {
title: '交易项目',
dataIndex: 'operation',
key: 'operation',
render: (t, r) => operationMap[t]
},
{
title: '交易金额(元)',
......@@ -74,7 +88,32 @@ const AccountDetail: React.FC<{}> = () => {
];
const handleAllCharge = () => {
setWidthdrawAmount(details.accountBalance - details.lockBalance)
let amount = (details.accountBalance*100 - details.lockBalance*100)/100
setWidthdrawAmount(amount)
}
// 提交提现申请
const handleSubmitApply = () => {
setBtnLoading(true)
let amount = (details.accountBalance*100 - details.lockBalance*100)/100
if(withdrawAmount > 0 && withdrawAmount <= amount){ // 大于0并且小于可用金额
let params = {
memberAssetAccountId: details.id,
money: withdrawAmount,
bankAccountName: bankDetail.name,
bankAccount: bankDetail.bankAccount,
bankName: bankDetail.bankDeposit
}
PublicApi.postPayAssetAccountCashOut(params).then(res => {
setBtnLoading(false)
getAccountInfo()
setWidthdrawAmount(0)
refTrade.current.reload()
})
}else{
setBtnLoading(false)
message.error('请正确输入提现金额!')
}
}
return (
......@@ -108,8 +147,11 @@ const AccountDetail: React.FC<{}> = () => {
formatter={value => `${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
parser={value => value.replace(/\$\s?|(,*)/g, '')}
className={styles['statistic-input']}
onChange={value => setWidthdrawAmount(value)}
precision={2}
min={0}
/>
<Button
<Button
type="text"
size="small"
style={{marginLeft:24, color:'#fff'}}
......@@ -121,12 +163,12 @@ const AccountDetail: React.FC<{}> = () => {
</div>
<div className={styles['repayment-end']}>
<span className={styles['repayment-time']}>
最多可以提现:¥ {details.accountBalance - details.lockBalance}
最多可以提现:¥ {(details.accountBalance*100 - details.lockBalance*100)/100}
</span>
</div>
</div>
<div className={styles['repayment-right']}>
<Button ghost>提交</Button>
<Button ghost onClick={handleSubmitApply} loading={btnLoading}>提交</Button>
</div>
</div>
</Col>
......@@ -137,7 +179,7 @@ const AccountDetail: React.FC<{}> = () => {
<p className={styles.rightTitle}>账户归属:</p>
</Col>
<Col span={20}>
<p className={styles.rightInfo}>{details?.parentMemberName}</p>
<p className={styles.rightInfo}>{bankDetail?.name}</p>
</Col>
</Row>
<Row>
......@@ -145,7 +187,7 @@ const AccountDetail: React.FC<{}> = () => {
<p className={styles.rightTitle}>银行账号:</p>
</Col>
<Col span={20}>
<p className={styles.rightInfo}>6214 7812 3456 7891 1234</p>
<p className={styles.rightInfo}>{bankDetail?.bankAccount}</p>
</Col>
</Row>
<Row>
......@@ -153,7 +195,7 @@ const AccountDetail: React.FC<{}> = () => {
<p className={styles.rightTitle}>开户行:</p>
</Col>
<Col span={20}>
<p className={styles.rightInfo}>中国建设银行广州市分行营业部</p>
<p className={styles.rightInfo}>{bankDetail?.bankDeposit}</p>
</Col>
</Row>
</div>
......@@ -170,7 +212,7 @@ const AccountDetail: React.FC<{}> = () => {
<div className={styles.statistic}>
<div className={styles['statistic-title']}>可用余额(元):</div>
<div className={styles['statistic-amount']}>
{`${details.accountBalance - details.lockBalance}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
{`${(details.accountBalance*100 - details.lockBalance*100)/100}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
</div>
</div>
<div className={styles['repayment-end']}>
......@@ -225,7 +267,11 @@ const AccountDetail: React.FC<{}> = () => {
</Space>
<Space direction="vertical" style={{width:'100%'}}>
<Card headStyle={{borderBottom:'none'}} title="提现处理记录">
<Table dataSource={dealRecord} columns={columns} />
<StandardTable
columns={columns}
currentRef={refTrade}
fetchTableData={(params: any) => fetchTradeData(params)}
/>
</Card>
</Space>
</PageHeaderWrapper>
......
import React, { useState, useEffect, useRef } from 'react'
import { Card, Space, Button, } from 'antd'
import { Card } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { StandardTable } from 'god'
import { ColumnType } from 'antd/lib/table/interface'
......@@ -9,7 +9,6 @@ import { createFormActions, FormEffectHooks } from '@formily/antd'
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch'
import { searchSchema } from './schema'
import { FORM_FILTER_PATH } from '@/formSchema/const'
import { PlusOutlined } from '@ant-design/icons'
import EyePreview from '@/components/EyePreview'
import { DatePicker } from '@formily/antd-components'
import StatusTag from '@/components/StatusTag'
......@@ -69,8 +68,8 @@ const AccountLists: React.FC<{}> = () => {
},
{
title: '账户余额',
dataIndex: 'accountStatus',
key: 'accountStatus',
dataIndex: 'accountBalance',
key: 'accountBalance',
render: text => `¥${text}`
},
{
......@@ -83,7 +82,7 @@ const AccountLists: React.FC<{}> = () => {
title: '可用余额',
dataIndex: 'usableBalance',
key: 'usableBalance',
render: (t, r) => `¥${r.accountStatus - r.lockBalance}`
render: (t, r) => `¥${(r.accountBalance*100 - r.lockBalance*100)/100}`
},
]
......
......@@ -121,6 +121,16 @@ export const rechargeSchema: ISchema = {
required: true,
message: '请输入充值金额'
},
{
validator: value => {
return isNaN(value)
},
message:'请正确输入数字金额'
},
{
pattern: /^\d+(\.\d{1,2})?$/,
message: '充值金额仅限两位小数',
},
]
},
......@@ -129,8 +139,6 @@ export const rechargeSchema: ISchema = {
"x-component": 'CardCheckBox',
"x-component-props": {
dataSource: [
// {id: 1, name: '支付宝', logo: 'https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/66bf577211624304947938a2afde771b1603682420367.png'},
// {id: 2, name: '微信', logo: 'https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/733815c243ce4cec8a8cb10e0e92876f1603682449715.png'}
{id: 1, name: '支付宝', logoUrl: alipay},
{id: 2, name: '微信', logoUrl: wxpay}
],
......
......@@ -62,6 +62,7 @@ export const MEMBER_STATUS_BADGE_MAP = {
* 资金账户相关常量
*/
// 交易记录状态
export const statusMap = {
'1': { title: '申请提现', type: 'warnning' },
'2': { title: '审核通过', type: 'success' },
......@@ -71,23 +72,36 @@ export const MEMBER_STATUS_BADGE_MAP = {
'6': { title: '确认到账', type: 'success' },
}
// 流转状态
export const moveStatusMap = {
'1': { title: '冻结', type: 'danger' },
'2': { title: '解冻', type: 'success' },
}
// 会员状态
export const memberStatusMap = {
'1': { title: '正常', type: 'success' },
'2': { title: '已冻结', type: 'danger' },
}
// 账户状态
export const accountStatusMap = {
'1': { title: '正常', className: 'commonStatusValid' },
'2': { title: '已冻结', className: 'commonStatusNoPass' },
}
// 会员等级类型
export const memberLevelTypeMap = {
'1': '平台会员',
'2': '商户会员',
'3': '渠道会员',
}
// 操作项目
export const operationMap = {
'1': '账户充值',
'2': '账户提现',
'3': '订单支付',
'4': '订单退款',
'5': '订单返利'
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment