czh-20260612-增加新的部门选人组件,支持多选,默认跳转到当前用户所在的部门

This commit is contained in:
zhihao
2026-06-12 15:56:56 +08:00
parent b8d57da4e4
commit 7d11d759b9
5 changed files with 675 additions and 8 deletions
@@ -0,0 +1,55 @@
<template>
<div style="margin-left: 1px">
<a-empty v-if="selectedUsers.length === 0" />
<div v-else>
<a-button-group
v-for="(user, index) in selectedUsers"
:key="'user-' + user.id + '-' + index"
class="small-space"
>
<a-button class="btn-green" size="small">
<UserOutlined />
{{ user.realname }}
</a-button>
<a-button v-if="!disabled" class="btn-green" size="small" @click="deleteUser(index)">
<CloseOutlined />
</a-button>
</a-button-group>
</div>
</div>
</template>
<script lang="ts" setup>
import { UserOutlined, CloseOutlined } from '@ant-design/icons-vue';
import type { UserItem } from './types';
const props = withDefaults(
defineProps<{
disabled?: boolean;
selectedUsers: UserItem[];
}>(),
{
disabled: false,
selectedUsers: () => [],
}
);
const emit = defineEmits(['update:selectedUsers']);
function deleteUser(index: number) {
const arr = [...props.selectedUsers];
arr.splice(index, 1);
emit('update:selectedUsers', arr);
}
</script>
<style lang="less" scoped>
.small-space {
margin: 2px;
}
.btn-green {
background-color: #52c41a;
color: #fff;
border-color: #52c41a;
}
</style>