Commit 96e424f3 authored by 前端-钟卫鹏's avatar 前端-钟卫鹏

fix: 对接支付宝支付

parent 76cd49aa
......@@ -31,6 +31,12 @@ export const useOrderDetail = (options: OrderDetailHookProps) => {
{text}
</Link>
},
// // @todo单独处理请购单
// { label: '对应请购单号', name: 'requisitionNo', span: 8, render: (text, record) => <Link
// to={`/memberCenter/procurementAbility/purchaseRequisition/purchaseRequisitionList/preview?id=${record?.quoteId}`}>
// {text}
// </Link>
// },
{ label: '订单摘要', name: 'digest', span: 8 },
{ label: type[0] === 's' ? '采购会员' : '供应会员', name: type[0] === 's' ? 'buyerMemberName' : 'vendorMemberName', span: 8 },
{ label: '下单模式', name: 'orderModeName', span: 8 },
......@@ -62,7 +68,6 @@ export const useOrderDetail = (options: OrderDetailHookProps) => {
// 根据type类型 调用不同的详情接口
const getDetailsApi = (type) => {
let api = null;
console.log(type, 'type')
switch (type) {
case 'purchaseOrder': api = PublicApi.getOrderBuyerDetail;
break;
......
......@@ -124,6 +124,9 @@
height: 100%;
}
}
.qrCodeAlipayImage {
text-align: center;
}
.scanTips {
display: flex;
......
......@@ -39,7 +39,8 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
const mobilePayFlag = useRef(0) // 用于判断移动支付类型 4微信6支付宝
const [qrLoading, setQrLoading] = useState(false)
const [code, setCode] = useState('')
const [qrCodeInfo, setQrCodeInfo] = useState({ generateCharacter: '', qrUrl: '' })
const [qrCodeInfo, setQrCodeInfo] = useState({ generateCharacter: '', qrUrl: '' }) // 微信qrcode
const [qrCodeIframe, setQrCodeIframe] = useState('') // 支付宝iframe
const [number, setNumber] = useState([0,1,2,3,4,5])
const { currentRef, confirm } = props
const [isSpin, setIsSpin] = useState<boolean>(false)
......@@ -93,19 +94,28 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
}, [qrCodeInfo.generateCharacter])
const generateQrCode = () => {
// 生成二维码
QRCode.toDataURL(qrCodeInfo.generateCharacter).then((url:any) => {
setQrCodeInfo({...qrCodeInfo, qrUrl: url})
// 轮询支付结果
setOpenTimer(1)
})
.catch((err:any) => {
console.error(err)
})
// 微信 生成二维码
if(mobilePayFlag.current === 4) {
QRCode.toDataURL(qrCodeInfo.generateCharacter).then((url:any) => {
setQrCodeInfo({...qrCodeInfo, qrUrl: url})
// // 轮询支付结果
// setOpenTimer(1)
})
.catch((err:any) => {
console.error(err)
})
} else if(mobilePayFlag.current === 6) {
// 支付宝 生成iframe
setQrCodeIframe(qrCodeInfo.generateCharacter)
// // 轮询支付结果
// setOpenTimer(1)
}
// 轮询支付结果
setOpenTimer(1)
}
const pollPayResult = () => {
if(qrCodeInfo.qrUrl) {
if(qrCodeInfo.qrUrl || qrCodeIframe) {
// @ts-ignore
PublicApi.getOrderBuyerValidatePayResult({orderId: id, batchNo: currentPaymentInfo.batchNo, tradeNo}).then(res => {
const { code, data } = res
......@@ -522,7 +532,7 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
}
{/* 微信扫码支付 */}
{
(current === 4 || current === 6) &&
current === 4 &&
<div>
<Spin spinning={qrLoading}>
<div className={style.qrCodeImage}>
......@@ -539,6 +549,23 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
</Spin>
</div>
}
{/* 支付宝模式 */}
{
current === 6 &&
<div>
<Spin spinning={qrLoading}>
<div className={style.qrCodeAlipayImage}>
<div style={{width: 600, height: 300}}>
{
qrCodeIframe && <>
<iframe id='alipayIframe' srcDoc={qrCodeIframe} width={600} height={300} frameBorder={0} />
</>
}
</div>
</div>
</Spin>
</div>
}
{/* 输入支付密码 payStep===2 */}
{
payStep === 2 &&
......
......@@ -298,7 +298,7 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
id: params.deliveryAddresId?.id || params.deliveryAddresId
})
params.consignee = {
deliverDate: params.deliverDate,
// deliverDate: params.deliverDate,
consigneeId: addressDetail.id,
consignee: addressDetail.receiverName,
provinceCode: addressDetail.provinceCode,
......@@ -311,10 +311,11 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
telephone: addressDetail.tel,
defaultConsignee: !!addressDetail.isDefault,
}
if(params?.timeLine) {
params.consignee.startTime = params.timeLine.split('-')[0]
params.consignee.endTime = params.timeLine.split('-')[1]
}
}
if(params?.timeLine) {
params.consignee.startTime = params.timeLine.split('-')[0]
params.consignee.endTime = params.timeLine.split('-')[1]
}
// 其他需求
......
......@@ -11,11 +11,12 @@ import { PublicApi } from '@/services/api'
const SelectStyles = styled((props) => <div className='select-list' {...props}></div>)`
.select_style_border {
border: 1px solid #EEF0F3;
margin-top: 20px;
// margin-top: 20px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 14px;
flex: 1;
cursor: pointer;
line-height: 28px;
position:relative;
......@@ -113,11 +114,11 @@ const SelectAddress = (props: ISchemaFieldComponentProps) => {
}
return (
<div style={{ width: '100%' }}>
{editable && <Button block onClick={handleAdd} icon={<PlusOutlined />}>新建地址</Button>}
<SelectStyles>
<div style={{ width: '100%'}}>
{/* {editable && <Button block onClick={handleAdd} icon={<PlusOutlined />}>新建地址</Button>} */}
<SelectStyles><Row gutter={[16, 16]} style={{width: '100%'}}>
{
showDataSource.map(v => <div key={v.id} onClick={() => handleCheck(v)} className={cx('select_style_border', checkedId === v.id ? 'active' : '')}>
showDataSource.map(v => <Col span={12}><div key={v.id} onClick={() => handleCheck(v)} className={cx('select_style_border', checkedId === v.id ? 'active' : '')}>
<div>
<Row style={{ color: '#303133' }}>
<Col>{v.receiverName}</Col>
......@@ -137,11 +138,20 @@ const SelectAddress = (props: ISchemaFieldComponentProps) => {
<EyeOutlined onClick={(e) => handleEdit(v, e, 'preview')} />
}
</Space>
</div>)
</div></Col>)
}
</SelectStyles>
{editable && <Col span={12}>
<div
className='select_style_border'
style={{width: '100%', height: '100%', borderStyle: "dashed"}}
onClick={handleAdd}
>
<p style={{width: '100%', textAlign: 'center'}}><PlusOutlined />&nbsp;新增地址</p>
</div>
</Col>}
</Row></SelectStyles>
{transformData.length > 3 &&
<div onClick={toogleMore} style={{ textAlign: 'center', cursor: 'pointer' }}>
<div onClick={toogleMore} style={{ textAlign: 'center', cursor: 'pointer', color: '#00b37a' }}>
显示更多{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</div>
}
......
......@@ -13,9 +13,9 @@
.invoice_list {
position: relative;
display: flex;
// display: flex;
margin: 0 -10px;
flex-wrap: wrap;
// flex-wrap: wrap;
.invoice_list_item {
display: flex;
......@@ -70,6 +70,18 @@
}
}
.select_style_border {
border: 1px solid #EEF0F3;
// display: flex;
// align-items: center;
// justify-content: space-between;
// padding: 8px 14px;
// flex: 1;
// cursor: pointer;
// line-height: 28px;
// position:relative;
}
:global {
span.ant-radio+* {
display: block;
......@@ -82,7 +94,7 @@
align-items: center;
height: 72px;
background-color: #FAFAFA;
margin: 10px;
// margin: 10px;
padding-left: 16px;
}
......@@ -105,4 +117,4 @@
}
}
}
\ No newline at end of file
}
import React, { useState, useRef } from 'react'
import { ISchemaFieldComponentProps, useFieldState } from '@formily/antd'
import { Button, Radio } from 'antd'
import { Col, Radio, Row } from 'antd'
import { PlusOutlined, CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons'
import cx from 'classnames'
import { fetchOrderApi } from '../../apis'
......@@ -150,11 +150,12 @@ const TheInvoiceList = (props: ISchemaFieldComponentProps) => {
return (
<div style={{width: '100%'}} className={styles.invoice}>
{ editable && <Button block onClick={handleAdd} icon={<PlusOutlined/>}>新增发票</Button> }
{/* { editable && <Button block onClick={handleAdd} icon={<PlusOutlined/>}>新增发票</Button> } */}
<Radio.Group className={styles.raido_group} value={useValue} onChange={e => handleCheck(e)}>
<div className={styles.invoice_list}>
<Row gutter={[16, 16]}>
{
showDataSource.map((item, index) => (
showDataSource.map((item, index) => (<Col span={12}>
<Radio className={styles.list_radio} value={item} key={`address_list_radio_${item?.id}`}>
<div className={styles.invoice_list_item} key={`invoice_list_item_${index}`}>
<div className={styles.invoice_list_item_content}>
......@@ -183,13 +184,22 @@ const TheInvoiceList = (props: ISchemaFieldComponentProps) => {
}
</div>
</Radio>
))
</Col>))
}
{ editable && <Col span={12}>
<div
className={styles.select_style_border}
style={{width: '100%', height: '100%', borderStyle: "dashed"}}
onClick={handleAdd}
>
<p style={{width: '100%', textAlign: 'center', fontSize: 12, marginTop: 14}}><PlusOutlined />&nbsp;新增发票</p>
</div>
</Col> }
</Row>
</div>
</Radio.Group>
{ transformData.length > 3 &&
<div onClick={toogleMore} style={{textAlign: 'center', cursor: 'pointer'}}>
<div onClick={toogleMore} style={{textAlign: 'center', cursor: 'pointer', color: '#00b37a'}}>
显示更多{showMore ? <CaretDownOutlined /> : <CaretUpOutlined/>}
</div>
}
......
......@@ -137,6 +137,7 @@ export const useOrderDeliverTimeEffect = async (ctx: ISchemaFormActions | ISchem
})
ctx.setFieldState('timeLine', state => {
if(data.paramList?.length) {
state.visible = true
state.props.enum = data.paramList.map(item => ({label: `${item.startTime}-${item.endTime}`, value: `${item.startTime}-${item.endTime}`}))
} else {
state.visible = false
......
import React, { useRef, useState, useEffect } from 'react'
import { history } from 'umi'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import ReutrnEle from '@/components/ReturnEle'
import { usePageStatus, PageStatus } from '@/hooks/usePageStatus'
import { Button, Card, Row, Col, message } from 'antd'
import { Button, Row, Col, message } from 'antd'
import { createFormActions, registerVirtualBox, useFormSpy } from '@formily/antd'
import { SaveOutlined, PlusOutlined, LinkOutlined } from '@ant-design/icons'
import NiceForm from '@/components/NiceForm'
......@@ -20,13 +18,15 @@ import { useProductTable } from './model/useProductTable'
import styled from 'styled-components'
import { useUpdate } from '@umijs/hooks'
import { PublicApi } from '@/services/api'
import { changeRouterTitleByStatus } from '../../_public/order/utils'
import { ReadyAddOrderDetailContext } from '../context'
import { help } from '../../common'
import styles from './index.less'
import { fetchOrderApi } from './apis'
import MemberModalTable from './components/memberModalTable'
import { GlobalConfig } from '@/global/config'
import { FormDetailContext } from '@/formSchema/context'
import FormDetailHeader from '@/components/FormDetailHeader'
import FormDetailWrapper from '@/components/FormDetailWrapper'
import { useFormDetail } from '@/formSchema/effects/useFormDetail'
export interface AgentOrderDetailProps {}
......@@ -130,6 +130,9 @@ const AgentOrderDetail:React.FC<AgentOrderDetailProps> = () => {
}
return resultState
})
const { formContext } = useFormDetail()
const [products, setProducts] = useState<any>([])
const [paymentColumns, paymentComponents, paymentSave] = usePaymentInfo(
addSchemaAction,
......@@ -270,12 +273,13 @@ const AgentOrderDetail:React.FC<AgentOrderDetailProps> = () => {
telephone: addressDetail.tel,
defaultConsignee: !!addressDetail.isDefault,
}
// 组合配送时间字段
if(params?.timeLine) {
params.deliverDate = `${params.deliverDate} ${params.timeLine}`
} else {
params.deliverDate = params.deliverDate
}
}
// 组合配送时间字段
if(params?.timeLine) {
params.deliverDate = `${params.deliverDate} ${params.timeLine}`
} else {
params.deliverDate = params.deliverDate
}
// 其他需求
......@@ -354,23 +358,23 @@ const AgentOrderDetail:React.FC<AgentOrderDetailProps> = () => {
})
const providerValue = {
detailData: initFormValue,
// detailData: initFormValue,
schemaActions: addSchemaAction,
formContext,
}
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回"/>}
title={changeRouterTitleByStatus()}
extra={[
<Button key="1" onClick={() => addSchemaAction.submit()} loading={btnLoading} type="primary" icon={<SaveOutlined />}>
保存
</Button>,
]}
>
<ReadyAddOrderDetailContext.Provider value={providerValue}>
<Card className={styles.orderCollectCard} style={{marginTop: 24}}>
return (<div style={{margin: -24}}>
<FormDetailContext.Provider value={providerValue}>
<FormDetailHeader
title={id?"编辑":"新增"}
schema={initFormSchema}
extraRight={[
<Button key="1" onClick={() => addSchemaAction.submit()} loading={btnLoading} type="primary" icon={<SaveOutlined />}>
保存
</Button>,
]}
/>
<FormDetailWrapper>
<NiceForm
loading={formLoading}
previewPlaceholder=' '
......@@ -440,6 +444,9 @@ const AgentOrderDetail:React.FC<AgentOrderDetailProps> = () => {
}
})
// 注入表单完成进度
formContext.useAttachmentChangeForContext(ctx)
}}
expressionScope={{
orderMember,
......@@ -455,13 +462,12 @@ const AgentOrderDetail:React.FC<AgentOrderDetailProps> = () => {
help,
}}
/>
</Card>
</FormDetailWrapper>
</FormDetailContext.Provider>
<ProductModalTable currentRef={productRef} schemaAction={addSchemaAction} sectionProps={sectionProps} forceRender/>
<MemberModalTable currentRef={memberRef} productRef={productRef} schemaAction={addSchemaAction}/>
</ReadyAddOrderDetailContext.Provider>
</PageHeaderWrapper>
)
</div>)
}
AgentOrderDetail.defaultProps = {}
......
......@@ -5,10 +5,10 @@ import styles from '../index.less'
const basicInfo: ISchema = {
"x-index": 0,
type: 'object',
"x-component": 'tabpane',
"x-component": 'MellowCard',
"x-component-props": {
tab: '基本信息',
className: 'useConnectBtnWrapper'
title: '基本信息',
id: 'basicInfo'
},
properties: {
NO_SUBMIT_LAYOUT: {
......@@ -16,8 +16,12 @@ const basicInfo: ISchema = {
"x-component": 'mega-layout',
"x-component-props": {
labelCol: 4,
labelAlign: 'left',
wrapperCol: 10
wrapperCol: 18,
labelAlign: "left",
grid: true,
full: true,
autoRow: true,
columns: 2,
},
properties: {
orderModeName: {
......@@ -130,9 +134,10 @@ const basicInfo: ISchema = {
export const orderProduct: ISchema = {
"x-index": 2,
type: 'object',
"x-component": 'tabpane',
"x-component": 'MellowCard',
"x-component-props": {
tab: '订单商品'
title: '订单商品',
id: 'orderProducts'
},
properties: {
products: {
......@@ -156,9 +161,10 @@ export const orderProduct: ISchema = {
export const payInfo: ISchema = {
"x-index": 3,
type: 'object',
"x-component": 'tabpane',
"x-component": 'MellowCard',
"x-component-props": {
tab: '支付信息',
title: '支付信息',
id: 'payInfo'
},
properties: {
payments: {
......@@ -177,19 +183,23 @@ export const payInfo: ISchema = {
const submitInfo: ISchema = {
"x-index": 1,
type: 'object',
"x-component": 'tabpane',
"x-component": 'MellowCard',
"x-component-props": {
tab: '送货信息'
title: '送货信息',
id: 'deliveryInfo'
},
properties: {
NO_SUBMIT_LAYOUT_2: {
type: 'object',
"x-component": 'mega-layout',
'x-component-props': {
labelCol: 6,
labelAlign: 'left',
labelCol: 2,
wrapperCol: 9,
labelAlign: "left",
grid: true,
columns: 2,
full: true,
autoRow: true,
columns: 1,
},
properties: {
FLEX_LAYOUT_LEFT: {
......@@ -202,9 +212,6 @@ const submitInfo: ISchema = {
title: '送货时间',
required: true,
"x-component-props": {
// disabledDate: current => {
// return current && current < moment().startOf('day')
// },
showTime: true,
format: 'YYYY-MM-DD HH:mm',
style: { width: 400 }
......@@ -214,6 +221,7 @@ const submitInfo: ISchema = {
title: ' ',
type: 'radio',
enum: [],
visible: false,
"x-component-props": {
disabled: false,
optionType: 'button',
......@@ -222,42 +230,77 @@ const submitInfo: ISchema = {
},
}
},
deliveryAddresId: {
type: 'string',
"x-component": 'SelectAddress',
FLEX_LAYOUT_RIGHT: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
dataSource: [],
times: 0,
labelCol: 2,
wrapperCol: 22,
},
"x-rules": [
{
required: true,
message: '请选择送货地址'
properties: {
deliveryAddresId: {
type: 'string',
"x-component": 'SelectAddress',
"x-mega-props": {
style: {
full: true
}
},
"x-component-props": {
dataSource: [],
times: 0,
},
"x-rules": [
{
required: true,
message: '请选择送货地址'
}
],
title: '送货地址'
}
],
title: '送货地址'
}
}
},
// deliveryAddresId: {
// type: 'string',
// "x-component": 'SelectAddress',
// "x-component-props": {
// dataSource: [],
// times: 0,
// },
// "x-rules": [
// {
// required: true,
// message: '请选择送货地址'
// }
// ],
// title: '送货地址'
// }
}
}
}
}
// 其他信息
const ortherInfo: ISchema = {
// 发票信息
const invoiceInfo: ISchema = {
"x-index": 4,
type: 'object',
"x-component": 'tabpane',
"x-component": 'MellowCard',
"x-component-props": {
tab: '其他信息'
title: '发票信息',
id: 'invoiceInfo'
},
properties: {
NO_SUBMIT_LAYOUT_ORTHER: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
labelAlign: 'left',
labelCol: 4,
wrapperCol: 10
labelCol: 2,
wrapperCol: 9,
labelAlign: "left",
grid: true,
full: true,
autoRow: true,
columns: 1,
},
properties: {
hasInvoice: {
......@@ -275,23 +318,61 @@ const ortherInfo: ISchema = {
{
type: 'value:visible',
target: 'theInvoiceId',
condition: "{{!!$value}}"
condition: "{{$value}}"
}
]
},
theInvoiceId: {
type: 'number',
title: ' ',
"x-component": "theInvoiceList",
FLEX_LAYOUT_RIGHT: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
times: 0,
labelCol: 2,
wrapperCol: 22,
},
properties: {
theInvoiceId: {
type: 'number',
title: ' ',
"x-component": "theInvoiceList",
"x-component-props": {
times: 0,
}
},
}
},
}
}
}
}
// 其他信息
const ortherInfo: ISchema = {
"x-index": 5,
type: 'object',
"x-component": 'MellowCard',
"x-component-props": {
title: '其他信息',
id: 'otherInfo'
},
properties: {
NO_SUBMIT_LAYOUT_ORTHER: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
labelCol: 4,
wrapperCol: 18,
labelAlign: "left",
grid: true,
full: true,
autoRow: true,
columns: 2,
},
properties: {
pack: {
type: 'string',
"x-component": 'textarea',
"x-component-props": {
rows: 4
rows: 1
},
title: '包装要求',
"x-rules": [
......@@ -305,7 +386,7 @@ const ortherInfo: ISchema = {
type: 'string',
"x-component": 'textarea',
"x-component-props": {
rows: 4
rows: 1
},
title: '其他要求',
"x-rules": [
......@@ -324,17 +405,12 @@ const ortherInfo: ISchema = {
export const orderAddSchema: ISchema = {
type: 'object',
properties: {
NO_SUBMIT_TABS: {
type: 'object',
"x-component": 'tab',
properties: {
basicInfo,
submitInfo,
orderProduct,
payInfo,
ortherInfo,
}
}
basicInfo,
submitInfo,
orderProduct,
payInfo,
invoiceInfo,
ortherInfo,
}
}
......
......@@ -144,7 +144,6 @@ const TheInvoiceList = (props: ISchemaFieldComponentProps) => {
reload()
}
// @tofix bug 添加或删除发票后 useValue Radio默认值是操作的数据 导致无法选中
// console.log(useValue, 'useValue', dataSource, 'dataSource', mode, value, 'value')
......
......@@ -247,8 +247,8 @@ export const requisitionColumns: any[] = [
},
{
title: '已采购数量',
dataIndex: 'purpose',
key: 'purpose',
dataIndex: 'transferQuantity',
key: 'transferQuantity',
}
]
......
......@@ -76,7 +76,6 @@ const AddRequisitionOrder:React.FC<AddRequisitionOrderProps> = (props) => {
const {
pageStatus,
id,
page_type = '0',
modelType,
requisitionId = null,
} = usePageStatus()
......
......@@ -8,7 +8,6 @@ import OrderDetailSection from '../../components/orderDetailSection';
const OrderPreview: React.FC = () => {
const { formContext, detailList } = useOrderDetail({type: 'purchaseOrder'})
return (
<div>
<OrderDetailContext.Provider value={formContext}>
......
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