123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449 |
- <template>
- <div class="effectPage">
- <div class="moduler">
- <a-tabs v-model="tabKey" @change="tabKeyChange">
- <a-tab-pane :key="1" tab="头条"></a-tab-pane>
- <a-tab-pane :key="2" tab="快手"> </a-tab-pane>
- <!--
- <a-tab-pane :key="3" tab="广告计划"> </a-tab-pane>
- <a-tab-pane :key="4" tab="广告组"> </a-tab-pane>
- <a-tab-pane :key="5" tab="广告创意"> </a-tab-pane> -->
- </a-tabs>
- <div class="tableBody">
- <div class="moduler">
- <a-select mode="multiple" style="width: 460px;margin-right:30px" v-model="projectValue" placeholder="请选择具体项目"
- :filter-option="filterOption" option-filter-prop="children" :maxTagCount=4 @change="projectChange">
- <a-select-option v-for="item in projectData" :key="item.projectId">
- {{ item.projectName }}
- </a-select-option>
- </a-select>
- <a-range-picker v-model="dateRange" @change="dateChange" style="width:200px" />
- <div class="opt">
- <a-button type='primary' @click="search" style="margin-right:15px">查询</a-button>
- <a-button type='primary' @click="exportExcel" :loading='exportLoading'>导出报表</a-button>
- </div>
- </div>
- <a-spin :spinning="spinning">
- <a-table :columns="columns" :data-source="tableData" :scroll="{ x: 4000 }" bordered size="middle"
- :laoding='loading' :pagination='ipagination' @change="tableChange" :customRow="click">
- <a slot="projectName" slot-scope="text">{{text}}</a>
- <!-- <a slot="projectName" slot-scope="text,records" @click="goAccount(records)">{{text}}</a>
- <a slot="authName" slot-scope="text,records" @click="goCampaign(records)">{{text}}</a>
- <a slot="campaignName" slot-scope="text,records" @click="goUnit(records)">{{text}}</a>
- <a slot="unitName" slot-scope="text,records" @click="goCreative(records)">{{text}}</a>
- <a slot="creativeName" slot-scope="creativeName">{{creativeName}}</a>
- <a slot="coverUrl" slot-scope="text,records">
- <img :src="text" alt="" style="width:100px" @click="openVideo(records)">
- </a> -->
- <span slot="charge" slot-scope="charge"> {{charge|decimalsHandle}}</span>
- <span slot="activationCost" slot-scope="activationCost"> {{activationCost|decimalsHandle}}</span>
- <span slot="eventNextDayStayCost" slot-scope="eventNextDayStayCost">
- {{eventNextDayStayCost|decimalsHandle}}</span>
- <span slot="impression1kCost" slot-scope="impression1kCost"> {{impression1kCost|decimalsHandle}}</span>
- <span slot="photoClickCost" slot-scope="photoClickCost"> {{photoClickCost|decimalsHandle}}</span>
- <span slot="actionCost" slot-scope="actionCost"> {{actionCost|decimalsHandle}}</span>
- <span slot="photoClick" slot-scope="photoClick"> {{photoClick|formatCurrency}}</span>
- <span slot="photoShow" slot-scope="photoShow"> {{photoShow|formatCurrency}}</span>
- <span slot="aclick" slot-scope="aclick"> {{aclick|formatCurrency}}</span>
- <span slot="bclick" slot-scope="bclick"> {{bclick|formatCurrency}}</span>
- <span slot="activation" slot-scope="activation"> {{activation|formatCurrency}}</span>
- <span slot="submit" slot-scope="submit"> {{submit|formatCurrency}}</span>
- <span slot="eventRegister" slot-scope="eventRegister"> {{eventRegister|formatCurrency}}</span>
- <span slot="eventNextDayStay" slot-scope="eventNextDayStay"> {{eventNextDayStay|formatCurrency}}</span>
- <span slot="photoShare" slot-scope="photoShare"> {{photoShare|formatCurrency}}</span>
- <span slot="photoComment" slot-scope="photoComment"> {{photoComment|formatCurrency}}</span>
- <span slot="photoLike" slot-scope="photoLike"> {{photoLike|formatCurrency}}</span>
- <span slot="follow" slot-scope="follow"> {{follow|formatCurrency}}</span>
- <span slot="report" slot-scope="report"> {{report|formatCurrency}}</span>
- <span slot="cancelFollow" slot-scope="cancelFollow"> {{cancelFollow|formatCurrency}}</span>
- <span slot="block" slot-scope="block"> {{block|formatCurrency}}</span>
- <span slot="nagative" slot-scope="nagative"> {{nagative|formatCurrency}}</span>
- <span slot="downloadStarted" slot-scope="downloadStarted"> {{downloadStarted|formatCurrency}}</span>
- <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
- <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
- <span slot="photoClickRatio" slot-scope="photoClickRatio"> {{photoClickRatio|toPercentage}}</span>
- <span slot="actionRate" slot-scope="actionRate"> {{actionRate|toPercentage}}</span>
- <span slot="cost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="nextDayOpenCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="cpc" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="cpm" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="activeCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="activeRegisterCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="convertCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="active" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="downloadFinish" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="downloadStart" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="installFinish" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="register" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="payCount" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="form" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="totalPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="validPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="wifiPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play25FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play50FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play75FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play100FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="shareMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="follow" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="nextDayOpen" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="convertMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="likeMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="showMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="clickMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="clickInstall" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="photoClickRatio" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="play25FeedBreakRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="nextDayOpenRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="ctr" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="activeRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="activeRegisterRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="convertRate" slot-scope="text"> {{text|toPercentage}}</span>
- </a-table>
- </a-spin>
- </div>
- </div>
- <div>
- <a-modal v-model="visible" title="账户详情" :footer="null" :width='1200'>
- <a-table :columns="columnsChildren" :data-source="tableDataChild" :scroll="{ x: 3500 }" bordered size="middle"
- :laoding='loadingChild' :pagination='ipaginationCount' :customRow="click" style="word-break: break-all;">
- <!-- <a slot="projectName" slot-scope="text,records" @click="goAccount(records)">{{text}}</a>
- <a slot="authName" slot-scope="text,records" @click="goCampaign(records)">{{text}}</a>
- <a slot="campaignName" slot-scope="text,records" @click="goUnit(records)">{{text}}</a>
- <a slot="unitName" slot-scope="text,records" @click="goCreative(records)">{{text}}</a>
- <a slot="creativeName" slot-scope="creativeName">{{creativeName}}</a> -->
- <!-- <a slot="coverUrl" slot-scope="text,records">
- <img :src="text" alt="" style="width:100px" @click="openVideo(records)">
- </a> -->
- <span slot="charge" slot-scope="charge"> {{charge|decimalsHandle}}</span>
- <span slot="activationCost" slot-scope="activationCost"> {{activationCost|decimalsHandle}}</span>
- <span slot="eventNextDayStayCost" slot-scope="eventNextDayStayCost">
- {{eventNextDayStayCost|decimalsHandle}}</span>
- <span slot="impression1kCost" slot-scope="impression1kCost"> {{impression1kCost|decimalsHandle}}</span>
- <span slot="photoClickCost" slot-scope="photoClickCost"> {{photoClickCost|decimalsHandle}}</span>
- <span slot="actionCost" slot-scope="actionCost"> {{actionCost|decimalsHandle}}</span>
- <span slot="photoClick" slot-scope="photoClick"> {{photoClick|formatCurrency}}</span>
- <span slot="photoShow" slot-scope="photoShow"> {{photoShow|formatCurrency}}</span>
- <span slot="aclick" slot-scope="aclick"> {{aclick|formatCurrency}}</span>
- <span slot="bclick" slot-scope="bclick"> {{bclick|formatCurrency}}</span>
- <span slot="activation" slot-scope="activation"> {{activation|formatCurrency}}</span>
- <span slot="submit" slot-scope="submit"> {{submit|formatCurrency}}</span>
- <span slot="eventRegister" slot-scope="eventRegister"> {{eventRegister|formatCurrency}}</span>
- <span slot="eventNextDayStay" slot-scope="eventNextDayStay"> {{eventNextDayStay|formatCurrency}}</span>
- <span slot="photoShare" slot-scope="photoShare"> {{photoShare|formatCurrency}}</span>
- <span slot="photoComment" slot-scope="photoComment"> {{photoComment|formatCurrency}}</span>
- <span slot="photoLike" slot-scope="photoLike"> {{photoLike|formatCurrency}}</span>
- <span slot="follow" slot-scope="follow"> {{follow|formatCurrency}}</span>
- <span slot="report" slot-scope="report"> {{report|formatCurrency}}</span>
- <span slot="cancelFollow" slot-scope="cancelFollow"> {{cancelFollow|formatCurrency}}</span>
- <span slot="block" slot-scope="block"> {{block|formatCurrency}}</span>
- <span slot="nagative" slot-scope="nagative"> {{nagative|formatCurrency}}</span>
- <span slot="downloadStarted" slot-scope="downloadStarted"> {{downloadStarted|formatCurrency}}</span>
- <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
- <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
- <span slot="photoClickRatio" slot-scope="photoClickRatio"> {{photoClickRatio|toPercentage}}</span>
- <span slot="actionRate" slot-scope="actionRate"> {{actionRate|toPercentage}}</span>
- <span slot="cost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="nextDayOpenCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="cpc" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="cpm" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="activeCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="activeRegisterCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="convertCost" slot-scope="text"> {{text|decimalsHandle}}</span>
- <span slot="active" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="downloadFinish" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="downloadStart" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="installFinish" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="register" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="payCount" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="form" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="totalPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="validPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="wifiPlay" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play25FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play50FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play75FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="play100FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="shareMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="follow" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="nextDayOpen" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="convertMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="likeMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="showMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="clickMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="clickInstall" slot-scope="text"> {{text|formatCurrency}}</span>
- <span slot="photoClickRatio" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="play25FeedBreakRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="nextDayOpenRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="ctr" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="activeRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="activeRegisterRate" slot-scope="text"> {{text|toPercentage}}</span>
- <span slot="convertRate" slot-scope="text"> {{text|toPercentage}}</span>
- </a-table>
- </a-modal>
- </div>
- </div>
- </template>
- <script>
- import moment from 'moment'
- import {
- getAction,
- postAction,
- downFile,
- downFilePost
- } from '@/api/manage'
- import {
- JeecgListMixin
- } from '@/mixins/ipagination'
- const publicColumns = [{
- title: '消耗',
- dataIndex: 'charge',
- scopedSlots: {
- customRender: 'charge'
- },
- align: 'center',
- },
- {
- title: '封面曝光数',
- dataIndex: 'photoShow',
- scopedSlots: {
- customRender: 'photoShow'
- },
- align: 'center',
- },
- {
- title: '封面点击数',
- dataIndex: 'photoClick',
- scopedSlots: {
- customRender: 'photoClick'
- },
- align: 'center',
- },
- {
- title: '素材曝光数',
- dataIndex: 'aclick',
- scopedSlots: {
- customRender: 'aclick'
- },
- align: 'center',
- },
- {
- title: '行为数',
- dataIndex: 'bclick',
- scopedSlots: {
- customRender: 'bclick'
- },
- align: 'center',
- },
- {
- title: '激活数',
- dataIndex: 'activation',
- scopedSlots: {
- customRender: 'activation'
- },
- align: 'center',
- },
- {
- title: '注册数',
- dataIndex: 'eventRegister',
- scopedSlots: {
- customRender: 'eventRegister'
- },
- align: 'center',
- },
- {
- title: '提交按钮点击数',
- dataIndex: 'submit',
- scopedSlots: {
- customRender: 'submit'
- },
- align: 'center',
- },
- {
- title: '次日留存数',
- dataIndex: 'eventNextDayStay',
- scopedSlots: {
- customRender: 'eventNextDayStay'
- },
- align: 'center',
- },
- {
- title: '次日留存成本',
- dataIndex: 'eventNextDayStayCost',
- scopedSlots: {
- customRender: 'eventNextDayStayCost'
- },
- align: 'center',
- },
- {
- title: '激活成本',
- dataIndex: 'activationCost',
- scopedSlots: {
- customRender: 'activationCost'
- },
- align: 'center',
- },
- {
- title: '封面点击率',
- dataIndex: 'photoClickRatio',
- scopedSlots: {
- customRender: 'photoClickRatio'
- },
- align: 'center',
- },
- {
- title: '行为率 ',
- dataIndex: 'actionRate',
- scopedSlots: {
- customRender: 'actionRate'
- },
- align: 'center',
- },
- {
- title: '均千次封面曝光花费',
- dataIndex: 'impression1kCost',
- scopedSlots: {
- customRender: 'impression1kCost'
- },
- align: 'center',
- },
- {
- title: '平均封面点击单价',
- dataIndex: 'photoClickCost',
- scopedSlots: {
- customRender: 'photoClickCost'
- },
- align: 'center',
- },
- {
- title: '平均行为单价',
- dataIndex: 'actionCost',
- scopedSlots: {
- customRender: 'actionCost'
- },
- align: 'center',
- },
- {
- title: '分享数',
- dataIndex: 'photoShare',
- scopedSlots: {
- customRender: 'photoShare'
- },
- align: 'center',
- },
- {
- title: '评论数',
- dataIndex: 'photoComment',
- scopedSlots: {
- customRender: 'photoComment'
- },
- align: 'center',
- },
- {
- title: '点赞数',
- dataIndex: 'photoLike',
- scopedSlots: {
- customRender: 'photoLike'
- },
- align: 'center',
- },
- {
- title: '新增关注数',
- dataIndex: 'follow',
- scopedSlots: {
- customRender: 'follow'
- },
- align: 'center',
- },
- {
- title: '举报数',
- dataIndex: 'report',
- scopedSlots: {
- customRender: 'report'
- },
- align: 'center',
- },
- {
- title: '取消关注数',
- dataIndex: 'cancelFollow',
- scopedSlots: {
- customRender: 'cancelFollow'
- },
- align: 'center',
- },
- {
- title: '拉黑数',
- dataIndex: 'block',
- scopedSlots: {
- customRender: 'block'
- },
- align: 'center',
- },
- {
- title: '减少此类作品数',
- dataIndex: 'nagative',
- scopedSlots: {
- customRender: 'nagative'
- },
- align: 'center',
- },
- {
- title: '安卓下载开始数',
- dataIndex: 'downloadStarted',
- scopedSlots: {
- customRender: 'downloadStarted'
- },
- align: 'center',
- },
- {
- title: '安卓下载完成数',
- dataIndex: 'downloadCompleted',
- scopedSlots: {
- customRender: 'downloadCompleted'
- },
- align: 'center',
- },
- ]
- const projectColumns = [{
- title: '项目名称',
- dataIndex: 'projectName',
- width: 150,
- align: 'center',
- scopedSlots: {
- customRender: 'projectName'
- },
- fixed: 'left'
- },
- {
- title: '广告主',
- dataIndex: 'advertiserName',
- width: 200,
- align: 'center',
- fixed: 'left'
- },
- {
- title: '运营负责人',
- dataIndex: 'responsibleName',
- scopedSlots: {
- customRender: 'responsibleName'
- },
- align: 'center',
- },
- {
- title: '设计负责人',
- dataIndex: 'designResponsibleName',
- scopedSlots: {
- customRender: 'designResponsibleName'
- },
- align: 'center',
- },
- {
- title: '销售',
- dataIndex: 'saleName',
- scopedSlots: {
- customRender: 'saleName'
- },
- align: 'center',
- },
-
- {
- title: '时间',
- dataIndex: 'statDate',
- // width:200,
- scopedSlots: {
- customRender: 'statDate'
- },
- align: 'center',
- width: 200
- },
- ]
- const accountColumns = [{
- title: '账户名称',
- dataIndex: 'authName',
- width: 130,
- align: 'center',
- scopedSlots: {
- customRender: 'authName'
- },
- fixed: 'left'
- },
- {
- title: '账户id',
- dataIndex: 'accountId',
- align: 'center',
- width: 90,
- scopedSlots: {
- customRender: 'accountId'
- },
- fixed: 'left'
- },
- {
- title: '项目名称',
- dataIndex: 'projectName',
- width: 130,
- align: 'center',
- scopedSlots: {
- customRender: 'projectName'
- },
- fixed: 'left'
- },
- {
- title: '时间',
- dataIndex: 'statDate',
- width: 200,
- scopedSlots: {
- customRender: 'statDate'
- },
- align: 'center',
- },
- ]
- const bytedanceColumns = [{
- title: '消耗',
- dataIndex: 'cost',
- width: 150,
- align: 'center',
- scopedSlots: {
- customRender: 'cost'
- }
- }, {
- title: '激活',
- dataIndex: 'active',
- align: 'center',
- scopedSlots: {
- customRender: 'active'
- }
- }, {
- title: '安卓下载完成',
- dataIndex: 'downloadFinish',
- align: 'center',
- scopedSlots: {
- customRender: 'downloadFinish'
- }
- }, {
- title: '安卓下载开始',
- dataIndex: 'downloadStart',
- align: 'center',
- scopedSlots: {
- customRender: 'downloadStart'
- }
- }, {
- title: '安卓安装完成',
- dataIndex: 'installFinish',
- align: 'center',
- scopedSlots: {
- customRender: 'installFinish'
- }
- }, {
- title: '注册',
- dataIndex: 'register',
- align: 'center',
- scopedSlots: {
- customRender: 'register'
- }
- }, {
- title: '付费数',
- dataIndex: 'payCount',
- align: 'center',
- scopedSlots: {
- customRender: 'payCount'
- }
- }, {
- title: '表单提交数',
- dataIndex: 'form',
- align: 'center',
- scopedSlots: {
- customRender: 'form'
- }
- }, {
- title: '总播放',
- dataIndex: 'totalPlay',
- align: 'center',
- scopedSlots: {
- customRender: 'totalPlay'
- }
- }, {
- title: '有效播放',
- dataIndex: 'validPlay',
- align: 'center',
- scopedSlots: {
- customRender: 'validPlay'
- }
- }, {
- title: 'wifi播放',
- dataIndex: 'wifiPlay',
- align: 'center',
- scopedSlots: {
- customRender: 'wifiPlay'
- }
- }, {
- title: '25%进度播放率',
- dataIndex: 'play25FeedBreakRate',
- align: 'center',
- scopedSlots: {
- customRender: 'play25FeedBreakRate'
- }
- }, {
- title: '播放25%进度总数',
- dataIndex: 'play25FeedBreak',
- align: 'center',
- scopedSlots: {
- customRender: 'play25FeedBreak'
- }
- }, {
- title: '播放50%进度总数',
- dataIndex: 'play50FeedBreak',
- align: 'center',
- scopedSlots: {
- customRender: 'play50FeedBreak'
- }
- }, {
- title: '播放75%进度总数',
- dataIndex: 'play75FeedBreak',
- align: 'center',
- scopedSlots: {
- customRender: 'play75FeedBreak'
- }
- }, {
- title: '播放100%进度总数',
- dataIndex: 'play100FeedBreak',
- align: 'center',
- scopedSlots: {
- customRender: 'play100FeedBreak'
- }
- }, {
- title: '分享数',
- dataIndex: 'shareMaterial',
- align: 'center',
- scopedSlots: {
- customRender: 'shareMaterial'
- }
- }, {
- title: '新增关注数',
- dataIndex: 'follow',
- align: 'center',
- scopedSlots: {
- customRender: 'follow'
- }
- }, {
- title: '次留数',
- dataIndex: 'nextDayOpen',
- align: 'center',
- scopedSlots: {
- customRender: 'nextDayOpen'
- }
- }, {
- title: '次留率',
- dataIndex: 'nextDayOpenRate',
- align: 'center',
- scopedSlots: {
- customRender: 'nextDayOpenRate'
- }
- }, {
- title: '次留成本',
- dataIndex: 'nextDayOpenCost',
- align: 'center',
- scopedSlots: {
- customRender: 'nextDayOpenCost'
- }
- }, {
- title: '转化数',
- dataIndex: 'convertMaterial',
- align: 'center',
- scopedSlots: {
- customRender: 'convertMaterial'
- }
- }, {
- title: '平均点击单价',
- dataIndex: 'cpc',
- align: 'center',
- scopedSlots: {
- customRender: 'cpc'
- }
- }, {
- title: '展现数据',
- dataIndex: 'ctr',
- align: 'center',
- scopedSlots: {
- customRender: 'ctr'
- }
- }, {
- title: '平均千次展现费用',
- dataIndex: 'cpm',
- align: 'center',
- scopedSlots: {
- customRender: 'cpm'
- }
- }, {
- title: '点赞数',
- dataIndex: 'likeMaterial',
- align: 'center',
- scopedSlots: {
- customRender: 'likeMaterial'
- }
- }, {
- title: '激活成本',
- dataIndex: 'activeCost',
- align: 'center',
- scopedSlots: {
- customRender: 'activeCost'
- }
- }, {
- title: '激活率',
- dataIndex: 'activeRate',
- align: 'center',
- scopedSlots: {
- customRender: 'activeRate'
- }
- }, {
- title: '注册率',
- dataIndex: 'activeRegisterRate',
- align: 'center',
- scopedSlots: {
- customRender: 'activeRegisterRate'
- }
- }, {
- title: '注册成本',
- dataIndex: 'activeRegisterCost',
- align: 'center',
- scopedSlots: {
- customRender: 'activeRegisterCost'
- }
- }, {
- title: '展示数',
- dataIndex: 'showMaterial',
- align: 'center',
- scopedSlots: {
- customRender: 'showMaterial'
- }
- }, {
- title: '转化率',
- dataIndex: 'convertRate',
- align: 'center',
- scopedSlots: {
- customRender: 'convertRate'
- }
- }, {
- title: '转化成本',
- dataIndex: 'convertCost',
- align: 'center',
- scopedSlots: {
- customRender: 'convertCost'
- }
- }, {
- title: '点击数',
- dataIndex: 'clickMaterial',
- align: 'center',
- scopedSlots: {
- customRender: 'clickMaterial'
- }
- }, {
- title: '点击安装数',
- dataIndex: 'clickInstall',
- align: 'center',
- scopedSlots: {
- customRender: 'clickInstall'
- }
- }]
- export default {
- mixins: [JeecgListMixin],
- data() {
- return {
- exportLoading:false,
- projectValue: [],
- dateRange: [moment().subtract(1, 'days'), moment()],
- projectData: [],
- tableData: [],
- tableDataChild: [],
- columns: [...projectColumns, ...publicColumns],
- columnsChildren: [],
- ipaginationCount: {
- current: 1,
- pageSize: 10,
- // pageSizeOptions: ['10', '20', '30'],
- showTotal: (total, range) => {
- return range[0] + "-" + range[1] + " 共" + total + "条"
- },
- showQuickJumper: true,
- // showSizeChanger: true,
- total: 0,
- onChange: current => {
- // 切换分页时的回调,
- // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
- this.ipaginationCount.current = current
- }
- },
- loading: false,
- loadingChild: false,
- tabKey: 1,
- currentid: undefined,
- accountId: undefined,
- projectId: undefined,
- campaignId: undefined,
- unitId: undefined,
- spinning: false,
- visible: false,
- imgSrc: undefined,
- currentRecords: {},
- }
- },
- methods: {
- //导出报表
- exportExcel() {
- this.exportLoading=true;
- let url=''
- if (this.tabKey == 1) {
- url='/ctop/report/exportBytedanceSaleProjectInfo'
-
- } else if (this.tabKey == 2) {
- url='/kuaishou/exportKuaishouSaleProjectInfo'
- }
- downFilePost(url, {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: this.projectValue,
-
- }).then(res => {
- this.exportLoading=false;
- let blob = new Blob([res], {
- type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
- })
- let downloadElement = document.createElement('a')
- let href = window.URL.createObjectURL(blob) //创建下载的链接
- downloadElement.href = href
- downloadElement.download = `${this.dateRange[0].format('YYYY-MM-DD')}~${this.dateRange[1].format('YYYY-MM-DD')}销售报表.xlsx` //下载后文件名
- document.body.appendChild(downloadElement)
- downloadElement.click() //点击下载
- document.body.removeChild(downloadElement) //下载完成移除元素
- window.URL.revokeObjectURL(href) //释放掉blob对象
- })
- },
- showClick(record) {
- this.visible = true
- this.loadingChild = true
- if (this.tabKey == 1) {
- this.columnsChildren = [...accountColumns, ...bytedanceColumns]
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: '1',
- pageSize: '10'
- }
- postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- } else if (this.tabKey == 2) {
- this.columnsChildren = [...accountColumns, ...publicColumns]
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: '1',
- pageSize: '10'
- }
- postAction('/kuaishou/getKuaishouAccountInfoByProjectId', params).then(res => {
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- }
- },
- click(record, index) {
- return {
- on: {
- click: () => {
- this.visible = true
- this.loadingChild = true
- if (this.tabKey == 1) {
- this.columnsChildren = [...accountColumns, ...bytedanceColumns]
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: '1',
- pageSize: '10'
- }
- postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- } else if (this.tabKey == 2) {
- this.columnsChildren = [...accountColumns, ...publicColumns]
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: '1',
- pageSize: '10'
- }
- postAction('/kuaishou/getKuaishouSaleAccountInfoByProjectId', params).then(res => {
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- }
- }
- }
- }
- },
- handleOk(e) {
- // console.log(e);
- this.visible = false;
- },
- openVideo(records) {
- this.visible = true;
- this.imgSrc = records.url;
- this.currentRecords = records
- },
- // 过滤事件
- filterOption(input, option) {
- return (
- option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
- );
- },
- //table的改变(页码改变请求数据,也可以写排序)
- tableChange(pagination, filters, sorter, {
- currentDataSource
- }) {
- // this.searchHandle();
- this.search();
- },
- projectChange(val) {
- console.log(val)
- },
- dateChange(date, dateString) {
- console.log(date, dateString)
- },
- // tab切换事件
- tabKeyChange(key) {
- this.projectValue = []
- // console.log(key)
- if (key == 1) {
- this.columnsChildren = [...accountColumns, ...bytedanceColumns]
- postAction('/ctop/projectMember/getSaleOwnProjects', {
- mediaIds: [1, 3], //头条
- }).then(res => {
- console.log(res);
- this.projectData = res.result
- });
- } else if (key == 2) {
- this.columnsChildren = [...accountColumns, ...publicColumns]
- postAction('/ctop/projectMember/getSaleOwnProjects', {
- mediaIds: [2, 4], //头条
- }).then(res => {
- console.log(res);
- this.projectData = res.result
- });
- }
- this.search();
- },
- // x项目的table值
- getTableProjectList(paramse) {
- this.loading = true;
- this.spinning = true;
- // this.ipagination.current=0;
- this.columns = [...projectColumns, ...bytedanceColumns]
- postAction('/ctop/report/getBytedanceSaleProjectInfo', paramse).then(res => {
- console.log(res);
- this.tabKey = 1;
- this.loading = false;
- this.spinning = false;
- if (res.success) {
- res.result.list.forEach((item, index) => {
- item.key = index
- })
- this.tableData = res.result.list;
- this.ipagination.total = res.result.total
- }
- })
- },
- // 从项目跳转到账户,并获取账户的table值
- goAccount(records) {
- console.log(records);
- this.projectId = records.projectId
- this.getTableAccountList()
- },
- // 从账户到计划
- goCampaign(records) {
- this.accountId = records.accountId;
- this.getTableCampaignList()
- },
- // 从计划到组
- goUnit(records) {
- this.campaignId = records.campaignId;
- this.getTableUnitList()
- },
- // 从组到创意
- goCreative(records) {
- this.unitId = records.unitId;
- this.getTableCreativeList()
- },
- getTableAccountList(params) {
- this.loading = true;
- this.spinning = true;
- // this.ipagination.current=0;
- postAction('/kuaishou/getKuaishouSaleProjectInfo', params).then(res => {
- console.log(res)
- this.columns = [...projectColumns, ...publicColumns]
- this.tabKey = 2;
- this.loading = false;
- this.spinning = false;
- if (res.success) {
- this.tableData = res.result.list
- this.ipagination.total = res.result.total
- }
- })
- },
- getTableCampaignList() {
- this.loading = true;
- // this.ipagination.current=0;
- this.spinning = true;
- postAction('/kuaishou/getKuaishouCampaignInfoByAccountId', {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- accountId: this.accountId,
- pageNum: this.ipagination.current,
- pageSize: '10'
- }).then(res => {
- console.log(res)
- this.tabKey = 3;
- this.loading = false;
- this.spinning = false;
- // this.columns = [...campaignColumns, ...publicColumns]
- if (res.success) {
- this.tableData = res.result.list
- this.ipagination.total = res.result.total
- }
- })
- },
- getTableUnitList() {
- this.loading = true;
- // this.ipagination.current=0;
- this.spinning = true;
- postAction('/kuaishou/getKuaishouUnitInfoByCampaignId', {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- campaignId: this.campaignId,
- pageNum: this.ipagination.current,
- pageSize: '10'
- }).then(res => {
- console.log(res)
- this.tabKey = 4;
- this.loading = false;
- this.spinning = false;
- // this.columns = [...unitColumns, ...publicColumns]
- if (res.success) {
- this.tableData = res.result.list
- this.ipagination.total = res.result.total
- }
- })
- },
- getTableCreativeList() {
- this.loading = true;
- // this.ipagination.current=0;
- this.spinning = true;
- postAction('/kuaishou/getKuaishouCreativeInfoByUnitId', {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- unitId: this.unitId,
- pageNum: this.ipagination.current,
- pageSize: '10'
- }).then(res => {
- console.log(res)
- this.tabKey = 5;
- this.loading = false;
- this.spinning = false;
- // this.columns = [...ideaColumns, ...publicColumns]
- if (res.success) {
- this.tableData = res.result.list
- this.ipagination.total = res.result.total
- }
- })
- },
- search() {
- if (this.tabKey == 1) {
- this.getTableProjectList({
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: this.projectValue,
- pageNum: this.ipagination.current,
- pageSize: '10'
- })
- } else if (this.tabKey == 2) {
- this.getTableAccountList({
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: this.projectValue,
- pageNum: '0',
- pageSize: '10'
- });
- }
- },
- },
- watch: {
- 'ipagination.current': function (n, o) {
- if (this.tabKey == 1) {
- this.getTableProjectList({
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: this.projectValue,
- pageNum: this.ipagination.current,
- pageSize: '10'
- })
- } else if (this.tabKey == 2) {
- this.getTableAccountList({
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: [],
- pageNum: this.ipagination.current,
- pageSize: '10'
- });
- }
- },
- 'ipaginationCount.current': function (n, o) {
- if (this.tabKey == 1) {
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: this.ipaginationCount.current,
- pageSize: '10'
- }
- postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
- // this.columnsChildren = [...accountColumns, ...bytedanceColumns]
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- } else if (this.tabKey == 2) {
- var params = {
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectId: record.projectId,
- pageNum: this.ipaginationCount.current,
- pageSize: '10'
- }
- postAction('/kuaishou/getKuaishouAccountInfoByProjectId', params).then(res => {
- // this.columnsChildren = [...accountColumns, ...publicColumns]
- if (res.success) {
- this.loadingChild = false
- this.tableDataChild = res.result.list
- this.ipaginationCount.total = res.result.total
- } else {
- this.loadingChild = false
- }
- })
- }
- }
- },
- mounted() {
- // /ctop/projectMember/participateList
- // var arr = this.request.split(',')
- // var dataTwo = []
- // var data = res.result.filter(item => {
- // return item.mediaId == arr[0]
- // })
- // if (arr.length > 1) {
- // dataTwo = res.result.filter(item => {
- // return item.mediaId == arr[1]
- // })
- // }
- postAction('/ctop/projectMember/getSaleOwnProjects', {
- mediaIds: [1, 3], //头条
- }).then(res => {
- console.log(res);
- this.projectData = res.result
- });
- console.log(this.dateRange)
- this.getTableProjectList({
- startDate: this.dateRange[0].format('YYYY-MM-DD'),
- endDate: this.dateRange[1].format('YYYY-MM-DD'),
- projectList: [],
- pageNum: '0',
- pageSize: '10'
- });
- },
- 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
- }
- },
- //保留两位小数并且变成货币格式
- decimalsHandle(val) {
- if (val && typeof val != 'string') {
- if (val >= 0) {
- val = parseFloat(val).toFixed(2);
- let numberStr = val.toString()
- let str = numberStr.split('.')
- let str0 = str[0].split('').reverse();
- for (let i = 0; i < str0.length; i++) {
- if ((i + 1) % 4 === 0) {
- str0.splice(i, 0, ',')
- }
- }
- str0.reverse()
- let handleResult = ''
- for (let j = 0; j < str0.length; j++) {
- handleResult += str0[j]
- }
- return handleResult + '.' + str[1]
- } else {
- val = parseFloat(val).toFixed(2);
- let numberStr = val.toString()
- let str = numberStr.split('.')
- let str0 = str[0].substr(1).split('').reverse();
- for (let i = 0; i < str0.length; i++) {
- if ((i + 1) % 4 === 0) {
- str0.splice(i, 0, ',')
- }
- }
- str0.reverse()
- let handleResult = ''
- for (let j = 0; j < str0.length; j++) {
- handleResult += str0[j]
- }
- return '-' + handleResult + '.' + str[1]
- }
- } else if (typeof val == 'string') {
- return val
- } else {
- return 0
- }
- },
- //变成货币格式
- 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, ',')
- }
- }
- str.reverse()
- let handleResult = ''
- for (let j = 0; j < str.length; j++) {
- handleResult += str[j]
- }
- return handleResult
- } else if (typeof val == 'string') {
- return val
- } else {
- return '-'
- }
- }
- }
- }
- </script>
- <style lang="less">
- .resize-table-th {
- position: relative;
- .table-draggable-handle {
- height: 100% !important;
- bottom: 0;
- left: auto !important;
- right: -5px;
- cursor: col-resize;
- touch-action: none;
- }
- }
- </style>
- <style lang="scss" scoped>
- .effectPage {
- .moduler {
- background: #fff;
- margin-bottom: 16px;
- position: relative;
- padding: 32px 24px 48px 32px;
- border-radius: 4px;
- box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
- .opt {
- position: absolute;
- top: 32px;
- right: 24px;
- }
- .moduler-title {
- display: flex;
- align-items: 'center';
- font-size: 22px;
- margin-bottom: 20px;
- }
- .row-item {
- display: flex;
- justify-content: flex-start;
- align-items: 'center';
- margin-bottom: 32px;
- }
- .row-item:last-of-type {
- margin-bottom: 0;
- }
- .row-item .hint-item {
- width: 24px;
- min-width: 24px;
- align-self: flex-start;
- line-height: 20px;
- height: 20px;
- margin-top: 5px;
- }
- .row-item .label-item {
- position: relative;
- align-items: flex-start;
- align-self: flex-start;
- line-height: 20px;
- height: 20px;
- margin-top: 7px;
- width: 80px;
- min-width: 80px;
- .text-item {
- font-size: 14px;
- width: 60px;
- }
- }
- .row-item .required-item {
- width: 4px;
- height: 4px;
- border-radius: 2px;
- background: #f45858;
- position: absolute;
- right: 10px;
- top: 50%;
- transform: translateY(-50%);
- }
- .row-item .input-item {
- min-width: 480px;
- position: relative;
- // height: 35px;
- .tip {
- font-size: 12px;
- color: tomato;
- }
- }
- .tableBody {
- margin-top: 10px;
- }
- }
- .spin-content {
- border: 1px solid #91d5ff;
- background-color: #e6f7ff;
- padding: 30px;
- }
- }
- </style>
|