prod
lily.zhang 3 years ago
parent 91359511b3
commit fe596f2abd

@ -8,16 +8,16 @@
<a-menu-item key="index">
<span>行业洞察</span>
</a-menu-item>
<a-menu-item key="brandInsight">
<a-menu-item key="brandInsight" v-menu="'/brandInsight'">
<span>品牌洞察</span>
</a-menu-item>
<a-menu-item key="modelInsight">
<a-menu-item key="modelInsight" v-menu="'/modelInsight'">
<span>车型洞察</span>
</a-menu-item>
<a-menu-item key="eventInsight">
<a-menu-item key="eventInsight" v-menu="'/eventInsight'">
<span>事件洞察</span>
</a-menu-item>
<a-menu-item key="marketingAnalysis">
<a-menu-item key="marketingAnalysis" v-menu="'/marketingAnalysis'">
<span>营销分析</span>
</a-menu-item>
</a-menu>

@ -8,16 +8,16 @@
<a-menu-item key="index">
<span>行业洞察</span>
</a-menu-item>
<a-menu-item key="brandInsight">
<a-menu-item key="brandInsight" v-menu="'/brandInsight'">
<span>品牌洞察</span>
</a-menu-item>
<a-menu-item key="modelInsight">
<a-menu-item key="modelInsight" v-menu="'/modelInsight'">
<span>车型洞察</span>
</a-menu-item>
<a-menu-item key="eventInsight">
<a-menu-item key="eventInsight" v-menu="'/eventInsight'">
<span>事件洞察</span>
</a-menu-item>
<a-menu-item key="marketingAnalysis">
<a-menu-item key="marketingAnalysis" v-menu="'/marketingAnalysis'">
<span>营销分析</span>
</a-menu-item>
</a-menu>

@ -8,16 +8,16 @@
<a-menu-item key="index">
<span>行业洞察</span>
</a-menu-item>
<a-menu-item key="brandInsight">
<a-menu-item key="brandInsight" v-menu="'/brandInsight'">
<span>品牌洞察</span>
</a-menu-item>
<a-menu-item key="modelInsight">
<a-menu-item key="modelInsight" v-menu="'/modelInsight'">
<span>车型洞察</span>
</a-menu-item>
<a-menu-item key="eventInsight">
<a-menu-item key="eventInsight" v-menu="'/eventInsight'">
<span>事件洞察</span>
</a-menu-item>
<a-menu-item key="marketingAnalysis">
<a-menu-item key="marketingAnalysis" v-menu="'/marketingAnalysis'">
<span>营销分析</span>
</a-menu-item>
</a-menu>

@ -1,12 +1,13 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:56:13
* @LastEditTime: 2021-11-15 15:51:22
* @LastEditTime: 2021-11-16 10:26:56
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/mixins/index.js
*/
import { mapGetters, mapActions } from "vuex";
import store from '@/store'
import Loading from './loading'
function detectZoom (){
let ratio = 0,
@ -36,7 +37,46 @@ export default {
install(Vue) {
Vue.mixin({
directives: {
// 按钮权限
has: {
inserted(el, binding) {
let val = binding.value;
let show = false;
if(!val) {
show = false;
} else {
let buttonpermsStr = store.getters.getLevelBtn || [];
let n = buttonpermsStr.findIndex(ele => ele.btn === val);
if(n === -1) show = false;
else show = true;
}
if(!show) {
el.parentNode.removeChild(el);
}
}
},
// 菜单权限
menu: {
inserted(el, binding) {
let val = binding.value;
let show = false;
if(!val) {
show = false;
} else {
let menuStr = store.getters.getMenu || [];
let n = menuStr.findIndex(ele => ele.link === val);
if(n === -1) show = false;
else show = true;
}
if(!show) {
el.parentNode.removeChild(el);
}
}
},
// 等待
'loading': Loading,
// 监听元素大小
resize: { // 指令的名称
bind(el, binding) { // el为绑定的元素binding为绑定给指令的对象
let width = '', height = '';
@ -54,6 +94,7 @@ export default {
clearInterval(el.__vueSetInterval__);
}
},
// 调整元素高度
highly: {
bind(el, binding) { // el为绑定的元素binding为绑定给指令的对象
let height = '';
@ -86,10 +127,10 @@ export default {
}
},
computed: {
...mapGetters(['getZoom', 'getLoading','getToken', 'getUser', 'getAccount', 'getCommTime', 'getCtime', 'getCtime2', 'getHeaderType', 'getBrand', 'getModel','getSComparison','getBComparison', 'getMComparison', 'getEComparison'])
...mapGetters(['getZoom', 'getLoading','getToken', 'getUser', 'getAccount', 'getCommTime', 'getCtime', 'getCtime2', 'getHeaderType', 'getBrand', 'getModel','getSComparison','getBComparison', 'getMComparison', 'getEComparison','getLevelBtn','getMenu'])
},
methods: {
...mapActions(["setZoom", 'setLoading', 'setToken', 'setUser', 'setAccount', 'setCommTime', 'setCtime', 'setCtime2', 'setHeaderType', 'setBrand', 'setModel', 'setSComparison','setBComparison', 'setMComparison', 'setEComparison']),
...mapActions(["setZoom", 'setLoading', 'setToken', 'setUser', 'setAccount', 'setCommTime', 'setCtime', 'setCtime2', 'setHeaderType', 'setBrand', 'setModel', 'setSComparison','setBComparison', 'setMComparison', 'setEComparison','setLevelBtn','setMenu']),
// 获取当前日期时间
getDatetime() {
let now = new Date();

@ -1,11 +1,12 @@
/*
* @Author: your name
* @Date: 2021-10-08 09:26:42
* @LastEditTime: 2021-11-11 10:44:05
* @LastEditTime: 2021-11-16 10:47:13
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/permission.js
*/
import store from '@/store'
import router from "@/router"
import NProgress from "nprogress"
import "nprogress/nprogress.css"
@ -18,7 +19,7 @@ router.beforeEach((to, from, next) => {
if(!token && !whitePath.includes(to.path)) {
next('/login');
} else {
next()
checkMenu(to.path, next);
}
})
@ -26,4 +27,12 @@ router.afterEach(() => {
NProgress.done()
})
// 检查菜单权限
function checkMenu(path, next) {
let menuStr = store.getters.getMenu || [];
let arr = ['/index', '/modelInsight', '/eventInsight', '/marketingAnalysis'];
let n = menuStr.findIndex(ele => ele.link === path);
if(arr.includes(path) && n === -1) next('/index')
else next()
}
export default router

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:36:49
* @LastEditTime: 2021-11-15 15:46:52
* @LastEditTime: 2021-11-16 10:01:41
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/actions.js
@ -52,5 +52,11 @@ const actions = {
setEComparison: ({commit}, log) => {
commit('setEComparison', log)
},
setLevelBtn: ({commit}, log) => {
commit('setLevelBtn', log)
},
setMenu: ({commit}, log) => {
commit('setMenu', log)
}
}
export default actions

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:06
* @LastEditTime: 2021-11-15 15:47:44
* @LastEditTime: 2021-11-16 10:03:04
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/getters.js
@ -52,5 +52,11 @@ const getters = {
getEComparison(state) {
return state.eComparison
},
getLevelBtn(state) {
return state.levelBtn
},
getMenu(state) {
return state.menu
}
}
export default getters

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:35
* @LastEditTime: 2021-11-15 15:47:21
* @LastEditTime: 2021-11-16 10:02:10
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/mutations.js
@ -81,6 +81,16 @@ const mutations = {
let str = JSON.stringify(log);
sessionStorage.setItem('eComparison', str);
},
setLevelBtn: (state, log) => {
state.levelBtn = log;
let str = JSON.stringify(log);
sessionStorage.setItem('levelBtn', str);
},
setMenu: (state, log) => {
state.menu = log;
let str = JSON.stringify(log);
sessionStorage.setItem('menu', str);
}
}

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:50
* @LastEditTime: 2021-11-15 15:46:12
* @LastEditTime: 2021-11-16 09:57:48
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/state.js
@ -22,6 +22,8 @@ const state = {
bComparison: JSON.parse(sessionStorage.getItem('bComparison')) || [],
sComparison: JSON.parse(sessionStorage.getItem('sComparison')) || [],
mComparison: JSON.parse(sessionStorage.getItem('mComparison')) || [],
eComparison: JSON.parse(sessionStorage.getItem('eComparison')) || []
eComparison: JSON.parse(sessionStorage.getItem('eComparison')) || [],
levelBtn: JSON.parse(sessionStorage.getItem('levelBtn')) || [],
menu: JSON.parse(sessionStorage.getItem('menu')) || [],
}
export default state;

@ -1,118 +1,124 @@
<!--
* @Author: your name
* @Date: 2021-10-15 15:58:57
* @LastEditTime: 2021-10-15 16:52:25
* @LastEditTime: 2021-11-16 11:01:43
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/brandCommunicationTOPMedia/index.vue
-->
<template>
<div class="bcm-outter" v-loading="load">
<v-label-div title="品牌传播TOP媒体"> </v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in arrList" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
<div class="bcm-outter" v-loading="load">
<v-label-div title="品牌传播TOP媒体"> </v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in arrList" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
item.key
}}</span>
<v-ranking-bcm
v-for="(it, n) in item.value"
:key="n"
:label="it.key"
:num="it.num"
:val="it.value"
></v-ranking-bcm>
</div>
<div class="dd1">
<vue-scroll>
<v-ranking-bcm v-for="(it, n) in item.value" :key="n" :label="it.key" :num="it.num" :val="it.value"></v-ranking-bcm>
</vue-scroll>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getSourceTopCount0528C } from "@/api/BrandComparison";
import vRankingBcm from "./v-ranking-bcm";
export default {
name: "brandCommunicationTOPMedia",
components: {
vRankingBcm,
},
data() {
return {
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
load: false,
form: {
token: "",
sBrand: "",
},
arrList: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getBComparison;
let brands = [];
arr.forEach((ele) => {
brands.push(ele.name);
});
this.form.sBrand = brands.toString();
this.getData();
name: "brandCommunicationTOPMedia",
components: {
vRankingBcm,
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getSourceTopCount0528C(obj)
.then((res) => {
let data = res.data || [];
//
data.forEach((ele) => {
for (let index = 0; index < ele.value.length; index++) {
ele.value[index].num = index + 1;
}
data() {
return {
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
load: false,
form: {
token: "",
sBrand: "",
},
arrList: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getBComparison;
let brands = [];
arr.forEach((ele) => {
brands.push(ele.name);
});
this.form.sBrand = brands.toString();
this.getData();
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getSourceTopCount0528C(obj)
.then((res) => {
let data = res.data || [];
//
data.forEach((ele) => {
for (
let index = 0;
index < ele.value.length;
index++
) {
ele.value[index].num = index + 1;
}
});
this.arrList = data;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
this.arrList = data;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
},
},
},
};
</script>
<style lang="less" scoped>
.bcm-outter {
width: 100%;
height: 460px;
border: 2px solid #0f2a4d;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
height: 460px;
border: 2px solid #0f2a4d;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
height: 100%;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
.dd1 {
height: calc(100% - 44px);
}
}
}
}
}
</style>

@ -1,140 +1,142 @@
<!--
* @Author: your name
* @Date: 2021-10-15 15:58:57
* @LastEditTime: 2021-10-16 11:25:20
* @LastEditTime: 2021-11-16 11:26:29
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/brandCommunicationTOPMedia/index.vue
-->
<template>
<div class="bcm-outter" v-loading="load">
<v-label-div
title="微博内容方向对比"
:showLine="false"
:eStyle="{ 'border-style': 'none' }"
>
</v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in sourceData" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
<div class="bcm-outter" v-loading="load">
<v-label-div title="微博内容方向对比" :showLine="false" :eStyle="{ 'border-style': 'none' }">
</v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in sourceData" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
item.key
}}</span>
<v-ranking-bcm
v-for="(it, n) in item.value"
:key="n"
:label="it.key"
:num="it.num"
:val="it.value"
></v-ranking-bcm>
</div>
<div class="dd1">
<vue-scroll>
<v-ranking-bcm v-for="(it, n) in item.value" :key="n" :label="it.key" :num="it.num" :val="it.value"></v-ranking-bcm>
</vue-scroll>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getDirect0528C } from "@/api/BrandComparison/BrandWeibo.js";
import vRankingBcm from "./v-ranking-bcm";
export default {
name: "weiboContentDirectionComparison",
components: {
vRankingBcm,
},
data() {
return {
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
},
load: false,
sourceData: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getBComparison;
let brands = [];
arr.forEach((ele) => {
brands.push(ele.name);
});
this.form.sBrand = brands.toString();
this.getData();
name: "weiboContentDirectionComparison",
components: {
vRankingBcm,
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getDirect0528C(obj)
.then((res) => {
let data = res.data || [];
let showData = [];
data.forEach((e) => {
//5obj
let sortedArr = e.value.sort(this.compare("value")).slice(0, 5);
let obj = {
key: e.key,
value: sortedArr,
};
showData.push(obj);
data() {
return {
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
},
load: false,
sourceData: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getBComparison;
let brands = [];
arr.forEach((ele) => {
brands.push(ele.name);
});
showData.forEach((ele) => {
//
for (let index = 0; index < ele.value.length; index++) {
ele.value[index].num = index + 1;
}
this.form.sBrand = brands.toString();
this.getData();
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getDirect0528C(obj)
.then((res) => {
let data = res.data || [];
let showData = [];
data.forEach((e) => {
//5obj
let sortedArr = e.Data;
sortedArr.sort(this.compare("value"));
let obj = {
key: e.Name,
value: sortedArr,
};
showData.push(obj);
});
showData.forEach((ele) => {
//
for (
let index = 0;
index < ele.value.length;
index++
) {
ele.value[index].num = index + 1;
}
});
this.sourceData = showData;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
this.sourceData = showData;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
},
// v2-v1v1-v2
compare(property) {
return function (a, b) {
let value1 = a[property];
let value2 = b[property];
return value2 - value1;
};
},
// v2-v1v1-v2
compare(property) {
return function (a, b) {
let value1 = a[property];
let value2 = b[property];
return value2 - value1;
};
},
},
},
};
</script>
<style lang="less" scoped>
.bcm-outter {
width: 100%;
height: 460px;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
height: 460px;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
.dd1 {
height: calc(100% - 44px);
}
}
}
}
}
</style>

@ -1,7 +1,7 @@
<!--
* @Author: xw
* @Date: 2021-10-12 09:32:35
* @LastEditTime: 2021-11-12 17:00:27
* @LastEditTime: 2021-11-16 10:48:54
* @LastEditors: Please set LastEditors
* @Description: 舆情传播趋势
* @FilePath: /data-show/src/views/BrandInsight/titsopo/index.vue
@ -10,7 +10,7 @@
<div class="tit-outter" v-loading="load">
<div class="tit-header">
<a-button type="primary" size="small" @click="goIDE"></a-button>
<a-button type="primary" style="margin-left: 1rem;margin-right: 1rem;" size="small" :loading="btnLoading" @click="exportData"></a-button>
<a-button type="primary" style="margin-left: 1rem;margin-right: 1rem;" size="small" :loading="btnLoading" @click="exportData" v-has="'btn_brand_toppt'"></a-button>
</div>
<div class="tit-inner">
<vLabel-div title="舆情传播趋势"></vLabel-div>

@ -1,7 +1,7 @@
<!--
* @Author: your name
* @Date: 2021-10-19 14:14:52
* @LastEditTime: 2021-10-29 16:21:00
* @LastEditTime: 2021-11-16 10:29:27
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/Login/loginForm/index.vue
@ -122,6 +122,8 @@ export default {
let data = res.data;
this.setToken(data.toKen);
this.setUser(data);
this.setLevelBtn(data.levelBtn);
this.setMenu(data.meun);
if(this.remCheck) {
this.setAccount({sUserName:this.form.sUserName, sPwd: this.form.sPwd, remCheck: this.remCheck})
} else {

@ -1,122 +1,127 @@
<!--
* @Author: your name
* @Date: 2021-10-15 15:58:57
* @LastEditTime: 2021-11-11 14:45:50
* @LastEditTime: 2021-11-16 11:06:38
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/brandCommunicationTOPMedia/index.vue
-->
<template>
<div class="bcm-outter" v-loading="load">
<v-label-div title="车型传播TOP媒体"> </v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in arrList" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
<div class="bcm-outter" v-loading="load">
<v-label-div title="车型传播TOP媒体"> </v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in arrList" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
item.key
}}</span>
<v-ranking-bcm
v-for="(it, n) in item.value"
:key="n"
:label="it.key"
:num="it.num"
:val="it.value"
></v-ranking-bcm>
</div>
<div class="dd1">
<vue-scroll>
<v-ranking-bcm v-for="(it, n) in item.value" :key="n" :label="it.key" :num="it.num" :val="it.value"></v-ranking-bcm>
</vue-scroll>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getSourceTopCount0528C } from "@/api/BrandComparison";
import vRankingBcm from "./v-ranking-bcm";
export default {
name: "brandCommunicationTOPMedia",
components: {
vRankingBcm,
},
data() {
return {
load: false,
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
sSeriesName: "",
iContrastType: 2
},
arrList:[],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getMComparison;
let brands = [];
let models = [];
arr.forEach((ele) => {
brands.push(ele.brand);
models.push(ele.model);
});
this.form.sBrand = brands.toString();
this.form.sSeriesName = models.toString();
this.getData();
name: "brandCommunicationTOPMedia",
components: {
vRankingBcm,
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getSourceTopCount0528C(obj)
.then((res) => {
let data = res.data || [];
data.forEach(ele => {
for(let index = 0 ; index<ele.value.length;index++){
ele.value[index].num = index + 1;
}
data() {
return {
load: false,
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
sSeriesName: "",
iContrastType: 2,
},
arrList: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getMComparison;
let brands = [];
let models = [];
arr.forEach((ele) => {
brands.push(ele.brand);
models.push(ele.model);
});
this.form.sBrand = brands.toString();
this.form.sSeriesName = models.toString();
this.getData();
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getSourceTopCount0528C(obj)
.then((res) => {
let data = res.data || [];
data.forEach((ele) => {
for (
let index = 0;
index < ele.value.length;
index++
) {
ele.value[index].num = index + 1;
}
});
this.arrList = data;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
this.arrList = data;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
},
},
},
};
</script>
<style lang="less" scoped>
.bcm-outter {
width: 100%;
height: 460px;
border: 2px solid #0f2a4d;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
height: 460px;
border: 2px solid #0f2a4d;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
.dd1 {
height: calc(100% - 44px);
}
}
}
}
}
</style>

@ -1,145 +1,148 @@
<!--
* @Author: your name
* @Date: 2021-10-15 15:58:57
* @LastEditTime: 2021-11-12 10:34:55
* @LastEditTime: 2021-11-16 11:23:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandComparison/brandCommunicationTOPMedia/index.vue
-->
<template>
<div class="bcm-outter" v-loading="load">
<v-label-div
title="微博内容方向对比"
:showLine="false"
:eStyle="{ 'border-style': 'none' }"
>
</v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in sourceData" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
<div class="bcm-outter" v-loading="load">
<v-label-div title="微博内容方向对比" :showLine="false" :eStyle="{ 'border-style': 'none' }">
</v-label-div>
<div class="bcm-inner">
<div class="bcm-item" v-for="(item, index) in sourceData" :key="index">
<span class="ss1" :style="{ color: colors[index] }">{{
item.key
}}</span>
<v-ranking-bcm
v-for="(it, n) in item.value"
:key="n"
:label="it.key"
:num="it.num"
:val="it.value"
></v-ranking-bcm>
</div>
<div class="dd1">
<vue-scroll>
<v-ranking-bcm v-for="(it, n) in item.value" :key="n" :label="it.key" :num="it.num" :val="it.value"></v-ranking-bcm>
</vue-scroll>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getDirect0528C } from "@/api/BrandComparison/BrandWeibo.js";
import vRankingBcm from "./v-ranking-bcm";
export default {
name: "weiboContentDirectionComparison",
components: {
vRankingBcm,
},
data() {
return {
load: false,
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
sSeriesName: "",
iContrastType: 2
},
sourceData: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getMComparison;
let brands = [];
let models = [];
arr.forEach((ele) => {
brands.push(ele.brand);
models.push(ele.model);
});
this.form.sBrand = brands.toString();
this.form.sSeriesName = models.toString();
this.getData();
name: "weiboContentDirectionComparison",
components: {
vRankingBcm,
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getDirect0528C(obj)
.then((res) => {
let data = res.data || [];
let showData = [];
data.forEach((e) => {
//5obj
let sortedArr = e.value.sort(this.compare("value")).slice(0, 5);
let obj = {
key: e.key,
value: sortedArr,
};
showData.push(obj);
data() {
return {
load: false,
colors: [
"#3373CC",
"#63AECC",
"#54BF93",
"#CC9D12",
"#CC7733",
"#CC5B41",
],
form: {
token: "",
sBrand: "",
sSeriesName: "",
iContrastType: 2,
},
sourceData: [],
};
},
created() {
this.initData();
},
methods: {
initData() {
this.form.token = this.getToken;
let arr = this.getMComparison;
let brands = [];
let models = [];
arr.forEach((ele) => {
brands.push(ele.brand);
models.push(ele.model);
});
showData.forEach((ele) => {
//
for (let index = 0; index < ele.value.length; index++) {
ele.value[index].num = index + 1;
}
this.form.sBrand = brands.toString();
this.form.sSeriesName = models.toString();
this.getData();
},
getData() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getDirect0528C(obj)
.then((res) => {
let data = res.data || [];
let showData = [];
data.forEach((e) => {
//5obj
let sortedArr = e.Data
sortedArr.sort(this.compare("value"))
let obj = {
key: e.Name,
value: sortedArr,
};
showData.push(obj);
});
console.log(showData)
showData.forEach((ele) => {
//
for (
let index = 0;
index < ele.value.length;
index++
) {
ele.value[index].num = index + 1;
}
});
this.sourceData = showData;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
this.sourceData = showData;
this.load = false;
resolve(data);
})
.catch(() => {
reject(false);
});
});
},
// v2-v1v1-v2
compare(property) {
return function (a, b) {
let value1 = a[property];
let value2 = b[property];
return value2 - value1;
};
},
// v2-v1v1-v2
compare(property) {
return function (a, b) {
let value1 = a[property];
let value2 = b[property];
return value2 - value1;
};
},
},
},
};
</script>
<style lang="less" scoped>
.bcm-outter {
width: 100%;
height: 460px;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
height: 460px;
margin-top: 16px;
.bcm-inner {
width: 100%;
height: calc(100% - 48px);
display: flex;
justify-content: flex-start;
.bcm-item {
width: 282px;
margin-left: 27px;
.ss1 {
display: block;
font-size: 18px;
color: #fff;
font-weight: 500;
padding-top: 14px;
}
.dd1 {
height: calc(100% - 44px);
}
}
}
}
}
</style>

Loading…
Cancel
Save