feat(order): 添加供应商模态框敏感信息脱敏功能
- 添加身份证号、手机号、银行卡号格式化脱敏显示 - 集成显示/隐藏脱敏信息的切换功能 - 引入CompanyList组件用于公司信息展示 - 更新订单供应商模态框列配置和数据渲染 - 调整付款任务创建和列表组件的发票状态显示 - 修改付款任务相关金额字段显示单位和状态枚举 - 修复供应商选择时参数传递问题 - 优化表格组件配置和列定义结构
This commit is contained in:
parent
f65598d42c
commit
ae182d4439
@ -1,8 +1,10 @@
|
|||||||
import { OrderList } from '@/components';
|
import { CompanyList, OrderList } from '@/components';
|
||||||
import { business } from '@/services';
|
import { business } from '@/services';
|
||||||
|
import { formatBankCard, formatIdCard, formatPhone } from '@/utils/format';
|
||||||
import { formatParam } from '@/utils/formatParam';
|
import { formatParam } from '@/utils/formatParam';
|
||||||
import { pagination } from '@/utils/pagination';
|
import { pagination } from '@/utils/pagination';
|
||||||
import { useIntl } from '@@/exports';
|
import { useIntl } from '@@/exports';
|
||||||
|
import { EyeInvisibleOutlined, EyeTwoTone } from '@ant-design/icons';
|
||||||
import {
|
import {
|
||||||
ActionType,
|
ActionType,
|
||||||
LightFilter,
|
LightFilter,
|
||||||
@ -46,6 +48,10 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
initParams || {},
|
initParams || {},
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const [showIdCard, setShowIdCard] = useState<Record<string, boolean>>({});
|
||||||
|
const [showBankCard, setShowBankCard] = useState<Record<string, boolean>>({});
|
||||||
|
const [showPhone, setShowPhone] = useState<Record<string, boolean>>({});
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (initParams) {
|
if (initParams) {
|
||||||
setParams({
|
setParams({
|
||||||
@ -85,32 +91,6 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
title: intl.formatMessage({ id: intlPrefix + '.column.name' }),
|
title: intl.formatMessage({ id: intlPrefix + '.column.name' }),
|
||||||
dataIndex: 'name',
|
dataIndex: 'name',
|
||||||
key: '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' }),
|
title: intl.formatMessage({ id: intlPrefix + '.column.invoiceAmount' }),
|
||||||
@ -126,6 +106,7 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
valueType: 'money',
|
valueType: 'money',
|
||||||
search: false,
|
search: false,
|
||||||
},
|
},
|
||||||
|
// 剩余付款金额
|
||||||
{
|
{
|
||||||
title: intl.formatMessage({
|
title: intl.formatMessage({
|
||||||
id: intlPrefix + '.column.remainingAmount',
|
id: intlPrefix + '.column.remainingAmount',
|
||||||
@ -139,10 +120,127 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: intl.formatMessage({ id: intlPrefix + '.column.orderCompany' }),
|
title: intl.formatMessage({
|
||||||
dataIndex: ['orderCompany', 'shortName'],
|
id: intlPrefix + '.column.idCard',
|
||||||
key: 'orderCompany',
|
}),
|
||||||
|
dataIndex: 'idCard',
|
||||||
|
key: 'idCard',
|
||||||
search: false,
|
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' }),
|
title: intl.formatMessage({ id: intlPrefix + '.column.isPaid' }),
|
||||||
@ -151,28 +249,19 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
valueType: 'select',
|
valueType: 'select',
|
||||||
valueEnum: {
|
valueEnum: {
|
||||||
true: {
|
true: {
|
||||||
text: intl.formatMessage({ id: intlPrefix + '.column.isPaid.paid' }),
|
text: intl.formatMessage({
|
||||||
status: 'Success',
|
id: intlPrefix + '.column.isPaid.paid',
|
||||||
|
}),
|
||||||
|
status: 'success',
|
||||||
},
|
},
|
||||||
false: {
|
false: {
|
||||||
text: intl.formatMessage({
|
text: intl.formatMessage({
|
||||||
id: intlPrefix + '.column.isPaid.unpaid',
|
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 || []),
|
...(initExtraColumns || []),
|
||||||
];
|
];
|
||||||
|
|
||||||
@ -225,6 +314,7 @@ export default function OrderSupplierModal(props: IOrderSupplierModalProps) {
|
|||||||
},
|
},
|
||||||
params: {
|
params: {
|
||||||
...params,
|
...params,
|
||||||
|
poStates: ['COMPLETED'],
|
||||||
},
|
},
|
||||||
request: async (params, sorter, filter) => {
|
request: async (params, sorter, filter) => {
|
||||||
const { data, success, totalCount } =
|
const { data, success, totalCount } =
|
||||||
|
|||||||
@ -3,6 +3,7 @@ import {
|
|||||||
ButtonAccess,
|
ButtonAccess,
|
||||||
InsertPosition,
|
InsertPosition,
|
||||||
OrderSupplierInvoiceList,
|
OrderSupplierInvoiceList,
|
||||||
|
SupplierFarmerList,
|
||||||
} from '@/components';
|
} from '@/components';
|
||||||
import OrderSupplierModal from '@/components/Order/OrderSupplierModal';
|
import OrderSupplierModal from '@/components/Order/OrderSupplierModal';
|
||||||
import { business } from '@/services';
|
import { business } from '@/services';
|
||||||
@ -260,13 +261,75 @@ export default function PaymentTaskCreate(props: IPaymentTaskCreateProps) {
|
|||||||
rowKey="orderSupplierId"
|
rowKey="orderSupplierId"
|
||||||
dataSource={selectedOrderSupplierList}
|
dataSource={selectedOrderSupplierList}
|
||||||
columns={[
|
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: '操作',
|
title: '操作',
|
||||||
key: 'action',
|
key: 'action',
|
||||||
render: (
|
render: (record: BusinessAPI.OrderSupplierVO) => (
|
||||||
_: any,
|
|
||||||
record: BusinessAPI.OrderSupplierVO,
|
|
||||||
) => (
|
|
||||||
<Button
|
<Button
|
||||||
type="link"
|
type="link"
|
||||||
danger
|
danger
|
||||||
@ -450,6 +513,7 @@ export default function PaymentTaskCreate(props: IPaymentTaskCreateProps) {
|
|||||||
params={{
|
params={{
|
||||||
type: 'FARMER',
|
type: 'FARMER',
|
||||||
isPaid: false,
|
isPaid: false,
|
||||||
|
supplierId: selectedSupplier?.supplierId,
|
||||||
}}
|
}}
|
||||||
tips="请选择该瓜农未付款的车次"
|
tips="请选择该瓜农未付款的车次"
|
||||||
num={999}
|
num={999}
|
||||||
|
|||||||
@ -298,8 +298,13 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '发票编码',
|
title: '发票编码',
|
||||||
dataIndex: ['supplierInvoiceVO', 'invoiceNo'],
|
dataIndex: 'supplierInvoiceVO',
|
||||||
key: 'invoiceNo',
|
key: 'invoiceSn',
|
||||||
|
render: (
|
||||||
|
supplierInvoiceVO: BusinessAPI.SupplierInvoiceVO,
|
||||||
|
) => {
|
||||||
|
return <a>{supplierInvoiceVO.invoiceSn}</a>;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
pagination={false}
|
pagination={false}
|
||||||
@ -382,6 +387,7 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
|
|||||||
}}
|
}}
|
||||||
page={{
|
page={{
|
||||||
fieldProps: {
|
fieldProps: {
|
||||||
|
actionRef: actionRef,
|
||||||
bordered: true,
|
bordered: true,
|
||||||
...(!ghost && {
|
...(!ghost && {
|
||||||
tableExtraRender: () => (
|
tableExtraRender: () => (
|
||||||
@ -484,7 +490,6 @@ export default function PaymentTaskList(props: IPaymentTaskListProps) {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
columns,
|
columns,
|
||||||
actionRef: actionRef,
|
|
||||||
}}
|
}}
|
||||||
create={false}
|
create={false}
|
||||||
update={{
|
update={{
|
||||||
|
|||||||
@ -2160,9 +2160,9 @@ export default {
|
|||||||
phone: '手机号',
|
phone: '手机号',
|
||||||
bankName: '银行名称',
|
bankName: '银行名称',
|
||||||
bankCard: '银行卡号',
|
bankCard: '银行卡号',
|
||||||
invoiceAmount: '应付货款金额(元)',
|
invoiceAmount: '应付金额(元)',
|
||||||
depositAmount: '已付定金(元)',
|
depositAmount: '已付定金(元)',
|
||||||
remainingAmount: '剩余货款金额(元)',
|
remainingAmount: '剩余金额(元)',
|
||||||
order: '采购单',
|
order: '采购单',
|
||||||
orderCompany: '销售公司',
|
orderCompany: '销售公司',
|
||||||
isPaid: '是否付款',
|
isPaid: '是否付款',
|
||||||
@ -2212,8 +2212,8 @@ export default {
|
|||||||
phone: '手机号',
|
phone: '手机号',
|
||||||
bankName: '银行名称',
|
bankName: '银行名称',
|
||||||
bankCard: '银行卡号',
|
bankCard: '银行卡号',
|
||||||
invoiceAmount: '应付货款金额(元)',
|
invoiceAmount: '应付金额(元)',
|
||||||
remainingAmount: '剩余货款金额(元)',
|
remainingAmount: '剩余金额(元)',
|
||||||
order: '采购单',
|
order: '采购单',
|
||||||
orderCompany: '销售公司',
|
orderCompany: '销售公司',
|
||||||
isPaid: '是否付款',
|
isPaid: '是否付款',
|
||||||
@ -2552,9 +2552,9 @@ export default {
|
|||||||
taskName: '任务名称',
|
taskName: '任务名称',
|
||||||
paymentCode: '付款编码',
|
paymentCode: '付款编码',
|
||||||
supplier: '瓜农信息',
|
supplier: '瓜农信息',
|
||||||
totalAmount: '付款总金额',
|
totalAmount: '付款总金额(元)',
|
||||||
paidAmount: '已付金额',
|
paidAmount: '已付金额(元)',
|
||||||
unpaidAmount: '未付金额',
|
unpaidAmount: '未付金额(元)',
|
||||||
orderCount: '订单数量',
|
orderCount: '订单数量',
|
||||||
state: '付款状态',
|
state: '付款状态',
|
||||||
createdAt: '创建时间',
|
createdAt: '创建时间',
|
||||||
@ -2576,7 +2576,7 @@ export default {
|
|||||||
invoiceType: {
|
invoiceType: {
|
||||||
selfInvoice: '自开票',
|
selfInvoice: '自开票',
|
||||||
proxyInvoice: '代开票',
|
proxyInvoice: '代开票',
|
||||||
noInvoice: '无发票',
|
noInvoice: '未开票',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
tab: {
|
tab: {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user