yunyang
/
carInsightSystem
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

cxw-010203

Browse Source
prod
lily.zhang 3 years ago
parent 332ba5df1d
commit dc3ed4442b
27 changed files with 1363 additions and 552 deletions
Show Stats Download Patch File Download Diff File

2
public/map/china.json
View File

File diff suppressed because one or more lines are too long

211
src/api/ModelForumDetails/index.js
Unescape View File

@ -0,0 +1,211 @@
/*
* @Author: your name
* @Date: 2021-11-10 09:50:36
* @LastEditTime: 2021-11-10 16:02:05
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /data-show/src/api/ModelForumDetails/index.js
*/
import httpService from "@/request"
// 论坛洞察详情
export function getBbsCount(params) {
let obj = Object.assign({action: 'getBbsCount',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-论坛传播态势
export function getBbsVolumeTime(params) {
let obj = Object.assign({action: 'getBbsVolumeTime',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-论坛调性分布
export function getAffections(params) {
let obj = Object.assign({action: 'getAffections',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-阅读量
export function getClicksDistribution(params) {
let obj = Object.assign({action: 'getClicksDistribution',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-回复量
export function getReplyDistribution(params) {
let obj = Object.assign({action: 'getReplyDistribution',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-精华率
export function getJingHuaDistribution(params) {
let obj = Object.assign({action: 'getJingHuaDistribution',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴内容分析-图文
export function getImgDistribution(params) {
let obj = Object.assign({action: 'getImgDistribution',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 正面话题分布-正面话题分布
export function getPositiveTopic(params) {
let obj = Object.assign({action: 'getPositiveTopic',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 负面话题分布-负面话题分布
export function getNegativeTopic(params) {
let obj = Object.assign({action: 'getNegativeTopic',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴/跟帖ID车型分析-主贴/跟帖ID
export function getGuanZhuSeriesname(params) {
let obj = Object.assign({action: 'getGuanZhuSeriesname',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴/跟帖ID车型分析-主贴/跟帖认证ID
export function getAttestationBuycars(params) {
let obj = Object.assign({action: 'getAttestationBuycars',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴/跟帖用户分析-性别
export function getAttestationSex(params) {
let obj = Object.assign({action: 'getAttestationSex',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴/跟帖用户分析-认证
export function getUserAttestation(params) {
let obj = Object.assign({action: 'getUserAttestation',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 主贴/跟帖区域分布-区域分布
export function getRegion(params) {
let obj = Object.assign({action: 'getRegion',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 疑似车黑ID-疑似车黑ID
export function getCarblackUserName(params) {
let obj = Object.assign({action: 'getCarblackUserName',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}
// 跟帖ID注册时间-跟帖ID注册时间
export function getUserRegTime(params) {
let obj = Object.assign({action: 'getUserRegTime',sType: 'BbsSeries'}, params)
return httpService({
url: `/api/v6.ashx`,
method: 'post',
data: obj,
headers: {
'content-type': 'application/x-www-form-urlencoded'
}
})
}

2
src/components/v-echars-map/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 13:08:10 * @Date: 2021-10-14 13:08:10
* @LastEditTime: 2021-10-14 16:07:31 * @LastEditTime: 2021-11-10 15:16:30
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/components/v-echars-map/index.vue * @FilePath: /data-show/src/components/v-echars-map/index.vue

7
src/styles/antd.less
Unescape View File

@ -253,3 +253,10 @@ li.ant-calendar-time-picker-select-option-selected {
background: #3373CC !important; background: #3373CC !important;
} }
} }
.ant-tooltip {
box-shadow: 0px 0px 10px 0px #3373CC !important;
background: #08182e !important;
}
.ant-tooltip-inner {
background: #08182e !important;
}

100
src/views/ModelForumDetails/FollowPostIDModelAnalysis/index.vue
Unescape View File

@ -1,37 +1,117 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 16:02:50 * @Date: 2021-11-09 16:02:50
* @LastEditTime: 2021-11-09 17:13:04 * @LastEditTime: 2021-11-10 16:45:34
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue
--> -->
<template> <template>
<div class="mpma-outter"> <div class="mpma-outter" v-loading="load">
<v-label-div title="跟帖ID车型分析" :showLine="false" :eStyle="{'border-style': 'none'}"> <v-label-div title="跟帖ID车型分析" :showLine="false" :eStyle="{'border-style': 'none'}">
<v-tab-group :btns="['主帖ID', '认证ID']" @change="handlerTab"></v-tab-group> <v-tab-group :btns="['主帖ID', '认证ID']" @change="handlerTab"></v-tab-group>
</v-label-div> </v-label-div>
<div class="mpma-inner"> <div class="mpma-inner">
<v-ranking-fpma num="1" label="奥迪A4" val="100"></v-ranking-fpma> <vue-scroll>
<v-ranking-fpma num="2" label="奥迪A4" val="100"></v-ranking-fpma> <v-ranking-fpma :num="index + 1" :label="item.key" :val="item.value" v-for="(item,index) in list" :key="index"></v-ranking-fpma>
<v-ranking-fpma num="3" label="奥迪A4" val="100"></v-ranking-fpma> </vue-scroll>
<v-ranking-fpma num="4" label="奥迪A4" val="100"></v-ranking-fpma>
<v-ranking-fpma num="5" label="奥迪A4" val="100"></v-ranking-fpma>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import {
getGuanZhuSeriesname,
getAttestationBuycars,
} from "@/api/ModelForumDetails";
import vRankingFpma from "./v-ranking-fpma" import vRankingFpma from "./v-ranking-fpma"
export default { export default {
name: "FollowPostIDModelAnalysis", name: "FollowPostIDModelAnalysis",
components: { components: {
vRankingFpma vRankingFpma
}, },
methods: { data() {
handlerTab() { return {
load: false,
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 3,
},
zIds: [],
aIds: [],
list: [],
} }
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.load = true;
Promise.all([this.getGuanZhuSeriesname(), this.getAttestationBuycars()]).then(() => {
this.handlerTab(0);
this.load = false;
})
},
methods: {
// 跟帖ID
getGuanZhuSeriesname() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getGuanZhuSeriesname(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.zIds = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 认证ID
getAttestationBuycars() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getAttestationBuycars(obj).then(res => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.aIds = arr;
resolve(true);
}).catch(() => {
reject(false);
})
})
},
handlerTab(n) {
switch (n) {
case 0:
this.list = this.zIds;
break;
case 1:
this.list = this.aIds;
break;
default:
this.list = this.zIds;
break;
}
},
} }
}; };
</script> </script>

19
src/views/ModelForumDetails/FollowPostUserActiveArea/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 11:25:20 * @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-11-09 17:17:04 * @LastEditTime: 2021-11-10 17:02:24
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
@ -21,7 +21,7 @@
</template> </template>
<script> <script>
import { getRegionWeiBo } from "@/api/WeiboDetails"; import { getRegion } from "@/api/ModelForumDetails";
import createOptD1 from "./opt1"; import createOptD1 from "./opt1";
import createOptD2 from "./opt2"; import createOptD2 from "./opt2";
export default { export default {
@ -32,30 +32,29 @@ export default {
form: { form: {
sBrand: "", sBrand: "",
token: "", token: "",
sSeriesName: "",
iBBsType: 3
}, },
opt1: createOptD1(), opt1: {},
opt2: createOptD2(), opt2: {},
}; };
}, },
created() { created() {
this.form.token = this.getToken; this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || this.brand; this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.getData(); this.getData();
}, },
methods: { methods: {
getData() { getData() {
this.load = true; this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form); let obj = Object.assign({}, this.getCtime2, this.form);
getRegionWeiBo(obj).then((res) => { getRegion(obj).then((res) => {
let data = res.data || {}; let data = res.data || {};
let arr = this.toArr(data); let arr = this.toArr(data);
let dx = []; //省份 let dx = []; //省份
let ds = []; //数据 let ds = []; //数据
arr.forEach((ele) => { arr.forEach((ele) => {
let name = ele.name || "";
if(name.indexOf('省') === -1) {
ele.name = ele.name + '市'
}
let value = ele.value; let value = ele.value;
dx.push(ele.name); dx.push(ele.name);
ds.push(value); ds.push(value);

111
src/views/ModelForumDetails/FollowPostUserAnalysis/index.vue
Unescape View File

@ -1,13 +1,13 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 16:27:20 * @Date: 2021-11-09 16:27:20
* @LastEditTime: 2021-11-09 17:15:17 * @LastEditTime: 2021-11-10 14:56:15
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue
--> -->
<template> <template>
<div class="mpua-outter"> <div class="mpua-outter" v-loading="load">
<v-label-div title="跟帖用户分析" :showLine="false" :eStyle="{'border-style': 'none'}"> <v-label-div title="跟帖用户分析" :showLine="false" :eStyle="{'border-style': 'none'}">
<v-tab-group :btns="['性别', '认证']" @change="handlerTab"></v-tab-group> <v-tab-group :btns="['性别', '认证']" @change="handlerTab"></v-tab-group>
</v-label-div> </v-label-div>
@ -18,18 +18,115 @@
</template> </template>
<script> <script>
import createData from "./opt" import { getAttestationSex, getUserAttestation } from "@/api/ModelForumDetails";
import createOpt from "./opt"
export default { export default {
name: "FollowPostUserAnalysis", name: "FollowPostUserAnalysis",
data() { data() {
return { return {
opt: createData() load: false,
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",
],
} }
}, },
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.load = true;
Promise.all([this.getAttestationSex(), this.getUserAttestation()]).then(() => {
this.handlerTab(0);
this.load = false;
})
},
methods: { methods: {
handlerTab() { // 性别
getAttestationSex() {
} return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getAttestationSex(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.sex = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 认证
getUserAttestation() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getUserAttestation(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.rz = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
handlerTab(n) {
switch (n) {
case 0:
this.opt = createOpt(this.sex, this.colors)
break;
case 1:
this.opt = createOpt(this.rz, this.colors)
break;
default:
break;
}
},
} }
} }
</script> </script>

106
src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue
Unescape View File

@ -1,38 +1,118 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 16:02:50 * @Date: 2021-11-09 16:02:50
* @LastEditTime: 2021-11-09 16:33:52 * @LastEditTime: 2021-11-10 16:44:33
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/MainPostIDModelAnalysis/index.vue
--> -->
<template> <template>
<div class="mpma-outter"> <div class="mpma-outter" v-loading="load">
<v-label-div title="主帖ID车型分析" :showLine="false" :eStyle="{'border-style': 'none'}"> <v-label-div title="主帖ID车型分析" :showLine="false" :eStyle="{'border-style': 'none'}">
<v-tab-group :btns="['主帖ID', '认证ID']" @change="handlerTab"></v-tab-group> <v-tab-group :btns="['主帖ID', '认证ID']" @change="handlerTab"></v-tab-group>
</v-label-div> </v-label-div>
<div class="mpma-inner"> <div class="mpma-inner">
<v-ranking-mpma num="1" label="奥迪A4" val="100"></v-ranking-mpma> <vue-scroll>
<v-ranking-mpma num="2" label="奥迪A4" val="100"></v-ranking-mpma> <v-ranking-mpma :num="index + 1" :label="item.key" :val="item.value" v-for="(item,index) in list" :key="index"></v-ranking-mpma>
<v-ranking-mpma num="3" label="奥迪A4" val="100"></v-ranking-mpma> </vue-scroll>
<v-ranking-mpma num="4" label="奥迪A4" val="100"></v-ranking-mpma>
<v-ranking-mpma num="5" label="奥迪A4" val="100"></v-ranking-mpma>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import vRankingMpma from "./v-ranking-mpma" import {
getGuanZhuSeriesname,
getAttestationBuycars,
} from "@/api/ModelForumDetails";
import vRankingMpma from "./v-ranking-mpma";
export default { export default {
name: "MainPostIDModelAnalysis", name: "MainPostIDModelAnalysis",
components: { components: {
vRankingMpma vRankingMpma,
},
data() {
return {
load: false,
form: {
sBrand: "",
token: "",
sSeriesName: "",
iBBsType: 2,
},
zIds: [],
aIds: [],
list: [],
};
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.load = true;
Promise.all([this.getGuanZhuSeriesname(), this.getAttestationBuycars()]).then(() => {
this.handlerTab(0);
this.load = false;
})
}, },
methods: { methods: {
handlerTab() { // 主帖ID
getGuanZhuSeriesname() {
} return new Promise((resolve, reject) => {
} let obj = Object.assign({}, this.getCtime2, this.form);
getGuanZhuSeriesname(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.zIds = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 认证ID
getAttestationBuycars() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getAttestationBuycars(obj).then(res => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.aIds = arr;
resolve(true);
}).catch(() => {
reject(false);
})
})
},
handlerTab(n) {
switch (n) {
case 0:
this.list = this.zIds;
break;
case 1:
this.list = this.aIds;
break;
default:
this.list = this.zIds;
break;
}
},
},
}; };
</script> </script>

19
src/views/ModelForumDetails/MainPostUserActiveArea/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 11:25:20 * @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-11-09 17:06:29 * @LastEditTime: 2021-11-10 17:01:24
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
@ -21,7 +21,7 @@
</template> </template>
<script> <script>
import { getRegionWeiBo } from "@/api/WeiboDetails"; import { getRegion } from "@/api/ModelForumDetails";
import createOptD1 from "./opt1"; import createOptD1 from "./opt1";
import createOptD2 from "./opt2"; import createOptD2 from "./opt2";
export default { export default {
@ -32,30 +32,29 @@ export default {
form: { form: {
sBrand: "", sBrand: "",
token: "", token: "",
sSeriesName: "",
iBBsType: 2
}, },
opt1: createOptD1(), opt1: {},
opt2: createOptD2(), opt2: {},
}; };
}, },
created() { created() {
this.form.token = this.getToken; this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || this.brand; this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.getData(); this.getData();
}, },
methods: { methods: {
getData() { getData() {
this.load = true; this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form); let obj = Object.assign({}, this.getCtime2, this.form);
getRegionWeiBo(obj).then((res) => { getRegion(obj).then((res) => {
let data = res.data || {}; let data = res.data || {};
let arr = this.toArr(data); let arr = this.toArr(data);
let dx = []; //省份 let dx = []; //省份
let ds = []; //数据 let ds = []; //数据
arr.forEach((ele) => { arr.forEach((ele) => {
let name = ele.name || "";
if(name.indexOf('省') === -1) {
ele.name = ele.name + '市'
}
let value = ele.value; let value = ele.value;
dx.push(ele.name); dx.push(ele.name);
ds.push(value); ds.push(value);

6
src/views/ModelForumDetails/MainPostUserActiveArea/opt1.js
Unescape View File

@ -3,7 +3,7 @@
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-10-09 12:38:34 * @Date: 2021-10-09 12:38:34
* @LastEditTime: 2021-10-14 11:48:19 * @LastEditTime: 2021-11-10 14:53:44
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/Index/tailInsight/opt.js * @FilePath: /data-show/src/views/Index/tailInsight/opt.js
@ -66,9 +66,9 @@ export default function createOptD1(dx=[],ds=[]) {
}, },
series: [ series: [
{ {
name: '2011', name: '',
type: 'bar', type: 'bar',
barWidth: 20, barWidth: 16,
data: ds, data: ds,
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
offset: 0, offset: 0,

119
src/views/ModelForumDetails/MainPostUserAnalysis/index.vue
Unescape View File

@ -1,14 +1,14 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 16:27:20 * @Date: 2021-11-09 16:27:20
* @LastEditTime: 2021-11-09 16:39:48 * @LastEditTime: 2021-11-10 14:56:39
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/MainPostUserAnalysis/index.vue
--> -->
<template> <template>
<div class="mpua-outter"> <div class="mpua-outter" v-loading="load">
<v-label-div title="主帖用户分析" :showLine="false" :eStyle="{'border-style': 'none'}"> <v-label-div title="主帖用户分析" :showLine="false" :eStyle="{'border-style': 'none'}">
<v-tab-group :btns="['性别', '认证']" @change="handlerTab"></v-tab-group> <v-tab-group :btns="['性别', '认证']" @change="handlerTab"></v-tab-group>
</v-label-div> </v-label-div>
<div class="mpua-inner"> <div class="mpua-inner">
@ -18,20 +18,117 @@
</template> </template>
<script> <script>
import createData from "./opt" import { getAttestationSex, getUserAttestation } from "@/api/ModelForumDetails";
import createOpt from "./opt";
export default { export default {
name: "MainPostUserAnalysis", name: "MainPostUserAnalysis",
data() { data() {
return { return {
opt: createData() load: false,
} 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",
],
};
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || '奥迪';
this.form.sSeriesName = this.getModel.name;
this.load = true;
Promise.all([this.getAttestationSex(), this.getUserAttestation()]).then(() => {
this.handlerTab(0)
this.load = false;
})
}, },
methods: { methods: {
handlerTab() { // 性别
getAttestationSex() {
} return new Promise((resolve, reject) => {
} let obj = Object.assign({}, this.getCtime2, this.form);
} getAttestationSex(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.sex = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 认证
getUserAttestation() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getUserAttestation(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
}
this.rz = arr;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
handlerTab(n) {
switch (n) {
case 0:
this.opt = createOpt(this.sex, this.colors)
break;
case 1:
this.opt = createOpt(this.rz, this.colors)
break;
default:
break;
}
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

35
src/views/ModelForumDetails/SuspectedCarBlackID/index.vue
Unescape View File

@ -1,13 +1,13 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 17:19:28 * @Date: 2021-11-09 17:19:28
* @LastEditTime: 2021-11-09 17:26:17 * @LastEditTime: 2021-11-10 15:58:05
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/SuspectedCarBlackID/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/SuspectedCarBlackID/index.vue
--> -->
<template> <template>
<div class="scb-outter"> <div class="scb-outter" v-loading="load">
<v-label-div title="疑似车黑ID"> </v-label-div> <v-label-div title="疑似车黑ID"> </v-label-div>
<div class="scb-inner"> <div class="scb-inner">
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
@ -16,13 +16,44 @@
</template> </template>
<script> <script>
import {getCarblackUserName} from "@/api/ModelForumDetails"
import createOpt from "./opt" import createOpt from "./opt"
export default { export default {
name: "SuspectedCarBlackID", name: "SuspectedCarBlackID",
data() { data() {
return { return {
load: false,
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: createOpt() opt: createOpt()
} }
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || "奥迪";
this.form.sSeriesName = this.getModel.name;
this.getData()
},
methods: {
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getCarblackUserName(obj).then(res => {
let data = res.data || {};
let arr = [];
let n = 1;
for(let key in data) {
n++;
let a = [n, data[key], key];
arr.push(a);
}
this.opt = createOpt(arr)
this.load = false;
})
}
} }
} }
</script> </script>

60
src/views/ModelForumDetails/SuspectedCarBlackID/opt.js
Unescape View File

@ -1,12 +1,13 @@
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-10-12 15:32:24 * @Date: 2021-10-12 15:32:24
* @LastEditTime: 2021-11-09 17:33:49 * @LastEditTime: 2021-11-10 16:54:01
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js * @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js
*/ */
export default function createOpt() { export default function createOpt(ds = []) {
return { return {
grid: { grid: {
top: 20, top: 20,
@ -23,7 +24,11 @@ export default function createOpt() {
textStyle: { textStyle: {
color: "#fff", //设置文字颜色 color: "#fff", //设置文字颜色
}, },
extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;" extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
formatter: (p) => {
let data = p.data;
return `<span>${data[2]}</span><br><span>数量：${data[1]}</span>`;
}
}, },
xAxis: { xAxis: {
axisTick: { axisTick: {
@ -58,31 +63,30 @@ export default function createOpt() {
}, },
series: [ series: [
{ {
symbolSize: 20, symbolSize: function (data) {
data: [ let x = 100;
[10.0, 8.04], if(data[1]*1 <= 8) {
[8.07, 6.95], x = 8
[13.0, 7.58], } else if(data[1]*1 >= 100) {
[9.05, 8.81], x = 100
[11.0, 8.33], } else {
[14.0, 7.66], x = data[1]*1
[13.4, 6.81], }
[10.0, 6.33], return x
[14.0, 8.96], },
[12.5, 6.82], itemStyle: {
[9.15, 7.2], normal: {
[11.5, 7.2], color: '#564f2d',
[3.03, 4.23], opacity: 0.8,
[12.2, 7.83], shadowBlur: 10,
[2.02, 4.47], shadowOffsetX: 0,
[1.05, 3.33], shadowOffsetY: 0,
[4.05, 4.96], borderType : 'solid',
[6.03, 7.24], borderColor: '#CC7733',
[12.0, 6.26], borderWidth: 1
[12.0, 8.84], },
[7.08, 5.82], },
[5.02, 5.68] data: ds,
],
type: 'scatter' type: 'scatter'
} }
] ]

36
src/views/ModelForumDetails/ThreadIDRegistrationTime/index.vue
Unescape View File

@ -1,13 +1,13 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 17:35:06 * @Date: 2021-11-09 17:35:06
* @LastEditTime: 2021-11-09 17:40:59 * @LastEditTime: 2021-11-10 16:56:03
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/ThreadIDRegistrationTime/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/ThreadIDRegistrationTime/index.vue
--> -->
<template> <template>
<div class="tdrt-outter"> <div class="tdrt-outter" v-loading="load">
<v-label-div title="跟帖ID注册时间"> </v-label-div> <v-label-div title="跟帖ID注册时间"> </v-label-div>
<div class="tdrt-inner"> <div class="tdrt-inner">
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
@ -16,12 +16,42 @@
</template> </template>
<script> <script>
import {getUserRegTime} from "@/api/ModelForumDetails"
import {createSingleColumnar} from "@/utils/gol/singleColumnar" import {createSingleColumnar} from "@/utils/gol/singleColumnar"
export default { export default {
name: "ThreadIDRegistrationTime", name: "ThreadIDRegistrationTime",
data() { data() {
return { return {
opt: createSingleColumnar([2017, 2018, 2019, 2020, 2021], [20000, 18000, 15000, 14000, 11000]) load: false,
form: {
sBrand: "",
token: "",
sSeriesName: "",
},
opt: {}
}
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || "奥迪";
this.form.sSeriesName = this.getModel.name;
this.getData()
},
methods: {
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getUserRegTime(obj).then(res => {
let data = res.data || {};
let dx = [];
let ds = []
for(let key in data) {
dx.push(key);
ds.push(data[key])
}
this.opt = createSingleColumnar(dx, ds);
this.load = false;
})
} }
} }
}; };

389
src/views/ModelForumDetails/mfdCharacters/index.vue
Unescape View File

@ -1,171 +1,272 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 10:48:56 * @Date: 2021-10-14 10:48:56
* @LastEditTime: 2021-11-09 15:00:59 * @LastEditTime: 2021-11-10 11:38:07
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboCharacters/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboCharacters/index.vue
--> -->
<template> <template>
<div class="wc-outter" v-loading="load"> <div class="wc-outter" v-loading="load">
<v-label-div title="数据对比分析"> <v-label-div title="数据对比分析">
<div> <div>
<v-tab-group <v-tab-group :btns="['阅读量', '回复量', '精华率', '图文']" @change="handlerTab"></v-tab-group>
:btns="['阅读量', '回复量', '精华率', '图文']" </div>
@change="handlerTab" </v-label-div>
></v-tab-group> <div class="wc-inner">
</div> <div class="d1">
</v-label-div> <v-echarts :opt="opt"></v-echarts>
<div class="wc-inner"> </div>
<div class="d1"> <div class="d2">
<v-echarts :opt="opt"></v-echarts> <vue-scroll>
</div> <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 class="d2"> </vue-scroll>
<vue-scroll> </div>
<v-label-ctx </div>
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>
</vue-scroll>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
import { getSexMergeWeiBo } from "@/api/WeiboDetails"; import {
getClicksDistribution,
getReplyDistribution,
getJingHuaDistribution,
getImgDistribution,
} from "@/api/ModelForumDetails";
import createOpt from "./opt"; import createOpt from "./opt";
export default { export default {
name: "mfdCharacters", name: "mfdCharacters",
data() { data() {
return { return {
load: false, load: false,
form: { form: {
sBrand: "", sBrand: "",
token: "", token: "",
}, sSeriesName: "",
RegionWeiBo: [], },
attestation: [], clicksDistributio: [],
sex: [], replyDistribution: [],
total: 0, jingHuaDistribution: [],
labelArr: [], imgDistribution: [],
ctotal: 0,
opt: createOpt(), rtotal: 0,
colors: [ jtotal: 0,
"#54BF93", itotal: 0,
"#3373CC", total: 0,
"#CC9D12", labelArr: [],
"#f15c80", opt: {},
"#e4d354", colors: [
"#8085e8", "#3373CC",
"#8d4653", "#54BF93",
"#91e8e1", "#CC9D12",
"#f7a35c", "#f15c80",
"#90ed7d", "#e4d354",
"#54BF93", "#8085e8",
"#3373CC", "#8d4653",
"#CC9D12", "#91e8e1",
"#f15c80", "#f7a35c",
"#e4d354", "#90ed7d",
"#8085e8", "#54BF93",
"#8d4653", "#3373CC",
"#91e8e1", "#CC9D12",
"#f7a35c", "#f15c80",
"#90ed7d", "#e4d354",
], "#8085e8",
}; "#8d4653",
}, "#91e8e1",
created() { "#f7a35c",
this.form.token = this.getToken; "#90ed7d",
this.form.sBrand = this.getBrand.brandname || this.brand; ],
this.getData();
},
methods: {
// 获取后台数据
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getSexMergeWeiBo(obj).then((res) => {
let data = res.data || {};
let RegionWeiBo = data.RegionWeiBo;
let attestation = data.attestation;
let sex = data.sex;
this.RegionWeiBo = this.toArr(RegionWeiBo);
this.attestation = this.toArr(attestation);
this.sex = this.toArr(sex);
this.doVal(this.sex);
this.load = false;
});
},
// 将对象变成数组
toArr(obj) {
let arr = [];
for (let key in obj) {
let o = {
key: key,
value: obj[key],
}; };
arr.push(o);
}
return arr;
}, },
// 给页面变化值赋值 created() {
doVal(arr = []) { this.form.token = this.getToken;
let total = 0; this.form.sBrand = this.getBrand.brandname || this.brand;
arr.forEach((ele) => { this.form.sSeriesName = this.getModel.name;
total += ele.value * 1; this.load = true;
}); Promise.all([
this.total = total; this.getClicksDistribution(),
this.labelArr = arr; this.getReplyDistribution(),
this.opt = createOpt(this.labelArr, this.colors); this.getJingHuaDistribution(),
this.getImgDistribution(),
]).then(() => {
this.handlerTab(0)
this.load = false;
});
}, },
// 切换数据 methods: {
handlerTab(n) { // 将对象变成数组
switch (n) { toArr(obj) {
case 0: let arr = [];
this.doVal(this.sex); for (let key in obj) {
break; let o = {
case 1: key: key,
this.doVal(this.attestation); value: obj[key],
break; };
case 2: arr.push(o);
this.doVal(this.RegionWeiBo); }
break; return arr;
default: },
this.doVal(this.sex);
break; // 切换数据
} handlerTab(n) {
switch (n) {
case 0:
this.labelArr = this.clicksDistributio;
this.total = this.ctotal;
this.opt = createOpt(this.labelArr, this.colors);
break;
case 1:
this.labelArr = this.replyDistribution;
this.total = this.rtotal;
this.opt = createOpt(this.labelArr, this.colors);
break;
case 2:
this.labelArr = this.jingHuaDistribution;
this.total = this.jtotal;
this.opt = createOpt(this.labelArr, this.colors);
break;
case 3:
this.labelArr = this.imgDistribution;
this.total = this.itotal;
this.opt = createOpt(this.labelArr, this.colors);
break;
default:
this.labelArr = this.clicksDistributio;
this.total = this.ctotal;
this.opt = createOpt(this.labelArr, this.colors);
break;
}
},
// 阅读量
getClicksDistribution() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getClicksDistribution(obj)
.then((res) => {
let data = res.data || [];
let arr = [];
let ctotal = 0;
data.forEach((ele) => {
let o = {
key: ele.name,
value: ele.value,
};
ctotal += ele.value * 1;
arr.push(o);
});
this.clicksDistributio = arr;
this.ctotal = ctotal;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 回复量
getReplyDistribution() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getReplyDistribution(obj)
.then((res) => {
let data = res.data || [];
let arr = [];
let rtotal = 0;
data.forEach((ele) => {
let o = {
key: ele.name,
value: ele.value,
};
rtotal += ele.value * 1;
arr.push(o);
});
this.replyDistribution = arr;
this.rtotal = rtotal;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 精华率
getJingHuaDistribution() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getJingHuaDistribution(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
let jtotal = 0;
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
jtotal += data[key] * 1;
}
this.jingHuaDistribution = arr;
this.jtotal = jtotal;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
// 图文
getImgDistribution() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.getCtime2, this.form);
getImgDistribution(obj)
.then((res) => {
let data = res.data || {};
let arr = [];
let itotal = 0;
for (let key in data) {
let o = {
key: key,
value: data[key],
};
arr.push(o);
itotal += data[key] * 1;
}
this.imgDistribution = arr;
this.itotal = itotal;
resolve(true);
})
.catch(() => {
reject(false);
});
});
},
}, },
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.wc-outter { .wc-outter {
width: 618px; width: 618px;
height: 460px; height: 460px;
border: 2px solid #0f2a4d; border: 2px solid #0f2a4d;
margin-left: 16px; margin-left: 16px;
overflow: hidden; overflow: hidden;
.wc-inner { .wc-inner {
width: 100%; width: 100%;
height: calc(100% - 48px); height: calc(100% - 48px);
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
.d1 { .d1 {
width: 280px; width: 280px;
height: 100%; height: 100%;
} }
.d2 { .d2 {
width: 300px; width: 300px;
margin-left: 16px; margin-left: 16px;
}
} }
}
} }
</style> </style>

8
src/views/ModelForumDetails/mfdCommunicationTrend/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 10:11:41 * @Date: 2021-10-14 10:11:41
* @LastEditTime: 2021-11-09 14:56:37 * @LastEditTime: 2021-11-10 10:40:17
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboCommunicationTrend/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboCommunicationTrend/index.vue
@ -17,7 +17,7 @@
</template> </template>
<script> <script>
import {getCountTime0528} from "@/api/WeiboDetails" import {getBbsVolumeTime} from "@/api/ModelForumDetails"
import createOpt from "./opt" import createOpt from "./opt"
export default { export default {
name: "mfdCommunicationTrend", name: "mfdCommunicationTrend",
@ -27,6 +27,7 @@ export default {
form: { form: {
sBrand: "", sBrand: "",
token: "", token: "",
sSeriesName: ""
}, },
opt: createOpt() opt: createOpt()
} }
@ -34,13 +35,14 @@ export default {
created() { created() {
this.form.token = this.getToken; this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || this.brand; this.form.sBrand = this.getBrand.brandname || this.brand;
this.form.sSeriesName = this.getModel.name;
this.getData(); this.getData();
}, },
methods: { methods: {
getData() { getData() {
this.load = true; this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form); let obj = Object.assign({}, this.getCtime2, this.form);
getCountTime0528(obj).then(res => { getBbsVolumeTime(obj).then(res => {
let data = res.data || []; let data = res.data || [];
let dx = []; //time let dx = []; //time
let ds = []; //value let ds = []; //value

172
src/views/ModelForumDetails/mfdContentType/index.vue
Unescape View File

@ -1,119 +1,99 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 10:24:56 * @Date: 2021-10-14 10:24:56
* @LastEditTime: 2021-11-09 14:59:02 * @LastEditTime: 2021-11-10 10:53:19
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboContentType/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboContentType/index.vue
--> -->
<template> <template>
<div class="wct-outter" v-loading="load"> <div class="wct-outter" v-loading="load">
<v-label-div title="论坛调性分布"> </v-label-div> <v-label-div title="论坛调性分布"> </v-label-div>
<div class="wct-inner"> <div class="wct-inner">
<div class="d1"> <div class="d1">
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
</div> </div>
<div class="d2"> <div class="d2">
<v-label-ctx <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>
v-for="(item, index) in labelArr" </div>
:key="index" </div>
:label="item.key"
:cont="item.value"
:percentage="((item.value / total) * 100).toFixed(2) + '%'"
:color="colors[index]"
:eStyle="{ height: '8.54rem' }"
></v-label-ctx>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
import { getWtypeWeiBo0528 } from "@/api/WeiboDetails"; import { getAffections } from "@/api/ModelForumDetails";
import createOpt from "./opt"; import createOpt from "./opt";
export default { export default {
name: "mfdContentType", name: "mfdContentType",
data() { data() {
return { return {
load: false, load: false,
form: { form: {
sBrand: "", sBrand: "",
token: "", token: "",
}, sSeriesName: "",
labelArr: [], },
total: 0, labelArr: [],
opt: createOpt(), total: 0,
colors: [ opt: createOpt(),
"#54BF93", colors: [
"#3373CC", "#3373CC",
"#CC9D12", "#54BF93",
"#f15c80", "#CC9D12",
"#e4d354", ],
"#8085e8", };
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
};
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || this.brand;
this.getData();
},
methods: {
getData() {
this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form);
getWtypeWeiBo0528(obj).then((res) => {
let data = res.data || [];
this.doVal(data);
this.load = false;
});
}, },
doVal(arr = []) { created() {
let total = 0; this.form.token = this.getToken;
arr.forEach((ele) => { this.form.sBrand = this.getBrand.brandname || this.brand;
total += ele.value * 1; this.form.sSeriesName = this.getModel.name;
}); this.getData();
this.total = total; },
this.labelArr = arr; methods: {
this.opt = createOpt(this.labelArr, this.colors); getData() {
this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form);
getAffections(obj).then((res) => {
let data = res.data || {};
let arr = [];
let total = 0;
for (let key in data) {
let o = {
key: key,
value: data[key],
};
total += data[key]*1;
arr.push(o);
}
this.labelArr = arr;
this.total = total;
this.opt = createOpt(arr, this.colors);
this.load = false;
});
}
}, },
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.wct-outter { .wct-outter {
width: 618px; width: 618px;
height: 460px; height: 460px;
border: 2px solid #0f2a4d; border: 2px solid #0f2a4d;
margin-left: 16px; margin-left: 16px;
overflow: hidden; overflow: hidden;
.wct-inner { .wct-inner {
width: 100%; width: 100%;
height: calc(100% - 48px); height: calc(100% - 48px);
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
.d1 { .d1 {
width: 280px; width: 280px;
height: 100%; height: 100%;
} }
.d2 { .d2 {
width: 300px; width: 300px;
margin-left: 16px; margin-left: 16px;
}
} }
}
} }
</style> </style>

86
src/views/ModelForumDetails/mfdHeader/index.vue
Unescape View File

@ -1,55 +1,75 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 13:51:57 * @Date: 2021-11-09 13:51:57
* @LastEditTime: 2021-11-09 14:37:48 * @LastEditTime: 2021-11-10 16:08:58
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/mfdHeader/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/mfdHeader/index.vue
--> -->
<template> <template>
<div class="mfdh-outter"> <div class="mfdh-outter" v-loading="load">
<v-label-div title="论坛洞察详情"> <v-label-div title="论坛洞察详情">
<v-btn @click="goback">返回车型洞察</v-btn> <v-btn @click="goback">返回洞察详情</v-btn>
</v-label-div> </v-label-div>
<div class="mfdh-inner"> <div class="mfdh-inner">
<div class="mfdh-in-d1"> <div class="mfdh-in-d1">
奥迪 {{this.form.sBrand|doStr(4)}}
</div> </div>
<span class="mfdh-in-d2">奥迪A8</span> <span class="mfdh-in-d2">{{this.form.sSeriesName|doStr(8)}}</span>
<div class="mfdh-in-d3" style="width: 20rem"> <div class="mfdh-in-d3" style="width: 20rem">
<img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_cbsj.png" /> <img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_cbsj.png" />
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">74,073,195</span> <span class="s1">{{Count}}</span>
<span class="s2">主贴发贴量(条)</span> <span class="s2">主贴发贴量(条)</span>
</div> </div>
</div> </div>
<div class="mfdh-in-d3" style="width: 35rem"> <div class="mfdh-in-d3" style="width: 35rem">
<img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_qrft.png" /> <img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_qrft.png" />
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">100.23</span> <span class="s1">{{qrCount}}</span>
<span class="s2">品牌千人发帖量</span> <span class="s2">品牌千人发帖量</span>
</div> </div>
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">1234.23</span> <span class="s1">{{hyqrCount}}</span>
<span class="s2">行业千人发帖量</span> <span class="s2">行业千人发帖量</span>
</div> </div>
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">5.45<a-icon type="question-circle" style="margin-left: 0.3rem;color: #5a9ebc;"/></span> <span class="s1">{{(qrCount-hyqrCount).toFixed(2)}}
<a-tooltip placement="topRight">
<template slot="title">
<div>千人发帖量算法：</div>
<div>行业千人发帖量=[(行业所有车型主贴量*1000 ÷ 所有阅读量] ÷ 车型数量</div>
<div>千人发帖量=(车型主贴量*1000 ÷ 阅读量</div>
<div>千人发帖量量差=品牌千人发贴量-行业千人发帖量</div>
</template>
<a-icon type="question-circle" style="margin-left: 0.3rem;color: #5a9ebc;" />
</a-tooltip>
</span>
<span class="s2">量差</span> <span class="s2">量差</span>
</div> </div>
</div> </div>
<div class="mfdh-in-d3"> <div class="mfdh-in-d3">
<img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_qrpl.png" /> <img class="mfdh-m1" src="../../../assets/images/ModelInsight/ic_qrpl.png" />
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">100.23</span> <span class="s1">{{replyCount}}</span>
<span class="s2">品牌千人发帖量</span> <span class="s2">品牌千人发帖量</span>
</div> </div>
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">1234.23</span> <span class="s1">{{hyreplyCount}}</span>
<span class="s2">行业千人发帖量</span> <span class="s2">行业千人发帖量</span>
</div> </div>
<div class="mfdh-data"> <div class="mfdh-data">
<span class="s1">5.45<a-icon type="question-circle" style="margin-left: 0.3rem;color: #5a9ebc;"/></span> <span class="s1">{{(replyCount-hyreplyCount).toFixed(2)}}
<a-tooltip placement="topRight">
<template slot="title">
<div>千人发帖量算法：</div>
<div>行业千人评论量=[(行业所有车型评论量*1000 ÷ 所有阅读量] ÷ 车型数量</div>
<div>千人评论量=(车型主贴量*1000 ÷ 阅读量</div>
<div>千人评论量量差=品牌千人评论量-行业千人评论量</div>
</template>
<a-icon type="question-circle" style="margin-left: 0.3rem;color: #5a9ebc;" />
</a-tooltip>
</span>
<span class="s2">量差</span> <span class="s2">量差</span>
</div> </div>
</div> </div>
@ -58,8 +78,48 @@
</template> </template>
<script> <script>
import { getBbsCount } from "@/api/ModelForumDetails";
export default { export default {
name: "mfdHeader", name: "mfdHeader",
data() {
return {
load: false,
form: {
token: "",
sBrand: "",
sSeriesName: "",
},
Count: 0,
qrCount: 0,
hyqrCount: 0,
replyCount: 0,
hyreplyCount: 0,
};
},
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || "奥迪";
this.form.sSeriesName = this.getModel.name;
this.getData();
},
methods: {
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getBbsCount(obj).then((res) => {
let data = res.data;
this.Count = data.Count || 0;
this.qrCount = data.qrCount || 0;
this.hyqrCount = data.hyqrCount || 0;
this.replyCount = data.replyCount || 0;
this.hyreplyCount = data.hyreplyCount || 0;
this.load = false;
});
},
goback() {
this.$router.go(-1)
}
},
}; };
</script> </script>

82
src/views/ModelForumDetails/mfdNegativeTopic/index.vue
Unescape View File

@ -1,14 +1,14 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 15:03:36 * @Date: 2021-11-09 15:03:36
* @LastEditTime: 2021-11-09 15:39:19 * @LastEditTime: 2021-11-10 13:55:27
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue
--> -->
<template> <template>
<div class="mpt-outter"> <div class="mpt-outter" v-loading="load">
<v-label-div title="正面话题分布"> </v-label-div> <v-label-div title="负面话题分布"> </v-label-div>
<div class="mpt-inner"> <div class="mpt-inner">
<div class="d1"> <div class="d1">
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
@ -21,34 +21,70 @@
</template> </template>
<script> <script>
import {getNegativeTopic} from "@/api/ModelForumDetails"
import createOpt from "./opt"; import createOpt from "./opt";
export default { export default {
name: "mfdNegativeTopic", name: "mfdNegativeTopic",
data() { data() {
return { return {
opt: createOpt(), load: false,
config: { form: {
headerBGC: "#0c203b", sBrand: "",
oddRowBGC: "#173b6d", token: "",
evenRowBGC: "rgba(69, 149, 244, 0)", sSeriesName: "",
rowNum: 9,
header: ["TOP10发帖用户"],
data: [
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>']
],
}, },
opt: {},
config: {},
}; };
}, },
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || this.brand;
this.form.sSeriesName = this.getModel.name;
this.getData();
},
methods: {
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
this.load = true;
getNegativeTopic(obj).then((res) => {
let data = res.data;
let optData = data.Data || {};
let UserTo10 = data.UserTo10 || [];
let ds = [];
let dx = [];
let list = [];
let max = 10;
for (let key in optData) {
max = optData[key]*1 > max ? optData[key]*1 : max;
let o = {
name: key,
max: max
}
dx.push(o)
ds.push(optData[key] * 1);
}
this.opt = createOpt(dx, ds);
UserTo10.forEach((ele) => {
let a = [
`<span>用户名：${ele.key}</span>`,
`<span>发帖量：${ele.value}</span>`,
];
list.push(a);
});
this.config = {
headerBGC: "#0c203b",
oddRowBGC: "#173b6d",
evenRowBGC: "rgba(69, 149, 244, 0)",
rowNum: 9,
header: ["TOP10发帖用户"],
data: list,
};
this.load = false;
});
},
}
}; };
</script> </script>

17
src/views/ModelForumDetails/mfdNegativeTopic/opt.js
Unescape View File

@ -6,7 +6,7 @@
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js * @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js
*/ */
export default function createOpt() { export default function createOpt(dx=[], ds=[]) {
return { return {
title: { title: {
text: 'Basic Radar Chart', text: 'Basic Radar Chart',
@ -24,18 +24,7 @@ export default function createOpt() {
}, },
radar: { radar: {
// shape: 'circle', // shape: 'circle',
indicator: [ indicator:dx
{ name: '新车发布', max: 6500 },
{ name: '用车生活', max: 16000 },
{ name: '咨询请教', max: 30000 },
{ name: '本品讨论', max: 38000 },
{ name: '售后服务', max: 52000 },
{ name: '技术加持', max: 25000 },
{ name: '保养作业', max: 25000 },
{ name: '看车提车', max: 25000 },
{ name: '竞品对比', max: 25000 },
{ name: '销售问题', max: 25000 },
]
}, },
series: [ series: [
{ {
@ -43,7 +32,7 @@ export default function createOpt() {
type: 'radar', type: 'radar',
data: [ data: [
{ {
value: [5000, 14000, 28000, 26000, 42000, 21000, 22000, 21000, 19000, 23000], value: ds,
name: '负面话题分布:', name: '负面话题分布:',
itemStyle: { itemStyle: {
color: "rgba(194, 151, 22)", color: "rgba(194, 151, 22)",

79
src/views/ModelForumDetails/mfdPositiveTopic/index.vue
Unescape View File

@ -1,13 +1,13 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-11-09 15:03:36 * @Date: 2021-11-09 15:03:36
* @LastEditTime: 2021-11-09 15:36:13 * @LastEditTime: 2021-11-10 15:23:05
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue * @FilePath: /data-show/src/views/ModelForumDetails/mfdPositiveTopic/index.vue
--> -->
<template> <template>
<div class="mpt-outter"> <div class="mpt-outter" v-loading="load">
<v-label-div title="正面话题分布"> </v-label-div> <v-label-div title="正面话题分布"> </v-label-div>
<div class="mpt-inner"> <div class="mpt-inner">
<div class="d1"> <div class="d1">
@ -21,34 +21,69 @@
</template> </template>
<script> <script>
import { getPositiveTopic } from "@/api/ModelForumDetails";
import createOpt from "./opt"; import createOpt from "./opt";
export default { export default {
name: "mfdPositiveTopic", name: "mfdPositiveTopic",
data() { data() {
return { return {
opt: createOpt(), load: false,
config: { form: {
headerBGC: "#0c203b", sBrand: "",
oddRowBGC: "#173b6d", token: "",
evenRowBGC: "rgba(69, 149, 244, 0)", sSeriesName: "",
rowNum: 9,
header: ["TOP10发帖用户"],
data: [
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>'],
['<span>用户名：懂车生活</span>', '<span>发帖量：38291.6</span>']
],
}, },
opt: {},
config: {},
}; };
}, },
created() {
this.form.token = this.getToken;
this.form.sBrand = this.getBrand.brandname || "奥迪";
this.form.sSeriesName = this.getModel.name;
this.getData();
},
methods: {
getData() {
let obj = Object.assign({}, this.getCtime2, this.form);
let max = 10;
this.load = true;
getPositiveTopic(obj).then((res) => {
let data = res.data;
let optData = data.Data || {};
let UserTo10 = data.UserTo10 || [];
let ds = [];
let dx = [];
let list = [];
for (let key in optData) {
max = optData[key]*1 > max ? optData[key]*1 : max;
let o = {
name: key,
max: max
}
dx.push(o)
ds.push(optData[key] * 1);
}
this.opt = createOpt(dx, ds);
UserTo10.forEach((ele) => {
let a = [
`<span>用户名：${ele.key}</span>`,
`<span>发帖量：${ele.value}</span>`,
];
list.push(a);
});
this.config = {
headerBGC: "#0c203b",
oddRowBGC: "#173b6d",
evenRowBGC: "rgba(69, 149, 244, 0)",
rowNum: 9,
header: ["TOP10发帖用户"],
data: list,
};
this.load = false;
});
},
},
}; };
</script> </script>

19
src/views/ModelForumDetails/mfdPositiveTopic/opt.js
Unescape View File

@ -1,12 +1,12 @@
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-10-12 15:32:24 * @Date: 2021-10-12 15:32:24
* @LastEditTime: 2021-11-09 15:46:21 * @LastEditTime: 2021-11-10 11:55:50
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js * @FilePath: /data-show/src/views/BrandInsight/weiboVolumeTrend/opt.js
*/ */
export default function createOpt() { export default function createOpt(dx=[], ds=[]) {
return { return {
title: { title: {
text: 'Basic Radar Chart', text: 'Basic Radar Chart',
@ -24,18 +24,7 @@ export default function createOpt() {
}, },
radar: { radar: {
// shape: 'circle', // shape: 'circle',
indicator: [ indicator: dx
{ name: '新车发布', max: 6500 },
{ name: '用车生活', max: 16000 },
{ name: '咨询请教', max: 30000 },
{ name: '本品讨论', max: 38000 },
{ name: '售后服务', max: 52000 },
{ name: '技术加持', max: 25000 },
{ name: '保养作业', max: 25000 },
{ name: '看车提车', max: 25000 },
{ name: '竞品对比', max: 25000 },
{ name: '销售问题', max: 25000 },
]
}, },
series: [ series: [
{ {
@ -43,7 +32,7 @@ export default function createOpt() {
type: 'radar', type: 'radar',
data: [ data: [
{ {
value: [5000, 14000, 28000, 26000, 42000, 21000, 22000, 21000, 19000, 23000], value: ds,
name: '正面话题分布:', name: '正面话题分布:',
itemStyle: { itemStyle: {
color: "rgba(48, 110, 195)", color: "rgba(48, 110, 195)",

63
src/views/ModelInsight/mlForumHotTopicDirection/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-12 16:48:36 * @Date: 2021-10-12 16:48:36
* @LastEditTime: 2021-11-01 17:56:17 * @LastEditTime: 2021-11-10 09:34:24
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/forumHotTopicDirection/index.vue * @FilePath: /data-show/src/views/BrandInsight/forumHotTopicDirection/index.vue
@ -14,8 +14,8 @@
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
</div> </div>
<div class="wp-in-d2"> <div class="wp-in-d2">
<vue-scroll> <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="colors[index]" :eStyle="{ height: '7.6rem' }"></v-label-ctx> <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> </vue-scroll>
</div> </div>
</div> </div>
@ -23,9 +23,8 @@
</template> </template>
<script> <script>
import { getAffections2 } from "@/api/ModelInsight";
import {getAffections2} from "@/api/ModelInsight" import createOpt from "./opt";
import createOpt from "./opt"
export default { export default {
name: "mlForumHotTopicDirection", name: "mlForumHotTopicDirection",
props: ["brand", "model"], props: ["brand", "model"],
@ -40,29 +39,7 @@ export default {
opt: {}, opt: {},
labelData: [], labelData: [],
totalData: 0, totalData: 0,
colors: [ };
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
"#54BF93",
"#3373CC",
"#CC9D12",
"#f15c80",
"#e4d354",
"#8085e8",
"#8d4653",
"#91e8e1",
"#f7a35c",
"#90ed7d",
],
}
}, },
watch: { watch: {
model: { model: {
@ -81,30 +58,30 @@ export default {
getData() { getData() {
this.load = true; this.load = true;
let obj = Object.assign({}, this.getCtime2, this.form); let obj = Object.assign({}, this.getCtime2, this.form);
getAffections2(obj).then(res => { getAffections2(obj).then((res) => {
let data = res.data; let data = res.data;
let arr = []; let arr = [];
let total = 0; let total = 0;
for(let key in data) { let color = "";
for (let key in data) {
if (key === "正面") color = "#3373CC";
else if (key === "负面") color = "#CC9D12";
else color = "#54BF93";
let obj = { let obj = {
key: key, key: key,
value: data[key] value: data[key],
} color: color,
};
total += data[key] * 1; total += data[key] * 1;
arr.push(obj) arr.push(obj);
} }
this.totalData = total; this.totalData = total;
this.labelData = arr; this.labelData = arr;
this.opt = createOpt(this.labelData, [ this.opt = createOpt(this.labelData);
"#54BF93",
"#3373CC",
"#CC9D12",
]);
this.load = false; this.load = false;
}) });
} },
} },
}; };
</script> </script>

140
src/views/ModelInsight/mlForumHotTopicDirection/opt.js
Unescape View File

@ -1,78 +1,88 @@
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-10-12 15:14:58 * @Date: 2021-10-12 15:14:58
* @LastEditTime: 2021-11-01 15:36:27 * @LastEditTime: 2021-11-10 09:29:27
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/opt.js * @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/opt.js
*/ */
import * as echarts from "echarts"; import * as echarts from "echarts";
function createData(ds=[], colors=[]) { function createData(ds = []) {
let arr = []; let arr = [];
for(let i = 0; i < ds.length; i++) { for (let i = 0; i < ds.length; i++) {
let ele = ds[i]; let ele = ds[i];
if(ele.value*1 > 0) { let color = "";
let obj = { value: ele.value*1, name: ele.key, itemStyle: { if (ele.key === '正面') {
color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{ color = "#3273cc";
//给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变 } else if (ele.key === '负面') {
//给第一个设置0，第四个设置1，就是垂直渐变 color = "#cc9d10";
offset: 0, } else {
color: 'black' color = "#53bf92";
}, { }
offset: 1, if (ele.value * 1 > 0) {
color: colors[i] let obj = {
}]) value: ele.value * 1, name: ele.key, itemStyle: {
}}; color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
arr.push(obj) //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
} //给第一个设置0，第四个设置1，就是垂直渐变
offset: 0,
color: 'black'
}, {
offset: 1,
color: color
}])
}
};
arr.push(obj)
}
} }
return arr; return arr;
} }
export default function createOpt(ds=[], colors=[]) { export default function createOpt(ds = []) {
const data = createData(ds,colors) const data = createData(ds)
return { return {
series: [ series: [
{ {
name: 'Access From0', name: 'Access From0',
type: 'pie', type: 'pie',
radius: ['65%', '80%'], radius: ['65%', '80%'],
avoidLabelOverlap: false, avoidLabelOverlap: false,
label: { label: {
show: false, show: false,
position: 'center', position: 'center',
color: "#ffff", color: "#ffff",
lineHeight: 30 lineHeight: 30
}, },
emphasis: { emphasis: {
label: { label: {
show: true, show: true,
fontSize: '20', fontSize: '20',
color: "#ffff", color: "#ffff",
formatter: function (p) { formatter: function (p) {
return `${p.data.name}\n${p.percent}%\n${p.data.value}` return `${p.data.name}\n${p.percent}%\n${p.data.value}`
} }
} }
}, },
labelLine: { labelLine: {
show: false show: false
}, },
data: data data: data
}, },
{ {
name: 'Access From1', name: 'Access From1',
type: 'pie', type: 'pie',
radius: ['86%', '94%'], radius: ['86%', '94%'],
avoidLabelOverlap: false, avoidLabelOverlap: false,
label: { label: {
show: false, show: false,
position: 'center' position: 'center'
}, },
labelLine: { labelLine: {
show: false show: false
}, },
center: ['50%', '50%'],//边框位置 center: ['50%', '50%'],//边框位置
data: data data: data
} }
] ]
} }
} }

18
src/views/ModelInsight/mlWeiboPortraits/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-12 15:06:47 * @Date: 2021-10-12 15:06:47
* @LastEditTime: 2021-11-01 18:02:48 * @LastEditTime: 2021-11-10 09:42:52
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/index.vue * @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/index.vue
@ -16,7 +16,7 @@
<v-echarts :opt="opt"></v-echarts> <v-echarts :opt="opt"></v-echarts>
</div> </div>
<div class="wp-in-d2"> <div class="wp-in-d2">
<vue-scroll> <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="colors[index]" :eStyle="{ height: '7.6rem' }"></v-label-ctx> <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>
</vue-scroll> </vue-scroll>
</div> </div>
@ -44,10 +44,10 @@ export default {
opt: {}, opt: {},
labelData: [], labelData: [],
totalData: 0, totalData: 0,
colors: [ colors: [
"#54BF93",
"#3373CC", "#3373CC",
"#CC9D12", "#CC9D12",
"#54BF93",
"#f15c80", "#f15c80",
"#e4d354", "#e4d354",
"#8085e8", "#8085e8",
@ -68,7 +68,7 @@ export default {
], ],
}; };
}, },
watch: { watch: {
model: { model: {
handler(val) { handler(val) {
if (val) { if (val) {
@ -91,16 +91,12 @@ export default {
total += ele.value * 1; total += ele.value * 1;
}); });
this.totalData = total; this.totalData = total;
this.opt = createOpt(this.sex, [ this.opt = createOpt(this.sex, this.colors);
"#54BF93",
"#3373CC",
"#CC9D12",
]);
} else if (n === 1) { } else if (n === 1) {
this.labelData = this.attestation; this.labelData = this.attestation;
let total = 0; let total = 0;
this.attestation.forEach((ele) => { this.attestation.forEach((ele) => {
total += ele.value * 1; total += ele.value * 1;
}); });
this.totalData = total; this.totalData = total;
this.opt = createOpt(this.attestation, this.colors); this.opt = createOpt(this.attestation, this.colors);

3
src/views/ModelInsight/mlWeiboPortraits/opt.js
Unescape View File

@ -1,7 +1,7 @@
/* /*
* @Author: your name * @Author: your name
* @Date: 2021-10-12 15:14:58 * @Date: 2021-10-12 15:14:58
* @LastEditTime: 2021-11-01 15:36:27 * @LastEditTime: 2021-11-10 09:38:52
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/opt.js * @FilePath: /data-show/src/views/BrandInsight/weiboPortraits/opt.js
@ -9,6 +9,7 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
function createData(ds=[], colors=[]) { function createData(ds=[], colors=[]) {
let arr = []; let arr = [];
console.log(ds)
for(let i = 0; i < ds.length; i++) { for(let i = 0; i < ds.length; i++) {
let ele = ds[i]; let ele = ds[i];
if(ele.value*1 > 0) { if(ele.value*1 > 0) {

6
src/views/WeiboDetails/weiboUserActiveArea/index.vue
Unescape View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2021-10-14 11:25:20 * @Date: 2021-10-14 11:25:20
* @LastEditTime: 2021-11-09 13:21:04 * @LastEditTime: 2021-11-10 17:03:43
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue * @FilePath: /data-show/src/views/WeiboDetails/weiboUserActiveArea/index.vue
@ -53,8 +53,8 @@ export default {
let ds = []; //数据 let ds = []; //数据
arr.forEach((ele) => { arr.forEach((ele) => {
let name = ele.name || ""; let name = ele.name || "";
if(name.indexOf('省') === -1) { if(name.indexOf('省') != -1) {
ele.name = ele.name + '市' ele.name = ele.name.replace('省','')
} }
let value = ele.value; let value = ele.value;
dx.push(ele.name); dx.push(ele.name);

Write Preview
Loading…
Cancel
Save