提交 aae38595 作者: 龚洪江

功能:采购流程联调

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