Skip to content

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

开发中

parent e9318ba9
Hide whitespace changes
Inline Side-by-side
Showing with 290 additions and 201 deletions
src/pages/payandSettle/creditApplication/components/OuterCirculation/index.tsx
View file @ dc9cb88f
......@@ -2,11 +2,11 @@
* @Author: XieZhiXiong
* @Date: 2020-09-29 10:47:07
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-10-26 17:11:54
* @LastEditTime: 2020-10-27 10:33:24
* @Description: 外部流转组件
*/
import React from 'react';
import { Steps } from 'antd';
import { Steps, Empty } from 'antd';
import MellowCard from '@/components/MellowCard';
import styles from './index.less';
......@@ -34,11 +34,15 @@ const OuterCirculation: React.FC<OuterCirculation> = ({
marginBottom: 24,
}}
>
<Steps style={{ marginTop: 30 }} progressDot current={current}>
{steps.map((item, index) => (
<Steps.Step key={index} title={item.title} description={item.description} />
))}
</Steps>
{(steps && steps.length > 0) ? (
<Steps style={{ marginTop: 30 }} progressDot current={current}>
{steps.map((item, index) => (
<Steps.Step key={index} title={item.title} description={item.description} />
))}
</Steps>
) : (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
)}
</MellowCard>
);
};
......
src/pages/payandSettle/creditApplication/components/QuotaApplicationInfo/index.tsx
View file @ dc9cb88f
......@@ -46,21 +46,28 @@ interface QuotaApplicationInfo {
repayPeriod: number,
// 审批时间
verifyTime: string,
},
} | null,
};
const QuotaApplicationInfo: React.FC<QuotaApplicationInfo> = ({
editable = false,
onSubmit,
quotaInfo = {},
verify = {},
verify,
}) => {
const [modalVisible, setModalVisible] = useState(false);
const handleSubmit = values => {
if (onSubmit) {
const { billDay, repayPeriod, ...rest } = values;
const {
applyQuota,
billDay,
repayPeriod,
quotaSlide,
...rest
} = values;
onSubmit({
applyQuota: +applyQuota,
billDay: +billDay,
repayPeriod: +repayPeriod,
...rest,
......@@ -114,7 +121,7 @@ const QuotaApplicationInfo: React.FC<QuotaApplicationInfo> = ({
marginBottom: 24
}}
>
<Col span={14}>
<Col span={verify ? 14 : 24}>
<MellowCard
title="授信申请信息"
extra={(
......@@ -210,36 +217,38 @@ const QuotaApplicationInfo: React.FC<QuotaApplicationInfo> = ({
</MellowCard>
</Col>
<Col span={10}>
<MellowCard
title={(
<div style={{ color: '#fff' }}>
授信审批信息
</div>
)}
style={{
background: '#4279DF',
}}
fullHeight
>
<div className={styles.approval}>
<div className={styles['approval-amountWrap']}>
{verify ? (
<Col span={10}>
<MellowCard
title={(
<div style={{ color: '#fff' }}>
授信审批信息
</div>
)}
style={{
background: '#4279DF',
}}
fullHeight
>
<div className={styles.approval}>
<div className={styles['approval-amountWrap']}>
<Descriptions column={1}>
<Descriptions.Item label="审批额度(元)">
<div className={styles['approval-amount']}>
{verify.quota}
</div>
</Descriptions.Item>
</Descriptions>
</div>
<Descriptions column={1}>
<Descriptions.Item label="审批额度(元)">
<div className={styles['approval-amount']}>
{verify.quota}
</div>
</Descriptions.Item>
<Descriptions.Item label="审批账单日期">{verify.billDay}日</Descriptions.Item>
<Descriptions.Item label="审批还款周期">{verify.repayPeriod}天</Descriptions.Item>
<Descriptions.Item label="审批时间">{verify.verifyTime}</Descriptions.Item>
</Descriptions>
</div>
<Descriptions column={1}>
<Descriptions.Item label="审批账单日期">{verify.billDay}日</Descriptions.Item>
<Descriptions.Item label="审批还款周期">{verify.repayPeriod}天</Descriptions.Item>
<Descriptions.Item label="审批时间">{verify.verifyTime}</Descriptions.Item>
</Descriptions>
</div>
</MellowCard>
</Col>
</MellowCard>
</Col>
) : null}
</Row>
<Modal
......
src/pages/payandSettle/creditApplication/components/QuotaApplicationInfo/schema/index.ts
View file @ dc9cb88f
......@@ -2,7 +2,7 @@
* @Author: XieZhiXiong
* @Date: 2020-09-29 15:51:31
* @LastEditors: XieZhiXiong
* @LastEditTime: 2020-10-26 18:46:02
* @LastEditTime: 2020-10-27 09:52:57
* @Description:
*/
import { ISchema } from '@formily/antd';
......@@ -32,6 +32,10 @@ export const editModalSchema: ISchema = {
required: true,
message: '请填写申请调整额度',
},
{
pattern: PATTERN_MAPS.money,
message: '请填写正数',
},
],
},
quotaSlide: {
......
src/pages/payandSettle/creditApplication/quotaFormQuery/detail.tsx
View file @ dc9cb88f
import React, { Suspense } from 'react';
import React, { Suspense, useEffect, useState } from 'react';
import {
PageHeader,
Descriptions,
......@@ -11,114 +11,167 @@ import {
import { FormOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { history } from 'umi';
import { PublicApi } from '@/services/api';
import { GetPayCreditApplyGetApplyDetailResponse } from '@/services/PayApi';
import { CREDIT_INNER_STATUS, CREDIT_OUTER_STATUS } from '@/constants';
import { usePageStatus } from '@/hooks/usePageStatus';
import AvatarWrap from '@/components/AvatarWrap';
import StatusTag from '@/components/StatusTag';
import { MEMBER_STATUS_TAG_MAP, CREDIT_OUTER_STATUS_TAG_MAP, CREDIT_OUTER_STATUS_BADGE_MAP } from '../../constant';
const OuterCirculation = React.lazy(() => import('../components/OuterCirculation'));
const QuotaApplicationInfo = React.lazy(() => import('../components/QuotaApplicationInfo'));
const HitoryList = React.lazy(() => import('../components/HistoryList'));
const OuterCirculationRecord = React.lazy(() => import('../components/OuterCirculationRecord'));
interface DetailInfo {
// 授信id
id: string;
// 申请id
applyId: string;
// 是否是编辑的
isEdit?: boolean;
};
interface QuotaValues {
// 申请调整额度
applyQuota: number | null;
// 申请调整账单日期
billDay: number | null;
// 申请还款周期
repayPeriod: number | null;
};
const QuotaFormQueryDetail: React.FC = () => {
const { id } = usePageStatus();
const [quotaInfo, setQuotaInfo] = useState<GetPayCreditApplyGetApplyDetailResponse>(null);
const [quotaValues, setQuotaValues] = useState<QuotaValues>({
applyQuota: null,
billDay: null,
repayPeriod: null,
});
const [infoLoading, setInfoloading] = useState(false);
const steps = [
{
title: '提交授信申请单',
description: '采购商',
},
{
title: '确认授信申请单',
description: '供应商',
},
{
title: '完成',
description: '',
},
];
const getQuotaInfo = () => {
if (!id) {
return;
}
setInfoloading(true);
PublicApi.getPayCreditApplyGetApplyDetail({
id,
}).then(res => {
if (res.code === 1000) {
setQuotaInfo(res.data);
setQuotaValues({
applyQuota: res.data.applyQuota,
billDay: res.data.billDay,
repayPeriod: res.data.repayPeriod,
});
}
}).finally(() => {
setInfoloading(false);
});
};
const outerRecord = [
{
id: 1,
order: 1,
role: '采购商',
status: 2,
action: '提交授信申请单',
createTime: '2020-05-12 08:08',
opinion: '同意',
},
{
id: 2,
order: 2,
role: '采购商',
status: 2,
action: '提交授信申请单',
createTime: '2020-05-12 08:08',
opinion: '同意',
},
];
useEffect(() => {
getQuotaInfo();
}, []);
return (
<PageHeaderWrapper
title={
<>
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: '单',
name: '申请单号：DPTY12',
<Spin spinning={infoLoading}>
<PageHeaderWrapper
title={
<>
<PageHeader
style={{ padding: '0' }}
onBack={() => history.goBack()}
title={
<AvatarWrap
info={{
aloneTxt: '单',
name: `申请单号：${quotaInfo && quotaInfo.applyNo ? quotaInfo.applyNo : ''}`,
}}
extra={quotaInfo && quotaInfo.member ? quotaInfo.member.levelTag || '' : ''}
/>
}
extra={(
<>
</>
)}
>
<Descriptions
size="small"
column={3}
style={{
padding: '0 32px',
}}
extra="青铜会员"
/>
>
<Descriptions.Item label="会员归属">{'暂无'}</Descriptions.Item>
<Descriptions.Item label="会员类型">{quotaInfo?.member?.memberTypeName}</Descriptions.Item>
<Descriptions.Item label="会员角色名称">{quotaInfo?.member?.roleName}</Descriptions.Item>
<Descriptions.Item label="会员状态">
<StatusTag
type={MEMBER_STATUS_TAG_MAP[quotaInfo && quotaInfo.member ? quotaInfo.member.status || 1 : 1]}
title={quotaInfo && quotaInfo.member ? quotaInfo.member.status || 1 : 1}
/>
</Descriptions.Item>
<Descriptions.Item label="外部状态">
<StatusTag type={CREDIT_OUTER_STATUS_TAG_MAP[quotaInfo?.outerStatus]} title={CREDIT_OUTER_STATUS[quotaInfo?.outerStatus]} />
</Descriptions.Item>
<Descriptions.Item label="内部状态">
<Badge color={CREDIT_OUTER_STATUS_BADGE_MAP[quotaInfo?.innerStatus]} text={CREDIT_INNER_STATUS[quotaInfo?.innerStatus]} />
</Descriptions.Item>
</Descriptions>
</PageHeader>
</>
}
>
<Suspense fallback={null}>
<OuterCirculation
steps={
quotaInfo && quotaInfo.outerVerifyRecordList ?
quotaInfo.outerVerifyRecordList.map(item => ({
title: item.operate,
description: item.roleName,
})) :
[]
}
extra={(
<>
</>
)}
>
<Descriptions
size="small"
column={3}
style={{
padding: '0 32px',
}}
>
<Descriptions.Item label="会员归属">广州白马皮具交易中心</Descriptions.Item>
<Descriptions.Item label="会员类型">企业会员</Descriptions.Item>
<Descriptions.Item label="会员角色名称">采购商</Descriptions.Item>
<Descriptions.Item label="会员状态">
<StatusTag type="success" title="正常" />
</Descriptions.Item>
<Descriptions.Item label="外部状态">
<StatusTag type="success" title="接受申请" />
</Descriptions.Item>
<Descriptions.Item label="内部状态">
<Badge color="#41CC9E" text="正常" />
</Descriptions.Item>
</Descriptions>
</PageHeader>
</>
}
>
<Suspense fallback={null}>
<OuterCirculation steps={steps} />
</Suspense>
<Suspense fallback={null}>
<QuotaApplicationInfo />
</Suspense>
<Suspense fallback={null}>
<HitoryList />
</Suspense>
<Suspense fallback={null}>
<OuterCirculationRecord dataSource={outerRecord} />
</Suspense>
</PageHeaderWrapper>
current={0}
/>
</Suspense>
<Suspense fallback={null}>
<QuotaApplicationInfo
quotaInfo={{
originalQuota: quotaInfo?.originalQuota,
applyQuota: quotaValues.applyQuota,
billDay: quotaValues.billDay,
repayPeriod: quotaValues.repayPeriod,
applyTime: quotaInfo?.applyTime,
}}
verify={
quotaInfo && quotaInfo.verify ? {
quota: quotaInfo?.verify?.quota,
billDay: quotaInfo?.verify?.billDay,
repayPeriod: quotaInfo?.verify?.repayPeriod,
verifyTime: quotaInfo?.verify?.verifyTime,
} :
null
}
editable={false}
/>
</Suspense>
<Suspense fallback={null}>
<HitoryList dataSource={quotaInfo?.historyApplyList} />
</Suspense>
<Suspense fallback={null}>
<OuterCirculationRecord dataSource={quotaInfo?.outerVerifyRecordList} />
</Suspense>
</PageHeaderWrapper>
</Spin>
);
};
......
src/pages/payandSettle/creditApplication/quotaFormQuery/index.tsx
View file @ dc9cb88f
......@@ -64,7 +64,7 @@ const QuotaFormQuery: React.FC = () => {
render: (text, record) => (
<>
<EyePreview
url={`/memberCenter/payandSettle/creditApplication/quotaFormQuery/detail`}
url={`/memberCenter/payandSettle/creditApplication/quotaFormQuery/detail?id=${record.id}`}
>
{text}
</EyePreview>
......
src/pages/payandSettle/creditApplication/quotaMenage/index.tsx
View file @ dc9cb88f
......@@ -9,6 +9,7 @@ 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 { coverColFiltersItem } from '@/utils';
import {
CREDIT_STATUS_NOT_APPLIED,
CREDIT_STATUS_APPLYING,
......@@ -192,7 +193,32 @@ const QuotaMenage: React.FC = () => {
};
// 初始化高级筛选选项
const fetchSelectOptions = async () => {
const fetchSearchItems = async () => {
const res = await PublicApi.getPayCreditApplyPageItemsByConsumer();
if (res.code === 1000) {
const { data } = res;
const {
statusList = [],
repayStatusList = [],
} = data;
const newColumns = columns.slice();
// filter 0 过滤掉全部选项
coverColFiltersItem(
newColumns,
'statusName',
statusList.map(item => ({ text: item.name, value: item.status })).filter(item => item.value),
);
setColumns(newColumns);
return {
status: statusList.map(item => ({ label: item.name, value: item.status })).filter(item => item.value),
rePayStatus: repayStatusList.map(item => ({ label: item.name, value: item.status })).filter(item => item.value),
};
}
return {};
};
......@@ -218,8 +244,8 @@ const QuotaMenage: React.FC = () => {
FORM_FILTER_PATH,
);
useAsyncInitSelect(
['innerStatus', 'outerStatus'],
fetchSelectOptions,
['status', 'rePayStatus'],
fetchSearchItems,
);
}}
schema={listSearchSchema}
......
src/pages/payandSettle/creditApplication/quotaMenage/schema/index.ts
View file @ dc9cb88f
......@@ -7,18 +7,6 @@
*/
import { ISchema } from '@formily/antd';
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_OUTSTANDING,
CREDIT_REPAYMENT_STATUS_UNCONFIRMED,
CREDIT_REPAYMENT_STATUS_PAID,
CREDIT_REPAYMENT_STATUS_OVERDUE,
CREDIT_REPAYMENT_STATUS,
} from '@/constants';
export const listSearchSchema: ISchema = {
type: 'object',
......@@ -49,24 +37,7 @@ export const listSearchSchema: ISchema = {
rePayStatus: {
type: 'string',
default: undefined,
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,
},
],
enum: [],
'x-component-props': {
placeholder: '还款状态(全部)',
allowClear: true,
......@@ -75,24 +46,7 @@ export const listSearchSchema: ISchema = {
status: {
type: 'string',
default: undefined,
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
},
],
enum: [],
'x-component-props': {
placeholder: '状态(全部)',
allowClear: true,
......
src/pages/payandSettle/creditApplication/quotaPrSubmit/components/DetailInfo/index.tsx
View file @ dc9cb88f
......@@ -24,19 +24,26 @@ const HitoryList = React.lazy(() => import('../../../components/HistoryList'));
const OuterCirculationRecord = React.lazy(() => import('../../../components/OuterCirculationRecord'));
interface DetailInfo {
// 授信id
id: string;
// 申请id
applyId: string;
// 是否是编辑的
isEdit?: boolean;
};
interface QuotaValues {
// 申请调整额度
applyQuota: number | null;
// 申请调整账单日期
billDay: number | null;
// 申请还款周期
repayPeriod: number | null;
};
const DetailInfo: React.FC<DetailInfo> = ({
id,
applyId,
isEdit = false,
}) => {
const [quotaInfo, setQuotaInfo] = useState<GetPayCreditApplyGetApplyDetailResponse>(null);
......@@ -58,6 +65,11 @@ const DetailInfo: React.FC<DetailInfo> = ({
}).then(res => {
if (res.code === 1000) {
setQuotaInfo(res.data);
setQuotaValues({
applyQuota: res.data.applyQuota,
billDay: res.data.billDay,
repayPeriod: res.data.repayPeriod,
});
}
}).finally(() => {
setInfoloading(false);
......@@ -76,11 +88,14 @@ const DetailInfo: React.FC<DetailInfo> = ({
const handleSubmit = () => {
setSubmitLoading(true);
PublicApi.postPayCreditApplyAddCreditApply({
creditId: +id,
creditId: +id,
applyId: applyId ? +applyId : 0,
...quotaValues,
}).then(res => {
if (res.code === 1000) {
history.goBack();
setTimeout(() => {
history.goBack();
}, 800);
}
}).finally(() => {
setSubmitLoading(false);
......@@ -99,9 +114,9 @@ const DetailInfo: React.FC<DetailInfo> = ({
<AvatarWrap
info={{
aloneTxt: '单',
name: `申请单号：${quotaInfo?.applyNo}`,
name: `申请单号：${quotaInfo && quotaInfo.applyNo ? quotaInfo.applyNo : ''}`,
}}
extra={quotaInfo?.member?.levelTag}
extra={quotaInfo && quotaInfo.member ? quotaInfo.member.levelTag || '' : ''}
/>
}
extra={(
......@@ -163,17 +178,20 @@ const DetailInfo: React.FC<DetailInfo> = ({
<QuotaApplicationInfo
quotaInfo={{
originalQuota: quotaInfo?.originalQuota,
applyQuota: quotaInfo?.applyQuota,
billDay: quotaInfo?.billDay,
repayPeriod: quotaInfo?.repayPeriod,
applyQuota: quotaValues.applyQuota,
billDay: quotaValues.billDay,
repayPeriod: quotaValues.repayPeriod,
applyTime: quotaInfo?.applyTime,
}}
verify={{
quota: quotaInfo?.verify.quota,
billDay: quotaInfo?.verify.billDay,
repayPeriod: quotaInfo?.verify.repayPeriod,
verifyTime: quotaInfo?.verify.verifyTime,
}}
verify={
quotaInfo && quotaInfo.verify ? {
quota: quotaInfo?.verify?.quota,
billDay: quotaInfo?.verify?.billDay,
repayPeriod: quotaInfo?.verify?.repayPeriod,
verifyTime: quotaInfo?.verify?.verifyTime,
} :
null
}
editable={isEdit}
onSubmit={handleQuotaSubmit}
/>
......
src/pages/payandSettle/creditApplication/quotaPrSubmit/index.tsx
View file @ dc9cb88f
......@@ -35,7 +35,7 @@ const QuotaPrSubmit: React.FC = () => {
render: (text, record) => (
<>
<EyePreview
url={`/memberCenter/payandSettle/creditApplication/quotaPrSubmit/detail`}
url={`/memberCenter/payandSettle/creditApplication/quotaPrSubmit/detail?id=${record.id}`}
>
{text}
</EyePreview>
......@@ -84,7 +84,7 @@ const QuotaPrSubmit: React.FC = () => {
filters: [],
onFilter: (value, record) => record.outerStatus === value,
render: (text, record) => (
<StatusTag type={CREDIT_OUTER_STATUS_TAG_MAP[record.outerStatus]} title={text} />
<StatusTag type={CREDIT_OUTER_STATUS_TAG_MAP[record.outerStatus]} title={record.outerStatusName} />
),
},
{
......@@ -93,7 +93,7 @@ const QuotaPrSubmit: React.FC = () => {
align: 'center',
filters: [],
onFilter: (value, record) => record.innerStatus === value,
render: (text, record) => <Badge color={CREDIT_OUTER_STATUS_BADGE_MAP[record.innerStatus]} text={text} />,
render: (text, record) => <Badge color={CREDIT_OUTER_STATUS_BADGE_MAP[record.innerStatus]} text={record.innerStatusName} />,
},
{
title: '操作',
......
src/utils/index.tsx
View file @ dc9cb88f
......@@ -494,6 +494,27 @@ export const isJSONStr = str => {
return str;
}
/**
* 给 Table columns 的 filters 赋值
* @param {array} data 需要赋值的数组
* @param {string} dataIndex 索引
* @param {array} item 需要赋值的值
*/
export const coverColFiltersItem = (
data: Array<{[key: string]: any}>,
dataIndex: string,
item: {[key: string]: any}
) => {
const index = data.findIndex(i => i.dataIndex === dataIndex);
if (index !== -1) {
data.splice(index, 1, {
...data[index],
filters: item,
});
}
};
export default {
isArray,
isObject,
......
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