carInsightSystem/src/views/EventComparison/EventComparison.vue

<!--
 * @Author: your name
 * @Date: 2021-10-18 13:35:07
 * @LastEditTime: 2021-10-20 09:18:01
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /data-show/src/views/EventComparison/index.vue
-->
<template>
    <div class="d-container">
        <div class="ec-outter">
            <ecx-top></ecx-top>
            <div class="ece-d1">
                <v-label-div title="对比数据">
                </v-label-div>
                <div class="dd1">
                    <vue-lazy-component>
                    <comparisonOfEventDisseminationChannels></comparisonOfEventDisseminationChannels>
                    <comparisonOfEventDisseminationChannelsStoken slot="skeleton"></comparisonOfEventDisseminationChannelsStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <etc-cc></etc-cc>
                    <etc-ccStoken slot="skeleton"></etc-ccStoken>
                    </vue-lazy-component>
                </div>
                <div class="dd2">
                    <vue-lazy-component>
                    <profileOfAssociatedAuthorsOne></profileOfAssociatedAuthorsOne>
                    <profileOfAssociatedAuthorsOneStoken slot="skeleton"></profileOfAssociatedAuthorsOneStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <eventSTM></eventSTM>
                    <eventSTMStoken slot="skeleton"></eventSTMStoken>
                    </vue-lazy-component>
                </div>
                <vue-lazy-component>
                <comparisonOfEventpp></comparisonOfEventpp>
                <comparisonOfEventppStoken slot="skeleton"></comparisonOfEventppStoken>
                </vue-lazy-component>
                <vue-lazy-component>
                <positiveAndNegativeWordCloudContrast></positiveAndNegativeWordCloudContrast>
                <positiveAndNegativeWordCloudContrastStoken slot="skeleton"></positiveAndNegativeWordCloudContrastStoken>
                </vue-lazy-component>
            </div>
            <div class="ece-d2">
                <v-label-div title="事件微博对比">
                </v-label-div>
                <div class="dd1">
                    <vue-lazy-component>
                    <CWIEC></CWIEC>
                    <CWIECStoken slot="skeleton"></CWIECStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <cotwiEc></cotwiEc>
                    <cotwiEcStoken slot="skeleton"></cotwiEcStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <wbcEc></wbcEc>
                    <wbcEcStoken slot="skeleton"></wbcEcStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <wtcEc></wtcEc>
                    <wtcEcStoken slot="skeleton"></wtcEcStoken>
                    </vue-lazy-component>
                </div>
                <div class="dd2">
                    <vue-lazy-component>
                    <uadEc></uadEc>
                    <uadEcStoken slot="skeleton"></uadEcStoken>
                    </vue-lazy-component>
                    <vue-lazy-component>
                    <wupEc></wupEc>
                    <wupEcStoken slot="skeleton"></wupEcStoken>
                    </vue-lazy-component>
                </div>
            </div>
            <div class="ece-d3">
                <v-label-div title="事件尾翼对比">
                </v-label-div>
                <div class="dd1">
                    <vue-lazy-component>
                    <tirEc></tirEc>
                    <tirEcStoken slot="skeleton"></tirEcStoken>
                    </vue-lazy-component>
                    <!-- <inbcEc></inbcEc> -->
                </div>
                 <ttmEc></ttmEc>
            </div>
        </div>
    </div>
</template>

<script>
import ecxTop from "./ecx-top";
import comparisonOfEventDisseminationChannels from "./comparisonOfEventDisseminationChannels";
import profileOfAssociatedAuthorsOne from "./profileOfAssociatedAuthorsOne";
import etcCc from "./etc-cc";
import eventSTM from "./eventSTM";
import comparisonOfEventpp from "./comparisonOfEventpp";
import positiveAndNegativeWordCloudContrast from "./positiveAndNegativeWordCloudContrast";
import CWIEC from "./CWIEC";
import cotwiEc from "./cotwiEc";
import wbcEc from "./wbcEc";
import wtcEc from "./wtcEc";
import uadEc from "./uadEc";
import wupEc from "./wupEc";
import tirEc from "./tirEc";
// import inbcEc from "./inbcEc"
import ttmEc from "./ttmEc"
//骨架屏
import ecxTopStoken from "./ecx-topStoken";
import comparisonOfEventDisseminationChannelsStoken from "./comparisonOfEventDisseminationChannelsStoken";
import profileOfAssociatedAuthorsOneStoken from "./profileOfAssociatedAuthorsOneStoken";
import etcCcStoken from "./etc-ccStoken";
import eventSTMStoken from "./eventSTMStoken";
import comparisonOfEventppStoken from "./comparisonOfEventppStoken";
import positiveAndNegativeWordCloudContrastStoken from "./positiveAndNegativeWordCloudContrastStoken";
import CWIECStoken from "./CWIECStoken";
import cotwiEcStoken from "./cotwiEcStoken";
import wbcEcStoken from "./wbcEcStoken";
import wtcEcStoken from "./wtcEcStoken";
import uadEcStoken from "./uadEcStoken";
import wupEcStoken from "./wupEcStoken";
import tirEcStoken from "./tirEcStoken";
import ttmEcStoken from "./ttmEcStoken"
export default {
    name: "EventC",
    components: {
        ecxTop, // 头部
        comparisonOfEventDisseminationChannels, // 事件传播渠道对比
        etcCc, // 事件调性对比
        profileOfAssociatedAuthorsOne, // 关联作者概况
        eventSTM, // 事件传播TOP媒体
        comparisonOfEventpp, // 事件传播历程对比
        positiveAndNegativeWordCloudContrast, // 正负词云对比
        CWIEC, // 微博信息量对比
        cotwiEc, // 微博互动人数对比
        wbcEc, // 微博大V对比
        wtcEc, // 微博调性对比
        uadEc, // 用户区域分布
        wupEc, // 微博用户画像
        tirEc, // 尾翼信息趋势
        // inbcEc, // 分渠道信息量
        ttmEc, // 尾翼TOP媒体
        //骨架屏
        ecxTopStoken, // 头部
        comparisonOfEventDisseminationChannelsStoken, // 事件传播渠道对比
        etcCcStoken, // 事件调性对比
        profileOfAssociatedAuthorsOneStoken, // 关联作者概况
        eventSTMStoken, // 事件传播TOP媒体
        comparisonOfEventppStoken, // 事件传播历程对比
        positiveAndNegativeWordCloudContrastStoken, // 正负词云对比
        CWIECStoken, // 微博信息量对比
        cotwiEcStoken, // 微博互动人数对比
        wbcEcStoken, // 微博大V对比
        wtcEcStoken, // 微博调性对比
        uadEcStoken, // 用户区域分布
        wupEcStoken, // 微博用户画像
        tirEcStoken, // 尾翼信息趋势
        ttmEcStoken // 尾翼TOP媒体
    },
    data() {
        return {
            se: {
                visible: false,
            },
        };
    },
};
</script>

<style lang="less" scoped>
.ec-outter {
    padding: 0px 16px 16px 16px;
    .ece-d1 {
        width: 100%;
        height: auto;
        border: 2px solid #0f2a4d;
        margin-top: 16px;
        .dd1 {
            width: 100%;
            display: flex;
            justify-content: flex-start;
        }
        .dd2 {
            width: 100%;
            display: flex;
            justify-content: flex-start;
        }
    }
    .ece-d2 {
        width: 100%;
        height: auto;
        border: 2px solid #0f2a4d;
        margin-top: 16px;
        .dd1 {
            width: 100%;
            display: flex;
            justify-content: flex-start;
        }
        .dd2 {
            width: 100%;
            display: flex;
            justify-content: flex-start;
        }
    }
    .ece-d3 {
        width: 100%;
        height: auto;
        border: 2px solid #0f2a4d;
        margin-top: 16px;
        .dd1 {
            width: 100%;
            display: flex;
            justify-content: flex-start;
        }
    }
}
</style>