- 用户/组织/资源页批量删除改批量接口 + 失败汇总提示 - 角色页新增「分配部门」(dataScope=custom 时显示,部门树勾选) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
58 lines
1.6 KiB
Vue
58 lines
1.6 KiB
Vue
<template>
|
|
<el-tree
|
|
v-if="ready"
|
|
ref="treeRef"
|
|
class="assign-tree"
|
|
:data="tree"
|
|
node-key="code"
|
|
show-checkbox
|
|
:props="{ label: 'name', children: 'children' }"
|
|
default-expand-all
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed, nextTick, ref, watch } from 'vue'
|
|
import { useRequest } from '@/composables/useRequest'
|
|
import { listOrgs } from '@/api/org'
|
|
import { listAssignedOrgs } from '@/api/role'
|
|
import { buildTree, type TreeNode } from '@/utils/tree'
|
|
import type { Org } from '@/api/org'
|
|
|
|
defineOptions({ name: 'AssignOrgsForm' })
|
|
|
|
const props = defineProps<{ roleCode: string }>()
|
|
|
|
interface TreeApi {
|
|
getCheckedKeys: (leafOnly?: boolean) => (string | number)[]
|
|
setCheckedKeys: (keys: (string | number)[], leafOnly?: boolean) => void
|
|
}
|
|
const treeRef = ref<TreeApi>()
|
|
|
|
const { data: orgList } = useRequest((signal: AbortSignal) => listOrgs(signal))
|
|
const { data: assigned } = useRequest((signal: AbortSignal) => listAssignedOrgs(props.roleCode, signal))
|
|
|
|
const tree = computed(() => buildTree(orgList.value ?? []) as TreeNode<Org>[])
|
|
const ready = computed(() => orgList.value !== undefined && assigned.value !== undefined)
|
|
|
|
watch(ready, async (r) => {
|
|
if (r) {
|
|
await nextTick()
|
|
treeRef.value?.setCheckedKeys(assigned.value ?? [], true)
|
|
}
|
|
})
|
|
|
|
function submit(): { orgCodes: string[] } {
|
|
const checked = treeRef.value?.getCheckedKeys(true) ?? []
|
|
return { orgCodes: [...new Set(checked.map(String))] }
|
|
}
|
|
|
|
defineExpose({ submit })
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.assign-tree {
|
|
@apply max-h-[420px] overflow-y-auto;
|
|
}
|
|
</style>
|