Commit 173dd12f authored by 前端-黄佳鑫's avatar 前端-黄佳鑫
parents a6f5b7c1 80cdd51f
......@@ -84,6 +84,10 @@ const OtherPayModal: React.FC<Iprops> = (props: Iprops) => {
}
const handleOnOk = () => {
if(activeChannel === null) {
message.error("请选择支付方式")
return;
}
setFlag(1)
onConfirm?.({
payChannel: activeChannel
......@@ -95,6 +99,7 @@ const OtherPayModal: React.FC<Iprops> = (props: Iprops) => {
width={548}
title={intl.formatMessage({id: 'balance.fukuan'})}
onCancel={handleClose}
maskClosable={false}
visible={visible}
okText={flag === 1 ? intl.formatMessage({id: 'balance.woyifukuan'}) : intl.formatMessage({id: 'balance.quedingfukuan'})}
onOk={handleOnOk}
......
......@@ -78,17 +78,18 @@ function useHandleSettlementList() {
/** 这里不对其他key 做限制,即可存在多个为true的时候 */
const handleOpen = useCallback((key: keyof ModalsType) => {
setModals({
...modals,
setModals((prev) => ({
...prev,
[key]: true
})
}))
}, [])
const handleClose = useCallback((key: keyof ModalsType) => {
setModals({
...modals,
[key]: false
})
setModals((prev) => ({
...prev,
[key]: false,
unionPay: false
}))
}, [])
const valifyUser = async (params: { memberRoleId: number, memberId: number }, mode: "balance" | 'pay') => {
......
......@@ -177,10 +177,10 @@ const SettlementList = () => {
/** 通联支付, 付款 */
const handleUniversalPay = async (params: {payChannel: number}) => {
console.log("modals", modals);
// 如果是网银支付
if (modals.unionPay) {
handleClose('universalPay')
handleClose('unionPay')
formActions.submit();
return;
}
......@@ -222,7 +222,6 @@ const SettlementList = () => {
setRandomCode(res.data);
handleClose('universalPay');
handleOpen('smsCodeModal')
// handleOpen()
return;
}
......
import EyePreview from '@/components/EyePreview';
// import StatusTag from '../components/StatusTag';
// import { TO_BE_RECONCILED, TO_BE_PAY, TO_BE_COLLECTED, COMPLETED, PRODUCT_NOTICE_SETTLEMENT_DETAIL, LOGISTICS_DETAIL, ORDER_DETAIL, CONTRACT_FUND_BILL } from '../common/constants';
import { priceFormat } from '@/utils/numberFomat'
import StatusTag, { STATUS_TYPE } from '@/components/StatusTag';
import React, { useMemo, useState } from 'react';
// import { payStatus } from '../common';
import { COMPLETED, CONTRACT_FUND_BILL, LOGISTICS_DETAIL, ORDER_DETAIL, PRODUCT_NOTICE_SETTLEMENT_DETAIL, TO_BE_COLLECTED, TO_BE_PAY, TO_BE_RECONCILED, IS_UNIVERSAL_PAY } from '@/pages/balance/common/constants';
import { useCallback } from 'react';
import { GetSettleAccountsMemberSettlementPagePayableSettlementResponseDetail, GetSettleAccountsPlatformScoreSettlementPageReceivableSettlementResponseDetail } from '@/services/SettleV2Api';
import { getIntl } from 'umi';
import { getAuth } from '@/utils/auth';
import { payStatus } from '@/pages/balance/common';
import { STATUS_TEXT } from '@/constants/balance';
const intl = getIntl();
type ModalsType = {
/** 待对账 */
reconciledComfirm: boolean,
/** 确认付款凭证 */
confirmCompletePaymentStatus: boolean,
/** 查看付款 */
viewPay: boolean,
/** 查看通联支付 */
viewUniversalPay: boolean,
}
function useHandleSettlementList() {
const auth = getAuth()
const [itemInfo, setItemInfo] = useState<GetSettleAccountsPlatformScoreSettlementPageReceivableSettlementResponseDetail | null>(null)
const [modals, setModals] = useState<ModalsType>({
viewPay: false,
viewUniversalPay: false,
reconciledComfirm: false,
confirmCompletePaymentStatus: false
})
/** 这里不对其他key 做限制,即可存在多个为true的时候 */
const handleOpen = useCallback((key: keyof ModalsType) => {
setModals((prev) => ({
...prev,
[key]: true
}))
}, [])
const handleClose = useCallback((key: keyof ModalsType) => {
setModals((prev) => ({
...prev,
[key]: false,
// unionPay: false
}))
}, [])
const handleAction = async (record: GetSettleAccountsPlatformScoreSettlementPageReceivableSettlementResponseDetail, key: keyof ModalsType) => {
setItemInfo(record);
handleOpen(key);
}
const columns = [
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementNo' }),
dataIndex: 'settlementNo',
render: (text, record) => {
return (
<EyePreview
url={`/memberCenter/balance/platformSettlement/integral/detail?id=${record.id}`}
>{record.settlementNo}</EyePreview>
)
}
},
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementDate' }), dataIndex: 'settlementDate' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementWayName' }), dataIndex: 'settlementWayName' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.totalCount' }), dataIndex: 'totalCount' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.score' }), dataIndex: 'score' },
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.ratio' }),
dataIndex: 'ratio',
render: (text, record) => {
return (record.ratio + "%");
}
},
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.amount' }), dataIndex: 'amount' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementTime' }), dataIndex: 'settlementTime' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.payWayName' }), dataIndex: 'payWayName' },
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.status' }), dataIndex: 'status',
filters: payStatus,
onFilter: (value: number, record: any) => record.status == value,
render: (text, record) => {
return (
// <StatusTag status={record.status || 1} />
<StatusTag type={STATUS_TYPE[record.status] as 'success'} title={STATUS_TEXT[record.status]} />
)
}
},
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation' }),
render: (text, record) => {
/** 通联支付 */
const isUniversalPay = record.payWay === 2
// 待收张狂结算
if (record.status === TO_BE_RECONCILED) {
return <a onClick={() => handleAction(record, 'reconciledComfirm')}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.1' })}</a>
}
if (record.status === TO_BE_COLLECTED) {
return <a onClick={() => handleAction(record, 'confirmCompletePaymentStatus')}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.2' })}</a>
}
if (record.status === COMPLETED) {
return <a onClick={() => handleAction(record, isUniversalPay ? 'viewUniversalPay' : 'viewPay')}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.3' })}</a>
}
}
}
]
const cacheItemInfo = useMemo(() => itemInfo, [itemInfo])
return {
columns,
handleOpen,
handleClose,
itemInfo: cacheItemInfo,
modals,
}
}
export default useHandleSettlementList
......@@ -4,7 +4,7 @@
* @Description: 积分结算列表
*/
import React, { useCallback, useEffect, useRef, useState } from 'react';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { useIntl } from 'umi'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { Card, DatePicker, Modal, Space, Button } from 'antd';
......@@ -26,82 +26,24 @@ import { COMPLETED, TO_BE_COLLECTED, TO_BE_RECONCILED } from '../../common/const
import { STATUS_TEXT } from '@/constants/balance';
import useSetSearchValueInTable from '@/hooks/useSetSearchValueInTable';
import { getSettleAccountsCommonGetSettlementStatus, getSettleAccountsPlatformScoreSettlementGetReceivablePayProve, getSettleAccountsPlatformScoreSettlementPageReceivableSettlement, GetSettleAccountsPlatformScoreSettlementPageReceivableSettlementRequest, postSettleAccountsPlatformScoreSettlementConfirmAccountComplete, postSettleAccountsPlatformScoreSettlementConfirmPayProve } from '@/services/SettleV2Api';
import useHandleSettlementList from './hooks/useHandleSettlementList';
import ViewUniversalPay from '../../components/ViewUniversalPay';
const formActions = createFormActions();
const Integral: React.FC = () => {
const intl = useIntl();
const { columns, handleOpen, handleClose, itemInfo, modals} = useHandleSettlementList();
const ref = useRef<any>({})
const {
confirmPayInfo,
confirmPayVisible,
reconciliationInfo,
reconciliationVisible,
viewVisible,
payVoucherInfo,
viewModalonCancel,
confirmPayOnCancel,
reconciliationOnCancel,
handleReconciledComfirm,
handleComfirmCompletePaymentStatus,
handleViewPayModal
} = useFetchColumns("receiveable");
const [files, setFiles] = useState([]);
const { searchData, formatInitialValue, clear } = useSetSearchValueInTable();
const universalPayInfo = useMemo(() => ({
name: itemInfo?.settlementName,
amount: itemInfo?.amount,
statusName: itemInfo?.statusName,
payWayName: '平台',
settlementDate: itemInfo?.settlementDate
}), [itemInfo])
const columns = [
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementNo' }),
dataIndex: 'settlementNo',
render: (text, record) => {
return (
<EyePreview
url={`/memberCenter/balance/platformSettlement/integral/detail?id=${record.id}`}
>{record.settlementNo}</EyePreview>
)
}
},
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementDate' }), dataIndex: 'settlementDate' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementWayName' }), dataIndex: 'settlementWayName' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.totalCount' }), dataIndex: 'totalCount' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.score' }), dataIndex: 'score' },
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.ratio' }),
dataIndex: 'ratio',
render: (text, record) => {
return (record.ratio + "%");
}
},
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.amount' }), dataIndex: 'amount' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.settlementTime' }), dataIndex: 'settlementTime' },
{ title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.payWayName' }), dataIndex: 'payWayName' },
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.status' }), dataIndex: 'status',
filters: payStatus,
onFilter: (value: number, record: any) => record.status == value,
render: (text, record) => {
return (
// <StatusTag status={record.status || 1} />
<StatusTag type={STATUS_TYPE[record.status] as 'success'} title={STATUS_TEXT[record.status]} />
)
}
},
{
title: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation' }),
render: (text, record) => {
// 待收张狂结算
if (record.status === TO_BE_RECONCILED) {
return <a onClick={() => handleReconciledComfirm({ id: record.id, payName: intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.1.payName' }), settlementDate: record.settlementDate })}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.1' })}</a>
}
if (record.status === TO_BE_COLLECTED) {
return <a onClick={() => handleComfirmCompletePaymentStatus({ id: record.id })}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.2' })}</a>
}
if (record.status === COMPLETED) {
return <a onClick={() => handleViewPayModal({ id: record.id })}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.columns.operation.button.3' })}</a>
}
}
}
]
const fetchListData = async (params: GetSettleAccountsPlatformScoreSettlementPageReceivableSettlementRequest) => {
const searchParams = {
......@@ -123,7 +65,8 @@ const Integral: React.FC = () => {
const handleConfirm = async (params: { id: number }) => {
const { code } = await postSettleAccountsPlatformScoreSettlementConfirmAccountComplete({ settlementId: params.id })
if (code === 1000) {
reconciliationOnCancel();
// reconciliationOnCancel();
handleClose('reconciledComfirm')
formActions.submit();
}
}
......@@ -134,7 +77,8 @@ const Integral: React.FC = () => {
const handleConfirmPayStatus = async (params: { status: 0 | 1, id: number }) => {
const { code } = await postSettleAccountsPlatformScoreSettlementConfirmPayProve({ id: params.id, status: params.status });
if (code) {
confirmPayOnCancel();
// confirmPayOnCancel();
handleClose('confirmCompletePaymentStatus')
formActions.submit();
}
}
......@@ -146,11 +90,13 @@ const Integral: React.FC = () => {
}
}, [])
useEffect(() => {
if (payVoucherInfo !== null) {
fetchVouchers(payVoucherInfo.id);
if (itemInfo !== null && (itemInfo.status === 4 || itemInfo.status === 3)) {
fetchVouchers(itemInfo.id);
}
}, [payVoucherInfo])
}, [itemInfo])
/**
* 搜索
*/
......@@ -198,32 +144,38 @@ const Integral: React.FC = () => {
<Modal
width={400}
title={intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.1.title' })}
visible={reconciliationVisible}
onCancel={reconciliationOnCancel}
onOk={() => handleConfirm({ id: reconciliationInfo?.id })}
visible={modals.reconciledComfirm}
onCancel={() => handleClose('reconciledComfirm')}
onOk={() => handleConfirm({ id: itemInfo?.id })}
>
<ConfirmAccount settlementDate={reconciliationInfo?.settlementDate} payName={reconciliationInfo?.payName} />
<ConfirmAccount settlementDate={itemInfo?.settlementDate} payName={'平台'} />
</Modal>
<Modal width={548} title={intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.2.title' })} onCancel={viewModalonCancel} visible={viewVisible} footer={null}>
<Modal
width={548}
title={intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.2.title' })}
onCancel={() => handleClose('viewPay')}
visible={modals.viewPay}
footer={null}
>
<Voucher files={files} />
</Modal>
<Modal
width={548}
title={intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.3.title' })}
onCancel={confirmPayOnCancel}
visible={confirmPayVisible}
onCancel={() => handleClose('confirmCompletePaymentStatus')}
visible={modals.confirmCompletePaymentStatus}
footer={(
<Space>
<Button onClick={confirmPayOnCancel}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.3.button.1' })}</Button>
<Button onClick={() => handleClose('confirmCompletePaymentStatus')}>{intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.3.button.1' })}</Button>
<Button
danger
onClick={() => handleConfirmPayStatus({ status: 0, id: confirmPayInfo.id })}
onClick={() => handleConfirmPayStatus({ status: 0, id: itemInfo.id })}
>
{intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.3.button.2' })}
</Button>
<Button
type={"primary"}
onClick={() => handleConfirmPayStatus({ status: 1, id: confirmPayInfo.id })}
onClick={() => handleConfirmPayStatus({ status: 1, id: itemInfo.id })}
>
{intl.formatMessage({ id: 'balance.platformSettlement.integral.modal.3.button.3' })}
</Button>
......@@ -232,6 +184,12 @@ const Integral: React.FC = () => {
>
<Voucher files={files} />
</Modal>
<ViewUniversalPay
visible={modals['viewUniversalPay']}
balanceInfo={universalPayInfo}
onClose={() => handleClose('viewUniversalPay')}
onOk={() => handleClose('viewUniversalPay')}
/>
</PageHeaderWrapper>
)
}
......
......@@ -17,7 +17,7 @@ import DetailInfo from '../components/DetailInfo';
import VerifyModal from '../components/VerifyModal';
const QuotaPrSubmitVerify: React.FC = () => {
const intl = useIntl();ƒ
const intl = useIntl();
const { id, creditId } = usePageStatus();
const [modalVisible, setModalVisible] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false);
......
......@@ -75,7 +75,7 @@ const COMPONENT_NAME = {
giveProduct: "CommodityList",
giveCoupon: "CommodityList",
morePiece: "CommodityList",
combination: "CommodityList",
combination: "Combination",
groupPurchase: "CommodityList",
bargain: "CommodityList",
secKill: "CommodityList",
......@@ -100,7 +100,7 @@ const CHILD_COMPONENT_NAME = {
giveProduct: "CommodityList.SwapProduct",
giveCoupon: "CommodityList.SwapCoupon",
morePiece: "CommodityList.Item",
combination: "CommodityList.Item",
combination: "Combination.Item",
groupPurchase: "CommodityList.Item",
bargain: "CommodityList.Item",
secKill: "CommodityList.Item",
......
......@@ -9,10 +9,14 @@
}
.container {
background-color: #fff;
min-height: 200px;
min-height: 188px;
border-radius: 8px;
// margin-left: -12px;
.container-title {
color: #252D37;
font-weight: 600;
padding: 12px 12px 0px 12px;
}
.wrap {
padding: 12px;
......@@ -20,6 +24,30 @@
flex-direction: row;
flex-wrap: wrap;
margin-right: -12px;
margin-bottom: -12px;
}
.footer {
padding: 12px 0;
border-top: 1px solid rgba(0, 0, 0, 0.1);
margin: 0 12px;
display: flex;
flex-direction: row;
justify-content: space-between;
.footer-price {
color: #EF3346;
margin-right: 2px;
}
.footer-btn {
padding: 4px 12px;
line-height: 20px;
font-size: 14px;
color: #fff;
border-radius: 50px;
background-color: #ef3346;
}
}
}
......@@ -27,8 +55,10 @@
.empty {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.simple {
......@@ -37,9 +67,45 @@
padding-right: 12px;
// background-color: red;
display: flex;
margin-bottom: 12px;
.wrapClass {
height: 100%;
width: 100%;
}
}
.section {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
// justify-content: center;
// align-items: center;
.simple-product-image {
width: 104px;
height: 104px;
}
.simple-product-name {
color: #252D37;
margin-top: 4px;
font-size: 12px;
line-height: 16px;
overflow: hidden;
white-space: normal;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 3;
}
.simple-product-label {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
}
......@@ -38,8 +38,14 @@ const Combination: React.FC<Iprops> & { Item: typeof CombinationItem } = (props:
<div className={classNameStr} {...other}>
<p className={styles.title}>{title}</p>
<div className={styles.container}>
<div className={styles['container-title']}>以下商品认选2件,只需800元</div>
{renderChildren()}
<div className={styles.footer}>
<div className={styles['footer-price']}>¥99</div>
<div className={styles['footer-btn']}>立即购买</div>
</div>
</div>
</div>
)
......@@ -57,25 +63,22 @@ const CombinationItem: React.FC<any> = (props: any) => {
const isEmpty = typeof productName === 'undefined' && typeof id === 'undefined';
if (isEmpty) {
return (
<div className={cx(styles.simple, styles.empty)} >
<div className={wrapClass} {...divProps}>
<div className={cx(styles.simple)} >
<div className={cx(wrapClass, styles.empty)} {...divProps}>
<PlusOutlined />
</div>
</div>
);
}
const simpleData = {
productName: "",
image: productImgUrl,
// price: price,
// discount: (props as IsimpleProductItemProps).min || activityPrice,
};
return (
<div className={styles.simple}>
<div className={wrapClass} {...divProps}>
<SimpleCommodity {...simpleData} />
<img src={productImgUrl} className={styles['simple-product-image']}/>
<div className={styles['simple-product-name']}>{productName}</div>
<div className={styles['simple-product-label']}>
<CustomizeTag>800元2件</CustomizeTag>
</div>
</div>
</div>
);
......
......@@ -108,7 +108,6 @@ const CommodityItem: React.FC<Iprops> = (props: Iprops) => {
const { productName: name, productImgUrl: image, mode = "horizontal", price: originalPrice, discount, activityPrice, label, ...otherRestProps } = rest as any;
const withLabel = label ? {tags: [label]} : {};
console.log(rest);
const horizontalData = {
name,
image,
......
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