fix: 修改营销活动执行明细弹窗

src/components/TableModal/index.tsx

@@ -53,11 +53,13 @@ interface Iprops {
   /** customKey */
   customKey?: string,
   /** 宽度 */
-  width?: number
+  width?: number,
+  /** 是否可选 */
+  ctl?: boolean
 }
 
 const TableModal: React.FC<Iprops> = (props: Iprops) => {
-  const { title, visible, schema, columns, effects, tableProps, mode, expressionScope, fetchData, onClose, onOk, value, format, customizeRadio, modalType, footer, customKey, width } = props;
+  const { title, visible, schema, columns, effects, tableProps, mode, expressionScope, fetchData, onClose, onOk, value, format, customizeRadio, modalType, footer, customKey, width, ctl } = props;
   const ref = useRef<any>({});
   const [rowSelection, RowCtl] = useRowSelectionTable({ type: customizeRadio && mode === 'radio' ? 'checkbox' : mode, customKey: customKey });
   const isFirstLoad = useRef<boolean>(true);
@@ -112,7 +114,7 @@ const TableModal: React.FC<Iprops> = (props: Iprops) => {
     )
   }
 
-  const otherProps = modalType === 'Drawer' ? { footer: renderFooter() } : { onOk: handleOk }
+  const otherProps = (modalType === 'Drawer' && ctl) && { footer: renderFooter() }
 
 
   return (
@@ -135,7 +137,7 @@ const TableModal: React.FC<Iprops> = (props: Iprops) => {
         tableType="small"
         fetchTableData={fetchData}
         currentRef={ref}
-        rowSelection={{
+        rowSelection={ctl && {
           ...rowSelection,
           hideSelectAll: customizeRadio,
         }}
@@ -171,7 +173,8 @@ TableModal.defaultProps = {
   customizeRadio: false,
   modalType: "Modal",
   footer: null,
-  width: 900
+  width: 900,
+  ctl: true,
 }
 
 export default TableModal;

src/pages/marketingManage/marketing/marketingExecute/detail.tsx

 import React, { Fragment, useCallback, useMemo, useState } from 'react';
-import { Badge, Button, Tag, Typography, Image } from 'antd';
+import { Badge, Button, Tag, Typography, Image, Space } from 'antd';
 import { history } from 'umi';
 import { Context } from '@/components/DetailLayout/components/context';
 import PeripheralLayout from '@/components/DetailLayout';
@@ -28,6 +28,12 @@ import { postManageWebShopWebAll } from '@/services/ManageV2Api';
 import { GlobalConfig } from '@/global/config';
 const { onFormMount$ } = FormEffectHooks;
 
+/** 订单 */
+const ORDER_TYPE = 1;
+
+/** 退货订单 */
+const REFUND_TYPE = 2;
+
 const DetialLayout = () => {
   const { query: { id } } = history.location;
   const format = (text, fmt?: string) => {
@@ -43,6 +49,7 @@ const DetialLayout = () => {
   const [collocation, setCollocation] = useState<any[]>([]);
   const [listModalVisible, setListModalVisible] = useState<boolean>(false);
   const [tableModalVisible, setTableModalVisible] = useState<boolean>(false);
+  const [idata, setIdata] = useState<any[]>([]);
 
   const [param, setParam] = useState<any>({});
 
@@ -134,7 +141,8 @@ const DetialLayout = () => {
       {
         title: '实购金额',
         key: 'amount',
-        dataIndex: 'amount'
+        dataIndex: 'amount',
+        render: (text) => `￥${Number(text).toFixed(2)}`
       },
       {
         title: '操作',
@@ -193,6 +201,22 @@ const DetialLayout = () => {
           dataIndex: 'restrictTotalNum',
         },
         {
+          title: '参与客户数',
+          key: 'customerCount',
+          dataIndex: 'customerCount'
+        },
+        {
+          title: '实购数量',
+          key: 'salesNum',
+          dataIndex: 'salesNum'
+        },
+        {
+          title: '实购金额',
+          key: 'amount',
+          dataIndex: 'amount',
+          render: (text) => `￥${Number(text).toFixed(2)}`
+        },
+        {
           title: '操作',
           key: 'operation',
           dataIndex: 'operation',
@@ -220,6 +244,22 @@ const DetialLayout = () => {
     return taxText
   }
 
+  const hasQuantity = (DATA: any[], name?: string, name1?: string) => {
+    let buy_no = 0;
+    let refund_no = 0;
+    if (!isEmpty(DATA)) {
+      DATA.forEach(item => {
+        if ((item.recordType === ORDER_TYPE) && name) {
+          buy_no += item[name]
+        } else if ((item.recordType === REFUND_TYPE) && name1) {
+          refund_no += item[name1].toString().split('-')[1]
+          console.log(typeof item[name1], item[name1])
+        }
+      })
+    }
+    return buy_no - refund_no
+  }
+
   const tableModalColumns: ColumnType<any>[] = [
     {
       title: '单据号',
@@ -227,8 +267,8 @@ const DetialLayout = () => {
       dataIndex: 'orderId',
       render: (_text, _r) => (
         <>
-          {_r.recordType === 1 && <Button type='link' target='_blank' onClick={() => history.push(`/orderSystem/list/detail?id=${_r.skuId}`)}>{_r.skuId}</Button>}
-          {_r.recordType === 2 && <Button type='link' target='_blank' onClick={() => history.push(`/afterService/returnManage/query/detail?id=${_text}`)}>{_r.orderNo}</Button>}
+          {_r.recordType === 1 && <Button type='link' target='_blank' onClick={() => history.push(`/memberCenter/tranactionAbility/saleOrder/orderList/preview?id=${_r.skuId}`)}>{_r.orderNo}</Button>}
+          {_r.recordType === 2 && <Button type='link' target='_blank' onClick={() => history.push(`/memberCenter/afterService/returnManage/returnQuery/detail?id=${_text}`)}>{_r.orderNo}</Button>}
         </>
       )
     },
@@ -245,7 +285,7 @@ const DetialLayout = () => {
     {
       title: '客户名称',
       key: 'memberName',
-      dataIndex: 'memberName'
+      dataIndex: 'memberName',
     },
     {
       title: '单据时间',
@@ -265,27 +305,39 @@ const DetialLayout = () => {
       render: (text, record) => `${isHasTax(text)} / ${record.taxRate}%`
     },
     {
-      title: '购买数量',
+      title: <Space direction='vertical' size={0}>
+        <Typography.Text>购买数量</Typography.Text>
+        <Typography.Text type='secondary'>{hasQuantity(idata, 'quantity', 'quantity')}</Typography.Text>
+      </Space>,
       key: 'quantity',
       dataIndex: 'quantity'
     },
     {
-      title: '应付金额',
+      title: <Space direction='vertical' size={0}>
+        <Typography.Text>应付金额</Typography.Text>
+        <Typography.Text type='secondary'>￥{Number(hasQuantity(idata, 'skuPrice')).toFixed(2)}</Typography.Text>
+      </Space>,
       key: 'skuPrice',
       dataIndex: 'skuPrice',
-      render: (text) => `￥${Number(text).toFixed(2)}`
+      render: (text, record) => record.recordType === ORDER_TYPE ? `￥${Number(text).toFixed(2)}` : '-'
     },
     {
-      title: '实付金额',
+      title: <Space direction='vertical' size={0}>
+        <Typography.Text>实付金额</Typography.Text>
+        <Typography.Text type='secondary'>￥{Number(hasQuantity(idata, 'amount', 'amount')).toFixed(2)}</Typography.Text>
+      </Space>,
       key: 'amount',
       dataIndex: 'amount',
       render: (text) => `￥${Number(text).toFixed(2)}`
     },
     {
-      title: '优惠金额',
+      title: <Space direction='vertical' size={0}>
+        <Typography.Text>优惠金额</Typography.Text>
+        <Typography.Text type='secondary'>￥{(Number(hasQuantity(idata, 'skuPrice')) - Number(hasQuantity(idata, 'amount'))).toFixed(2)}</Typography.Text>
+      </Space>,
       key: 'discountPrice',
       dataIndex: 'discountPrice',
-      render: (_text, record) => `￥${(record.skuPrice - record.amount).toFixed(2)}`
+      render: (_text, record) => record.recordType === ORDER_TYPE ? `￥${(record.skuPrice - record.amount).toFixed(2)}` : '-'
     },
   ]
 
@@ -294,6 +346,7 @@ const DetialLayout = () => {
       if (!Array.isArray(fetch)) {
         getMarketingPlatformActivityExecuteDetailGoodsExecuteDetailPage({ ...params, ...param }).then(res => {
           resolve(res.data)
+          setIdata(res.data.data)
         }).catch(error => {
           console.warn(error)
         })
@@ -388,8 +441,9 @@ const DetialLayout = () => {
         width={1200}
         visible={tableModalVisible}
         columns={tableModalColumns}
+        ctl={false}
         tableProps={{
-          rowKey: 'orderId',
+          rowKey: (record) => `${record.orderNo}`,
         }}
         effects={($, actions) => {
           useStateFilterSearchLinkageEffect($, actions, "orderNo", FORM_FILTER_PATH)