for_client/src/views/tentative/device/components/TestTree.vue

<template>
    <ElTree ref="treeRef" :class="ui" :data="treeData" :default-expanded-keys="['1570335808521502732']" :indent="0"
            :props="treeProps" accordion
            auto-expand-parent class="hc-tree-node tree-line el-radio-group" current-node-key="1570335808521502732" highlight-current
            node-key="primaryKeyId" @node-click="treeClick">
        <template #default="{ node, data }">
            <div :id="`${idPrefix}${data['primaryKeyId']}`" class="data-custom-tree-node">
                <div class="label">{{ node.label }}</div>
            </div>
        </template>
    </ElTree>
</template>

<script setup>
import {ref, nextTick, watch} from "vue";
import {getArrValue} from "js-fast-way"
import {getProjectTree} from "~api/tentative";

//参数
const props = defineProps({
    projectId: {
        type: [String, Number],
        default: ''
    },
    contractId: {
        type: [String, Number],
        default: ''
    },
    wbsId: {
        type: [String, Number],
        default: ''
    },
    wbsType: {
        type: [String, Number],
        default: ''
    },
    idPrefix: {
        type: String,
        default: 'test-tree1-'
    },
    ui: {
        type: String,
        default: ''
    },
})

//变量
const treeRef = ref(null)
const treeProps = ref({
    label: 'title',
    children: 'children',
    isLeaf: 'hasChildren'
})
const treeData = ref([])
const projectId = ref(props.projectId);
const contractId = ref(props.contractId);
const wbsId = ref(props.wbsId);
//const tenantId = ref(props.tenantId);

//监听
watch(() => [
    props.projectId,
    props.contractId,
    props.wbsId,
], ([pid, cid, wbs_id]) => {
    projectId.value = pid
    contractId.value = cid
    wbsId.value = wbs_id
})

//加载中
nextTick(() => {
    getTreeData()
})

//获取数据
const isLoading = ref(false)
const getTreeData = async () => {
    isLoading.value = true
    const {data} = await getProjectTree({
        projectId: projectId.value,
        // contractId: contractId.value,
        wbsId: wbsId.value,
    })
    //处理数据
    isLoading.value = false
    treeData.value = getArrValue(data)
    //最后一个，执行点击
    /*if (clickKey) {
        await nextTick(() => {
            document.getElementById(`${idPrefix.value}${clickKey}`)?.click()
        })
    }*/
}

//事件
const emit = defineEmits(['nodeTap'])

//节点被点击
const treeClick = async (data) => {
    emit('nodeTap', data)
}
</script>

<style lang="scss" scoped>
@import "../../../../styles/app/tree.scss";
</style>