<template>
    <div class="point-tree">
        <div style="flex: 1; overflow: hidden">
            <vxe-table
                ref="tableRef"
                :data="tree"
                height="auto"
                v-bind="defaultAttribute"
                :tree-config="{ children: 'children', expandAll: true }"
            >
                <vxe-column field="name" align="left" title="部门" tree-node></vxe-column>
                <vxe-column width="200" title="操作">
                    <template #default="{ row }">
                        <el-button type="primary" size="small" link @click="tactics(row.id, 0)">自动</el-button>
                        <el-button type="primary" size="small" link @click="tactics(row.id, 1)">手动</el-button>
                        <el-button type="primary" size="small" link @click="tactics(row.id, 2)">排除</el-button>
                    </template>
                </vxe-column>
            </vxe-table>
        </div>
    </div>
</template>

<script lang="ts" setup>
import { nextTick, onMounted, ref, useAttrs } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { ElTree } from 'element-plus'
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 loadData = () => {
    let nodeKey = ''

    initDetpStataionTree({ orgId: dictData.state.area[0].id }).then(res => {
        tree.value = res.data
    })
}
const tactics = (deptId, grade) => {
    emit('tactics', deptId, grade)
}
loadData()
</script>
<style lang="scss">
.point-tree {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--el-border-color);
}
.custom {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-right: 20px;
    // font-size: 14px;
    // padding-right: 8px;
}
</style>
