feat(outbound): 计划出库清单数量前置,移除类型列
问题 ---- 计划出库清单的「计划数量」列排在表格最右侧(名称/规格/库位之后)。 表格共 6 列且名称规格会撑宽,最右列容易被容器裁掉,工人反馈"看不见数量"。 改动 ---- · 「计划数量」从最右移到「序号」之后,橙色加粗 + 字号放大到 15px; · 移除「类型」列(material_type); · 库位列宽 150 → 170。 注:该列一直存在且数据正常(items_json 的 quantity 字段), 此前是可见性问题而非数据缺失。
This commit is contained in:
@ -56,17 +56,19 @@
|
|||||||
</div>
|
</div>
|
||||||
<el-table :data="selectedRequest.items || []" border size="small" style="width: 100%;">
|
<el-table :data="selectedRequest.items || []" border size="small" style="width: 100%;">
|
||||||
<el-table-column type="index" label="序号" width="60" align="center" />
|
<el-table-column type="index" label="序号" width="60" align="center" />
|
||||||
<el-table-column label="类型" width="80" align="center">
|
<!-- ★ 计划数量前置:原先排在表格最右侧,列多时容易被容器裁掉看不见 -->
|
||||||
|
<el-table-column label="计划数量" width="100" align="center">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<el-tag size="small" type="info">{{ row.material_type || '-' }}</el-tag>
|
<span style="color: #E6A23C; font-weight: bold; font-size: 15px;">
|
||||||
|
{{ row.quantity ?? '-' }}
|
||||||
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="name" label="名称" min-width="120" show-overflow-tooltip />
|
<el-table-column prop="name" label="名称" min-width="120" show-overflow-tooltip />
|
||||||
<el-table-column prop="spec_model" label="规格" min-width="100" show-overflow-tooltip />
|
<el-table-column prop="spec_model" label="规格" min-width="100" show-overflow-tooltip />
|
||||||
<!-- ★ 库位 + 备选库位:现场进不去时可改扫其它批次 -->
|
<!-- ★ 库位 + 备选库位:现场进不去时可改扫其它批次 -->
|
||||||
<el-table-column label="库位" width="150" show-overflow-tooltip>
|
<el-table-column label="库位" width="170">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<span>{{ row.warehouse_location || '-' }}</span>
|
|
||||||
<el-popover
|
<el-popover
|
||||||
v-if="row.base_id"
|
v-if="row.base_id"
|
||||||
placement="right"
|
placement="right"
|
||||||
@ -74,10 +76,12 @@
|
|||||||
trigger="click"
|
trigger="click"
|
||||||
@show="loadAlternatives(row)"
|
@show="loadAlternatives(row)"
|
||||||
>
|
>
|
||||||
|
<!-- ★ 整个库位格子都是点击热区,工人不必精准点图标 -->
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<el-icon class="alt-icon" title="查看备选库位">
|
<span class="loc-cell" title="点击查看该物料的所有可选库位">
|
||||||
<LocationInformation />
|
<span class="loc-text">{{ row.warehouse_location || '-' }}</span>
|
||||||
</el-icon>
|
<el-icon class="alt-icon"><LocationInformation /></el-icon>
|
||||||
|
</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<div v-loading="altLoading" class="alt-panel">
|
<div v-loading="altLoading" class="alt-panel">
|
||||||
@ -100,11 +104,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
</template>
|
<span v-else>{{ row.warehouse_location || '-' }}</span>
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="计划数量" width="90" align="center">
|
|
||||||
<template #default="{ row }">
|
|
||||||
<span style="color: #E6A23C; font-weight: bold;">{{ row.quantity ?? '-' }}</span>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
@ -973,13 +973,27 @@ onUnmounted(() => {
|
|||||||
.planned-title { font-weight: bold; font-size: 14px; color: #67C23A; }
|
.planned-title { font-weight: bold; font-size: 14px; color: #67C23A; }
|
||||||
|
|
||||||
/* ★ 备选库位:库位旁的图标与浮层 */
|
/* ★ 备选库位:库位旁的图标与浮层 */
|
||||||
.alt-icon {
|
/* ★ 库位格子整体可点击:工人不必精准点小图标,点单元格任意位置即可 */
|
||||||
margin-left: 4px;
|
.loc-cell {
|
||||||
color: #409EFF;
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 2px 6px;
|
||||||
|
border-radius: 4px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
vertical-align: middle;
|
transition: background-color 0.2s;
|
||||||
}
|
}
|
||||||
.alt-icon:hover { color: #66b1ff; }
|
.loc-cell:hover { background-color: #ecf5ff; }
|
||||||
|
.loc-cell .loc-text { color: #409EFF; }
|
||||||
|
|
||||||
|
/* 图标放大到 18px,并加圆形底衬,在触屏上更易命中 */
|
||||||
|
.alt-icon {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #409EFF;
|
||||||
|
vertical-align: middle;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.loc-cell:hover .alt-icon { color: #66b1ff; }
|
||||||
|
|
||||||
.alt-panel { font-size: 13px; }
|
.alt-panel { font-size: 13px; }
|
||||||
.alt-title {
|
.alt-title {
|
||||||
|
|||||||
Reference in New Issue
Block a user