Merge branch 'dev'

prod
校文 3 years ago
commit c67752801e

@ -120,7 +120,6 @@ export default {
},
//
roundDefaultSelect(myChart) {
console.log(myChart)
if (!myChart.getOption().series[0] || myChart.getOption().series[0].type != "pie") {
return;
}

@ -15,27 +15,8 @@ const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}
import Index from "@/views/Index"
import Myself from "@/views/Myself"
import IndustryDataExport from "@/views/IndustryDataExport"
import BrandInsight from "@/views/BrandInsight"
import EventDetails from "@/views/EventDetails"
import iLayout from "@/lycomponents/iLayout"
import ForumDetails from "@/views/ForumDetails"
import TailInsightDetails from "@/views/TailInsightDetails"
import WeiboDetails from "@/views/WeiboDetails"
import brandComparisonIndex from "@/views/BrandComparison"
import EventInsight from "@/views/EventInsight"
import EventComparison from "@/views/EventComparison"
import Login from "@/views/Login"
import EventDEC from "@/views/EventDEC"
import MarketingAnalysis from "@/views/MarketingAnalysis"
import ModelInsight from "@/views/ModelInsight"
import mcIndex from "@/views/MarketingComparison"
import ModelTailDetails from "@/views/ModelTailDetails"
import ModelEventDetails from "@/views/ModelEventDetails"
import ModelWeiboDetails from "@/views/ModelWeiboDetails"
import ModelForumDetails from "@/views/ModelForumDetails"
import ModelComparison from "@/views/ModelComparison"
import SaleRank from "@/views/SaleRank"
// 销量排行
@ -44,12 +25,6 @@ import ThemeData from "@/views/ThemeData"
import ThemeBoard from "@/views/ThemeBoard"
import ThemeComparison from "@/views/ThemeComparison"
import iSwitchEvent from "@/lycomponents/iSwitchEvent"
// 重点媒体
import KeyMediaBrand from "@/views/KeyMediaBrand"
import KeyMediaSeries from "@/views/KeyMediaSeries"
import KeyMediaEvent from "@/views/KeyMediaEvent"
import KeyMediaTheme from "@/views/KeyMediaTheme"
import KeyMediaHome from "@/views/KeyMediaHome"
const router = [
{
path: '/login',
@ -59,146 +34,146 @@ const router = [
{
path: "/",
name: "iLayout",
component: iLayout,
component: resolve => require(["@/lycomponents/iLayout"], resolve),
redirect: '/index',
children: [
{
path: "/index",
name: "index",
desc: "行业洞察",
component: Index
component: resolve => require(["@/views/Index"], resolve),
},
{
path: "/keyMediaHome",
name: "keyMediaHome",
desc: "行业洞察",
component: KeyMediaHome
desc: "行业洞察-重点媒体",
component: resolve => require(["@/views/KeyMediaHome"], resolve),
},
{
path: "/myself",
name: "myself",
desc: "个人中心",
component: Myself
component: resolve => require(["@/views/Myself"], resolve),
},
{
path: '/industryDataExport',
name: "industryDataExport",
desc: "行业数据",
component: IndustryDataExport
component: resolve => require(["@/views/IndustryDataExport"], resolve),
},
{
path: '/brandInsight',
name: "brandInsight",
desc: "品牌洞察",
component: BrandInsight
component: resolve => require(["@/views/BrandInsight"], resolve),
},
{
path: '/eventDetails',
name: "eventDetails",
desc: "品牌洞察-事件详情",
component: EventDetails
component: resolve => require(["@/views/EventDetails"], resolve),
},
{
path: '/forumDetails',
name: "forumDetails",
desc: "品牌洞察-论坛详情",
component: ForumDetails
component: resolve => require(["@/views/ForumDetails"], resolve),
},
{
path: '/tailInsightDetails',
name: "tailInsightDetails",
desc: "品牌洞察-尾翼详情",
component: TailInsightDetails
component: resolve => require(["@/views/TailInsightDetails"], resolve),
},
{
path: '/weiboDetails',
name: "weiboDetails",
desc: "品牌洞察-微博详情",
component: WeiboDetails
component: resolve => require(["@/views/WeiboDetails"], resolve),
},
{
path: '/keyMediaBrand',
name: "keyMediaBrand",
desc: "品牌洞察-重点媒体",
component: KeyMediaBrand
component: resolve => require(["@/views/KeyMediaBrand"], resolve),
},
{
path: '/brandComparisonIndex',
name: "brandComparisonIndex",
desc: "品牌洞察-品牌对比",
component: brandComparisonIndex
component: resolve => require(["@/views/BrandComparison"], resolve),
},
{
path: '/eventInsight',
name: "eventInsight",
desc: "事件洞察",
component: EventInsight
component: resolve => require(["@/views/EventInsight"], resolve),
},
{
path: '/iSwitchEvent',
name: "iSwitchEvent",
desc: "事件洞察-切换事件",
component: iSwitchEvent
component: resolve => require(["@/lycomponents/iSwitchEvent"], resolve),
},
{
path: '/eventComparison',
name: "eventComparison",
desc: "事件洞察-事件对比",
component: EventComparison
component: resolve => require(["@/views/EventComparison"], resolve),
},
{
path: '/eventDEC',
name: "eventDEC",
desc: "事件洞察-事件详情",
component: EventDEC
component: resolve => require(["@/views/EventDEC"], resolve),
},
{
path: '/keyMediaEvent',
name: "keyMediaEvent",
desc: "事件洞察-重点媒体",
component: KeyMediaEvent
component: resolve => require(["@/views/KeyMediaEvent"], resolve),
},
{
path: '/marketingAnalysis',
name: "marketingAnalysis",
desc: "营销分析",
component: MarketingAnalysis
component: resolve => require(["@/views/MarketingAnalysis"], resolve),
},
{
path: '/modelInsight',
name: "modelInsight",
desc: "车型洞察",
component: ModelInsight
component: resolve => require(["@/views/ModelInsight"], resolve),
},
{
path: '/modelEventDetails',
name: "modelEventDetails",
desc: "车型事件详情",
component: ModelEventDetails
component: resolve => require(["@/views/ModelEventDetails"], resolve),
},
{
path: '/modelForumDetails',
name: "modelForumDetails",
desc: "车型论坛详情",
component: ModelForumDetails
component: resolve => require(["@/views/ModelForumDetails"], resolve),
},
{
path: '/modelWeiboDetails',
name: "modelWeiboDetails",
desc: "车型微博详情",
component: ModelWeiboDetails
component: resolve => require(["@/views/ModelWeiboDetails"], resolve),
},
{
path: '/modelTailDetails',
name: "modelTailDetails",
desc: "车型尾翼详情",
component: ModelTailDetails
component: resolve => require(["@/views/ModelTailDetails"], resolve),
},
{
path: '/keyMediaSeries',
name: "keyMediaSeries",
desc: "车型洞察-重点媒体",
component: KeyMediaSeries
component: resolve => require(["@/views/KeyMediaSeries"], resolve),
},
{
path: '/modelComparison',
@ -217,7 +192,7 @@ const router = [
name: "saleRank",
desc: "销量排行",
redirect: 'saleRank/main',
component: SaleRank,
component: resolve => require(["@/views/SaleRank"], resolve),
children: [
{
path: 'main', //汽车销量排行榜
@ -396,25 +371,25 @@ const router = [
path: '/ThemeAnalize',
name: "ThemeAnalize",
desc: "主题分析",
component: ThemeAnalize
component: resolve => require(["@/views/ThemeAnalize"], resolve),
},
{
path: '/ThemeData',
name: "ThemeData",
desc: "主题数据",
component: ThemeData
component: resolve => require(["@/views/ThemeData"], resolve),
},
{
path: '/ThemeBoard',
name: "ThemeBoard",
desc: "数据看板",
component: ThemeBoard
component: resolve => require(["@/views/ThemeBoard"], resolve),
},
{
path: '/keyMediaTheme',
name: "KeyMediaTheme",
desc: "重点媒体-主题",
component: KeyMediaTheme
component: resolve => require(["@/views/KeyMediaTheme"], resolve),
},
{
path: '/ThemeComparison',

@ -21,7 +21,9 @@ const getters = {
},
getAccount(state) {
//这里写解密算法
state.account.sPwd = window.atob(state.account.sPwd);
if(state.account.sPwd) {
state.account.sPwd = window.atob(state.account.sPwd);
}
return state.account
},
getCommTime(state) {

@ -27,7 +27,9 @@ const mutations = {
},
setAccount: (state, log) => {
state.account = log;
state.account.sPwd = window.btoa(state.account.sPwd);
if(state.account.sPwd) {
state.account.sPwd = window.btoa(state.account.sPwd);
}
let str = JSON.stringify(log);
localStorage.setItem('account', str);
},

@ -66,26 +66,28 @@
</div>
</div>
</div>
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component>
<weibo-communication-trend-long></weibo-communication-trend-long>
<weiboCommunicationTrendLongStoken slot="skeleton"></weiboCommunicationTrendLongStoken>
<weibo-communication-trend></weibo-communication-trend>
<weiboCommunicationTrendStoken slot="skeleton"></weiboCommunicationTrendStoken>
</vue-lazy-component>
<spreadTOPmodels></spreadTOPmodels>
</div>
<div class="wd-d2" v-else>
<vue-lazy-component>
<weibo-communication-trend></weibo-communication-trend>
<weiboCommunicationTrendStoken slot="skeleton"></weiboCommunicationTrendStoken>
<weibo-communication-trend-long></weibo-communication-trend-long>
<weiboCommunicationTrendLongStoken slot="skeleton"></weiboCommunicationTrendLongStoken>
</vue-lazy-component>
</div>
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)"></div>
<div class="wd-d3" v-else>
<!-- <subscribeSeries></subscribeSeries> -->
<spreadTOPmodels></spreadTOPmodels>
<vue-lazy-component>
<weiboContentTOPVolume></weiboContentTOPVolume>
<weiboContentTOPVolumeStoken slot="skeleton"></weiboContentTOPVolumeStoken>
</vue-lazy-component>
</div>
<div class="wd-d3">
<subscribeSeries></subscribeSeries>
<spreadTOPmodels></spreadTOPmodels>
</div>
<div class="wd-d4">
<vue-lazy-component>
<weiboContentType></weiboContentType>
@ -100,8 +102,8 @@
<weiboWordCloudStoken slot="skeleton"></weiboWordCloudStoken>
</vue-lazy-component>
</div>
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1)">
<div class="wd-d3" v-if="form.sSource == '新浪微博' || form.sSource == '汽车之家' || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || form.sSource == '汽车之家'">
<weiboUserActiveArea></weiboUserActiveArea>
<weiboUserActiveAreaStoken slot="skeleton"></weiboUserActiveAreaStoken>
</vue-lazy-component>

@ -8,7 +8,7 @@
-->
<template>
<div class="stm-outter" v-loading="load">
<v-label-div title="传播声量TOP车型" :showLine="false" :eStyle="{'border-style': 'none'}"></v-label-div>
<v-label-div title="传播声量TOP车型" :eStyle="{'border-style': 'none'}"></v-label-div>
<div class="stm-inner">
<v-echarts :opt="opt" @getData="clickEchars"></v-echarts>
</div>
@ -71,7 +71,7 @@ export default {
<style lang="less" scoped>
.stm-outter {
width: 936px;
height: 412px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
.stm-inner {

@ -7,14 +7,45 @@
* @FilePath: /data-show/src/views/WeiboDetails/weiboContentTOPVolume/index.vue
-->
<template>
<div class="wct-outter" v-loading="load">
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<div class="wct-d1" v-for="(item,index) in list" :key="index">
<v-echarts :opt="item.opt"></v-echarts>
<div class="wct-d1-dd1">
<span>排名<span class="ss1">0{{index+1}}</span></span>
<span>声量<span class="ss1">{{item.value}}</span></span>
<div>
<div class="d22" v-if="(form.sSource == '汽车之家') || (form.sSource == '懂车帝')">
<div class="wct-small-outter">
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<vue-scroll>
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d4" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</vue-scroll>
</div>
</div>
<div class="wct-small-outter">
<v-label-div title="关注TOP车型"> </v-label-div>
<div class="wct-inner">
<vue-scroll>
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d3" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</vue-scroll>
</div>
</div>
</div>
<div class="wct-outter" v-loading="load" v-else>
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<div class="dd2">
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d1" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
<div class="rank1" style="margin-left: 14px">
<v-ranking-kmd v-for="(item,index) in d2" :key="index" :lineShow="index === 0 ? false : true" :num="index + 6" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</div>
</div>
</div>
@ -23,10 +54,14 @@
<script>
import {comparePig} from "@/utils/gol/dataTool"
import createOpt from "./opt"
import {getGuanZhuSeriesname} from "@/api/KeyMediaBrand/index.js"
import vRankingKmd from "./v-ranking-kmd"
import {getDirectWeiBo0528} from "@/api/KeyMediaBrand/index.js"
export default {
name: "weiboContentTOPVolume",
components: {
vRankingKmd
},
data() {
return {
load: false,
@ -36,6 +71,10 @@ export default {
sSource: '',
ilimitType: 0,
},
d1: [],
d2: [],
d3: [],
d4: [],
list: [],
colors: ['#3373CC', '#63AECC', '#54BF93', '#CC9D12', '#3373CC', '#63AECC', '#54BF93', '#CC9D12']
};
@ -57,31 +96,63 @@ export default {
let obj = Object.assign({}, this.getCtime2, this.form);
getDirectWeiBo0528(obj).then(res => {
let data = res.data || [];
let arr = [];
data.sort(comparePig('value'));
let maxVal = data[0].value
data.forEach((ele,index) => {
let obj = {
value: ele.value,
opt: createOpt(ele.key,this.colors[index],ele.value, maxVal)
}
arr.push(obj)
let mediaList = [];
data.forEach(ele => {
let obj = { label: ele.key, val: ele.value};
mediaList.push(obj);
})
this.list = arr;
this.d1 = mediaList.slice(0, 5);
this.d2 = mediaList.slice(5, 10);
this.d4 = mediaList;
// let arr = [];
// data.sort(comparePig('value'));
// let maxVal = data[0].value
// data.forEach((ele,index) => {
// let obj = {
// value: ele.value,
// opt: createOpt(ele.key,this.colors[index],ele.value, maxVal)
// }
// arr.push(obj)
// })
// this.list = arr;
this.load = false;
});
getGuanZhuSeriesname(obj).then(res => {
let data = res.data || [];
let arr = [];
for(let key in data) {
let obj = {label: key, val: data[key]};
arr.push(obj)
}
this.d3 = arr
})
}
}
}
</script>
<style lang="less" scoped>
.d22 {
width: 100%;
height: auto;
display: flex;
justify-content: flex-start;
}
.wct-outter {
width: 936px;
height: 412px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
overflow: hidden;
}
.wct-small-outter {
width: 460px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
overflow: hidden;
padding-bottom: 24px;
}
.wct-inner {
width: 100%;

@ -1,81 +0,0 @@
/*
* @Author: your name
* @Date: 2021-10-14 16:05:12
* @LastEditTime: 2021-11-04 17:05:41
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboContentTOPVolume/opt.js
* startAngle: 180,
*/
import * as echarts from "echarts";
export default function createOpt(name, color, num, maxVal) {
return {
tooltip: {
backgroundColor: "#08182F",
color: "#fff",
borderColor: "#3373CC",
textStyle: {
color: "#fff", //设置文字颜色
},
extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
formatter: function(param) {
let value = param.data.value;
let name = param.data.name;
return `<span>${name}</span><br><span>声量:${value}</span>`
}
},
series: [
{
name: name,
type: 'gauge',
startAngle: 180,
endAngle: 0,
min: 0,
max: maxVal * 5,
splitNumber: 5,
detail: { show: false, formatter: '{value}%' },
axisLine: {
show: true,
lineStyle: {
width: 7,
color: [
[1, new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{
offset: 0,
color: "#020f1f"
},
{
offset: 1,
color: color
}
])
]
]
}
},
axisLabel: {
distance: -30,
color: "#d8d8d8",
},
splitLine: {
distance: -6,
length: 12,
lineStyle: {
color: '#d8d8d8',
width: 2
}
},
// 刻度线
axisTick: {
show: true,
length: 15,
lineStyle: {
color: "auto",
width: 5
}
},
data: [{ value: num, name: name, title: {show: true, color: color,fontWeight: 'bold'},itemStyle:{color: color}}],
}
]
};
}

@ -0,0 +1,236 @@
<!--
* @Author: your name
* @Date: 2021-10-08 16:44:08
* @LastEditTime: 2021-11-18 11:57:14
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/components/v-ranking/index.vue
-->
<template>
<div class="v-r-container">
<div class="v-r-line" v-if="lineShow"></div>
<div class="v-r-inner">
<div :class="ls">
<span class="s1">{{ num|numStr }}</span>
</div>
<div :class="rs">
<span @click="goKeyMedia(label)" class="v-r-label">{{label}}</span>
<div class="v-r-res">
<span class="s1">传播量</span>
<span class="s2">{{val}}</span>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "v-ranking-kmd",
props: {
num: {
type: [String, Number],
default: 1,
},
val: {
type: [String, Number],
default: 0
},
label: {
type: String,
default: ""
},
lineShow: {
type: Boolean,
default: true
},
},
watch: {
num: {
handler(val) {
if(val == 1) {
this.ls = "v-r-left-1"
this.rs = "v-r-right-1"
} else if(val == 2) {
this.ls = "v-r-left-2"
this.rs = "v-r-right-2"
} else if(val == 3) {
this.ls = "v-r-left-3"
this.rs = "v-r-right-3"
} else {
this.ls = "v-r-left"
this.rs = "v-r-right"
}
},
immediate: true
}
},
data() {
return {
ls: "v-r-left",
rs: "v-r-right"
}
},
filters: {
numStr(val) {
let str = ""
if(0<val && val<10) {
str = '0' + val
} else {
str = val + ''
}
return str
}
},
methods: {
goKeyMedia(obj) {
this.$emit('toMedia', obj)
}
}
};
</script>
<style lang="less" scoped>
.v-r-container {
width: 430px;
height: auto;
.v-r-line {
width: 100%;
height: 1px;
background:#0a1d3b;
margin-top: 13px;
margin-bottom: 13px;
}
.v-r-inner {
position: relative;
width: 100%;
height: 48px;
margin-top: 6px;
color: #fff;
background: #0a1d3b;
border-radius: 2px;
}
.v-r-label {
display: block;
font-size: 14px;
color: #FFFFFF;
margin-left: 40px;
font-weight: bold;
cursor: pointer;
}
.v-r-res {
margin-right: 16px;
span {
display: block;
text-align: right;
font-size: 12px;
}
.s1 {
color: #9ba4af;
}
.s2 {
color: #fff;
font-family: Bebas;
}
}
.v-r-left {
width: 48px;
height: 48px;
text-align: center;
line-height: 48px;
.s1 {
color: #9099a6;
font-size: 16px;
line-height: 48px;
font-family: Bebas;
}
}
.v-r-right {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid transparent;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-1 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #cc9d12;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #cc9d12;
font-family: Bebas;
}
}
.v-r-right-1 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #CC9D12;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-2 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #3373CC;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #3373CC;
font-family: Bebas;
}
}
.v-r-right-2 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #3373CC;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-3 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #54BF93;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #54BF93;
font-family: Bebas;
}
}
.v-r-right-3 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #54BF93;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
}
</style>

@ -66,7 +66,7 @@
</div>
</div>
</div>
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component>
<weibo-communication-trend-long></weibo-communication-trend-long>
<weiboCommunicationTrendLongStoken slot="skeleton"></weiboCommunicationTrendLongStoken>
@ -96,8 +96,8 @@
<weiboWordCloudStoken slot="skeleton"></weiboWordCloudStoken>
</vue-lazy-component>
</div>
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1)">
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家')">
<weiboUserActiveArea></weiboUserActiveArea>
<weiboUserActiveAreaStoken slot="skeleton"></weiboUserActiveAreaStoken>
</vue-lazy-component>

@ -66,7 +66,7 @@
</div>
</div>
</div>
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component>
<weibo-communication-trend-long></weibo-communication-trend-long>
<weiboCommunicationTrendLongStoken slot="skeleton"></weiboCommunicationTrendLongStoken>
@ -101,8 +101,8 @@
<weiboWordCloudStoken slot="skeleton"></weiboWordCloudStoken>
</vue-lazy-component>
</div>
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1)">
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家')">
<weiboUserActiveArea></weiboUserActiveArea>
<weiboUserActiveAreaStoken slot="skeleton"></weiboUserActiveAreaStoken>
</vue-lazy-component>

@ -7,14 +7,45 @@
* @FilePath: /data-show/src/views/WeiboDetails/weiboContentTOPVolume/index.vue
-->
<template>
<div class="wct-outter" v-loading="load">
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<div class="wct-d1" v-for="(item, index) in list" :key="index">
<v-echarts :opt="item.opt"></v-echarts>
<div class="wct-d1-dd1">
<span>排名<span class="ss1">0{{ index + 1 }}</span></span>
<span>声量<span class="ss1">{{ item.value }}</span></span>
<div>
<div class="d22" v-if="(form.sSource == '汽车之家') || (form.sSource == '懂车帝')">
<div class="wct-small-outter">
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<vue-scroll>
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d4" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</vue-scroll>
</div>
</div>
<div class="wct-small-outter">
<v-label-div title="关注TOP车型"> </v-label-div>
<div class="wct-inner">
<vue-scroll>
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d3" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</vue-scroll>
</div>
</div>
</div>
<div class="wct-outter" v-loading="load" v-else>
<v-label-div title="内容TOP声量"> </v-label-div>
<div class="wct-inner">
<div class="dd2">
<div class="d-rank" style="margin-left: 16px">
<div class="rank1">
<v-ranking-kmd v-for="(item,index) in d1" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
<div class="rank1" style="margin-left: 14px">
<v-ranking-kmd v-for="(item,index) in d2" :key="index" :lineShow="index === 0 ? false : true" :num="index + 6" :label="item.label|doStr(8)" :val="item.val" @toMedia="toKeyMedia(item)"></v-ranking-kmd>
</div>
</div>
</div>
</div>
</div>
@ -23,10 +54,14 @@
<script>
import { comparePig } from "@/utils/gol/dataTool"
import createOpt from "./opt"
import vRankingKmd from "./v-ranking-kmd"
import { getHomeDirectWeiBo0528 } from "@/api/KeyMediaHome/index.js"
import {getHomeGuanZhuSeriesname} from "@/api/KeyMediaHome/index.js"
export default {
name: "weiboContentTOPVolume",
components: {
vRankingKmd
},
data() {
return {
load: false,
@ -34,6 +69,10 @@ export default {
sSource: '',
ilimitType: 0,
},
d1: [],
d2: [],
d3: [],
d4: [],
list: [],
colors: ['#3373CC', '#63AECC', '#54BF93', '#CC9D12', '#3373CC', '#63AECC', '#54BF93', '#CC9D12']
};
@ -53,25 +92,38 @@ export default {
let obj = Object.assign({}, this.getCtime2, this.form);
getHomeDirectWeiBo0528(obj).then(res => {
let data = res.data || [];
let arr = [];
data.sort(comparePig('value'));
let maxVal = data[0].value
data.forEach((ele, index) => {
let obj = {
value: ele.value,
opt: createOpt(ele.key, this.colors[index], ele.value, maxVal)
}
arr.push(obj)
let mediaList = [];
data.forEach(ele => {
let obj = { label: ele.key, val: ele.value};
mediaList.push(obj);
})
this.list = arr;
this.d1 = mediaList.slice(0, 5);
this.d2 = mediaList.slice(5, 10);
this.d4 = mediaList;
this.load = false;
});
getHomeGuanZhuSeriesname(obj).then(res => {
let data = res.data || [];
let arr = [];
for(let key in data) {
let obj = {label: key, val: data[key]};
arr.push(obj)
}
this.d3 = arr
})
}
}
}
</script>
<style lang="less" scoped>
.d22 {
width: 100%;
height: auto;
display: flex;
justify-content: flex-start;
}
.wct-outter {
width: 936px;
height: 460px;
@ -79,7 +131,14 @@ export default {
margin-left: 16px;
overflow: hidden;
}
.wct-small-outter {
width: 460px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
overflow: hidden;
padding-bottom: 24px;
}
.wct-inner {
width: 100%;
margin-top: 16px;

@ -0,0 +1,236 @@
<!--
* @Author: your name
* @Date: 2021-10-08 16:44:08
* @LastEditTime: 2021-11-18 11:57:14
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/components/v-ranking/index.vue
-->
<template>
<div class="v-r-container">
<div class="v-r-line" v-if="lineShow"></div>
<div class="v-r-inner">
<div :class="ls">
<span class="s1">{{ num|numStr }}</span>
</div>
<div :class="rs">
<span @click="goKeyMedia(label)" class="v-r-label">{{label}}</span>
<div class="v-r-res">
<span class="s1">传播量</span>
<span class="s2">{{val}}</span>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "v-ranking-kmd",
props: {
num: {
type: [String, Number],
default: 1,
},
val: {
type: [String, Number],
default: 0
},
label: {
type: String,
default: ""
},
lineShow: {
type: Boolean,
default: true
},
},
watch: {
num: {
handler(val) {
if(val == 1) {
this.ls = "v-r-left-1"
this.rs = "v-r-right-1"
} else if(val == 2) {
this.ls = "v-r-left-2"
this.rs = "v-r-right-2"
} else if(val == 3) {
this.ls = "v-r-left-3"
this.rs = "v-r-right-3"
} else {
this.ls = "v-r-left"
this.rs = "v-r-right"
}
},
immediate: true
}
},
data() {
return {
ls: "v-r-left",
rs: "v-r-right"
}
},
filters: {
numStr(val) {
let str = ""
if(0<val && val<10) {
str = '0' + val
} else {
str = val + ''
}
return str
}
},
methods: {
goKeyMedia(obj) {
this.$emit('toMedia', obj)
}
}
};
</script>
<style lang="less" scoped>
.v-r-container {
width: 430px;
height: auto;
.v-r-line {
width: 100%;
height: 1px;
background:#0a1d3b;
margin-top: 13px;
margin-bottom: 13px;
}
.v-r-inner {
position: relative;
width: 100%;
height: 48px;
margin-top: 6px;
color: #fff;
background: #0a1d3b;
border-radius: 2px;
}
.v-r-label {
display: block;
font-size: 14px;
color: #FFFFFF;
margin-left: 40px;
font-weight: bold;
cursor: pointer;
}
.v-r-res {
margin-right: 16px;
span {
display: block;
text-align: right;
font-size: 12px;
}
.s1 {
color: #9ba4af;
}
.s2 {
color: #fff;
font-family: Bebas;
}
}
.v-r-left {
width: 48px;
height: 48px;
text-align: center;
line-height: 48px;
.s1 {
color: #9099a6;
font-size: 16px;
line-height: 48px;
font-family: Bebas;
}
}
.v-r-right {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid transparent;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-1 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #cc9d12;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #cc9d12;
font-family: Bebas;
}
}
.v-r-right-1 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #CC9D12;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-2 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #3373CC;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #3373CC;
font-family: Bebas;
}
}
.v-r-right-2 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #3373CC;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.v-r-left-3 {
width: 48px;
height: 48px;
text-align: center;
border: 2px solid #54BF93;
border-radius: 48px;
.s1 {
color: #ffffff;
font-size: 16px;
line-height: 42px;
text-shadow: 0px 0px 8px #54BF93;
font-family: Bebas;
}
}
.v-r-right-3 {
position: absolute;
width: 404px;
height: 48px;
border-top: 2px solid #54BF93;
top: 0px;
left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
}
</style>

@ -66,7 +66,7 @@
</div>
</div>
</div>
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<div class="wd-d2" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component>
<weibo-communication-trend-long></weibo-communication-trend-long>
<weiboCommunicationTrendLongStoken slot="skeleton"></weiboCommunicationTrendLongStoken>
@ -96,8 +96,8 @@
<weiboWordCloudStoken slot="skeleton"></weiboWordCloudStoken>
</vue-lazy-component>
</div>
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1) || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家' && this.getCarCircle == 1)">
<div class="wd-d3" v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家') || (form.sSource == '懂车帝' && getCarCircle == 1)">
<vue-lazy-component v-if="form.sSource == '新浪微博' || (form.sSource == '汽车之家')">
<weiboUserActiveArea></weiboUserActiveArea>
<weiboUserActiveAreaStoken slot="skeleton"></weiboUserActiveAreaStoken>
</vue-lazy-component>

@ -53,11 +53,11 @@
<img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_qrpl.png" />
<div class="mfdh-data">
<span class="s1">{{replyCount}}</span>
<span class="s2">品牌千人发帖</span>
<span class="s2">品牌千人评论</span>
</div>
<div class="mfdh-data">
<span class="s1">{{hyreplyCount}}</span>
<span class="s2">行业千人发帖</span>
<span class="s2">行业千人评论</span>
</div>
<div class="mfdh-data">
<span class="s1">{{(replyCount-hyreplyCount).toFixed(2)}}

Loading…
Cancel
Save