vue-vben-admin/src/components/SelectPos/index.vue

82 lines
2.2 KiB
Vue

<!--
* @Author: 刘妍
* @Date: 2024-03-07 10:00:26
* @LastEditors: Do not edit
* @LastEditTime: 2024-03-07 15:37:30
* @Description:
-->
<template>
<div>
<BasicTree ref="asyncExpandTreeRef" title="部门和职级列表" toolbar treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
loadData :clickRowToExpand="false" :treeData="treeData"
:fieldNames="{ key: 'id', title: 'name' ,disabled:'disabled'}" :defaultExpandAll="true" :checkable="true"
:checkStrictly="true" @check="handleSelect" />
</div>
</template>
<script lang="ts" setup>
import { reactive, ref, onMounted, nextTick, unref } from 'vue';
import { BasicTree, TreeItem } from '@/components/Tree';
import { getOrgPositonTree, userOrgs } from '@/api/demo/system';
defineOptions({ name: 'RoleManagement' });
const treeData = ref < TreeItem[] > ([]);
const asyncExpandTreeRef = ref < Nullable < TreeActionType >> (null);
const posData = ref([])
function treeIterator(tree) {
tree.forEach((node) => {
if (node.key == 0) {
node.name = "部门--" + node.name
node.disableCheckbox = true
} else {
node.name = "职级--" + node.name
// 需要拼接parentName
posData.value.push(node)
}
node.children && treeIterator(node.children)
})
}
async function fetch() {
const data = (await getOrgPositonTree()) as unknown as TreeItem[];
treeIterator(data)
treeData.value = await data
// 展开全部
nextTick(() => {
unref(asyncExpandTreeRef)?.expandAll(true);
});
}
onMounted(() => {
fetch();
});
let orgList = ref([])
let posList = ref([])
function handleSelect(checkedKeys, e: { checked: bool, checkedNodes, node, event }) {
const list = e.checkedNodes
console.log(e.node)
console.log(checkedKeys)
orgList.value = []
posList.value = []
list.forEach(element => {
if (element.key > 0) {
posList.value.push({
orgId: Number(element.tag),
posId: element.id,
})
} else {
orgList.value.push({
orgId: element.id,
posId: 0,
})
}
});
}
function getRow() {
let rows = getSelectRows();
return rows
}
defineExpose({
getRow
})
</script>