Skip to content

J
jinfa-platform
Commit a7f236df authored by XieZhiXiong's avatar XieZhiXiong
Browse files
Options

feat: 添加退款账期/月结弹窗

parent 41ffbd00
Show whitespace changes
Inline Side-by-side
Showing with 354 additions and 103 deletions
src/constants/payment.ts
View file @ a7f236df
......@@ -15,48 +15,48 @@
/**
* 待提交审核
*/
export const CREDIT_INNER_STATUS_UNCOMMITTED = 1;
/**
export const CREDIT_INNER_STATUS_UNCOMMITTED = 1;
/**
* 提交审核失败
*/
export const CREDIT_INNER_STATUS_COMMITTED_FAILED = 2;
/**
export const CREDIT_INNER_STATUS_COMMITTED_FAILED = 2;
/**
* 提交审核成功
*/
export const CREDIT_INNER_STATUS_COMMITTED_SUCCESS = 3;
/**
export const CREDIT_INNER_STATUS_COMMITTED_SUCCESS = 3;
/**
* 一级审核失败
*/
export const CREDIT_INNER_STATUS_FAILED_1 = 4;
/**
export const CREDIT_INNER_STATUS_FAILED_1 = 4;
/**
* 一级审核通过
*/
export const CREDIT_INNER_STATUS_SUCCESS_1 = 5;
/**
export const CREDIT_INNER_STATUS_SUCCESS_1 = 5;
/**
* 二级审核失败
*/
export const CREDIT_INNER_STATUS_FAILED_2 = 6;
/**
export const CREDIT_INNER_STATUS_FAILED_2 = 6;
/**
* 二级审核通过
*/
export const CREDIT_INNER_STATUS_SUCCESS_2 = 7;
/**
export const CREDIT_INNER_STATUS_SUCCESS_2 = 7;
/**
* 三级审核失败
*/
export const CREDIT_INNER_STATUS_FAILED_3 = 8;
/**
export const CREDIT_INNER_STATUS_FAILED_3 = 8;
/**
* 三级审核通过
*/
export const CREDIT_INNER_STATUS_SUCCESS_3 = 9;
/**
export const CREDIT_INNER_STATUS_SUCCESS_3 = 9;
/**
* 审核不通过
*/
export const CREDIT_INNER_STATUS_FAILED = 10;
/**
export const CREDIT_INNER_STATUS_FAILED = 10;
/**
* 审核通过
*/
export const CREDIT_INNER_STATUS_CONFIRM_SUCCESS = 11;
export const CREDIT_INNER_STATUS = {
export const CREDIT_INNER_STATUS_CONFIRM_SUCCESS = 11;
export const CREDIT_INNER_STATUS = {
[CREDIT_INNER_STATUS_UNCOMMITTED]: '待提交审核',
[CREDIT_INNER_STATUS_COMMITTED_FAILED]: '提交审核失败',
[CREDIT_INNER_STATUS_COMMITTED_SUCCESS]: '提交审核成功',
......@@ -68,52 +68,52 @@
[CREDIT_INNER_STATUS_SUCCESS_3]: '三级审核通过',
[CREDIT_INNER_STATUS_FAILED]: '审核不通过',
[CREDIT_INNER_STATUS_CONFIRM_SUCCESS]: '审核通过',
};
};
// 授信内部状态（下级）
// 授信内部状态（下级）
/**
/**
* 待提交
*/
export const CREDIT_INNER_STATUS_UNCOMMITTED_PURCHASER = 1;
/**
export const CREDIT_INNER_STATUS_UNCOMMITTED_PURCHASER = 1;
/**
* 已提交
*/
export const CREDIT_INNER_STATUS_COMMITTED_PURCHASER = 2;
export const CREDIT_INNER_STATUS_PURCHASER = {
export const CREDIT_INNER_STATUS_COMMITTED_PURCHASER = 2;
export const CREDIT_INNER_STATUS_PURCHASER = {
[CREDIT_INNER_STATUS_UNCOMMITTED_PURCHASER]: '待提交',
[CREDIT_INNER_STATUS_COMMITTED_PURCHASER]: '已提交',
};
};
// 授信外部状态
// 授信外部状态
/**
/**
* 待提交
*/
export const CREDIT_OUTER_STATUS_UNCOMMITTED = 1;
/**
export const CREDIT_OUTER_STATUS_UNCOMMITTED = 1;
/**
* 待确认
*/
export const CREDIT_OUTER_STATUS_UNCONFIRMED = 2;
/**
export const CREDIT_OUTER_STATUS_UNCONFIRMED = 2;
/**
* 接受申请
*/
export const CREDIT_OUTER_STATUS_SUCCESS = 3;
/**
export const CREDIT_OUTER_STATUS_SUCCESS = 3;
/**
* 不接受申请
*/
export const CREDIT_OUTER_STATUS_FAILED = 4;
export const CREDIT_OUTER_STATUS = {
export const CREDIT_OUTER_STATUS_FAILED = 4;
export const CREDIT_OUTER_STATUS = {
[CREDIT_OUTER_STATUS_UNCOMMITTED]: '待提交',
[CREDIT_OUTER_STATUS_UNCONFIRMED]: '待确认',
[CREDIT_OUTER_STATUS_SUCCESS]: '接受申请',
[CREDIT_OUTER_STATUS_FAILED]: '不接受申请',
};
};
// 授信还款状态
// 授信还款状态
/**
* 账单待还
......@@ -144,28 +144,28 @@ export const CREDIT_REPAYMENT_STATUS = {
/**
* 未申请
*/
export const CREDIT_STATUS_NOT_APPLIED = 1;
/**
export const CREDIT_STATUS_NOT_APPLIED = 1;
/**
* 申请中
*/
export const CREDIT_STATUS_APPLYING = 2;
/**
export const CREDIT_STATUS_APPLYING = 2;
/**
* 正常
*/
export const CREDIT_STATUS_NORMAL = 3;
/**
export const CREDIT_STATUS_NORMAL = 3;
/**
* 已冻结
*/
export const CREDIT_STATUS_FROZEN = 4;
export const CREDIT_STATUS = {
export const CREDIT_STATUS_FROZEN = 4;
export const CREDIT_STATUS = {
[CREDIT_STATUS_NOT_APPLIED]: '未申请',
[CREDIT_STATUS_APPLYING]: '申请中',
[CREDIT_STATUS_NORMAL]: '正常',
[CREDIT_STATUS_FROZEN]: '已冻结',
};
};
// 账单交易项目
// 账单交易项目
/**
* 订单支付
......@@ -189,50 +189,49 @@ export const BILL_TRADE_OPERATION = {
// 支付渠道
/**
* 积分支付
* 无需支付
*/
export const PAY_CHANNEL_INTEGRAL = 0;
/**
export const PAY_CHANNEL_FREE = 0;
/**
* 支付宝
*/
export const PAY_CHANNEL_ALI = 1;
/**
export const PAY_CHANNEL_ALI = 1;
/**
* 微信
*/
export const PAY_CHANNEL_WECHAT = 2;
/**
export const PAY_CHANNEL_WECHAT = 2;
/**
* 银联
*/
export const PAY_CHANNEL_UNION = 3;
/**
export const PAY_CHANNEL_UNION = 3;
/**
* 余额
*/
export const PAY_CHANNEL_BALANCE = 4;
/**
export const PAY_CHANNEL_BALANCE = 4;
/**
* 线下支付线上确认
*/
export const PAY_CHANNEL_OFFLINE = 5;
/**
export const PAY_CHANNEL_OFFLINE = 5;
/**
* 授信
*/
export const PAY_CHANNEL_CREDIT = 6;
/**
export const PAY_CHANNEL_CREDIT = 6;
/**
* 货到付款
*/
export const PAY_CHANNEL_COD = 7;
/**
* 支付渠道对应中文
*/
export const PAY_CHANNEL = {
[PAY_CHANNEL_INTEGRAL]: '积分支付',
[PAY_CHANNEL_ALI]: '支付宝',
[PAY_CHANNEL_WECHAT]: '微信',
[PAY_CHANNEL_UNION]: '银联',
[PAY_CHANNEL_BALANCE]: '余额',
[PAY_CHANNEL_OFFLINE]: '线下支付线上确认',
[PAY_CHANNEL_CREDIT]: '授信',
[PAY_CHANNEL_COD]: '货到付款',
};
export const PAY_CHANNEL_COD = 7;
/**
* 月结
*/
export const PAY_CHANNEL_MONTHLY_STATEMENT = 8;
/**
* 账期
*/
export const PAY_CHANNEL_PAYMENT_DAYS = 9;
/**
* 积分支付
*/
export const PAY_CHANNEL_INTEGRAL = 10;
......@@ -241,35 +240,35 @@ export const BILL_TRADE_OPERATION = {
/**
* 线上支付
*/
export const PAY_WAY_ONLINE = 1;
/**
export const PAY_WAY_ONLINE = 1;
/**
* 线下支付
*/
export const PAY_WAY_OFFLINE = 2;
/**
export const PAY_WAY_OFFLINE = 2;
/**
* 授信支付
*/
export const PAY_WAY_CREDIT = 3;
/**
export const PAY_WAY_CREDIT = 3;
/**
* 货到付款
*/
export const PAY_WAY_COD = 4;
/**
export const PAY_WAY_COD = 4;
/**
* 账期
*/
export const PAY_WAY_DEADLINE = 5;
/**
export const PAY_WAY_DEADLINE = 5;
/**
* 月结
*/
export const PAY_WAY_MONTH = 6;
/**
* 合同内清算
*/
export const PAY_WAY_CONTRACT = 7;
export const PAY_WAY_MONTH = 6;
/**
* 合同内清算
*/
export const PAY_WAY_CONTRACT = 7;
/**
* 支付方式对应中文
*/
/**
* 支付方式对应中文
*/
export const PAYWAY = {
[PAY_WAY_ONLINE]: '线上支付',
[PAY_WAY_OFFLINE]: '线下支付',
......
src/locales/ko-KR/afterService/components.ts
View file @ a7f236df
......@@ -161,6 +161,11 @@ export default {
'afterService.components.UploadPaymentVoucher.bankDeposit': '계좌 개설 은행',
'afterService.components.UploadPaymentVoucher.fileList': '환불 증명서 업로드',
'afterService.components.UploadPaymentVoucher.fileList.required': '환불 증명서를 올려주세요.',
'afterService.components.MonthlyStatement.title': '월 정산 지급 환불 확인',
'afterService.components.MonthlyStatement.payChannel': '지불 경로',
'afterService.components.MonthlyStatement.tip': '지불방식은 월결산 주문으로, 사용자가 환불방식과 환불금액을 확인한후 시스템은 지불절차에 따라 환불작업이 완성된다. 실제 자금의 환불은 거래 쌍방이 결산절차를 통해 처리한다.',
'afterService.components.PaymentDays.title': '정기 지급 환불 확인',
'afterService.components.PaymentDays.tip': '지불방식은 계정기간의 주문으로, 사용자가 환불방식과 환불금액을 확인한후 시스템은 지불절차에 따라 환불동작을 완성한다. 실제 자금의 환불은 거래 쌍방이 결산과정을 통해 처리한다.',
'afterService.components.RepairAddressInfo.title': '수리 주소',
......
src/locales/zh-CN/afterService/components.ts
View file @ a7f236df
......@@ -161,6 +161,11 @@ export default {
'afterService.components.UploadPaymentVoucher.bankDeposit': '开户行',
'afterService.components.UploadPaymentVoucher.fileList': '上传退款凭证',
'afterService.components.UploadPaymentVoucher.fileList.required': '请上传退款凭证',
'afterService.components.MonthlyStatement.title': '月结支付退款确认',
'afterService.components.MonthlyStatement.payChannel': '支付渠道',
'afterService.components.MonthlyStatement.tip': '支付方式为月结的订单，用户确认退款方式与退款金额后，系统会按照支付流程来完成退款动作，实际资金的退款由交易双方通过结算流程处理。',
'afterService.components.PaymentDays.title': '账期支付退款确认',
'afterService.components.PaymentDays.tip': '支付方式为账期的订单，用户确认退款方式与退款金额后，系统会按照支付流程来完成退款动作，实际资金的退款由交易双方通过结算流程处理。',
'afterService.components.RepairAddressInfo.title': '维修地址',
......
src/pages/afterService/components/RefundModal/COD/index.less
View file @ a7f236df
......@@ -19,7 +19,8 @@
.tip {
padding: @padding-xss @padding-xs;
color: @primary-color;
background-color: color(~`colorPalette('@{primary-color}', 0.04) `);
color: @text-color-secondary;
background-color: @background-color-light;
border-radius: 4px;
}
}
\ No newline at end of file
src/pages/afterService/components/RefundModal/MonthlyStatement/index.less 0 → 100644
View file @ a7f236df
@import '~antd/es/style/themes/default.less';
.monthly-statement {
:global {
.ant-descriptions-item-container {
align-items: center;
}
}
.amount {
font-size: @font-size-lg;
font-weight: 500;
&-plus {
color: @error-color;
font-size: 24px;
}
}
.tip {
padding: @padding-xss @padding-xs;
color: @text-color-secondary;
background-color: @background-color-light;
border-radius: 4px;
}
}
\ No newline at end of file
src/pages/afterService/components/RefundModal/MonthlyStatement/index.tsx 0 → 100644
View file @ a7f236df
import React from 'react';
import { useIntl } from 'umi';
import { Descriptions, Divider } from 'antd';
import { priceFormat } from '@/utils/numberFomat';
import styles from './index.less';
interface MonthlyStatementProps {
/**
* 弹窗需要的数据值
*/
value: {
/**
* 退款金额
*/
refundAmount: number,
/**
* 支付方式
*/
payWay: string,
/**
* 支付渠道
*/
payChannel: string,
};
};
const MonthlyStatement: React.FC<MonthlyStatementProps> = ({
value,
}) => {
const intl = useIntl();
return (
<div className={styles['monthly-statement']}>
<Descriptions column={1}>
<Descriptions.Item label={`${intl.formatMessage({ id: 'afterService.components.RefundModal.refundAmount' }, { default: '当前退款金额' })}(${intl.formatMessage({ id: 'common.money.yuan' }, { default: '元' })})`}>
<span className={styles['amount-plus']}>{`${intl.formatMessage({ id: 'common.money' }, { default: '￥' })}${priceFormat(value.refundAmount)}`}</span>
</Descriptions.Item>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.COD.payType' }, { default: '支付方式' })}
style={{
paddingBottom: 0,
}}
>
{value.payWay}
</Descriptions.Item>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.MonthlyStatement.payChannel' }, { default: '支付渠道' })}
style={{
paddingBottom: 0,
}}
>
{value.payChannel}
</Descriptions.Item>
</Descriptions>
<Divider dashed />
<p className={styles.tip}>
{intl.formatMessage({ id: 'afterService.components.MonthlyStatement.tip' }, { default: '支付方式为月结的订单，用户确认退款方式与退款金额后，系统会按照支付流程来完成退款动作，实际资金的退款由交易双方通过结算流程处理。' })}
</p>
</div>
)
};
export default MonthlyStatement;
\ No newline at end of file
src/pages/afterService/components/RefundModal/PaymentDays/index.less 0 → 100644
View file @ a7f236df
@import '~antd/es/style/themes/default.less';
.payment-days {
:global {
.ant-descriptions-item-container {
align-items: center;
}
}
.amount {
font-size: @font-size-lg;
font-weight: 500;
&-plus {
color: @error-color;
font-size: 24px;
}
}
.tip {
padding: @padding-xss @padding-xs;
color: @text-color-secondary;
background-color: @background-color-light;
border-radius: 4px;
}
}
\ No newline at end of file
src/pages/afterService/components/RefundModal/PaymentDays/index.tsx 0 → 100644
View file @ a7f236df
import React from 'react';
import { useIntl } from 'umi';
import { Descriptions, Divider } from 'antd';
import { priceFormat } from '@/utils/numberFomat';
import styles from './index.less';
interface MonthlyStatementProps {
/**
* 弹窗需要的数据值
*/
value: {
/**
* 退款金额
*/
refundAmount: number,
/**
* 支付方式
*/
payWay: string,
/**
* 支付渠道
*/
payChannel: string,
};
};
const MonthlyStatement: React.FC<MonthlyStatementProps> = ({
value,
}) => {
const intl = useIntl();
return (
<div className={styles['payment-days']}>
<Descriptions column={1}>
<Descriptions.Item label={`${intl.formatMessage({ id: 'afterService.components.RefundModal.refundAmount' }, { default: '当前退款金额' })}(${intl.formatMessage({ id: 'common.money.yuan' }, { default: '元' })})`}>
<span className={styles['amount-plus']}>{`${intl.formatMessage({ id: 'common.money' }, { default: '￥' })}${priceFormat(value.refundAmount)}`}</span>
</Descriptions.Item>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.COD.payType' }, { default: '支付方式' })}
style={{
paddingBottom: 0,
}}
>
{value.payWay}
</Descriptions.Item>
<Descriptions.Item
label={intl.formatMessage({ id: 'afterService.components.MonthlyStatement.payChannel' }, { default: '支付渠道' })}
style={{
paddingBottom: 0,
}}
>
{value.payChannel}
</Descriptions.Item>
</Descriptions>
<Divider dashed />
<p className={styles.tip}>
{intl.formatMessage({ id: 'afterService.components.PaymentDays.tip' }, { default: '支付方式为账期的订单，用户确认退款方式与退款金额后，系统会按照支付流程来完成退款动作，实际资金的退款由交易双方通过结算流程处理。' })}
</p>
</div>
)
};
export default MonthlyStatement;
\ No newline at end of file
src/pages/afterService/components/RefundModal/index.tsx
View file @ a7f236df
......@@ -5,6 +5,8 @@ import { useIntl } from 'umi';
const Balance = React.lazy(() => import('./Balance'));
const Credit = React.lazy(() => import('./Credit'));
const COD = React.lazy(() => import('./COD'));
const MonthlyStatement = React.lazy(() => import('./MonthlyStatement'));
const PaymentDays = React.lazy(() => import('./PaymentDays'));
export interface RefundModalProps {
/**
......@@ -91,6 +93,28 @@ const RefundModal: React.FC<RefundModalProps> = ({
</Suspense>
),
},
monthlyStatement: {
width: 600,
title: intl.formatMessage({ id: 'afterService.components.MonthlyStatement.title' }, { default: '月结支付退款确认' }),
render: () => (
<Suspense fallback={null}>
<MonthlyStatement
value={rest as any}
/>
</Suspense>
),
},
paymentDays: {
width: 600,
title: intl.formatMessage({ id: 'afterService.components.PaymentDays.title' }, { default: '账期支付退款确认' }),
render: () => (
<Suspense fallback={null}>
<PaymentDays
value={rest as any}
/>
</Suspense>
),
},
};
const template = tempMap[modalName] || {
......
src/pages/afterService/components/ReturnDetailInfo/index.tsx
View file @ a7f236df
......@@ -20,6 +20,8 @@ import {
PAY_CHANNEL_BALANCE,
PAY_CHANNEL_CREDIT,
PAY_CHANNEL_COD,
PAY_CHANNEL_MONTHLY_STATEMENT,
PAY_CHANNEL_PAYMENT_DAYS,
} from '@/constants/payment';
import {
RETURN_OUTER_STATUS_TO_BE_REFUNDED,
......@@ -67,6 +69,14 @@ type RefundModalValueType = {
* 供应会员角色id
*/
supplierRoleId?: number,
/**
* 支付方式
*/
payWay?: string,
/**
* 支付渠道
*/
payChannel?: string,
}
interface ReturnDetailInfoProps extends MellowCardProps {
......@@ -216,7 +226,15 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
},
];
const handleRefund = (id, channel, amount) => {
/**
* 打开确认退款弹窗
* @param id 退款id
* @param channel 支付渠道
* @param amount 退款金额
* @param payWayName 支付方式名称
* @param channelName 支付渠道名称
*/
const handleRefund = (id, channel, amount, payWayName, channelName) => {
switch(channel) {
// 余额支付
case PAY_CHANNEL_BALANCE: {
......@@ -261,6 +279,20 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
setRefundModalValue({ id, refundAmount: amount });
break;
};
// 月结
case PAY_CHANNEL_MONTHLY_STATEMENT: {
setModalName('monthlyStatement');
setRefundModalVisible(true);
setRefundModalValue({ id, refundAmount: amount, payWay: payWayName, payChannel: channelName });
break;
};
// 账期
case PAY_CHANNEL_PAYMENT_DAYS: {
setModalName('paymentDays');
setRefundModalVisible(true);
setRefundModalValue({ id, refundAmount: amount, payWay: payWayName, payChannel: channelName });
break;
};
default: {
if (onRefund) {
confirm({
......@@ -385,7 +417,7 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
) && (
<div
className={styles['deliver-item-return']}
onClick={() => handleRefund(item.refundId, item.channel, item.refundAmount)}
onClick={() => handleRefund(item.refundId, item.channel, item.refundAmount, item.payWayName, item.channelName)}
>
{intl.formatMessage({ id: 'afterService.components.ReturnDetailInfo.refund' }, { default: '退款' })}
</div>
......
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