xiaoshouStatistics.vue 46 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449
  1. <template>
  2. <div class="effectPage">
  3. <div class="moduler">
  4. <a-tabs v-model="tabKey" @change="tabKeyChange">
  5. <a-tab-pane :key="1" tab="头条"></a-tab-pane>
  6. <a-tab-pane :key="2" tab="快手"> </a-tab-pane>
  7. <!--
  8. <a-tab-pane :key="3" tab="广告计划"> </a-tab-pane>
  9. <a-tab-pane :key="4" tab="广告组"> </a-tab-pane>
  10. <a-tab-pane :key="5" tab="广告创意"> </a-tab-pane> -->
  11. </a-tabs>
  12. <div class="tableBody">
  13. <div class="moduler">
  14. <a-select mode="multiple" style="width: 460px;margin-right:30px" v-model="projectValue" placeholder="请选择具体项目"
  15. :filter-option="filterOption" option-filter-prop="children" :maxTagCount=4 @change="projectChange">
  16. <a-select-option v-for="item in projectData" :key="item.projectId">
  17. {{ item.projectName }}
  18. </a-select-option>
  19. </a-select>
  20. <a-range-picker v-model="dateRange" @change="dateChange" style="width:200px" />
  21. <div class="opt">
  22. <a-button type='primary' @click="search" style="margin-right:15px">查询</a-button>
  23. <a-button type='primary' @click="exportExcel" :loading='exportLoading'>导出报表</a-button>
  24. </div>
  25. </div>
  26. <a-spin :spinning="spinning">
  27. <a-table :columns="columns" :data-source="tableData" :scroll="{ x: 4000 }" bordered size="middle"
  28. :laoding='loading' :pagination='ipagination' @change="tableChange" :customRow="click">
  29. <a slot="projectName" slot-scope="text">{{text}}</a>
  30. <!-- <a slot="projectName" slot-scope="text,records" @click="goAccount(records)">{{text}}</a>
  31. <a slot="authName" slot-scope="text,records" @click="goCampaign(records)">{{text}}</a>
  32. <a slot="campaignName" slot-scope="text,records" @click="goUnit(records)">{{text}}</a>
  33. <a slot="unitName" slot-scope="text,records" @click="goCreative(records)">{{text}}</a>
  34. <a slot="creativeName" slot-scope="creativeName">{{creativeName}}</a>
  35. <a slot="coverUrl" slot-scope="text,records">
  36. <img :src="text" alt="" style="width:100px" @click="openVideo(records)">
  37. </a> -->
  38. <span slot="charge" slot-scope="charge"> {{charge|decimalsHandle}}</span>
  39. <span slot="activationCost" slot-scope="activationCost"> {{activationCost|decimalsHandle}}</span>
  40. <span slot="eventNextDayStayCost" slot-scope="eventNextDayStayCost">
  41. {{eventNextDayStayCost|decimalsHandle}}</span>
  42. <span slot="impression1kCost" slot-scope="impression1kCost"> {{impression1kCost|decimalsHandle}}</span>
  43. <span slot="photoClickCost" slot-scope="photoClickCost"> {{photoClickCost|decimalsHandle}}</span>
  44. <span slot="actionCost" slot-scope="actionCost"> {{actionCost|decimalsHandle}}</span>
  45. <span slot="photoClick" slot-scope="photoClick"> {{photoClick|formatCurrency}}</span>
  46. <span slot="photoShow" slot-scope="photoShow"> {{photoShow|formatCurrency}}</span>
  47. <span slot="aclick" slot-scope="aclick"> {{aclick|formatCurrency}}</span>
  48. <span slot="bclick" slot-scope="bclick"> {{bclick|formatCurrency}}</span>
  49. <span slot="activation" slot-scope="activation"> {{activation|formatCurrency}}</span>
  50. <span slot="submit" slot-scope="submit"> {{submit|formatCurrency}}</span>
  51. <span slot="eventRegister" slot-scope="eventRegister"> {{eventRegister|formatCurrency}}</span>
  52. <span slot="eventNextDayStay" slot-scope="eventNextDayStay"> {{eventNextDayStay|formatCurrency}}</span>
  53. <span slot="photoShare" slot-scope="photoShare"> {{photoShare|formatCurrency}}</span>
  54. <span slot="photoComment" slot-scope="photoComment"> {{photoComment|formatCurrency}}</span>
  55. <span slot="photoLike" slot-scope="photoLike"> {{photoLike|formatCurrency}}</span>
  56. <span slot="follow" slot-scope="follow"> {{follow|formatCurrency}}</span>
  57. <span slot="report" slot-scope="report"> {{report|formatCurrency}}</span>
  58. <span slot="cancelFollow" slot-scope="cancelFollow"> {{cancelFollow|formatCurrency}}</span>
  59. <span slot="block" slot-scope="block"> {{block|formatCurrency}}</span>
  60. <span slot="nagative" slot-scope="nagative"> {{nagative|formatCurrency}}</span>
  61. <span slot="downloadStarted" slot-scope="downloadStarted"> {{downloadStarted|formatCurrency}}</span>
  62. <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
  63. <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
  64. <span slot="photoClickRatio" slot-scope="photoClickRatio"> {{photoClickRatio|toPercentage}}</span>
  65. <span slot="actionRate" slot-scope="actionRate"> {{actionRate|toPercentage}}</span>
  66. <span slot="cost" slot-scope="text"> {{text|decimalsHandle}}</span>
  67. <span slot="nextDayOpenCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  68. <span slot="cpc" slot-scope="text"> {{text|decimalsHandle}}</span>
  69. <span slot="cpm" slot-scope="text"> {{text|decimalsHandle}}</span>
  70. <span slot="activeCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  71. <span slot="activeRegisterCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  72. <span slot="convertCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  73. <span slot="active" slot-scope="text"> {{text|formatCurrency}}</span>
  74. <span slot="downloadFinish" slot-scope="text"> {{text|formatCurrency}}</span>
  75. <span slot="downloadStart" slot-scope="text"> {{text|formatCurrency}}</span>
  76. <span slot="installFinish" slot-scope="text"> {{text|formatCurrency}}</span>
  77. <span slot="register" slot-scope="text"> {{text|formatCurrency}}</span>
  78. <span slot="payCount" slot-scope="text"> {{text|formatCurrency}}</span>
  79. <span slot="form" slot-scope="text"> {{text|formatCurrency}}</span>
  80. <span slot="totalPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  81. <span slot="validPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  82. <span slot="wifiPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  83. <span slot="play25FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  84. <span slot="play50FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  85. <span slot="play75FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  86. <span slot="play100FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  87. <span slot="shareMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  88. <span slot="follow" slot-scope="text"> {{text|formatCurrency}}</span>
  89. <span slot="nextDayOpen" slot-scope="text"> {{text|formatCurrency}}</span>
  90. <span slot="convertMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  91. <span slot="likeMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  92. <span slot="showMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  93. <span slot="clickMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  94. <span slot="clickInstall" slot-scope="text"> {{text|formatCurrency}}</span>
  95. <span slot="photoClickRatio" slot-scope="text"> {{text|toPercentage}}</span>
  96. <span slot="play25FeedBreakRate" slot-scope="text"> {{text|toPercentage}}</span>
  97. <span slot="nextDayOpenRate" slot-scope="text"> {{text|toPercentage}}</span>
  98. <span slot="ctr" slot-scope="text"> {{text|toPercentage}}</span>
  99. <span slot="activeRate" slot-scope="text"> {{text|toPercentage}}</span>
  100. <span slot="activeRegisterRate" slot-scope="text"> {{text|toPercentage}}</span>
  101. <span slot="convertRate" slot-scope="text"> {{text|toPercentage}}</span>
  102. </a-table>
  103. </a-spin>
  104. </div>
  105. </div>
  106. <div>
  107. <a-modal v-model="visible" title="账户详情" :footer="null" :width='1200'>
  108. <a-table :columns="columnsChildren" :data-source="tableDataChild" :scroll="{ x: 3500 }" bordered size="middle"
  109. :laoding='loadingChild' :pagination='ipaginationCount' :customRow="click" style="word-break: break-all;">
  110. <!-- <a slot="projectName" slot-scope="text,records" @click="goAccount(records)">{{text}}</a>
  111. <a slot="authName" slot-scope="text,records" @click="goCampaign(records)">{{text}}</a>
  112. <a slot="campaignName" slot-scope="text,records" @click="goUnit(records)">{{text}}</a>
  113. <a slot="unitName" slot-scope="text,records" @click="goCreative(records)">{{text}}</a>
  114. <a slot="creativeName" slot-scope="creativeName">{{creativeName}}</a> -->
  115. <!-- <a slot="coverUrl" slot-scope="text,records">
  116. <img :src="text" alt="" style="width:100px" @click="openVideo(records)">
  117. </a> -->
  118. <span slot="charge" slot-scope="charge"> {{charge|decimalsHandle}}</span>
  119. <span slot="activationCost" slot-scope="activationCost"> {{activationCost|decimalsHandle}}</span>
  120. <span slot="eventNextDayStayCost" slot-scope="eventNextDayStayCost">
  121. {{eventNextDayStayCost|decimalsHandle}}</span>
  122. <span slot="impression1kCost" slot-scope="impression1kCost"> {{impression1kCost|decimalsHandle}}</span>
  123. <span slot="photoClickCost" slot-scope="photoClickCost"> {{photoClickCost|decimalsHandle}}</span>
  124. <span slot="actionCost" slot-scope="actionCost"> {{actionCost|decimalsHandle}}</span>
  125. <span slot="photoClick" slot-scope="photoClick"> {{photoClick|formatCurrency}}</span>
  126. <span slot="photoShow" slot-scope="photoShow"> {{photoShow|formatCurrency}}</span>
  127. <span slot="aclick" slot-scope="aclick"> {{aclick|formatCurrency}}</span>
  128. <span slot="bclick" slot-scope="bclick"> {{bclick|formatCurrency}}</span>
  129. <span slot="activation" slot-scope="activation"> {{activation|formatCurrency}}</span>
  130. <span slot="submit" slot-scope="submit"> {{submit|formatCurrency}}</span>
  131. <span slot="eventRegister" slot-scope="eventRegister"> {{eventRegister|formatCurrency}}</span>
  132. <span slot="eventNextDayStay" slot-scope="eventNextDayStay"> {{eventNextDayStay|formatCurrency}}</span>
  133. <span slot="photoShare" slot-scope="photoShare"> {{photoShare|formatCurrency}}</span>
  134. <span slot="photoComment" slot-scope="photoComment"> {{photoComment|formatCurrency}}</span>
  135. <span slot="photoLike" slot-scope="photoLike"> {{photoLike|formatCurrency}}</span>
  136. <span slot="follow" slot-scope="follow"> {{follow|formatCurrency}}</span>
  137. <span slot="report" slot-scope="report"> {{report|formatCurrency}}</span>
  138. <span slot="cancelFollow" slot-scope="cancelFollow"> {{cancelFollow|formatCurrency}}</span>
  139. <span slot="block" slot-scope="block"> {{block|formatCurrency}}</span>
  140. <span slot="nagative" slot-scope="nagative"> {{nagative|formatCurrency}}</span>
  141. <span slot="downloadStarted" slot-scope="downloadStarted"> {{downloadStarted|formatCurrency}}</span>
  142. <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
  143. <span slot="downloadCompleted" slot-scope="downloadCompleted"> {{downloadCompleted|formatCurrency}}</span>
  144. <span slot="photoClickRatio" slot-scope="photoClickRatio"> {{photoClickRatio|toPercentage}}</span>
  145. <span slot="actionRate" slot-scope="actionRate"> {{actionRate|toPercentage}}</span>
  146. <span slot="cost" slot-scope="text"> {{text|decimalsHandle}}</span>
  147. <span slot="nextDayOpenCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  148. <span slot="cpc" slot-scope="text"> {{text|decimalsHandle}}</span>
  149. <span slot="cpm" slot-scope="text"> {{text|decimalsHandle}}</span>
  150. <span slot="activeCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  151. <span slot="activeRegisterCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  152. <span slot="convertCost" slot-scope="text"> {{text|decimalsHandle}}</span>
  153. <span slot="active" slot-scope="text"> {{text|formatCurrency}}</span>
  154. <span slot="downloadFinish" slot-scope="text"> {{text|formatCurrency}}</span>
  155. <span slot="downloadStart" slot-scope="text"> {{text|formatCurrency}}</span>
  156. <span slot="installFinish" slot-scope="text"> {{text|formatCurrency}}</span>
  157. <span slot="register" slot-scope="text"> {{text|formatCurrency}}</span>
  158. <span slot="payCount" slot-scope="text"> {{text|formatCurrency}}</span>
  159. <span slot="form" slot-scope="text"> {{text|formatCurrency}}</span>
  160. <span slot="totalPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  161. <span slot="validPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  162. <span slot="wifiPlay" slot-scope="text"> {{text|formatCurrency}}</span>
  163. <span slot="play25FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  164. <span slot="play50FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  165. <span slot="play75FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  166. <span slot="play100FeedBreak" slot-scope="text"> {{text|formatCurrency}}</span>
  167. <span slot="shareMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  168. <span slot="follow" slot-scope="text"> {{text|formatCurrency}}</span>
  169. <span slot="nextDayOpen" slot-scope="text"> {{text|formatCurrency}}</span>
  170. <span slot="convertMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  171. <span slot="likeMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  172. <span slot="showMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  173. <span slot="clickMaterial" slot-scope="text"> {{text|formatCurrency}}</span>
  174. <span slot="clickInstall" slot-scope="text"> {{text|formatCurrency}}</span>
  175. <span slot="photoClickRatio" slot-scope="text"> {{text|toPercentage}}</span>
  176. <span slot="play25FeedBreakRate" slot-scope="text"> {{text|toPercentage}}</span>
  177. <span slot="nextDayOpenRate" slot-scope="text"> {{text|toPercentage}}</span>
  178. <span slot="ctr" slot-scope="text"> {{text|toPercentage}}</span>
  179. <span slot="activeRate" slot-scope="text"> {{text|toPercentage}}</span>
  180. <span slot="activeRegisterRate" slot-scope="text"> {{text|toPercentage}}</span>
  181. <span slot="convertRate" slot-scope="text"> {{text|toPercentage}}</span>
  182. </a-table>
  183. </a-modal>
  184. </div>
  185. </div>
  186. </template>
  187. <script>
  188. import moment from 'moment'
  189. import {
  190. getAction,
  191. postAction,
  192. downFile,
  193. downFilePost
  194. } from '@/api/manage'
  195. import {
  196. JeecgListMixin
  197. } from '@/mixins/ipagination'
  198. const publicColumns = [{
  199. title: '消耗',
  200. dataIndex: 'charge',
  201. scopedSlots: {
  202. customRender: 'charge'
  203. },
  204. align: 'center',
  205. },
  206. {
  207. title: '封面曝光数',
  208. dataIndex: 'photoShow',
  209. scopedSlots: {
  210. customRender: 'photoShow'
  211. },
  212. align: 'center',
  213. },
  214. {
  215. title: '封面点击数',
  216. dataIndex: 'photoClick',
  217. scopedSlots: {
  218. customRender: 'photoClick'
  219. },
  220. align: 'center',
  221. },
  222. {
  223. title: '素材曝光数',
  224. dataIndex: 'aclick',
  225. scopedSlots: {
  226. customRender: 'aclick'
  227. },
  228. align: 'center',
  229. },
  230. {
  231. title: '行为数',
  232. dataIndex: 'bclick',
  233. scopedSlots: {
  234. customRender: 'bclick'
  235. },
  236. align: 'center',
  237. },
  238. {
  239. title: '激活数',
  240. dataIndex: 'activation',
  241. scopedSlots: {
  242. customRender: 'activation'
  243. },
  244. align: 'center',
  245. },
  246. {
  247. title: '注册数',
  248. dataIndex: 'eventRegister',
  249. scopedSlots: {
  250. customRender: 'eventRegister'
  251. },
  252. align: 'center',
  253. },
  254. {
  255. title: '提交按钮点击数',
  256. dataIndex: 'submit',
  257. scopedSlots: {
  258. customRender: 'submit'
  259. },
  260. align: 'center',
  261. },
  262. {
  263. title: '次日留存数',
  264. dataIndex: 'eventNextDayStay',
  265. scopedSlots: {
  266. customRender: 'eventNextDayStay'
  267. },
  268. align: 'center',
  269. },
  270. {
  271. title: '次日留存成本',
  272. dataIndex: 'eventNextDayStayCost',
  273. scopedSlots: {
  274. customRender: 'eventNextDayStayCost'
  275. },
  276. align: 'center',
  277. },
  278. {
  279. title: '激活成本',
  280. dataIndex: 'activationCost',
  281. scopedSlots: {
  282. customRender: 'activationCost'
  283. },
  284. align: 'center',
  285. },
  286. {
  287. title: '封面点击率',
  288. dataIndex: 'photoClickRatio',
  289. scopedSlots: {
  290. customRender: 'photoClickRatio'
  291. },
  292. align: 'center',
  293. },
  294. {
  295. title: '行为率 ',
  296. dataIndex: 'actionRate',
  297. scopedSlots: {
  298. customRender: 'actionRate'
  299. },
  300. align: 'center',
  301. },
  302. {
  303. title: '均千次封面曝光花费',
  304. dataIndex: 'impression1kCost',
  305. scopedSlots: {
  306. customRender: 'impression1kCost'
  307. },
  308. align: 'center',
  309. },
  310. {
  311. title: '平均封面点击单价',
  312. dataIndex: 'photoClickCost',
  313. scopedSlots: {
  314. customRender: 'photoClickCost'
  315. },
  316. align: 'center',
  317. },
  318. {
  319. title: '平均行为单价',
  320. dataIndex: 'actionCost',
  321. scopedSlots: {
  322. customRender: 'actionCost'
  323. },
  324. align: 'center',
  325. },
  326. {
  327. title: '分享数',
  328. dataIndex: 'photoShare',
  329. scopedSlots: {
  330. customRender: 'photoShare'
  331. },
  332. align: 'center',
  333. },
  334. {
  335. title: '评论数',
  336. dataIndex: 'photoComment',
  337. scopedSlots: {
  338. customRender: 'photoComment'
  339. },
  340. align: 'center',
  341. },
  342. {
  343. title: '点赞数',
  344. dataIndex: 'photoLike',
  345. scopedSlots: {
  346. customRender: 'photoLike'
  347. },
  348. align: 'center',
  349. },
  350. {
  351. title: '新增关注数',
  352. dataIndex: 'follow',
  353. scopedSlots: {
  354. customRender: 'follow'
  355. },
  356. align: 'center',
  357. },
  358. {
  359. title: '举报数',
  360. dataIndex: 'report',
  361. scopedSlots: {
  362. customRender: 'report'
  363. },
  364. align: 'center',
  365. },
  366. {
  367. title: '取消关注数',
  368. dataIndex: 'cancelFollow',
  369. scopedSlots: {
  370. customRender: 'cancelFollow'
  371. },
  372. align: 'center',
  373. },
  374. {
  375. title: '拉黑数',
  376. dataIndex: 'block',
  377. scopedSlots: {
  378. customRender: 'block'
  379. },
  380. align: 'center',
  381. },
  382. {
  383. title: '减少此类作品数',
  384. dataIndex: 'nagative',
  385. scopedSlots: {
  386. customRender: 'nagative'
  387. },
  388. align: 'center',
  389. },
  390. {
  391. title: '安卓下载开始数',
  392. dataIndex: 'downloadStarted',
  393. scopedSlots: {
  394. customRender: 'downloadStarted'
  395. },
  396. align: 'center',
  397. },
  398. {
  399. title: '安卓下载完成数',
  400. dataIndex: 'downloadCompleted',
  401. scopedSlots: {
  402. customRender: 'downloadCompleted'
  403. },
  404. align: 'center',
  405. },
  406. ]
  407. const projectColumns = [{
  408. title: '项目名称',
  409. dataIndex: 'projectName',
  410. width: 150,
  411. align: 'center',
  412. scopedSlots: {
  413. customRender: 'projectName'
  414. },
  415. fixed: 'left'
  416. },
  417. {
  418. title: '广告主',
  419. dataIndex: 'advertiserName',
  420. width: 200,
  421. align: 'center',
  422. fixed: 'left'
  423. },
  424. {
  425. title: '运营负责人',
  426. dataIndex: 'responsibleName',
  427. scopedSlots: {
  428. customRender: 'responsibleName'
  429. },
  430. align: 'center',
  431. },
  432. {
  433. title: '设计负责人',
  434. dataIndex: 'designResponsibleName',
  435. scopedSlots: {
  436. customRender: 'designResponsibleName'
  437. },
  438. align: 'center',
  439. },
  440. {
  441. title: '销售',
  442. dataIndex: 'saleName',
  443. scopedSlots: {
  444. customRender: 'saleName'
  445. },
  446. align: 'center',
  447. },
  448. {
  449. title: '时间',
  450. dataIndex: 'statDate',
  451. // width:200,
  452. scopedSlots: {
  453. customRender: 'statDate'
  454. },
  455. align: 'center',
  456. width: 200
  457. },
  458. ]
  459. const accountColumns = [{
  460. title: '账户名称',
  461. dataIndex: 'authName',
  462. width: 130,
  463. align: 'center',
  464. scopedSlots: {
  465. customRender: 'authName'
  466. },
  467. fixed: 'left'
  468. },
  469. {
  470. title: '账户id',
  471. dataIndex: 'accountId',
  472. align: 'center',
  473. width: 90,
  474. scopedSlots: {
  475. customRender: 'accountId'
  476. },
  477. fixed: 'left'
  478. },
  479. {
  480. title: '项目名称',
  481. dataIndex: 'projectName',
  482. width: 130,
  483. align: 'center',
  484. scopedSlots: {
  485. customRender: 'projectName'
  486. },
  487. fixed: 'left'
  488. },
  489. {
  490. title: '时间',
  491. dataIndex: 'statDate',
  492. width: 200,
  493. scopedSlots: {
  494. customRender: 'statDate'
  495. },
  496. align: 'center',
  497. },
  498. ]
  499. const bytedanceColumns = [{
  500. title: '消耗',
  501. dataIndex: 'cost',
  502. width: 150,
  503. align: 'center',
  504. scopedSlots: {
  505. customRender: 'cost'
  506. }
  507. }, {
  508. title: '激活',
  509. dataIndex: 'active',
  510. align: 'center',
  511. scopedSlots: {
  512. customRender: 'active'
  513. }
  514. }, {
  515. title: '安卓下载完成',
  516. dataIndex: 'downloadFinish',
  517. align: 'center',
  518. scopedSlots: {
  519. customRender: 'downloadFinish'
  520. }
  521. }, {
  522. title: '安卓下载开始',
  523. dataIndex: 'downloadStart',
  524. align: 'center',
  525. scopedSlots: {
  526. customRender: 'downloadStart'
  527. }
  528. }, {
  529. title: '安卓安装完成',
  530. dataIndex: 'installFinish',
  531. align: 'center',
  532. scopedSlots: {
  533. customRender: 'installFinish'
  534. }
  535. }, {
  536. title: '注册',
  537. dataIndex: 'register',
  538. align: 'center',
  539. scopedSlots: {
  540. customRender: 'register'
  541. }
  542. }, {
  543. title: '付费数',
  544. dataIndex: 'payCount',
  545. align: 'center',
  546. scopedSlots: {
  547. customRender: 'payCount'
  548. }
  549. }, {
  550. title: '表单提交数',
  551. dataIndex: 'form',
  552. align: 'center',
  553. scopedSlots: {
  554. customRender: 'form'
  555. }
  556. }, {
  557. title: '总播放',
  558. dataIndex: 'totalPlay',
  559. align: 'center',
  560. scopedSlots: {
  561. customRender: 'totalPlay'
  562. }
  563. }, {
  564. title: '有效播放',
  565. dataIndex: 'validPlay',
  566. align: 'center',
  567. scopedSlots: {
  568. customRender: 'validPlay'
  569. }
  570. }, {
  571. title: 'wifi播放',
  572. dataIndex: 'wifiPlay',
  573. align: 'center',
  574. scopedSlots: {
  575. customRender: 'wifiPlay'
  576. }
  577. }, {
  578. title: '25%进度播放率',
  579. dataIndex: 'play25FeedBreakRate',
  580. align: 'center',
  581. scopedSlots: {
  582. customRender: 'play25FeedBreakRate'
  583. }
  584. }, {
  585. title: '播放25%进度总数',
  586. dataIndex: 'play25FeedBreak',
  587. align: 'center',
  588. scopedSlots: {
  589. customRender: 'play25FeedBreak'
  590. }
  591. }, {
  592. title: '播放50%进度总数',
  593. dataIndex: 'play50FeedBreak',
  594. align: 'center',
  595. scopedSlots: {
  596. customRender: 'play50FeedBreak'
  597. }
  598. }, {
  599. title: '播放75%进度总数',
  600. dataIndex: 'play75FeedBreak',
  601. align: 'center',
  602. scopedSlots: {
  603. customRender: 'play75FeedBreak'
  604. }
  605. }, {
  606. title: '播放100%进度总数',
  607. dataIndex: 'play100FeedBreak',
  608. align: 'center',
  609. scopedSlots: {
  610. customRender: 'play100FeedBreak'
  611. }
  612. }, {
  613. title: '分享数',
  614. dataIndex: 'shareMaterial',
  615. align: 'center',
  616. scopedSlots: {
  617. customRender: 'shareMaterial'
  618. }
  619. }, {
  620. title: '新增关注数',
  621. dataIndex: 'follow',
  622. align: 'center',
  623. scopedSlots: {
  624. customRender: 'follow'
  625. }
  626. }, {
  627. title: '次留数',
  628. dataIndex: 'nextDayOpen',
  629. align: 'center',
  630. scopedSlots: {
  631. customRender: 'nextDayOpen'
  632. }
  633. }, {
  634. title: '次留率',
  635. dataIndex: 'nextDayOpenRate',
  636. align: 'center',
  637. scopedSlots: {
  638. customRender: 'nextDayOpenRate'
  639. }
  640. }, {
  641. title: '次留成本',
  642. dataIndex: 'nextDayOpenCost',
  643. align: 'center',
  644. scopedSlots: {
  645. customRender: 'nextDayOpenCost'
  646. }
  647. }, {
  648. title: '转化数',
  649. dataIndex: 'convertMaterial',
  650. align: 'center',
  651. scopedSlots: {
  652. customRender: 'convertMaterial'
  653. }
  654. }, {
  655. title: '平均点击单价',
  656. dataIndex: 'cpc',
  657. align: 'center',
  658. scopedSlots: {
  659. customRender: 'cpc'
  660. }
  661. }, {
  662. title: '展现数据',
  663. dataIndex: 'ctr',
  664. align: 'center',
  665. scopedSlots: {
  666. customRender: 'ctr'
  667. }
  668. }, {
  669. title: '平均千次展现费用',
  670. dataIndex: 'cpm',
  671. align: 'center',
  672. scopedSlots: {
  673. customRender: 'cpm'
  674. }
  675. }, {
  676. title: '点赞数',
  677. dataIndex: 'likeMaterial',
  678. align: 'center',
  679. scopedSlots: {
  680. customRender: 'likeMaterial'
  681. }
  682. }, {
  683. title: '激活成本',
  684. dataIndex: 'activeCost',
  685. align: 'center',
  686. scopedSlots: {
  687. customRender: 'activeCost'
  688. }
  689. }, {
  690. title: '激活率',
  691. dataIndex: 'activeRate',
  692. align: 'center',
  693. scopedSlots: {
  694. customRender: 'activeRate'
  695. }
  696. }, {
  697. title: '注册率',
  698. dataIndex: 'activeRegisterRate',
  699. align: 'center',
  700. scopedSlots: {
  701. customRender: 'activeRegisterRate'
  702. }
  703. }, {
  704. title: '注册成本',
  705. dataIndex: 'activeRegisterCost',
  706. align: 'center',
  707. scopedSlots: {
  708. customRender: 'activeRegisterCost'
  709. }
  710. }, {
  711. title: '展示数',
  712. dataIndex: 'showMaterial',
  713. align: 'center',
  714. scopedSlots: {
  715. customRender: 'showMaterial'
  716. }
  717. }, {
  718. title: '转化率',
  719. dataIndex: 'convertRate',
  720. align: 'center',
  721. scopedSlots: {
  722. customRender: 'convertRate'
  723. }
  724. }, {
  725. title: '转化成本',
  726. dataIndex: 'convertCost',
  727. align: 'center',
  728. scopedSlots: {
  729. customRender: 'convertCost'
  730. }
  731. }, {
  732. title: '点击数',
  733. dataIndex: 'clickMaterial',
  734. align: 'center',
  735. scopedSlots: {
  736. customRender: 'clickMaterial'
  737. }
  738. }, {
  739. title: '点击安装数',
  740. dataIndex: 'clickInstall',
  741. align: 'center',
  742. scopedSlots: {
  743. customRender: 'clickInstall'
  744. }
  745. }]
  746. export default {
  747. mixins: [JeecgListMixin],
  748. data() {
  749. return {
  750. exportLoading:false,
  751. projectValue: [],
  752. dateRange: [moment().subtract(1, 'days'), moment()],
  753. projectData: [],
  754. tableData: [],
  755. tableDataChild: [],
  756. columns: [...projectColumns, ...publicColumns],
  757. columnsChildren: [],
  758. ipaginationCount: {
  759. current: 1,
  760. pageSize: 10,
  761. // pageSizeOptions: ['10', '20', '30'],
  762. showTotal: (total, range) => {
  763. return range[0] + "-" + range[1] + " 共" + total + "条"
  764. },
  765. showQuickJumper: true,
  766. // showSizeChanger: true,
  767. total: 0,
  768. onChange: current => {
  769. // 切换分页时的回调,
  770. // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
  771. this.ipaginationCount.current = current
  772. }
  773. },
  774. loading: false,
  775. loadingChild: false,
  776. tabKey: 1,
  777. currentid: undefined,
  778. accountId: undefined,
  779. projectId: undefined,
  780. campaignId: undefined,
  781. unitId: undefined,
  782. spinning: false,
  783. visible: false,
  784. imgSrc: undefined,
  785. currentRecords: {},
  786. }
  787. },
  788. methods: {
  789. //导出报表
  790. exportExcel() {
  791. this.exportLoading=true;
  792. let url=''
  793. if (this.tabKey == 1) {
  794. url='/ctop/report/exportBytedanceSaleProjectInfo'
  795. } else if (this.tabKey == 2) {
  796. url='/kuaishou/exportKuaishouSaleProjectInfo'
  797. }
  798. downFilePost(url, {
  799. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  800. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  801. projectList: this.projectValue,
  802. }).then(res => {
  803. this.exportLoading=false;
  804. let blob = new Blob([res], {
  805. type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
  806. })
  807. let downloadElement = document.createElement('a')
  808. let href = window.URL.createObjectURL(blob) //创建下载的链接
  809. downloadElement.href = href
  810. downloadElement.download = `${this.dateRange[0].format('YYYY-MM-DD')}~${this.dateRange[1].format('YYYY-MM-DD')}销售报表.xlsx` //下载后文件名
  811. document.body.appendChild(downloadElement)
  812. downloadElement.click() //点击下载
  813. document.body.removeChild(downloadElement) //下载完成移除元素
  814. window.URL.revokeObjectURL(href) //释放掉blob对象
  815. })
  816. },
  817. showClick(record) {
  818. this.visible = true
  819. this.loadingChild = true
  820. if (this.tabKey == 1) {
  821. this.columnsChildren = [...accountColumns, ...bytedanceColumns]
  822. var params = {
  823. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  824. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  825. projectId: record.projectId,
  826. pageNum: '1',
  827. pageSize: '10'
  828. }
  829. postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
  830. if (res.success) {
  831. this.loadingChild = false
  832. this.tableDataChild = res.result.list
  833. this.ipaginationCount.total = res.result.total
  834. } else {
  835. this.loadingChild = false
  836. }
  837. })
  838. } else if (this.tabKey == 2) {
  839. this.columnsChildren = [...accountColumns, ...publicColumns]
  840. var params = {
  841. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  842. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  843. projectId: record.projectId,
  844. pageNum: '1',
  845. pageSize: '10'
  846. }
  847. postAction('/kuaishou/getKuaishouAccountInfoByProjectId', params).then(res => {
  848. if (res.success) {
  849. this.loadingChild = false
  850. this.tableDataChild = res.result.list
  851. this.ipaginationCount.total = res.result.total
  852. } else {
  853. this.loadingChild = false
  854. }
  855. })
  856. }
  857. },
  858. click(record, index) {
  859. return {
  860. on: {
  861. click: () => {
  862. this.visible = true
  863. this.loadingChild = true
  864. if (this.tabKey == 1) {
  865. this.columnsChildren = [...accountColumns, ...bytedanceColumns]
  866. var params = {
  867. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  868. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  869. projectId: record.projectId,
  870. pageNum: '1',
  871. pageSize: '10'
  872. }
  873. postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
  874. if (res.success) {
  875. this.loadingChild = false
  876. this.tableDataChild = res.result.list
  877. this.ipaginationCount.total = res.result.total
  878. } else {
  879. this.loadingChild = false
  880. }
  881. })
  882. } else if (this.tabKey == 2) {
  883. this.columnsChildren = [...accountColumns, ...publicColumns]
  884. var params = {
  885. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  886. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  887. projectId: record.projectId,
  888. pageNum: '1',
  889. pageSize: '10'
  890. }
  891. postAction('/kuaishou/getKuaishouSaleAccountInfoByProjectId', params).then(res => {
  892. if (res.success) {
  893. this.loadingChild = false
  894. this.tableDataChild = res.result.list
  895. this.ipaginationCount.total = res.result.total
  896. } else {
  897. this.loadingChild = false
  898. }
  899. })
  900. }
  901. }
  902. }
  903. }
  904. },
  905. handleOk(e) {
  906. // console.log(e);
  907. this.visible = false;
  908. },
  909. openVideo(records) {
  910. this.visible = true;
  911. this.imgSrc = records.url;
  912. this.currentRecords = records
  913. },
  914. // 过滤事件
  915. filterOption(input, option) {
  916. return (
  917. option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  918. );
  919. },
  920. //table的改变(页码改变请求数据,也可以写排序)
  921. tableChange(pagination, filters, sorter, {
  922. currentDataSource
  923. }) {
  924. // this.searchHandle();
  925. this.search();
  926. },
  927. projectChange(val) {
  928. console.log(val)
  929. },
  930. dateChange(date, dateString) {
  931. console.log(date, dateString)
  932. },
  933. // tab切换事件
  934. tabKeyChange(key) {
  935. this.projectValue = []
  936. // console.log(key)
  937. if (key == 1) {
  938. this.columnsChildren = [...accountColumns, ...bytedanceColumns]
  939. postAction('/ctop/projectMember/getSaleOwnProjects', {
  940. mediaIds: [1, 3], //头条
  941. }).then(res => {
  942. console.log(res);
  943. this.projectData = res.result
  944. });
  945. } else if (key == 2) {
  946. this.columnsChildren = [...accountColumns, ...publicColumns]
  947. postAction('/ctop/projectMember/getSaleOwnProjects', {
  948. mediaIds: [2, 4], //头条
  949. }).then(res => {
  950. console.log(res);
  951. this.projectData = res.result
  952. });
  953. }
  954. this.search();
  955. },
  956. // x项目的table值
  957. getTableProjectList(paramse) {
  958. this.loading = true;
  959. this.spinning = true;
  960. // this.ipagination.current=0;
  961. this.columns = [...projectColumns, ...bytedanceColumns]
  962. postAction('/ctop/report/getBytedanceSaleProjectInfo', paramse).then(res => {
  963. console.log(res);
  964. this.tabKey = 1;
  965. this.loading = false;
  966. this.spinning = false;
  967. if (res.success) {
  968. res.result.list.forEach((item, index) => {
  969. item.key = index
  970. })
  971. this.tableData = res.result.list;
  972. this.ipagination.total = res.result.total
  973. }
  974. })
  975. },
  976. // 从项目跳转到账户,并获取账户的table值
  977. goAccount(records) {
  978. console.log(records);
  979. this.projectId = records.projectId
  980. this.getTableAccountList()
  981. },
  982. // 从账户到计划
  983. goCampaign(records) {
  984. this.accountId = records.accountId;
  985. this.getTableCampaignList()
  986. },
  987. // 从计划到组
  988. goUnit(records) {
  989. this.campaignId = records.campaignId;
  990. this.getTableUnitList()
  991. },
  992. // 从组到创意
  993. goCreative(records) {
  994. this.unitId = records.unitId;
  995. this.getTableCreativeList()
  996. },
  997. getTableAccountList(params) {
  998. this.loading = true;
  999. this.spinning = true;
  1000. // this.ipagination.current=0;
  1001. postAction('/kuaishou/getKuaishouSaleProjectInfo', params).then(res => {
  1002. console.log(res)
  1003. this.columns = [...projectColumns, ...publicColumns]
  1004. this.tabKey = 2;
  1005. this.loading = false;
  1006. this.spinning = false;
  1007. if (res.success) {
  1008. this.tableData = res.result.list
  1009. this.ipagination.total = res.result.total
  1010. }
  1011. })
  1012. },
  1013. getTableCampaignList() {
  1014. this.loading = true;
  1015. // this.ipagination.current=0;
  1016. this.spinning = true;
  1017. postAction('/kuaishou/getKuaishouCampaignInfoByAccountId', {
  1018. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1019. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1020. accountId: this.accountId,
  1021. pageNum: this.ipagination.current,
  1022. pageSize: '10'
  1023. }).then(res => {
  1024. console.log(res)
  1025. this.tabKey = 3;
  1026. this.loading = false;
  1027. this.spinning = false;
  1028. // this.columns = [...campaignColumns, ...publicColumns]
  1029. if (res.success) {
  1030. this.tableData = res.result.list
  1031. this.ipagination.total = res.result.total
  1032. }
  1033. })
  1034. },
  1035. getTableUnitList() {
  1036. this.loading = true;
  1037. // this.ipagination.current=0;
  1038. this.spinning = true;
  1039. postAction('/kuaishou/getKuaishouUnitInfoByCampaignId', {
  1040. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1041. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1042. campaignId: this.campaignId,
  1043. pageNum: this.ipagination.current,
  1044. pageSize: '10'
  1045. }).then(res => {
  1046. console.log(res)
  1047. this.tabKey = 4;
  1048. this.loading = false;
  1049. this.spinning = false;
  1050. // this.columns = [...unitColumns, ...publicColumns]
  1051. if (res.success) {
  1052. this.tableData = res.result.list
  1053. this.ipagination.total = res.result.total
  1054. }
  1055. })
  1056. },
  1057. getTableCreativeList() {
  1058. this.loading = true;
  1059. // this.ipagination.current=0;
  1060. this.spinning = true;
  1061. postAction('/kuaishou/getKuaishouCreativeInfoByUnitId', {
  1062. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1063. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1064. unitId: this.unitId,
  1065. pageNum: this.ipagination.current,
  1066. pageSize: '10'
  1067. }).then(res => {
  1068. console.log(res)
  1069. this.tabKey = 5;
  1070. this.loading = false;
  1071. this.spinning = false;
  1072. // this.columns = [...ideaColumns, ...publicColumns]
  1073. if (res.success) {
  1074. this.tableData = res.result.list
  1075. this.ipagination.total = res.result.total
  1076. }
  1077. })
  1078. },
  1079. search() {
  1080. if (this.tabKey == 1) {
  1081. this.getTableProjectList({
  1082. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1083. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1084. projectList: this.projectValue,
  1085. pageNum: this.ipagination.current,
  1086. pageSize: '10'
  1087. })
  1088. } else if (this.tabKey == 2) {
  1089. this.getTableAccountList({
  1090. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1091. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1092. projectList: this.projectValue,
  1093. pageNum: '0',
  1094. pageSize: '10'
  1095. });
  1096. }
  1097. },
  1098. },
  1099. watch: {
  1100. 'ipagination.current': function (n, o) {
  1101. if (this.tabKey == 1) {
  1102. this.getTableProjectList({
  1103. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1104. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1105. projectList: this.projectValue,
  1106. pageNum: this.ipagination.current,
  1107. pageSize: '10'
  1108. })
  1109. } else if (this.tabKey == 2) {
  1110. this.getTableAccountList({
  1111. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1112. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1113. projectList: [],
  1114. pageNum: this.ipagination.current,
  1115. pageSize: '10'
  1116. });
  1117. }
  1118. },
  1119. 'ipaginationCount.current': function (n, o) {
  1120. if (this.tabKey == 1) {
  1121. var params = {
  1122. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1123. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1124. projectId: record.projectId,
  1125. pageNum: this.ipaginationCount.current,
  1126. pageSize: '10'
  1127. }
  1128. postAction('/ctop/report/getBytedanceAccountInfoByProjectId', params).then(res => {
  1129. // this.columnsChildren = [...accountColumns, ...bytedanceColumns]
  1130. if (res.success) {
  1131. this.loadingChild = false
  1132. this.tableDataChild = res.result.list
  1133. this.ipaginationCount.total = res.result.total
  1134. } else {
  1135. this.loadingChild = false
  1136. }
  1137. })
  1138. } else if (this.tabKey == 2) {
  1139. var params = {
  1140. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1141. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1142. projectId: record.projectId,
  1143. pageNum: this.ipaginationCount.current,
  1144. pageSize: '10'
  1145. }
  1146. postAction('/kuaishou/getKuaishouAccountInfoByProjectId', params).then(res => {
  1147. // this.columnsChildren = [...accountColumns, ...publicColumns]
  1148. if (res.success) {
  1149. this.loadingChild = false
  1150. this.tableDataChild = res.result.list
  1151. this.ipaginationCount.total = res.result.total
  1152. } else {
  1153. this.loadingChild = false
  1154. }
  1155. })
  1156. }
  1157. }
  1158. },
  1159. mounted() {
  1160. // /ctop/projectMember/participateList
  1161. // var arr = this.request.split(',')
  1162. // var dataTwo = []
  1163. // var data = res.result.filter(item => {
  1164. // return item.mediaId == arr[0]
  1165. // })
  1166. // if (arr.length > 1) {
  1167. // dataTwo = res.result.filter(item => {
  1168. // return item.mediaId == arr[1]
  1169. // })
  1170. // }
  1171. postAction('/ctop/projectMember/getSaleOwnProjects', {
  1172. mediaIds: [1, 3], //头条
  1173. }).then(res => {
  1174. console.log(res);
  1175. this.projectData = res.result
  1176. });
  1177. console.log(this.dateRange)
  1178. this.getTableProjectList({
  1179. startDate: this.dateRange[0].format('YYYY-MM-DD'),
  1180. endDate: this.dateRange[1].format('YYYY-MM-DD'),
  1181. projectList: [],
  1182. pageNum: '0',
  1183. pageSize: '10'
  1184. });
  1185. },
  1186. filters: {
  1187. toPercentage(val) {
  1188. if (val) {
  1189. if (typeof val != 'string') {
  1190. return (val * 100).toFixed(2) + '%'
  1191. } else {
  1192. return val
  1193. }
  1194. } else if (typeof val == 'string') {
  1195. return val
  1196. } else {
  1197. return 0
  1198. }
  1199. },
  1200. //保留两位小数并且变成货币格式
  1201. decimalsHandle(val) {
  1202. if (val && typeof val != 'string') {
  1203. if (val >= 0) {
  1204. val = parseFloat(val).toFixed(2);
  1205. let numberStr = val.toString()
  1206. let str = numberStr.split('.')
  1207. let str0 = str[0].split('').reverse();
  1208. for (let i = 0; i < str0.length; i++) {
  1209. if ((i + 1) % 4 === 0) {
  1210. str0.splice(i, 0, ',')
  1211. }
  1212. }
  1213. str0.reverse()
  1214. let handleResult = ''
  1215. for (let j = 0; j < str0.length; j++) {
  1216. handleResult += str0[j]
  1217. }
  1218. return handleResult + '.' + str[1]
  1219. } else {
  1220. val = parseFloat(val).toFixed(2);
  1221. let numberStr = val.toString()
  1222. let str = numberStr.split('.')
  1223. let str0 = str[0].substr(1).split('').reverse();
  1224. for (let i = 0; i < str0.length; i++) {
  1225. if ((i + 1) % 4 === 0) {
  1226. str0.splice(i, 0, ',')
  1227. }
  1228. }
  1229. str0.reverse()
  1230. let handleResult = ''
  1231. for (let j = 0; j < str0.length; j++) {
  1232. handleResult += str0[j]
  1233. }
  1234. return '-' + handleResult + '.' + str[1]
  1235. }
  1236. } else if (typeof val == 'string') {
  1237. return val
  1238. } else {
  1239. return 0
  1240. }
  1241. },
  1242. //变成货币格式
  1243. formatCurrency(val) {
  1244. if ((val || val == 0) && typeof val != 'string') {
  1245. let numberStr = val.toString()
  1246. let str = numberStr.split('').reverse()
  1247. for (let i = 0; i < str.length; i++) {
  1248. if ((i + 1) % 4 === 0) {
  1249. str.splice(i, 0, ',')
  1250. }
  1251. }
  1252. str.reverse()
  1253. let handleResult = ''
  1254. for (let j = 0; j < str.length; j++) {
  1255. handleResult += str[j]
  1256. }
  1257. return handleResult
  1258. } else if (typeof val == 'string') {
  1259. return val
  1260. } else {
  1261. return '-'
  1262. }
  1263. }
  1264. }
  1265. }
  1266. </script>
  1267. <style lang="less">
  1268. .resize-table-th {
  1269. position: relative;
  1270. .table-draggable-handle {
  1271. height: 100% !important;
  1272. bottom: 0;
  1273. left: auto !important;
  1274. right: -5px;
  1275. cursor: col-resize;
  1276. touch-action: none;
  1277. }
  1278. }
  1279. </style>
  1280. <style lang="scss" scoped>
  1281. .effectPage {
  1282. .moduler {
  1283. background: #fff;
  1284. margin-bottom: 16px;
  1285. position: relative;
  1286. padding: 32px 24px 48px 32px;
  1287. border-radius: 4px;
  1288. box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
  1289. .opt {
  1290. position: absolute;
  1291. top: 32px;
  1292. right: 24px;
  1293. }
  1294. .moduler-title {
  1295. display: flex;
  1296. align-items: 'center';
  1297. font-size: 22px;
  1298. margin-bottom: 20px;
  1299. }
  1300. .row-item {
  1301. display: flex;
  1302. justify-content: flex-start;
  1303. align-items: 'center';
  1304. margin-bottom: 32px;
  1305. }
  1306. .row-item:last-of-type {
  1307. margin-bottom: 0;
  1308. }
  1309. .row-item .hint-item {
  1310. width: 24px;
  1311. min-width: 24px;
  1312. align-self: flex-start;
  1313. line-height: 20px;
  1314. height: 20px;
  1315. margin-top: 5px;
  1316. }
  1317. .row-item .label-item {
  1318. position: relative;
  1319. align-items: flex-start;
  1320. align-self: flex-start;
  1321. line-height: 20px;
  1322. height: 20px;
  1323. margin-top: 7px;
  1324. width: 80px;
  1325. min-width: 80px;
  1326. .text-item {
  1327. font-size: 14px;
  1328. width: 60px;
  1329. }
  1330. }
  1331. .row-item .required-item {
  1332. width: 4px;
  1333. height: 4px;
  1334. border-radius: 2px;
  1335. background: #f45858;
  1336. position: absolute;
  1337. right: 10px;
  1338. top: 50%;
  1339. transform: translateY(-50%);
  1340. }
  1341. .row-item .input-item {
  1342. min-width: 480px;
  1343. position: relative;
  1344. // height: 35px;
  1345. .tip {
  1346. font-size: 12px;
  1347. color: tomato;
  1348. }
  1349. }
  1350. .tableBody {
  1351. margin-top: 10px;
  1352. }
  1353. }
  1354. .spin-content {
  1355. border: 1px solid #91d5ff;
  1356. background-color: #e6f7ff;
  1357. padding: 30px;
  1358. }
  1359. }
  1360. </style>