Commit faea484b authored by XieZhiXiong's avatar XieZhiXiong
parents 9fa96330 09899393
......@@ -3,7 +3,7 @@ import { history } from 'umi';
import { Button, Card, Tabs, message, Badge } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import {
SaveOutlined,
SaveOutlined,
EditFilled,
} from '@ant-design/icons'
import ReutrnEle from '@/components/ReturnEle'
......@@ -123,7 +123,7 @@ const AddProducts: React.FC<{}> = (props) => {
// 获取页面使用模板
const productDescriptionTemplate = async () => {
//@ts-ignore
PublicApi.getTemplateGoodsFindUseGoodsTemplate({ siteId }).then(res => {
PublicApi.getTemplateWebPageTemplateWebFindGoodsDescribeTemplate({ siteId }).then(res => {
if (res.code === 1000)
setCurrentTemplateName(res.data.fileName)
})
......@@ -169,10 +169,10 @@ const AddProducts: React.FC<{}> = (props) => {
_bacsicForm.customerCategoryId = _bacsicForm.customerCategoryId[_bacsicForm.customerCategoryId.length - 1]
// 移除描述中的空数组[]
let _productDescription = { ...productDescription }
for(let i in _productDescription){
if(_productDescription[i]?.length === 0){
delete _productDescription[i]
}
for(let i in _productDescription){
if(_productDescription[i]?.length === 0){
delete _productDescription[i]
}
}
let _params = {
..._bacsicForm,
......@@ -424,4 +424,4 @@ const AddProducts: React.FC<{}> = (props) => {
</PageHeaderWrapper>)
}
export default observer(AddProducts)
\ No newline at end of file
export default observer(AddProducts)
import React, { useRef } from 'react'
import { useCallback, useState, useEffect } from 'react'
import { usePageStatus } from '@/hooks/usePageStatus'
import { PublicApi } from '@/services/api'
import { Link } from 'umi'
import { GlobalConfig } from '@/global/config'
import { orderTypeLabel } from '../constant'
import { formatTimeString } from '@/utils'
import StatusColors from '../../../components/StatusColors'
import { message } from 'antd'
interface OrderDetailHookProps {
// 采购、销售
type: 'purchaseOrder' | 'saleOrder'
}
// 订单详情, 支持两种订单模式
export const useOrderDetail = (options: OrderDetailHookProps) => {
// 订单详情内容
const [formData, setFormData] = useState<any>(null)
// 当前的支付信息id 默认第一个
const [currentPayInfoId, setCurrentPayInfoId] = useState<any>(null)
// 支付信息列表
const [payList, setPaylist] = useState<any[]>([])
const { id } = usePageStatus()
const { type } = options
const dataRef = useRef<any>([
{ label: '对应报价单号', name: 'quotationNo', span: 8, render: text => <Link to={'/'}>{text}</Link> },
{ label: '订单摘要', name: 'orderThe', span: 8 },
{ label: type === 'saleOrder' ? '采购会员' : '供应会员', name: type === 'saleOrder' ? 'createMemberName' : 'supplyMembersName', span: 8 },
{ label: '下单模式', name: 'orderModel', span: 8, render: text => GlobalConfig.web.orderMode.find(v => v.value === text)?.label || '' },
{ label: '订单类型', name: 'type', span: 8, render: text => orderTypeLabel[text] },
{ label: '下单时间', name: 'createTime', span: 8, render: text => formatTimeString(text) },
{ label: '外部状态', name: 'externalState', span: 8, render: text => <StatusColors type='out' status={text}/> },
{ label: '内部状态', name: type === 'saleOrder' ? 'purchaseOrderInteriorState' : 'interiorState', span: 8, render: text => <StatusColors type={type === 'saleOrder' ? 'saleInside' : 'inside'} status={text}/> },
])
useEffect(() => {
reloadFormData()
// reloadPayList()
}, [])
const reloadFormData = useCallback(() => {
if (id) {
const fn = type === 'purchaseOrder' ? PublicApi.getOrderProcurementOrderDetails : PublicApi.getOrderPurchaseOrderDetails
fn({ id }, { ctlType: "none" }).then(res => {
const { code, data, message: msg } = res
if (code === 1000) {
setFormData(data)
if(data.paymentInformationResponses.length > 0){
setCurrentPayInfoId(data.paymentInformationResponses[0].id)
}
reloadPayList(data.supplyMembersId)
} else {
message.error(msg)
}
})
}
}, [id])
const reloadPayList = (memberId) => {
PublicApi.getPayPayWayList({memberId}).then(res => {
const { code, data } = res
if (code === 1000) {
setPaylist(data)
} else {
message.error(res.message)
}
})
}
// const reloadPayList = useCallback(() => {
// PublicApi.getPayPayWayList().then(res => {
// const { code, data } = res
// if (code === 1000) {
// setPaylist(data)
// }
// })
// }, [id])
// 需共享的状态
const formContext = {
data: formData,
currentPayInfoId,
payList,
ctl: {
setData: setFormData,
setPayId: setCurrentPayInfoId,
},
reloadFormData
}
return {
formContext,
id,
detailList: dataRef.current
}
}
\ No newline at end of file
import React, { useRef } from 'react'
import { useCallback, useState, useEffect } from 'react'
import { usePageStatus } from '@/hooks/usePageStatus'
import { PublicApi } from '@/services/api'
import { Link } from 'umi'
import { GlobalConfig } from '@/global/config'
import { orderTypeLabel } from '../constant'
import { formatTimeString } from '@/utils'
import StatusColors from '../../../components/StatusColors'
import { message } from 'antd'
interface OrderDetailHookProps {
// 采购、销售
type: 'purchaseOrder' | 'saleOrder'
}
// 订单详情, 支持两种订单模式
export const useOrderDetail = (options: OrderDetailHookProps) => {
// 订单详情内容
const [formData, setFormData] = useState<any>(null)
// 当前的支付信息id 默认第一个
const [currentPayInfoId, setCurrentPayInfoId] = useState<any>(null)
// 支付信息列表
const [payList, setPaylist] = useState<any[]>([])
const { id } = usePageStatus()
const { type } = options
const dataRef = useRef<any>([
{ label: '对应报价单号', name: 'quotationNo', span: 8, render: text => <Link to={'/'}>{text}</Link> },
{ label: '订单摘要', name: 'orderThe', span: 8 },
{ label: type === 'saleOrder' ? '采购会员' : '供应会员', name: type === 'saleOrder' ? 'createMemberName' : 'supplyMembersName', span: 8 },
{ label: '下单模式', name: 'orderModel', span: 8, render: text => GlobalConfig.web.orderMode.find(v => v.value === text)?.label || '' },
{ label: '订单类型', name: 'type', span: 8, render: text => orderTypeLabel[text] },
{ label: '下单时间', name: 'createTime', span: 8, render: text => formatTimeString(text) },
{ label: '外部状态', name: 'externalState', span: 8, render: text => <StatusColors type='out' status={text}/> },
{ label: '内部状态', name: type === 'saleOrder' ? 'purchaseOrderInteriorState' : 'interiorState', span: 8, render: text => <StatusColors type={type === 'saleOrder' ? 'saleInside' : 'inside'} status={text}/> },
])
useEffect(() => {
reloadFormData()
// reloadPayList()
}, [])
const reloadFormData = useCallback(() => {
if (id) {
const fn = type === 'purchaseOrder' ? PublicApi.getOrderProcurementOrderDetails : PublicApi.getOrderPurchaseOrderDetails
fn({ id }, { ctlType: "none" }).then(res => {
const { code, data, message: msg } = res
if (code === 1000) {
setFormData(data)
if(data.paymentInformationResponses.length > 0){
setCurrentPayInfoId(data.paymentInformationResponses[0].id)
}
reloadPayList(data.supplyMembersId, data.supplyMembersRoleId)
} else {
message.error(msg)
}
})
}
}, [id])
const reloadPayList = (memberId, memberRoleId) => {
PublicApi.getPayPayWayList({memberId, memberRoleId}).then(res => {
const { code, data } = res
if (code === 1000) {
setPaylist(data)
} else {
message.error(res.message)
}
})
}
// const reloadPayList = useCallback(() => {
// PublicApi.getPayPayWayList().then(res => {
// const { code, data } = res
// if (code === 1000) {
// setPaylist(data)
// }
// })
// }, [id])
// 需共享的状态
const formContext = {
data: formData,
currentPayInfoId,
payList,
ctl: {
setData: setFormData,
setPayId: setCurrentPayInfoId,
},
reloadFormData
}
return {
formContext,
id,
detailList: dataRef.current
}
}
import React, { useContext, useEffect, useState } from 'react'
import style from './index.less'
import { Tabs, Row, Col } from 'antd'
import { OrderDetailContext } from '../../_public/order/context'
import MellowCard from '@/components/MellowCard'
import StatusColors from '../StatusColors'
export interface OrderPayTabsProps {}
const TabPane = Tabs.TabPane
const TabHeader = ({dataSource}) => {
return <Row justify='space-between' style={{minWidth: 216}}>
<Col>
<div className={style.fontGray}>支付比例</div>
<div className={style.bignumber}>{dataSource.payRatio}%</div>
<div className={style.smallnumber}>{dataSource.payPrice || 0}</div>
</Col>
<Col>
<StatusColors status={dataSource.externalState} type='payOut'/>
</Col>
</Row>
}
// 支付信息
const payTextList = ["",
'线上支付',
'线下支付',
'授信支付',
'货到付款'
]
const OrderPayTabs:React.FC<OrderPayTabsProps> = (props) => {
const { data, payList, ctl } = useContext(OrderDetailContext)
const onChange = (activeKey) => {
ctl.setPayId(activeKey)
}
return (
<MellowCard style={{marginTop: 24}} bordered={false}>
<Tabs defaultActiveKey='1' onChange={onChange}>
{ data.paymentInformationResponses && data.paymentInformationResponses.map(v => <TabPane key={v.id} tab={<TabHeader dataSource={v}/>}>
<Row>
<Col className={style.fontGray} span={4}>支付环节: </Col>
<Col>{v.payNode}</Col>
</Row>
<Row>
<Col className={style.fontGray} span={4}>支付方式: </Col>
<Col>{payTextList[v.payWay]}</Col>
</Row>
<Row>
<Col className={style.fontGray} span={4}>支付渠道: </Col>
<Col>{payList.find(j => j.id === v.channel)?.way}</Col>
</Row>
</TabPane>) }
</Tabs>
</MellowCard>
)
}
OrderPayTabs.defaultProps = {}
export default OrderPayTabs
\ No newline at end of file
import React, { useContext, useEffect, useState } from 'react'
import style from './index.less'
import { Tabs, Row, Col } from 'antd'
import { OrderDetailContext } from '../../_public/order/context'
import MellowCard from '@/components/MellowCard'
import StatusColors from '../StatusColors'
export interface OrderPayTabsProps {}
const TabPane = Tabs.TabPane
const TabHeader = ({dataSource}) => {
return <Row justify='space-between' style={{minWidth: 216}}>
<Col>
<div className={style.fontGray}>支付比例</div>
<div className={style.bignumber}>{dataSource.payRatio}%</div>
<div className={style.smallnumber}>{dataSource.payPrice || 0}</div>
</Col>
<Col>
<StatusColors status={dataSource.externalState} type='payOut'/>
</Col>
</Row>
}
// 支付信息
const payTextList = ["",
'线上支付',
'线下支付',
'授信支付',
'货到付款'
]
const OrderPayTabs:React.FC<OrderPayTabsProps> = (props) => {
const { data, payList, ctl } = useContext(OrderDetailContext)
useEffect(() => {
// 过滤支付信息 取第一个待支付的id
if(data?.paymentInformationResponses?.length) {
let payments = data.paymentInformationResponses.filter(item => item.externalState === 1)
if(payments.length) {
ctl.setPayId(payments[0].id)
}
}
}, [])
const onChange = (activeKey) => {
// ctl.setPayId(activeKey)
}
return (
<MellowCard style={{marginTop: 24}} bordered={false}>
<Tabs defaultActiveKey='1' onChange={onChange}>
{ data.paymentInformationResponses && data.paymentInformationResponses.map(v => <TabPane key={v.id} tab={<TabHeader dataSource={v}/>}>
<Row>
<Col className={style.fontGray} span={4}>支付环节: </Col>
<Col>{v.payNode}</Col>
</Row>
<Row>
<Col className={style.fontGray} span={4}>支付方式: </Col>
<Col>{payTextList[v.payWay]}</Col>
</Row>
<Row>
<Col className={style.fontGray} span={4}>支付渠道: </Col>
<Col>{payList.find(j => j.id === v.channel)?.way}</Col>
</Row>
</TabPane>) }
</Tabs>
</MellowCard>
)
}
OrderPayTabs.defaultProps = {}
export default OrderPayTabs
import React, { useEffect } from 'react'
import ModalTable, { ModalTableProps } from '@/components/ModalTable'
import { fetchOrderApi } from '../../apis'
import { useModalTable } from '../../model/useModalTable'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { inquiryColumns } from '../../../readyAddOrder/constant'
import { PublicApi } from '@/services/api'
export interface DemandModalTableProps extends ModalTableProps {
type?: 'radio' | 'checkbox',
schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
currentRef?: any,
confirmModal?()
}
// 需求报价单弹窗
const DemandModalTable:React.FC<DemandModalTableProps> = (props) => {
const { type = 'radio', schemaAction, confirmModal, currentRef, ...restProps } = props
const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type})
useEffect(() => {
if (currentRef) {
currentRef.current = {
setVisible,
visible,
rowSelectionCtl
}
}
}, [])
const handleConfirm = async () => {
const item = rowSelectionCtl.selectRow[0]
console.log(item, '看需求报价item有没有member信息')
if (item) {
schemaAction.setFieldValue('quotationNo', item.quotationNo)
const data = await fetchOrderApi.getProductListByDemandOrderId({
id: item.id
})
schemaAction.setFieldValue('orderProductRequests', data)
schemaAction.setFieldValue('supplyMembersName', item.offerMemberName)
schemaAction.setFieldValue('supplyMembersId', item.offerMemberId)
schemaAction.setFieldValue('supplyMembersRoleId', item.offerMemberRoleId)
// 需求单回显订单明细
schemaAction.setFieldValue('orderThe', item.quotationSummary)
}
confirmModal && confirmModal()
setVisible(false)
}
return (
<ModalTable
modalTitle='选择需求报价单'
columns={inquiryColumns}
visible={visible}
confirm={handleConfirm}
cancel={() => setVisible(false)}
fetchTableData={async (params) => (await PublicApi.getOrderConfirmationQuotationList({...params, externalState: 5})).data}
rowSelection={rowSelection}
modalType='demandByDefault'
tableProps={{
rowKey: 'id'
}}
{...restProps}
/>
)
}
DemandModalTable.defaultProps = {}
export default DemandModalTable
\ No newline at end of file
import React, { useEffect } from 'react'
import ModalTable, { ModalTableProps } from '@/components/ModalTable'
import { fetchOrderApi } from '../../apis'
import { useModalTable } from '../../model/useModalTable'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { inquiryColumns } from '../../../readyAddOrder/constant'
import { PublicApi } from '@/services/api'
import { filterProductDataById } from '../productModalTable'
export interface DemandModalTableProps extends ModalTableProps {
type?: 'radio' | 'checkbox',
schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
currentRef?: any,
confirmModal?()
}
// 需求报价单弹窗
const DemandModalTable:React.FC<DemandModalTableProps> = (props) => {
const { type = 'radio', schemaAction, confirmModal, currentRef, ...restProps } = props
const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type})
useEffect(() => {
if (currentRef) {
currentRef.current = {
setVisible,
visible,
rowSelectionCtl
}
}
}, [])
const handleConfirm = async () => {
const item = rowSelectionCtl.selectRow[0]
if (item) {
schemaAction.setFieldValue('quotationNo', item.quotationNo)
const data = await fetchOrderApi.getProductListByDemandOrderId({
id: item.id
})
// schemaAction.setFieldValue('orderProductRequests', data)
// 把地址信息冗余给商品字段render
schemaAction.setFieldValue('orderProductRequests', await filterProductDataById([], data))
schemaAction.setFieldValue('supplyMembersName', item.offerMemberName)
schemaAction.setFieldValue('supplyMembersId', item.offerMemberId)
schemaAction.setFieldValue('supplyMembersRoleId', item.offerMemberRoleId)
// 需求单回显订单明细
schemaAction.setFieldValue('orderThe', item.quotationSummary)
}
confirmModal && confirmModal()
setVisible(false)
}
return (
<ModalTable
modalTitle='选择需求报价单'
columns={inquiryColumns}
visible={visible}
confirm={handleConfirm}
cancel={() => setVisible(false)}
fetchTableData={async (params) => (await PublicApi.getOrderConfirmationQuotationList({...params, externalState: 5})).data}
rowSelection={rowSelection}
modalType='demandByDefault'
tableProps={{
rowKey: 'id'
}}
{...restProps}
/>
)
}
DemandModalTable.defaultProps = {}
export default DemandModalTable
import React, { useEffect } from 'react'
import ModalTable, { ModalTableProps } from '@/components/ModalTable'
import { fetchOrderApi } from '../../apis'
import { useModalTable } from '../../model/useModalTable'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { inquiryColumns } from '../../constant'
import { PublicApi } from '@/services/api'
export interface InquiryModalTableProps extends ModalTableProps {
type?: 'radio' | 'checkbox',
schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
currentRef?: any,
confirmModal?()
}
// 报价单弹窗
const InquiryModalTable:React.FC<InquiryModalTableProps> = (props) => {
const { type = 'radio', schemaAction, confirmModal, currentRef, ...restProps } = props
const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type})
useEffect(() => {
if (currentRef) {
currentRef.current = {
setVisible,
visible,
rowSelectionCtl
}
}
}, [])
const handleConfirm = async () => {
const item = rowSelectionCtl.selectRow[0]
console.log(item, '看询价报价item有没有member信息')
if (item) {
schemaAction.setFieldValue('quotationNo', item.quotationNo)
const data = await fetchOrderApi.getProductListByQuotationOrderId({
id: item.inquiryListId
})
// 将询价报价单的id字段 冗余给商品列表
schemaAction.setFieldValue('orderProductRequests', data.map((v: any) => {
v.memberId = item.offerMemberId
v.memberRoleId = item.offerMemberRoleId
return v
}))
schemaAction.setFieldValue('supplyMembersName', item.offerMemberName)
schemaAction.setFieldValue('supplyMembersId', item.offerMemberId)
schemaAction.setFieldValue('supplyMembersRoleId', item.offerMemberRoleId)
// 询价单回显订单明细
schemaAction.setFieldValue('orderThe', item.details)
}
confirmModal && confirmModal()
setVisible(false)
}
return (
<ModalTable
modalTitle='选择询价报价单'
columns={inquiryColumns}
visible={visible}
confirm={handleConfirm}
cancel={() => setVisible(false)}
fetchTableData={async (params) => (await PublicApi.getOrderNotarizeEnquiryProductQuotationList({...params, externalState: 4}, {useCache: true, ttl: 10 * 1000})).data}
rowSelection={rowSelection}
modalType='inquiryByDefault'
tableProps={{
rowKey: 'id'
}}
{...restProps}
/>
)
}
InquiryModalTable.defaultProps = {}
export default InquiryModalTable
\ No newline at end of file
import React, { useEffect } from 'react'
import ModalTable, { ModalTableProps } from '@/components/ModalTable'
import { fetchOrderApi } from '../../apis'
import { useModalTable } from '../../model/useModalTable'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { inquiryColumns } from '../../constant'
import { PublicApi } from '@/services/api'
import { filterProductDataById } from '../productModalTable'
export interface InquiryModalTableProps extends ModalTableProps {
type?: 'radio' | 'checkbox',
schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
currentRef?: any,
confirmModal?()
}
// 报价单弹窗
const InquiryModalTable:React.FC<InquiryModalTableProps> = (props) => {
const { type = 'radio', schemaAction, confirmModal, currentRef, ...restProps } = props
const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type})
useEffect(() => {
if (currentRef) {
currentRef.current = {
setVisible,
visible,
rowSelectionCtl
}
}
}, [])
const handleConfirm = async () => {
const item = rowSelectionCtl.selectRow[0]
if (item) {
schemaAction.setFieldValue('quotationNo', item.quotationNo)
const data = await fetchOrderApi.getProductListByQuotationOrderId({
id: item.inquiryListId
})
// 将询价报价单的id字段 冗余给商品列表
// schemaAction.setFieldValue('orderProductRequests', data.map((v: any) => {
// v.memberId = item.offerMemberId
// v.memberRoleId = item.offerMemberRoleId
// return v
// }))
let newData = data.map((v: any) => {
v.memberId = item.offerMemberId
v.memberRoleId = item.offerMemberRoleId
return v
})
// 把地址信息冗余给商品字段render
schemaAction.setFieldValue('orderProductRequests', await filterProductDataById([], newData))
schemaAction.setFieldValue('supplyMembersName', item.offerMemberName)
schemaAction.setFieldValue('supplyMembersId', item.offerMemberId)
schemaAction.setFieldValue('supplyMembersRoleId', item.offerMemberRoleId)
// 询价单回显订单明细
schemaAction.setFieldValue('orderThe', item.details)
}
confirmModal && confirmModal()
setVisible(false)
}
return (
<ModalTable
modalTitle='选择询价报价单'
columns={inquiryColumns}
visible={visible}
confirm={handleConfirm}
cancel={() => setVisible(false)}
fetchTableData={async (params) => (await PublicApi.getOrderNotarizeEnquiryProductQuotationList({...params, externalState: 4}, {useCache: true, ttl: 10 * 1000})).data}
rowSelection={rowSelection}
modalType='inquiryByDefault'
tableProps={{
rowKey: 'id'
}}
{...restProps}
/>
)
}
InquiryModalTable.defaultProps = {}
export default InquiryModalTable
import { paymentInformationColumns } from '../constant'
import { PayInfoCell, EditableRow } from '../components/payInfoTableCell'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { useEffect, useState, useRef, useContext } from 'react'
import { PublicApi } from '@/services/api'
import { ReadyAddOrderDetailContext } from '../../context'
import { message } from 'antd'
export const usePaymentInfo = (ctx: ISchemaFormActions | ISchemaFormAsyncActions, memberId: any, orderProducts: any): any => {
const paywayData = useRef<any>({})
const [columns, setColumns] = useState<any[]>(paymentInformationColumns)
const { productSumPrice } = useContext(ReadyAddOrderDetailContext)
const components = {
body: {
row: EditableRow,
cell: PayInfoCell
},
}
const initPayWayList = (data) => {
if (!data) {
return []
}
let result = []
for (let item of data) {
if (result.some(tempItem => tempItem.payType === item.payType)) {
result = result.map(resItem => {
if (resItem.payType === item.payType) {
resItem.payList = [...resItem.payList, item]
}
return resItem
})
} else {
let payVal = ""
switch (item.payType) {
case 1:
payVal = "线上支付"
break
case 2:
payVal = "线下支付"
break
case 3:
payVal = "授信支付"
break
case 4:
payVal = "货到付款"
break
}
result.push({
payVal,
payType: item.payType,
payList: [item]
})
}
}
return result
}
// useEffect(() => {
// PublicApi.getPayPayWayList().then(res => {
// const { code, data } = res
// if (code === 1000) {
// const newColumns = [...columns]
// newColumns[5].formItemProps.options = initPayWayList(data)
// paywayData.current = data
// setColumns(newColumns)
// }
// })
// }, [])
useEffect(() => {
// 当选择报价单/会员/商品时有memberId传入时 调用支付方式api
if(memberId) {
getPayLists(memberId)
}
}, [memberId])
useEffect(() => {
// 当有商品数据传入的时 判断商品只有是物流的才能使用到付
if(orderProducts?.length) {
const newColumns = [...columns]
let options = newColumns[5].formItemProps.options
if(orderProducts.filter(item => item.deliveryType === 1).length !== orderProducts.length) {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = true
} else {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = false
}
}
}, [orderProducts, columns])
const getPayLists = (memberId) => {
PublicApi.getPayPayWayList({memberId}).then(res => {
const { code, data } = res
if (code === 1000) {
const newColumns = [...columns]
newColumns[5].formItemProps.options = initPayWayList(data)
paywayData.current = data
setColumns(newColumns)
} else {
message.error(res.message)
}
})
}
const handleSave = row => {
return new Promise((resolve, reject) => {
const newData = [...ctx.getFieldValue('paymentInformationResponses')];
const index = newData.findIndex(item => row.payCount === item.payCount);
const item = newData[index];
newData.splice(index, 1, {
...item,
...row,
});
ctx.setFieldValue('paymentInformationResponses', newData)
resolve({item, newData})
})
};
return [
columns,
components,
handleSave
]
}
import { paymentInformationColumns } from '../constant'
import { PayInfoCell, EditableRow } from '../components/payInfoTableCell'
import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
import { useEffect, useState, useRef, useContext } from 'react'
import { PublicApi } from '@/services/api'
import { ReadyAddOrderDetailContext } from '../../context'
import { message } from 'antd'
export const usePaymentInfo = (ctx: ISchemaFormActions | ISchemaFormAsyncActions, memberId: any, memberRoleId: any, orderProducts: any): any => {
const paywayData = useRef<any>({})
const [columns, setColumns] = useState<any[]>(paymentInformationColumns)
const { productSumPrice } = useContext(ReadyAddOrderDetailContext)
const components = {
body: {
row: EditableRow,
cell: PayInfoCell
},
}
const initPayWayList = (data) => {
if (!data) {
return []
}
let result = []
for (let item of data) {
if (result.some(tempItem => tempItem.payType === item.payType)) {
result = result.map(resItem => {
if (resItem.payType === item.payType) {
resItem.payList = [...resItem.payList, item]
}
return resItem
})
} else {
let payVal = ""
switch (item.payType) {
case 1:
payVal = "线上支付"
break
case 2:
payVal = "线下支付"
break
case 3:
payVal = "授信支付"
break
case 4:
payVal = "货到付款"
break
}
result.push({
payVal,
payType: item.payType,
payList: [item]
})
}
}
return result
}
// useEffect(() => {
// PublicApi.getPayPayWayList().then(res => {
// const { code, data } = res
// if (code === 1000) {
// const newColumns = [...columns]
// newColumns[5].formItemProps.options = initPayWayList(data)
// paywayData.current = data
// setColumns(newColumns)
// }
// })
// }, [])
useEffect(() => {
// 当选择报价单/会员/商品时有memberId传入时 调用支付方式api
if(memberId) {
getPayLists(memberId, memberRoleId)
}
}, [memberId])
useEffect(() => {
// 当有商品数据传入的时 判断商品只有是物流的才能使用到付
if(orderProducts?.length) {
const newColumns = [...columns]
let options = newColumns[5].formItemProps.options
if(orderProducts.filter(item => item.deliveryType === 1).length !== orderProducts.length) {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = true
} else {
if(options.filter(_item => _item.payType === 4).length)
options.filter(_item => _item.payType === 4)[0].disabled = false
}
}
}, [orderProducts, columns])
const getPayLists = (memberId, memberRoleId) => {
PublicApi.getPayPayWayList({memberId, memberRoleId}).then(res => {
const { code, data } = res
if (code === 1000) {
const newColumns = [...columns]
newColumns[5].formItemProps.options = initPayWayList(data)
paywayData.current = data
setColumns(newColumns)
} else {
message.error(res.message)
}
})
}
const handleSave = row => {
return new Promise((resolve, reject) => {
const newData = [...ctx.getFieldValue('paymentInformationResponses')];
const index = newData.findIndex(item => row.payCount === item.payCount);
const item = newData[index];
newData.splice(index, 1, {
...item,
...row,
});
ctx.setFieldValue('paymentInformationResponses', newData)
resolve({item, newData})
})
};
return [
columns,
components,
handleSave
]
}
import React, { useState, useCallback, useRef, useContext, useEffect } from 'react';
import { OrderDetailContext } from '../../../_public/order/context';
import { PublicApi } from '@/services/api';
import { Button } from 'antd';
import OrderDetailHeader from '@/pages/transaction/components/OrderDetailHeader';
import OrderDetailWrapper from '@/pages/transaction/components/OrderDetailWrapper';
import PreLoading from '@/components/PreLoading';
import { useOrderDetail } from '../../../_public/order/effects/useOrderDetail';
import OrderDetailSection from '../../../components/orderDetailSection';
import OrderPayModal from '@/pages/transaction/components/orderPayModal';
const ReadyConfirmContract: React.FC = () => {
const { formContext, id, detailList } = useOrderDetail({type: 'purchaseOrder'})
const payRef = useRef<any>({})
const handleClick = useCallback(() => {
payRef.current.setVisible(true)
}, [])
const renderPayPrice = () => {
const {data, currentPayInfoId} = formContext
if(data){
if(data.paymentInformationResponses.length > 0){
let obj = data.paymentInformationResponses.filter(item => item.id === Number(currentPayInfoId))[0]
if(obj)
return obj.payPrice
}
}
}
return (
<div>
<OrderDetailContext.Provider value={formContext}>
<OrderDetailHeader detailList={detailList} detailData={formContext.data} extraRight={
<>
<Button type='primary' onClick={handleClick}>
去支付
</Button>
<div style={{ textAlign: 'right' }}>
<p style={{ marginTop: 12, fontSize: 12, color: '#6B778C' }}>本次需支付</p>
{/* { formContext.data && <p>¥{formContext.data.sumPrice}</p> } */}
{ formContext.data && <p>{ renderPayPrice() }</p> }
</div>
</>
} />
<OrderDetailWrapper>
<PreLoading loading={!formContext.data} active paragraph={{rows: 6}}>
<OrderDetailSection formContext={formContext}/>
</PreLoading>
</OrderDetailWrapper>
{/* 提交时触发的弹窗集合 */}
<OrderPayModal
currentRef={payRef}
/>
</OrderDetailContext.Provider>
</div>
);
};
export default ReadyConfirmContract;
\ No newline at end of file
import React, { useState, useCallback, useRef, useContext, useEffect } from 'react';
import { OrderDetailContext } from '../../../_public/order/context';
import { PublicApi } from '@/services/api';
import { Button } from 'antd';
import OrderDetailHeader from '@/pages/transaction/components/OrderDetailHeader';
import OrderDetailWrapper from '@/pages/transaction/components/OrderDetailWrapper';
import PreLoading from '@/components/PreLoading';
import { useOrderDetail } from '../../../_public/order/effects/useOrderDetail';
import OrderDetailSection from '../../../components/orderDetailSection';
import OrderPayModal from '@/pages/transaction/components/orderPayModal';
const ReadyConfirmContract: React.FC = () => {
const { formContext, id, detailList } = useOrderDetail({type: 'purchaseOrder'})
const payRef = useRef<any>({})
const handleClick = useCallback(() => {
payRef.current.setVisible(true)
}, [])
const renderPayPrice = () => {
const {data, currentPayInfoId} = formContext
if(data){
if(data.paymentInformationResponses.length > 0){
let obj = data.paymentInformationResponses.filter(item => item.id === Number(currentPayInfoId))[0]
if(obj)
return obj.payPrice
}
}
}
return (
<div>
<OrderDetailContext.Provider value={formContext}>
<OrderDetailHeader detailList={detailList} detailData={formContext.data} extraRight={
<>
<Button type='primary' onClick={handleClick}>
去支付
</Button>
<div style={{ textAlign: 'right' }}>
<p style={{ marginTop: 12, fontSize: 12, color: '#6B778C' }}>本次需支付</p>
{/* { formContext.data && <p>¥{formContext.data.sumPrice}</p> } */}
{ formContext.data && <p>{ renderPayPrice() }</p> }
</div>
</>
} />
<OrderDetailWrapper>
<PreLoading loading={!formContext.data} active paragraph={{rows: 6}}>
<OrderDetailSection formContext={formContext}/>
</PreLoading>
</OrderDetailWrapper>
{/* 提交时触发的弹窗集合 */}
<OrderPayModal
currentRef={payRef}
/>
</OrderDetailContext.Provider>
</div>
);
};
export default ReadyConfirmContract;
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