prod
lily.zhang 3 years ago
parent 7b54c62959
commit 2458fb9d85

@ -1,3 +1,11 @@
/*
* @Author: your name
* @Date: 2021-10-26 09:12:35
* @LastEditTime: 2021-10-26 09:18:40
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/api/MarketingAnalysis/index.js
*/
import httpService from "@/request"
// 品牌声量TOP20排行
export function getBrandSourceType0528(params) {

@ -141,6 +141,11 @@ export default {
},
//
handlerType(obj) {
if(obj.key === 'marketingAnalysis') {
this.setHeaderType(2)
} else {
this.setHeaderType(1)
}
this.$router.push({path: `/${obj.key}`})
},
//

@ -0,0 +1,248 @@
<template>
<div class="iH-outter">
<div class="iH-left">
<a-dropdown placement="bottomLeft">
<img class="iH-left-img1" src="../../assets/images/Index/ic_cd.png" />
<a-menu slot="overlay" @click="handlerType">
<a-menu-item key="index">
<span>行业洞察</span>
</a-menu-item>
<a-menu-item key="brandInsight">
<span>品牌洞察</span>
</a-menu-item>
<a-menu-item key="modelInsight">
<span>车型洞察</span>
</a-menu-item>
<a-menu-item key="eventInsight">
<span>事件洞察</span>
</a-menu-item>
<a-menu-item key="marketingAnalysis">
<span>营销分析</span>
</a-menu-item>
</a-menu>
</a-dropdown>
<span class="iH-left-s1">菜单</span>
<a-select :default-value="1" :size="$vuiSize" style="width: 120px; margin-left: 40px; margin-right: 8px" v-model="selVal" @change="handlerSelect">
<a-select-option :style="{ color: '#fff' }" v-for="item in selDatas" :value="item.key" :key="item.key">
{{ item.key }}
</a-select-option>
</a-select>
</div>
<div class="iH-center">
<img src="../../assets/images/Index/img_toubuyi.png" width="100%" height="100%" />
</div>
<div class="iH-right">
<span class="s1">{{ clock }}</span>
<span class="s2">{{ sClock }}</span>
<span class="s2">{{ week }}</span>
<img class="m1" src="../../assets/images/Index/ic_ry.png" width="24px" height="24px" />
<span class="s3">{{getUser.UserName}}</span>
<a-dropdown placement="bottomRight">
<a class="ant-dropdown-link">
<a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item @click="handlerMyself">
<span>个人中心</span>
</a-menu-item>
<a-menu-item @click="layout">
<span>退出</span>
</a-menu-item>
</a-menu>
</a-dropdown>
</div>
</div>
</template>
<script>
import {getCheZhuTime0528} from "@/api/home"
export default {
name: "iHeaderMa",
inject: ['reload'],
data() {
return {
selVal: '',
clock: "",
sClock: "",
week: "",
form: {
sTimeType: 4,
sStartTime: "",
sEndTime: ""
},
selDatas: [
],
};
},
created() {
this.getSelect()
},
mounted() {
},
methods: {
//
getSelect() {
getCheZhuTime0528().then(res => {
this.selDatas = res.data
this.selVal = this.selDatas[0].key;
this.form.sStartTime = this.selDatas[0].starttime;
this.form.sEndTime = this.selDatas[0].endtime;
this.setCtime(this.form);
})
},
//
handlerSelect(key) {
let n = this.selDatas.findIndex(ele => {
return ele.key === key
})
let obj = this.selDatas[n];
this.form.sStartTime = obj.starttime;
this.form.sEndTime = obj.endtime;
this.setCtime(this.form);
this.reload();
},
//
getDatetime() {
let now = new Date();
let weeks = new Array(
"星期日",
"星期一",
"星期二",
"星期三",
"星期四",
"星期五",
"星期六"
);
let year = now.getFullYear();
let month = now.getMonth() + 1;
let day = now.getDate();
let hh = now.getHours();
let mm = now.getMinutes();
let ss = now.getSeconds();
let clock = year + "-";
let sClock = "";
let dayw = now.getDay();
let week = weeks[dayw];
if (month < 10) clock += "0";
clock += month + "-";
if (day < 10) clock += "0";
clock += day + " ";
if (hh < 10) sClock += "0";
sClock += hh + ":";
if (mm < 10) sClock += "0";
sClock += mm + ":";
if (ss < 10) sClock += "0";
sClock += ss;
this.clock = clock;
this.sClock = sClock;
this.week = week;
return { clock: clock, sClock: sClock, week: week };
},
//
handlerMyself() {
this.$router.push("/myself");
},
//
handlerType(obj) {
if(obj.key === 'marketingAnalysis') {
this.setHeaderType(2)
} else {
this.setHeaderType(1)
}
this.$router.push({path: `/${obj.key}`})
},
// 退
layout() {
this.setToken("");
this.setUser({});
this.$router.replace("/login");
}
},
};
</script>
<style lang="less" scoped>
.iH-outter {
display: flex;
justify-content: flex-start;
width: 100%;
height: 90px;
background: url("../../assets/images/Index/img_toubuer.png");
.iH-left {
display: flex;
width: 572px;
height: 60px;
margin-left: 22px;
justify-content: flex-start;
align-items: center;
flex-shrink: 0;
.iH-left-img1 {
width: 24px;
height: 24px;
cursor: pointer;
}
.iH-left-s1 {
display: block;
font-size: 14px;
font-weight: bold;
color: #ffffff;
margin-left: 8px;
}
}
.iH-center {
position: absolute;
width: 606px;
height: 80px;
top: 0px;
left: 50%;
transform: translate(-50%, 0);
}
.iH-right {
position: absolute;
display: flex;
width: 436px;
height: 60px;
justify-content: flex-start;
align-items: center;
top: 0px;
right: 19px;
flex-shrink: 0;
.s1 {
display: inline-block;
font-size: 16px;
color: #ffffff;
}
.s2 {
display: inline-block;
font-size: 16px;
color: #ffffff;
margin-left: 24px;
}
.s3 {
display: inline-block;
font-size: 14px;
color: #ffffff;
margin-left: 8px;
}
.m1 {
display: inline-block;
margin-left: 80px;
margin-right: 8px;
}
}
}
.ant-dropdown-link {
color: #63aecc;
margin-left: 11px;
/deep/ .anticon svg {
font-size: 20px !important;
margin-top: 5px;
}
}
</style>

@ -1,14 +1,15 @@
<!--
* @Author: your name
* @Date: 2021-10-13 14:25:26
* @LastEditTime: 2021-10-23 12:57:20
* @LastEditTime: 2021-10-26 10:28:52
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/lycomponents/iLayout/index.vue
-->
<template>
<div class="layout-container">
<iHeader></iHeader>
<iHeader v-if="getHeaderType == 1"></iHeader>
<iHeaderMa v-if="getHeaderType == 2"></iHeaderMa>
<div class="layout-body">
<vue-scroll>
<router-view v-if="isRouterAlive"></router-view>
@ -29,6 +30,9 @@ export default {
return {
isRouterAlive: true
}
},
created() {
},
methods: {
reload() {

@ -1,19 +1,21 @@
/*
* @Author: your name
* @Date: 2021-10-12 10:28:00
* @LastEditTime: 2021-10-15 10:46:37
* @LastEditTime: 2021-10-26 10:06:13
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/components/index.js
*/
import iHeader from "@/lycomponents/iHeader";
import iSwitchBrand from "@/lycomponents/iSwitchBrand";
import iHeaderMa from "@/lycomponents/iHeaderMa"
export default {
install(Vue) {
Vue.mixin({
components: {
iHeader,
iSwitchBrand
iSwitchBrand,
iHeaderMa
}
})
}

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:56:13
* @LastEditTime: 2021-10-22 10:46:21
* @LastEditTime: 2021-10-26 10:09:33
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/mixins/index.js
@ -15,10 +15,10 @@ export default {
'loading': Loading
},
computed: {
...mapGetters(['getZoom','getToken', 'getUser', 'getAccount', 'getCommTime'])
...mapGetters(['getZoom','getToken', 'getUser', 'getAccount', 'getCommTime', 'getCtime', 'getHeaderType'])
},
methods: {
...mapActions(["setZoom", 'setToken', 'setUser', 'setAccount', 'setCommTime'])
...mapActions(["setZoom", 'setToken', 'setUser', 'setAccount', 'setCommTime','setCtime', 'setHeaderType'])
}
})
}

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:36:49
* @LastEditTime: 2021-10-20 16:50:37
* @LastEditTime: 2021-10-26 10:01:24
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/actions.js
@ -21,6 +21,12 @@ const actions = {
},
setCommTime: ({commit}, log) => {
commit('setCommTime', log)
}
},
setCtime: ({commit}, log) => {
commit('setCtime', log)
},
setHeaderType: ({commit}, log) => {
commit('setHeaderType', log)
},
}
export default actions

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:06
* @LastEditTime: 2021-10-20 16:52:59
* @LastEditTime: 2021-10-26 10:04:20
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/getters.js
@ -21,6 +21,12 @@ const getters = {
},
getCommTime(state) {
return state.commTime
},
getCtime(state) {
return state.ctime
},
getHeaderType(state) {
return state.headerType
}
}
export default getters

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:35
* @LastEditTime: 2021-10-20 16:59:00
* @LastEditTime: 2021-10-26 10:02:55
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/mutations.js
@ -29,6 +29,16 @@ const mutations = {
state.commTime = obj;
let str = JSON.stringify(obj);
sessionStorage.setItem('commTime', str);
},
setCtime: (state, log) => {
let obj = Object.assign(state.commTime, log);
state.ctime = obj;
let str = JSON.stringify(obj);
sessionStorage.setItem('ctime', str);
},
setHeaderType: (state, log) => {
state.headerType = log;
sessionStorage.setItem('headerType', log);
}
}

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-12 13:37:50
* @LastEditTime: 2021-10-23 13:56:09
* @LastEditTime: 2021-10-26 10:03:54
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/store/state.js
@ -16,6 +16,8 @@ const state = {
token: sessionStorage.getItem('token') || "",
user: JSON.parse(sessionStorage.getItem('user')) || {},
account: JSON.parse(localStorage.getItem('account')) || {},
commTime: JSON.parse(sessionStorage.getItem('commTime')) || commTime
commTime: JSON.parse(sessionStorage.getItem('commTime')) || commTime,
ctime: JSON.parse(sessionStorage.getItem('ctime')) || {},
headerType: sessionStorage.getItem('headerType') || 1,
}
export default state;

@ -1,7 +1,7 @@
/*
* @Author: your name
* @Date: 2021-10-08 10:13:32
* @LastEditTime: 2021-10-15 12:13:25
* @LastEditTime: 2021-10-26 09:30:30
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/utils/gol/index.js
@ -37,6 +37,9 @@ export function createSingleColumnar(dx=[], ds=[], color='#3373CC') {
},
xAxis: {
type: "category",
axisLabel :{
interval:0
},
axisTick: {
show: false,
},

@ -1,13 +1,13 @@
<!--
* @Author: your name
* @Date: 2021-10-25 11:34:57
* @LastEditTime: 2021-10-25 11:43:26
* @LastEditTime: 2021-10-26 10:45:53
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/MarketingAnalysis/brandSalesRankingTOP10Ranking/index.vue
-->
<template>
<div class="bsrt-outter">
<div class="bsrt-outter" v-loading="load">
<v-label-div title="品牌销量榜TOP10排行">
</v-label-div>
<div class="bsrt-inner">
@ -17,41 +17,51 @@
</template>
<script>
import {createSingleColumnar} from "@/utils/gol/singleColumnar"
import {getCheZhuBrandMKTCount0528} from "@/api/MarketingAnalysis"
import { createSingleColumnar } from "@/utils/gol/singleColumnar";
import { getCheZhuBrandMKTCount0528 } from "@/api/MarketingAnalysis";
export default {
name: "brandSalesRankingTOP10Ranking",
data() {
return {
opt: createSingleColumnar(['微博','汽车之家', '易车', '搜狐汽车', '懂车帝', '今日头条', '抖音', '微信', '一点资讯', '快手'], [6300, 6000, 5800, 5000, 4800, 4000, 3800, 3000, 2800, 2000], '#53bd90')
}
load: false,
form: {
token: ""
},
opt: {}
};
},
created() {
this.getData()
},
methods: {
//
handlerChange(n) {
this.form.sQueryType = n + 1;
this.getData()
created() {
this.form.token = this.getToken;
this.getData();
},
//
getData() {
let obj = Object.assign({}, this.getCommTime, this.form);
getCheZhuBrandMKTCount0528(obj).then(res => {
let data = res.data;
this.pdata = data;
})
methods: {
//
getData() {
this.load = true;
let obj = Object.assign({}, this.getCTime, this.form);
getCheZhuBrandMKTCount0528(obj).then((res) => {
let data = res.data;
let dx = [];
let ds = [];
data.forEach(ele => {
let key = ele.key;
let value = ele.value;
dx.push(key);
ds.push(value)
})
this.opt = createSingleColumnar(dx, ds, '#53bd90')
this.load = false;
});
},
},
}
}
};
</script>
<style lang="less" scoped>
.bsrt-outter {
width: 936px;
height: 480px;
border: 2px solid #0F2A4D;
border: 2px solid #0f2a4d;
margin-left: 16px;
.bsrt-inner {
width: 100%;

@ -1,61 +1,71 @@
<!--
* @Author: your name
* @Date: 2021-10-25 11:03:30
* @LastEditTime: 2021-10-25 11:13:21
* @LastEditTime: 2021-10-26 10:45:27
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/MarketingAnalysis/brandVolumeTOP10/index.vue
-->
<template>
<div class="bvt-outter" >
<div class="bvt-outter" v-loading="load">
<v-label-div title="品牌声量TOP10">
<v-btn @click="goPath"></v-btn>
</v-label-div>
<div class="bvt-inner">
<v-echarts :opt="opt"></v-echarts>
<v-pagination :data="pdata" :style="{position: 'absolute', right: '2px', bottom: '2px'}" @change="handlerData"></v-pagination>
</div>
</div>
</template>
<script>
import createOpt from "./opt"
import {getBrandSourceType0528} from "@/api/MarketingAnalysis"
import createOpt from "./opt";
import { getBrandSourceType0528 } from "@/api/MarketingAnalysis";
export default {
name: "brandVolumeTOP10",
data() {
return {
opt: createOpt()
}
load: false,
form: {
token: ""
},
opt: {}
};
},
created() {
this.getData()
},
methods: {
//
handlerChange(n) {
this.form.sQueryType = n + 1;
this.getData()
created() {
this.form.token = this.getToken;
this.getData();
},
methods: {
//
getData() {
let obj = Object.assign({}, this.getCTime, this.form);
this.load = true;
getBrandSourceType0528(obj).then((res) => {
let data = res.data || [];
let dx = [];
let ds = [];
data.forEach(ele => {
let key = ele.key;
let value = ele.value;
dx.push(key);
ds.push(value);
});
this.opt = createOpt(dx, ds)
this.load = false;
});
},
goPath() {
//
getData() {
let obj = Object.assign({}, this.getCommTime, this.form);
getBrandSourceType0528(obj).then(res => {
let data = res.data;
this.pdata = data;
})
},
},
}
}
};
</script>
<style lang="less" scoped>
.bvt-outter {
width: 100%;
height: 472px;
border: 2px solid #0F2A4D;
border: 2px solid #0f2a4d;
.bvt-inner {
width: 100%;
height: calc(100% - 48px);

@ -1,12 +1,41 @@
/*
* @Author: your name
* @Date: 2021-10-09 11:01:19
* @LastEditTime: 2021-10-25 11:18:51
* @LastEditTime: 2021-10-26 10:40:34
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/Index/spreadTheSound/opt.js
*/
export default function createOpt() {
function createData(ds = []) {
let arr = [];
for (let i = 0; i < ds.length; i++) {
let arr1 = ds[i];
for (let j = 0; j < arr1.length; j++) {
let n = arr.findIndex(ele => {
return ele.name === arr1[j].key;
})
if(n === -1) {
let obj =
{
name: arr1[j].key,
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [arr1[j].value]
}
arr.push(obj)
} else {
arr[n].data.push(arr1[j].value)
}
}
}
return arr;
}
export default function createOpt(dx=[], ds=[]) {
const data = createData(ds);
return {
grid: {
left: 16,
@ -43,7 +72,7 @@ export default function createOpt() {
color: "#fff",
},
},
data: ['长安', '大众', '宝马', '奔驰', '丰田', '吉利', '奥迪', '日产', '哈弗', '雪弗兰']
data: dx
},
yAxis: {
type: 'value',
@ -60,68 +89,7 @@ export default function createOpt() {
},
},
},
series: [
{
name: '新闻',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [320, 302, 301, 334, 390, 400, 410,420,405,421]
},
{
name: '论坛',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [120, 132, 101, 134, 90, 400, 410,420,405,421]
},
{
name: '微信',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [220, 182, 191, 234, 290, 400, 410,420,405,421]
},
{
name: '微博',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [150, 212, 201, 154, 190, 400, 410,420,405,421]
},
{
name: 'APP',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [820, 832, 901, 934, 1290, 400, 410,420,405,421]
},
{
name: '其他',
type: 'bar',
stack: 'total',
barWidth: 24,
emphasis: {
focus: 'series'
},
data: [820, 832, 901, 934, 1290, 400, 410,420,405,421]
}
]
series: data
}
}

@ -1,14 +1,14 @@
<!--
* @Author: your name
* @Date: 2021-10-25 11:21:38
* @LastEditTime: 2021-10-25 11:33:16
* @LastEditTime: 2021-10-26 10:29:22
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /data-show/src/views/MarketingAnalysis/keyActiveMediaTOP10Ranking/index.vue
-->
<template>
<div class="kamt-outter">
<div class="kamt-outter" v-loading="load">
<v-label-div title="重点活跃媒体TOP10排行">
</v-label-div>
<div class="kamt-inner">
@ -18,43 +18,49 @@
</template>
<script>
import {createSingleColumnar} from "@/utils/gol/singleColumnar"
import {getWebsite} from "@/api/MarketingAnalysis"
import { createSingleColumnar } from "@/utils/gol/singleColumnar";
import { getWebsite } from "@/api/MarketingAnalysis";
export default {
name: "keyActiveMediaTOP10Ranking",
data() {
return {
opt: createSingleColumnar(['微博','汽车之家', '易车', '搜狐汽车', '懂车帝', '今日头条', '抖音', '微信', '一点资讯', '快手'], [6300, 6000, 5800, 5000, 4800, 4000, 3800, 3000, 2800, 2000])
}
load: false,
form: {
token: ""
},
opt: {},
};
},
created() {
this.getData()
},
methods: {
//
handlerChange(n) {
this.form.sQueryType = n + 1;
this.getData()
created() {
this.form.token = this.getToken;
this.getData();
},
//
getData() {
let obj = Object.assign({}, this.getCommTime, this.form);
getWebsite(obj).then(res => {
let data = res.data;
this.pdata = data;
})
methods: {
//
getData() {
this.load = true;
let obj = Object.assign({}, this.getCTime, this.form);
getWebsite(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;
});
},
},
}
}
};
</script>
<style lang="less" scoped>
.kamt-outter {
width: 936px;
height: 480px;
border: 2px solid #0F2A4D;
border: 2px solid #0f2a4d;
.kamt-inner {
width: 100%;
height: calc(100% - 48px);

Loading…
Cancel
Save