提交 aae38595 作者: 龚洪江

功能:采购流程联调

上级 4339d183
...@@ -1453,6 +1453,17 @@ type purchaseOrderItemType = { ...@@ -1453,6 +1453,17 @@ type purchaseOrderItemType = {
*/ */
uavOrderId?: number; uavOrderId?: number;
}[]; }[];
kdnExpDTO?: {
logisticCode?: string;
shipperCode?: string;
stateEx?: string;
traces?: {
acceptStation?: string;
acceptTime?: string;
action?: string;
location?: string;
}[];
};
}; };
export type listPurchaseOrderType = InterListFunction< export type listPurchaseOrderType = InterListFunction<
{ {
......
import { Button, Descriptions, Image, Table } from 'antd'; import { Button, Descriptions, Image, Steps, Table } from 'antd';
import { useNavigate, useSearchParams } from 'react-router-dom'; import { useNavigate, useSearchParams } from 'react-router-dom';
import { FddInterfaceAPI, OrderManageAPI } from '~/api'; import { FddInterfaceAPI, OrderManageAPI } from '~/api';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
...@@ -9,6 +9,7 @@ import { ColumnsType } from 'antd/es/table'; ...@@ -9,6 +9,7 @@ import { ColumnsType } from 'antd/es/table';
import './index.scss'; import './index.scss';
import { decode } from 'js-base64'; import { decode } from 'js-base64';
import FileSaver from 'file-saver'; import FileSaver from 'file-saver';
import LogisticsStepModal from '~/components/order/productOrder/logisticsStepModal';
// 采购订单详情返回类型 // 采购订单详情返回类型
type detailType = InterDataType<purchaseOrderDetailType>; type detailType = InterDataType<purchaseOrderDetailType>;
...@@ -60,6 +61,7 @@ const ProcurementOrderDetail = () => { ...@@ -60,6 +61,7 @@ const ProcurementOrderDetail = () => {
render: () => `${purchaseOrderDetail?.orderAmount}`, render: () => `${purchaseOrderDetail?.orderAmount}`,
}, },
]; ];
const [logisticsStepModalShow, setLogisticsStepModalShow] = useState<boolean>(false);
// 获取采购订单详情 // 获取采购订单详情
const getPurchaseOrderDetail = (id: number) => { const getPurchaseOrderDetail = (id: number) => {
...@@ -103,6 +105,12 @@ const ProcurementOrderDetail = () => { ...@@ -103,6 +105,12 @@ const ProcurementOrderDetail = () => {
}); });
} }
}; };
const showStepModal = () => {
setLogisticsStepModalShow(true);
};
const logisticsStepModalCancel = () => {
setLogisticsStepModalShow(false);
};
useEffect(() => { useEffect(() => {
getPurchaseOrderDetail(Number(searchParams.get('id'))); getPurchaseOrderDetail(Number(searchParams.get('id')));
...@@ -164,7 +172,32 @@ const ProcurementOrderDetail = () => { ...@@ -164,7 +172,32 @@ const ProcurementOrderDetail = () => {
<Descriptions.Item label='物流单号:'> <Descriptions.Item label='物流单号:'>
{purchaseOrderDetail?.uavOrderExpressDTO.sendExpNo || '--'} {purchaseOrderDetail?.uavOrderExpressDTO.sendExpNo || '--'}
</Descriptions.Item> </Descriptions.Item>
<Descriptions.Item label='物流进度:'>--</Descriptions.Item> <Descriptions.Item label='物流进度:'>
<div>
<Steps
direction='vertical'
current={0}
progressDot
items={[
{
title: purchaseOrderDetail?.kdnExpDTO?.traces?.[0].acceptStation,
description: purchaseOrderDetail?.kdnExpDTO?.traces?.[0].acceptTime,
},
{
title: `送至${
purchaseOrderDetail?.uavOrderExpressDTO?.takeRegion.split('/').join('') ||
'' + purchaseOrderDetail?.uavOrderExpressDTO?.takeAddress
}`,
},
]}
/>
</div>
<div>
<Button type='link' onClick={showStepModal}>
查看详情
</Button>
</div>
</Descriptions.Item>
</Descriptions> </Descriptions>
<Descriptions title='凭证及合同' bordered style={{ marginTop: '10px' }}> <Descriptions title='凭证及合同' bordered style={{ marginTop: '10px' }}>
<Descriptions.Item label='付款凭证:'> <Descriptions.Item label='付款凭证:'>
...@@ -200,6 +233,11 @@ const ProcurementOrderDetail = () => { ...@@ -200,6 +233,11 @@ const ProcurementOrderDetail = () => {
)} )}
</Descriptions.Item> </Descriptions.Item>
</Descriptions> </Descriptions>
<LogisticsStepModal
open={logisticsStepModalShow}
logisticsStep={purchaseOrderDetail?.kdnExpDTO}
onCancel={logisticsStepModalCancel}
/>
</div> </div>
); );
}; };
......
import { Form, Input, message, Modal, ModalProps } from 'antd'; import { Form, Image, Input, message, Modal, ModalProps, Table } from 'antd';
import { FC, useState } from 'react'; import { FC, useState } from 'react';
import { Uploader } from '~/components/uploader'; import { Uploader } from '~/components/uploader';
import { UploadOutlined } from '@ant-design/icons'; import { UploadOutlined } from '@ant-design/icons';
...@@ -6,6 +6,7 @@ import { UploadFile } from 'antd/es/upload/interface'; ...@@ -6,6 +6,7 @@ import { UploadFile } from 'antd/es/upload/interface';
import { OrderManageAPI } from '~/api'; import { OrderManageAPI } from '~/api';
import { listPurchaseOrderType } from '~/api/interface/orderManageType'; import { listPurchaseOrderType } from '~/api/interface/orderManageType';
import { InterListType } from '~/api/interface'; import { InterListType } from '~/api/interface';
import { ColumnsType } from 'antd/es/table/InternalTable';
// 采购订单列表返回类型 // 采购订单列表返回类型
type procurementOrderType = InterListType<listPurchaseOrderType>[0]; type procurementOrderType = InterListType<listPurchaseOrderType>[0];
...@@ -17,6 +18,36 @@ interface selfProps { ...@@ -17,6 +18,36 @@ interface selfProps {
const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onCancel, onOk }) => { const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onCancel, onOk }) => {
const [form] = Form.useForm<{ payImgList: string; payRemark: string }>(); const [form] = Form.useForm<{ payImgList: string; payRemark: string }>();
const [fileList, setFileList] = useState<UploadFile[]>([]); const [fileList, setFileList] = useState<UploadFile[]>([]);
const tableColumns: ColumnsType<procurementOrderType['payDTOS'][0]> = [
{
title: '序号',
align: 'center',
render: (_text: any, _record, index) => index + 1,
},
{
title: '凭证',
align: 'center',
dataIndex: 'payImgList',
render: (text: string) =>
JSON.parse(text || '[]').map((v: any, index: number) => (
<Image src={v.filePath} width={50} height={50} key={index} />
)),
},
{
title: '状态',
align: 'center',
dataIndex: 'checkStatus',
render: (text: number) => (text === 0 ? '审批中' : text === 1 ? '已通过' : '未通过'),
},
{
title: '备注',
align: 'center',
width: '10%',
ellipsis: true,
dataIndex: 'payRemark',
},
];
// 上传成功 // 上传成功
const uploadSuccess = (value: any) => { const uploadSuccess = (value: any) => {
setFileList([...value]); setFileList([...value]);
...@@ -43,8 +74,8 @@ const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onC ...@@ -43,8 +74,8 @@ const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onC
onCancel(); onCancel();
}; };
return ( return (
<Modal open={open} onOk={handleOk} onCancel={handleCancel} title='上传付款凭证'> <Modal open={open} onOk={handleOk} onCancel={handleCancel} title='上传付款凭证' width={1000}>
<Form form={form} labelCol={{ span: 2 }} wrapperCol={{ span: 20 }}> <Form form={form} labelCol={{ span: 2 }} wrapperCol={{ span: 15 }}>
<Form.Item <Form.Item
label='凭证' label='凭证'
rules={[{ required: true, message: '请上传付款凭证' }]} rules={[{ required: true, message: '请上传付款凭证' }]}
...@@ -64,6 +95,17 @@ const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onC ...@@ -64,6 +95,17 @@ const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onC
<Input.TextArea placeholder='请输入备注' maxLength={70} rows={4} showCount /> <Input.TextArea placeholder='请输入备注' maxLength={70} rows={4} showCount />
</Form.Item> </Form.Item>
</Form> </Form>
{currentOrderItem?.payDTOS?.length ? (
<Table
bordered
columns={tableColumns}
rowKey='id'
dataSource={currentOrderItem.payDTOS}
pagination={false}
/>
) : (
''
)}
</Modal> </Modal>
); );
}; };
......
...@@ -17,6 +17,7 @@ import { decode } from 'js-base64'; ...@@ -17,6 +17,7 @@ import { decode } from 'js-base64';
import UploadPayment from '~/pages/orderManage/procurementOrder/orderList/components/uploadPayment'; import UploadPayment from '~/pages/orderManage/procurementOrder/orderList/components/uploadPayment';
import ApprovalOrder from '~/components/order/productOrder/approvalOrder'; import ApprovalOrder from '~/components/order/productOrder/approvalOrder';
import ShipmentsOrder from '~/components/order/productOrder/shipmentsOrder'; import ShipmentsOrder from '~/components/order/productOrder/shipmentsOrder';
import { useSelector } from 'react-redux';
// 采购订单列表返回类型 // 采购订单列表返回类型
type procurementOrderListType = InterListType<listPurchaseOrderType>; type procurementOrderListType = InterListType<listPurchaseOrderType>;
...@@ -25,22 +26,23 @@ type procurementOrderParamsType = InterReqListType<listPurchaseOrderType>; ...@@ -25,22 +26,23 @@ type procurementOrderParamsType = InterReqListType<listPurchaseOrderType>;
const ProcurementOrderList = () => { const ProcurementOrderList = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const { userInfo } = useSelector((state: any) => state.UserInfo);
// 订单操作按钮列表 // 订单操作按钮列表
const operateBtnList = [ const operateBtnList = [
{ {
btnStr: '确认订单', btnStr: userInfo.companyInfoVO.companyType === 0 ? '确认订单' : '',
status: 200, status: 200,
btnClick: (record: procurementOrderListType[0]) => { btnClick: (record: procurementOrderListType[0]) => {
setCurrentOrderItem(record); setCurrentOrderItem({ ...record });
setSureOrderShow(true); setSureOrderShow(true);
}, },
}, },
{ {
btnStr: '签署合同', btnStr: userInfo.companyInfoVO.companyType !== 0 ? '签署合同' : '',
status: 300, status: 300,
btnClick: (record: procurementOrderListType[0]) => { btnClick: (record: procurementOrderListType[0]) => {
setCurrentOrderItem(record); setCurrentOrderItem({ ...record });
getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => { getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => {
if (result.contractInfoDTO) { if (result.contractInfoDTO) {
contractSign(result.contractInfoDTO?.contractNo); contractSign(result.contractInfoDTO?.contractNo);
...@@ -49,23 +51,15 @@ const ProcurementOrderList = () => { ...@@ -49,23 +51,15 @@ const ProcurementOrderList = () => {
}, },
}, },
{ {
btnStr: '上传付款凭证', btnStr: userInfo.companyInfoVO.companyType === 0 ? '上传付款凭证' : '',
status: 400, status: 400,
btnClick: (record: procurementOrderListType[0]) => { btnClick: (record: procurementOrderListType[0]) => {
setCurrentOrderItem(record);
setUploadPaymentShow(true);
},
},
{
btnStr: '凭证审批',
status: 420,
btnClick: (record: procurementOrderListType[0]) => {
setCurrentOrderItem({ ...record }); setCurrentOrderItem({ ...record });
setApprovalOrderShow(true); setUploadPaymentShow(true);
}, },
}, },
{ {
btnStr: '发货', btnStr: userInfo.companyInfoVO.companyType !== 0 ? '发货' : '',
status: 500, status: 500,
btnClick: (record: procurementOrderListType[0]) => { btnClick: (record: procurementOrderListType[0]) => {
getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => { getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => {
...@@ -190,7 +184,7 @@ const ProcurementOrderList = () => { ...@@ -190,7 +184,7 @@ const ProcurementOrderList = () => {
<TableItem <TableItem
tr={ tr={
<> <>
{getCurrentOperateBtn ? ( {getCurrentOperateBtn(record.statusCode)?.btnStr ? (
<Button <Button
type={'link'} type={'link'}
onClick={() => getCurrentOperateBtn(record.statusCode)?.btnClick(record)} onClick={() => getCurrentOperateBtn(record.statusCode)?.btnClick(record)}
...@@ -200,6 +194,21 @@ const ProcurementOrderList = () => { ...@@ -200,6 +194,21 @@ const ProcurementOrderList = () => {
) : ( ) : (
'' ''
)} )}
{isAgainUploadPaymentShow(record) ? (
<Button type='link' onClick={() => againUploadPayment(record)}>
再次上传付款凭证
</Button>
) : (
''
)}
{isApprovePaymentShow(record) ? (
<Button type='link' onClick={() => approvePaymentClick(record)}>
凭证审批
</Button>
) : (
''
)}
<Button type='link' onClick={() => toProcurementOrderDetail(record)}> <Button type='link' onClick={() => toProcurementOrderDetail(record)}>
详情 详情
</Button> </Button>
...@@ -310,19 +319,35 @@ const ProcurementOrderList = () => { ...@@ -310,19 +319,35 @@ const ProcurementOrderList = () => {
setUploadPaymentShow(false); setUploadPaymentShow(false);
getListPurchaseOrder(query); getListPurchaseOrder(query);
}; };
// 再次上传付款凭证
const againUploadPayment = (record: procurementOrderListType[0]) => {
setCurrentOrderItem({ ...record });
setUploadPaymentShow(true);
};
const isAgainUploadPaymentShow = (record: procurementOrderListType[0]) => {
return [500].includes(record.statusCode) && userInfo.companyInfoVO.companyType === 0;
};
useEffect(() => {
getOrderStatusList();
getListPurchaseOrder();
}, []);
// 凭证审批 // 凭证审批
const approvalOrderOk = () => { const approvalOrderOk = () => {
getListPurchaseOrder(query);
setApprovalOrderShow(false); setApprovalOrderShow(false);
}; };
const approvalOrderCancel = () => { const approvalOrderCancel = () => {
setApprovalOrderShow(false); setApprovalOrderShow(false);
getListPurchaseOrder(query); getListPurchaseOrder(query);
}; };
const isApprovePaymentShow = (record: procurementOrderListType[0]) => {
return (
userInfo.companyInfoVO.companyType !== 0 &&
([420].includes(record.statusCode) || record.payDTOS?.some((v) => v.checkStatus === 0))
);
};
const approvePaymentClick = (record: procurementOrderListType[0]) => {
setCurrentOrderItem({ ...record });
setApprovalOrderShow(true);
};
// 发货 // 发货
const shipmentsOrderCancel = () => { const shipmentsOrderCancel = () => {
setShipmentsOrderShow(false); setShipmentsOrderShow(false);
...@@ -332,6 +357,11 @@ const ProcurementOrderList = () => { ...@@ -332,6 +357,11 @@ const ProcurementOrderList = () => {
getListPurchaseOrder(query); getListPurchaseOrder(query);
}; };
useEffect(() => {
getOrderStatusList();
getListPurchaseOrder();
}, []);
return ( return (
<div className='procurement-order-list'> <div className='procurement-order-list'>
<SearchBox <SearchBox
......
...@@ -3,7 +3,7 @@ import { Button, Steps } from 'antd'; ...@@ -3,7 +3,7 @@ import { Button, Steps } from 'antd';
import { mallOrderDetailType } from '~/api/interface/orderManageType'; import { mallOrderDetailType } from '~/api/interface/orderManageType';
import { InterDataType } from '~/api/interface'; import { InterDataType } from '~/api/interface';
import { OrderManageAPI } from '~/api'; import { OrderManageAPI } from '~/api';
import LogisticsStepModal from '../logisticsStepModal'; import LogisticsStepModal from '~/components/order/productOrder/logisticsStepModal';
// 接口返回的类型 // 接口返回的类型
type DataType = InterDataType<mallOrderDetailType>; type DataType = InterDataType<mallOrderDetailType>;
......
...@@ -33,7 +33,7 @@ function ProductOrderView() { ...@@ -33,7 +33,7 @@ function ProductOrderView() {
// 订单操作按钮列表 // 订单操作按钮列表
const operateBtnList = [ const operateBtnList = [
{ {
btnStr: '确认订单', getBtnStr: () => '确认订单',
status: 200, status: 200,
btnClick: (record: TableType[0]) => { btnClick: (record: TableType[0]) => {
setCurrentOrderItem({ ...record }); setCurrentOrderItem({ ...record });
...@@ -41,7 +41,7 @@ function ProductOrderView() { ...@@ -41,7 +41,7 @@ function ProductOrderView() {
}, },
}, },
{ {
btnStr: '发货', getBtnStr: (record: TableType[0]) => (record.orderType ? '' : '发货'),
status: 500, status: 500,
btnClick: (record: TableType[0]) => { btnClick: (record: TableType[0]) => {
getMallOrderDetail(record.id); getMallOrderDetail(record.id);
...@@ -349,7 +349,7 @@ function ProductOrderView() { ...@@ -349,7 +349,7 @@ function ProductOrderView() {
title: '订单交期', title: '订单交期',
dataIndex: 'deliveryTime', dataIndex: 'deliveryTime',
align: 'center', align: 'center',
render: (text: string) => <TableItem tr={<div className='goods-text'>{text}</div>} />, render: (text: string) => <TableItem tr={<div>{text}</div>} />,
}, },
{ {
title: '备注', title: '备注',
...@@ -390,12 +390,12 @@ function ProductOrderView() { ...@@ -390,12 +390,12 @@ function ProductOrderView() {
<TableItem <TableItem
tr={ tr={
<> <>
{getCurrentOperateBtn ? ( {getCurrentOperateBtn(record.statusCode)?.getBtnStr(record) ? (
<Button <Button
type={'link'} type={'link'}
onClick={() => getCurrentOperateBtn(record.statusCode)?.btnClick(record)} onClick={() => getCurrentOperateBtn(record.statusCode)?.btnClick(record)}
> >
{getCurrentOperateBtn(record.statusCode)?.btnStr} {getCurrentOperateBtn(record.statusCode)?.getBtnStr(record)}
</Button> </Button>
) : ( ) : (
'' ''
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论