fj-dc-ui/.svn/pristine/29/2987abd25e5fa1c709ea9346f1a4020d2bf95cfd.svn-base

<template>
    <div class="tree" :style="{'height':height + 'px','width':width == 0 ? 250 : width + 'px'}">
        <el-tree 
                class="el-treeWhite"
                :data="treeData"
                :props="treeProps"
                :expand-on-click-node="false"
                @node-click="nodeClick"
                node-key="objId"
                :default-expanded-keys="tableDefaultExpandedKeys"
        ></el-tree>
    </div>
</template>

<script>
    import {getNodeByPidAndCode} from "../../api/duChaAPI.js";
    import request from '../../utils/gw_ajax_request.js';
    import {dateFormat} from "../../utils/gw_date";
    import globalVariable from "@api/globalVariable.js";

    export default {
        components: {},
        props: ['height','width'],
        data() {
            return {
                treeData: [],
                tableDefaultExpandedKeys: [],
                treeProps: {
                    label: "nm",
                    children: "children",
                    disabled: false,
                    expandOnClickNode: false,
                    first: true,
                },
            };
        },
        mounted: function () {
            this.getLeftTreeData();
        },
        computed: {
            userId: function () {
                return localStorage.getItem("userid")
                    ? localStorage.getItem("userid")
                    : "1098101939614724096";
            }
        },
        methods: {
            // 节点点击事件
            nodeClick: function (data) {
                this.$emit("provTreeSelectChange", {'objId':data.objId});
            },
            //根据用户id获取左侧树
            getLeftTreeData(){
                let paramObj = {
                    presId: this.userId,
                    pType: '4'
                }
                request.post('/dc/gd/base/getGcNode',paramObj).then((res)=>{
                    this.treeData = res.data
                })


            }


        }
    };
</script>

<style scoped>
.tree{
    overflow-y: auto;
    overflow-x: auto;
}
.el-tree {
     min-width: 100%;
     display:inline-block !important;
 }

/*滚动条样式*/
.tree::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
/*正常情况下滑块的样式*/
.tree::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .05);
    border-radius: 10px;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
}
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
.tree:hover::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .2);
    border-radius: 10px;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
}
/*鼠标悬浮在滑块上时滑块的样式*/
.tree::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, .4);
    -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
}
/*正常时候的主干部分*/
.tree::-webkit-scrollbar-track {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
    background-color: white;
}
/*鼠标悬浮在滚动条上的主干部分*/
.tree::-webkit-scrollbar-track:hover {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
    background-color: rgba(0, 0, 0, .01);
}
</style>