fj-dc-ui/.svn/pristine/ea/ea44b15e0821f6f7574a57a2749b25e7e7667288.svn-base

<!--  -->
<template>
    <div>
        <el-row>
            <el-container>
                <el-header style="height: 5vh;padding: 10px 10px;">
                    <el-form :inline="true" class="demo-form-inline">
                        <el-form-item label="统计分类">
                            <el-select v-model="search_type" placeholder="统计分类" @change="changeType" >
                                <el-option label="专业" value="1"></el-option>
                                <el-option label="责任主体" value="2"></el-option>
                                <el-option label="地区" value="3"></el-option>
                                <el-option label="问题发生频度" value="4"></el-option>
                                <el-option label="贫困地区" value="5"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="对比年度">
                            <el-select v-model="search_year" placeholder="对比年度" @change="addContrastYear" clearable >
                                <el-option v-for="item in yearList" :label="item.year" :value="item.year" :key="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="批次">
                            <el-select v-model="search_batch" placeholder="批次">
                                <el-option  v-for="item in pcList" :label="item.batch" :value="item.batch" :key="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="督查状态">
                            <el-select v-model="search_status" placeholder="督查状态">
                                <el-option label="专家" value="3" ></el-option>
                                <el-option label="提交意见稿" value="4" ></el-option>
                                <el-option label="成果讨论阶段" value="5" ></el-option>
                                <el-option label="中心修改阶段" value="6" ></el-option>
                                <el-option label="四局修改阶段" value="7" ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-button type="primary" size="mini" @click="searchData">查询</el-button>
                    </el-form>
                </el-header>
                <el-main style="padding:0;">
                    <el-row>
                        <el-col :span="12">
                            <div style="width:100%;" :style="{'height': colHeight/2 - 40 + 'px'}"  ref="pie_chart" ></div>
                        </el-col>
                        <el-col :span="12">
                            <div style="width:100%;" :style="{'height': colHeight/2 - 40 + 'px'}"  ref="total_bar_chart"></div>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <div style="width:100%;" :style="{'height': colHeight/2 - 40 + 'px'}"  ref="normal_bar_chart"></div>
                        </el-col>
                        <el-col :span="12">
                            <div style="width:100%;" :style="{'height': colHeight/2 - 40 + 'px'}"  ref="serious_bar_chart"></div>
                        </el-col>
                    </el-row>
                </el-main>
            </el-container>
        </el-row>
    </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import echarts from 'echarts'
import request from "../../../utils/gw_ajax_request"
import {
    getTree,
    } from "../../../api/InspectionReport.js";
export default {
    //import引入的组件需要注入到对象中才能使用
    
    components: {},
    data() {
    //这里存放数据
        return {
            //专业饼图数据
            countToNormal:0,
            countToHeavier:0,
            countToSerious:0,
            countTotalHeavierAndSerious:0,
            countTotalNormal:0,
            countToNormal_DB:0,
            countToHeavier_DB:0,
            countToSerious_DB:0,
            countTotalHeavierAndSerious_DB:0,
            countTotalNormal_DB:0,
            echartData_ProfessionOrPoverty:[],
            //责任主体饼图数据
            mainBodyNum:[],
            normalNum:[],
            heavierNum:[],
            seriousNum:[],
            xName:[],

            //地区数据
            areaData:[],
            avgNumOfArea:0,
            avgAreaLists:[],
            //发现问题的专业分布情况
            problemNumCount:[],
            problemNumCount_DB:[],
            problemNumName:[],
            proportionLists:[],
            proportionLists_DB:[],
            heavierAndSeriousLists:[],
            heavierAndSeriousLists_DB:[],

            problemNumCountHeavier:[],
            problemNumCountSerious:[],
            problemNumNameHeavierAndSerious:[],
            problemNumNameHeavierAndSeriousZb:[],

            problemNumCountHeavier_DB:[],
            problemNumCountSerious_DB:[],
            problemNumNameHeavierAndSerious_DB:[],
            problemNumNameHeavierAndSeriousZb_DB:[],

            problemNumCountNormal:[],
            problemNumNameNormal:[],
            problemNumNameNormalZb:[],
            problemNumCountNormal_DB:[],
            problemNumNameNormal_DB:[],
            problemNumNameNormalZb_DB:[],

            normalLists:[],
            normalLists_DB:[],
            yearList:[],
            pcList:[],
            needToChangeChart_pie:true,
            needToChangeChart_responsible_bar:false,
            search_type:"1",
            search_year:"",
            search_batch:"",
            search_status:"",
            filterText: '',
            region:"",
            leftWidth: 4,
            rightWidth: 20,
            isOpen: true,
            treeDataLists: [],
            defaultExpanded:[],//树默认展开节点数组
            defaultProps: {
                children: 'children',
                label: 'pnm'
            },
            colHeight:window.innerHeight - 90,
            proCountNum:[128,115,100,94,86,50],
            proporNum:[22,20,17,16,15,9],
            addYear:[],
            addYearTotal_BarLineChart:[],
            addYearNormal_BarLineChart:[]
        };
    },
    //监听属性 类似于data概念
    computed: {},
    //监控data中的数据变化
    watch: {
        filterText(val) {
            this.$refs.tree2.filter(val);
        },
        // search_type(n,o){
        //     if( n == '2'){
        //         this.needToChangeChart_pie = false;
        //         this.needToChangeChart_responsible_bar = true;
        //         this.init_Responsible_BarLineChart();
        //     }
        // }
    },
    //方法集合
    methods: {
         async getYearPc(){
          await request.post(`/tac/insp/year/list`,{}).then(res =>{
            if(res.success){
              this.$nextTick(() =>{
                this.yearList = res.data;
              })
            }
          })
          request.post(`/tac/insp/batch/list`,{}).then(res =>{
            if(res.success){
              this.pcList = res.data;
            }
          })
        },
        //饼图-专业
        getDataChartData(){
            var _self = this;
            request.post(`/tac/pblm/info/countPblmInfoByStb`,{}).then(res =>{//正确的接口地址
            // request.post(`/tac/pblm/info/countPblmInfoBySub`,{}).then(res =>{//测试接口地址
            
                if(res.success){
                    res.data.sort(function (a, b) {
                        var value1 = a['count'];
                        var value2 = b['count'];
                        return value2 - value1;
                    });
                    res.data.forEach(ele => {
                        _self.countToNormal += Number(ele.normal);
                        _self.countToHeavier += Number(ele.heavier);
                        _self.countToSerious += Number(ele.serious);
                        
                    });
                    _self.echartData_ProfessionOrPoverty = [
                        {
                            "value":_self.countToNormal,
                            "name": "一般问题"
                        },
                        {
                            "value":_self.countToHeavier,
                            "name": "严重问题"
                        },
                        {
                            "value":_self.countToSerious,
                            "name": "较重问题"
                        },
                    ]
                    this.initPieChart();
                }
            })
        },
        //柱状图-发现问题的专业分布情况
        getBarChartData(){
            var _self = this;
            let params = {
                "year" : _self.search_year
            }
            request.post(`/tac/pblm/info/countPblmInfoByStb`,{params}).then(res =>{//正确的接口地址
            // request.post(`/tac/pblm/info/countPblmInfoBySub`,{}).then(res =>{//测试接口地址
                let countTotal = 0;
                _self.countTotalHeavierAndSerious = 0;
                _self.countTotalNormal = 0;
                if(res.success){
                    res.data.sort(function (a, b) {
                        var value1 = a['count'];
                        var value2 = b['count'];
                        return value2 - value1;
                    });
                    res.data.forEach(ele => {
                        _self.problemNumCount.push(Number(ele.count));
                        _self.problemNumName.push(ele.name);
                        countTotal += Number(ele.count);
                        _self.heavierAndSeriousLists.push({
                            "countSum":Number(ele.heavier) + Number(ele.serious),
                            "heavier":Number(ele.heavier),
                            "serious":Number(ele.serious),
                            "name":ele.name,
                        })
                        _self.normalLists.push({
                            "normal":Number(ele.normal),
                            "name":ele.name,
                        })
                    });
                    _self.heavierAndSeriousLists.sort(
                        function (a, b) {
                            var value1 = a['countSum'];
                            var value2 = b['countSum'];
                            return value2 - value1;
                    });
                    _self.normalLists.sort(
                        function (a, b) {
                            var value1 = a['normal'];
                            var value2 = b['normal'];
                            return value2 - value1;
                    });
                    _self.heavierAndSeriousLists.forEach(ele =>{
                        _self.countTotalHeavierAndSerious += Number(ele.countSum);
                    })
                    _self.normalLists.forEach(ele =>{
                        _self.countTotalNormal += Number(ele.normal);
                    })
                    _self.heavierAndSeriousLists.forEach(ele =>{
                        _self.problemNumCountHeavier.push(Number(ele.heavier));
                        _self.problemNumCountSerious.push(Number(ele.serious));
                        _self.problemNumNameHeavierAndSerious.push(ele.name);
                        _self.problemNumNameHeavierAndSeriousZb.push(parseInt((ele.countSum / _self.countTotalHeavierAndSerious) * 100));
                    })
                    _self.normalLists.forEach(ele =>{
                        _self.problemNumCountNormal.push(Number(ele.normal));
                        _self.problemNumNameNormal.push(ele.name);
                        _self.problemNumNameNormalZb.push(parseInt((ele.normal / _self.countTotalNormal) * 100));
                    })
                    _self.problemNumCount.forEach(ele => {
                        _self.proportionLists.push((ele / countTotal) * 100);
                    });
                   
                    this.init_Total_BarLineChart();
                    this.init_Serious_BarLineChart();
                    this.init_Normal_BarLineChart();
                }
            })
        },
        getBarChartData_DB(){
            var _self = this;
            let params = {
                "year" : _self.search_year
            }
            request.post(`/tac/pblm/info/countPblmInfoByStb`,params).then(res =>{//正确的接口地址
            // request.post(`/tac/pblm/info/countPblmInfoBySub`,{}).then(res =>{//测试接口地址
                let countTotal = 0;
                _self.countTotalHeavierAndSerious_DB = 0;
                _self.countTotalNormal_DB = 0;
                if(res.success){
                    res.data.sort(function (a, b) {
                        var value1 = a['count'];
                        var value2 = b['count'];
                        return value2 - value1;
                    });
                    res.data.forEach(ele => {
                        _self.problemNumCount_DB.push(Number(ele.count));
                        // _self.problemNumName.push(ele.name);
                        countTotal += Number(ele.count);
                        _self.heavierAndSeriousLists_DB.push({
                            "countSum":Number(ele.heavier) + Number(ele.serious),
                            "heavier":Number(ele.heavier),
                            "serious":Number(ele.serious),
                            "name":ele.name,
                        })
                        _self.normalLists_DB.push({
                            "normal":Number(ele.normal),
                            "name":ele.name,
                        })
                    });
                    _self.heavierAndSeriousLists_DB.sort(
                        function (a, b) {
                            var value1 = a['countSum'];
                            var value2 = b['countSum'];
                            return value2 - value1;
                    });
                    _self.normalLists_DB.sort(
                        function (a, b) {
                            var value1 = a['normal'];
                            var value2 = b['normal'];
                            return value2 - value1;
                    });
                    _self.heavierAndSeriousLists_DB.forEach(ele =>{
                        _self.countTotalHeavierAndSerious += Number(ele.countSum);
                    })
                    _self.normalLists_DB.forEach(ele =>{
                        _self.countTotalNormal_DB += Number(ele.normal);
                    })
                    _self.heavierAndSeriousLists_DB.forEach(ele =>{
                        _self.problemNumCountHeavier_DB.push(Number(ele.heavier));
                        _self.problemNumCountSerious_DB.push(Number(ele.serious));
                        // _self.problemNumNameHeavierAndSerious_DB.push(ele.name);
                        _self.problemNumNameHeavierAndSeriousZb_DB.push(parseInt((ele.countSum / _self.countTotalHeavierAndSerious_DB) * 100));
                    })
                    _self.normalLists_DB.forEach(ele =>{
                        _self.problemNumCountNormal_DB.push(Number(ele.normal));
                        // _self.problemNumNameNormal_DB.push(ele.name);
                        _self.problemNumNameNormalZb_DB.push(parseInt((ele.normal / _self.countTotalNormal_DB) * 100));
                    })
                    _self.problemNumCount_DB.forEach(ele => {
                        _self.proportionLists_DB.push((ele / countTotal) * 100);
                    });
                   
                    this.init_Total_BarLineChart();
                    this.init_Serious_BarLineChart();
                    this.init_Normal_BarLineChart();
                }
            })
        },
        //饼图-责任主体
        getResponsibilityData(){
            var _self = this;
            request.post(`/tac/pblm/info/countPblmInfoBySub`,{}).then(res =>{
                if(res.success){
                    let count = 0;
                    res.data.forEach(ele =>{
                        //主体个数
                        _self.mainBodyNum.push(Number(ele.count));
                        _self.normalNum.push(Number(ele.normal));
                        _self.heavierNum.push(Number(ele.heavier));
                        _self.seriousNum.push(Number(ele.serious));
                        _self.xName.push(ele.name);
                      
                    })
                   
                    this.initPieChart();
                }
            })
        },
        
        //柱图-地区
        getAreaData(){
            var _self = this;
            request.post(`/tac/pblm/info/countPblmInfoByAdCode`,{}).then(res =>{
                if(res.success){
                    let countNum = 0;
                    res.data.sort(function (a, b) {
                        var value1 = a['count'];
                        var value2 = b['count'];
                        return value2 - value1;
                    });
                    res.data.forEach(ele =>{
                        _self.areaData.push(Number(ele.count));
                        _self.xName.push(ele.name);
                        countNum += Number(ele.count);
                    })
                    // _self.areaData.sort(function(a, b){
                    //     return b - a
                    // }); 
                    _self.avgNumOfArea = countNum /  res.data.length;
                    for(let i = 0; i < res.data.length; i++){
                        _self.avgAreaLists.push(parseInt(_self.avgNumOfArea));
                    }
                    this.initPieChart();
                }
            })
        },
        //饼图-贫困地区
        getPovertyData(){
            var _self = this;
            let params = {
                'isPoverty': "1",
            };
            request.post(`/tac/pblm/info/countPblmInfoByAdCode`,{params}).then(res =>{
                if(res.success){
                    if(res.success){
                        if(res.data.length != 0){
                            res.data.forEach(ele => {
                            _self.countToNormal += Number(ele.normal);
                            _self.countToHeavier += Number(ele.heavier);
                            _self.countToSerious += Number(ele.serious);
                            });
                            _self.echartData_ProfessionOrPoverty = [
                                {
                                    "value":_self.countToNormal,
                                    "name": "一般问题"
                                },
                                {
                                    "value":_self.countToHeavier,
                                    "name": "严重问题"
                                },
                                {
                                    "value":_self.countToSerious,
                                    "name": "较重问题"
                                },
                            ]
                        }else{
                            _self.echartData_ProfessionOrPoverty = [
                                {
                                    "value":0,
                                    "name": "一般问题"
                                },
                                {
                                    "value":0,
                                    "name": "严重问题"
                                },
                                {
                                    "value":0,
                                    "name": "较重问题"
                                },
                            ]
                        }
                        this.initPieChart();
                    }
                }
            })
        },
        getTreeData:function(){
			let _self = this;
            getTree('008','1').then((res)=>{
                _self.treeDataLists =_self.filterTreeData(res.data[0].children,9);
                _self.treeDataLists;
                // 默认隐藏到批次
                // _self.treeDataLists.forEach((element) => {
                //     _self.defaultExpanded.push(element.id);
                // });
            });
                _self.defaultExpanded.unshift("008");
        },
        compare(value1, value2) {
            if(value1 > value2){
                return -1;
            }else if(value1 < value2){
                return 1;
            }else{
                return 0;
            }
        },

        /**
        * 通过判断某个属性，截取全部树结构中符合该条件的节点
        * @param  {String} arr 旧树结构数据 
        * @param  {String} id the old mime-type
        * @return the new mime-type
        */
        filterTreeData(arr, id) {
            var _self = this;
            for (var i = 0; i < arr.length; i++) {
                var el = arr[i]
                if (el.id.length <=  id) {
                    if (el.children && el.children.length) {
                        _self.filterTreeData(el.children, id)
                    }
                } else {
                    arr.splice(i, arr.length)
                }
            }
            return arr
        },
        closeLeft(){
            this.isOpen = false
            this.leftWidth = 0
            this.rightWidth = 24
        },
        openLeft(){
            this.isOpen = true
            this.leftWidth = 5
            this.rightWidth = 19
        },
        filterNode(value, data) {
            if (!value) return true;
            return data.pnm.indexOf(value) !== -1;
        },
        
        //树节点点击事件
        treeNodeClickHandler:function(data,node,tree){
            if(node.childNodes.length == 0){
                this.currentNodeId = data.id;
                this.projectName = data.pnm;
                this.objId = data.objId;
                this.inspGroupId = data.pid;
                this.reallMenuLists = [];
                this.getMenu();
            }else{
                return;
            }
        },
        changeType(item){
            // alert(this.search_type)
            this.xName = [];
            this.mainBodyNum = [];
            this.normalNum = [];
            this.heavierNum = [];
            this.seriousNum = [];
            this.areaData = [];
            this.problemNumCount = [];
            this.problemNumName = [];
            this.proportionLists = [];
            this.problemNumCount=[],
            this.problemNumCount_DB=[];
            this.proportionLists_DB=[];
            this.heavierAndSeriousLists=[];
            this.heavierAndSeriousLists_DB=[];
            this.problemNumCountHeavier=[];
            this.problemNumCountSerious=[];
            this.problemNumNameHeavierAndSerious=[];
            this.problemNumNameHeavierAndSeriousZb=[];
            this.problemNumCountHeavier_DB=[];
            this.problemNumCountSerious_DB=[];
            this.problemNumNameHeavierAndSerious_DB=[];
            this.problemNumNameHeavierAndSeriousZb_DB=[];
            this.problemNumCountNormal=[];
            this.problemNumNameNormal=[];
            this.problemNumNameNormalZb=[];
            this.problemNumCountNormal_DB=[];
            this.problemNumNameNormal_DB=[];
            this.problemNumNameNormalZb_DB=[];
            this.countToNormal = 0;
            this.countToHeavier = 0;
            this.countToSerious = 0;
            this.countTotalHeavierAndSerious = 0;
            this.countTotalNormal = 0;
            if(item == 1){
                this.getDataChartData();
            }else if(item == 2){
                this.getResponsibilityData();
            }else if (item == 3){
                this.getAreaData();
            }else{
                this.getPovertyData();
            }
        },
        initPieChart:function(){
            var _self = this;
            let chart = echarts.init(this.$refs['pie_chart']);
            var scale = 1;
            var echartData = _self.echartData_ProfessionOrPoverty;
            // var echartData_poverty = [{
            //     value: 159,
            //     name: '一般问题'
            // }, {
            //     value: 16,
            //     name: '严重问题'
            // }, {
            //     value: 94,
            //     name: '较重问题'
            // }]
            var rich = {
                yellow: {
                    color: "#ffc72b",
                    fontSize: 30 * scale,
                    padding: [5, 4],
                    align: 'center'
                },
                black: {
                    // color: "#3a3a3a",
                    fontSize: 30 * scale,
                    padding: [5, 4],
                    align: 'center'
                },
                blackSmall: {
                    // color: "#3a3a3a",
                    fontSize: 16 * scale,
                    padding: [5, 4],
                    align: 'center'
                },
                total: {
                    // color: "#ffc72b",
                    fontSize: 40 * scale,
                    align: 'center'
                },
                white: {
                    // color: "#fff",
                    align: 'center',
                    fontSize: 14 * scale,
                    padding: [21, 0]
                },
                blue: {
                    color: '#49dff0',
                    fontSize: 16 * scale,
                    align: 'center'
                },
                hr: {
                    borderColor: '#3a3a3a',
                    width: '100%',
                    borderWidth: 1,
                    height: 0,
                }
            }
            let option = {
                title: {
                    text:'发现问题的严重程度分布情况',
                    top: '3%',
                    left: '10%',
                    // padding:[24,0],
                    textStyle:{
                        // color:'#fff',
                        fontSize:18*scale,
                        align:'center'
                    }
                },
                
                legend: {
                    // selectedMode:false,
                    formatter: function(name) {
                        var total = 0; //各科正确率总和
                        var averagePercent; //综合正确率
                        echartData.forEach(function(value, index, array) {
                            total += value.value;
                        });
                        return '{total|' + total + '}';
                    },
                    data: [echartData[0].name],
                    // data: ['高等教育学'],
                    // itemGap: 50,
                    left: 'center',
                    top: 'center',
                    icon: 'none',
                    align:'center',
                    textStyle: {
                        // color: "#fff",
                        fontSize: 16 * scale,
                        rich: rich
                    },
                },
                series: [{
                    name: '总考生数量',
                    type: 'pie',
                    radius: ['40%', '50%'],
                    // hoverAnimation: false,
                    color: ['#5ce9c7', '#fed172', '#fb6086'],
                    label: {
                        normal: {
                            formatter: function(params, ticket, callback) {
                                var total = 0; 
                                var percent = 0; 
                                echartData.forEach(function(value, index, array) {
                                    total += value.value;
                                });
                                if(total != 0){
                                    percent = ((params.value / total) * 100).toFixed(1);
                                    return '{blackSmall|' + params.name + '}{black|' + params.value + '}\n{blue|' + percent + '%}';
                                }else{
                                    return '{blackSmall|' + params.name + '}{black|' + params.value + '}\n{blue|' + "0" + '%}';
                                }
                               
                            },
                            rich: rich
                        },
                    },
                    data: echartData
                }]
            };
            let option_responsible = {
                title: {
                    text: '相关责任主体问题分布情况',
                    textStyle: {
                        align: 'center',
                        // color: '#fff',
                        fontSize: 20,
                    },
                    top: '3%',
                    left: '10%',
                },
                // backgroundColor: '#0f375f',
                grid: {
                    top: "25%",
                    bottom: "10%"
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                        label: {
                            show: true
                        }
                    }
                },
                legend: {
                    data: ["主体个数", "一般问题", "较重问题", "严重问题"],
                    top: "15%",
                    textStyle: {
                        // color: "#ffffff"
                    }
                },
                xAxis: {
                    data: _self.xName,
           

                    axisLine: {
                        show: true //隐藏X轴轴线
                    },
                    
                    axisTick: {
                        show: true //隐藏X轴刻度
                    },
                    axisLabel: {
                        rotate:20,
                        show: true,
                        textStyle: {
                            // color: "#ebf8ac" //X轴文字颜色
                        }
                    },
                    axisLine: {
                                lineStyle: {
                                    // color: '#01FCE3'
                                    }
                            },
                },
                yAxis: [{
                        type: "value",
                        name: "个",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: true
                        },
                        axisLabel: {
                            show: true,
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        },
                        axisLine: {
                                    lineStyle: {
                                        // color: '#FFFFFF'
                                        }
                                },
                    },
                    {
                        type: "value",
                        name: "主体个数",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        position: "right",
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisLabel: {
                            show: true,
                            // formatter: "{value} %", //右侧Y轴文字显示
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        }
                    },
                    {
                        type: "value",
                        gridIndex: 0,
                        min: 50,
                        max: 100,
                        splitNumber: 8,
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: true,
                            areaStyle: {
                                color: ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                            }
                        }
                    }
                ],
                series: [{
                        name: "主体个数",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        data: _self.mainBodyNum

                    },
                    {
                        name: "一般问题",
                        stack: "总量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#5ce9c7"
                            }
                        },
                        data: _self.normalNum
                    },
                    {
                        name: "较重问题",
                        stack: "总量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#fed172"
                            }
                        },
                        data: _self.heavierNum
                    },
                    {
                        name: "严重问题",
                        stack: "总量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#fb6086"
                            }
                        },
                        data: _self.seriousNum
                    }
                ]
            };
            let option_area = {
                title: {
                    text: '重大水利工程各地区问题分布情况',
                    textStyle: {
                        align: 'center',
                        // color: '#fff',
                        fontSize: 20,
                    },
                    top: '3%',
                    left: '10%',
                },
                // backgroundColor: '#0f375f',
                grid: {
                    top: "25%",
                    bottom: "10%"
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                        label: {
                            show: true
                        }
                    }
                },
                legend: {
                    data: ["平均", "问题数量"],
                    top: "15%",
                    textStyle: {
                        // color: "#ffffff"
                    }
                },
                xAxis: {
                    data:_self.xName,
                    axisLine: {
                        show: true //隐藏X轴轴线
                    },
                    
                    axisTick: {
                        show: true //隐藏X轴刻度
                    },
                    axisLabel: {
                        rotate:15,
                        show: true,
                        textStyle: {
                            // color: "#ebf8ac" //X轴文字颜色
                        }
                    },
                    axisLine: {
                                lineStyle: {
                                    // color: '#01FCE3'
                                    }
                            },
                },
                yAxis: [{
                        type: "value",
                        name: "个",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: true
                        },
                        axisLabel: {
                            show: true,
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        },
                        axisLine: {
                                    lineStyle: {
                                        // color: '#FFFFFF'
                                        }
                                },
                    },
                    {
                        type: "value",
                        name: "平均",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        position: "right",
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        max: 40,
                        min: 0,
                        axisLabel: {
                            show: true,
                            // formatter: "{value} %", //右侧Y轴文字显示
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        }
                    },
                    {
                        type: "value",
                        gridIndex: 0,
                        min: 50,
                        max: 100,
                        splitNumber: 8,
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: true,
                            areaStyle: {
                                color: ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                            }
                        }
                    }
                ],
                series: [{
                        name: "平均值",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: false, //显示所有图形。
                        // symbol: "circle", //标记的图形为实心圆
                        // symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#fb6086"
                        },
                        lineStyle: {
                            color: "#fb6086"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        // data: [20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20]
                        data: _self.avgAreaLists
                    },
                    {
                        name: "问题数量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#0195f2"
                            }
                        },
                        data: _self.areaData
                    }
                ]
            };
            let option_poverty = {
                title: {
                    text:'贫困地区发现问题的严重程度分布情况',
                    top: '3%',
                    left: '10%',
                    // padding:[24,0],
                    textStyle:{
                        // color:'#fff',
                        fontSize:18*scale,
                        align:'center'
                    }
                },
                
                legend: {
                    // selectedMode:false,
                    formatter: function(name) {
                        var total = 0; //各科正确率总和
                        var averagePercent; //综合正确率
                        echartData.forEach(function(value, index, array) {
                            total += value.value;
                        });
                        return '{total|' + total + '}';
                    },
                    data: [echartData[0].name],
                    // data: ['高等教育学'],
                    // itemGap: 50,
                    left: 'center',
                    top: 'center',
                    icon: 'none',
                    align:'center',
                    textStyle: {
                        // color: "#fff",
                        fontSize: 16 * scale,
                        rich: rich
                    },
                },
                series: [{
                    name: '总考生数量',
                    type: 'pie',
                    radius: ['40%', '50%'],
                    // hoverAnimation: false,
                    color: ['#5ce9c7', '#fed172', '#fb6086'],
                    label: {
                        normal: {
                            formatter: function(params, ticket, callback) {
                                var total = 0; 
                                var percent = 0; 
                                echartData.forEach(function(value, index, array) {
                                    total += value.value;
                                });
                                if(total != 0){
                                    percent = ((params.value / total) * 100).toFixed(1);
                                    return '{blackSmall|' + params.name + '}{black|' + params.value + '}\n{blue|' + percent + '%}';
                                }else{
                                    return '{blackSmall|' + params.name + '}{black|' + params.value + '}\n{blue|' + "0" + '%}';
                                }
                            },
                            rich: rich
                        },
                    },
                    data: echartData
                }]
            };
            if(_self.search_type == "1"){
                chart.clear();
                chart.setOption(option);
            }else if(_self.search_type == "2"){
                chart.clear();
                chart.setOption(option_responsible);
            }else if(_self.search_type == "3"){
                chart.clear();
                chart.setOption(option_area);
            }else if(_self.search_type == "5"){
                chart.clear();
                chart.setOption(option_poverty);
            }else{
                alert(1);
            }
        },
        init_Total_BarLineChart:function(){
            var _self = this;
            let chart = echarts.init(this.$refs['total_bar_chart']);
            let option = {
                title: {
                    text: '发现问题的专业分布情况',
                    textStyle: {
                        align: 'center',
                        // color: '#fff',
                        fontSize: 20,
                    },
                    top: '3%',
                    left: '10%',
                },
                // backgroundColor: '#0f375f',
                grid: {
                    top: "25%",
                    bottom: "15%"
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                        label: {
                            show: true
                        }
                    }
                },
                legend: {
                    data: ["占比", "问题数量"],
                    top: "15%",
                    textStyle: {
                        // color: "#ffffff"
                    }
                },
                xAxis: {
                    // data: [
                    //     "工程质量管理",
                    //     "安全生产管理",
                    //     "前期与设计",
                    //     "建设与管理",
                    //     "资金使用与管理",
                    //     "计划下达与执行",
                        
                    // ],
                    data: _self.problemNumName,
                    axisLine: {
                        show: true //隐藏X轴轴线
                    },
                    
                    axisTick: {
                        show: true //隐藏X轴刻度
                    },
                    axisLabel: {
                        rotate:15,
                        show: true,
                        textStyle: {
                            // color: "#ebf8ac" //X轴文字颜色
                        }
                    },
                    
                    axisLine: {
                                lineStyle: {
                                    // color: '#01FCE3'
                                    }
                            },
                },
                yAxis: [{
                        type: "value",
                        name: "个",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: true
                        },
                        axisLabel: {
                            show: true,
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        },
                        axisLine: {
                                    lineStyle: {
                                        // color: '#FFFFFF'
                                        }
                                },
                    },
                    {
                        type: "value",
                        name: "占比",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        position: "right",
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisLabel: {
                            show: true,
                            formatter: "{value} %", //右侧Y轴文字显示
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        }
                    },
                    {
                        type: "value",
                        gridIndex: 0,
                        min: 50,
                        max: 100,
                        splitNumber: 8,
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: true,
                            areaStyle: {
                                color: ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                            }
                        }
                    }
                ],
                series: [{
                        name: "占比",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        data: _self.proportionLists
                    },
                    {
                        name: "问题数量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#00FFE3"
                                    },
                                    {
                                        offset: 1,
                                        color: "#4693EC"
                                    }
                                ])
                            }
                        },
                        data: _self.problemNumCount
                    }
                ]
            };
            _self.addYearTotal_BarLineChart = [
                {
                        name: "占比",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        data: _self.proportionLists_DB
                    },
                    {
                        name: "问题数量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#00FFE3"
                                    },
                                    {
                                        offset: 1,
                                        color: "#4693EC"
                                    }
                                ])
                            }
                        },
                        data: _self.problemNumCount_DB
                    }
            ]
            if(this.search_year != "" ){
                option.series = option.series.concat(_self.addYearTotal_BarLineChart);
            }
            chart.setOption(option);
        },
        init_Serious_BarLineChart:function(){
            var _self = this;
            let chart = echarts.init(this.$refs['normal_bar_chart']);
            let option = {
                title: {
                    text: _self.countTotalHeavierAndSerious + '个严重和较重问题分布情况',
                    textStyle: {
                        align: 'center',
                        // color: '#fff',
                        fontSize: 20,
                    },
                    top: '3%',
                    left: '10%',
                },
                // backgroundColor: '#0f375f',
                grid: {
                    top: "25%",
                    bottom: "15%"
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                        label: {
                            show: true
                        }
                    }
                },
                legend: {
                    data: ["占比", "较重问题", "严重问题"],
                    top: "15%",
                    textStyle: {
                        // color: "#ffffff"
                    }
                },
                xAxis: {
                    // data: [
                    //     "工程质量管理",
                    //     "安全生产管理",
                    //     "前期与设计",
                    //     "建设与管理",
                    //     "资金使用与管理",
                    //     "计划下达与执行",
                        
                    // ],
                    data:_self.problemNumNameHeavierAndSerious,
                    axisLine: {
                        show: true //隐藏X轴轴线
                    },
                    
                    axisTick: {
                        show: true //隐藏X轴刻度
                    },
                    axisLabel: {
                        rotate:15,
                        show: true,
                        textStyle: {
                            // color: "#ebf8ac" //X轴文字颜色
                        }
                    },
                    axisLine: {
                                lineStyle: {
                                    // color: '#01FCE3'
                                    }
                            },
                },
                yAxis: [{
                        type: "value",
                        name: "个",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: true
                        },
                        axisLabel: {
                            show: true,
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        },
                        axisLine: {
                                    lineStyle: {
                                        // color: '#FFFFFF'
                                        }
                                },
                    },
                    {
                        type: "value",
                        name: "占比",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        position: "right",
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisLabel: {
                            show: true,
                            formatter: "{value} %", //右侧Y轴文字显示
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        }
                    },
                    {
                        type: "value",
                        gridIndex: 0,
                        min: 50,
                        max: 100,
                        splitNumber: 8,
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: true,
                            areaStyle: {
                                color: ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                            }
                        }
                    }
                ],
                series: [{
                        name: "占比",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        // data: [23,21,16,16,16,8]
                        data: _self.problemNumNameHeavierAndSeriousZb



                    },
                    {
                        name: "较重问题",
                        stack: "总量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#fed172"
                            }
                        },
                        // data: [47,47,35,36,35,15]
                        data: _self.problemNumCountHeavier
                                                


                    },
                    {
                        name: "严重问题",
                        stack: "总量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#fb6086"
                            }
                        },
                        // data: [7,4,3,2,2,5]
                        data: _self.problemNumCountSerious
                        

                    },
                    
                ]
            };
            _self.addYear=[
                {
                    name: "占比1",
                    type: "line",
                    yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                
                    showAllSymbol: true, //显示所有图形。
                    symbol: "circle", //标记的图形为实心圆
                    symbolSize: 10, //标记的大小
                    itemStyle: {
                        //折线拐点标志的样式
                        color: "#F6931C"
                    },
                    lineStyle: {
                        color: "#F6931C"
                    },
                    areaStyle:{
                        color: "rgba(5,140,255, 0.2)"
                    },
                    data: _self.problemNumNameHeavierAndSeriousZb_DB
                },
                {
                    name: "较重问题",
                    stack: "总量1",
                    type: "bar",
                    barWidth: 25,
                    itemStyle: {
                        normal: {
                            color: "#fed172"
                        }
                    },
                    data: _self.problemNumCountHeavier_DB
                },
                {
                    name: "严重问题",
                    stack: "总量1",
                    type: "bar",
                    barWidth: 25,
                    itemStyle: {
                        normal: {
                            color: "#fb6086"
                        }
                    },
                    data: _self.problemNumCountSerious_DB
                }
            ]
            if(this.search_year != "" ){
                option.series = option.series.concat(_self.addYear);
            }
            chart.setOption(option);
        },
        init_Normal_BarLineChart:function(){
            var _self = this;
            let chart = echarts.init(this.$refs['serious_bar_chart']);
            let option = {
                title: {
                    text: _self.countTotalNormal + '个一般问题分布情况',
                    textStyle: {
                        align: 'center',
                        // color: '#fff',
                        fontSize: 20,
                    },
                    top: '3%',
                    left: '10%',
                },
                // backgroundColor: '#0f375f',
                grid: {
                    top: "25%",
                    bottom: "15%"
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow",
                        label: {
                            show: true
                        }
                    }
                },
                legend: {
                    data: ["占比", "问题数量"],
                    top: "15%",
                    textStyle: {
                        // color: "#ffffff"
                    }
                },
                xAxis: {
                    data: _self.problemNumNameNormal,
                   
                    axisLine: {
                        show: true //隐藏X轴轴线
                    },
                    
                    axisTick: {
                        show: true //隐藏X轴刻度
                    },
                    axisLabel: {
                        rotate:15,
                        show: true,
                        textStyle: {
                            // color: "#ebf8ac" //X轴文字颜色
                        }
                    },
                    axisLine: {
                                lineStyle: {
                                    // color: '#01FCE3'
                                    }
                            },
                },
                yAxis: [{
                        type: "value",
                        name: "个",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: true
                        },
                        axisLabel: {
                            show: true,
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        },
                        axisLine: {
                                    lineStyle: {
                                        // color: '#FFFFFF'
                                        }
                                },
                    },
                    {
                        type: "value",
                        name: "占比",
                        nameTextStyle: {
                            // color: "#ebf8ac"
                        },
                        position: "right",
                        splitLine: {
                            show: false
                        },
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisLabel: {
                            show: true,
                            formatter: "{value} %", //右侧Y轴文字显示
                            textStyle: {
                                // color: "#ebf8ac"
                            }
                        }
                    },
                    {
                        type: "value",
                        gridIndex: 0,
                        min: 50,
                        max: 100,
                        splitNumber: 8,
                        splitLine: {
                            show: false
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            show: false
                        },
                        splitArea: {
                            show: true,
                            areaStyle: {
                                color: ["rgba(250,250,250,0.0)", "rgba(250,250,250,0.05)"]
                            }
                        }
                    }
                ],
                series: [{
                        name: "占比",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        // data: [23,19,18,17,15,9]
                        data: _self.problemNumNameNormalZb
                    },
                    {
                        name: "问题数量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#5ce9c7"
                            }
                        },
                        data: _self.problemNumCountNormal
                    }
                ]
            };
            _self.addYearNormal_BarLineChart = [
                {
                        name: "占比",
                        type: "line",
                        yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
                    
                        showAllSymbol: true, //显示所有图形。
                        symbol: "circle", //标记的图形为实心圆
                        symbolSize: 10, //标记的大小
                        itemStyle: {
                            //折线拐点标志的样式
                            color: "#49dff0"
                        },
                        lineStyle: {
                            color: "#49dff0"
                        },
                        areaStyle:{
                            color: "rgba(5,140,255, 0.2)"
                        },
                        // data: [23,19,18,17,15,9]
                        data: _self.problemNumNameNormalZb_DB
                    },
                    {
                        name: "问题数量",
                        type: "bar",
                        barWidth: 25,
                        itemStyle: {
                            normal: {
                                color: "#5ce9c7"
                            }
                        },
                        data: _self.problemNumCountNormal_DB
                    }
            ]
            if(this.search_year != "" ){
                option.series = option.series.concat(_self.addYearNormal_BarLineChart);
            }
            chart.setOption(option);
        },
        searchData(){
            this.heavierAndSeriousLists_DB=[];
            this.countTotalHeavierAndSerious_DB=[];
            this.problemNumCountHeavier_DB=[];
            this.problemNumCountSerious_DB=[];
            this.problemNumNameHeavierAndSeriousZb_DB=[];
            this.normalLists_DB=[];
            this.countTotalNormal_DB=[];
            this.problemNumCountNormal_DB=[];
            this.problemNumNameNormalZb_DB=[];
            this.search_year.toString();
            this.getBarChartData_DB();
        }
    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {
        },
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {
        this.getYearPc();
        
        // this.getTreeData();
        this.getDataChartData();
        this.getBarChartData();
        // this.init_Total_BarLineChart();
        // this.init_Normal_BarLineChart();
        // this.init_Serious_BarLineChart();
    },
    beforeCreate() {}, //生命周期 - 创建之前
    beforeMount() {}, //生命周期 - 挂载之前
    beforeUpdate() {}, //生命周期 - 更新之前
    updated() {}, //生命周期 - 更新之后
    beforeDestroy() {}, //生命周期 - 销毁之前
    destroyed() {}, //生命周期 - 销毁完成
    activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang="scss">
 .filter_tree{
        .el-tree-node__label{
            color: #666;
            font-size: large;
        }
    }
    .filter_tree.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
        background-color: #c7e9fe;
    }
    .assistant_btn{
        position: absolute;
        bottom: -10px;
        right: 20px;
        z-index: 999;
    }
    .open_board{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 24px;
        height: 30px;
        line-height: 30px;
        border: solid 1px #ddd;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        text-align: center;
        background-color: #bbebff;
        cursor: pointer;
    }
</style>