要在 addCustomer
事件中处理 mode="tags"
的情况,并确保无论是从选项中选择的产品名称和借据号,还是手动输入的内容都能正确传递,您可以在构造请求参数时进行相应的处理。以下是如何实现这一目标的步骤:
提取用户输入:当使用
tags
模式时,用户可能会手动输入产品名称和借据号。因此,需要收集这些手动输入的值。整合数据:即使手动输入了数据,也需要确保这些数据与
workOrderLoans
中的数据一致,以便能够生成一个有效的请求。
下面是您代码中 addCustomer
方法的一种修改方案:
const addCustomer = (values) => {
// 获取手动输入的产品名称(tags)和借据号(tags)
const selectedProducts = formModal.value.productName;
const selectedLoanCodes = formModal.value.loanInfoCode;
// 根据workOrderLoans中的信息构建selectedData
const selectedData = [];
// 遍历所有已选择的产品名称
selectedProducts.forEach((productName) => {
// 找到与该产品名称对应的借据号
const loanCodes = workOrderLoans.value
.filter(loan => loan.productName === productName)
.map(loan => loan.loanInfoCode);
// 如果模式为tags且用户手动输入了借据号,将其添加到loanCodes中
if (isCustomerNotFound.value && selectedLoanCodes.includes(productName)) {
loanCodes.push(productName); // 假设这里需要加上用户直接输入的信息,你也可以根据需要调整逻辑
}
// 创建包含productName和对应loanInfoCode对象并推入数组
selectedData.push({
productName,
loanInfoCode: [...new Set([...loanCodes, ...selectedLoanCodes])], // 合并去重后的借据号列表
});
});
const params = {
workOrderLoans: selectedData,
};
addWorkOrder(params)
.then((response) => {
if (response.success) {
message.success(response.message);
} else {
message.error(response.message);
}
});
};
在上述代码中做了以下处理:
获取所有选择:将所有选择(包括从下拉框或标签模式下用户输入)的产品名称和借据号都保留在变量中。
过滤贷款信息:通过遍历选定的产品,在
workOrderLoans
中查找匹配的贷款代码。如果有新输入的内容(例如标签模式),则将它们合并到最终传递的数据结构中,并去重。生成最终参数:构建包含
productName
和对应的loanInfoCode
的数组,最后发送请求时只需利用这个数组即可。
这样一来,无论是从列表选择还是手动添加,都能保证最终提交的数据完整且符合预期。
内容由零声教学AI助手提供,问题来源于学员提问