this is the error message 
 
 
 there should be a table 
 paste the source code 
 < template > 
<div class="table" style="height: 100%;">
    <div>
        <el-card class="box-card">
            <div slot="header">
                
            </div>
            <div class="text item" @click="tabId=0" :class="[tabId==0 ? "active" : ""]"></div>
            <div class="text item" @click="tabId=1" :class="[tabId==1 ? "active" : ""]"></div>
        </el-card>
        <div class="tablebox" v-show="tabId==0">
            <el-card class="table-card" style="height: 650px;overflow-y: auto">
                <v-ClassifyTree @handleClick="handleNodeClick"></v-ClassifyTree>
            </el-card>
            <div class="handle-box" v-if="nowShow">
                    <div  style="height: 80px;padding: 20px 10px;">
                        <p style="background-color:-sharp29a8cd;text-align: center;line-height: 50px">
                    </div>
            </div>
            <div class="handle-box" v-if="boxShow">
                <div>
                    <el-card>
                        <div slot="header">
                            <el-row><span style="font-size:20px"></span><el-date-picker v-model="value4" type="month" placeholder="">
                            </el-date-picker></el-row>
                        </div>
                        <div id="charts" style="width: 100%;height: 250px;"></div>
                    </el-card>
                </div>
            </div>
        </div>
        <div class="tablebox" v-show="tabId==1">
            <el-card class="table-card" style="height: 650px;overflow-y: auto">
                <v-ClassifyTree @handleClick="handleNodeClick"></v-ClassifyTree>
            </el-card>
            <div class="handle-box">
                <div v-if="nowShow" style="height: 80px;padding: 20px 10px;">
                    <p style="background-color:-sharp29a8cd;text-align: center;line-height: 50px">
                </div>
                <div v-if="boxShow">
                    <el-card>
                        <div slot="header">
                            <el-row><span style="font-size:20px"></span><el-date-picker v-model="value2" type="month" placeholder="">
                            </el-date-picker></el-row>
                        </div>
                        <div id="charts2" style="width: 100%;height: 250px;"></div>
                    </el-card>
                </div>
            </div>
        </div>
    </div>
</div>< / template >
< script >
import vClassifyTree from "../common/ClassifyTree.vue";
let echarts = require("echarts/lib/echarts");
require("echarts/map/js/china");
require("echarts/lib/chart/pie");
require("echarts/lib/chart/line");
require("echarts/lib/chart/bar");
require("echarts/lib/component/tooltip");
require("echarts/lib/component/legend");
export default {
    data() {
        return {
            tabId:0,
            value3:"",
            value4:"",
            value2:"",
            value1:"",
            boxShow:false,
            nowShow:true,
            node:"",
            show:"",
            carArchives:[],
        }
    },
    components:{
        vClassifyTree
    },
    mounted() {
        this.drawLine();
        this.drawLine2();    
    },
    methods: {
        drawLine(){
        let myChart = echarts.init(document.getElementById("charts"));
        var option = {
                color: ["-sharp3398DB"],
                tooltip : {
                    trigger: "axis",
                    axisPointer : {            // 
                        type : "shadow"        // :"line" | "shadow"
                    }
                },
                grid: {
                    left: "3%",
                    right: "4%",
                    bottom: "3%",
                    containLabel: true
                },
                xAxis : [
                    {
                        type : "category",
                        name:"",
                        data : ["1", "2", "3", "4", "5", "6", "7","8", "9", "10", "11", "12", "13", "14"],
                        axisTick: {
                            alignWithLabel: true
                        }
                    }
                ],
                yAxis : [
                    {
                        type : "value",
                        name:""
                    }
                ],
                series : [
                    {
                        name:"",
                        type:"bar",
                        barWidth: "60%",
                        data:[10, 52, 200, 334, 390, 330, 220,10, 52, 200, 334, 390, 330, 220]
                    }
                ]
            };
            myChart.setOption(option);
        },
        drawLine2(){
        let myChart = echarts.init(document.getElementById("charts2"));
         var option = {
             title : {
                 text: "",
                 x:"center"
             },
             tooltip : {
                 trigger: "item",
                 formatter: "{a} <br/>{b} : {c} ({d}%)"
             },
             series : [
                 {
                     name: "",
                     type: "pie",
                     radius : "55%",
                     center: ["50%", "60%"],
                     data:[
                         {value:335, name:""},
                         {value:310, name:""},
                     ],
                     itemStyle: {
                         emphasis: {
                             shadowBlur: 10,
                             shadowOffsetX: 0,
                             shadowColor: "rgba(0, 0, 0, 0.5)"
                         }
                     }
                 }
             ]
         };
            myChart.setOption(option);
            myChart.resize();
        },
       },
        //
        handleNodeClick(childs) {
            this.nowShow=false;
            this.boxShow=true;
            this.node=childs;
            var this_ = this;
            if(this.node.leaf) {
                this_.show = true;
                this.$axios.post("api/achives/achivesInfo", {
                    "LicencePlate": this.node.name
                }).then((res) => {
                    this.carArchives.push(res.data.achivesInfo);
                    console.log(this.carArchives);
                });
            } else {
                console.log("");
            }
        }
    }
}< / script >
has been working on it all day
