fix: 订单详情月结账期支付方式显示

src/pages/orderSystem/orderDetail/components/orderPayTabs/index.tsx

@@ -37,14 +37,26 @@ const TabHeader = ({dataSource}) => {
   </div>
 }
 
-// 支付信息
-
-const payTextList = ["",
+// 支付方式
+const payTextList = [
+  "积分支付",
   '线上支付',
   '线下支付',
   '授信支付',
-  '货到付款'
+  '货到付款',
+]
+// 支付渠道
+const payChannel = [
+  "积分支付",
+  "支付宝",
+  "微信",
+  "银联",
+  "余额支付",
+  "线下支付线上确认",
+  "授信额度支付",
+  "货到付款",
 ]
+
 const OrderPayTabs:React.FC<OrderPayTabsProps> = (props) => {
   const { data } = useContext(OrderDetailContext)
   const [payList, setPaylist] = useState<any[]>([])
@@ -72,14 +84,24 @@ const OrderPayTabs:React.FC<OrderPayTabsProps> = (props) => {
                   <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 || (v.channel === 0 && '积分支付')}</Col>
-                </Row>
+                {
+                  v.payWay === -1 ?
+                  <Row>
+                    <Col className={style.fontGray} span={4}>支付方式: </Col>
+                    <Col>{v.channel === 100 ? '账期' : '月结'}</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>{payChannel[v.channel]}</Col>
+                    </Row>
+                  </>
+                }
             </TabPane>) }
           </Tabs>
         {/* </Row> */}

src/pages/orderSystem/orderDetail/index.tsx

-import React, { useState, useEffect, useContext, useRef } from 'react'
-import OrderDetailHeader from '../components/OrderDetailHeader'
-import { Link, history } from 'umi'
-import { orderTypeLabel, SALE_ORDER_STATUS } from './constant'
-import { formatTimeString } from '@/utils'
-import { usePageStatus, PageStatus } from '@/hooks/usePageStatus'
-import { PublicApi } from '@/services/api'
-import AuditProcess from '@/components/AuditProcess'
-import { findLastIndexFlowState } from '@/utils'
-import OrderDetailWrapper from '../components/OrderDetailWrapper'
-import { GlobalConfig } from '@/global/config'
-import OrderProductTable from './components/orderProductTable'
-import { OrderDetailContext } from './context'
-import OrderMergeInfo from './components/orderMergeInfo'
-import OrderTransformRecord from './components/orderTransformRecord'
-import OrderPayTabs from './components/orderPayTabs'
-import StatusColors from '../components/StatusColors'
-import OrderDeleveRecord from './components/orderDeleveRecord'
-
-export interface CommonOrderDetailProps {}
-
-const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
-
-  const [formData, setFormData] = useState<any>(null)
-  let { id, pageStatus, page_type = SALE_ORDER_STATUS.READY_APPROVED_ORDER, orderNo } = usePageStatus()
-  page_type = Number(page_type)
-  const payResultVisible = useRef<any>({})
-  const [payResultType, setPayResultType] = useState<'default' | 'preview'>('default')
-  useEffect(() => {
-    reloadFormData()
-  }, [])
-
-  const reloadFormData = () => {
-    if (id || orderNo) {
-      PublicApi.getOrderPlatformOrderDetails({ id, orderNo }).then(({data, code}) => {
-        if (code === 1000) {
-          setFormData(data)
-        }
-      })
-    }
-  }
-
-  const formContext = {
-    data: formData,
-    payResultType,
-    setPayResultType,
-    payResultVisible,
-    reloadFormData,
-    ctl: {
-      setData: setFormData
-    }
-  }
-
-  const detailList = [
-    { label: '对应报价单号', name: 'quotationNo', span: 8, render: text => <Link to={'/'}>{text}</Link> },
-    { label: '订单摘要', name: 'orderThe', span: 8 },
-    { label: '供应会员', name: '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: 'purchaseOrderInteriorState', span: 8, render: text => <StatusColors type='saleInside' status={text}/> },
-  ]
-  const headerTiTle = formData ? {
-    picName: '单',
-    titleLabel: '订单号: ',
-    titleValue: formData.orderNo
-  } : null
-
-  return formData ? (
-    <div>
-      <OrderDetailContext.Provider value={formContext}>
-        <OrderDetailHeader headerTitle={headerTiTle} detailList={detailList} detailData={formData}/>
-        <OrderDetailWrapper>
-          <div className='gray-wrap'>
-            {/* 工作流进度 */}
-            { pageStatus !== PageStatus.ADD && formData && formData.externalWorkflowFlowRecordLogResponses && <AuditProcess
-              customTitleKey='operationalProcess'
-              customKey='state'
-              outerVerifyCurrent={findLastIndexFlowState(formData.externalWorkflowFlowRecordLogResponses)}
-              innerVerifyCurrent={findLastIndexFlowState(formData.interiorWorkflowFlowRecordLogResponses)}
-              outerVerifySteps={formData.externalWorkflowFlowRecordLogResponses || []}
-              innerVerifySteps={formData.interiorWorkflowFlowRecordLogResponses || []}
-            ></AuditProcess> }
-
-            {/* 商品列表 */}
-            <OrderProductTable/>
-
-            {/* 支付信息 todo */}
-            <OrderPayTabs/>
-
-            {/* 杂项 */}
-            <OrderMergeInfo/>
-
-            {/* 订单发货记录 */}
-            <OrderDeleveRecord/>
-
-            {/* 订单流转记录 */}
-            <OrderTransformRecord/>
-          </div>
-        </OrderDetailWrapper>
-      </OrderDetailContext.Provider>
-    </div>
-  ) : null
-}
-
-CommonOrderDetail.defaultProps = {}
-
-export default CommonOrderDetail
+import React, { useState, useEffect, useContext, useRef } from 'react'
+import OrderDetailHeader from '../components/OrderDetailHeader'
+import { Link, history } from 'umi'
+import { orderTypeLabel, SALE_ORDER_STATUS } from './constant'
+import { formatTimeString } from '@/utils'
+import { usePageStatus, PageStatus } from '@/hooks/usePageStatus'
+import { PublicApi } from '@/services/api'
+import AuditProcess from '@/components/AuditProcess'
+import { findLastIndexFlowState } from '@/utils'
+import OrderDetailWrapper from '../components/OrderDetailWrapper'
+import { GlobalConfig } from '@/global/config'
+import OrderProductTable from './components/orderProductTable'
+import { OrderDetailContext } from './context'
+import OrderMergeInfo from './components/orderMergeInfo'
+import OrderTransformRecord from './components/orderTransformRecord'
+import OrderPayTabs from './components/orderPayTabs'
+import StatusColors from '../components/StatusColors'
+import OrderDeleveRecord from './components/orderDeleveRecord'
+
+export interface CommonOrderDetailProps {}
+
+const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
+
+  const [formData, setFormData] = useState<any>(null)
+  let { id, pageStatus, page_type = SALE_ORDER_STATUS.READY_APPROVED_ORDER, orderNo } = usePageStatus()
+  page_type = Number(page_type)
+  const payResultVisible = useRef<any>({})
+  const [payResultType, setPayResultType] = useState<'default' | 'preview'>('default')
+  useEffect(() => {
+    reloadFormData()
+  }, [])
+
+  const reloadFormData = () => {
+    if (id || orderNo) {
+      PublicApi.getOrderPlatformOrderDetails({ id, orderNo }).then(({data, code}) => {
+        if (code === 1000) {
+          setFormData(data)
+        }
+      })
+    }
+  }
+
+  const formContext = {
+    data: formData,
+    payResultType,
+    setPayResultType,
+    payResultVisible,
+    reloadFormData,
+    ctl: {
+      setData: setFormData
+    }
+  }
+
+  const detailList = [
+    { label: '对应报价单号', name: 'quotationNo', span: 8, render: text => <Link to={'/'}>{text}</Link> },
+    { label: '订单摘要', name: 'orderThe', span: 8 },
+    { label: '供应会员', name: '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: 'purchaseOrderInteriorState', span: 8, render: text => <StatusColors type='saleInside' status={text}/> },
+  ]
+  const headerTiTle = formData ? {
+    picName: '单',
+    titleLabel: '订单号: ',
+    titleValue: formData.orderNo
+  } : null
+
+  return formData ? (
+    <div>
+      <OrderDetailContext.Provider value={formContext}>
+        <OrderDetailHeader headerTitle={headerTiTle} detailList={detailList} detailData={formData}/>
+        <OrderDetailWrapper>
+          <div className='gray-wrap'>
+            {/* 工作流进度 */}
+            { pageStatus !== PageStatus.ADD && formData && formData.externalWorkflowFlowRecordLogResponses && <AuditProcess
+              customTitleKey='operationalProcess'
+              customKey='state'
+              outerVerifyCurrent={findLastIndexFlowState(formData.externalWorkflowFlowRecordLogResponses)}
+              innerVerifyCurrent={findLastIndexFlowState(formData.interiorWorkflowFlowRecordLogResponses)}
+              outerVerifySteps={formData.externalWorkflowFlowRecordLogResponses || null}
+              innerVerifySteps={formData.interiorWorkflowFlowRecordLogResponses || null}
+            ></AuditProcess> }
+
+            {/* 商品列表 */}
+            <OrderProductTable/>
+
+            {/* 支付信息 todo */}
+            <OrderPayTabs/>
+
+            {/* 杂项 */}
+            <OrderMergeInfo/>
+
+            {/* 订单发货记录 */}
+            <OrderDeleveRecord/>
+
+            {/* 订单流转记录 */}
+            <OrderTransformRecord/>
+          </div>
+        </OrderDetailWrapper>
+      </OrderDetailContext.Provider>
+    </div>
+  ) : null
+}
+
+CommonOrderDetail.defaultProps = {}
+
+export default CommonOrderDetail