fix: 优化可接单部门标签显示

1. 移除无法识别的部门ID显示
2. 如果所有部门都可接单则不显示标签
3. 调整标签UI风格为绿色主题
This commit is contained in:
Your Name 2026-01-16 16:53:53 +08:00
parent 9e257caf15
commit b845cf52a5

View File

@ -305,14 +305,13 @@
<div v-if="getTaskAllowedDeptNames(task).length > 0" class="allowed-depts-section">
<span class="allowed-depts-label">可接单部门:</span>
<span class="allowed-depts-tags">
<a-tag
<span
v-for="(deptName, idx) in getTaskAllowedDeptNames(task)"
:key="idx"
color="blue"
size="small"
class="dept-tag"
>
{{ deptName }}
</a-tag>
</span>
</span>
</div>
@ -2917,19 +2916,23 @@ const getTaskAllowedDeptNames = (task: any): string[] => {
}
}
// 如果为空,表示所有接单部门都可以接单
// 如果为空,表示所有接单部门都可以接单,不显示标签
if (!allowedDeptIds || allowedDeptIds.trim() === '') {
return ['全部接单部门']
return []
}
// 将部门ID转换为部门名称
// 将部门ID转换为部门名称,只返回能找到名称的部门
const deptIds = allowedDeptIds.split(',').map((id: string) => parseInt(id.trim()))
const deptNames = deptIds.map((id: number) => {
const dept = receivingDeptList.value.find(d => d.id === id)
return dept ? dept.deptName : `部门${id}`
})
const deptNames: string[] = []
return deptNames.filter((name: string) => name)
for (const id of deptIds) {
const dept = receivingDeptList.value.find(d => d.id === id)
if (dept && dept.deptName) {
deptNames.push(dept.deptName)
}
}
return deptNames
}
// 构建级联选择器选项
@ -6607,9 +6610,6 @@ onUnmounted(() => {
flex-wrap: wrap;
gap: $space-xs;
margin-bottom: $space-md;
padding: $space-xs $space-sm;
background: rgba(#1890ff, 0.08);
border-radius: 6px;
.allowed-depts-label {
font-size: $font-size-xs;
@ -6620,13 +6620,18 @@ onUnmounted(() => {
.allowed-depts-tags {
display: flex;
flex-wrap: wrap;
gap: 4px;
gap: 6px;
:deep(.ant-tag) {
margin: 0;
.dept-tag {
display: inline-flex;
align-items: center;
padding: 2px 10px;
font-size: $font-size-xs;
line-height: 18px;
padding: 0 6px;
color: $brand-primary;
background: rgba($brand-primary, 0.1);
border: 1px solid rgba($brand-primary, 0.3);
border-radius: 4px;
white-space: nowrap;
}
}
}