style(borrow): 流转时间线区分成败 —— 被拒转交红点 + 红标签 + 原因独立成行
问题(截图反馈)
----
被拒收的转交和正常转交一样是黄色节点、黄色「转交」标签,拒绝原因又粗暴地
拼在备注后面(「备注: 3333 [拒绝原因] 5555」)—— 完全看不出资产交接失败。
改动
----
一、节点颜色:被拒收的转交 el-timeline-item 的 type 设为 danger(红色圆点);
待接收(PENDING)保持 warning(进行中,不是失败);
其余沿用动作类型配色。
二、动作标签:被拒的显示红色「转交被拒」,不再显示黄色「转交」。
三、原因分行:转交备注灰色单独一行,拒收原因另起一行、红色加粗前缀,
彻底解决文字挤在一起的问题。
顺带修正标签措辞
----
「经手库管」改为「发起人」:转交已收紧为「仅当前持有人本人可发起」,
该字段存的就是发起人本人,标成库管是错的。
(归还节点的「经手库管」保持不变 —— 那里确实是独立的窗口经手人。)
★ 一个可议之处:转交节点现在会同时显示「A → B」和「· 发起人:A」,
同一个人出现两次(字段格式不同:一个展示名、一个完整 username)。
若觉得冗余,可去掉后者 —— 但那属于展示取舍,未擅自决定。
This commit is contained in:
@ -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 = []
|
||||
|
||||
Reference in New Issue
Block a user