<template>
<div class="type xp-wrapper">
    <h2 class="xp-title">内容类型分析</h2>
    <div class="xp-card">
        <form-filter></form-filter>
    </div>
    <div class="xp-card">
        <el-tabs value="tab">
            <el-tab-pane label="内容类型趋势" name="tab">
                <chart-line-area></chart-line-area>
            </el-tab-pane>
        </el-tabs>
    </div>
    <div class="xp-card">
        <el-tabs value="tab">
            <el-tab-pane label="内容类型构成" name="tab">
                <chart-pie-double></chart-pie-double>
            </el-tab-pane>
            <h5 class="xp-subtitle">数据明细</h5>
            <table-with-fixed-header></table-with-fixed-header>
        </el-tabs>
    </div>
    <div class="xp-card">
        <h5 class="xp-subtitle">整体构成</h5>
        <table-with-fixed-header1></table-with-fixed-header1>
    </div>
</div>
</template>

<script>
/**
 * @file type 页面
 *
 * @author zhangping15

 * @date 2018-07-06
 */

import chartLineArea from './components/chart-line-area/index.vue';
import chartPieDouble from './components/chart-pie-double/index.vue';
import formFilter from './components/form-filter/index.vue';
import tableWithFixedHeader from './components/table-with-fixed-header/index.vue';
import tableWithFixedHeader1 from './components/table-with-fixed-header1/index.vue';

export default {
    components: {
        'chart-line-area': chartLineArea,
        'chart-pie-double': chartPieDouble,
        'form-filter': formFilter,
        'table-with-fixed-header': tableWithFixedHeader,
        'table-with-fixed-header1': tableWithFixedHeader1
    },
    data() {
        return {};
    },
    mounted() {
        this.init();
    },
    methods: {
        init() {
        }
    }
};
</script>

<style lang="less">
.type {

}
</style>
