style(borrow): 流转时间线区分成败 —— 被拒转交红点 + 红标签 + 原因独立成行

问题(截图反馈)
----
被拒收的转交和正常转交一样是黄色节点、黄色「转交」标签,拒绝原因又粗暴地
拼在备注后面(「备注: 3333 [拒绝原因] 5555」)—— 完全看不出资产交接失败。

改动
----
一、节点颜色:被拒收的转交 el-timeline-item 的 type 设为 danger(红色圆点);
    待接收(PENDING)保持 warning(进行中,不是失败);
    其余沿用动作类型配色。
二、动作标签:被拒的显示红色「转交被拒」,不再显示黄色「转交」。
三、原因分行:转交备注灰色单独一行,拒收原因另起一行、红色加粗前缀,
    彻底解决文字挤在一起的问题。

顺带修正标签措辞
----
「经手库管」改为「发起人」:转交已收紧为「仅当前持有人本人可发起」,
该字段存的就是发起人本人,标成库管是错的。
(归还节点的「经手库管」保持不变 —— 那里确实是独立的窗口经手人。)

★ 一个可议之处:转交节点现在会同时显示「A → B」和「· 发起人:A」,
  同一个人出现两次(字段格式不同:一个展示名、一个完整 username)。
  若觉得冗余,可去掉后者 —— 但那属于展示取舍,未擅自决定。
This commit is contained in:
yueli
2026-09-17 10:46:32 +08:00
parent 681607bd43
commit b5f96384e9

View File

@ -463,11 +463,14 @@
:key="i"
:timestamp="e.time"
placement="top"
:type="eventMeta(e.type).type"
:type="eventNodeType(e)"
:hollow="e.type === 'borrow'"
>
<div style="display:flex; align-items:center; gap:8px; margin-bottom:4px;">
<el-tag :type="eventMeta(e.type).type" size="small">{{ eventMeta(e.type).label }}</el-tag>
<!-- 被拒收的转交换红色文案原先和正常转交一样是黄色转交
一眼看不出资产交接失败 -->
<el-tag v-if="isRejectedTransfer(e)" type="danger" size="small">转交被拒</el-tag>
<el-tag v-else :type="eventMeta(e.type).type" size="small">{{ eventMeta(e.type).label }}</el-tag>
<span style="font-size: 13px; color:#606266;">{{ e.material_name || e.sku }}</span>
<span style="font-size: 13px; color:#909399;">× {{ e.quantity }}</span>
</div>
@ -478,15 +481,14 @@
</template>
<template v-else-if="e.type === 'transfer'">
<b>{{ e.from_name || '—' }}</b> <b>{{ e.actor_name || '—' }}</b>
<!-- 状态标签被拒绝的转交若不标出来与成功的长得一模一样
发起方翻记录时会误以为已经交接出去 -->
<!-- 待接收PENDING仍用黄色提示已接收不再重复打标 -->
<el-tag
v-if="e.status && e.status !== 'ACCEPTED'"
:type="e.status === 'REJECTED' ? 'danger' : 'warning'"
size="small"
style="margin-left:6px"
>{{ e.status_text || e.status }}</el-tag>
<span v-if="e.operator_name" style="color:#909399;"> · 经手库管{{ e.operator_name }}</span>
v-if="e.status === 'PENDING'"
type="warning" size="small" style="margin-left:6px"
>{{ e.status_text || '待接收' }}</el-tag>
<!-- operator_name 存的就是发起人本人转交已收紧为仅当前持有人
本人可发起原先误标为经手库管 -->
<span v-if="e.operator_name" style="color:#909399;"> · 发起人{{ e.operator_name }}</span>
</template>
<template v-else-if="e.type === 'return'">
归还人<b>{{ e.actor_name || '—' }}</b>
@ -496,8 +498,16 @@
报废 · 经手库管<b>{{ e.operator_name || '—' }}</b>
</template>
</div>
<!-- 备注与拒收原因分行展示原先后端把原因拼进备注
"3333\n[拒绝原因] 5555"两句挤在一起无法分辨 -->
<div v-if="e.remark" style="font-size: 12px; color:#909399; margin-top:2px;">
备注{{ e.remark }}
转交备注{{ e.remark }}
</div>
<div
v-if="e.reject_reason"
style="font-size: 12px; color: #F56C6C; margin-top: 2px;"
>
<strong>拒收原因</strong>{{ e.reject_reason }}
</div>
</el-timeline-item>
</el-timeline>
@ -1073,6 +1083,18 @@ const EVENT_META: Record<string, { label: string; type: any }> = {
}
const eventMeta = (t: string) => EVENT_META[t] || { label: t, type: 'info' }
// 被拒收的转交 —— 时间线上要按「异常」呈现,不能和正常转交一个模样
const isRejectedTransfer = (e: any): boolean =>
e.type === 'transfer' && e.status === 'REJECTED'
// 时间线圆点颜色被拒收的转交用红色danger其余沿用动作类型配色。
// 待接收PENDING保持黄色 warning —— 它是「进行中」不是「失败」。
const eventNodeType = (e: any): any => {
if (isRejectedTransfer(e)) return 'danger'
if (e.type === 'transfer' && e.status === 'PENDING') return 'warning'
return eventMeta(e.type).type
}
const openHistoryDrawer = async (row: any) => {
historyBorrowNo.value = row.borrow_no
historyEvents.value = []