|
|
|
|
@ -8,10 +8,6 @@
|
|
|
|
|
<img src="@/assets/ic_renwu_slices/ic_renwu.png" alt="" />
|
|
|
|
|
<span style="margin-left: 12px;width: 120px;line-height: 34px">总任务数</span>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="top-number-content-tag">
|
|
|
|
|
<span class="average" style="padding: 10px">日均</span>
|
|
|
|
|
<span class="average-number" style="padding: 10px">15000</span>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="top-number-total">{{totalData.taskNum || 0}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -24,10 +20,6 @@
|
|
|
|
|
<img src="@/assets/ic_sucai_slices/ic_sucai.png" alt="" />
|
|
|
|
|
<span style="margin-left: 12px;width: 120px;line-height: 34px">总素材数</span>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="top-number-content-tag">
|
|
|
|
|
<span class="average" style="padding: 10px">日均</span>
|
|
|
|
|
<span class="average-number" style="padding: 10px">15000</span>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="top-number-total">{{totalData.referenceNum || 0}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -40,10 +32,6 @@
|
|
|
|
|
<img src="@/assets/ic_xiansuo_slices/ic_xiansuo.png" alt="" />
|
|
|
|
|
<span style="margin-left: 12px;width: 120px;line-height: 34px">总线索数</span>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="top-number-content-tag">
|
|
|
|
|
<span class="average" style="padding: 10px">日均</span>
|
|
|
|
|
<span class="average-number" style="padding: 10px">15000</span>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="top-number-total">{{totalData.customerActionNoteNum || 0}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -124,16 +112,23 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="middle-charts" style="margin-top: 24px">
|
|
|
|
|
<el-tabs v-model="playNumFormType" @tab-change="statusChange">
|
|
|
|
|
<!-- <el-tabs v-model="playNumFormType" @tab-change="statusChange">
|
|
|
|
|
<el-tab-pane label="播放" :name="1"></el-tab-pane>
|
|
|
|
|
<el-tab-pane label="点赞" :name="2"></el-tab-pane>
|
|
|
|
|
<el-tab-pane label="收藏" :name="3"></el-tab-pane>
|
|
|
|
|
<el-tab-pane label="评论" :name="4"></el-tab-pane>
|
|
|
|
|
<el-tab-pane label="转发" :name="5"></el-tab-pane>
|
|
|
|
|
<el-tab-pane label="推荐" :name="6"></el-tab-pane>
|
|
|
|
|
</el-tabs>
|
|
|
|
|
</el-tabs> -->
|
|
|
|
|
<div class="middle-tab">
|
|
|
|
|
<el-form :inline="true">
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-radio-group style="margin-left: 12px" @change="changeDateType" v-model="playNumForm.dateCondition" size="default">
|
|
|
|
|
<el-radio-button :label="2">本周</el-radio-button>
|
|
|
|
|
<el-radio-button :label="3">本月</el-radio-button>
|
|
|
|
|
<el-radio-button :label="4">全年</el-radio-button>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="用户">
|
|
|
|
|
<el-select clearable v-model="playNumForm.userId" @change="statusChange">
|
|
|
|
|
<el-option v-for="(item) in userList" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
|
|
|
|
@ -144,13 +139,6 @@
|
|
|
|
|
<el-option v-for="(item) in taskList" :key="item.id" :label="item.title" :value="item.id"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-radio-group style="margin-left: 12px" @change="changeDateType" v-model="playNumForm.dateCondition" size="default">
|
|
|
|
|
<el-radio-button :label="2">本周</el-radio-button>
|
|
|
|
|
<el-radio-button :label="3">本月</el-radio-button>
|
|
|
|
|
<el-radio-button :label="4">全年</el-radio-button>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-date-picker style="margin-left: 12px" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" v-model="selTime" @change="dateRangeChange"></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
@ -177,6 +165,7 @@
|
|
|
|
|
<el-radio-button :label="2">本周</el-radio-button>
|
|
|
|
|
<el-radio-button :label="3">本月</el-radio-button>
|
|
|
|
|
<el-radio-button :label="4">全年</el-radio-button>
|
|
|
|
|
<el-radio-button :label="null">全部</el-radio-button>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
<!-- <el-button size="default" @click="changeRankDateType(2)" text>本周</el-button>
|
|
|
|
|
<el-button size="default" @click="changeRankDateType(3)" text>本月</el-button>
|
|
|
|
|
@ -208,7 +197,7 @@
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import * as echarts from "echarts";
|
|
|
|
|
import {defineComponent, reactive, ref, getCurrentInstance} from 'vue'
|
|
|
|
|
import {defineComponent, reactive, ref, getCurrentInstance, shallowRef} from 'vue'
|
|
|
|
|
export default defineComponent({
|
|
|
|
|
name: 'v-home',
|
|
|
|
|
setup() {
|
|
|
|
|
@ -227,7 +216,7 @@ export default defineComponent({
|
|
|
|
|
const totalData = ref({});
|
|
|
|
|
const tableData = ref([]);
|
|
|
|
|
const selTime = ref([]);
|
|
|
|
|
const myChart = ref();
|
|
|
|
|
const myChart = shallowRef(null); //图表对象使用shallowRef否则tooltip不显示
|
|
|
|
|
const userList = ref([]);
|
|
|
|
|
const taskList = ref([]);
|
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
|
|
@ -266,7 +255,7 @@ export default defineComponent({
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
},
|
|
|
|
|
getTotal() {
|
|
|
|
|
this.proxy.$post("/statistics/data1", {}).then(res => {
|
|
|
|
|
this.proxy.$post("/statistics/data1", this.playNumForm).then(res => {
|
|
|
|
|
if(res.code == 200) {
|
|
|
|
|
this.totalData = res.data
|
|
|
|
|
} else {
|
|
|
|
|
@ -295,53 +284,76 @@ export default defineComponent({
|
|
|
|
|
}
|
|
|
|
|
this.myChart = echarts.init(document.getElementById('chartItem'));
|
|
|
|
|
this.proxy.$post("/statistics/data2", this.playNumForm).then(res => {
|
|
|
|
|
let dx = []; let dy = [];
|
|
|
|
|
res.data.forEach(ele => {
|
|
|
|
|
dx.push(ele.dat);
|
|
|
|
|
if(this.playNumFormType == 1) {
|
|
|
|
|
dy.push(ele.playNumSum)
|
|
|
|
|
} else if(this.playNumFormType == 2) {
|
|
|
|
|
dy.push(ele.commendNumSum)
|
|
|
|
|
} else if(this.playNumFormType == 3) {
|
|
|
|
|
dy.push(ele.collectionNumSum)
|
|
|
|
|
} else if(this.playNumFormType == 4) {
|
|
|
|
|
dy.push(ele.commentNumSum)
|
|
|
|
|
} else if(this.playNumFormType == 5) {
|
|
|
|
|
dy.push(ele.reSendNumSum)
|
|
|
|
|
} else if(this.playNumFormType == 6) {
|
|
|
|
|
dy.push(ele.recommendNumSum)
|
|
|
|
|
};
|
|
|
|
|
let data = res.data;
|
|
|
|
|
let dx = []; let playNumSum = [];let commendNumSum = [];
|
|
|
|
|
let collectionNumSum = []; let commentNumSum = []; let reSendNumSum = []; let recommendNumSum = [];
|
|
|
|
|
data.forEach(ele => {
|
|
|
|
|
dx.push(ele.dat)
|
|
|
|
|
for(let key in ele) {
|
|
|
|
|
switch(key) {
|
|
|
|
|
case 'playNumSum':
|
|
|
|
|
playNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
case 'commendNumSum':
|
|
|
|
|
commendNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
case 'collectionNumSum':
|
|
|
|
|
collectionNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
case 'commentNumSum':
|
|
|
|
|
commentNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
case 'reSendNumSum':
|
|
|
|
|
reSendNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
case 'recommendNumSum':
|
|
|
|
|
recommendNumSum.push(ele[key]);
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
this.setOption(dx,dy);
|
|
|
|
|
let ds = [
|
|
|
|
|
{name: '播放',type: 'line', stack: 'total', data: playNumSum},
|
|
|
|
|
{name: '点赞',type: 'line', stack: 'total', data: commendNumSum},
|
|
|
|
|
{name: '收藏',type: 'line', stack: 'total', data: collectionNumSum},
|
|
|
|
|
{name: '评论',type: 'line', stack: 'total', data: commentNumSum},
|
|
|
|
|
{name: '转发',type: 'line', stack: 'total', data: reSendNumSum},
|
|
|
|
|
{name: '推荐',type: 'line', stack: 'total', data: recommendNumSum},
|
|
|
|
|
]
|
|
|
|
|
// res.data.forEach(ele => {
|
|
|
|
|
// dx.push(ele.dat);
|
|
|
|
|
// if(this.playNumFormType == 1) {
|
|
|
|
|
// dy.push(ele.playNumSum)
|
|
|
|
|
// } else if(this.playNumFormType == 2) {
|
|
|
|
|
// dy.push(ele.commendNumSum)
|
|
|
|
|
// } else if(this.playNumFormType == 3) {
|
|
|
|
|
// dy.push(ele.collectionNumSum)
|
|
|
|
|
// } else if(this.playNumFormType == 4) {
|
|
|
|
|
// dy.push(ele.commentNumSum)
|
|
|
|
|
// } else if(this.playNumFormType == 5) {
|
|
|
|
|
// dy.push(ele.reSendNumSum)
|
|
|
|
|
// } else if(this.playNumFormType == 6) {
|
|
|
|
|
// dy.push(ele.recommendNumSum)
|
|
|
|
|
// };
|
|
|
|
|
// });
|
|
|
|
|
this.setOption(dx,ds);
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
},
|
|
|
|
|
setOption(dx, dy) {
|
|
|
|
|
setOption(dx, ds) {
|
|
|
|
|
//type数据类型 1播放2点赞3收藏4评论5转发6推荐，date日期类型 1今日2本周3本月4全年
|
|
|
|
|
let option = {
|
|
|
|
|
xAxis: [{ data: dx }],
|
|
|
|
|
xAxis: { data: dx ,type: 'category'},
|
|
|
|
|
yAxis: [{
|
|
|
|
|
type: 'value'
|
|
|
|
|
}],
|
|
|
|
|
legend: {
|
|
|
|
|
data: ['播放','点赞','收藏','评论','转发','推荐']
|
|
|
|
|
},
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: 'axis',
|
|
|
|
|
axisPointer: { type: 'shadow' }
|
|
|
|
|
},
|
|
|
|
|
grid: { containLabel: true },
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
type: 'bar',
|
|
|
|
|
data: dy,
|
|
|
|
|
barWidth: 20,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: 'rgb(61,147,253)',
|
|
|
|
|
},
|
|
|
|
|
label: {
|
|
|
|
|
show: true,
|
|
|
|
|
position: 'top',
|
|
|
|
|
textStyle: { fontSize: 12 }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
series: ds
|
|
|
|
|
};
|
|
|
|
|
this.myChart.setOption(option);
|
|
|
|
|
},
|
|
|
|
|
@ -357,9 +369,7 @@ export default defineComponent({
|
|
|
|
|
},
|
|
|
|
|
toExcel() {
|
|
|
|
|
let date = new Date()
|
|
|
|
|
this.proxy.$download("/statistics/excel2", this.playNumForm, '播放量趋势'+date.toLocaleString()+'.xlsx').then(res => {
|
|
|
|
|
console.log(res);
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
this.proxy.$download("/statistics/excel2", this.playNumForm, '播放量趋势'+date.toLocaleString()+'.xlsx')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
