feat: 完成请购单合同下单

src/pages/transaction/purchaseOrder/orderCollectSrm/components/materialTableCell/index.tsx

@@ -107,8 +107,8 @@ export const MaterialTableCell:React.FC<MaterialTableCellProps> = ({
           className="purchase_amount_input"
         />
       }
-       // select选择类型
-       case 'select': {
+      // select选择类型
+      case 'select': {
         return <Select
           style={{width: 80}}
           ref={formItemRef}
@@ -131,11 +131,24 @@ export const MaterialTableCell:React.FC<MaterialTableCellProps> = ({
           {...formItemProps}
         />
       }
+      // 备注input
+      case 'remark': {
+        return (
+          <Input
+            style={{ width: 80 }}
+            ref={formItemRef}
+            onChange={save}
+            {...formItemProps}
+            id={dataIndex + record.id}
+            className="purchase_amount_input"
+          />
+        )
+      }
     }
   }
 
-  // 校验最小起订
-  const validatorNumber = (rule, value, callback) => {
+// 校验最小起订
+const validatorNumber = (rule, value, callback) => {
     try {
       let _value = Number(value)
       if(isNaN(_value) || _value < Number(record["minOrder"])) {

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

@@ -44,6 +44,8 @@ export const procurmentRenderInit = (initValue: any) => {
     hasContract: initValue.hasContract,
     contractNo: initValue.contract.contractNo,
     contract: {...initValue.contract},
+    currencyType: initValue.currencyType,
+    paymentType: initValue.paymentType,
   }
 }
 
@@ -250,20 +252,18 @@ export const contractColumns: any[] = [
 export const materialInfoColumns: any[] = [
   {
     title: 'ID',
-    dataIndex: 'id',
-    key: 'id',
+    dataIndex: 'productId',
     className: 'commonHide'
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.code'}),
-    dataIndex: 'code',
-    key: 'code',
+    dataIndex: 'productNo',
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.name1'}),
     dataIndex: 'name',
     key: 'name',
-    render: (t, r) => `${t}/${r.type}`
+    render: (t, r) => `${t}/${r.spec}`
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.category'}),
@@ -339,20 +339,18 @@ export const materialInfoColumns: any[] = [
 export const materialInfoColumnsByRequisition: any[] = [
   {
     title: 'ID',
-    dataIndex: 'id',
-    key: 'id',
+    dataIndex: 'productId',
     className: 'commonHide'
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.code'}),
-    dataIndex: 'code',
-    key: 'code',
+    dataIndex: 'productNo',
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.name1'}),
     dataIndex: 'name',
     key: 'name',
-    render: (t, r) => `${t}/${r.type}`
+    render: (t, r) => `${t}/${r.spec}`
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.orderCollect.constant.category'}),
@@ -424,6 +422,10 @@ export const materialInfoColumnsByRequisition: any[] = [
     key: 'remark',
     formItem: 'input',
     editable: true,
+    formItemProps: {
+      type: 'text',
+      maxLength: 200,
+    },
   },
   {
     title: getIntl().formatMessage({id: 'purchaseOrder.operation'}),

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

@@ -7,7 +7,7 @@ import { getProductCustomerGetMemberCustomerCategoryTree } from '@/services/Prod
 export const useModelTypeChange = (callback) => {
   const utils = useLinkageUtils()
   // 下单模式发生改变时
-  FormEffectHooks.onFieldValueChange$('orderMode').subscribe(state => {
+  FormEffectHooks.onFieldInputChange$('orderMode').subscribe(state => {
     callback(state)
   })
 }

src/pages/transaction/purchaseOrder/orderCollectSrm/index.tsx

@@ -16,9 +16,11 @@ import { useUpdate } from '@umijs/hooks'
 import { help } from '../../common'
 import styles from './index.less'
 import { useMaterialTable } from './model/useMaterialTable'
+import { convertOrderMaterialData } from './utils';
 import ContractModalTable from './components/contractModalTable'
 import MaterialModalTable from './components/materialModalTable'
 import RequisitionModalTable from './components/requisitionModalTable'
+import OrderMaterialsDrawer, { OrderMaterialsConfirmValue, OrderMaterialsDrawerRef } from './components/orderMaterialsDrawer'
 import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect'
 import { OrderModalType } from '@/constants/order'
 import { FormDetailContext } from '@/formSchema/context'
@@ -29,6 +31,7 @@ import { getOrderBuyerCreateDetail, getOrderBuyerCreatePageItems, postOrderBuyer
 import { getLogisticsReceiverAddressGet, getLogisticsSelectListMemberShipperAddress } from '@/services/LogisticsV2Api'
 import { getContractSelectCurrencyList } from '@/services/ContractV2Api'
 import AuthButton from '@/components/AuthButton'
+import { PostOrderMaterialData } from './interface'
 
 export interface PurchaseOrderDetailProps { }
 
@@ -68,6 +71,7 @@ const fetchPaymentType = async () => {
 export const MoneyTotalBox = registerVirtualBox('moneyTotalBox', props => {
   const { form } = useFormSpy({ selector: [['onFieldValueChange', 'products']], reducer: v => v })
   const data = form.getFieldValue('products')
+  console.log('datadata', data)
   const sum = data.reduce((prev, next) => (prev*100 + (next.amount || 0)*100)/100, 0)
   const [freePrice, setFreePrice] = useState<number>(0)
   const intl = useIntl()
@@ -110,12 +114,36 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
     }
     return resultState
   })
+  const [visibleOrderMaterialsDrawer, setVisibleOrderMaterialsDrawer] = useState(false)
 
   const { formContext } = useFormDetail()
 
+  const orderMaterialsDrawerRef = useRef<OrderMaterialsDrawerRef | null>(null)
+
+  const handleVisibleOrderMaterialsDrawer = (flag?: boolean) => {
+    setVisibleOrderMaterialsDrawer(!!flag);
+  };
+
+  // 同步删除抽屉选中项
+  const handleDeleteOrderMaterialsRecord = (record: PostOrderMaterialData) => {
+    orderMaterialsDrawerRef.current?.deleteItem(record)
+  }
+
   // 订单物料
-  const { materialAddButton, materialRef, materialColumns, materialComponents, ...surplusProps } = useMaterialTable(addSchemaAction)
-  const { materialColumns: materialColumnsByRequisition } = useMaterialTable(addSchemaAction, OrderModalType.PURCHASE_REQUISITION_CONTRACT_ORDER, requisitionRef)
+  const { materialAddButton, materialRef, materialColumns, materialComponents, ...surplusProps } = useMaterialTable(
+    addSchemaAction,
+    addSchemaAction.getFieldValue('orderMode'),
+    null,
+    () => handleVisibleOrderMaterialsDrawer(true),
+    handleDeleteOrderMaterialsRecord,
+  )
+  const { materialColumns: materialColumnsByRequisition } = useMaterialTable(
+    addSchemaAction,
+    OrderModalType.PURCHASE_REQUISITION_CONTRACT_ORDER,
+    requisitionRef,
+    () => handleVisibleOrderMaterialsDrawer(true),
+    handleDeleteOrderMaterialsRecord,
+  )
 
   let timerSignature = null
   useEffect(() => {
@@ -178,7 +206,6 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
         const address = deliveryAddress[0]
         return {
           ...item,
-          spec: item.type,
           quotedSpec: item.relevanceProductType,
           deliveryType: item.logistics,
           addressId: address?.id || null,
@@ -249,12 +276,12 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
         remark: params.remark,
       }
 
-      const _params = procurementProcessField(params)
-      console.log(_params)
+      // const _params = procurementProcessField(params)
+      console.log(params)
       if(id) {
-        fnResult = await postOrderBuyerCreateSrmUpdate({..._params, orderId: id})
+        fnResult = await postOrderBuyerCreateSrmUpdate({...params, orderId: id})
       } else {
-        fnResult = await postOrderBuyerCreateSrm(_params)
+        fnResult = await postOrderBuyerCreateSrm(params)
       }
       if (fnResult.code === 1000) {
         setTimeout(() => {
@@ -275,6 +302,33 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
     contractOrderRef.current.setVisible(true)
   }
 
+  const handleOrderMaterialsConfirm = (value: OrderMaterialsConfirmValue) => {
+    const productDataValue = addSchemaAction.getFieldValue('products');
+    const contractValue = addSchemaAction.getFieldValue('contract');
+    let mergeArr = [];
+
+    value.forEach((item) => {
+      const entity = productDataValue.find((material) => material.id === item.id);
+      if (entity) {
+        mergeArr.push({
+          ...entity,
+          ...convertOrderMaterialData(item),
+        });
+      } else {
+        mergeArr.push({ ...convertOrderMaterialData(item) });
+      }
+    });
+    mergeArr = mergeArr.map((item) => ({
+      ...item,
+      // 兼容之前订单物料数据
+      logistics: 1,
+      memberId: contractValue.partyBMemberId,
+      memberRoleId: contractValue.partyBRoleId,
+      amount: +(item.price * item.quantity).toFixed(2), // 这里应该会出现计算不准的问题
+    }))
+    addSchemaAction.setFieldValue('products', mergeArr);
+  };
+
   const orderContract = pageStatus === PageStatus.ADD && <div className='connectBtn' onClick={handleOrderContract}><LinkOutlined style={{marginRight: 4}}/>{intl.formatMessage({id: 'purchaseOrder.orderCollect.button1'})}</div>
 
   // 新增收货地址
@@ -286,6 +340,9 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
     formContext,
   }
 
+  const contractValue = addSchemaAction.getFieldValue('contract');
+  const orderModeValue = addSchemaAction.getFieldValue('orderMode');
+
   return (<div style={{margin: -24}}>
     <FormDetailContext.Provider value={providerValue}>
       <FormDetailHeader
@@ -328,7 +385,9 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
               // 选择某种类型时， 需显示对应的订单类型
               ctx.setFieldValue('type', orderTypeLabelMap[value])
               addSchemaAction.setFieldState('products', productState => {
-                productState.value = [] // 切换下单模式时，清空“订单物料”原有数据
+                if (productState.value && productState.value.length) {
+                  productState.value = [] // 切换下单模式时，清空“订单物料”原有数据
+                }
                 productState.props["x-component-props"] = {
                   ...productState.props["x-component-props"],
                   columns: value === OrderModalType.PURCHASE_REQUISITION_CONTRACT_ORDER
@@ -337,6 +396,11 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
                   prefix: editable && pageStatus === PageStatus.ADD ? materialAddButton : '',
                 }
               })
+              // 清空合同相关的数据
+              addSchemaAction.setFieldValue('contractNo', undefined);
+              addSchemaAction.getFieldValue('vendorMemberName') && addSchemaAction.setFieldValue('vendorMemberName', '');
+              addSchemaAction.getFieldValue('vendorMemberId') && addSchemaAction.setFieldValue('vendorMemberId', '');
+              addSchemaAction.getFieldValue('vendorRoleId') && addSchemaAction.setFieldValue('vendorRoleId', '');
             })
             // 选择完对应合同
             useContractChange(({ value }) => {
@@ -377,6 +441,17 @@ const PurchaseOrderDetail:React.FC<PurchaseOrderDetailProps> = (props) => {
     {/* 查看关联请购单 */}
     <RequisitionModalTable currentRef={requisitionRef} schemaAction={addSchemaAction} />
 
+    {/* 选择采购物料抽屉 */}
+    <OrderMaterialsDrawer
+      visible={visibleOrderMaterialsDrawer}
+      onClose={() => handleVisibleOrderMaterialsDrawer(false)}
+      contractId={contractValue?.id || 0}
+      orderMode={orderModeValue || 0}
+      value={[]}
+      onConfirm={handleOrderMaterialsConfirm}
+      ref={orderMaterialsDrawerRef}
+    />
+
   </div>)
 }
 

src/pages/transaction/purchaseOrder/orderCollectSrm/interface.ts

+import { PostOrderBuyerCreateSrmRequest } from "@/services/OrderNewV2Api";
+
+export type PostOrderMaterialData = PostOrderBuyerCreateSrmRequest['products'][0] & {
+  detailId: number,
+}
\ No newline at end of file

src/pages/transaction/purchaseOrder/orderCollectSrm/model/useMaterialTable.tsx

@@ -26,7 +26,13 @@ export const getUnitPriceTotal = (record) => {
 /**
  * @param ctx schemaAction
  */
-export const useMaterialTable = (ctx: ISchemaFormActions | ISchemaFormAsyncActions, orderMode = ctx.getFieldValue('orderMode'), requisitionRef?: React.MutableRefObject<any>) => {
+export const useMaterialTable = (
+  ctx: ISchemaFormActions | ISchemaFormAsyncActions,
+  orderMode = ctx.getFieldValue('orderMode'),
+  requisitionRef?: React.MutableRefObject<any>,
+  onClickAdd?: () => void,
+  onDeleteRecord?: (record: any) => void,
+) => {
   const materialRef = useRef<any>({})
   const intl = useIntl()
   const { visible, setVisible, rowSelection, rowSelectionCtl } = useModalTable({type: 'checkbox'})
@@ -41,7 +47,7 @@ export const useMaterialTable = (ctx: ISchemaFormActions | ISchemaFormAsyncActio
     rowSelectionCtl.setSelectRow(newData)
     rowSelectionCtl.setSelectedRowKeys(newData.map(v => v.id))
     ctx.setFieldValue('products', newData)
-
+    onDeleteRecord?.(record)
   }
 
 
@@ -88,6 +94,10 @@ export const useMaterialTable = (ctx: ISchemaFormActions | ISchemaFormAsyncActio
     const supplyMembersId = ctx.getFieldValue('vendorMemberId')
     const products = ctx.getFieldValue('products')
     if (supplyMembersId) {
+      if (onClickAdd) {
+        onClickAdd?.();
+        return;
+      }
       materialRef.current.setVisible(true)
       materialRef.current.rowSelectionCtl.setSelectedRowKeys(() => products.map(item => item.id))
     } else {

src/pages/transaction/purchaseOrder/orderCollectSrm/schema/index.ts

@@ -306,7 +306,8 @@ export const orderMaterials: ISchema = {
         message: getIntl().formatMessage({id: 'common.bitian'}),
       }],
       "x-component-props": {
-        rowKey: 'materialId',
+        // rowKey: 'materialId',
+        rowKey: 'productId',
         columns: "{{materialColumns}}",
         components: "{{materialComponents}}",
         prefix: "{{materialAddButton}}",

src/pages/transaction/purchaseOrder/orderCollectSrm/utils.ts

+import { OrderMaterialsConfirmValue } from './components/orderMaterialsDrawer';
+import { PostOrderMaterialData } from './interface';
+
+/**
+ * 订单物料数据 转 新增SRM订单商品数据
+ * @param dataSource 订单物料数据
+ * @returns 新增SRM订单商品数据
+ */
+export const convertOrderMaterialData = (dataSource: OrderMaterialsConfirmValue[0]): PostOrderMaterialData => ({
+  productId: dataSource.id,
+  productNo: dataSource.materielNo,
+  name: dataSource.materielName,
+  category: dataSource.category,
+  brand: dataSource.brand,
+  spec: dataSource.type,
+  unit: dataSource.unit,
+  tax: dataSource.isHasTax === 1,
+  taxRate: dataSource.taxRate,
+  deliveryType: undefined,
+  price: dataSource.price,
+  stock: dataSource.supplierInventory,
+  quantity: dataSource.requisitionList?.reduce((pre, now) => (now as any).orderQuantity + pre, 0) || 0,
+  requisitions: dataSource.requisitionList?.map(({ detailId, ...rest }) => ({
+    requisitionId: detailId,
+    orderQuantity: (rest as any).orderQuantity,
+  })) || [],
+  quotedSkuId: dataSource.associatedDataId,
+  quotedName: dataSource.associatedGoods,
+  quotedSpec: dataSource.associatedType,
+  quotedCategory: dataSource.associatedCategory,
+  quotedBrand: dataSource.associatedBrand,
+  detailId: dataSource.detailId,
+});