|
@@ -12,7 +12,7 @@
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
-<style>
|
|
|
|
|
|
+<style scoped>
|
|
.showNumBox {
|
|
.showNumBox {
|
|
margin: 10px 0;
|
|
margin: 10px 0;
|
|
}
|
|
}
|
|
@@ -57,7 +57,7 @@
|
|
right: 10px;
|
|
right: 10px;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
-<style lang="less">
|
|
|
|
|
|
+<style lang="less" scoped>
|
|
.ant-card-head .ant-tabs-bar {
|
|
.ant-card-head .ant-tabs-bar {
|
|
padding: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
@@ -121,7 +121,7 @@
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
|
|
|
|
-<style lang="less">
|
|
|
|
|
|
+<style lang="less" scoped>
|
|
.newPlanStatic {
|
|
.newPlanStatic {
|
|
.divider {
|
|
.divider {
|
|
height: 62px;
|
|
height: 62px;
|
|
@@ -162,122 +162,114 @@
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
-
|
|
|
|
|
|
+<style lang="less" scoped>
|
|
|
|
+@import 'configProject';
|
|
|
|
+</style>
|
|
<template>
|
|
<template>
|
|
- <div class="newPlanStatic">
|
|
|
|
|
|
+ <div class="newPlanStatic config-project">
|
|
<div class="tabbody">
|
|
<div class="tabbody">
|
|
<a-tabs v-model="tabKey" @change="tabChange">
|
|
<a-tabs v-model="tabKey" @change="tabChange">
|
|
- <a-tab-pane :key="1" tab="头条"> </a-tab-pane>
|
|
|
|
- <a-tab-pane :key="2" tab="快手"> </a-tab-pane>
|
|
|
|
|
|
+ <a-tab-pane :key="1" tab="项目"> </a-tab-pane>
|
|
|
|
+ <a-tab-pane :key="2" tab="账户"> </a-tab-pane>
|
|
</a-tabs>
|
|
</a-tabs>
|
|
</div>
|
|
</div>
|
|
-
|
|
|
|
- <a-row>
|
|
|
|
- <a-col :span="24">
|
|
|
|
- <a-card :bordered="false" class="search-box">
|
|
|
|
- <div style="margin-bottom:20px">
|
|
|
|
- <span style="margin-left:20px">编导:</span>
|
|
|
|
- <a-select
|
|
|
|
- v-model="planId"
|
|
|
|
- show-search
|
|
|
|
- placeholder="请输入名字"
|
|
|
|
- option-filter-prop="children"
|
|
|
|
- style="width: 200px"
|
|
|
|
- :filter-option="filterOption"
|
|
|
|
- @change="operateChange"
|
|
|
|
- :disabled="operateDisabled"
|
|
|
|
- allowClear
|
|
|
|
- >
|
|
|
|
- <a-select-option v-for="item in designList" :key="item.user_id" :value="item.id">
|
|
|
|
- {{ item.realname + '_(' + item.roleName + ')' }}
|
|
|
|
- </a-select-option>
|
|
|
|
- </a-select>
|
|
|
|
- <span style="margin-left:20px">剪辑:</span>
|
|
|
|
- <a-select
|
|
|
|
- v-model="clipId"
|
|
|
|
- show-search
|
|
|
|
- placeholder="请输入名字"
|
|
|
|
- option-filter-prop="children"
|
|
|
|
- style="width: 200px"
|
|
|
|
- :filter-option="filterOption"
|
|
|
|
- @change="operateChange"
|
|
|
|
- :disabled="operateDisabled"
|
|
|
|
- allowClear
|
|
|
|
- >
|
|
|
|
- <a-select-option v-for="item in designList" :key="item.user_id" :value="item.id">
|
|
|
|
- {{ item.realname + '_(' + item.roleName + ')' }}
|
|
|
|
- </a-select-option>
|
|
|
|
- </a-select>
|
|
|
|
- <span style="margin-left:20px">拍摄:</span>
|
|
|
|
- <a-select
|
|
|
|
- v-model="shotId"
|
|
|
|
- show-search
|
|
|
|
- placeholder="请输入名字"
|
|
|
|
- option-filter-prop="children"
|
|
|
|
- style="width: 200px"
|
|
|
|
- :filter-option="filterOption"
|
|
|
|
- @change="operateChange"
|
|
|
|
- :disabled="operateDisabled"
|
|
|
|
- allowClear
|
|
|
|
- >
|
|
|
|
- <a-select-option v-for="item in designList" :key="item.user_id" :value="item.id">
|
|
|
|
- {{ item.realname + '_(' + item.roleName + ')' }}
|
|
|
|
- </a-select-option>
|
|
|
|
- </a-select>
|
|
|
|
- <a-button type="primary" style="position:absolute;right:20px" @click="search">查询</a-button>
|
|
|
|
- </div>
|
|
|
|
- <div style="margin-bottom:20px">
|
|
|
|
- <span>日期选择:</span>
|
|
|
|
- <a-range-picker
|
|
|
|
- @change="dateChange"
|
|
|
|
- v-model="dateRange"
|
|
|
|
- :disabled-date="disabledDate"
|
|
|
|
- style="width:200px"
|
|
|
|
- />
|
|
|
|
- <span style="margin-left:20px">数据维度:</span>
|
|
|
|
- <a-radio-group v-model="value" @change="dataTypeChange">
|
|
|
|
- <a-radio value="valid">
|
|
|
|
- 有效视频
|
|
|
|
- </a-radio>
|
|
|
|
- <a-radio value="hot">
|
|
|
|
- 爆款视频
|
|
|
|
- </a-radio>
|
|
|
|
- <a-radio value="onlie">
|
|
|
|
- 上线时间
|
|
|
|
- </a-radio>
|
|
|
|
- </a-radio-group>
|
|
|
|
- </div>
|
|
|
|
- <div class="time"></div>
|
|
|
|
- </a-card>
|
|
|
|
- </a-col>
|
|
|
|
- </a-row>
|
|
|
|
|
|
+ <a-card>
|
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
|
+ <a-form layout="inline" :form="form" hide-required-mark :selfUpdate="true" @submit="handleQueryList">
|
|
|
|
+ <a-row :gutter="24">
|
|
|
|
+ <a-col :md="8" :sm="8" :xxl="6">
|
|
|
|
+ <a-form-item label="项目名称">
|
|
|
|
+ <a-input
|
|
|
|
+ v-decorator="['projectName']"
|
|
|
|
+ type="text"
|
|
|
|
+ placeholder="请输入需要搜索的项目名称"
|
|
|
|
+ />
|
|
|
|
+ </a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+
|
|
|
|
+ <a-col :md="8" :sm="8" :xxl="6">
|
|
|
|
+ <a-form-item label="运营负责人">
|
|
|
|
+ <a-select
|
|
|
|
+ placeholder="请选择运营负责人"
|
|
|
|
+ showSearch
|
|
|
|
+ optionFilterProp="children"
|
|
|
|
+ style="width: 100%"
|
|
|
|
+ :filterOption="filterOption"
|
|
|
|
+ v-decorator="['userId']"
|
|
|
|
+ >
|
|
|
|
+ <a-select-option
|
|
|
|
+ v-for="appModel in designList"
|
|
|
|
+ :key="appModel.userId + new Date().getTime()"
|
|
|
|
+ :value="appModel.userId"
|
|
|
|
+ >{{ appModel.realName }}  {{ appModel.roleName }}</a-select-option
|
|
|
|
+ >
|
|
|
|
+ </a-select>
|
|
|
|
+ </a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <!-- -->
|
|
|
|
+ <a-col :md="8" :sm="8" :xxl="6">
|
|
|
|
+ <a-form-item label="数据周期">
|
|
|
|
+ <a-range-picker
|
|
|
|
+ :disabled-date="disabledDate"
|
|
|
|
+ format="YYYY-MM-DD"
|
|
|
|
+ v-decorator="['timeRange', { initialValue: [moment(), moment()] }]"
|
|
|
|
+ />
|
|
|
|
+ </a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col :md="8" :sm="8" :xxl="6">
|
|
|
|
+ <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
|
|
|
+ <a-button type="primary" icon="search" @click="handleQueryList">查询</a-button>
|
|
|
|
+ <a-button type="primary" @click="handleResetForm" icon="reload" class="middle-button"
|
|
|
|
+ >重置</a-button
|
|
|
|
+ >
|
|
|
|
+ </span>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ </a-form>
|
|
|
|
+ </div>
|
|
|
|
+ </a-card>
|
|
|
|
|
|
<a-row style="margin-bottom:15px;margin-top:12px">
|
|
<a-row style="margin-bottom:15px;margin-top:12px">
|
|
<a-col :span="24">
|
|
<a-col :span="24">
|
|
<div class="tableBody">
|
|
<div class="tableBody">
|
|
- <!-- <a-button type='primary' class="export" style="margin-bottom:20px" @click="exportExcel" :loading="exportloading">导出报表</a-button> -->
|
|
|
|
<a-table
|
|
<a-table
|
|
:columns="columns"
|
|
:columns="columns"
|
|
- :dataSource="dataTable"
|
|
|
|
|
|
+ :dataSource="dataSource"
|
|
:pagination="ipagination"
|
|
:pagination="ipagination"
|
|
:loading="loading"
|
|
:loading="loading"
|
|
bordered
|
|
bordered
|
|
@change="tableChange"
|
|
@change="tableChange"
|
|
|
|
+ :scroll="{ x: 2500 }"
|
|
|
|
+ size="middle"
|
|
|
|
+ style="word-break: break-all;font-size:16px;font-weight:600"
|
|
|
|
+ id="outTable"
|
|
|
|
+ ref="accountTable"
|
|
>
|
|
>
|
|
- <span slot="createImg" slot-scope="text, record">
|
|
|
|
- <a-popover placement="right">
|
|
|
|
- <template slot="content">
|
|
|
|
- <video :src="record.url" style="width:250px" controls></video>
|
|
|
|
- </template>
|
|
|
|
- <template slot="title"> </template>
|
|
|
|
- <img :src="record.coverUrl || noImg" alt="" style="width:80px" />
|
|
|
|
- </a-popover>
|
|
|
|
|
|
+ <span slot="dataStatus" slot-scope="text, record">
|
|
|
|
+ <a-switch :checked="text == 0" @change="onChangeStatus(text, record)" :loading="spinning" />
|
|
|
|
+ </span>
|
|
|
|
+ <span slot="allAccountCount" slot-scope="text, record">
|
|
|
|
+ {{ record.successCount + '/' + text }}
|
|
</span>
|
|
</span>
|
|
|
|
+ <span slot="action" slot-scope="text, record">
|
|
|
|
+ <div v-if="record.successCount !== '-'">
|
|
|
|
+ <a>出价</a>
|
|
|
|
+ <a-divider type="vertical" />
|
|
|
|
+ <a>编辑</a>
|
|
|
|
+ <a-divider type="vertical" />
|
|
|
|
+ <a>配置</a>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else>
|
|
|
|
+ -
|
|
|
|
+ </div>
|
|
|
|
+ </span>
|
|
|
|
+ <span slot="charge" slot-scope="text">{{ text | decimalsHandle }}</span>
|
|
|
|
+
|
|
<span slot="companyName" slot-scope="text">{{ text || '未知' }}</span>
|
|
<span slot="companyName" slot-scope="text">{{ text || '未知' }}</span>
|
|
<span slot="planName" slot-scope="text">{{ text || '-' }}</span>
|
|
<span slot="planName" slot-scope="text">{{ text || '-' }}</span>
|
|
<span slot="clipName" slot-scope="text">{{ text || '-' }}</span>
|
|
<span slot="clipName" slot-scope="text">{{ text || '-' }}</span>
|
|
<span slot="shotName" slot-scope="text">{{ text || '-' }}</span>
|
|
<span slot="shotName" slot-scope="text">{{ text || '-' }}</span>
|
|
- <span slot="totalCost" slot-scope="text">{{ text | decimalsHandle }}</span>
|
|
|
|
|
|
+
|
|
<span slot="activeNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
<span slot="activeNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
<span slot="clickNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
<span slot="clickNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
<span slot="convertNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
<span slot="convertNum" slot-scope="text">{{ text | formatCurrency }}</span>
|
|
@@ -299,7 +291,7 @@ const SHOW_PARENT = TreeSelect.SHOW_PARENT
|
|
import ARow from 'ant-design-vue/es/grid/Row'
|
|
import ARow from 'ant-design-vue/es/grid/Row'
|
|
import ACol from 'ant-design-vue/es/grid/Col'
|
|
import ACol from 'ant-design-vue/es/grid/Col'
|
|
import moment from 'moment'
|
|
import moment from 'moment'
|
|
-
|
|
|
|
|
|
+import selectTable from '@/views/modules/Statistics/components/selectPagination.vue'
|
|
import { getKsAccountReport, getKsDetail, getReportList } from '@api/video.js'
|
|
import { getKsAccountReport, getKsDetail, getReportList } from '@api/video.js'
|
|
import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
|
|
import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
|
|
|
|
|
|
@@ -307,196 +299,253 @@ import qs from 'qs'
|
|
|
|
|
|
let TTcolumns = [
|
|
let TTcolumns = [
|
|
{
|
|
{
|
|
- title: '视频',
|
|
|
|
- dataIndex: 'createImg',
|
|
|
|
- scopedSlots: { customRender: 'createImg' },
|
|
|
|
|
|
+ title: '开关',
|
|
|
|
+ dataIndex: 'dataStatus',
|
|
|
|
+ scopedSlots: { customRender: 'dataStatus' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'userNcreateImgame'
|
|
|
|
|
|
+ key: 'dataStatus'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '视频ID',
|
|
|
|
- dataIndex: 'videoCode',
|
|
|
|
- scopedSlots: { customRender: 'videoCode' },
|
|
|
|
|
|
+ title: '项目名称',
|
|
|
|
+ dataIndex: 'projectName',
|
|
|
|
+ scopedSlots: { customRender: 'projectName' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'videoCode'
|
|
|
|
|
|
+ key: 'projectName'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '视频上线时间',
|
|
|
|
- dataIndex: 'stateDate',
|
|
|
|
- scopedSlots: { customRender: 'stateDate' },
|
|
|
|
|
|
+ title: '可用账户数/账户数量',
|
|
|
|
+ dataIndex: 'allAccountCount',
|
|
|
|
+ scopedSlots: { customRender: 'allAccountCount' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'stateDate'
|
|
|
|
|
|
+ key: 'allAccountCount'
|
|
},
|
|
},
|
|
|
|
|
|
{
|
|
{
|
|
- title: '所属公司',
|
|
|
|
- dataIndex: 'companyName',
|
|
|
|
- scopedSlots: { customRender: 'companyName' },
|
|
|
|
|
|
+ title: '运营负责人',
|
|
|
|
+ dataIndex: 'responsibleName',
|
|
|
|
+ scopedSlots: { customRender: 'responsibleName' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'companyName'
|
|
|
|
|
|
+ key: 'responsibleName'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '策划名称',
|
|
|
|
- dataIndex: 'planName',
|
|
|
|
- scopedSlots: { customRender: 'planName' },
|
|
|
|
|
|
+ title: '策略日期',
|
|
|
|
+ dataIndex: 'statDate',
|
|
|
|
+ scopedSlots: { customRender: 'statDate' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'planName'
|
|
|
|
|
|
+ key: 'statDate'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '剪辑名称',
|
|
|
|
- dataIndex: 'clipName',
|
|
|
|
- scopedSlots: { customRender: 'clipName' },
|
|
|
|
|
|
+ title: '操作',
|
|
|
|
+ dataIndex: 'action',
|
|
|
|
+ scopedSlots: { customRender: 'action' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'clipName'
|
|
|
|
|
|
+ key: 'action'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '拍摄名称',
|
|
|
|
- dataIndex: 'shotName',
|
|
|
|
- scopedSlots: { customRender: 'shotName' },
|
|
|
|
|
|
+ title: '消耗',
|
|
|
|
+ dataIndex: 'charge',
|
|
|
|
+ scopedSlots: { customRender: 'charge' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'shotName'
|
|
|
|
|
|
+ key: 'charge',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '总消耗',
|
|
|
|
- dataIndex: 'totalCost',
|
|
|
|
- scopedSlots: { customRender: 'totalCost' },
|
|
|
|
|
|
+ title: '封面曝光数',
|
|
|
|
+ dataIndex: 'photoShow',
|
|
|
|
+ scopedSlots: { customRender: 'photoShow' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'totalCost'
|
|
|
|
|
|
+ key: 'photoShow',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '点击数',
|
|
|
|
- dataIndex: 'clickNum',
|
|
|
|
- scopedSlots: { customRender: 'clickNum' },
|
|
|
|
|
|
+ title: '封面点击数',
|
|
|
|
+ dataIndex: 'photoClick',
|
|
|
|
+ scopedSlots: { customRender: 'photoClick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'clickNum'
|
|
|
|
|
|
+ key: 'photoClick',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '曝光数',
|
|
|
|
- dataIndex: 'showNum',
|
|
|
|
- scopedSlots: { customRender: 'showNum' },
|
|
|
|
|
|
+ title: '素材曝光数',
|
|
|
|
+ dataIndex: 'aclick',
|
|
|
|
+ scopedSlots: { customRender: 'aclick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'showNum'
|
|
|
|
|
|
+ key: 'aclick',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '激活数',
|
|
|
|
- dataIndex: 'activeNum',
|
|
|
|
- scopedSlots: { customRender: 'activeNum' },
|
|
|
|
|
|
+ title: '行为数',
|
|
|
|
+ dataIndex: 'bclick',
|
|
|
|
+ scopedSlots: { customRender: 'bclick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'activeNum'
|
|
|
|
|
|
+ key: 'bclick',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '转化数',
|
|
|
|
- dataIndex: 'convertNum',
|
|
|
|
- scopedSlots: { customRender: 'convertNum' },
|
|
|
|
|
|
+ title: '封面点击率',
|
|
|
|
+ dataIndex: 'photoClickRatio',
|
|
|
|
+ scopedSlots: { customRender: 'photoClickRatio' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'convertNum'
|
|
|
|
- }
|
|
|
|
- // {
|
|
|
|
- // title: '总消耗',
|
|
|
|
- // dataIndex: 'totalCost',
|
|
|
|
- // scopedSlots: { customRender: 'totalCost' },
|
|
|
|
- // align: 'center',
|
|
|
|
- // key:'totalCost'
|
|
|
|
-
|
|
|
|
- // },
|
|
|
|
-]
|
|
|
|
-
|
|
|
|
-let KScolumns = [
|
|
|
|
|
|
+ key: 'photoClickRatio',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
{
|
|
{
|
|
- title: '视频',
|
|
|
|
- dataIndex: 'createImg',
|
|
|
|
- scopedSlots: { customRender: 'createImg' },
|
|
|
|
|
|
+ title: '行为率',
|
|
|
|
+ dataIndex: 'actionRatio',
|
|
|
|
+ scopedSlots: { customRender: 'actionRatio' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'userNcreateImgame'
|
|
|
|
|
|
+ key: 'actionRatio',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '视频ID',
|
|
|
|
- dataIndex: 'videoCode',
|
|
|
|
- scopedSlots: { customRender: 'videoCode' },
|
|
|
|
|
|
+ title: '平均千次封面曝光花费(元)',
|
|
|
|
+ dataIndex: 'impression1kCost',
|
|
|
|
+ scopedSlots: { customRender: 'impression1kCost' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'videoCode'
|
|
|
|
|
|
+ key: 'impression1kCost',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '视频上线时间',
|
|
|
|
- dataIndex: 'stateDate',
|
|
|
|
- scopedSlots: { customRender: 'stateDate' },
|
|
|
|
|
|
+ title: '平均封面点击单价(元)',
|
|
|
|
+ dataIndex: 'photoClickCost',
|
|
|
|
+ scopedSlots: { customRender: 'photoClickCost' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'stateDate'
|
|
|
|
|
|
+ key: 'photoClickCost',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
|
|
+ {
|
|
|
|
+ title: '平均行为单价(元)',
|
|
|
|
+ dataIndex: 'actionCost',
|
|
|
|
+ scopedSlots: { customRender: 'actionCost' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'actionCost',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ }
|
|
|
|
+]
|
|
|
|
|
|
|
|
+let KScolumns = [
|
|
{
|
|
{
|
|
- title: '所属公司',
|
|
|
|
- dataIndex: 'companyName',
|
|
|
|
- scopedSlots: { customRender: 'companyName' },
|
|
|
|
|
|
+ title: '开关',
|
|
|
|
+ dataIndex: 'dataStatus',
|
|
|
|
+ scopedSlots: { customRender: 'dataStatus' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'companyName'
|
|
|
|
|
|
+ key: 'dataStatus'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '策划名称',
|
|
|
|
- dataIndex: 'planName',
|
|
|
|
- scopedSlots: { customRender: 'planName' },
|
|
|
|
|
|
+ title: '账户名称',
|
|
|
|
+ dataIndex: 'authName',
|
|
|
|
+ scopedSlots: { customRender: 'authName' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'planName'
|
|
|
|
|
|
+ key: 'authName'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '剪辑名称',
|
|
|
|
- dataIndex: 'clipName',
|
|
|
|
- scopedSlots: { customRender: 'clipName' },
|
|
|
|
|
|
+ title: '账户ID',
|
|
|
|
+ dataIndex: 'accountId',
|
|
|
|
+ scopedSlots: { customRender: 'accountId' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'clipName'
|
|
|
|
|
|
+ key: 'accountId'
|
|
},
|
|
},
|
|
|
|
+
|
|
{
|
|
{
|
|
- title: '拍摄名称',
|
|
|
|
- dataIndex: 'shotName',
|
|
|
|
- scopedSlots: { customRender: 'shotName' },
|
|
|
|
|
|
+ title: '所属项目',
|
|
|
|
+ dataIndex: 'projectName',
|
|
|
|
+ scopedSlots: { customRender: 'projectName' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'shotName'
|
|
|
|
|
|
+ key: 'projectName'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '总消耗',
|
|
|
|
- dataIndex: 'totalCost',
|
|
|
|
- scopedSlots: { customRender: 'totalCost' },
|
|
|
|
|
|
+ title: '消耗',
|
|
|
|
+ dataIndex: 'charge',
|
|
|
|
+ scopedSlots: { customRender: 'charge' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'totalCost'
|
|
|
|
|
|
+ key: 'charge',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '封面曝光',
|
|
|
|
|
|
+ title: '封面曝光数',
|
|
dataIndex: 'photoShow',
|
|
dataIndex: 'photoShow',
|
|
scopedSlots: { customRender: 'photoShow' },
|
|
scopedSlots: { customRender: 'photoShow' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'photoShow'
|
|
|
|
|
|
+ key: 'photoShow',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '封面点击',
|
|
|
|
|
|
+ title: '封面点击数',
|
|
dataIndex: 'photoClick',
|
|
dataIndex: 'photoClick',
|
|
scopedSlots: { customRender: 'photoClick' },
|
|
scopedSlots: { customRender: 'photoClick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'photoClick'
|
|
|
|
|
|
+ key: 'photoClick',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '素材曝光',
|
|
|
|
|
|
+ title: '素材曝光数',
|
|
dataIndex: 'aclick',
|
|
dataIndex: 'aclick',
|
|
scopedSlots: { customRender: 'aclick' },
|
|
scopedSlots: { customRender: 'aclick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'aclick'
|
|
|
|
|
|
+ key: 'aclick',
|
|
|
|
+ sorter: () => {}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
title: '行为数',
|
|
title: '行为数',
|
|
dataIndex: 'bclick',
|
|
dataIndex: 'bclick',
|
|
scopedSlots: { customRender: 'bclick' },
|
|
scopedSlots: { customRender: 'bclick' },
|
|
align: 'center',
|
|
align: 'center',
|
|
- key: 'bclick'
|
|
|
|
|
|
+ key: 'bclick',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '封面点击率',
|
|
|
|
+ dataIndex: 'photoClickRatio',
|
|
|
|
+ scopedSlots: { customRender: 'photoClickRatio' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'photoClickRatio',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '行为率',
|
|
|
|
+ dataIndex: 'actionRatio',
|
|
|
|
+ scopedSlots: { customRender: 'actionRatio' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'actionRatio',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '平均千次封面曝光花费(元)',
|
|
|
|
+ dataIndex: 'impression1kCost',
|
|
|
|
+ scopedSlots: { customRender: 'impression1kCost' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'impression1kCost',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '平均封面点击单价(元)',
|
|
|
|
+ dataIndex: 'photoClickCost',
|
|
|
|
+ scopedSlots: { customRender: 'photoClickCost' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'photoClickCost',
|
|
|
|
+ sorter: () => {}
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '平均行为单价(元)',
|
|
|
|
+ dataIndex: 'actionCost',
|
|
|
|
+ scopedSlots: { customRender: 'actionCost' },
|
|
|
|
+ align: 'center',
|
|
|
|
+ key: 'actionCost',
|
|
|
|
+ sorter: () => {}
|
|
}
|
|
}
|
|
]
|
|
]
|
|
|
|
|
|
export default {
|
|
export default {
|
|
components: {
|
|
components: {
|
|
ACol,
|
|
ACol,
|
|
- ARow
|
|
|
|
|
|
+ ARow,
|
|
|
|
+ selectTable
|
|
},
|
|
},
|
|
|
|
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ spinning: false,
|
|
|
|
+ form: this.$form.createForm(this),
|
|
exportloading: false,
|
|
exportloading: false,
|
|
planId: '',
|
|
planId: '',
|
|
shotId: '',
|
|
shotId: '',
|
|
@@ -529,7 +578,6 @@ export default {
|
|
TTdesignList: [],
|
|
TTdesignList: [],
|
|
|
|
|
|
operateDisabled: false,
|
|
operateDisabled: false,
|
|
- userId: JSON.parse(localStorage.getItem('pro__Login_Userinfo')).value.id,
|
|
|
|
duration: 1000,
|
|
duration: 1000,
|
|
//treeselect的参数
|
|
//treeselect的参数
|
|
treeValue: [],
|
|
treeValue: [],
|
|
@@ -548,7 +596,7 @@ export default {
|
|
TTcolumns,
|
|
TTcolumns,
|
|
KScolumns,
|
|
KScolumns,
|
|
columns: [...TTcolumns],
|
|
columns: [...TTcolumns],
|
|
- dataTable: [],
|
|
|
|
|
|
+ dataSource: [],
|
|
|
|
|
|
tableTab: 1,
|
|
tableTab: 1,
|
|
|
|
|
|
@@ -557,65 +605,79 @@ export default {
|
|
|
|
|
|
openOptions: false,
|
|
openOptions: false,
|
|
|
|
|
|
- target: '',
|
|
|
|
- order: 'desc'
|
|
|
|
|
|
+ target: 'charge',
|
|
|
|
+ order: 'descend',
|
|
|
|
+ projectId: undefined
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
moment,
|
|
moment,
|
|
- disabledDate(current) {
|
|
|
|
- return current && current > moment()
|
|
|
|
|
|
+ onChangeStatus(text, rescord) {},
|
|
|
|
+ handleQueryList(event) {
|
|
|
|
+ this.ipagination.current = 1
|
|
|
|
+ event.preventDefault()
|
|
|
|
+ const paramsData = this.form.getFieldsValue()
|
|
|
|
+ this.handleGetTableList(paramsData)
|
|
},
|
|
},
|
|
- dateChange(date, dateString) {
|
|
|
|
- // console.log(date,dateString)
|
|
|
|
|
|
+ handleResetForm() {
|
|
|
|
+ this.ipagination.current = 1
|
|
|
|
+ this.form.resetFields()
|
|
|
|
+ this.projectId = undefined
|
|
|
|
+ const paramsData = this.form.getFieldsValue()
|
|
|
|
+ this.handleGetTableList(paramsData)
|
|
|
|
+ this.$refs.selectTable.keyValue = ''
|
|
|
|
+ this.$refs.selectTable.getData()
|
|
},
|
|
},
|
|
- //导出报表
|
|
|
|
- exportExcel() {
|
|
|
|
- this.exportloading = true
|
|
|
|
- let url = ''
|
|
|
|
- if (this.tabKey == 1) {
|
|
|
|
- url = '/ctop/bytedanceVideoEtlInfo/exportXls'
|
|
|
|
- } else {
|
|
|
|
- url = '/ctop/kuaishouVideoEtlInfo/exportXls'
|
|
|
|
|
|
+ handleGetTableList(data) {
|
|
|
|
+ let paramsData = {
|
|
|
|
+ templateName: data.name,
|
|
|
|
+ projectId: this.projectId,
|
|
|
|
+ userId: data.userId,
|
|
|
|
+ startTime:
|
|
|
|
+ data.timeRange && data.timeRange.length === 2
|
|
|
|
+ ? moment(data.timeRange[0]).format('YYYY-MM-DD')
|
|
|
|
+ : null,
|
|
|
|
+ endTime:
|
|
|
|
+ data.timeRange && data.timeRange.length === 2
|
|
|
|
+ ? moment(data.timeRange[1]).format('YYYY-MM-DD')
|
|
|
|
+ : null,
|
|
|
|
+ pageNo: this.ipagination.current,
|
|
|
|
+ pageSize: this.ipagination.pageSize
|
|
}
|
|
}
|
|
- let nameType = ''
|
|
|
|
- if (this.value == 'valid') {
|
|
|
|
- nameType = '有效视频'
|
|
|
|
- } else if (this.value == 'hot') {
|
|
|
|
- nameType = '爆款视频'
|
|
|
|
- } else if (this.value == 'online') {
|
|
|
|
- nameType = '视频上线时间'
|
|
|
|
|
|
+ if (data.target) {
|
|
|
|
+ paramsData.sortCode = data.target
|
|
|
|
+ if (data.order == 'descend') {
|
|
|
|
+ paramsData.sortType = 'DESC'
|
|
|
|
+ } else {
|
|
|
|
+ paramsData.sortType = 'ASC'
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ paramsData.sortCode = this.target
|
|
|
|
+ paramsData.sortType = this.order == 'descend' ? 'DESC' : 'ASC'
|
|
}
|
|
}
|
|
-
|
|
|
|
- downFilePost(
|
|
|
|
- url,
|
|
|
|
- qs.stringify({
|
|
|
|
- type: this.value,
|
|
|
|
- clipId: this.clipId,
|
|
|
|
- shotId: this.shotId,
|
|
|
|
- planId: this.planId,
|
|
|
|
- startData: this.dateRange[0].format('YYYY-MM-DD'),
|
|
|
|
- endData: this.dateRange[1].format('YYYY-MM-DD')
|
|
|
|
|
|
+ this.dataSource = []
|
|
|
|
+ this.dataLoading = true
|
|
|
|
+ postAction('/kuaishouProjectStrategy/queryProjectList', paramsData)
|
|
|
|
+ .then(result => {
|
|
|
|
+ this.dataLoading = false
|
|
|
|
+ if (result.code === 200) {
|
|
|
|
+ this.dataSource = result.result.list || []
|
|
|
|
+ this.ipagination.total = result.result.total || 0
|
|
|
|
+ } else {
|
|
|
|
+ this.$message.error(result.message)
|
|
|
|
+ }
|
|
})
|
|
})
|
|
- ).then(res => {
|
|
|
|
- this.exportloading = false
|
|
|
|
- let blob = new Blob([res], {
|
|
|
|
- type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
|
|
|
|
|
|
+ .catch(error => {
|
|
|
|
+ this.dataLoading = false
|
|
|
|
+ console.log(error, 'eeee')
|
|
})
|
|
})
|
|
- let downloadElement = document.createElement('a')
|
|
|
|
- let href = window.URL.createObjectURL(blob) //创建下载的链接
|
|
|
|
- downloadElement.href = href
|
|
|
|
- downloadElement.download = moment().format('YYYY-MM-DD') + nameType + '.xlsx' //下载后文件名
|
|
|
|
- document.body.appendChild(downloadElement)
|
|
|
|
- downloadElement.click() //点击下载
|
|
|
|
- document.body.removeChild(downloadElement) //下载完成移除元素
|
|
|
|
- window.URL.revokeObjectURL(href) //释放掉blob对象
|
|
|
|
- })
|
|
|
|
},
|
|
},
|
|
- dataTypeChange(e) {
|
|
|
|
- console.log(e.target.value)
|
|
|
|
-
|
|
|
|
- this.getNewPlan()
|
|
|
|
|
|
+ disabledDate(current) {
|
|
|
|
+ // Can not select days before today and today
|
|
|
|
+ return current && current > moment().endOf('day')
|
|
|
|
+ },
|
|
|
|
+ dateChange(date, dateString) {
|
|
|
|
+ // console.log(date,dateString)
|
|
},
|
|
},
|
|
|
|
|
|
filterOption(input, option) {
|
|
filterOption(input, option) {
|
|
@@ -625,12 +687,10 @@ export default {
|
|
|
|
|
|
// 快手头条的切换
|
|
// 快手头条的切换
|
|
tabChange(key) {
|
|
tabChange(key) {
|
|
- console.log(key)
|
|
|
|
- this.treeValue = []
|
|
|
|
this.ipagination.current = 1
|
|
this.ipagination.current = 1
|
|
this.columns = this.tabKey == 1 ? [...TTcolumns] : [...KScolumns]
|
|
this.columns = this.tabKey == 1 ? [...TTcolumns] : [...KScolumns]
|
|
|
|
|
|
- this.getNewPlan()
|
|
|
|
|
|
+ this.handleGetTableList({})
|
|
},
|
|
},
|
|
operateChange(value) {
|
|
operateChange(value) {
|
|
console.log(value)
|
|
console.log(value)
|
|
@@ -643,10 +703,18 @@ export default {
|
|
},
|
|
},
|
|
|
|
|
|
tableChange(pagination, filters, sorter, { currentDataSource }) {
|
|
tableChange(pagination, filters, sorter, { currentDataSource }) {
|
|
- console.log(pagination)
|
|
|
|
this.ipagination.current = pagination.current
|
|
this.ipagination.current = pagination.current
|
|
this.ipagination.pageSize = pagination.pageSize
|
|
this.ipagination.pageSize = pagination.pageSize
|
|
- this.getNewPlan()
|
|
|
|
|
|
+ if (sorter.order) {
|
|
|
|
+ this.order = sorter.order ? sorter.order : 'descend'
|
|
|
|
+ this.target = sorter.columnKey
|
|
|
|
+ const paramsData = this.form.getFieldsValue()
|
|
|
|
+ this.handleGetTableList({
|
|
|
|
+ ...paramsData,
|
|
|
|
+ target: sorter.columnKey,
|
|
|
|
+ order: sorter.order ? sorter.order : 'descend'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
},
|
|
},
|
|
|
|
|
|
// table区域的tab切换
|
|
// table区域的tab切换
|
|
@@ -658,18 +726,17 @@ export default {
|
|
this.columns = this.tabKey == 1 ? [...TTcolumnsVaild] : [...KScolumnsVaild]
|
|
this.columns = this.tabKey == 1 ? [...TTcolumnsVaild] : [...KScolumnsVaild]
|
|
this.target = 'valid'
|
|
this.target = 'valid'
|
|
}
|
|
}
|
|
- this.getNewPlan()
|
|
|
|
|
|
+ // this.getNewPlan()
|
|
},
|
|
},
|
|
|
|
|
|
// 获取所有运营
|
|
// 获取所有运营
|
|
getAllOperator(key) {
|
|
getAllOperator(key) {
|
|
- let url = '/sys/user/getAllDesigner'
|
|
|
|
|
|
+ let url = '/sys/user/getAllUserListV1'
|
|
this.designList = []
|
|
this.designList = []
|
|
|
|
|
|
getAction(url, {}).then(res => {
|
|
getAction(url, {}).then(res => {
|
|
- console.log(res)
|
|
|
|
if (res.success) {
|
|
if (res.success) {
|
|
- this.designList = res.data
|
|
|
|
|
|
+ this.designList = res.result
|
|
}
|
|
}
|
|
})
|
|
})
|
|
},
|
|
},
|
|
@@ -703,7 +770,7 @@ export default {
|
|
|
|
|
|
if (res.success) {
|
|
if (res.success) {
|
|
if (res.result) {
|
|
if (res.result) {
|
|
- this.dataTable = res.result.records
|
|
|
|
|
|
+ this.dataSource = res.result.records
|
|
this.ipagination.total = res.result.total
|
|
this.ipagination.total = res.result.total
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -739,7 +806,7 @@ export default {
|
|
}
|
|
}
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
- this.getNewPlan()
|
|
|
|
|
|
+ this.handleGetTableList()
|
|
this.getAllOperator()
|
|
this.getAllOperator()
|
|
},
|
|
},
|
|
activated: function() {},
|
|
activated: function() {},
|