|
@@ -3,88 +3,124 @@
|
|
|
<div class="mediaReport_header">
|
|
|
<div class="option-top">
|
|
|
<span class="item">
|
|
|
+ <span class="title">
|
|
|
+ 公司
|
|
|
+ <a-tooltip class="tipinfo">
|
|
|
+ <template slot="title">
|
|
|
+ 不选时,默认查询全部公司(包括渠道)。
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <a-icon type="question-circle" />
|
|
|
+ </a-tooltip>
|
|
|
+ </span>
|
|
|
+ <span>:</span>
|
|
|
<a-select placeholder="请选择公司" style="width: 120px" v-model="company" @change="companyChange">
|
|
|
<a-select-option value="">全部</a-select-option>
|
|
|
- <a-select-option v-for="(item,index) in companyArr" :key="index">
|
|
|
- {{item}}
|
|
|
+ <a-select-option v-for="item in companyArr" :key="item.companyId" :value='item.companyId'>
|
|
|
+ {{item.area}}
|
|
|
</a-select-option>
|
|
|
</a-select>
|
|
|
- <a-tooltip class="tipinfo">
|
|
|
- <template slot="title">
|
|
|
- 不选时,默认查询全部公司(包括渠道)。
|
|
|
- </template>
|
|
|
- <a-icon type="question-circle" />
|
|
|
- </a-tooltip>
|
|
|
+
|
|
|
</span>
|
|
|
<span class="item">
|
|
|
+ <span class="title">
|
|
|
+ 广告主
|
|
|
+ <a-tooltip class="tipinfo">
|
|
|
+ <template slot="title">
|
|
|
+ 不选时,默认查询全部广告主。不选择公司时,不可选择广告主。
|
|
|
+ </template>
|
|
|
+ <a-icon type="question-circle" />
|
|
|
+ </a-tooltip>
|
|
|
+
|
|
|
+ </span>
|
|
|
+ <span>:</span>
|
|
|
<a-select
|
|
|
- mode="multiple"
|
|
|
+ show-search
|
|
|
placeholder='请选择或搜索广告主'
|
|
|
- style="width: 300px"
|
|
|
- @change="advertisersChange"
|
|
|
- v-model="advertiser"
|
|
|
- :maxTagCount='1'
|
|
|
- >
|
|
|
+ option-filter-prop="children"
|
|
|
+ style="width: 300px"
|
|
|
+ :filter-option="filterOption"
|
|
|
+ @focus="handleFocus"
|
|
|
+ @blur="handleBlur"
|
|
|
+ @change="advertisersChange"
|
|
|
+ v-model="advertiser"
|
|
|
+ >
|
|
|
<a-select-option value="">全部</a-select-option>
|
|
|
- <a-select-option v-for="(item,index) in advertisersArr" :key="index">
|
|
|
- {{item}}
|
|
|
+ <a-select-option v-for="item in advertisersArr" :key="item.id" :value='item.id'>
|
|
|
+ {{item.name}}
|
|
|
</a-select-option>
|
|
|
</a-select>
|
|
|
- <a-tooltip class="tipinfo">
|
|
|
- <template slot="title">
|
|
|
- 不选时,默认查询全部广告主。不选择公司时,不可选择广告主。
|
|
|
- </template>
|
|
|
- <a-icon type="question-circle" />
|
|
|
- </a-tooltip>
|
|
|
+
|
|
|
</span>
|
|
|
<span class="item">
|
|
|
+ <span class="title">
|
|
|
+ 项目
|
|
|
+ <a-tooltip class="tipinfo">
|
|
|
+ <template slot="title">
|
|
|
+ 不选时,默认查询全部项目。不选广告主时,不可选择项目
|
|
|
+ </template>
|
|
|
+ <a-icon type="question-circle" />
|
|
|
+ </a-tooltip>
|
|
|
+ </span>
|
|
|
+ <span>:</span>
|
|
|
<a-select
|
|
|
- mode="multiple"
|
|
|
+ show-search
|
|
|
+ option-filter-prop="children"
|
|
|
+ :filter-option="filterOption"
|
|
|
+ @focus="handleFocus"
|
|
|
+ @blur="handleBlur"
|
|
|
placeholder='请选择或搜索项目'
|
|
|
style="width: 200px"
|
|
|
@change="projectChange"
|
|
|
v-model="project"
|
|
|
- :maxTagCount='1'
|
|
|
- >
|
|
|
+
|
|
|
+ >
|
|
|
<a-select-option value="">全部</a-select-option>
|
|
|
- <a-select-option v-for="(item,index) in projectArr" :key="index">
|
|
|
- {{item}}
|
|
|
+ <a-select-option v-for="item in projectArr" :key="item.id" :value='item.id'>
|
|
|
+ {{item.project_name}}
|
|
|
</a-select-option>
|
|
|
</a-select>
|
|
|
- <a-tooltip class="tipinfo">
|
|
|
- <template slot="title">
|
|
|
- 不选时,默认查询全部项目。不选广告主时,不可选择项目
|
|
|
- </template>
|
|
|
- <a-icon type="question-circle" />
|
|
|
- </a-tooltip>
|
|
|
+
|
|
|
</span>
|
|
|
|
|
|
</div>
|
|
|
<div class="option-bot">
|
|
|
- <span class="item">
|
|
|
- <a-date-picker @change="onChange" v-model="dateValue" placeholder='请选择日期' />
|
|
|
-
|
|
|
+ <span class="item">
|
|
|
+ <span class="title">
|
|
|
+ 媒体
|
|
|
<a-tooltip class="tipinfo">
|
|
|
<template slot="title">
|
|
|
- 将以选择的日期为准,做前一天和选择当天的消耗差
|
|
|
+ 不选时,默认查询全部媒介。
|
|
|
</template>
|
|
|
<a-icon type="question-circle" />
|
|
|
</a-tooltip>
|
|
|
+ </span>
|
|
|
+ <span>:</span>
|
|
|
+ <a-select placeholder="请选择媒体" style="width: 120px" v-model="mediaType" >
|
|
|
+ <a-select-option value="">全部</a-select-option>
|
|
|
+ <a-select-option :value='1'>头条</a-select-option>
|
|
|
+ <a-select-option :value='3'>头条内广</a-select-option>
|
|
|
+ <a-select-option :value='2'>快手</a-select-option>
|
|
|
+ <a-select-option :value='4'>快手内广</a-select-option>
|
|
|
+ </a-select>
|
|
|
</span>
|
|
|
+
|
|
|
<span class="item">
|
|
|
- <a-select placeholder="请选择媒体" style="width: 120px" v-model="mediaType">
|
|
|
- <a-select-option value="">全部</a-select-option>
|
|
|
- <a-select-option v-for="(item,index) in mediaTypeArr" :key="index">
|
|
|
- {{item}}
|
|
|
- </a-select-option>
|
|
|
- </a-select>
|
|
|
- <a-tooltip class="tipinfo">
|
|
|
- <template slot="title">
|
|
|
- 不选时,默认查询全部媒介。
|
|
|
- </template>
|
|
|
- <a-icon type="question-circle" />
|
|
|
- </a-tooltip>
|
|
|
+ <span class="title">
|
|
|
+ 日期
|
|
|
+ <a-tooltip class="tipinfo">
|
|
|
+ <template slot="title">
|
|
|
+ 将以选择的日期为准,做前一天和选择当天的消耗差
|
|
|
+ </template>
|
|
|
+ <a-icon type="question-circle" />
|
|
|
+ </a-tooltip>
|
|
|
+
|
|
|
+ </span>
|
|
|
+ <span>:</span>
|
|
|
+ <a-date-picker @change="onChange" v-model="dateValue" placeholder='请选择日期' :disabled-date="disabledDate" />
|
|
|
+
|
|
|
</span>
|
|
|
+
|
|
|
</div>
|
|
|
<a-button type='primary' class="option-btn" @click="searchHandle">搜索</a-button>
|
|
|
</div>
|
|
@@ -99,12 +135,28 @@
|
|
|
:dataSource="tableData"
|
|
|
bordered
|
|
|
id="outTable"
|
|
|
- :pagination="false"
|
|
|
+ :pagination="ipagination"
|
|
|
:loading="loading"
|
|
|
ref="accountTable"
|
|
|
- @change="sort"
|
|
|
+ @change="tableChange"
|
|
|
style="word-break: break-all;font-size:16px;font-weight:600"
|
|
|
>
|
|
|
+ <span slot="mediaType" slot-scope="text">
|
|
|
+ <span v-if="text==1">头条</span>
|
|
|
+ <span v-if="text==2">快手</span>
|
|
|
+ <span v-if="text==3">头条内广</span>
|
|
|
+ <span v-if="text==4">快手内广</span>
|
|
|
+ <span v-if="text==0">-</span>
|
|
|
+ </span>
|
|
|
+ <span slot="cost" slot-scope="yesterdayCost">{{yesterdayCost | decimalsHandle}}</span>
|
|
|
+ <span slot="cost" slot-scope="todayCost">{{todayCost | decimalsHandle}}</span>
|
|
|
+ <span slot="cost" slot-scope="diffCost">{{diffCost | decimalsHandle}}</span>
|
|
|
+ <span slot="operatorManger" slot-scope="operatorManger">{{operatorManger | blankHandle}}</span>
|
|
|
+ <span slot="operator" slot-scope="operator">{{operator | blankHandle}}</span>
|
|
|
+ <span slot="sale" slot-scope="sale">{{sale | blankHandle}}</span>
|
|
|
+ <span slot="plan" slot-scope="plan">{{plan | blankHandle}}</span>
|
|
|
+ <span slot="shot" slot-scope="shot">{{shot | blankHandle}}</span>
|
|
|
+ <span slot="clip" slot-scope="clip">{{clip | blankHandle}}</span>
|
|
|
</a-table>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -114,196 +166,279 @@
|
|
|
<script>
|
|
|
import moment from 'moment';
|
|
|
import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
|
|
|
+import { JeecgListMixin } from '@/mixins/ipagination'
|
|
|
|
|
|
-const columns=[
|
|
|
- {
|
|
|
- title: '媒体',
|
|
|
- dataIndex: 'mediaType',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '广告主ID',
|
|
|
- dataIndex: 'adverId',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'adverId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '广告主',
|
|
|
- dataIndex: 'adver',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '项目',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '运营经理',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '运营',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '销售',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '策划',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '拍摄',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '剪辑',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '日期1',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '日期2',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '消耗差值',
|
|
|
- dataIndex: 'projectName',
|
|
|
- align: 'center',
|
|
|
- scopedSlots: { customRender: 'accountId' }
|
|
|
- },
|
|
|
-]
|
|
|
export default {
|
|
|
+ mixins:[JeecgListMixin],
|
|
|
data() {
|
|
|
return {
|
|
|
+ moment,
|
|
|
company:undefined,//公司的默认值
|
|
|
mediaType:undefined,// 媒体类型
|
|
|
advertiser:undefined,//广告主
|
|
|
project:undefined,//项目
|
|
|
- dateValue:moment().format('YYYY-MM-DD'),//
|
|
|
+ dateValue:moment(),//
|
|
|
advertisersArr:[],//广告主数组
|
|
|
projectArr:[],//项目数组
|
|
|
companyArr:[],//公司数组
|
|
|
- mediaTypeArr:[],
|
|
|
-
|
|
|
- columns,
|
|
|
+ mediaTypeArr:[],
|
|
|
tableData:[],
|
|
|
loading:false,
|
|
|
+ dateString1:moment().subtract(1,'days').format('YYYY-MM-DD'),
|
|
|
+ dateString2:moment().format('YYYY-MM-DD'),
|
|
|
+ columns:[
|
|
|
+ {
|
|
|
+ title: '媒体',
|
|
|
+ dataIndex: 'mediaType',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'mediaType' },
|
|
|
+ width:50
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '广告主',
|
|
|
+ dataIndex: 'advertiserName',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'advertiserName' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '项目',
|
|
|
+ dataIndex: 'projectName',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'projectName' },
|
|
|
+ width:80
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:moment().subtract(1,'days').format('YYYY-MM-DD'),
|
|
|
+ dataIndex: 'yesterdayCost',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'accountId' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:moment().format('YYYY-MM-DD'),
|
|
|
+ dataIndex: 'todayCost',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'accountId' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '消耗差值',
|
|
|
+ dataIndex: 'diffCost',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'diffCost' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '运营经理',
|
|
|
+ dataIndex: 'operatorManger',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'operatorManger' },
|
|
|
+ width:80
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '运营',
|
|
|
+ dataIndex: 'operator',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'operator' },
|
|
|
+ width:200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '销售',
|
|
|
+ dataIndex: 'sale',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'sale' },
|
|
|
+ width:80
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '策划',
|
|
|
+ dataIndex: 'plan',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'plan' },
|
|
|
+ width:200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '拍摄',
|
|
|
+ dataIndex: 'shot',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'shot' },
|
|
|
+ width:200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '剪辑',
|
|
|
+ dataIndex: 'clip',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'clip' },
|
|
|
+ width:200
|
|
|
+ },
|
|
|
+
|
|
|
+ ]
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- moment,
|
|
|
+
|
|
|
companyChange(value){
|
|
|
if(this.company=='' || this.company==undefined){
|
|
|
- this.company=undefined;
|
|
|
this.advertisersArr=[];
|
|
|
this.projectArr=[];
|
|
|
this.advertiser=undefined;
|
|
|
this.project=undefined;
|
|
|
}else{
|
|
|
//网络请求获取广告主数据
|
|
|
+ this.advertisersArr=[];
|
|
|
+ this.projectArr=[];
|
|
|
+ this.advertiser=undefined;
|
|
|
+ this.project=undefined;
|
|
|
+ getAction('/ctop/media/report/getAdvertiser', {
|
|
|
+ companyId:this.company
|
|
|
+ }).then(res => {
|
|
|
+ if(res.success){
|
|
|
+ console.log(res)
|
|
|
+ this.advertisersArr=res.result
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
//广告主改变
|
|
|
advertisersChange(value){
|
|
|
console.log(`selected ${value}`);
|
|
|
if(this.advertiser=='' || this.advertiser==undefined){
|
|
|
- this.advertiser=undefined;
|
|
|
+
|
|
|
this.project=undefined;
|
|
|
this.projectArr=[];
|
|
|
+ }else{
|
|
|
+ this.project=undefined;
|
|
|
+ this.projectArr=[];
|
|
|
+ getAction('/ctop/media/report/getProject', {
|
|
|
+ companyId:this.company,
|
|
|
+ advertiserId:this.advertiser
|
|
|
+ }).then(res => {
|
|
|
+ if(res.success){
|
|
|
+ console.log(res)
|
|
|
+ this.projectArr=res.result
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
},
|
|
|
projectChange(value){
|
|
|
console.log(`selected ${value}`);
|
|
|
if(this.project==''){
|
|
|
- this.project=undefined
|
|
|
+ // this.project=undefined
|
|
|
}
|
|
|
},
|
|
|
//日期改变
|
|
|
onChange(date, dateString) {
|
|
|
- console.log(date, dateString);
|
|
|
+ // console.log(date, dateString,this.dateValue);
|
|
|
+ let addCol=[
|
|
|
+ {
|
|
|
+ title:moment(date).subtract(1,'days').format('YYYY-MM-DD'),
|
|
|
+ dataIndex: 'yesterdayCost',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'accountId' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:dateString,
|
|
|
+ dataIndex: 'todayCost',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'accountId' }
|
|
|
+ },
|
|
|
+ ];
|
|
|
+
|
|
|
+ this.columns.splice(3,2,addCol[0],addCol[1]);
|
|
|
+ this.searchHandle();
|
|
|
},
|
|
|
|
|
|
//搜索
|
|
|
searchHandle(){
|
|
|
-
|
|
|
- },
|
|
|
- //table的排序
|
|
|
- sort(pagination, filters, sorter, { currentDataSource }){
|
|
|
- console.log(pagination, filters, sorter)
|
|
|
- if(sorter.order == 'ascend'){
|
|
|
- this.order='asc'
|
|
|
- this.target=sorter.columnKey;
|
|
|
- }else if(sorter.order == 'descend'){
|
|
|
- this.order='desc'
|
|
|
- this.target=sorter.columnKey;
|
|
|
+ let company='';
|
|
|
+ let advertiser='';
|
|
|
+ let project='';
|
|
|
+ let mediaType=''
|
|
|
+ if(this.company==undefined){
|
|
|
+ company=''
|
|
|
}else{
|
|
|
- if(this.accountId.length==1 && this.dateValue[0].format('YYYY.MM.DD')!=this.dateValue[1].format('YYYY.MM.DD')){
|
|
|
- this.target='stat_Datetime',
|
|
|
- this.order='asc'
|
|
|
- }else{
|
|
|
- this.target='cost',
|
|
|
- this.order='desc'
|
|
|
- }
|
|
|
-
|
|
|
+ company=this.company
|
|
|
+ }
|
|
|
+ if(this.advertiser==undefined){
|
|
|
+ advertiser=''
|
|
|
+ }else{
|
|
|
+ advertiser=this.advertiser
|
|
|
}
|
|
|
+ if(this.project==undefined){
|
|
|
+ project=''
|
|
|
+ }else{
|
|
|
+ project=this.project
|
|
|
+ }
|
|
|
+ if(this.mediaType==undefined){
|
|
|
+ mediaType=''
|
|
|
+ }else{
|
|
|
+ mediaType=this.mediaType
|
|
|
+ }
|
|
|
+
|
|
|
+ this.tableHttp({
|
|
|
+ companyId:company,
|
|
|
+ advertiserId:advertiser,
|
|
|
+ projectId:project,
|
|
|
+ mediaType,
|
|
|
+ todayDate:this.dateValue.format('YYYY-MM-DD'),
|
|
|
+ yesterdayDate:moment(this.dateValue).subtract(1,"days").format('YYYY-MM-DD'),
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //table的改变(页码改变请求数据,也可以写排序)
|
|
|
+ tableChange(pagination, filters, sorter, { currentDataSource }){
|
|
|
+
|
|
|
|
|
|
- this.tableHttp();
|
|
|
+ this.searchHandle();
|
|
|
},
|
|
|
//table的网络请求
|
|
|
- tableHttp(){
|
|
|
+ tableHttp(params){
|
|
|
this.loading=true;
|
|
|
- postAction('/ctop/byteDance/dailyPage/report/list', {
|
|
|
-
|
|
|
- }).then(res => {
|
|
|
+ this.tableData=[]
|
|
|
+ postAction(`/ctop/media/report/${this.ipagination.current}/${this.ipagination.pageSize}`, params).then(res => {
|
|
|
if(res.success){
|
|
|
+ // console.log(res)
|
|
|
this.loading=false;
|
|
|
-
|
|
|
+ this.ipagination.total = res.result.total
|
|
|
+ if(res.success){
|
|
|
+ res.result.list.map((item,index)=>{
|
|
|
+ item.key=index
|
|
|
+ })
|
|
|
+ this.tableData=res.result.list
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
//导出报表
|
|
|
exportExcel() {
|
|
|
-
|
|
|
- let column = this.columns.map((item, index) => {
|
|
|
- return item.dataIndex
|
|
|
- })
|
|
|
- let columns=column.splice(3)
|
|
|
- console.log(columns)
|
|
|
- downFilePost('/ctop/byteDance/dailyPage/report/excel', {
|
|
|
-
|
|
|
- mediaId:this.mediaId,
|
|
|
- discount:this.discount,
|
|
|
- accountIds:this.accountId,
|
|
|
- startDate:this.dateValue[0].format('YYYY-MM-DD'),
|
|
|
- endDate:this.dateValue[1].format('YYYY-MM-DD'),
|
|
|
- hour:this.timeSelectValue,
|
|
|
- target:this.target,
|
|
|
- order:this.order,
|
|
|
- columns,
|
|
|
-
|
|
|
+ let company='';
|
|
|
+ let advertiser='';
|
|
|
+ let project='';
|
|
|
+ let mediaType=''
|
|
|
+ if(this.company==undefined){
|
|
|
+ company=''
|
|
|
+ }else{
|
|
|
+ company=this.company
|
|
|
+ }
|
|
|
+ if(this.advertiser==undefined){
|
|
|
+ advertiser=''
|
|
|
+ }else{
|
|
|
+ advertiser=this.advertiser
|
|
|
+ }
|
|
|
+ if(this.project==undefined){
|
|
|
+ project=''
|
|
|
+ }else{
|
|
|
+ project=this.project
|
|
|
+ }
|
|
|
+ if(this.mediaType==undefined){
|
|
|
+ mediaType=''
|
|
|
+ }else{
|
|
|
+ mediaType=this.mediaType
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ downFilePost('/ctop/media/report/excel', {
|
|
|
+ companyId:company,
|
|
|
+ advertiserId:advertiser,
|
|
|
+ projectId:project,
|
|
|
+ mediaType,
|
|
|
+ todayDate:this.dateValue.format('YYYY-MM-DD'),
|
|
|
+ yesterdayDate:this.dateValue.subtract(1,"days").format('YYYY-MM-DD'),
|
|
|
}).then(res => {
|
|
|
let blob = new Blob([res], {
|
|
|
type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
|
|
@@ -311,7 +446,7 @@ export default {
|
|
|
let downloadElement = document.createElement('a')
|
|
|
let href = window.URL.createObjectURL(blob) //创建下载的链接
|
|
|
downloadElement.href = href
|
|
|
- downloadElement.download = moment().format('YYYY-MM-DD') + '账户报表.xlsx' //下载后文件名
|
|
|
+ downloadElement.download = moment().format('YYYY-MM-DD') + '媒介报表.xlsx' //下载后文件名
|
|
|
document.body.appendChild(downloadElement)
|
|
|
downloadElement.click() //点击下载
|
|
|
document.body.removeChild(downloadElement) //下载完成移除元素
|
|
@@ -319,31 +454,56 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
|
|
|
+ handleBlur() {
|
|
|
+ // console.log('blur');
|
|
|
+ },
|
|
|
+ handleFocus() {
|
|
|
+ // console.log('focus');
|
|
|
+ },
|
|
|
+ filterOption(input, option) {
|
|
|
+ return (
|
|
|
+ option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
|
|
+ );
|
|
|
+ },
|
|
|
+ disabledDate(current) {
|
|
|
+ // console.log(current)
|
|
|
+ // return current &¤t > moment()
|
|
|
+ },
|
|
|
+
|
|
|
},
|
|
|
mounted() {
|
|
|
- postAction('/ctop/media/report/getCompany', {
|
|
|
-
|
|
|
+ getAction('/ctop/media/report/getCompany', {
|
|
|
}).then(res => {
|
|
|
if(res.success){
|
|
|
- this.loading=false;
|
|
|
-
|
|
|
+ this.companyArr=res.result
|
|
|
}
|
|
|
+ });
|
|
|
+
|
|
|
+ this.tableHttp({
|
|
|
+ companyId:'',
|
|
|
+ advertiserId:'',
|
|
|
+ projectId:'',
|
|
|
+ mediaType:'',
|
|
|
+ todayDate:this.dateValue.format('YYYY-MM-DD'),
|
|
|
+ yesterdayDate:this.dateValue.subtract(1,'days').format('YYYY-MM-DD'),
|
|
|
})
|
|
|
+
|
|
|
+
|
|
|
},
|
|
|
filters: {
|
|
|
toPercentage(val) {
|
|
|
- if(val){
|
|
|
- if(typeof val != 'string'){
|
|
|
- return (val * 100).toFixed(2) + '%'
|
|
|
- }else{
|
|
|
- return val
|
|
|
- }
|
|
|
- }else if(typeof val =='string'){
|
|
|
- return val
|
|
|
- }
|
|
|
- else{
|
|
|
- return 0
|
|
|
- }
|
|
|
+ if(val){
|
|
|
+ if(typeof val != 'string'){
|
|
|
+ return (val * 100).toFixed(2) + '%'
|
|
|
+ }else{
|
|
|
+ return val
|
|
|
+ }
|
|
|
+ }else if(typeof val =='string'){
|
|
|
+ return val
|
|
|
+ }
|
|
|
+ else{
|
|
|
+ return 0
|
|
|
+ }
|
|
|
},
|
|
|
//保留两位小数并且变成货币格式
|
|
|
decimalsHandle(val){
|
|
@@ -377,27 +537,36 @@ export default {
|
|
|
},
|
|
|
//变成货币格式
|
|
|
formatCurrency(val){
|
|
|
- if((val||val==0)&& typeof val !='string'){
|
|
|
- let numberStr = val.toString()
|
|
|
- let str = numberStr.split('').reverse()
|
|
|
- for (let i = 0; i < str.length; i++) {
|
|
|
- if ((i + 1) % 4 === 0) {
|
|
|
- str.splice(i, 0, ',')
|
|
|
+ if((val||val==0)&& typeof val !='string'){
|
|
|
+ let numberStr = val.toString()
|
|
|
+ let str = numberStr.split('').reverse()
|
|
|
+ for (let i = 0; i < str.length; i++) {
|
|
|
+ if ((i + 1) % 4 === 0) {
|
|
|
+ str.splice(i, 0, ',')
|
|
|
+ }
|
|
|
}
|
|
|
+ str.reverse()
|
|
|
+ let handleResult = ''
|
|
|
+ for (let j = 0; j < str.length; j++) {
|
|
|
+ handleResult += str[j]
|
|
|
+ }
|
|
|
+ return handleResult
|
|
|
+ }else if(typeof val =='string'){
|
|
|
+ return val
|
|
|
}
|
|
|
- str.reverse()
|
|
|
- let handleResult = ''
|
|
|
- for (let j = 0; j < str.length; j++) {
|
|
|
- handleResult += str[j]
|
|
|
+ else{
|
|
|
+ return '-'
|
|
|
}
|
|
|
- return handleResult
|
|
|
- }else if(typeof val =='string'){
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ //处理空白为 --
|
|
|
+ blankHandle(val){
|
|
|
+ if(val){
|
|
|
return val
|
|
|
- }
|
|
|
- else{
|
|
|
- return '-'
|
|
|
- }
|
|
|
-
|
|
|
+ }else{
|
|
|
+ return '-'
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -414,10 +583,20 @@ export default {
|
|
|
.item{
|
|
|
margin-right: 20px;
|
|
|
display: inline-block;
|
|
|
+ .title{
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ padding-right: 15px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ .tipinfo{
|
|
|
+ position: absolute;
|
|
|
+ font-size: 12px;
|
|
|
+ right: 0px;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
}
|
|
|
- .tipinfo{
|
|
|
- margin-left: 8px;
|
|
|
- }
|
|
|
+
|
|
|
}
|
|
|
.option-top{
|
|
|
margin-bottom: 15px;
|