|
@@ -1,15 +1,27 @@
|
|
|
<template>
|
|
|
<div class="vsummary">
|
|
|
<div class="xiangmuxuanze" >
|
|
|
- <span style="margin-top:">项目选择:</span>
|
|
|
- <Treeselect :appId.sync="appId" request="2,4" style="display: inline-block;position: relative;"/>
|
|
|
+ <span >项目选择:</span>
|
|
|
+ <Treeselect :appId.sync="appId" request="2,4" style="display: inline-block;position: relative;margin-left: 0px;"/>
|
|
|
</div>
|
|
|
<div class="timeDiv">
|
|
|
<div style='display:flex;align-items: center;'>
|
|
|
<span>时间范围:</span>
|
|
|
<span @click="opendate">
|
|
|
<DatePicker :openOptions='openOptions' :parentDate='dateValue' left='-100px'></DatePicker>
|
|
|
- </span>
|
|
|
+ </span>
|
|
|
+ <span style="margin-left:15px">剪辑:</span>
|
|
|
+ <span >
|
|
|
+ <a-input placeholder="请输入剪辑的名字" v-model="clip" style="width:140px" />
|
|
|
+ </span>
|
|
|
+ <span style="margin-left:15px">拍摄:</span>
|
|
|
+ <span >
|
|
|
+ <a-input placeholder="请输入拍摄的名字" v-model="shot" style="width:140px" />
|
|
|
+ </span>
|
|
|
+ <span style="margin-left:15px">编导:</span>
|
|
|
+ <span >
|
|
|
+ <a-input placeholder="请输入编导的名字" v-model="plan" style="width:140px" />
|
|
|
+ </span>
|
|
|
</div>
|
|
|
<a-button type="primary" @click="searchRes">查询</a-button>
|
|
|
</div>
|
|
@@ -84,7 +96,7 @@
|
|
|
<div class="tableTop">
|
|
|
|
|
|
<a-button type="primary" @click="customColumns">自定义列</a-button>
|
|
|
- <a-button type="default" style="float:right" @click="exportExcel" id="mybtn" :loading='exportLoading'>导出报表</a-button>
|
|
|
+ <a-button type="default" style="float:right" @click="exportExcel('exportTable')" id="mybtn" :loading='exportLoading'>导出报表</a-button>
|
|
|
|
|
|
</div>
|
|
|
<a-table
|
|
@@ -103,13 +115,14 @@
|
|
|
@customHeaderCell="customHeaderCell(columns)"
|
|
|
>
|
|
|
|
|
|
- <div slot="videoU" slot-scope="test,records">
|
|
|
+ <div slot="converUrl" slot-scope="test,records">
|
|
|
+ <!-- {{test}} -->
|
|
|
<img
|
|
|
- :src="records.coverUrl"
|
|
|
+ :src="test"
|
|
|
alt
|
|
|
style="width:80px"
|
|
|
@click="openVideo(records.url)"
|
|
|
- @load="loadShow"
|
|
|
+
|
|
|
/>
|
|
|
</div>
|
|
|
<span slot="operation" slot-scope="text, record">
|
|
@@ -210,7 +223,10 @@
|
|
|
>{{ gameAddictionRate | toPercentage }}</span>
|
|
|
<!-- <span slot="nextDayOpenRate" slot-scope="nextDayOpenRate">{{ nextDayOpenRate | toPercentage }}</span> -->
|
|
|
<span slot="relativePeople" slot-scope="text,record">
|
|
|
- <a href="javascript:;" @click.stop="showRelevantPeople(record)">查看相关人员</a>
|
|
|
+ <!-- <a href="javascript:;" @click.stop="showRelevantPeople(record)">查看相关人员</a> -->
|
|
|
+ <p>剪辑:{{record.clip || '暂无数据'}}</p>
|
|
|
+ <p>拍摄:{{record.shot || '暂无数据'}}</p>
|
|
|
+ <p>编导:{{record.plan || '暂无数据'}}</p>
|
|
|
</span>
|
|
|
|
|
|
|
|
@@ -223,17 +239,21 @@
|
|
|
|
|
|
<!-- 明细表 -->
|
|
|
|
|
|
- <a-modal v-model="visibleDetail" title="详细信息" width="60%" :footer="null" >
|
|
|
- <a-button type="default" @click="exportExcel" id="mybtn" >导出报表</a-button>
|
|
|
+ <a-modal v-model="visibleDetail" title="详细信息" width="50%" :footer="null" >
|
|
|
+ <a-button type="default" @click="exportExcel('exportDetail')" id="mybtn" >导出报表</a-button>
|
|
|
<a-table
|
|
|
- :columns="detailConsum"
|
|
|
+ :columns="detailColumn"
|
|
|
:data-source="detailData"
|
|
|
bordered
|
|
|
tableLayout="auto"
|
|
|
:pagination="false"
|
|
|
+ :loading='detailLoading'
|
|
|
style="word-break: break-all;"
|
|
|
>
|
|
|
- <span slot="huanbi" slot-scope="huanbi">{{ huanbi | toPercentage }}</span>
|
|
|
+ <!-- <span slot="huanbi" slot-scope="huanbi">{{ huanbi | toPercentage }}</span> -->
|
|
|
+
|
|
|
+ <span slot="advertiserName" slot-scope="text">{{ text || '暂未填写该数据' }}</span>
|
|
|
+ <span slot="cost" slot-scope="cost">{{ cost | decimalsHandle }}</span>
|
|
|
</a-table>
|
|
|
</a-modal>
|
|
|
</div>
|
|
@@ -250,12 +270,12 @@ import customColumn from '../components/customColumn.vue'
|
|
|
const columnsFixd = [
|
|
|
{
|
|
|
title: '视频',
|
|
|
- dataIndex: 'videoU',
|
|
|
+ dataIndex: 'converUrl',
|
|
|
align: 'center',
|
|
|
width: 100,
|
|
|
fixed: 'left',
|
|
|
- key: 'videoU',
|
|
|
- scopedSlots: { customRender: 'videoU' }
|
|
|
+ key: 'converUrl',
|
|
|
+ scopedSlots: { customRender: 'converUrl' }
|
|
|
},
|
|
|
{
|
|
|
title: '视频名称',
|
|
@@ -287,15 +307,15 @@ const columnsFixd = [
|
|
|
width:120,
|
|
|
fixed: 'left'
|
|
|
},
|
|
|
- // {
|
|
|
- // title:'操作',
|
|
|
- // dataIndex:'operation',
|
|
|
- // key:'operation',
|
|
|
- // scopedSlots: { customRender: 'operation' },
|
|
|
- // align: 'center',
|
|
|
- // width:90,
|
|
|
- // fixed: 'left'
|
|
|
- // },
|
|
|
+ {
|
|
|
+ title:'操作',
|
|
|
+ dataIndex:'operation',
|
|
|
+ key:'operation',
|
|
|
+ scopedSlots: { customRender: 'operation' },
|
|
|
+ align: 'center',
|
|
|
+ width:90,
|
|
|
+ fixed: 'left'
|
|
|
+ },
|
|
|
|
|
|
{
|
|
|
title: '创建时间',
|
|
@@ -401,46 +421,23 @@ const columnsFixd = [
|
|
|
]
|
|
|
let show = 0
|
|
|
|
|
|
-let detailColumn = [
|
|
|
- {
|
|
|
+
|
|
|
+let detailColumn=[
|
|
|
+ {
|
|
|
title: '客户',
|
|
|
dataIndex: 'advertiserName',
|
|
|
align: 'center',
|
|
|
-
|
|
|
- customRender: (value, row, index) => {
|
|
|
- const obj = {
|
|
|
- children: value,
|
|
|
- attrs: {}
|
|
|
- }
|
|
|
- if (index === 0) {
|
|
|
- obj.attrs.rowSpan = 7
|
|
|
- } else {
|
|
|
- obj.attrs.rowSpan = 0
|
|
|
- }
|
|
|
- return obj
|
|
|
- }
|
|
|
+ scopedSlots: { customRender: 'advertiserName' },
|
|
|
},
|
|
|
{
|
|
|
title: '项目名称',
|
|
|
dataIndex: 'projectName',
|
|
|
align: 'center',
|
|
|
- width:150,
|
|
|
- customRender: (value, row, index) => {
|
|
|
- const obj = {
|
|
|
- children: value,
|
|
|
- attrs: {}
|
|
|
- }
|
|
|
- if (index == 0) {
|
|
|
- obj.attrs.rowSpan = 7
|
|
|
- }else {
|
|
|
- obj.attrs.rowSpan = 0
|
|
|
- }
|
|
|
- return obj
|
|
|
- }
|
|
|
+ width: 150,
|
|
|
},
|
|
|
- {
|
|
|
+ {
|
|
|
title: '时间',
|
|
|
- dataIndex: 'statDatetime',
|
|
|
+ dataIndex: 'statDate',
|
|
|
align: 'center',
|
|
|
width: 120
|
|
|
},
|
|
@@ -448,19 +445,18 @@ let detailColumn = [
|
|
|
title: '消耗',
|
|
|
dataIndex: 'cost',
|
|
|
scopedSlots: { customRender: 'cost' },
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+
|
|
|
},
|
|
|
- {
|
|
|
- title: '环比',
|
|
|
- dataIndex: 'huanbi',
|
|
|
- scopedSlots: { customRender: 'huanbi' },
|
|
|
- align: 'center'
|
|
|
- }
|
|
|
]
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ detailLoading:false,
|
|
|
+ clip:undefined,
|
|
|
+ shot:undefined,
|
|
|
+ plan:undefined,
|
|
|
//明细数据
|
|
|
visibleDetail:false,
|
|
|
detailColumn,
|
|
@@ -547,15 +543,17 @@ export default {
|
|
|
console.log(text, record)
|
|
|
this.visibleDetail = true
|
|
|
this.detailData = []
|
|
|
- // this.signature=record.signature
|
|
|
+ this.detailLoading=true;
|
|
|
+ this.signature=record.signature
|
|
|
// console.log(this.signature)
|
|
|
- postAction('/toutiao/videoReportDaily/bytedanceVideoInfoListDetail', {
|
|
|
+ postAction('/ctop/kuaishou/videoReport/detail', {
|
|
|
startDate: this.dateValue[0].format('YYYY-MM-DD'),
|
|
|
endDate: this.dateValue[1].format('YYYY-MM-DD'),
|
|
|
signature: record.signature,
|
|
|
accountIds:this.appId
|
|
|
}).then(res => {
|
|
|
console.log(res)
|
|
|
+ this.detailLoading=false;
|
|
|
if (res.success) {
|
|
|
let result = res.result
|
|
|
// this.detailData.push({ ...result, key: 1 })
|
|
@@ -660,16 +658,19 @@ export default {
|
|
|
accountIds:this.appId,
|
|
|
target:this.target,
|
|
|
order:this.order,
|
|
|
+ clip:this.clip?this.clip:'',
|
|
|
+ shot:this.shot?this.shot:'',
|
|
|
+ plan:this.plan?this.plan:'',
|
|
|
}).then(res => {
|
|
|
let resArr = []
|
|
|
this.data=[];
|
|
|
this.loading = false
|
|
|
if (res.success) {
|
|
|
- // let result = res.result
|
|
|
- // this.data.push({ ...result, key: 1 })
|
|
|
- // result.map((item, index) => {
|
|
|
- // item.key = index
|
|
|
- // })
|
|
|
+ // let result = res.result
|
|
|
+ // this.data.push({ ...result, key: 1 })
|
|
|
+ // result.map((item, index) => {
|
|
|
+ // item.key = index
|
|
|
+ // })
|
|
|
this.data = res.result.list.map((item,index)=>{
|
|
|
return {
|
|
|
...item,
|
|
@@ -685,21 +686,28 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
//导出报表
|
|
|
- exportExcel() {
|
|
|
+ exportExcel(exportType) {
|
|
|
this.exportLoading=true;
|
|
|
- let column = this.columns.map((item, index) => {
|
|
|
- return item.dataIndex
|
|
|
- })
|
|
|
-
|
|
|
- let columns=column.splice(5)
|
|
|
-
|
|
|
- downFilePost('/ctop/kuaishou/videoReport/report/excel', {
|
|
|
+ let columns=[]
|
|
|
+ if(exportType=='exportTable'){
|
|
|
+ let column = this.columns.map((item, index) => {
|
|
|
+ return item.dataIndex
|
|
|
+ })
|
|
|
+ columns=column.splice(7)
|
|
|
+ }
|
|
|
+ downFilePost('/ctop/kuaishou/videoReport/excel', {
|
|
|
columns,
|
|
|
target:this.target,
|
|
|
order:this.order,
|
|
|
startDate: this.dateValue[0].format('YYYY-MM-DD'),
|
|
|
endDate: this.dateValue[1].format('YYYY-MM-DD'),
|
|
|
accountIds:this.appId,
|
|
|
+ exportType,
|
|
|
+ signature: this.signature,
|
|
|
+ signature: this.signature,
|
|
|
+ clip:this.clip?this.clip:'',
|
|
|
+ shot:this.shot?this.shot:'',
|
|
|
+ plan:this.plan?this.plan:'',
|
|
|
}).then(res => {
|
|
|
this.exportLoading=false;
|
|
|
let blob = new Blob([res], {
|