Commit 592c7f64 authored by XieZhiXiong's avatar XieZhiXiong

开发中

parent 3e2d8bc1
......@@ -8,7 +8,7 @@
&-title {
line-height: 24px;
padding-bottom: 0;
// padding-bottom: 0;
font-size: 14px;
font-weight: 500;
color: rgba(23, 43, 77, 1);
......
......@@ -850,4 +850,38 @@ export const InquiryStateTexts = {
2: '待确认',
3: '接受报价',
4: '不接受报价',
}
\ No newline at end of file
}
// 授信状态
export const CREDIT_STATUS_NOT_APPLIED = 1; // 未申请
export const CREDIT_STATUS_APPLYING = 2; // 申请中
export const CREDIT_STATUS_NORMAL = 3; // 正常
export const CREDIT_STATUS_FROZEN = 4; // 已冻结
export const CREDIT_STATUS = {
[CREDIT_STATUS_NOT_APPLIED]: '未申请',
[CREDIT_STATUS_APPLYING]: '申请中',
[CREDIT_STATUS_NORMAL]: '正常',
[CREDIT_STATUS_FROZEN]: '已冻结',
};
// 授信还款状态
export const CREDIT_REPAYMENT_STATUS_OUTSTANDING = 1; // 账单待还
export const CREDIT_REPAYMENT_STATUS_UNCONFIRMED = 2; // 待确认还款结果
export const CREDIT_REPAYMENT_STATUS_PAID = 3; // 账单已还
export const CREDIT_REPAYMENT_STATUS_OVERDUE = 4; // 逾期
export const CREDIT_REPAYMENT_STATUS = {
[CREDIT_REPAYMENT_STATUS_OUTSTANDING]: '账单待还',
[CREDIT_REPAYMENT_STATUS_UNCONFIRMED]: '待确认还款结果',
[CREDIT_REPAYMENT_STATUS_PAID]: '账单已还',
[CREDIT_REPAYMENT_STATUS_OVERDUE]: '逾期',
};
// 账单交易项目
export const BILL_TRADE_OPERATION_ORDER_PAY = 1; // 订单支付
export const BILL_TRADE_OPERATION_ORDER_RETURN= 2; // 订单退款
export const BILL_TRADE_OPERATION_REPAYMENT= 3; // 还款
export const BILL_TRADE_OPERATION = {
[BILL_TRADE_OPERATION_ORDER_PAY]: '订单支付',
[BILL_TRADE_OPERATION_ORDER_RETURN]: '订单退款',
[BILL_TRADE_OPERATION_REPAYMENT]: '还款',
};
\ No newline at end of file
/*
* @Author: XieZhiXiong
* @Date: 2020-10-15 15:41:51
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-10-15 15:44:52
* @Description:
*/
import {
MEMBER_STATUS_NORMAL,
MEMBER_STATUS_FROZEN,
CREDIT_REPAYMENT_STATUS_OUTSTANDING,
CREDIT_REPAYMENT_STATUS_UNCONFIRMED,
CREDIT_REPAYMENT_STATUS_PAID,
CREDIT_REPAYMENT_STATUS_OVERDUE,
} from '@/constants';
// 账单交易状态
export const BILL_TRADE_STATUS_UNCONFIRMED = 1; // 待确认还款结果
export const BILL_TRADE_STATUS_OUTSTANDIND = 2; // 确认未到账
export const BILL_TRADE_STATUS_RECEIVED = 3; // 确认到账
export const BILL_TRADE_STATUS_TAB_MAP = {
[BILL_TRADE_STATUS_UNCONFIRMED]: 'primary',
[BILL_TRADE_STATUS_OUTSTANDIND]: 'danger',
[BILL_TRADE_STATUS_RECEIVED]: 'success',
};
export const STATUS_COLOR_MAP = {
0: '#669EDE',
1: '#41CC9E',
2: '#EF6260',
};
export const STATUS_COLOR_TXT = {
0: '待审核',
1: '审核通过',
2: '冻结',
};
// 还款状态 StatusTag map
export const CREDIT_REPAYMENT_STATUS_TAG_MAP = {
[CREDIT_REPAYMENT_STATUS_OUTSTANDING]: 'default',
[CREDIT_REPAYMENT_STATUS_UNCONFIRMED]: 'primary',
[CREDIT_REPAYMENT_STATUS_PAID]: 'success',
[CREDIT_REPAYMENT_STATUS_OVERDUE]: 'danger',
};
// 会员状态 StatusTag map
export const MEMBER_STATUS_TAG_MAP = {
[MEMBER_STATUS_NORMAL]: 'success',
[MEMBER_STATUS_FROZEN]: 'default'
};
// 会员状态 StatusTag map
export const MEMBER_STATUS_BADGE_MAP = {
1: '#EF6260',
2: '#EF6260',
};
\ No newline at end of file
......@@ -16,7 +16,7 @@ import { Pie } from '@/components/Charts';
import StatusTag from '@/components/StatusTag';
import NiceForm from '@/components/NiceForm';
import { repaymentModalSchema, uploadVoucherModalSchema } from './schema';
import TradeRecord from '../TradeRecord';
import TradeRecord, { TradeRecordProps } from '../TradeRecord';
import styles from './index.less';
const repaymentFormActions = createFormActions();
......@@ -24,15 +24,64 @@ const uploadVoucherFormActions = createFormActions();
const { Option } = Select;
interface IntroduceRowProps {
export interface DetailParams {
id: string;
};
export interface DetailData {
/**
* 账单名称(格式:yyyyMMdd~yyyyMMdd)
*/
billName: string
/**
* 账单额度
*/
billQuota: number
/**
* 剩余应还额度
*/
residueRepayQuota: number
/**
* 账单日期
*/
billDay: number
/**
* 还款周期
*/
repayPeriod: number
/**
* 到期时间
*/
expireTime: string
/**
* 到期天数(复数已到期正数未到期)
*/
expireDay: number
/**
* 最后还款日期
*/
lastRepayDate: string
};
interface IntroduceRowProps extends TradeRecordProps {
quotaData: {
x: string,
y: number,
}[],
// 时间段下拉框选项
options: {
title: string,
value: string,
}[];
// 获取账单账单记录详情
fetchCreditDetail: (params: DetailParams) => Promise<DetailData>;
};
const IntroduceRow: React.FC<IntroduceRowProps> = ({
quotaData = [],
fetchRecordList,
}) => {
const [visibleRecord, setVisibleRecord] = useState(false);
const [visibleRepayment, setVisibleRepayment] = useState(false);
......@@ -184,7 +233,7 @@ const IntroduceRow: React.FC<IntroduceRowProps> = ({
</div>
</>
) : (
<TradeRecord />
<TradeRecord fetchRecordList={fetchRecordList} />
)}
</MellowCard>
</Col>
......
import React, { useState } from 'react';
import React, { useState, useEffect } from 'react';
import {
Row,
Col,
......@@ -6,105 +6,158 @@ import {
Pagination,
} from 'antd';
import StatusTag from '@/components/StatusTag';
import {
BILL_TRADE_STATUS_TAB_MAP,
} from '../../../../../constant';
import TradeWrap from '../TradeWrap';
import CheckVoucherModal from '../CheckVoucherModal';
import styles from './index.less';
interface TradeRecordProps {
const PAGE_SIZE = 4;
export interface RecordParams {
// creditId: string; // 授信id
// billId: string; // 账单id
current: number;
pageSize: number;
};
const TradeRecord: React.FC<TradeRecordProps> = ({
export interface RecordItem {
/**
* 交易流水号
*/
tradeCode: string
/**
* 交易时间
*/
tradeTime: string
/**
* 交易金额
*/
tradeMoney: number
/**
* 交易项目:1-订单支付,2-订单退款,3-还款
*/
operation: number
/**
* 交易项目名称
*/
operationName: string
/**
* 状态:1-待确认还款结果,2-确认未到账,3-确认到账
*/
status: number
/**
* 交易状态名称
*/
statusName: string
/**
* 备注
*/
remark: string
/**
* 支付凭证 ,PayProveBO
*/
payProveList: {
/**
* 证明名称
*/
name?: string
/**
* 证明地址
*/
proveUrl?: string
}[]
};
export interface TradeRecordProps {
// 获取账单账单记录详情
fetchRecordList: (params: RecordParams) => Promise<{ data: RecordItem[] , totalCount: number }>;
};
const TradeRecord: React.FC<TradeRecordProps> = ({
fetchRecordList,
}) => {
const [voucherVisible, setVoucherVisible] = useState(false);
const [record, setRecord] = useState<{ data: RecordItem[], totalCount: number }>({ data: [], totalCount: 0 });
const [page, setPage] = useState(1);
const [size, setSize] = useState(PAGE_SIZE);
useEffect(() => {
if (fetchRecordList) {
fetchRecordList
}
}, []);
const handleCheckInfo = record => {
// setData
setVoucherVisible(true);
};
const handlePaginationChange = (page, size) => {
setPage(page);
setSize(size);
fetchRecordList({
current: page,
pageSize: size,
}).then(res => {
setRecord(res);
});
};
return (
<div className={styles.record}>
<div className={styles.list}>
<TradeWrap>
<TradeWrap.TradeItem>
<Descriptions column={1}>
<Descriptions.Item label="交易流水号">
<Row justify="space-between">
<Col span={12}>
<a onClick={() => handleCheckInfo({})}>20200820000010</a>
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<StatusTag type="primary" title="待确认还款结果" />
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易项目">
<Row justify="space-between">
<Col span={12}>
还款
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<strong>+30,000.00元</strong>
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易时间">2020-08-25 08:58</Descriptions.Item>
<Descriptions.Item label="备注">订单号:DTR980</Descriptions.Item>
</Descriptions>
</TradeWrap.TradeItem>
<TradeWrap.TradeItem>
<Descriptions column={1}>
<Descriptions.Item label="交易流水号">
<Row justify="space-between">
<Col span={12}>
<a onClick={() => handleCheckInfo}>20200820000010</a>
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<StatusTag type="primary" title="待确认还款结果" />
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易项目">
<Row justify="space-between">
<Col span={12}>
还款
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<strong>+30,000.00元</strong>
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易时间">2020-08-25 08:58</Descriptions.Item>
<Descriptions.Item label="备注">订单号:DTR980</Descriptions.Item>
</Descriptions>
</TradeWrap.TradeItem>
{record.data.map(item => (
<TradeWrap.TradeItem key={item.tradeCode}>
<Descriptions column={1}>
<Descriptions.Item label="交易流水号">
<Row justify="space-between">
<Col span={12}>
<a onClick={() => handleCheckInfo({})}>{item.tradeCode}</a>
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<StatusTag type={BILL_TRADE_STATUS_TAB_MAP[item.status]} title={item.statusName} />
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易项目">
<Row justify="space-between">
<Col span={12}>
{item.operationName}
</Col>
<Col
span={10}
style={{
textAlign: 'right',
}}
>
<strong>{item.tradeMoney}</strong>
</Col>
</Row>
</Descriptions.Item>
<Descriptions.Item label="交易时间">{item.tradeTime}</Descriptions.Item>
<Descriptions.Item label="备注">{item.remark}</Descriptions.Item>
</Descriptions>
</TradeWrap.TradeItem>
))}
</TradeWrap>
</div>
<div className={styles.pagination}>
<Pagination size="small" total={50} />
<Pagination
size="small"
current={page}
pageSize={size}
total={50}
onChange={handlePaginationChange}
/>
</div>
<CheckVoucherModal
......
import React, { Suspense } from 'react';
import React, { Suspense, useEffect, useState } from 'react';
import {
PageHeader,
Descriptions,
Card,
Spin,
Button,
Badge,
message,
} from 'antd';
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { history } from 'umi';
import { PublicApi } from '@/services/api';
import { GetPayCreditApplyGetCreditDetailResponse } from '@/services/PayApi';
import { usePageStatus, PageStatus } from '@/hooks/usePageStatus';
import {
MEMBER_STATUS,
CREDIT_REPAYMENT_STATUS,
} from '@/constants';
import AvatarWrap from '@/components/AvatarWrap';
import StatusTag from '@/components/StatusTag';
import {
MEMBER_STATUS_BADGE_MAP,
CREDIT_REPAYMENT_STATUS_TAG_MAP,
} from '../../../constant';
import styles from './index.less';
const IntroduceRow = React.lazy(() => import('./components/IntroduceRow'));
......@@ -20,71 +28,118 @@ const BillInfo = React.lazy(() => import('./components/BillInfo'));
const HistoryList = React.lazy(() => import('../../components/HistoryList'));
const QuotaMenageDetail: React.FC = () => {
const { id, validateId, pageStatus } = usePageStatus();
const [creditInfo, setCreditInfo] = useState<GetPayCreditApplyGetCreditDetailResponse>(null);
const [infoLoading, setInfoLoading] = useState(false);
const getCreditDetail = () => {
setInfoLoading(true);
PublicApi.getPayCreditApplyGetCreditDetail({
id,
}).then(res => {
if (res.code === 1000) {
setCreditInfo(res.data);
}
}).finally(() => {
setInfoLoading(false);
});
};
useEffect(() => {
getCreditDetail();
}, []);
const quotaData = [
{
x: '剩余可用额度(元)',
y: 80,
y: creditInfo && creditInfo.canUseQuota ? creditInfo.canUseQuota : 0,
},
{
x: '已用额度(元)',
y: 20,
y: creditInfo && creditInfo.useQuota ? creditInfo.useQuota : 0,
},
];
const fetchRecordList = (params) => {
return new Promise((resolve, reject) => {
PublicApi.getPayCreditApplyPageCreditTradeRecord({
creditId: id,
...params,
}).then(res => {
if (res.code === 1000) {
resolve(res.data);
}
reject();
}).catch(() => {
reject();
});
});
};
return (
<PageHeaderWrapper
title={
<>
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
name: '订单号:DPTY12',
}}
extra="青铜会员"
/>
}
extra={(
<>
</>
)}
>
<Descriptions
size="small"
column={3}
style={{
padding: '0 32px',
}}
<Spin spinning={infoLoading}>
<PageHeaderWrapper
title={
<>
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
name: creditInfo?.member?.memberName,
}}
extra={creditInfo?.member?.levelTag}
/>
}
extra={(
<>
</>
)}
>
<Descriptions.Item label="会员类型">企业会员</Descriptions.Item>
<Descriptions.Item label="会员角色" span={2}>供应商</Descriptions.Item>
<Descriptions.Item label="还款状态">
<StatusTag type="warnning" title="逾期 3 天" />
</Descriptions.Item>
<Descriptions.Item label="会员状态" span={2}>
<Badge color="#41CC9E" text="正常" />
</Descriptions.Item>
</Descriptions>
</PageHeader>
</>
}
>
<Suspense fallback={null}>
<IntroduceRow quotaData={quotaData} />
</Suspense>
<Descriptions
size="small"
column={3}
style={{
padding: '0 32px',
}}
>
<Descriptions.Item label="会员类型">{creditInfo?.member?.memberTypeName}</Descriptions.Item>
<Descriptions.Item label="会员角色" span={2}>{creditInfo?.member?.roleName}</Descriptions.Item>
<Descriptions.Item label="还款状态">
<StatusTag
type={CREDIT_REPAYMENT_STATUS_TAG_MAP[creditInfo?.member?.repayStatus]}
title={CREDIT_REPAYMENT_STATUS[creditInfo?.member?.repayStatus]}
/>
</Descriptions.Item>
<Descriptions.Item label="会员状态" span={2}>
<Badge
color={MEMBER_STATUS_BADGE_MAP[creditInfo?.member?.status]}
text={MEMBER_STATUS[creditInfo?.member?.status]}
/>
</Descriptions.Item>
</Descriptions>
</PageHeader>
</>
}
>
<Suspense fallback={null}>
<IntroduceRow
quotaData={quotaData}
fetchRecordList={fetchRecordList}
/>
</Suspense>
<Suspense fallback={null}>
<BillInfo />
</Suspense>
<Suspense fallback={null}>
<BillInfo />
</Suspense>
<Suspense fallback={null}>
<HistoryList />
</Suspense>
</PageHeaderWrapper>
<Suspense fallback={null}>
<HistoryList />
</Suspense>
</PageHeaderWrapper>
</Spin>
);
};
......
......@@ -8,6 +8,17 @@ import { PublicApi } from '@/services/api';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import {
CREDIT_STATUS_NOT_APPLIED,
CREDIT_STATUS_APPLYING,
CREDIT_STATUS_NORMAL,
CREDIT_STATUS_FROZEN,
CREDIT_STATUS,
CREDIT_REPAYMENT_STATUS_OVERDUE,
} from '@/constants';
import {
CREDIT_REPAYMENT_STATUS_TAG_MAP,
} from '../../constant';
import EyePreview from '@/components/EyePreview';
import NiceForm from '@/components/NiceForm';
import StatusTag from '@/components/StatusTag';
......@@ -16,47 +27,31 @@ import styles from './index.less';
const formActions = createFormActions();
const mock = [
{
id: 1,
memberName: '广州白马皮具交易有限公司',
memberType: '企业会员',
memberRole: '采购商',
memberLevel: '青铜会员',
available : '50,000.00',
count: '48,000',
used: '48,000',
repaymentStatus: 1,
status: 1,
},
{
id: 2,
memberName: '广州白马皮具交易有限公司',
memberType: '企业会员',
memberRole: '采购商',
memberLevel: '青铜会员',
available : '50,000.00',
count: '48,000',
used: '48,000',
repaymentStatus: 1,
status: 1,
},
];
const QuotaMenage: React.FC = () => {
const ref = useRef<any>({});
const handleJumpApply = record => {
// 跳转申请页面
};
const defaultColumns: ColumnType<any>[] = [
{
title: '会员归属',
dataIndex: 'parentMemberName',
align: 'center',
render: (text, record) => (
<EyePreview
url={`/memberCenter/payandSettle/creditApplication/quotaMenage/detail`}
>
{text}
</EyePreview>
<>
{/* 未申请过,并且授信状态为未申请 或者 申请中 */}
{!(!record.isHasApply && (record.status === CREDIT_STATUS_NOT_APPLIED || record.status === CREDIT_STATUS_APPLYING)) ? (
text
) : (
<EyePreview
url={`/memberCenter/payandSettle/creditApplication/quotaMenage/detail?id=${record.id}`}
>
{text}
</EyePreview>
)}
</>
),
},
{
......@@ -112,17 +107,61 @@ const QuotaMenage: React.FC = () => {
dataIndex: 'repayStatusName',
align: 'center',
render: (text, record) => (
<StatusTag type="warnning" title={text} />
<>
{text ? (
<StatusTag
type={CREDIT_REPAYMENT_STATUS_TAG_MAP[record.repayStatus]}
title={record.repayStatus !== CREDIT_REPAYMENT_STATUS_OVERDUE ? text : record.overdueDay}
/>
) : null}
</>
),
},
{
title: '状态',
dataIndex: 'statusName',
align: 'center',
filters: [],
onFilter: (value, record) => record.innerStatus === value,
filters: [
{
text: CREDIT_STATUS[CREDIT_STATUS_NOT_APPLIED],
value: CREDIT_STATUS_NOT_APPLIED,
},
{
text: CREDIT_STATUS[CREDIT_STATUS_APPLYING],
value: CREDIT_STATUS_APPLYING,
},
{
text: CREDIT_STATUS[CREDIT_STATUS_NORMAL],
value: CREDIT_STATUS_NORMAL,
},
{
text: CREDIT_STATUS[CREDIT_STATUS_FROZEN],
value: CREDIT_STATUS_FROZEN,
},
],
onFilter: (value, record) => record.status === value,
render: (text, record) => <Badge color="#41CC9E" text={text} />,
},
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
render: (_, record) => (
<>
{/* 现有额度为 0,并且授信状态为 未申请 或 到达了可调额时间(会员支付参数配置的时间) */}
{
(record.quota === 0 && record.status === CREDIT_STATUS_NOT_APPLIED) && (
<Button
type="link"
onClick={() => handleJumpApply(record)}
>
申请
</Button>
)
}
</>
),
},
];
const [columns, setColumns] = useState<any[]>(defaultColumns);
......
......@@ -2,12 +2,23 @@
* @Author: XieZhiXiong
* @Date: 2020-09-27 17:47:42
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-09-27 19:29:08
* @LastEditTime: 2020-10-15 14:12:18
* @Description:
*/
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { UPLOAD_TYPE } from '@/constants';
import {
CREDIT_STATUS_NOT_APPLIED,
CREDIT_STATUS_APPLYING,
CREDIT_STATUS_NORMAL,
CREDIT_STATUS_FROZEN,
CREDIT_STATUS,
CREDIT_REPAYMENT_STATUS_OUTSTANDING,
CREDIT_REPAYMENT_STATUS_UNCONFIRMED,
CREDIT_REPAYMENT_STATUS_PAID,
CREDIT_REPAYMENT_STATUS_OVERDUE,
CREDIT_REPAYMENT_STATUS,
} from '@/constants';
export const listSearchSchema: ISchema = {
type: 'object',
......@@ -38,7 +49,24 @@ export const listSearchSchema: ISchema = {
rePayStatus: {
type: 'string',
default: undefined,
enum: [],
enum: [
{
label: CREDIT_STATUS[CREDIT_STATUS_NOT_APPLIED],
value: CREDIT_STATUS_NOT_APPLIED,
},
{
label: CREDIT_STATUS[CREDIT_STATUS_APPLYING],
value: CREDIT_STATUS_APPLYING,
},
{
label: CREDIT_STATUS[CREDIT_STATUS_NORMAL],
value: CREDIT_STATUS_NORMAL,
},
{
label: CREDIT_STATUS[CREDIT_STATUS_FROZEN],
value: CREDIT_STATUS_FROZEN,
},
],
'x-component-props': {
placeholder: '还款状态(全部)',
allowClear: true,
......@@ -47,7 +75,24 @@ export const listSearchSchema: ISchema = {
status: {
type: 'string',
default: undefined,
enum: [],
enum: [
{
label: CREDIT_REPAYMENT_STATUS[CREDIT_REPAYMENT_STATUS_OUTSTANDING],
value: CREDIT_REPAYMENT_STATUS_OUTSTANDING
},
{
label: CREDIT_REPAYMENT_STATUS[CREDIT_REPAYMENT_STATUS_UNCONFIRMED],
value: CREDIT_REPAYMENT_STATUS_UNCONFIRMED
},
{
label: CREDIT_REPAYMENT_STATUS[CREDIT_REPAYMENT_STATUS_PAID],
value: CREDIT_REPAYMENT_STATUS_PAID
},
{
label: CREDIT_REPAYMENT_STATUS[CREDIT_REPAYMENT_STATUS_OVERDUE],
value: CREDIT_REPAYMENT_STATUS_OVERDUE
},
],
'x-component-props': {
placeholder: '状态(全部)',
allowClear: true,
......
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