fix：处理订单详情内部状态显示异常，处理销售待审核订单修改运费后价格总计价格不同步更新的问题

src/pages/transaction/components/OrderDetailHeader/index.tsx

-import React, { ReactNode } from 'react'
-import { Row, Col, Skeleton } from 'antd'
-import { history } from 'umi'
-import { ArrowLeftOutlined } from '@ant-design/icons'
-import style from './index.less'
-
-export interface OrderDetailHeaderProps {
-  extraRight?: ReactNode,
-  detailList?: { label: string, name: string, render?(text, record?), [key: string]: any }[],
-  detailData?: any
-}
-
-/**
- * 订单详情头部
- */
-const OrderDetailHeader:React.FC<OrderDetailHeaderProps> = ({ extraRight, detailList = [], detailData}) => {
-  const isLoading = !!detailData
-  return (
-    <div className={style.detailHeader}>
-      {
-      isLoading ? 
-        <Row>
-          {
-            <Col>
-              <Row align='middle'>
-                <Col>
-                  <ArrowLeftOutlined onClick={() => history.goBack()}/>
-                </Col>
-                <Col className={style.titleAvator}>单</Col>
-              </Row>
-            </Col>
-          }
-          
-          <Col style={{flex: 1}}>
-            <Row justify='space-between' align='middle' style={{paddingTop: 14}}>
-              <Col style={{flex: 1}}>
-                <div className={style.titleAvatorText}>订单号: {detailData.orderNo}</div>
-                <Row>
-                  {detailList.map(v => {
-                    const { label, render, name, ...colProps } = v
-                    return detailData[name] ? <Col key={label} {...colProps} className={style.detailCol}>
-                      <span className={style.colLabel}>{label}:</span>
-                      {render ? render(detailData[name], detailData) : <span>{detailData[name]}</span>}
-                    </Col> : null
-                  })}
-                </Row>
-              </Col>
-              <Col>{extraRight}</Col>
-            </Row>
-          </Col>
-        </Row>
-      : <Skeleton avatar={{shape: 'square'}} active paragraph={{ rows: 3 }} />
-          }
-    </div> 
-  )
-}
-
-OrderDetailHeader.defaultProps = {}
-
-export default OrderDetailHeader
\ No newline at end of file
+import React, { ReactNode } from 'react'
+import { Row, Col, Skeleton } from 'antd'
+import { history } from 'umi'
+import { ArrowLeftOutlined } from '@ant-design/icons'
+import style from './index.less'
+
+export interface OrderDetailHeaderProps {
+  extraRight?: ReactNode,
+  detailList?: { label: string, name: string, render?(text, record?), [key: string]: any }[],
+  detailData?: any
+}
+
+/**
+ * 订单详情头部
+ */
+const OrderDetailHeader:React.FC<OrderDetailHeaderProps> = ({ extraRight, detailList = [], detailData}) => {
+  const isLoading = !!detailData
+  return (
+    <div className={style.detailHeader}>
+      {
+      isLoading ?
+        <Row>
+          {
+            <Col>
+              <Row align='middle'>
+                <Col>
+                  <ArrowLeftOutlined onClick={() => history.goBack()}/>
+                </Col>
+                <Col className={style.titleAvator}>单</Col>
+              </Row>
+            </Col>
+          }
+
+          <Col style={{flex: 1}}>
+            <Row justify='space-between' align='middle' style={{paddingTop: 14}}>
+              <Col style={{flex: 1}}>
+                <div className={style.titleAvatorText}>订单号: {detailData.orderNo}</div>
+                <Row>
+                  {detailList.map(v => {
+                    const { label, render, name, ...colProps } = v
+                    return (detailData[name] || detailData[name] === 0) ? <Col key={label} {...colProps} className={style.detailCol}>
+                      <span className={style.colLabel}>{label}:</span>
+                      {render ? render(detailData[name], detailData) : <span>{detailData[name]}</span>}
+                    </Col> : null
+                  })}
+                </Row>
+              </Col>
+              <Col>{extraRight}</Col>
+            </Row>
+          </Col>
+        </Row>
+      : <Skeleton avatar={{shape: 'square'}} active paragraph={{ rows: 3 }} />
+          }
+    </div>
+  )
+}
+
+OrderDetailHeader.defaultProps = {}
+
+export default OrderDetailHeader

src/pages/transaction/components/saleOrderProductTable/index.tsx

-import React, { useContext, useState, useRef, useEffect, useCallback } from 'react'
-import { Card, Table, Form, Input, Row, Col, Button, Modal } from 'antd'
-import { OrderDetailContext } from '../../_public/order/context'
-import { EditOutlined, SettingOutlined } from '@ant-design/icons'
-import style from './index.less'
-import { PublicApi } from '@/services/api'
-import styled from 'styled-components'
-import ModalForm from '@/components/ModalForm'
-import { createFormActions } from '@formily/antd'
-import MellowCard from '@/components/MellowCard'
-import { SALE_ORDER_STATUS } from '../../_public/order/constant'
-import { usePageStatus } from '@/hooks/usePageStatus'
-import ModalTable from '@/components/ModalTable'
-import { formatTimeString } from '@/utils'
-import { AddressPop } from '../../purchaseOrder/orderCollect/components/productModalTable'
-import { DELIVERY_TYPE, SaleOrderInsideWorkStateTexts } from '@/constants'
-
-export interface OrderProductTableProps {}
-
-// 订单商品cell切换
-const EditableContext = React.createContext<any>({});
-
-interface Item {
-  key: string;
-  name: string;
-  age: string;
-  address: string;
-  purchaseCount: string;
-}
-
-interface EditableRowProps {
-  index: number;
-}
-
-const RowStyle = styled(props => <Row style={{marginTop: 12}} justify='end' {...props}>
-  {props.children}
-</Row>)`
-  .ant-col {
-    text-align: center
-  }
-  .ant-col div {
-    margin-bottom: 12px;
-  }
-`
-
-const warehouseColumns: any[] = [
-  {
-    dataIndex: 'freightSpaceId',
-    key: 'freightSpaceId',
-    title: '仓位ID',
-    align: 'center'
-  },
-  {
-    dataIndex: 'freightSpaceName',
-    key: 'freightSpaceName',
-    title: '仓位名称',
-    align: 'center'
-  },
-  {
-    dataIndex: 'warehouseName',
-    key: 'warehouseName',
-    title: '对应仓库',
-    align: 'center'
-  },
-  {
-    dataIndex: 'goodsName',
-    key: 'goodsName',
-    title: '对应货品',
-    align: 'center'
-  },
-  {
-    dataIndex: 'reductionInventory',
-    key: 'reductionInventory',
-    title: '扣减仓位库存',
-    align: 'center'
-  },
-  {
-    dataIndex: 'createTime',
-    key: 'createTime',
-    title: '扣减时间',
-    align: 'center',
-    render: text => formatTimeString(text)
-  }
-]
-const modalPriceActions = createFormActions()
-// 总计金额联动框
-export const MoneyTotalBox = ({ dataSource, isEditData }) => {
-  const { reloadFormData } = useContext(OrderDetailContext)
-  const { orderProductRequests = [], receiverAddressId, freight, amount, orderModel, sumPrice } = dataSource || {}
-  const creditsCommodity = (orderModel === 24 || orderModel === 25) // 积分或渠道积分下单模式
-
-  const modelRef = useRef<any>({})
-  const [freePrice, setFreePrice] = useState<number>(freight || 0)
-  const [sum, setSum] = useState<number>(0)
-  // const sum = orderProductRequests.reduce((prev, next) => prev + Number((next.money || 0)), 0)
-  const handleSetting = () => {
-    modelRef.current.setVisible(true)
-  }
-
-  const [amountMoney, setAmountMoney] = useState<number>(sumPrice || sum + freePrice)
-
-  // 总计金额
-  useEffect(() => {
-    setAmountMoney(() => sumPrice || (sum*1000 + freePrice*1000)/1000)
-    // setAmountMoney(() => (sum*1000 + freePrice*1000)/1000)
-  }, [sum, freePrice])
-
-  const handleConfirm = () => {
-    let free = modalPriceActions.getFieldValue('freePrice')
-    setFreePrice(Number(free || 0))
-    // 执行修改订单运费
-    PublicApi.postOrderProductPriceUpdate({orderId: dataSource.id, price: free, type: 2}).then(res => {
-      if(res.code === 1000) {
-        modelRef.current.setVisible(false)
-        reloadFormData()
-      }
-    })
-  }
-
-  useEffect(() => {
-    // 存在商品 并且有选择收货地址，则开始计算运费
-    if (orderProductRequests && orderProductRequests.length > 0 && receiverAddressId) {
-      // 筛选配送方式为物流的商品并且使用了运费模板
-      const logsiticsDataMaps = orderProductRequests.filter(v => v.logistics && v.logistics.useTemplate && v.logistics.deliveryType === 1)
-      if (logsiticsDataMaps.length > 0) {
-        PublicApi.postLogisticsFreightTemplateCalFreightPrice({
-          orderProductList: logsiticsDataMaps.map(v => ({
-            templateId: v.templateId,
-            weight: v.weight
-          })),
-          receiverAddressId
-        }, {ttl: 10 * 1000, useCache: true, ctlType: 'none'}).then(res => {
-          if (res.code === 1000) {
-            setFreePrice(res.data)
-          }
-        })
-      }
-    }
-
-    const _sum = amount || orderProductRequests.reduce((prev, next) => prev + Number((next.money || 0)), 0)
-    setSum(_sum)
-  }, [orderProductRequests])
-
-  return <RowStyle>
-    <Col span={2}>
-      <div>{creditsCommodity ? '合计所需积分' : '合计金额'}</div>
-      <div>{sum}</div>
-    </Col>
-    <Col span={2}>
-      <div>运费 { isEditData && <SettingOutlined style={{marginLeft: 8}} onClick={handleSetting}/>}</div>
-      <div>{freePrice}</div>
-    </Col>
-    <Col span={2}>
-      <div>{creditsCommodity ? '总计所需积分' : '总计金额'}</div>
-      <div>{amountMoney}</div>
-    </Col>
-    <ModalForm
-      modalTitle='设置运费'
-      currentRef={modelRef}
-      initialValues={freePrice}
-      schema={{
-        type: 'object',
-        properties: {
-          NO_SUBMIT_LAYOUT: {
-            type: 'object',
-            "x-component": 'mega-layout',
-            "x-component-props": {
-              labelAlign: 'top'
-            },
-            properties: {
-              freePrice: {
-                type: 'string',
-                title: '设置运费',
-                "x-props": {
-                  addonBefore: '￥'
-                },
-                "x-rules": [
-                  {
-                    validator: value => {
-                      return isNaN(value)
-                    },
-                    message:'请正确输入数字金额',
-                  },
-                  {
-                    pattern: /^\d+(\.\d{1,2})?$/,
-                    message: '运费仅限两位小数',
-                  },
-                ]
-              }
-            },
-          }
-        }
-      }}
-      actions={modalPriceActions}
-      confirm={handleConfirm}
-    >
-
-    </ModalForm>
-  </RowStyle>
-}
-
-const EditableRow: React.FC<EditableRowProps> = ({ index, ...props }) => {
-  const [form] = Form.useForm();
-  return (
-    <Form form={form} component={false}>
-      <EditableContext.Provider value={form}>
-        <tr {...props} />
-      </EditableContext.Provider>
-    </Form>
-  );
-};
-
-interface EditableCellProps {
-  title: React.ReactNode;
-  editable: boolean;
-  children: React.ReactNode;
-  dataIndex: string;
-  record: Item;
-  handleSave: (record: Item) => void;
-}
-
-const EditableCell: React.FC<EditableCellProps> = ({
-  title,
-  editable,
-  children,
-  dataIndex,
-  record,
-  handleSave,
-  ...restProps
-}) => {
-  const [editing, setEditing] = useState(false);
-  const inputRef = useRef<any>({});
-  const form = useContext(EditableContext);
-
-  useEffect(() => {
-    if (editing) {
-      inputRef.current.focus();
-    }
-  }, [editing]);
-
-  const toggleEdit = () => {
-    setEditing(!editing);
-    form.setFieldsValue({ [dataIndex]: record[dataIndex] });
-  };
-  const save = async e => {
-    try {
-      const values = await form.validateFields();
-      values.price = Number(values.price)
-      values.money = ((Number(values.price)*1000) * parseInt(record.purchaseCount))/1000 // 计算金额
-      toggleEdit();
-      handleSave({ ...record, ...values });
-    } catch (errInfo) {
-      console.log('Save failed:', errInfo);
-    }
-  };
-
-  const cancel = () => {
-    console.log('cancel')
-    setEditing(false)
-  }
-
-  let childNode = children;
-
-  if (editable) {
-    childNode = editing ? (
-      <Form.Item
-        style={{ margin: 0, width: 140 }}
-        name={dataIndex}
-        rules={[
-          {
-            required: true,
-            message: `此项为必填项`,
-          },
-          {
-            pattern: /^\d+(\.\d{1,3})?$/,
-            message: '数值仅限三位小数',
-          }
-        ]}
-      >
-        <Input type='number' ref={inputRef} onBlur={save} onPressEnter={save}/>
-      </Form.Item>
-    ) : (
-      <div className="editable-cell-value-wrap" style={{ paddingRight: 24 }} onClick={toggleEdit}>
-        {children}
-        <EditOutlined/>
-      </div>
-    );
-  }
-
-  return <td {...restProps}>{childNode}</td>;
-};
-
-const SaleOrderProductTable:React.FC<OrderProductTableProps> = (props) => {
-  const { ctl, data, reloadFormData } = useContext(OrderDetailContext)
-  const { page_type } = usePageStatus()
-  const { orderProductRequests = [], orderModel } = data || {}
-  const creditsCommodity = (orderModel === 24 || orderModel === 25) // 积分或渠道积分下单模式
-
-  const [warehouseVisible, setWarehouseVisible] = useState(false)
-  const [checkProductId, setCheckProductId] = useState(0) // 选中的商品id
-  const warehouseRef = useRef<any>({})
-
-  // 判断是否可操作当前表格
-  const isEditData = SaleOrderInsideWorkStateTexts[data.purchaseOrderInteriorState] === '待审核订单'
-  const productComponents = {
-    body: {
-      row: EditableRow,
-      cell: EditableCell
-    }
-  }
-
-  const asyncGetMemberPrice = async (asyncData: any[]) => {
-    return await Promise.all(asyncData.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 ? { value: (data.parameter * 100) + '%', id: v.id } : { value: '', id: 0 }
-    }
-    ))
-  }
-
-  useEffect(() => {
-    // 过滤 会员折扣不存在的列表
-    const hasPriceList = orderProductRequests.filter(v => !v.memberPrice)
-    if (hasPriceList.length > 0) {
-      asyncGetMemberPrice(hasPriceList).then((asyncData) => {
-        if (asyncData.length > 0) {
-          const newData = orderProductRequests.map((v, i) => {
-            if (!v.memberPrice) {
-              v.memberPrice = asyncData.find(j => j.id === v.id)?.value || 0
-            }
-            return v
-          })
-
-          ctl.setData({
-            ...data,
-            orderProductRequests: newData
-          })
-        }
-      })
-    }
-  }, [orderProductRequests])
-
-  const handleSave = row => {
-    const newData = [...orderProductRequests];
-    const index = newData.findIndex(item => row.id === item.id);
-    const item = newData[index];
-    newData.splice(index, 1, {
-      ...item,
-      ...row,
-    });
-    // 执行修改订单价格
-    PublicApi.postOrderProductPriceUpdate({orderId: data.id, orderDetailsId: row.id, price: row.price, type: 1}).then(res => {
-      if(res.code === 1000) {
-        reloadFormData()
-      }
-    })
-    ctl.setData({
-      ...data,
-      orderProductRequests: newData.sort((a, b) => a.id - b.id)
-    })
-  };
-
-  const handlePreviewWarehouse = (record) => {
-    setCheckProductId(record.productId)
-    setWarehouseVisible(true)
-  }
-
-  const productInfoColumns: any[] = [
-    {
-      title: 'ID',
-      dataIndex: 'id',
-      align: 'center',
-      key: 'id',
-    },
-    {
-      title: '商品名称',
-      dataIndex: 'productName',
-      align: 'center',
-      key: 'productName',
-    },
-    {
-      title: '品类',
-      dataIndex: 'category',
-      align: 'center',
-      key: 'category',
-    },
-    {
-      title: '品牌',
-      dataIndex: 'brand',
-      align: 'center',
-      key: 'brand',
-    },
-    {
-      title: '单位',
-      dataIndex: 'unit',
-      align: 'center',
-      key: 'unit',
-    },
-    {
-      title: creditsCommodity ? '所需积分' : '单价（元）',
-      dataIndex: 'price',
-      align: 'left',
-      key: 'price',
-      editable: isEditData
-    },
-    {
-      title: '会员折扣',
-      dataIndex: 'memberPrice',
-      align: 'center',
-      key: 'memberPrice',
-      render: (text, record) => record.isMemberPrice ? (text * 100 + '%') : null
-    },
-    {
-      title: creditsCommodity ? '兑换数量' : '采购数量',
-      dataIndex: 'purchaseCount',
-      align: 'center',
-      key: 'purchaseCount'
-    },
-    {
-      title: '含税',
-      dataIndex: 'none',
-      align: 'center',
-      key: 'none',
-      render: () => '是'
-    },
-    {
-      title: creditsCommodity ? '所需积分小计' : '金额',
-      dataIndex: 'money',
-      align: 'center',
-      key: 'money',
-    },
-    // 接口调用
-    {
-      title: '配送方式',
-      dataIndex: 'logistics',
-      align: 'center',
-      key: 'logistics',
-      render: (text) => (text && text.deliveryType && text.deliveryType === 2) ?
-      <AddressPop pickInfo={text}>{DELIVERY_TYPE[text.deliveryType]}</AddressPop> : DELIVERY_TYPE[text?.deliveryType]
-    },
-    {
-      title: '仓位库存扣减记录',
-      dataIndex: 'record',
-      align: 'center',
-      key: 'record',
-      // @todo 尚未实现, 需UI设计
-      render: (_, record) => <Button type='link' onClick={() => handlePreviewWarehouse(record)}>查看</Button>
-    },
-  ]
-
-  const fetchWarehouseData = useCallback(async (params) => {
-    const { data } = await PublicApi.getWarehousePositionDeductionRecordList({...params, productId: String(checkProductId)})
-    return data
-  }, [checkProductId])
-
-  const columns = productInfoColumns.map(col => {
-    if (!col.editable) {
-      return col;
-    }
-    return {
-      ...col,
-      onCell: record => ({
-        record,
-        editable: col.editable,
-        dataIndex: col.dataIndex,
-        title: col.title,
-        handleSave: handleSave,
-      }),
-    };
-  });
-  return (
-    <MellowCard title='订单商品' style={{marginTop: 24}} bordered={false}>
-      <Table
-        columns={columns}
-        dataSource={orderProductRequests.sort((a, b) => a.id - b.id)}
-        components={productComponents}
-        rowKey='id'
-        pagination={false}
-      />
-      <MoneyTotalBox dataSource={data} isEditData={isEditData}/>
-
-      <ModalTable
-        columns={warehouseColumns}
-        modalTitle='仓位库存扣减记录'
-        visible={warehouseVisible}
-        cancel={() => setWarehouseVisible(false)}
-        currentRef={warehouseRef}
-        confirm={() => setWarehouseVisible(false)}
-        fetchTableData={params => fetchWarehouseData(params)}
-        resetModal={{
-          destroyOnClose: true
-        }}
-      />
-    </MellowCard>
-  )
-}
-
-SaleOrderProductTable.defaultProps = {}
-
-export default SaleOrderProductTable
+import React, { useContext, useState, useRef, useEffect, useCallback } from 'react'
+import { Card, Table, Form, Input, Row, Col, Button, Modal } from 'antd'
+import { OrderDetailContext } from '../../_public/order/context'
+import { EditOutlined, SettingOutlined } from '@ant-design/icons'
+import style from './index.less'
+import { PublicApi } from '@/services/api'
+import styled from 'styled-components'
+import ModalForm from '@/components/ModalForm'
+import { createFormActions } from '@formily/antd'
+import MellowCard from '@/components/MellowCard'
+import { SALE_ORDER_STATUS } from '../../_public/order/constant'
+import { usePageStatus } from '@/hooks/usePageStatus'
+import ModalTable from '@/components/ModalTable'
+import { formatTimeString } from '@/utils'
+import { AddressPop } from '../../purchaseOrder/orderCollect/components/productModalTable'
+import { DELIVERY_TYPE, SaleOrderInsideWorkStateTexts } from '@/constants'
+
+export interface OrderProductTableProps {}
+
+// 订单商品cell切换
+const EditableContext = React.createContext<any>({});
+
+interface Item {
+  key: string;
+  name: string;
+  age: string;
+  address: string;
+  purchaseCount: string;
+}
+
+interface EditableRowProps {
+  index: number;
+}
+
+const RowStyle = styled(props => <Row style={{marginTop: 12}} justify='end' {...props}>
+  {props.children}
+</Row>)`
+  .ant-col {
+    text-align: center
+  }
+  .ant-col div {
+    margin-bottom: 12px;
+  }
+`
+
+const warehouseColumns: any[] = [
+  {
+    dataIndex: 'freightSpaceId',
+    key: 'freightSpaceId',
+    title: '仓位ID',
+    align: 'center'
+  },
+  {
+    dataIndex: 'freightSpaceName',
+    key: 'freightSpaceName',
+    title: '仓位名称',
+    align: 'center'
+  },
+  {
+    dataIndex: 'warehouseName',
+    key: 'warehouseName',
+    title: '对应仓库',
+    align: 'center'
+  },
+  {
+    dataIndex: 'goodsName',
+    key: 'goodsName',
+    title: '对应货品',
+    align: 'center'
+  },
+  {
+    dataIndex: 'reductionInventory',
+    key: 'reductionInventory',
+    title: '扣减仓位库存',
+    align: 'center'
+  },
+  {
+    dataIndex: 'createTime',
+    key: 'createTime',
+    title: '扣减时间',
+    align: 'center',
+    render: text => formatTimeString(text)
+  }
+]
+const modalPriceActions = createFormActions()
+// 总计金额联动框
+export const MoneyTotalBox = ({ dataSource, isEditData }) => {
+  const { reloadFormData } = useContext(OrderDetailContext)
+  const { orderProductRequests = [], receiverAddressId, freight, amount, orderModel, sumPrice } = dataSource || {}
+  const creditsCommodity = (orderModel === 24 || orderModel === 25) // 积分或渠道积分下单模式
+
+  const modelRef = useRef<any>({})
+  const [freePrice, setFreePrice] = useState<number>(freight || 0)
+  const [sum, setSum] = useState<number>(0)
+  // const sum = orderProductRequests.reduce((prev, next) => prev + Number((next.money || 0)), 0)
+  const handleSetting = () => {
+    modelRef.current.setVisible(true)
+  }
+
+  const [amountMoney, setAmountMoney] = useState<number>(sumPrice || sum + freePrice)
+
+  // 总计金额
+  useEffect(() => {
+    console.log(sumPrice || (sum*1000 + freePrice*1000)/1000, 'iiiiii')
+    setAmountMoney(() => sumPrice || (sum*1000 + freePrice*1000)/1000)
+  }, [sum, freePrice, sumPrice])
+
+  const handleConfirm = () => {
+    let free = modalPriceActions.getFieldValue('freePrice')
+    setFreePrice(Number(free || 0))
+    // 执行修改订单运费
+    PublicApi.postOrderProductPriceUpdate({orderId: dataSource.id, price: free, type: 2}).then(res => {
+      if(res.code === 1000) {
+        modelRef.current.setVisible(false)
+        reloadFormData()
+      }
+    })
+  }
+
+  useEffect(() => {
+    // 存在商品 并且有选择收货地址，则开始计算运费
+    if (orderProductRequests && orderProductRequests.length > 0 && receiverAddressId) {
+      // 筛选配送方式为物流的商品并且使用了运费模板
+      const logsiticsDataMaps = orderProductRequests.filter(v => v.logistics && v.logistics.useTemplate && v.logistics.deliveryType === 1)
+      if (logsiticsDataMaps.length > 0) {
+        PublicApi.postLogisticsFreightTemplateCalFreightPrice({
+          orderProductList: logsiticsDataMaps.map(v => ({
+            templateId: v.templateId,
+            weight: v.weight
+          })),
+          receiverAddressId
+        }, {ttl: 10 * 1000, useCache: true, ctlType: 'none'}).then(res => {
+          if (res.code === 1000) {
+            setFreePrice(res.data)
+          }
+        })
+      }
+    }
+
+    const _sum = amount || orderProductRequests.reduce((prev, next) => prev + Number((next.money || 0)), 0)
+    setSum(_sum)
+  }, [orderProductRequests])
+
+  return <RowStyle>
+    <Col span={2}>
+      <div>{creditsCommodity ? '合计所需积分' : '合计金额'}</div>
+      <div>{sum}</div>
+    </Col>
+    <Col span={2}>
+      <div>运费 { isEditData && <SettingOutlined style={{marginLeft: 8}} onClick={handleSetting}/>}</div>
+      <div>{freePrice}</div>
+    </Col>
+    <Col span={2}>
+      <div>{creditsCommodity ? '总计所需积分' : '总计金额'}</div>
+      <div>{amountMoney}</div>
+    </Col>
+    <ModalForm
+      modalTitle='设置运费'
+      currentRef={modelRef}
+      initialValues={freePrice}
+      schema={{
+        type: 'object',
+        properties: {
+          NO_SUBMIT_LAYOUT: {
+            type: 'object',
+            "x-component": 'mega-layout',
+            "x-component-props": {
+              labelAlign: 'top'
+            },
+            properties: {
+              freePrice: {
+                type: 'string',
+                title: '设置运费',
+                "x-props": {
+                  addonBefore: '￥'
+                },
+                "x-rules": [
+                  {
+                    validator: value => {
+                      return isNaN(value)
+                    },
+                    message:'请正确输入数字金额',
+                  },
+                  {
+                    pattern: /^\d+(\.\d{1,2})?$/,
+                    message: '运费仅限两位小数',
+                  },
+                ]
+              }
+            },
+          }
+        }
+      }}
+      actions={modalPriceActions}
+      confirm={handleConfirm}
+    >
+
+    </ModalForm>
+  </RowStyle>
+}
+
+const EditableRow: React.FC<EditableRowProps> = ({ index, ...props }) => {
+  const [form] = Form.useForm();
+  return (
+    <Form form={form} component={false}>
+      <EditableContext.Provider value={form}>
+        <tr {...props} />
+      </EditableContext.Provider>
+    </Form>
+  );
+};
+
+interface EditableCellProps {
+  title: React.ReactNode;
+  editable: boolean;
+  children: React.ReactNode;
+  dataIndex: string;
+  record: Item;
+  handleSave: (record: Item) => void;
+}
+
+const EditableCell: React.FC<EditableCellProps> = ({
+  title,
+  editable,
+  children,
+  dataIndex,
+  record,
+  handleSave,
+  ...restProps
+}) => {
+  const [editing, setEditing] = useState(false);
+  const inputRef = useRef<any>({});
+  const form = useContext(EditableContext);
+
+  useEffect(() => {
+    if (editing) {
+      inputRef.current.focus();
+    }
+  }, [editing]);
+
+  const toggleEdit = () => {
+    setEditing(!editing);
+    form.setFieldsValue({ [dataIndex]: record[dataIndex] });
+  };
+  const save = async e => {
+    try {
+      const values = await form.validateFields();
+      values.price = Number(values.price)
+      values.money = ((Number(values.price)*1000) * parseInt(record.purchaseCount))/1000 // 计算金额
+      toggleEdit();
+      handleSave({ ...record, ...values });
+    } catch (errInfo) {
+      console.log('Save failed:', errInfo);
+    }
+  };
+
+  const cancel = () => {
+    console.log('cancel')
+    setEditing(false)
+  }
+
+  let childNode = children;
+
+  if (editable) {
+    childNode = editing ? (
+      <Form.Item
+        style={{ margin: 0, width: 140 }}
+        name={dataIndex}
+        rules={[
+          {
+            required: true,
+            message: `此项为必填项`,
+          },
+          {
+            pattern: /^\d+(\.\d{1,3})?$/,
+            message: '数值仅限三位小数',
+          }
+        ]}
+      >
+        <Input type='number' ref={inputRef} onBlur={save} onPressEnter={save}/>
+      </Form.Item>
+    ) : (
+      <div className="editable-cell-value-wrap" style={{ paddingRight: 24 }} onClick={toggleEdit}>
+        {children}
+        <EditOutlined/>
+      </div>
+    );
+  }
+
+  return <td {...restProps}>{childNode}</td>;
+};
+
+const SaleOrderProductTable:React.FC<OrderProductTableProps> = (props) => {
+  const { ctl, data, reloadFormData } = useContext(OrderDetailContext)
+  const { page_type } = usePageStatus()
+  const { orderProductRequests = [], orderModel } = data || {}
+  const creditsCommodity = (orderModel === 24 || orderModel === 25) // 积分或渠道积分下单模式
+
+  const [warehouseVisible, setWarehouseVisible] = useState(false)
+  const [checkProductId, setCheckProductId] = useState(0) // 选中的商品id
+  const warehouseRef = useRef<any>({})
+
+  // 判断是否可操作当前表格
+  const isEditData = SaleOrderInsideWorkStateTexts[data.purchaseOrderInteriorState] === '待审核订单'
+  const productComponents = {
+    body: {
+      row: EditableRow,
+      cell: EditableCell
+    }
+  }
+
+  const asyncGetMemberPrice = async (asyncData: any[]) => {
+    return await Promise.all(asyncData.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 ? { value: (data.parameter * 100) + '%', id: v.id } : { value: '', id: 0 }
+    }
+    ))
+  }
+
+  useEffect(() => {
+    // 过滤 会员折扣不存在的列表
+    const hasPriceList = orderProductRequests.filter(v => !v.memberPrice)
+    if (hasPriceList.length > 0) {
+      asyncGetMemberPrice(hasPriceList).then((asyncData) => {
+        if (asyncData.length > 0) {
+          const newData = orderProductRequests.map((v, i) => {
+            if (!v.memberPrice) {
+              v.memberPrice = asyncData.find(j => j.id === v.id)?.value || 0
+            }
+            return v
+          })
+
+          ctl.setData({
+            ...data,
+            orderProductRequests: newData
+          })
+        }
+      })
+    }
+  }, [orderProductRequests])
+
+  const handleSave = row => {
+    const newData = [...orderProductRequests];
+    const index = newData.findIndex(item => row.id === item.id);
+    const item = newData[index];
+    newData.splice(index, 1, {
+      ...item,
+      ...row,
+    });
+    // 执行修改订单价格
+    PublicApi.postOrderProductPriceUpdate({orderId: data.id, orderDetailsId: row.id, price: row.price, type: 1}).then(res => {
+      if(res.code === 1000) {
+        reloadFormData()
+      }
+    })
+    ctl.setData({
+      ...data,
+      orderProductRequests: newData.sort((a, b) => a.id - b.id)
+    })
+  };
+
+  const handlePreviewWarehouse = (record) => {
+    setCheckProductId(record.productId)
+    setWarehouseVisible(true)
+  }
+
+  const productInfoColumns: any[] = [
+    {
+      title: 'ID',
+      dataIndex: 'id',
+      align: 'center',
+      key: 'id',
+    },
+    {
+      title: '商品名称',
+      dataIndex: 'productName',
+      align: 'center',
+      key: 'productName',
+    },
+    {
+      title: '品类',
+      dataIndex: 'category',
+      align: 'center',
+      key: 'category',
+    },
+    {
+      title: '品牌',
+      dataIndex: 'brand',
+      align: 'center',
+      key: 'brand',
+    },
+    {
+      title: '单位',
+      dataIndex: 'unit',
+      align: 'center',
+      key: 'unit',
+    },
+    {
+      title: creditsCommodity ? '所需积分' : '单价（元）',
+      dataIndex: 'price',
+      align: 'left',
+      key: 'price',
+      editable: isEditData
+    },
+    {
+      title: '会员折扣',
+      dataIndex: 'memberPrice',
+      align: 'center',
+      key: 'memberPrice',
+      render: (text, record) => record.isMemberPrice ? (text * 100 + '%') : null
+    },
+    {
+      title: creditsCommodity ? '兑换数量' : '采购数量',
+      dataIndex: 'purchaseCount',
+      align: 'center',
+      key: 'purchaseCount'
+    },
+    {
+      title: '含税',
+      dataIndex: 'none',
+      align: 'center',
+      key: 'none',
+      render: () => '是'
+    },
+    {
+      title: creditsCommodity ? '所需积分小计' : '金额',
+      dataIndex: 'money',
+      align: 'center',
+      key: 'money',
+    },
+    // 接口调用
+    {
+      title: '配送方式',
+      dataIndex: 'logistics',
+      align: 'center',
+      key: 'logistics',
+      render: (text) => (text && text.deliveryType && text.deliveryType === 2) ?
+      <AddressPop pickInfo={text}>{DELIVERY_TYPE[text.deliveryType]}</AddressPop> : DELIVERY_TYPE[text?.deliveryType]
+    },
+    {
+      title: '仓位库存扣减记录',
+      dataIndex: 'record',
+      align: 'center',
+      key: 'record',
+      // @todo 尚未实现, 需UI设计
+      render: (_, record) => <Button type='link' onClick={() => handlePreviewWarehouse(record)}>查看</Button>
+    },
+  ]
+
+  const fetchWarehouseData = useCallback(async (params) => {
+    const { data } = await PublicApi.getWarehousePositionDeductionRecordList({...params, productId: String(checkProductId)})
+    return data
+  }, [checkProductId])
+
+  const columns = productInfoColumns.map(col => {
+    if (!col.editable) {
+      return col;
+    }
+    return {
+      ...col,
+      onCell: record => ({
+        record,
+        editable: col.editable,
+        dataIndex: col.dataIndex,
+        title: col.title,
+        handleSave: handleSave,
+      }),
+    };
+  });
+  return (
+    <MellowCard title='订单商品' style={{marginTop: 24}} bordered={false}>
+      <Table
+        columns={columns}
+        dataSource={orderProductRequests.sort((a, b) => a.id - b.id)}
+        components={productComponents}
+        rowKey='id'
+        pagination={false}
+      />
+      <MoneyTotalBox dataSource={data} isEditData={isEditData}/>
+
+      <ModalTable
+        columns={warehouseColumns}
+        modalTitle='仓位库存扣减记录'
+        visible={warehouseVisible}
+        cancel={() => setWarehouseVisible(false)}
+        currentRef={warehouseRef}
+        confirm={() => setWarehouseVisible(false)}
+        fetchTableData={params => fetchWarehouseData(params)}
+        resetModal={{
+          destroyOnClose: true
+        }}
+      />
+    </MellowCard>
+  )
+}
+
+SaleOrderProductTable.defaultProps = {}
+
+export default SaleOrderProductTable