<template>
    <el-row :gutter="24" >
        <el-col :xs="24" :sm="24" :lg="16">
            <div class="grid-content bg-purple">
                <tubiao></tubiao>
            </div>
        </el-col>
        <el-col :xs="24" :sm="24" :lg="8">
            <div class="grid-content bg-purple-light">
                <anniu></anniu>
            </div>
        </el-col>

        <el-col :xs="24" :sm="24" :lg="8">
            <div class="bg-purple">
                <daiyu></daiyu>
                <jclb></jclb>
            </div>
        </el-col>
        <el-col :xs="24" :sm="24" :lg="8">
            <div class="grid-content bg-purple">
                <dashboarde></dashboarde>
            </div>
        </el-col>
        <el-col :xs="24" :sm="24" :lg="8">
            <div class="grid-content bg-purple">
                <jfnr></jfnr>
            </div>
        </el-col>
    </el-row>
</template>


<script>
    import tubiao from './components/tubiao'
    import anniu from './components/anniu'
    import daiyu from './components/daiyu'
    import jclb from './components/jclb'
    import dashboarde from './components/dashboarde'
    import jfnr from './components/jfnr'
    export default {
        components: {tubiao,anniu,daiyu,jclb,dashboarde,jfnr},
        data() {
            return {
                activeName2: 'first'
            };
        },
        methods: {
            handleClick(tab, event) {
                console.log(tab, event);
            }
        }
    };
</script>


<style>
    .el-row{
        padding:15px;
    &:last-child {
         margin-bottom: 0;
     }
    }
    .el-col{ margin-bottom:10px;}
</style>

