admin-sjzx/src/components/tree/pqs/generalTestTree.vue

<template>
    <div class="point-tree">
        <el-input
            v-model="input"
            style="width: 240px"
            placeholder="请输入电站数"
            class="mr10"
            @input="handleEdit"
        ></el-input>
        <el-button type="primary" :disabled="!input.length > 0" icon="el-icon-Operation" @click="Tick">
            按配置勾选
        </el-button>
        <el-tree
            style="height: 550px; overflow-y: auto; overflow-x: hidden"
            :data="tree"
            show-checkbox
            default-expand-all
            node-key="id"
            :default-expanded-keys="[2, 3]"
            :default-checked-keys="[5]"
            :props="defaultProps"
        />
    </div>
</template>

<script lang="ts" setup>
import { nextTick, onMounted, ref, useAttrs } from 'vue'
import { useDictData } from '@/stores/dictData'
import { initDetpStataionTree } from '@/api/process-boot/generalTest'

import { useConfig } from '@/stores/config'

const emit = defineEmits(['tactics'])
const attrs = useAttrs()
const defaultProps = {
    label: 'name',
    value: 'id'
}
const dictData = useDictData()
const config = useConfig()
const tree = ref()
const treeRef = ref()
const input: any = ref('')

const loadData = () => {
    let nodeKey = ''

    initDetpStataionTree({ orgId: dictData.state.area[0].id }).then(res => {
        tree.value = res.data
    })
}
const handleEdit = () => {}
// 配置
const Tick = () => {}
const tactics = (deptId, grade) => {
    emit('tactics', deptId, grade)
}
loadData()
</script>
<style lang="scss">
.point-tree {
    width: 100%;
    padding: 10px;
    background: #fff;
    border: 1px solid var(--el-border-color);
}
</style>