<template>
    <div class="all">
        <div class="left">
            <u-equipment-tree @select="selectEquipment"></u-equipment-tree>
            <!-- <device-list></device-list> -->
        </div>
        <div class="right">
            <!-- <tpm-tag-list></tpm-tag-list> -->
            <tag-list ref="realForm" :selectData="selectData"></tag-list>
        </div>
    </div>
</template>

<script>
import TagList from './TagList.vue';
import DeviceList from './DeviceList.vue';

    export default({
        components: {
            TagList,
            DeviceList
        },
        data () {
            return {
                selectData: {},
            }
        },
        methods: {
            selectEquipment(selectedKeys,e){
                // console.log(selectedKeys,e.selectedNodes[0].data.props)
                this.selectData.id = e.selectedNodes[0].data.props.id
                this.$nextTick(()=>{
                    this.$refs.realForm.getDataList();
                })
            }
        },
    })
</script>

<style scoped>
.all{
    height: calc(100vh - 90px);
    width: 100%;
    display: flex;
}
.left{
    height: 100%;
    width: 20%;
    /* border: 2px solid red; */
    margin-right: 10px;
    margin-left: 5px;
}
.right{
    height: 100%;
    width: 80%;
    /* border: 2px solid red; */
}
</style>
