小程序开发日记⑤:异常反馈与处理结果

1037 字
5 分钟
小程序开发日记⑤:异常反馈与处理结果

配送发生问题时,用户需要的不只是一个文本框,而是一条能够被管理端识别、处置和回告的异常链路。异常反馈模块连接了订单、图片凭证、异常工单与处理结果。

1. 反馈类型与后端异常类型#

页面提供未收到、破损、少件错件、位置错误、取消申请和其他问题。前端枚举通过 EXCEPTION_TYPE_MAP 转为后端工单类型:

const exceptionType = EXCEPTION_TYPE_MAP[feedbackType.value]
if (!exceptionType) {
uni.showToast({ title: '异常类型映射失败', icon: 'none' })
return false
}

把映射放在常量文件中,可以让表单、列表和消息详情共享同一种解释。

2. 动态校验规则#

并不是所有反馈都强制上传图片。包裹破损和位置错误需要至少一张证据图,其余类型允许只填写描述:

const evidenceReady = !['DAMAGED', 'WRONG_LOCATION'].includes(type)
|| images.value.length > 0

描述还要经过长度和空白字符校验。动态规则既减少普通问题的提交阻力,也保证需要现场判断的问题有足够证据。

3. 先上传证据,再创建工单#

异常证据仍复用订单凭证接口,凭证类型为 EXCEPTION_FEEDBACK:

for (const [index, filePath] of images.value.entries()) {
await DeliveryApi.uploadProof(filePath, {
orderId,
proofType: DELIVERY_PROOF_TYPES.EXCEPTION_FEEDBACK,
sortNo: index + 1
})
}
await AbnormalApi.submitFeedback({
orderId,
exceptionType,
exceptionFeedback: exceptionType,
description
})

Store 使用 ${orderId}:${filePath} 作为本次会话的上传键,防止提交重试时同一张图片被重复上传。移除图片时同步清除对应缓存键。

4. 只能关联真实订单#

反馈页加载用户订单供选择,并要求 orderId 是有效数字。页面展示订单号、创建时间和服务类型,提交时才使用主键关联。显示层与提交层的标识不能混淆。

const normalizedOrderId = /^\d+$/.test(String(orderId || ''))
? String(orderId)
: ''

5. 异常历史分页#

feedback-list.vue 每页读取 10 条,触底追加历史记录,并以 exceptionId 去重:

function mergeUniqueFeedback(current, incoming) {
const map = new Map()
current.concat(incoming).forEach(item => {
map.set(String(item.exceptionId), item)
})
return [...map.values()]
}

列表显示异常类型、处理状态、描述、优先级、异常编号、提交时间以及管理端填写的处理结果。

6. 关联订单号补全#

异常接口可能只返回 orderId。列表先使用响应中的 orderNo,缺失时并行查询订单详情,并缓存 orderId -> orderNo:

const results = await Promise.allSettled(
uniqueOrderIds.map(id => OrderApi.getOrderDetail(id, { showError: false }))
)

某一订单读取失败不会阻塞整页,最后才退化显示 --。这次处理让我更明确:数据库主键解决关联,业务订单号解决沟通。

7. 提交状态与表单复位#

提交期间禁用按钮和上传区,成功后调用 reset() 清理类型、描述、图片与上传缓存,再返回异常列表。失败时保留用户填写内容,避免网络波动让用户重新打字。

8. 本篇小结#

异常与订单状态相互独立#

异常工单处于“处理中”,不代表订单一定是“配送中”;订单完成后仍可能提交破损反馈。列表分别展示订单号和异常处理状态,避免用订单状态替代工单进度。管理端关闭工单后,用户端通过刷新读取 processResult,形成回告闭环。

证据上传失败的处理#

证据上传成功但工单提交失败时,重新提交会利用本地上传键跳过已成功图片,减少重复文件。更完善的服务端可以提供临时上传会话或在创建工单时一次性绑定 proof IDs,从根本上保证一致性。

反馈列表加载订单号时维护缓存,后续页出现相同订单不再查询。退出账号时清空缓存,避免不同用户之间复用关联信息。

异常反馈不是“意见箱”,而是配送流程的补充入口。证据要能追到订单,处理结果要能回到用户。把这条链路打通以后,异常终于不再只是客服聊天记录里的一句“我再帮您看看”。

支持与分享

如果这篇文章对你有帮助,欢迎分享给更多人或打赏支持!

打赏
小程序开发日记⑤:异常反馈与处理结果
https://firefly.cuteleaf.cn/posts/mmp-dev-diary-5/
作者
Yore
发布于
2026-08-12
许可协议
CC BY-NC-SA 4.0

评论区

Profile Image of the Author
Yore
Hello, I'm Yore.
公告
欢迎来到Yore的博客!本站基于原创作者夏叶的博客网站模版创作。
分类
标签
最新动态
站点统计
文章
51
分类
2
标签
124
总字数
94,115
运行时长
0 天
最后活动
0 天前
站点信息
构建平台
EdgeOne Pages
博客版本
Firefly v6.15.0
文章许可
CC BY-NC-SA 4.0