feat: 工作流发起页面-需要自定义选择审批人的节点改为在右侧timeline组件中跳出弹窗选择

This commit is contained in:
GoldenZqqq
2024-11-07 13:21:04 +08:00
parent 92314ee945
commit 8b5740d05c
4 changed files with 69 additions and 162 deletions

View File

@ -15,7 +15,7 @@
</el-col>
<el-col :span="17" :offset="1">
<el-transfer
v-model="selectedUserList"
v-model="selectedUserIdList"
filterable
filter-placeholder="搜索成员"
:data="userList"
@ -24,7 +24,12 @@
</el-col>
</el-row>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm"> </el-button>
<el-button
:disabled="formLoading || !selectedUserIdList?.length"
type="primary"
@click="submitForm"
> </el-button
>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
@ -36,21 +41,24 @@ import * as UserApi from '@/api/system/user'
defineOptions({ name: 'UserSelectForm' })
const emit = defineEmits<{
confirm: [userList: any[]]
confirm: [id: any, userList: any[]]
}>()
const { t } = useI18n() // 国际
const deptList = ref<Tree[]>([]) // 部门树形结构化
const userList: any = ref([]) // 用户列表
const message = useMessage() // 消息弹窗
const selectedUserList: any = ref([]) // 选中的用户列表
const selectedUserIdList: any = ref([]) // 选中的用户列表
const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中
const activityId = ref() // 主键id
/** 打开弹窗 */
const open = async () => {
const open = async (id, selectedList?) => {
activityId.value = id
resetForm()
deptList.value = handleTree(await DeptApi.getSimpleDeptList())
await getUserList()
selectedUserIdList.value = selectedList?.map((item) => item.id)
// 修改时,设置数据
dialogVisible.value = true
}
@ -71,8 +79,9 @@ const submitForm = async () => {
try {
message.success(t('common.updateSuccess'))
dialogVisible.value = false
const emitUserList = userList.value.filter((user) => selectedUserIdList.value.includes(user.id))
// 发送操作成功的事件
emit('confirm', selectedUserList.value)
emit('confirm', activityId.value, emitUserList)
} finally {
formLoading.value = false
}
@ -80,13 +89,12 @@ const submitForm = async () => {
const resetForm = () => {
deptList.value = []
userList.value = []
selectedUserList.value = []
selectedUserIdList.value = []
}
/** 处理部门被点击 */
const handleNodeClick = async (row: { [key: string]: any }) => {
getUserList(row.id)
}
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
</script>