feat(order): 添加供应商模态框敏感信息脱敏功能

- 添加身份证号、手机号、银行卡号格式化脱敏显示 - 集成显示/隐藏脱敏信息的切换功能 - 引入CompanyList组件用于公司信息展示 - 更新订单供应商模态框列配置和数据渲染 - 调整付款任务创建和列表组件的发票状态显示 - 修改付款任务相关金额字段显示单位和状态枚举 - 修复供应商选择时参数传递问题 - 优化表格组件配置和列定义结构
2026-01-06 14:26:39 +08:00 · 2026-01-06 14:26:39 +08:00 · ae182d4439
commit ae182d4439
parent f65598d42c
4 changed files with 218 additions and 59 deletions
--- a/packages/app-operation/src/components/Order/OrderSupplierModal.tsx
+++ b/packages/app-operation/src/components/Order/OrderSupplierModal.tsx
@ -1,8 +1,10 @@
-import { OrderList } from '@/components';
+import { CompanyList, OrderList } from '@/components';
 import { business } from '@/services';
+import { formatBankCard, formatIdCard, formatPhone } from '@/utils/format';
 import { formatParam } from '@/utils/formatParam';
 import { pagination } from '@/utils/pagination';
 import { useIntl } from '@@/exports';
+import { EyeInvisibleOutlined, EyeTwoTone } from '@ant-design/icons';
 import {
 	ActionType,
 	LightFilter,
@ -46,6 +48,10 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 		initParams || {},
 	);

+	const [showIdCard, setShowIdCard] = useState<Record<string, boolean>>({});
+	const [showBankCard, setShowBankCard] = useState<Record<string, boolean>>({});
+	const [showPhone, setShowPhone] = useState<Record<string, boolean>>({});
+
 	useEffect(() => {
 		if (initParams) {
 			setParams({
@ -85,32 +91,6 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 			title: intl.formatMessage({ id: intlPrefix + '.column.name' }),
 			dataIndex: 'name',
 			key: 'name',
-			renderText: (text: string) => <span className="font-medium">{text}</span>,
-		},
-		{
-			title: intl.formatMessage({ id: intlPrefix + '.column.idCard' }),
-			dataIndex: 'idCard',
-			key: 'idCard',
-			search: false,
-			ellipsis: true,
-		},
-		{
-			title: intl.formatMessage({ id: intlPrefix + '.column.phone' }),
-			dataIndex: 'phone',
-			key: 'phone',
-			search: false,
-		},
-		{
-			title: intl.formatMessage({ id: intlPrefix + '.column.bankName' }),
-			dataIndex: 'bankName',
-			key: 'bankName',
-			search: false,
-		},
-		{
-			title: intl.formatMessage({ id: intlPrefix + '.column.bankCard' }),
-			dataIndex: 'bankCard',
-			key: 'bankCard',
-			search: false,
 		},
 		{
 			title: intl.formatMessage({ id: intlPrefix + '.column.invoiceAmount' }),
@ -126,6 +106,7 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 			valueType: 'money',
 			search: false,
 		},
+		// 剩余付款金额
 		{
 			title: intl.formatMessage({
 				id: intlPrefix + '.column.remainingAmount',
@ -139,10 +120,127 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 			},
 		},
 		{
-			title: intl.formatMessage({ id: intlPrefix + '.column.orderCompany' }),
-			dataIndex: ['orderCompany', 'shortName'],
-			key: 'orderCompany',
+			title: intl.formatMessage({
+				id: intlPrefix + '.column.idCard',
+			}),
+			dataIndex: 'idCard',
+			key: 'idCard',
 			search: false,
+			render: (_, record) => (
+				<div className="flex items-center">
+					<span>
+						{formatIdCard(record.idCard, showIdCard[record.orderSupplierId])}
+					</span>
+					<span
+						className="ml-2 cursor-pointer"
+						onClick={(e) => {
+							e.stopPropagation();
+							setShowIdCard((prev) => ({
+								...prev,
+								[record.orderSupplierId]: !prev[record.orderSupplierId],
+							}));
+						}}
+					>
+						{showIdCard[record.orderSupplierId] ? (
+							<EyeTwoTone />
+						) : (
+							<EyeInvisibleOutlined />
+						)}
+					</span>
+				</div>
+			),
+		},
+		{
+			title: intl.formatMessage({ id: intlPrefix + '.column.phone' }),
+			dataIndex: 'phone',
+			key: 'phone',
+			search: false,
+			render: (_, record) => (
+				<div className="flex items-center">
+					<span>
+						{formatPhone(record.phone, showPhone[record.orderSupplierId])}
+					</span>
+					<span
+						className="ml-2 cursor-pointer"
+						onClick={(e) => {
+							e.stopPropagation();
+							setShowPhone((prev) => ({
+								...prev,
+								[record.orderSupplierId]: !prev[record.orderSupplierId],
+							}));
+						}}
+					>
+						{showPhone[record.orderSupplierId] ? (
+							<EyeTwoTone />
+						) : (
+							<EyeInvisibleOutlined />
+						)}
+					</span>
+				</div>
+			),
+		},
+		{
+			title: intl.formatMessage({ id: intlPrefix + '.column.bankCard' }),
+			dataIndex: 'bankCard',
+			key: 'bankCard',
+			search: false,
+			render: (_, record) => (
+				<div className="flex items-center">
+					<span>
+						{formatBankCard(
+							record?.bankCard || '',
+							showBankCard[record.orderSupplierId],
+						)}
+					</span>
+					<span
+						className="ml-2 cursor-pointer"
+						onClick={(e) => {
+							e.stopPropagation();
+							setShowBankCard((prev) => ({
+								...prev,
+								[record.orderSupplierId]: !prev[record.orderSupplierId],
+							}));
+						}}
+					>
+						{showBankCard[record.orderSupplierId] ? (
+							<EyeTwoTone />
+						) : (
+							<EyeInvisibleOutlined />
+						)}
+					</span>
+				</div>
+			),
+		},
+		{
+			title: intl.formatMessage({ id: intlPrefix + '.column.orderCompany' }),
+			dataIndex: 'orderCompany',
+			valueType: 'select',
+			request: async (params) => {
+				const { data } = await business.company.listCompany({
+					companyListQry: {
+						...params,
+					},
+				});
+
+				return (
+					data?.map((item) => {
+						return {
+							label: item.fullName,
+							value: item.companyId,
+						};
+					}) || []
+				);
+			},
+			render: (_, record) => {
+				return (
+					<CompanyList
+						ghost={true}
+						mode={'detail'}
+						companyId={record.orderCompany.companyId}
+						trigger={() => <a href={'#'}>{record.orderCompany.fullName}</a>}
+					/>
+				);
+			},
 		},
 		{
 			title: intl.formatMessage({ id: intlPrefix + '.column.isPaid' }),
@ -151,28 +249,19 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 			valueType: 'select',
 			valueEnum: {
 				true: {
-					text: intl.formatMessage({ id: intlPrefix + '.column.isPaid.paid' }),
-					status: 'Success',
+					text: intl.formatMessage({
+						id: intlPrefix + '.column.isPaid.paid',
+					}),
+					status: 'success',
 				},
 				false: {
 					text: intl.formatMessage({
 						id: intlPrefix + '.column.isPaid.unpaid',
 					}),
-					status: 'Default',
+					status: 'processing',
 				},
 			},
 		},
-		// {
-		// 	title: intl.formatMessage({ id: intlPrefix + '.column.type' }),
-		// 	dataIndex: 'type',
-		// 	key: 'type',
-		// 	valueType: 'select',
-		// 	valueEnum: {
-		// 		FARMER: { text: intl.formatMessage({ id: intlPrefix + '.column.type.farmer' }), status: 'Default' },
-		// 		STALL: { text: intl.formatMessage({ id: intlPrefix + '.column.type.stall' }), status: 'Processing' },
-		// 		OTHER_STALL: { text: intl.formatMessage({ id: intlPrefix + '.column.type.otherStall' }), status: 'Warning' },
-		// 	},
-		// },
 		...(initExtraColumns || []),
 	];

@ -225,6 +314,7 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
 				},
 				params: {
 					...params,
+					poStates: ['COMPLETED'],
 				},
 				request: async (params, sorter, filter) => {
 					const { data, success, totalCount } =
--- a/packages/app-operation/src/components/PaymentTask/PaymentTaskCreate.tsx
+++ b/packages/app-operation/src/components/PaymentTask/PaymentTaskCreate.tsx
@ -3,6 +3,7 @@ import {
 	ButtonAccess,
 	InsertPosition,
 	OrderSupplierInvoiceList,
+	SupplierFarmerList,
 } from '@/components';
 import OrderSupplierModal from '@/components/Order/OrderSupplierModal';
 import { business } from '@/services';
@ -260,13 +261,75 @@ export default function PaymentTaskCreate(props: IPaymentTaskCreateProps) {
 												rowKey="orderSupplierId"
 												dataSource={selectedOrderSupplierList}
 												columns={[
+													{
+														title: '开票瓜农',
+														dataIndex: 'supplierInvoiceVO',
+														key: 'supplierName',
+														render: (
+															supplierInvoiceVO: BusinessAPI.SupplierInvoiceVO,
+														) => {
+															return (
+																supplierInvoiceVO && (
+																	<SupplierFarmerList
+																		ghost={true}
+																		mode={'detail'}
+																		supplierId={supplierInvoiceVO.supplierId}
+																		trigger={() => (
+																			<a>{supplierInvoiceVO.supplierName}</a>
+																		)}
+																	/>
+																)
+															);
+														},
+													},
+													{
+														title: '发票编码',
+														dataIndex: 'supplierInvoiceVO',
+														key: 'invoiceSn',
+														render: (
+															supplierInvoiceVO: BusinessAPI.SupplierInvoiceVO,
+														) => {
+															return <a>{supplierInvoiceVO.invoiceSn}</a>;
+														},
+													},
+													// 开票状态（自开票，代开票，未开票）
+													{
+														title: '开票状态',
+														key: 'invoiceStatus',
+														render: (record: BusinessAPI.OrderSupplierVO) => {
+															let invoiceStatus = 'NOT_INVOICE';
+															if (record.invoiceUpload && record.invoiceId) {
+																if (
+																	record.supplierId ===
+																	record.supplierInvoiceVO?.supplierId
+																) {
+																	invoiceStatus = 'SELF';
+																}
+																if (
+																	record.supplierId !==
+																	record.supplierInvoiceVO?.supplierId
+																) {
+																	invoiceStatus = 'AGENT';
+																}
+															} else {
+																invoiceStatus = 'NOT_INVOICE';
+															}
+
+															switch (invoiceStatus) {
+																case 'SELF':
+																	return '自开票';
+																case 'AGENT':
+																	return '代开票';
+																case 'NOT_INVOICE':
+																	return '未开票';
+																default:
+															}
+														},
+													},
 													{
 														title: '操作',
 														key: 'action',
-														render: (
-															_: any,
-															record: BusinessAPI.OrderSupplierVO,
-														) => (
+														render: (record: BusinessAPI.OrderSupplierVO) => (
 															<Button
 																type="link"
 																danger
@ -450,6 +513,7 @@ export default function PaymentTaskCreate(props: IPaymentTaskCreateProps) {
 				params={{
 					type: 'FARMER',
 					isPaid: false,
+					supplierId: selectedSupplier?.supplierId,
 				}}
 				tips="请选择该瓜农未付款的车次"
 				num={999}
--- a/packages/app-operation/src/components/PaymentTask/PaymentTaskList.tsx
+++ b/packages/app-operation/src/components/PaymentTask/PaymentTaskList.tsx
@ -298,8 +298,13 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
 										},
 										{
 											title: '发票编码',
-											dataIndex: ['supplierInvoiceVO', 'invoiceNo'],
-											key: 'invoiceNo',
+											dataIndex: 'supplierInvoiceVO',
+											key: 'invoiceSn',
+											render: (
+												supplierInvoiceVO: BusinessAPI.SupplierInvoiceVO,
+											) => {
+												return <a>{supplierInvoiceVO.invoiceSn}</a>;
+											},
 										},
 									]}
 									pagination={false}
@ -382,6 +387,7 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
 			}}
 			page={{
 				fieldProps: {
+					actionRef: actionRef,
 					bordered: true,
 					...(!ghost && {
 						tableExtraRender: () => (
@ -484,7 +490,6 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
 					},
 				},
 				columns,
-				actionRef: actionRef,
 			}}
 			create={false}
 			update={{
--- a/packages/app-operation/src/locales/zh-CN.ts
+++ b/packages/app-operation/src/locales/zh-CN.ts
@ -2160,9 +2160,9 @@ export default {
 			phone: '手机号',
 			bankName: '银行名称',
 			bankCard: '银行卡号',
-			invoiceAmount: '应付货款金额(元)',
+			invoiceAmount: '应付金额(元)',
 			depositAmount: '已付定金(元)',
-			remainingAmount: '剩余货款金额(元)',
+			remainingAmount: '剩余金额(元)',
 			order: '采购单',
 			orderCompany: '销售公司',
 			isPaid: '是否付款',
@ -2212,8 +2212,8 @@ export default {
 			phone: '手机号',
 			bankName: '银行名称',
 			bankCard: '银行卡号',
-			invoiceAmount: '应付货款金额(元)',
-			remainingAmount: '剩余货款金额(元)',
+			invoiceAmount: '应付金额(元)',
+			remainingAmount: '剩余金额(元)',
 			order: '采购单',
 			orderCompany: '销售公司',
 			isPaid: '是否付款',
@ -2552,9 +2552,9 @@ export default {
 			taskName: '任务名称',
 			paymentCode: '付款编码',
 			supplier: '瓜农信息',
-			totalAmount: '付款总金额',
-			paidAmount: '已付金额',
-			unpaidAmount: '未付金额',
+			totalAmount: '付款总金额(元)',
+			paidAmount: '已付金额(元)',
+			unpaidAmount: '未付金额(元)',
 			orderCount: '订单数量',
 			state: '付款状态',
 			createdAt: '创建时间',
@ -2576,7 +2576,7 @@ export default {
 			invoiceType: {
 				selfInvoice: '自开票',
 				proxyInvoice: '代开票',
-				noInvoice: '无发票',
+				noInvoice: '未开票',
 			},
 		},
 		tab: {