zx-骨架屏

prod
张雄 3 years ago
parent c6ee2a958d
commit 0a377bc7bd

@ -53,10 +53,10 @@
<weibo-portraits :brand="brand"></weibo-portraits>
<weiboPortraitsStoken slot="skeleton"></weiboPortraitsStoken>
</vue-lazy-component>
<vue-lazy-component>
<!-- <vue-lazy-component> -->
<weibo-volume-trend :brand="brand"></weibo-volume-trend>
<weiboVolumeTrendStoken slot="skeleton"></weiboVolumeTrendStoken>
</vue-lazy-component>
<!-- <weiboVolumeTrendStoken slot="skeleton"></weiboVolumeTrendStoken> -->
<!-- </vue-lazy-component> -->
</div>
</div>
<div class="bdl-d4">
@ -64,10 +64,10 @@
<v-btn @click="goRouter('/forumDetails')"></v-btn>
</v-label-div>
<div class="bdl-d4-bd">
<vue-lazy-component>
<!-- <vue-lazy-component> -->
<forumCommunicationTrend :brand="brand"></forumCommunicationTrend>
<forumCommunicationTrendStoken slot="skeleton"></forumCommunicationTrendStoken>
</vue-lazy-component>
<!-- <forumCommunicationTrendStoken slot="skeleton"></forumCommunicationTrendStoken>
</vue-lazy-component> -->
<vue-lazy-component>
<forumHotTopicDirection :brand="brand"></forumHotTopicDirection>
<forumHotTopicDirectionStoken slot="skeleton"></forumHotTopicDirectionStoken>
@ -83,17 +83,17 @@
<v-btn @click="goRouter('/tailInsightDetails')"></v-btn>
</v-label-div>
<div class="bdl-d5-bd">
<vue-lazy-component>
<!-- <vue-lazy-component> -->
<rearWingPropagationSituation :brand="brand"></rearWingPropagationSituation>
<rearWingPropagationSituationStoken slot="skeleton"></rearWingPropagationSituationStoken>
</vue-lazy-component>
<!-- <rearWingPropagationSituationStoken slot="skeleton"></rearWingPropagationSituationStoken>
</vue-lazy-component> -->
<vue-lazy-component>
<keyMedia :brand="brand"></keyMedia>
<ketMediaStoken slot="skeleton"></ketMediaStoken>
</vue-lazy-component>
<vue-lazy-component>
<popularwordCloud :brand="brand"></popularwordCloud>
<popularwordCloud slot="skeleton"></popularwordCloud>
<popularwordCloudStoken slot="skeleton"></popularwordCloudStoken>
</vue-lazy-component>
</div>
</div>

@ -10,6 +10,17 @@
<template>
<div class="wk-outter">
<div class="wk-inner">
<div class="wk-in-d1">
<v-label-div title="微博KOL" :showLine="false" :eStyle="{ 'border-style': 'none' }"></v-label-div>
<div class="wk-in-d1-dd1">
<v-echarts></v-echarts>
</div>
</div>
<div class="wk-in-d2">
<vue-scroll>
<v-label-ctx v-for="(item,index) in labelData" :key="index" :label="item.key" :cont="item.value" :percentage="(item.value/total*100).toFixed(2) +'%'" :color="colors[index]" contLabel="数量" :eStyle="{ height: '5rem' }"></v-label-ctx>
</vue-scroll>
</div>
</div>
</div>
</template>

@ -8,6 +8,34 @@
-->
<template>
<div class="wp-outter">
<v-label-div title="微博人物画像" :showLine="false" :eStyle="{ 'border-style': 'none' }">
<v-tab-group :btns="['性别', '认证', '地区']"></v-tab-group>
</v-label-div>
<div class="wp-inner">
<div class="wp-in-d1">
<v-echarts></v-echarts>
</div>
<div class="wp-in-d2">
<div v-if="labelData.length<=3">
<v-label-ctx v-for="(item,index) in labelData"
:key="index" :label="item.key"
:cont="item.value"
:percentage="(item.value/totalData*100).toFixed(2) +'%'"
:color="colors[index]"
:eStyle="{ height: '7.6rem' }">
</v-label-ctx>
</div>
<vue-scroll v-if="labelData.length>3">
<v-label-ctx v-for="(item,index) in labelData"
:key="index" :label="item.key"
:cont="item.value"
:percentage="(item.value/totalData*100).toFixed(2) +'%'"
:color="colors[index]"
:eStyle="{ height: '4.56rem' }">
</v-label-ctx>
</vue-scroll>
</div>
</div>
</div>
</template>

@ -10,6 +10,9 @@
<div class="wvt-outter">
<v-label-div title="微博声量趋势" :showLine="false" :eStyle="{ 'border-style': 'none' }">
</v-label-div>
<div class="wvt-inner">
<v-echarts></v-echarts>
</div>
</div>
</template>

@ -0,0 +1,41 @@
<!--
* @Author: your name
* @Date: 2021-10-19 09:46:17
* @LastEditTime: 2021-11-19 17:53:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/CWIEC/index.vue
-->
<template>
<div class="cwiec-outter">
<v-label-div title="微博信息量对比" :showLine="false" :eStyle="{'border-style': 'none'}">
</v-label-div>
</div>
</template>
<script>
export default {
name: "CWIEC",
data() {
return {
form: {
token: "",
sRele: "",
},
opt: {}
}
},
}
</script>
<style lang="less" scoped>
.cwiec-outter {
width: 472px;
height: 412px;
.cwiec-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -14,35 +14,74 @@
<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>
@ -68,6 +107,22 @@ 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: {
@ -86,7 +141,23 @@ export default {
wupEc, //
tirEc, //
// inbcEc, //
ttmEc // TOP
ttmEc, // TOP
//
ecxTopStoken, //
comparisonOfEventDisseminationChannelsStoken, //
etcCcStoken, //
profileOfAssociatedAuthorsOneStoken, //
eventSTMStoken, // TOP
comparisonOfEventppStoken, //
positiveAndNegativeWordCloudContrastStoken, //
CWIECStoken, //
cotwiEcStoken, //
wbcEcStoken, // V
wtcEcStoken, //
uadEcStoken, //
wupEcStoken, //
tirEcStoken, //
ttmEcStoken // TOP
},
data() {
return {

@ -0,0 +1,42 @@
<!--
* @Author: your name
* @Date: 2021-10-18 14:06:09
* @LastEditTime: 2021-11-15 17:15:31
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/comparativeData/index.vue
-->
<template>
<div class="coedc-outter">
<v-label-div title="事件传播渠道对比" :showLine="false" :eStyle="{'border-style': 'none'}">
</v-label-div>
<div class="coedc-inner">
</div>
</div>
</template>
<script>
export default {
name: "comparisonOfEventDisseminationChannels",
data() {
return {
form: {
token: "",
sRele: ""
},
opt: {}
}
},
}
</script>
<style lang="less" scoped>
.coedc-outter {
width: 944px;
height: 412px;
.coedc-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,153 @@
<!--
* @Author: your name
* @Date: 2021-10-18 16:03:35
* @LastEditTime: 2021-11-16 18:25:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/comparisonOfEventpp/index.vue
-->
<template>
<div class="coe-outter">
</div>
</template>
<script>
export default {
name: "comparisonOfEventpp",
data() {
return {
form: {
token: "",
sRele: "",
},
colors: ["#3373CC", "#54BF93"],
m1: require("../../../assets/images/EventInsight/img_ct.png"),
m2: require("../../../assets/images/EventInsight/img_lt.png"),
list: [],
x1: 0,
x2: 0
};
},
};
</script>
<style lang="less" scoped>
.coe-outter {
width: 100%;
height: auto;
.coe-ts {
position: relative;
width: 100%;
padding: 0px 16px;
height: 380px;
display: flex;
justify-content: space-between;
align-items: center;
.coe-ts-s1 {
position: absolute;
color: #fff;
top: 16px;
left: 16px;
font-size: 16px;
color: #3373cc;
}
.coe-ts-d2 {
width: 1726px;
height: 400px;
display: flex;
justify-content: flex-start;
align-items: center;
position: relative;
.dd1-label {
.d1x {
width: 120px;
height: 120px;
background-image: url("../../../assets/images/EventInsight/img_xlvq.png");
background-repeat: no-repeat;
background-size: cover;
font-size: 14px;
color: #b0deff;
text-align: center;
line-height: 120px;
}
.d1 {
width: 120px;
height: 120px;
background-image: url("../../../assets/images/EventInsight/img_xlq.png");
background-repeat: no-repeat;
background-size: cover;
font-size: 14px;
color: #b0deff;
text-align: center;
line-height: 120px;
}
.d2 {
font-size: 16px;
color: #fff;
text-align: center;
}
.d3 {
font-size: 14px;
font-family: Bebas;
color: #616974;
text-align: center;
}
}
.dd1-fen {
position: absolute;
width: 100%;
height: 2px;
background: #004877;
left: 0px;
top: 136px;
}
.dd1-item {
position: relative;
width: 260px;
height: 320px;
display: flex;
flex-shrink: 0;
padding-left: 84px;
justify-content: flex-start;
.m1 {
height: 148px;
}
.dt-d1 {
margin-left: 18px;
.d1 {
width: 120px;
padding-top: 16px;
height: 88px;
font-size: 16px;
cursor: pointer;
}
.d2 {
font-size: 14px;
color: #fff;
}
.d3 {
font-size: 13px;
font-family: Bebas;
color: #616974;
}
}
}
}
.coe-ts-d1 {
width: 32px;
height: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
img {
cursor: pointer;
}
}
}
}
/deep/ .__view {
display: flex !important;
justify-content: flex-start !important;
align-items: center !important;
}
</style>

@ -0,0 +1,39 @@
<!--
* @Author: your name
* @Date: 2021-10-19 10:01:25
* @LastEditTime: 2021-11-19 17:57:06
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/cotwiEc/index.vue
-->
<template>
<div class="cotwiEc-outter">
</div>
</template>
<script>
export default {
name: "cotwiEc",
data() {
return {
opt: {},
form: {
token: "",
sRele: "",
},
};
},
};
</script>
<style lang="less" scoped>
.cotwiEc-outter {
width: 472px;
height: 412px;
.cotwiEc-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,119 @@
<!--
* @Author: your name
* @Date: 2021-10-18 10:42:29
* @LastEditTime: 2021-11-26 17:40:31
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/ec-d1/index.vue
-->
<template>
<div class="ec-d1">
<v-label-div title="事件对比">
</v-label-div>
</div>
</template>
<script>
export default {
name: "ecx-top",
data() {
return {
btnLoading: false,
list: [],
};
},
};
</script>
<style lang="less" scoped>
.ec-d1 {
width: 100%;
height: 222px;
border: 2px solid #0f2a4d;
.ec-d1-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
align-items: center;
.ec-d1-dd2 {
margin-left: 68px;
margin-right: 68px;
}
.ec-d1-dd1 {
width: 800px;
height: 120px;
background: linear-gradient(180deg, #0088c9 0%, #001c43 100%);
border-radius: 4px;
border: 2px solid #0091ff;
margin-left: 16px;
display: flex;
justify-content: flex-start;
align-items: center;
position: relative;
.ec-btn {
position: absolute;
width: 137px;
height: 37px;
background-image: url("../../../assets/images/EventInsight/img_zbut.png");
text-align: center;
line-height: 37px;
color: #60abcb;
right: 0px;
top: 0px;
cursor: pointer;
}
.d1 {
width: 86px;
height: 86px;
background-image: url("../../../assets/images/EventInsight/img_xlq.png");
background-repeat: no-repeat;
background-size: cover;
margin-left: 14px;
text-align: center;
line-height: 86px;
font-size: 14px;
color: #97c6ec;
}
.dx1 {
width: 86px;
height: 86px;
background-image: url("../../../assets/images/EventInsight/img_xlvq.png");
background-repeat: no-repeat;
background-size: cover;
margin-left: 14px;
text-align: center;
line-height: 86px;
font-size: 14px;
color: #97c6ec;
}
.d2 {
margin-left: 14px;
.d2-d1 {
font-size: 20px;
color: #fff;
font-weight: 500;
width: 515px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.d2-d2 {
display: flex;
justify-content: flex-start;
.s1 {
display: block;
font-size: 14px;
color: #7b93a5;
}
.s2 {
display: block;
color: #fff;
font-size: 14px;
}
}
}
}
}
}
</style>

@ -0,0 +1,69 @@
<!--
* @Author: your name
* @Date: 2021-10-18 14:31:05
* @LastEditTime: 2021-11-15 17:39:28
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/etc-cc/index.vue
-->
<template>
<div class="etcc-outter">
<v-label-div title="事件调性对比" :showLine="false" :eStyle="{'border-style': 'none'}">
</v-label-div>
</div>
</template>
<script>
export default {
name: "etc-cc",
data() {
return {
form: {
token: "",
sRele: ""
},
list: [],
colors: ['#3373CC', '#5ea4c2']
}
},
}
</script>
<style lang="less" scoped>
.etcc-outter {
width: 944px;
height: 412px;
.bd-d1 {
width: 100%;
display: flex;
height: 36px;
justify-content: flex-start;
align-items: center;
.dd1 {
display: flex;
justify-content: flex-start;
align-items: center;
}
.s1 {
display: inline-block;
width: 12px;
height: 12px;
background: #3373cc;
}
.s2 {
display: inline-block;
font-size: 12px;
color: #fff;
margin-left: 10px;
}
}
.etcc-inner {
position: relative;
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
}
}
</style>

@ -0,0 +1,46 @@
<!--
* @Author: your name
* @Date: 2021-10-18 15:33:05
* @LastEditTime: 2021-11-15 18:30:13
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/eventSTM/index.vue
-->
<template>
<div class="estm-outter">
</div>
</template>
<script>
export default {
name: "estm-outter",
data() {
return {
form: {
token: "",
sRele: ""
},
list: [],
titles: ['事件传播TOP媒体', ''],
colors: ['#3373CC', '#50b68c']
}
},
}
</script>
<style lang="less" scoped>
.estm-outter {
width: auoto;
height: auoto;
display: flex;
justify-content: flex-start;
.estm-item {
width: 472px;
height: 412px;
.estm-inner {
width: 100%;
height: calc(100% - 48px);
}
}
}
</style>

@ -0,0 +1,39 @@
<!--
* @Author: your name
* @Date: 2021-10-19 11:37:56
* @LastEditTime: 2021-10-19 11:42:07
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/inbcEc/index.vue
-->
<template>
<div class="inbcEc-outter">
</div>
</template>
<script>
export default {
name: "inbcEc",
data() {
return {
opt: {},
form: {
token: "",
sRele: "",
},
subList: []
};
},
};
</script>
<style lang="less" scoped>
.inbcEc-outter {
width: 944px;
height: 412px;
.inbcEc-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,67 @@
<!--
* @Author: your name
* @Date: 2021-10-18 19:37:58
* @LastEditTime: 2021-10-20 09:19:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/positiveAndNegativeWordCloudContrast/index.vue
-->
<template>
<div class="panwc-outter">
</div>
</template>
<script>
//import createOpt from "./opt";
export default {
name: "positiveAndNegativeWordCloudContrast",
data() {
return {
opt1: {},
opt2: {},
form: {
token: "",
sRele: "",
},
eventData1: {
name: "",
positive: {},
negative: {},
},
eventData2: {
name: "",
positive: {},
negative: {},
},
load: false,
};
},
};
</script>
<style lang="less" scoped>
.panwc-outter {
width: 100%;
.panwc-inner {
width: 100%;
display: flex;
justify-content: flex-start;
.panwc-d1 {
width: 944px;
height: 412px;
.p-d1-s1 {
padding-left: 16px;
display: block;
font-size: 16px;
color: #3373cc;
height: 24px;
width: calc(100% - 16px);
}
.panwc-inner {
width: 100%;
height: calc(100% - 74px);
}
}
}
}
</style>

@ -0,0 +1,75 @@
<!--
* @Author: your name
* @Date: 2021-10-18 15:05:22
* @LastEditTime: 2021-11-15 19:29:53
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/profileOfAssociatedAuthors/index.vue
-->
<template>
<div class="poao-outter">
<div class="poao-inner">
</div>
</div>
</template>
<script>
export default {
name: "profileOfAssociatedAuthors",
data() {
return {
form: {
token: "",
sRele: ""
},
titles: ['关联作者概况', ''],
list: []
}
},
};
</script>
<style lang="less" scoped>
.poao-outter {
width: auto;
height: auto;
.poao-inner {
display: flex;
justify-content: flex-start;
.poao-d1 {
width: 472px;
height: 412px;
.poao-item {
width: 440px;
height: 80px;
display: flex;
justify-content: space-between;
align-items: center;
border: 1px solid #022248;
border-radius: 2px;
margin-left: 16px;
margin-top: 5px;
.m1 {
display: inline-block;
width: 54px;
height: 54px;
margin-left: 12px;
}
.s1 {
display: inline-block;
font-size: 14px;
color: #fff;
margin-left: 12px;
}
.s2 {
display: inline-block;
font-size: 32px;
font-family: Bebas;
color: #ffffff;
margin-right: 16px;
}
}
}
}
}
</style>

@ -0,0 +1,38 @@
<!--
* @Author: your name
* @Date: 2021-10-19 11:28:09
* @LastEditTime: 2021-10-19 11:33:43
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/tirEc/index.vue
-->
<template>
<div class="te-outter">
</div>
</template>
<script>
export default {
name: "tirEc",
data() {
return {
opt: {},
form: {
token: "",
sRele: "",
},
};
},
};
</script>
<style lang="less" scoped>
.te-outter {
width: 1880px;
height: 412px;
.te-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,59 @@
<!--
* @Author: your name
* @Date: 2021-10-16 14:56:13
* @LastEditTime: 2021-10-19 11:52:04
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/tailTOPMedia/index.vue
-->
<template>
<div class="ttm-outter">
</div>
</template>
<script>
export default {
name: "ttmEc",
data() {
return {
colors: ["#3373CC", "#63AECC"],
form: {
token: "",
sRele: "",
},
showData: [],
};
},
};
</script>
<style lang="less" scoped>
.ttm-outter {
width: 100%;
height: auto;
.ttm-inner {
width: 100%;
height: auto;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
.ttm-item {
width: 940px;
height: 380px;
.s1 {
padding-left: 16px;
width: 100%;
height: 40px;
line-height: 40px;
font-size: 16px;
color: #fff;
}
.d1 {
width: 100%;
height: calc(100% - 40px);
}
}
}
}
</style>

@ -0,0 +1,50 @@
<!--
* @Author: your name
* @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-10-19 10:57:11
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
-->
<template>
<div class="wua-outter">
</div>
</template>
<script>
export default {
name: "uadEc",
data() {
return {
form: {
token: "",
sRele: "",
},
dataSource: [],
eventArr: [],
};
},
};
</script>
<style lang="less" scoped>
.wua-outter {
width: 944px;
height: 412px;
.wua-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 479px;
height: 100%;
}
.d2 {
width: 465px;
height: 100%;
margin-left: 16px;
}
}
}
</style>

@ -0,0 +1,39 @@
<!--
* @Author: your name
* @Date: 2021-10-19 10:13:43
* @LastEditTime: 2021-10-19 10:20:06
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/wbcEc/index.vue
-->
<template>
<div class="wbcEc-outter">
</div>
</template>
<script>
export default {
name: "wbcEc",
data() {
return {
opt: {},
form: {
token: "",
sRele: "",
},
};
},
};
</script>
<style lang="less" scoped>
.wbcEc-outter {
width: 472px;
height: 412px;
.wbcEc-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,63 @@
<!--
* @Author: your name
* @Date: 2021-10-19 10:22:54
* @LastEditTime: 2021-11-08 17:46:14
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/EventComparison/wtcEc/index.vue
-->
<template>
<div class="wtcEc-outter">
</div>
</template>
<script>
export default {
name: "wtcEc",
data() {
return {
opt: {},
form: {
token: "",
sRele: "",
},
colors: [
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
eventList: [],
showData: []
};
},
};
</script>
<style lang="less" scoped>
.wtcEc-outter {
width: 472px;
height: 412px;
.wtcEc-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,89 @@
<!--
* @Author: your name
* @Date: 2021-10-16 11:36:20
* @LastEditTime: 2021-10-20 09:31:36
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/weiboUserPortrait/index.vue
-->
<template>
<div class="wup-outter">
<div class="wup-inner">
</div>
</div>
</template>
<script>
export default {
name: "wupEc",
data() {
return {
opt1: {},
opt2: {},
form: {
token: "",
sRele: "",
},
colors: [
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
showData1: [],
showData2: [],
totalData1: 0,
totalData2: 0,
eventList: []
};
},
};
</script>
<style lang="less" scoped>
.wup-outter {
width: 944px;
height: 412px;
.wup-inner {
width: 100%;
display: flex;
justify-content: flex-start;
.d1 {
width: 50%;
height: 100%;
overflow: hidden;
.d1x {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
align-items: center;
}
.dd1 {
width: 280px;
height: 280px;
}
.dd2 {
width: 160px;
height: 100%;
}
}
}
}
</style>

@ -0,0 +1,61 @@
<!--
* @Author: your name
* @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-11-10 17:16:40
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
-->
<template>
<div class="wua-outter">
<v-label-div title="跟帖ID区域分布" :showLine="false" :eStyle="{'border-style': 'none'}"> </v-label-div>
<div class="wua-inner">
<div class="d1">
<v-echarts></v-echarts>
</div>
<div class="d2">
<v-echars-map></v-echars-map>
</div>
</div>
</div>
</template>
<script>
export default {
name: "FollowPostUserActiveArea",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 3
},
opt1: {},
opt2: {},
};
},
};
</script>
<style lang="less" scoped>
.wua-outter {
width: 936px;
height: 412px;
.wua-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 479px;
height: 100%;
}
.d2 {
width: 420px;
height: 100%;
margin-left: 16px;
}
}
}
</style>

@ -0,0 +1,67 @@
<!--
* @Author: your name
* @Date: 2021-11-09 16:27:20
* @LastEditTime: 2021-11-10 14:56:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue
-->
<template>
<div class="mpua-outter">
<div class="mpua-inner">
<v-echarts></v-echarts>
</div>
</div>
</template>
<script>
export default {
name: "FollowPostUserAnalysis",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 3,
},
sex: [],
rz: [],
opt: {},
colors: [
"#3373CC",
"#54BF93",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
}
},
}
</script>
<style lang="less" scoped>
.mpua-outter {
width: 472px;
height: 412px;
.mpua-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,42 @@
<!--
* @Author: your name
* @Date: 2021-11-09 16:02:50
* @LastEditTime: 2021-11-10 16:44:33
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue
-->
<template>
<div class="mpma-outter">
</div>
</template>
<script>
export default {
name: "MainPostIDModelAnalysis",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 2,
},
zIds: [],
aIds: [],
list: [],
};
},
};
</script>
<style lang="less" scoped>
.mpma-outter {
width: 452px;
height: 412px;
.mpma-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,52 @@
<!--
* @Author: your name
* @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-11-10 17:17:17
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
-->
<template>
<div class="wua-outter">
</div>
</template>
<script>
export default {
name: "MainPostUserActiveArea",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 2
},
opt1: {},
opt2: {},
};
},
};
</script>
<style lang="less" scoped>
.wua-outter {
width: 936px;
height: 412px;
.wua-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 479px;
height: 100%;
}
.d2 {
width: 420px;
height: 100%;
margin-left: 16px;
}
}
}
</style>

@ -0,0 +1,64 @@
<!--
* @Author: your name
* @Date: 2021-11-09 16:27:20
* @LastEditTime: 2021-11-10 14:56:39
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue
-->
<template>
<div class="mpua-outter">
</div>
</template>
<script>
export default {
name: "MainPostUserAnalysis",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 2,
},
sex: [],
rz: [],
opt: {},
colors: [
"#3373CC",
"#54BF93",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
};
},
};
</script>
<style lang="less" scoped>
.mpua-outter {
width: 472px;
height: 412px;
.mpua-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,45 @@
<!--
* @Author: your name
* @Date: 2021-11-09 17:19:28
* @LastEditTime: 2021-11-10 15:58:05
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/SuspectedCarBlackID/index.vue
-->
<template>
<div class="scb-outter">
<v-label-div title="疑似车黑ID"> </v-label-div>
<div class="scb-inner">
<v-echarts></v-echarts>
</div>
</div>
</template>
<script>
export default {
name: "SuspectedCarBlackID",
data() {
return {
load: false,
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: createOpt()
}
},
}
</script>
<style lang="less" scoped>
.scb-outter {
width: 936px;
height: 460px;
border: 2px solid #0f2a4d;
.scb-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,45 @@
<!--
* @Author: your name
* @Date: 2021-11-09 17:35:06
* @LastEditTime: 2021-11-10 16:56:03
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/ThreadIDRegistrationTime/index.vue
-->
<template>
<div class="tdrt-outter">
<v-label-div title="跟帖ID注册时间"> </v-label-div>
<div class="tdrt-inner">
<v-echarts></v-echarts>
</div>
</div>
</template>
<script>
export default {
name: "ThreadIDRegistrationTime",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: {}
}
},
};
</script>
<style lang="less" scoped>
.tdrt-outter {
width: 936px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
.tdrt-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -11,19 +11,40 @@
<div class="mfd-outter">
<mfdHeader></mfdHeader>
<div class="mfd-d1">
<vue-lazy-component>
<mfdCommunicationTrend></mfdCommunicationTrend>
<mfdCommunicationTrendStoken slot="skeleton"></mfdCommunicationTrendStoken>
</vue-lazy-component>
<vue-lazy-component>
<mfdContentType></mfdContentType>
<mfdContentTypeStoken slot="skeleton"></mfdContentTypeStoken>
</vue-lazy-component>
<vue-lazy-component>
<mfdCharacters></mfdCharacters>
<mfdCharactersStoken slot="skeleton"></mfdCharactersStoken>
</vue-lazy-component>
</div>
<div class="mfd-d1">
<vue-lazy-component>
<mfdPositiveTopic></mfdPositiveTopic>
<mfdPositiveTopicStoken slot="skeleton"></mfdPositiveTopicStoken>
</vue-lazy-component>
<vue-lazy-component>
<mfdNegativeTopic></mfdNegativeTopic>
<mfdNegativeTopicStoken slot="skeleton"></mfdNegativeTopicStoken>
</vue-lazy-component>
</div>
<mfdMainPost></mfdMainPost>
<mfdFollowPost></mfdFollowPost>
<div class="mfd-d1">
<vue-lazy-component>
<SuspectedCarBlackID></SuspectedCarBlackID>
<SuspectedCarBlackIDStoken slot="skeleton"></SuspectedCarBlackIDStoken>
</vue-lazy-component>
<vue-lazy-component>
<ThreadIDRegistrationTime></ThreadIDRegistrationTime>
<ThreadIDRegistrationTimeStoken slot="skeleton"></ThreadIDRegistrationTimeStoken>
</vue-lazy-component>
</div>
</div>
</div>
@ -40,6 +61,14 @@ import mfdMainPost from "./mfdMainPost"
import mfdFollowPost from "./mfdFollowPost"
import SuspectedCarBlackID from "./SuspectedCarBlackID"
import ThreadIDRegistrationTime from "./ThreadIDRegistrationTime"
//
import mfdCommunicationTrendStoken from "./mfdCommunicationTrendStoken"
import mfdContentTypeStoken from "./mfdContentTypeStoken"
import mfdCharactersStoken from "./mfdCharactersStoken"
import mfdPositiveTopicStoken from "./mfdPositiveTopicStoken"
import mfdNegativeTopicStoken from "./mfdNegativeTopicStoken"
import SuspectedCarBlackIDStoken from "./SuspectedCarBlackIDStoken"
import ThreadIDRegistrationTimeStoken from "./ThreadIDRegistrationTimeStoken"
export default {
name: "ModelForumDetails",
components: {
@ -52,7 +81,15 @@ export default {
mfdMainPost, // ID
mfdFollowPost, // ID
SuspectedCarBlackID, // ID
ThreadIDRegistrationTime // ID
ThreadIDRegistrationTime, // ID
//
mfdCommunicationTrendStoken, //
mfdContentTypeStoken, //
mfdCharactersStoken, //
mfdPositiveTopicStoken, //
mfdNegativeTopicStoken, //
SuspectedCarBlackIDStoken, // ID
ThreadIDRegistrationTimeStoken // ID
}
};
</script>

@ -18,8 +18,23 @@
<v-echarts :opt="opt"></v-echarts>
</div>
<div class="d2">
<vue-scroll>
<v-label-ctx v-for="(item, index) in labelArr" :key="index" :label="item.key" :cont="item.value" :percentage="((item.value / total) * 100).toFixed(2) + '%'" :color="colors[index]" :eStyle="{ height: '8.54rem' }"></v-label-ctx>
<div v-if="labelArr.length<=3">
<v-label-ctx v-for="(item, index) in labelArr"
:key="index"
:label="item.key"
:cont="item.value"
:percentage="((item.value / total) * 100).toFixed(2) + '%'"
:color="colors[index]" :eStyle="{ height: '8.54rem' }">
</v-label-ctx>
</div>
<vue-scroll v-if="labelArr.length>3">
<v-label-ctx v-for="(item, index) in labelArr"
:key="index"
:label="item.key"
:cont="item.value"
:percentage="((item.value / total) * 100).toFixed(2) + '%'"
:color="colors[index]" :eStyle="{ height: '5.12rem' }">
</v-label-ctx>
</vue-scroll>
</div>
</div>

@ -0,0 +1,46 @@
<!--
* @Author: your name
* @Date: 2021-10-14 10:11:41
* @LastEditTime: 2021-11-10 10:40:17
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboCommunicationTrend/index.vue
-->
<template>
<div class="wct-outter">
<v-label-div title="论坛传播趋势">
</v-label-div>
<div class="wct-inner">
<v-echarts></v-echarts>
</div>
</div>
</template>
<script>
export default {
name: "mfdCommunicationTrend",
data() {
return {
load: false,
form: {
sBrand: "",
token: "",
sSeriesName: ""
},
opt: createOpt()
}
},
};
</script>
<style lang="less" scoped>
.wct-outter {
width: 618px;
height: 460px;
border: 2px solid #0f2a4d;
.wct-inner {
width: 100%;
height: calc(100% - 48px);
}
}
</style>

@ -0,0 +1,58 @@
<!--
* @Author: your name
* @Date: 2021-10-14 10:24:56
* @LastEditTime: 2021-11-10 10:53:19
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboContentType/index.vue
-->
<template>
<div class="wct-outter">
</div>
</template>
<script>
export default {
name: "mfdContentType",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
labelArr: [],
total: 0,
opt: createOpt(),
colors: [
"#3373CC",
"#54BF93",
"#CC9D12",
],
};
},
};
</script>
<style lang="less" scoped>
.wct-outter {
width: 618px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
overflow: hidden;
.wct-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 280px;
height: 100%;
}
.d2 {
width: 300px;
margin-left: 16px;
}
}
}
</style>

@ -10,9 +10,18 @@
<div class="mmp-outter">
<v-label-div title="跟帖ID"> </v-label-div>
<div class="mmp-inner">
<vue-lazy-component>
<FollowPostIDModelAnalysis></FollowPostIDModelAnalysis>
<FollowPostIDModelAnalysisStoken slot="skeleton"></FollowPostIDModelAnalysisStoken>
</vue-lazy-component>
<vue-lazy-component>
<FollowPostUserAnalysis></FollowPostUserAnalysis>
<FollowPostUserAnalysisStoken slot="skeleton"></FollowPostUserAnalysisStoken>
</vue-lazy-component>
<vue-lazy-component>
<FollowPostUserActiveArea></FollowPostUserActiveArea>
<FollowPostUserActiveAreaStoken slot="skeleton"></FollowPostUserActiveAreaStoken>
</vue-lazy-component>
</div>
</div>
</template>
@ -21,13 +30,20 @@
import FollowPostIDModelAnalysis from "../FollowPostIDModelAnalysis"
import FollowPostUserAnalysis from "../FollowPostUserAnalysis"
import FollowPostUserActiveArea from "../FollowPostUserActiveArea"
//
import FollowPostIDModelAnalysisStoken from "../FollowPostIDModelAnalysisStoken"
import FollowPostUserAnalysisStoken from "../FollowPostUserAnalysisStoken"
import FollowPostUserActiveAreaStoken from "../FollowPostUserActiveAreaStoken"
export default {
name: "mfdFollowPost",
components: {
FollowPostIDModelAnalysis, // ID
FollowPostUserAnalysis, //
FollowPostUserActiveArea
FollowPostUserActiveArea,
//
FollowPostIDModelAnalysisStoken, // ID
FollowPostUserAnalysisStoken, //
FollowPostUserActiveAreaStoken,
}
}
</script>

@ -10,9 +10,18 @@
<div class="mmp-outter">
<v-label-div title="主帖ID"> </v-label-div>
<div class="mmp-inner">
<vue-lazy-component>
<MainPostIDModelAnalysis></MainPostIDModelAnalysis>
<MainPostIDModelAnalysisStoken slot="skeleton"></MainPostIDModelAnalysisStoken>
</vue-lazy-component>
<vue-lazy-component>
<MainPostUserAnalysis></MainPostUserAnalysis>
<MainPostUserAnalysisStoken slot="skeleton"></MainPostUserAnalysisStoken>
</vue-lazy-component>
<vue-lazy-component>
<MainPostUserActiveArea></MainPostUserActiveArea>
<MainPostUserActiveAreaStoken slot="skeleton"></MainPostUserActiveAreaStoken>
</vue-lazy-component>
</div>
</div>
</template>
@ -21,13 +30,20 @@
import MainPostIDModelAnalysis from "../MainPostIDModelAnalysis"
import MainPostUserAnalysis from "../MainPostUserAnalysis"
import MainPostUserActiveArea from "../MainPostUserActiveArea"
//
import MainPostIDModelAnalysisStoken from "../MainPostIDModelAnalysisStoken"
import MainPostUserAnalysisStoken from "../MainPostUserAnalysisStoken"
import MainPostUserActiveAreaStoken from "../MainPostUserActiveAreaStoken"
export default {
name: "mfdMainPost",
components: {
MainPostIDModelAnalysis, // ID
MainPostUserAnalysis, //
MainPostUserActiveArea
MainPostUserActiveArea,
//
MainPostIDModelAnalysisStoken, // ID
MainPostUserAnalysisStoken, //
MainPostUserActiveAreaStoken,
}
}
</script>

@ -0,0 +1,52 @@
<!--
* @Author: your name
* @Date: 2021-11-09 15:03:36
* @LastEditTime: 2021-11-10 13:55:27
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue
-->
<template>
<div class="mpt-outter">
</div>
</template>
<script>
export default {
name: "mfdNegativeTopic",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: {},
config: {},
};
},
};
</script>
<style lang="less" scoped>
.mpt-outter {
width: 936px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
.mpt-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 450px;
height: 100%;
}
.d2 {
width: 485px;
height: 100%;
}
}
}
</style>

@ -0,0 +1,51 @@
<!--
* @Author: your name
* @Date: 2021-11-09 15:03:36
* @LastEditTime: 2021-11-10 15:23:05
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue
-->
<template>
<div class="mpt-outter">
</div>
</template>
<script>
export default {
name: "mfdPositiveTopic",
data() {
return {
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: {},
config: {},
};
},
};
</script>
<style lang="less" scoped>
.mpt-outter {
width: 936px;
height: 460px;
border: 2px solid #0f2a4d;
.mpt-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.d1 {
width: 450px;
height: 100%;
}
.d2 {
width: 485px;
height: 100%;
}
}
}
</style>

@ -54,10 +54,10 @@
<ml-weibo-portraits :brand="brand" :model="model"></ml-weibo-portraits>
<mlWeiboPortraitsStoken slot="skeleton"></mlWeiboPortraitsStoken>
</vue-lazy-component>
<vue-lazy-component>
<!-- <vue-lazy-component> -->
<ml-weibo-volume-trend :brand="brand" :model="model"></ml-weibo-volume-trend>
<mlWeiboVolumeTrendStoken slot="skeleton"></mlWeiboVolumeTrendStoken>
</vue-lazy-component>
<!-- <mlWeiboVolumeTrendStoken slot="skeleton"></mlWeiboVolumeTrendStoken>
</vue-lazy-component> -->
</div>
</div>
<div class="bdl-d4">
@ -65,10 +65,10 @@
<v-btn @click="goRouter('/modelForumDetails')"></v-btn>
</v-label-div>
<div class="bdl-d4-bd">
<vue-lazy-component>
<!-- <vue-lazy-component> -->
<mlForumCommunicationTrend :brand="brand" :model="model"></mlForumCommunicationTrend>
<mlForumCommunicationTrendStoken slot="skeleton"></mlForumCommunicationTrendStoken>
</vue-lazy-component>
<!-- <mlForumCommunicationTrendStoken slot="skeleton"></mlForumCommunicationTrendStoken>
</vue-lazy-component> -->
<vue-lazy-component>
<mlForumHotTopicDirection :brand="brand" :model="model"></mlForumHotTopicDirection>
<mlForumHotTopicDirectionStoken slot="skeleton"></mlForumHotTopicDirectionStoken>
@ -84,12 +84,18 @@
<v-btn @click="goRouter('/modelTailDetails')"></v-btn>
</v-label-div>
<div class="bdl-d5-bd">
<!-- <vue-lazy-component> -->
<mlRearWingPropagationSituation :brand="brand" :model="model"></mlRearWingPropagationSituation>
<mlRearWingPropagationSituationStoken slot="skeleton"></mlRearWingPropagationSituationStoken>
<!-- <mlRearWingPropagationSituationStoken slot="skeleton"></mlRearWingPropagationSituationStoken>
</vue-lazy-component> -->
<vue-lazy-component>
<mlKeyMedia :brand="brand" :model="model"></mlKeyMedia>
<mlKeyMediaStoken slot="skeleton"></mlKeyMediaStoken>
</vue-lazy-component>
<vue-lazy-component>
<mlPopularwordCloud :brand="brand" :model="model"></mlPopularwordCloud>
<mlPopularwordCloudStoken slot="skeleton"></mlPopularwordCloudStoken>
</vue-lazy-component>
</div>
</div>
</div>

@ -14,9 +14,9 @@
<v-echarts :opt="opt"></v-echarts>
</div>
<div class="wp-in-d2">
<vue-scroll>
<v-label-ctx v-for="(item,index) in labelData" :key="index" :label="item.key" :cont="item.value" :percentage="(item.value/totalData*100).toFixed(2) +'%'" :color="item.color" :eStyle="{ height: '7.6rem' }"></v-label-ctx>
</vue-scroll>
</div>
</div>
</div>

@ -14,9 +14,9 @@
<v-echarts :opt="opt"></v-echarts>
</div>
<div class="wp-in-d2">
<vue-scroll>
<v-label-ctx v-for="(item,index) in labelData" :key="index" :label="item.name" :cont="item.value" :percentage="(item.value/totalData*100).toFixed(2) +'%'" :color="colors[index]" :eStyle="{ height: '7.6rem' }"></v-label-ctx>
</vue-scroll>
</div>
</div>
</div>

Loading…
Cancel
Save