|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<a-drawer
|
|
|
- v-model:visible="props.visible"
|
|
|
+ v-model:visible="visible"
|
|
|
title="选择可见成员"
|
|
|
placement="right"
|
|
|
width="50%"
|
|
|
@@ -84,18 +84,19 @@
|
|
|
import { Modal, Input, Tree, List, Avatar, Button } from 'ant-design-vue'
|
|
|
const emit = defineEmits(['close', 'confirm'])
|
|
|
const visible = ref(false)
|
|
|
- const props = defineProps({
|
|
|
- visible: {
|
|
|
- type: Boolean,
|
|
|
- default: false
|
|
|
- },
|
|
|
- userRelateIds: {
|
|
|
- type: Array,
|
|
|
- default: () => {}
|
|
|
- }
|
|
|
- })
|
|
|
+ // const props = defineProps({
|
|
|
+ // visible: {
|
|
|
+ // type: Boolean,
|
|
|
+ // default: false
|
|
|
+ // },
|
|
|
+ // userRelateIds: {
|
|
|
+ // type: Array,
|
|
|
+ // default: () => {}
|
|
|
+ // }
|
|
|
+ // })
|
|
|
|
|
|
const searchValue = ref('')
|
|
|
+ const userRelateIds = ref([])
|
|
|
const treeData = ref([
|
|
|
{
|
|
|
id: '1',
|
|
|
@@ -134,19 +135,31 @@
|
|
|
]
|
|
|
}
|
|
|
])
|
|
|
- watch(
|
|
|
- () => props.userRelateIds,
|
|
|
- (newVal) => {
|
|
|
- if (newVal) {
|
|
|
- console.log(newVal, 'props.userRelateIds')
|
|
|
- checkedKeys.value = newVal
|
|
|
- // selectedUsers.value = flatTree(treeData.value)
|
|
|
- // .filter((node) => newVal.includes(node.id))
|
|
|
- // .map((node) => ({ id: node.id, name: node.name }))
|
|
|
- }
|
|
|
- },
|
|
|
- { deep: true }
|
|
|
- )
|
|
|
+ const flatTree = (nodes) => {
|
|
|
+ let result = []
|
|
|
+
|
|
|
+ const traverse = (nodeList) => {
|
|
|
+ nodeList.forEach(node => {
|
|
|
+ result.push(node)
|
|
|
+ if (node.children && node.children.length > 0) {
|
|
|
+ traverse(node.children)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ traverse(nodes)
|
|
|
+ return result
|
|
|
+ }
|
|
|
+ // watch(
|
|
|
+ // () => props.userRelateIds,
|
|
|
+ // (newVal) => {
|
|
|
+ // if (newVal) {
|
|
|
+ // console.log(newVal, 'props.userRelateIds')
|
|
|
+ //
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // { deep: true }
|
|
|
+ // )
|
|
|
const selectedKeys = ref([])
|
|
|
const selectedUsers = ref([])
|
|
|
const checkedKeys = ref([])
|
|
|
@@ -192,6 +205,21 @@
|
|
|
}
|
|
|
return ''
|
|
|
}
|
|
|
+ const open = (listData) =>{
|
|
|
+ visible.value = true
|
|
|
+ selectedUsers.value = []
|
|
|
+ if(listData == null){
|
|
|
+ selectedUsers.value = []
|
|
|
+ }else{
|
|
|
+ checkedKeys.value = listData.split(',')
|
|
|
+ selectedUsers.value = flatTree(treeData.value)
|
|
|
+ .filter((node) =>listData.includes(node.id))
|
|
|
+ .map((node) => ({ id: node.id, name: node.name }))
|
|
|
+
|
|
|
+ console.log('选择了吗',selectedUsers.value)
|
|
|
+ console.log('选择了吗 左面',checkedKeys.value)
|
|
|
+ }
|
|
|
+ }
|
|
|
const onExpand = (keys) => {
|
|
|
// console.log(keys, 'onExpand')
|
|
|
expandedKeys.value = keys
|
|
|
@@ -249,12 +277,14 @@
|
|
|
}
|
|
|
|
|
|
const handleOk = () => {
|
|
|
- console.log('Selected Users:', selectedUsers.value, checkedKeys.value)
|
|
|
+ console.log('Selected Users:', checkedKeys.value)
|
|
|
emit('confirm', checkedKeys.value)
|
|
|
+ visible.value = false
|
|
|
}
|
|
|
|
|
|
const handleCancel = () => {
|
|
|
emit('close')
|
|
|
+ visible.value = false
|
|
|
}
|
|
|
onMounted(() => {
|
|
|
getOrgUserTreeRespectively()
|
|
|
@@ -262,6 +292,8 @@
|
|
|
// checkedKeys.value = props.userRelateIds // 直接赋值给树组件的checkedKeys
|
|
|
// }
|
|
|
})
|
|
|
+
|
|
|
+ defineExpose({open})
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|