采购订单对接

src/components/ModalForm/index.tsx

@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react'
 import { IAntdSchemaFormProps } from '@formily/antd'
 import { Modal } from 'antd'
 import NiceForm from '../NiceForm'
+import { ModalProps } from 'antd/es/modal'
 
 export interface ModalFormProps extends IAntdSchemaFormProps {
   confirm?(),
@@ -9,11 +10,12 @@ export interface ModalFormProps extends IAntdSchemaFormProps {
   closeabled?: boolean
   modalTitle?: string,
   currentRef?: any,
-  width?: number
+  width?: number,
+  modalProps?: ModalProps
 }
 
 const ModalForm:React.FC<ModalFormProps> = (props) => {
-  const { width = 704, confirm, cancel, modalTitle, currentRef, closeabled = true, actions, ...restProps } = props
+  const { width = 704, confirm, cancel, modalTitle, currentRef, closeabled = true, actions, modalProps = {}, ...restProps } = props
   const [visible, setVisible] = useState<boolean>(false)
 
   useEffect(() => {
@@ -41,6 +43,7 @@ const ModalForm:React.FC<ModalFormProps> = (props) => {
       onOk={handleConfirm}
       onCancel={handleCancel}
       visible={visible}
+      {...modalProps}
     >
       <NiceForm
         actions={actions}

src/components/ModalTable/index.tsx

@@ -2,7 +2,7 @@ import React, { ReactText, useRef, useEffect } from 'react'
 import {StandardTable} from 'god'
 import { IStandardTableProps } from 'god/dist/src/standard-table'
 import { Row, Col, Modal } from 'antd'
-import { productModalSchema, productModalByMemberSchema, memberModalSchema, inquirySchema, demandSchema,enquirySchema } from './schema'
+import { productModalSchema, productModalByMemberSchema, memberModalSchema, inquirySchema, demandSchema,enquirySchema, mergeOrderSchema } from './schema'
 import Search from '../NiceForm/components/Search'
 import SearchSelect from '../NiceForm/components/SearchSelect'
 import Submit from '../NiceForm/components/Submit'
@@ -17,7 +17,7 @@ export interface ModalTableProps extends IStandardTableProps<any> {
   cancel?(),
   visible?: boolean,
   resetModal?: object,
-  modalType?: 'productByDefault' | 'productByMember' | 'memberByDefault' | 'inquiryByDefault' | 'demandByDefault' | 'enquiryModel' | 'none' 
+  modalType?: 'productByDefault' | 'productByMember' | 'memberByDefault' | 'inquiryByDefault' | 'demandByDefault' | 'enquiryModel' | 'MergeOrderByDefault' | 'none' 
 }
 
 const ModalTable:React.FC<ModalTableProps> = (props) => {
@@ -57,6 +57,10 @@ const ModalTable:React.FC<ModalTableProps> = (props) => {
       case 'demandByDefault': {
         return demandSchema
       }
+
+      case 'MergeOrderByDefault': {
+        return mergeOrderSchema
+      }
       case 'none': {
         return {}
       }

src/components/ModalTable/schema/index.ts

@@ -323,4 +323,64 @@ export const demandSchema: ISchema = {
       }
     }
   }
+}
+
+export const mergeOrderSchema: ISchema = {
+  type: 'object',
+  properties: {
+    keywords: {
+      type: 'string',
+      'x-component': 'ModalSearch',
+      'x-component-props': {
+        placeholder: '订单号/订单摘要',
+        align: 'flex-left',
+      },
+    },
+    [FORM_FILTER_PATH]: {
+      type: 'object',
+      'x-component': 'flex-layout',
+      'x-component-props': {
+        rowStyle: {
+          flexWrap: 'nowrap',
+          style: {
+            marginRight: 0
+          }
+        },
+        colStyle: {
+          marginTop: 20,
+        },
+      },
+      properties: {
+        // @todo 需调整字段名
+        name: {
+          type: 'string',
+          "x-component": 'SearchSelect',
+          "x-component-props": {
+            placeholder: '供应会员（全部）',
+            className: 'fixed-ant-selected-down', // 该类强制将显示的下拉框出现在select下, 只有这里出现问题, ??
+            fetchSearch: PublicApi.getProductSelectGetSelectCategory,
+            style: {
+              width: 160
+            }
+          }
+        },
+        "[startDocumentsTime,endDocumentsTime]": {
+          type: 'string',
+          "x-component": "dateSelect",
+          "x-component-props": {
+            placeholder: '单据时间（全部）',
+          }
+        },
+        submit: {
+          "x-component": 'Submit',
+          "x-mega-props": {
+            span: 1
+          },
+          "x-component-props": {
+            children: '查询'
+          }
+        }
+      }
+    }
+  }
 }
\ No newline at end of file

src/pages/transaction/purchaseOrder/context/index.ts

+import { createContext } from 'react';
+
+export const readyAddOrderDetailContext = createContext<any>({})
\ No newline at end of file

src/pages/transaction/purchaseOrder/components/addressModal/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/addressModal/index.tsx

@@ -25,7 +25,6 @@ const fetchTelCode = async () => {
 const AddressModal:React.FC<AddressModalProps> = (props) => {
   const addressData = useRef<any[]>([])
   const { mode, formInitValue } = props
-
   const selfInitValue = useMemo(() => mode === 'add' ? null : formInitValue, [mode, formInitValue]) 
   // 由于默认是number类型, 但switch组件只接收boolean
   if (selfInitValue) {
@@ -71,7 +70,10 @@ const AddressModal:React.FC<AddressModalProps> = (props) => {
       modalTitle={mode === 'add' ? '新建收货地址' : '编辑收货地址'}
       confirm={handleConfirm}
       cancel={resetForm}
-      value={selfInitValue}
+      initialValues={selfInitValue}
+      modalProps={{
+        destroyOnClose: true
+      }}
       effects={($, { setFieldState }) => {
         $('onFormMount').subscribe(() => {
           PublicApi.getManageAreaAll().then(res => {

src/pages/transaction/purchaseOrder/components/demandModalTable/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/demandModalTable/index.tsx

 import React, { useEffect } from 'react'
 import ModalTable, { ModalTableProps } from '@/components/ModalTable'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
-import { useModalTable } from '../../readyAddOrder/model/useModalTable'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
+import { useModalTable } from '../../../readyAddOrder/model/useModalTable'
 import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
-import { inquiryColumns } from '../../readyAddOrder/constant'
+import { inquiryColumns } from '../../../readyAddOrder/constant'
 
 export interface DemandModalTableProps extends ModalTableProps {
   type?: 'radio' | 'checkbox',

src/pages/transaction/purchaseOrder/components/inquiryModalTable/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/inquiryModalTable/index.tsx

 import React, { useEffect } from 'react'
 import ModalTable, { ModalTableProps } from '@/components/ModalTable'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
-import { useModalTable } from '../../readyAddOrder/model/useModalTable'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
+import { useModalTable } from '../../../readyAddOrder/model/useModalTable'
 import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
-import { inquiryColumns } from '../../readyAddOrder/constant'
+import { inquiryColumns } from '../../../readyAddOrder/constant'
 
 export interface InquiryModalTableProps extends ModalTableProps {
   type?: 'radio' | 'checkbox',

src/pages/transaction/purchaseOrder/components/memberModalTable/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/memberModalTable/index.tsx

 import React, { useEffect } from 'react'
 import ModalTable, { ModalTableProps } from '@/components/ModalTable'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
-import { useModalTable } from '../../readyAddOrder/model/useModalTable'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
+import { useModalTable } from '../../../readyAddOrder/model/useModalTable'
 import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
-import { memberColumns } from '../../readyAddOrder/constant'
+import { memberColumns } from '../../../readyAddOrder/constant'
 
 export interface MemberModalTableProps extends ModalTableProps {
   type?: 'radio' | 'checkbox',

src/pages/transaction/purchaseOrder/readyAddOrder/components/mergeOrderModalTable/index.tsx

+import React, { useEffect } from 'react'
+import ModalTable, { ModalTableProps } from '@/components/ModalTable'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
+import { useModalTable } from '../../../readyAddOrder/model/useModalTable'
+import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
+import { mergeOrderColumns } from '../../../readyAddOrder/constant'
+
+export interface MergeOrderModalTableProps extends ModalTableProps {
+  type?: 'radio' | 'checkbox',
+  schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
+  currentRef?: any,
+  confirmModal?()
+}
+
+// 报价单弹窗
+const MergeOrderModalTable:React.FC<MergeOrderModalTableProps> = (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]
+    
+    confirmModal && confirmModal()
+    setVisible(false)
+  }
+  return (
+    <ModalTable
+      modalTitle='选择合并订单'
+      columns={mergeOrderColumns}
+      visible={visible}
+      confirm={handleConfirm}
+      cancel={() => setVisible(false)}
+      fetchTableData={(params) => fetchOrderApi.getQuotationList(params)}
+      rowSelection={rowSelection}
+      modalType='MergeOrderByDefault'
+      tableProps={{
+        rowKey: 'id'
+      }}
+      {...restProps}
+    />
+  )
+}
+
+MergeOrderModalTable.defaultProps = {}
+
+export default MergeOrderModalTable
\ No newline at end of file

src/pages/transaction/purchaseOrder/components/productModalTable/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/productModalTable/index.tsx

 import React, { useEffect } from 'react'
 import ModalTable, { ModalTableProps } from '@/components/ModalTable'
 import { useRowSelectionTable } from '@/hooks/useRowSelectionTable'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
-import { useModalTable } from '../../readyAddOrder/model/useModalTable'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
+import { useModalTable } from '../../../readyAddOrder/model/useModalTable'
 import { ISchemaFormActions, ISchemaFormAsyncActions } from '@formily/antd'
-import { OrderModalType } from '../../readyAddOrder/constant'
+import { OrderModalType } from '../../../readyAddOrder/constant'
+import { DELIVERY_TYPE } from '@/constants'
+import { PublicApi } from '@/services/api'
+import { EnvironmentOutlined } from '@ant-design/icons'
+import { Popover, Space, Row } from 'antd'
 
 export interface ProductModalTableProps extends ModalTableProps {
   type?: 'radio' | 'checkbox',
   schemaAction: ISchemaFormActions | ISchemaFormAsyncActions,
   currentRef?: any,
+  sectionProps: any,
   confirmModal?()
 }
 
@@ -60,9 +65,58 @@ const orderProductShopTypeMaps = {
   [OrderModalType.CHANNEL_SPOT_MANUAL_ORDER]: 4
 }
 
+export const AddressPop = (props) => {
+  const { pickInfo = null, children } = props
+  return pickInfo && pickInfo.deliveryType === 2 ? <Space>
+    <EnvironmentOutlined style={{marginRight: 8}}/>
+    <Popover content={
+      <Row>
+        <EnvironmentOutlined/>
+        <div>
+          <h3>自提地址</h3>
+          <p>{pickInfo.receiverName} / {pickInfo.phone}</p>
+          <p>{pickInfo.fullAddress}</p>
+        </div>
+      </Row>
+    }>
+      {children}
+    </Popover>
+  </Space> : children
+}
+
+const filterProductDataById = (data, targetData) => {
+  return targetData.reduce(async (prev: any[], next) => {
+    const { logistics } = next
+    if (logistics.deliveryType === 2) {
+      const { code, data } = await PublicApi.getLogisticsShipperAddressGet({
+        id: logistics.sendAddress
+      }, { ttl: 60 * 1000, useCache: true })
+      logistics.render = code === 1000 ? <AddressPop pickInfo={data}>{DELIVERY_TYPE[logistics.deliveryType]}</AddressPop> : DELIVERY_TYPE[logistics.deliveryType]
+    } else {
+      logistics.render = DELIVERY_TYPE[logistics.deliveryType]
+    }
+    // 配送方式外置, 用于接口字段冗余
+    next.deliveryType = logistics.deliveryType
+
+    // id 存在集合中， 采用target中的数据， 否则采用data中的数据
+    const findResult = data.find(v => v.id === next.id)
+
+    // 由于迭代时，会出现promise的 已完成状态， 需转换一下，实现异步转同步化
+    if (!Array.isArray(prev)) {
+      prev = await prev
+    }
+    if (findResult) {
+      // 已经选中过这一项, 则需要采用原有的商品列表
+      prev.push(findResult)
+    } else {
+      prev.push(next)
+    }
+    return prev
+  }, [])
+}
 const ProductModalTable:React.FC<ProductModalTableProps> = (props) => {
-  const { type = 'checkbox', schemaAction, confirmModal, currentRef, ...restProps } = props
-  const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type})
+  const { type = 'checkbox', schemaAction, confirmModal, currentRef, sectionProps, ...restProps } = props
+  const { visible, setVisible, rowSelection, rowSelectionCtl } = sectionProps
 
   useEffect(() => {
     if (currentRef) {
@@ -74,8 +128,9 @@ const ProductModalTable:React.FC<ProductModalTableProps> = (props) => {
     }
   }, [])
 
-  const handleConfirmProduct = () => {
-    schemaAction.setFieldValue('orderProductRequests', rowSelectionCtl.selectRow)
+  const handleConfirmProduct = async () => {
+    const productData = schemaAction.getFieldValue('orderProductRequests')
+    schemaAction.setFieldValue('orderProductRequests', await filterProductDataById(productData, rowSelectionCtl.selectRow))
     confirmModal && confirmModal()
     setVisible(false)
   }

src/pages/transaction/purchaseOrder/components/productTableCell/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/productTableCell/index.tsx

@@ -50,6 +50,7 @@ export const ProductTableCell:React.FC<ProductTableCellProps> = ({
   const save = async e => {
     try {
       const values = await form.validateFields();
+      values.purchaseCount = Number(values.purchaseCount) || 0
       handleSave({ ...record, ...values });
     } catch (errInfo) {
       console.log('Save failed:', errInfo);
@@ -59,7 +60,7 @@ export const ProductTableCell:React.FC<ProductTableCellProps> = ({
   const chooseFormItem = (type) => {
     switch(type) {
       case 'input': {
-        return <Input style={{width: 140}} ref={formItemRef} onChange={save} {...formItemProps}/>
+        return <Input style={{width: 140}} type='number' ref={formItemRef} onChange={save} {...formItemProps} id={dataIndex + record.id}/>
       }
     }
   }

src/pages/transaction/purchaseOrder/components/selectAddress/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/selectAddress/index.tsx

@@ -5,7 +5,7 @@ import { Button, Space, Row, Col, Tag } from 'antd'
 import { PlusOutlined, DeleteColumnOutlined, EditOutlined, DeleteOutlined, CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons'
 import cx from 'classnames'
 import AddressModal from '../addressModal'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
 import { PublicApi } from '@/services/api'
 
 const SelectStyles = styled((props) => <div className='select-list' {...props}></div>)`

src/pages/transaction/purchaseOrder/components/theInvoiceList/index.tsx → src/pages/transaction/purchaseOrder/readyAddOrder/components/theInvoiceList/index.tsx

@@ -4,7 +4,7 @@ import { ISchemaFormProps, ISchemaFieldProps, ISchemaFieldComponentProps, create
 import { Button, Space, Row, Col, Tag, Radio } from 'antd'
 import { PlusOutlined, DeleteColumnOutlined, EditOutlined, DeleteOutlined, CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons'
 import cx from 'classnames'
-import { fetchOrderApi } from '../../readyAddOrder/apis'
+import { fetchOrderApi } from '../../../readyAddOrder/apis'
 import { PublicApi } from '@/services/api'
 import InvoiceModal from '../invoiceModal'
 import styles from './index.less'

src/pages/transaction/purchaseOrder/readyAddOrder/constant/index.tsx

@@ -24,25 +24,6 @@ const PriceComp = (props) => {
   </div>
 }
 
-const AddressPop = (props) => {
-  const { pickInfo = null, children } = props
-  return pickInfo && pickInfo.deliveryType === 2 ? <Space>
-    <EnvironmentOutlined style={{marginRight: 8}}/>
-    <Popover content={
-      <Row>
-        <EnvironmentOutlined/>
-        <div>
-          <h3>自提地址</h3>
-          <p>{pickInfo.receiverName} / {pickInfo.phone}</p>
-          <p>{pickInfo.fullAddress}</p>
-        </div>
-      </Row>
-    }>
-      {children}
-    </Popover>
-  </Space> : children
-}
-
 export enum OrderModalType {
 
   /**
@@ -324,9 +305,9 @@ export const productInfoColumns: any[] = [
   },
   {
     title: '采购数量',
-    dataIndex: 'quotationNo',
+    dataIndex: 'purchaseCount',
     align: 'center',
-    key: 'quotationNo',
+    key: 'purchaseCount',
     formItem: 'input',
     editable: true,
     width: 140
@@ -349,16 +330,7 @@ export const productInfoColumns: any[] = [
     dataIndex: 'logistics',
     align: 'center',
     key: 'logistics',
-    render: async (text, record) => {
-      if (text.deliveryType === 2) {
-        const { code, data } = await PublicApi.getLogisticsShipperAddressGet({
-          id: text.sendAddress
-        }, { ttl: 60 * 1000, useCache: true })
-        return code === 1000 ? <AddressPop pickInfo={data}>{DELIVERY_TYPE[text.deliveryType]}</AddressPop> : DELIVERY_TYPE[text.deliveryType]
-      } else {
-        return DELIVERY_TYPE[text.deliveryType]
-      }
-    }
+    render: text => text.render || ''
   },
   {
     title: '操作',
@@ -366,4 +338,43 @@ export const productInfoColumns: any[] = [
     align: 'center',
     key: 'ctl',
   },
+]
+
+export const mergeOrderColumns: any[] = [
+  {
+    title: '订单号',
+    dataIndex: 'orderNo',
+    align: 'center',
+    key: 'orderNo',
+  },
+  {
+    title: '订单摘要',
+    dataIndex: 'orderThe',
+    align: 'center',
+    key: 'orderThe',
+  },
+  {
+    title: '采购商名称',
+    dataIndex: 'supplyMembersName',
+    align: 'center',
+    key: 'supplyMembersName',
+  },
+  {
+    title: '下单时间',
+    dataIndex: 'createTime',
+    align: 'center',
+    key: 'createTime',
+  },
+  {
+    title: '活动时间',
+    dataIndex: 'none',
+    align: 'center',
+    key: 'none',
+  },
+  {
+    title: '活动名称',
+    dataIndex: 'none',
+    align: 'center',
+    key: 'none',
+  }
 ]
\ No newline at end of file

src/pages/transaction/purchaseOrder/readyAddOrder/detail.tsx

@@ -10,13 +10,13 @@ import NiceForm from '@/components/NiceForm'
 import { orderDetailSchema, orderAddSchema } from './schema'
 import { useModelTypeChange, useEditHideField, useOrderFormInitEffect, useProductTableChangeForPay } from './effects'
 import { OrderModalType, orderTypeLabel, orderCombination, paymentInformationColumns } from './constant'
-import ProductModalTable from '../components/productModalTable'
-import MemberModalTable from '../components/memberModalTable'
-import InquiryModalTable from '../components/inquiryModalTable'
-import DemandModalTable from '../components/demandModalTable'
+import ProductModalTable from './components/productModalTable'
+import MemberModalTable from './components/memberModalTable'
+import InquiryModalTable from './components/inquiryModalTable'
+import DemandModalTable from './components/demandModalTable'
 import CirculationRecord from '../components/circulationRecord'
-import SelectAddress from '../components/selectAddress'
-import TheInvoiceList from '../components/theInvoiceList'
+import SelectAddress from './components/selectAddress'
+import TheInvoiceList from './components/theInvoiceList'
 import moment from 'moment'
 import { usePaymentInfo } from './model/usePaymentInfo'
 import { useProductTable } from './model/useProductTable'
@@ -45,12 +45,7 @@ export const MoneyTotalBox = registerVirtualBox('moneyTotalBox', props => {
   // @todo 由于缺乏商品字段, 目前选用假数据
   const { form } = useFormSpy({ selector: [['onFieldValueChange', 'orderProductRequests']], reducer: v => v })
   const data = form.getFieldValue('orderProductRequests')
-  const getRowTotalPrice = data.map(v => {
-    const numberNo = parseInt(v.quotationNo)
-    const quotationNo = (typeof numberNo === 'number' && !isNaN(numberNo)) ? numberNo : 0
-    return quotationNo * 100
-  })
-  const sum = getRowTotalPrice.reduce((prev, next) => prev + next, 0)
+  const sum = data.reduce((prev, next) => prev + (next.price || 0), 0)
   return <RowStyle>
     <Col span={2}>
       <div>合计金额</div>
@@ -58,7 +53,8 @@ export const MoneyTotalBox = registerVirtualBox('moneyTotalBox', props => {
     </Col>
     <Col span={2}>
       <div>运费</div>
-      <div>{sum}</div>
+      {/* 缺乏字段 @todo */}
+      <div>{0}</div>
     </Col>
     <Col span={2}>
       <div>总计金额</div>
@@ -74,7 +70,7 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
   const update = useUpdate()
 
   const [paymentColumns, paymentComponents, paymentSave] = usePaymentInfo(addSchemaAction)
-  const { productAddButton, productRef, productColumns, productComponents } = useProductTable(addSchemaAction)
+  const { productAddButton, productRef, productColumns, productComponents, ...sectionProps } = useProductTable(addSchemaAction)
 
   // 页面进入时， 当前所处的下单模式
 
@@ -84,6 +80,11 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
     const params = {
       ...value,
       deliveryTime: moment(value.deliveryTime).valueOf(),
+      // 没用的字段
+      orderProductRequests: value.orderProductRequests.map(v => {
+        v.price = 1
+        return v
+      })
     }
     await PublicApi.postOrderProcurementOrderAdd(params)
   }
@@ -214,7 +215,7 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
           }}
         />
       </Card>
-      <ProductModalTable currentRef={productRef} schemaAction={addSchemaAction}/>
+      <ProductModalTable currentRef={productRef} schemaAction={addSchemaAction} sectionProps={sectionProps}/>
       <MemberModalTable currentRef={memberRef} schemaAction={addSchemaAction}/>
       {/* 询价报价单弹窗 */}
       <InquiryModalTable currentRef={inquiryRef} schemaAction={addSchemaAction}/>

src/pages/transaction/purchaseOrder/readyAddOrder/effects/index.ts

@@ -8,18 +8,24 @@ import { useUpdate } from '@umijs/hooks';
 import { PublicApi } from '@/services/api';
 
 // 异步填充表格字段
-const asyncPadDataForProduct = async (ctx: ISchemaFormActions | ISchemaFormAsyncActions, productData: any[]) => {
-  if (productData.length === 0) {
+const asyncPadDataForProduct = async (ctx: ISchemaFormActions | ISchemaFormAsyncActions, productValue: any) => {
+  const productData = productValue.value
+  const loading = productValue.loading
+
+  if (productData.length === 0 || loading) {
     return false
   }
 
+  ctx.setFieldState(productValue.path, state => {
+    state.loading = true
+  })
   // 折扣请求
-  const asyncPriceRequests = await Promise.all(productData.filter(v => v.memberPrice === undefined).map(async v =>  {
+  const asyncPriceRequests: any[] = await Promise.all(productData.filter(v => v.memberPrice === undefined).map(async v =>  {
       const {code, data} = await PublicApi.getMemberManageUpperCreditParamGet({
         parentMemberId: v.memberId,
         parentMemberRoleId: v.memberRoleId
       }, {ttl: 60 * 1000, useCache: true})
-      return code === 1000 ? (data.parameter * 100) + '%' : ''
+      return code === 1000 ? { value: (data.parameter * 100) + '%', id: v.id } : { value: '', id: 0 }
     }
   ))
 
@@ -33,12 +39,16 @@ const asyncPadDataForProduct = async (ctx: ISchemaFormActions | ISchemaFormAsync
   // 存在需要异步请求的， 则进行赋值
   if (asyncPriceRequests.length > 0) {
     const newData = productData.map((v, i) => {
-      v.memberPrice = asyncPriceRequests[i]
+      if (!v.memberPrice) {
+        v.memberPrice = asyncPriceRequests.find(j => j.id === v.id)?.value || ''
+      }
       return v
     })
-    console.log(newData)
     ctx.setFieldValue('orderProductRequests', newData)
   }
+  ctx.setFieldState(productValue.path, state => {
+    state.loading = false
+  })
   // if (asyncAddressRequests.length > 0) {
   //   ctx.setFieldValue('orderProductRequests', productData.map((v, i) => {
   //     v.memberPrice = asyncPriceRequests[i]
@@ -87,15 +97,14 @@ export const useProductTableChangeForPay = (ctx: ISchemaFormActions | ISchemaFor
       fetchOrderApi.getPayInfoList({
         productId: productItem.id
       }).then(data => {
-        // ctx.setFieldValue('paymentInformationResponses', data)
+        ctx.setFieldValue('paymentInformationResponses', data)
       }).catch(err => {
       })
     }
 
     // 确认后 需根据商品id请求会员折扣接口， 以及配送方式
     // 由于商品存在多个， 需对接口做一定缓存
-    console.log(value)
-    asyncPadDataForProduct(ctx, value)
+    asyncPadDataForProduct(ctx, state)
   })
 }
 

src/pages/transaction/purchaseOrder/readyAddOrder/model/useProductTable.tsx

@@ -2,11 +2,51 @@ import React, { useRef, useMemo, useState } from 'react'
 import { ISchemaFormActions, ISchemaFormAsyncActions, createControllerBox, useFormSpy } from '@formily/antd';
 import { Button, Row, Col } from 'antd';
 import { productInfoColumns } from '../constant';
-import ProductTableCell, { ProductEditableRow } from '../../components/productTableCell';
+import ProductTableCell, { ProductEditableRow } from '../components/productTableCell';
+import { useModalTable } from './useModalTable';
 
+const getUnitPriceTotal = (record) => {
+  const purchaseCount = Number(record['purchaseCount']) || 0
+  let unitPrice = 0
+  Object.entries(record.unitPrice).forEach(([key, value]) => {
+    const [min, max] = key.split('-').map(v => Number(v))
+    if (min === 0 && max === 0) {
+      unitPrice = Number(value)
+      return false
+    }
+    if (purchaseCount >= min && purchaseCount <= max) {
+      // 处于该区间
+      unitPrice = Number(value)
+      return false
+    }
+  })
+  return unitPrice * purchaseCount
+}
 export const useProductTable = (ctx: ISchemaFormActions | ISchemaFormAsyncActions) => {
   const productRef = useRef<any>({})
-  const [productColumns, setProductColumns] = useState(() => productInfoColumns)
+  const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type: 'checkbox'})
+
+  const handleDelete = (record) => {
+    const newData = [...ctx.getFieldValue('orderProductRequests')]
+    // 删除formvalue
+    const colIndex = newData.findIndex(v => v.id === record.id)
+    newData.splice(colIndex, 1)
+
+    // 删除选中的项
+    rowSelectionCtl.setSelectRow(newData)
+    rowSelectionCtl.setSelectedRowKeys(newData.map(v => v.id))
+    ctx.setFieldValue('orderProductRequests', newData)
+  }
+
+  const [productColumns, setProductColumns] = useState(() => {
+    productInfoColumns[productInfoColumns.length - 1].render = (text, record) => {
+      return <>
+        <Button type='link' onClick={() => handleDelete(record)}>删除</Button>
+        <Button type='link'>选择合并订单</Button>
+      </>
+    }
+    return productInfoColumns
+  })
   const productAddButton = <Button onClick={() => productRef.current.setVisible(true)} block type='default' style={{margin: '24px auto'}}>选择订单商品</Button>
   const productComponents = {
     body: {
@@ -18,8 +58,9 @@ export const useProductTable = (ctx: ISchemaFormActions | ISchemaFormAsyncAction
   const handleSave = row => {
     return new Promise((resolve, reject) => {
       const newData = [...ctx.getFieldValue('orderProductRequests')];
-      const index = newData.findIndex(item => row.key === item.key);
+      const index = newData.findIndex(item => row.id === item.id);
       const item = newData[index];
+      row['price'] = getUnitPriceTotal(row)
       newData.splice(index, 1, {
         ...item,
         ...row,
@@ -52,6 +93,10 @@ export const useProductTable = (ctx: ISchemaFormActions | ISchemaFormAsyncAction
     productRef,
     productAddButton,
     productColumns: paymentEditColumns,
-    productComponents
+    productComponents,
+    visible,
+    setVisible,
+    rowSelection,
+    rowSelectionCtl
   }
 }
\ No newline at end of file