tableMonitorConfig.tsx 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035
  1. import useCopy from '@/Hook/useCopy'
  2. import { RiseOutlined } from '@ant-design/icons'
  3. import { Progress, Space, Statistic } from 'antd'
  4. import { ColumnsType } from 'antd/lib/table'
  5. import React from 'react'
  6. import { ReactComponent as RocketSvg } from '@/assets/rocket.svg'
  7. import '@/pages/adMonitor/adMonitorList/index.less'
  8. import { CHUJIAFANGSHI, YOUHUAMUBIAO } from '@/pages/adMonitor/adMonitorList/enum'
  9. import { copy } from '@/utils/utils'
  10. import { ADGROUP_STATUS } from '../adqv3/const'
  11. function columnsMonitor(planDetail: (id: number) => void, details: (id: number) => void, onChange: (value: any) => void, log: (value: any) => void, sync: (data: any) => void) {
  12. const { copy } = useCopy()
  13. return function columns() {
  14. let newArr: ColumnsType<any> = [
  15. {
  16. title: '时间',
  17. dataIndex: 'day',
  18. key: 'day',
  19. align: 'center',
  20. width: 120,
  21. ellipsis: true
  22. },
  23. {
  24. title: '广告名称',
  25. dataIndex: 'adgroup_name',
  26. key: 'adgroup_name',
  27. align: 'center',
  28. width: 170,
  29. ellipsis: true,
  30. render: (str, b) => {
  31. return <a style={{ color: '#1890ff', fontSize: 12 }} onClick={() => { onChange(b.adgroup_id) }}>{str}</a>
  32. }
  33. },
  34. {
  35. title: '广告ID',
  36. dataIndex: 'adgroup_id',
  37. key: 'adgroup_id',
  38. align: 'center',
  39. width: 100,
  40. ellipsis: true,
  41. render: (a: any) => {
  42. return <a onClick={() => { copy(a) }} style={{ color: '#3946c3' }}>{a}</a>
  43. }
  44. },
  45. {
  46. title: '广告账户',
  47. dataIndex: 'account_id',
  48. key: 'account_id',
  49. width: 70,
  50. ellipsis: true,
  51. align: 'center'
  52. },
  53. {
  54. title: '投手',
  55. dataIndex: 'put_user_name',
  56. key: 'put_user_name',
  57. align: 'center',
  58. ellipsis: true,
  59. width: 65
  60. },
  61. {
  62. title: '投放时间',
  63. dataIndex: 'begin_date',
  64. key: 'begin_date',
  65. width: 110,
  66. align: 'center',
  67. ellipsis: true,
  68. render(value, record) {
  69. return value + '~' + (record?.end_date === '1970-01-01' ? '长期投放' : record?.end_date)
  70. },
  71. },
  72. {
  73. title: '广告状态',
  74. dataIndex: 'system_status',
  75. key: 'system_status',
  76. align: 'center',
  77. width: 105,
  78. ellipsis: true,
  79. render: (a: any) => {
  80. return ADGROUP_STATUS[a] || '--'
  81. }
  82. },
  83. {
  84. title: '广告预算',
  85. dataIndex: 'daily_budget',
  86. key: 'daily_budget',
  87. width: 110,
  88. align: 'center',
  89. ellipsis: true,
  90. render: (a: any) => {
  91. return <Statistic value={a || 0} />
  92. }
  93. },
  94. {
  95. title: '出价方式',
  96. dataIndex: 'bid_mode',
  97. key: 'bid_mode',
  98. align: 'center',
  99. width: 80,
  100. render: (a: any) => {
  101. return CHUJIAFANGSHI[a] || '--'
  102. }
  103. },
  104. {
  105. title: '当前出价',
  106. dataIndex: 'bid_amount',
  107. key: 'bid_amount',
  108. width: 110,
  109. align: 'center',
  110. ellipsis: true,
  111. render: (a: any) => {
  112. return <div style={a >= 500 ? { backgroundColor: 'rgba(255, 80, 82, .72)', height: 26, color: '#fff', display: 'flex', justifyContent: 'center', alignItems: 'center', fontWeight: 600 } : {}}><Statistic value={a || 0} valueStyle={a >= 500 ? { fontSize: 14 } : {}} /></div>
  113. }
  114. },
  115. {
  116. title: '广告总消耗',
  117. dataIndex: 'cost_total',
  118. key: 'cost_total',
  119. align: 'center',
  120. width: 100,
  121. ellipsis: true,
  122. sorter: true,
  123. render: (a: any) => {
  124. return <div style={{ height: 26, position: 'relative' }}>
  125. <Progress
  126. strokeColor={{
  127. from: '#10c1e9',
  128. to: '#6892d0',
  129. }}
  130. status="active"
  131. showInfo={false}
  132. percent={a ? a / 30000 * 100 : 0}
  133. />
  134. <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 30000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
  135. </div>
  136. }
  137. },
  138. {
  139. title: '今日消耗',
  140. dataIndex: 'cost_day',
  141. key: 'cost_day',
  142. align: 'center',
  143. width: 105,
  144. sorter: true,
  145. render: (a: any) => {
  146. return <div style={{ height: 26, position: 'relative' }}>
  147. <Progress
  148. strokeColor={{
  149. from: '#ff5900',
  150. to: '#ffd380',
  151. }}
  152. status="active"
  153. showInfo={false}
  154. percent={a ? a / 2000 * 100 : 0}
  155. />
  156. <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 2000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
  157. </div>
  158. }
  159. },
  160. {
  161. title: '当前小时消耗',
  162. dataIndex: 'cost_hour',
  163. key: 'cost_hour',
  164. align: 'center',
  165. width: 110,
  166. sorter: true,
  167. render: (a: any) => {
  168. return <div style={{ height: 26, position: 'relative' }}>
  169. <Progress
  170. strokeColor={{
  171. from: '#e7a0f5',
  172. to: '#d161f7',
  173. }}
  174. status="active"
  175. showInfo={false}
  176. percent={a ? a / 300 * 100 : 0}
  177. />
  178. <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 300 ? { color: '#000', fontWeight: 500, fontSize: 15 } : { fontWeight: 500, fontSize: 15 }} /></span>
  179. </div>
  180. }
  181. },
  182. {
  183. title: '前第1小时消耗',
  184. dataIndex: 'cost_last_hour',
  185. key: 'cost_last_hour',
  186. align: 'center',
  187. width: 110,
  188. sorter: true,
  189. render: (a: any) => {
  190. return <Statistic value={a || 0} />
  191. }
  192. },
  193. {
  194. title: '前第2小时消耗',
  195. dataIndex: 'cost_last_two_hour',
  196. key: 'cost_last_two_hour',
  197. align: 'center',
  198. width: 80,
  199. sorter: true,
  200. render: (a: any) => {
  201. return <Statistic value={a || 0} />
  202. }
  203. },
  204. {
  205. title: '前第3小时消耗',
  206. dataIndex: 'cost_last_three_hour',
  207. key: 'cost_last_three_hour',
  208. align: 'center',
  209. width: 110,
  210. sorter: true,
  211. render: (a: number) => {
  212. return <Statistic value={a || 0} />
  213. },
  214. },
  215. {
  216. title: '当前小时消耗差额',
  217. dataIndex: 'cost_diff_before_hour',
  218. key: 'cost_diff_before_hour',
  219. align: 'center',
  220. width: 125,
  221. sorter: true,
  222. render: (a: any) => {
  223. return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
  224. }
  225. },
  226. {
  227. title: '前第1小时消耗差额',
  228. dataIndex: 'cost_diff_before_two_hour',
  229. key: 'cost_diff_before_two_hour',
  230. align: 'center',
  231. width: 125,
  232. sorter: true,
  233. render: (a: any) => {
  234. return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
  235. }
  236. },
  237. {
  238. title: "前第2小时消耗差额",
  239. dataIndex: 'cost_diff_before_three_hour',
  240. key: 'cost_diff_before_three_hour',
  241. align: 'center',
  242. width: 125,
  243. sorter: true,
  244. render: (a: number) => {
  245. return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
  246. },
  247. },
  248. {
  249. title: "前三小时消耗趋势",
  250. dataIndex: 'cost_trend_last_three_hour',
  251. key: 'cost_trend_last_three_hour',
  252. align: 'center',
  253. width: 75,
  254. render: (a: number) => {
  255. return a > 0 ? <RiseOutlined style={{ color: 'red', fontWeight: 900, fontSize: 22 }} /> : '--'
  256. },
  257. },
  258. {
  259. title: '当前5min消耗流速',
  260. dataIndex: 'cost_speed',
  261. key: 'cost_speed',
  262. align: 'center',
  263. width: 115,
  264. render: (a: any) => {
  265. a = a ? parseFloat(a.toFixed(2)) : 0
  266. return <div style={{ height: 26, position: 'relative' }}>
  267. <Progress
  268. strokeColor={{
  269. from: '#00DDFF',
  270. to: '#37A2FF',
  271. }}
  272. status="active"
  273. showInfo={false}
  274. percent={a ? a / 100 * 100 : 0}
  275. />
  276. <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 100 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
  277. </div>
  278. }
  279. },
  280. {
  281. title: '曝光量',
  282. dataIndex: 'view_day',
  283. key: 'view_day',
  284. align: 'center',
  285. width: 70,
  286. sorter: true,
  287. render: (a: number) => {
  288. return <Statistic value={a || 0} />
  289. },
  290. },
  291. {
  292. title: '千次曝光成本',
  293. dataIndex: 'thousand_display_price_day',
  294. key: 'thousand_display_price_day',
  295. align: 'center',
  296. width: 115,
  297. sorter: true,
  298. render: (a: any) => {
  299. return <Statistic value={a || 0} />
  300. }
  301. },
  302. {
  303. title: '点击量',
  304. dataIndex: 'click_day',
  305. key: 'click_day',
  306. align: 'center',
  307. width: 70,
  308. sorter: true,
  309. render: (a: number) => {
  310. return <Statistic value={a || 0} />
  311. },
  312. },
  313. {
  314. title: '点击均价',
  315. dataIndex: 'cpc_day',
  316. key: 'cpc_day',
  317. align: 'center',
  318. width: 115,
  319. sorter: true,
  320. render: (a: any) => {
  321. return <Statistic value={a || 0} />
  322. }
  323. },
  324. {
  325. title: '点击率',
  326. dataIndex: 'ctr_day',
  327. key: 'ctr_day',
  328. align: 'center',
  329. width: 115,
  330. sorter: true,
  331. render: (a: any) => {
  332. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  333. return a + '%'
  334. }
  335. },
  336. {
  337. title: '优化目标',
  338. dataIndex: 'optimization_goal',
  339. key: 'optimization_goal',
  340. align: 'center',
  341. width: 115,
  342. render: (a: any) => {
  343. return YOUHUAMUBIAO[a] || '--'
  344. }
  345. },
  346. {
  347. title: '转化目标量',
  348. dataIndex: 'conversions_count_day',
  349. key: 'conversions_count_day',
  350. align: 'center',
  351. width: 115,
  352. sorter: true,
  353. render: (a: any) => {
  354. return <Statistic value={a || 0} />
  355. }
  356. },
  357. {
  358. title: '转化目标成本',
  359. dataIndex: 'conversions_cost_day',
  360. key: 'conversions_cost_day',
  361. align: 'center',
  362. width: 115,
  363. sorter: true,
  364. render: (a: any) => {
  365. return <div style={a > 500 ? { backgroundColor: '#efea5b', height: 26, color: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'center', fontWeight: 600 } : {}}><Statistic value={a || 0} /></div>
  366. }
  367. },
  368. {
  369. title: '目标转化率',
  370. dataIndex: 'conversions_rate_day',
  371. key: 'conversions_rate_day',
  372. align: 'center',
  373. width: 115,
  374. sorter: true,
  375. render: (a: any) => {
  376. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  377. return a + '%'
  378. }
  379. },
  380. {
  381. title: '下单量',
  382. dataIndex: 'order_count_day',
  383. key: 'order_count_day',
  384. align: 'center',
  385. width: 115,
  386. sorter: true,
  387. render: (a: any) => {
  388. return <Statistic value={a || 0} />
  389. }
  390. },
  391. // {
  392. // title: '首日新增下单量',
  393. // dataIndex: 'first_dayOrder_count_day',
  394. // key: 'first_dayOrder_count_day',
  395. // align: 'center',
  396. // width: 115,
  397. // sorter: true,
  398. // render: (a: any) => {
  399. // return <Statistic value={a || 0} />
  400. // }
  401. // },
  402. {
  403. title: '下单成本',
  404. dataIndex: 'order_cost_day',
  405. key: 'order_cost_day',
  406. align: 'center',
  407. width: 115,
  408. sorter: true,
  409. render: (a: any) => {
  410. return <Statistic value={a || 0} />
  411. }
  412. },
  413. {
  414. title: '下单率',
  415. dataIndex: 'order_rate_day',
  416. key: 'order_rate_day',
  417. align: 'center',
  418. width: 115,
  419. sorter: true,
  420. render: (a: any) => {
  421. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  422. return a + '%'
  423. }
  424. },
  425. {
  426. title: '下单金额',
  427. dataIndex: 'order_amount_day',
  428. key: 'order_amount_day',
  429. align: 'center',
  430. width: 115,
  431. sorter: true,
  432. render: (a: any) => {
  433. return <Statistic value={a || 0} />
  434. }
  435. },
  436. // {
  437. // title: '首日新增下单金额',
  438. // dataIndex: 'first_day_order_amount_day',
  439. // key: 'first_day_order_amount_day',
  440. // align: 'center',
  441. // width: 115,
  442. // sorter: true,
  443. // render: (a: any) => {
  444. // return <Statistic value={a || 0} />
  445. // }
  446. // },
  447. {
  448. title: '下单客单价',
  449. dataIndex: 'atv_day',
  450. key: 'atv_day',
  451. align: 'center',
  452. width: 115,
  453. sorter: true,
  454. render: (a: any) => {
  455. return <Statistic value={a || 0} />
  456. }
  457. },
  458. {
  459. title: '下单ROI',
  460. dataIndex: 'order_roi_day',
  461. key: 'order_roi_day',
  462. align: 'center',
  463. width: 115,
  464. sorter: true,
  465. render: (a: any) => {
  466. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  467. return a + '%'
  468. }
  469. },
  470. // {
  471. // title: '首日新增下单ROI',
  472. // dataIndex: 'first_day_order_roi_day',
  473. // key: 'first_day_order_roi_day',
  474. // align: 'center',
  475. // width: 115,
  476. // sorter: true,
  477. // render: (a: any) => {
  478. // a = a ? parseFloat((a * 100).toFixed(2)) : 0
  479. // return a + '%'
  480. // }
  481. // },
  482. {
  483. title: '公众号关注人数',
  484. dataIndex: 'mp_follow_uv_day',
  485. key: 'mp_follow_uv_day',
  486. align: 'center',
  487. width: 115,
  488. sorter: true,
  489. render: (a: any) => {
  490. return a
  491. }
  492. },
  493. {
  494. title: '公众号关注率',
  495. dataIndex: 'mp_follow_rate_day',
  496. key: 'mp_follow_rate_day',
  497. align: 'center',
  498. width: 115,
  499. sorter: true,
  500. render: (a: any) => {
  501. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  502. return a + '%'
  503. }
  504. },
  505. {
  506. title: '公众号关注成本',
  507. dataIndex: 'mp_follow_cost_day',
  508. key: 'mp_follow_cost_day',
  509. align: 'center',
  510. width: 115,
  511. sorter: true,
  512. render: (a: any) => {
  513. return <Statistic value={a || 0} />
  514. }
  515. },
  516. {
  517. title: '加粉成本',
  518. dataIndex: 'add_fans_cost_day',
  519. key: 'add_fans_cost_day',
  520. align: 'center',
  521. width: 75,
  522. // sorter: true,
  523. render: (a: any) => {
  524. return <Statistic value={a || 0} />
  525. }
  526. },
  527. {
  528. title: '公众号关注次数成本',
  529. dataIndex: 'mp_follow_pv_cost_day',
  530. key: 'mp_follow_pv_cost_day',
  531. align: 'center',
  532. width: 80,
  533. // sorter: true,
  534. render: (a: any) => {
  535. return <Statistic value={a || 0} />
  536. }
  537. },
  538. {
  539. title: '加粉数',
  540. dataIndex: 'add_fans_count_day',
  541. key: 'add_fans_count_day',
  542. align: 'center',
  543. width: 75,
  544. // sorter: true,
  545. render: (a: any) => {
  546. return <Statistic value={a || 0} />
  547. }
  548. },
  549. {
  550. title: '公众号关注次数',
  551. dataIndex: 'mp_follow_pv_day',
  552. key: 'mp_follow_pv_day',
  553. align: 'center',
  554. width: 75,
  555. // sorter: true,
  556. render: (a: any) => {
  557. return <Statistic value={a || 0} />
  558. }
  559. },
  560. {
  561. title: '加企业微信客服人数',
  562. dataIndex: 'scan_follow_uv_day',
  563. key: 'scan_follow_uv_day',
  564. align: 'center',
  565. width: 80,
  566. // sorter: true,
  567. render: (a: any) => {
  568. return <Statistic value={a || 0} />
  569. }
  570. },
  571. {
  572. title: '加企业微信客服成本',
  573. dataIndex: 'scan_follow_cost_day',
  574. key: 'scan_follow_cost_day',
  575. align: 'center',
  576. width: 80,
  577. // sorter: true,
  578. render: (a: any) => {
  579. return <Statistic value={a || 0} />
  580. }
  581. },
  582. {
  583. title: '加企业微信客服率',
  584. dataIndex: 'scan_follow_rate_day',
  585. key: 'scan_follow_rate_day',
  586. align: 'center',
  587. width: 80,
  588. // sorter: true,
  589. render: (a: any) => {
  590. a = a ? parseFloat((a * 100).toFixed(2)) : 0
  591. return a + '%'
  592. }
  593. },
  594. {
  595. title: '操作',
  596. dataIndex: 'event',
  597. key: 'event',
  598. align: 'center',
  599. width: 180,
  600. render: (a: string, b: any) => (<Space>
  601. <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', fontSize: 14 }} onClick={() => details(b)}>
  602. <span role="img" aria-label="fund-view" className="anticon anticon-fund-view"><RocketSvg /></span><a style={{ marginLeft: 4, color: '#1890ff', fontSize: 12 }}>详情</a>
  603. </div>
  604. <a onClick={() => log(b)}>告警日志</a>
  605. <a style={{ color: '#1890ff', fontSize: 12 }} onClick={() => window.open(`https://ad.qq.com/atlas/${b?.account_id}/admanage/index?tab=adgroup&query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[],%22search_name%22:%22${b.adgroup_id}%22}`)} target="_blank">腾讯广告</a>
  606. <a onClick={() => sync(b)}>同步</a>
  607. </Space>
  608. )
  609. }
  610. ]
  611. return newArr
  612. }
  613. }
  614. let columnsList = () => {
  615. return function columns() {
  616. let newArr: ColumnsType<any> = [
  617. {
  618. title: '时间',
  619. dataIndex: 'time',
  620. key: 'time',
  621. align: 'center',
  622. width: 120,
  623. sorter: true,
  624. ellipsis: true
  625. },
  626. {
  627. title: '数据更新时间',
  628. dataIndex: 'create_time',
  629. key: 'create_time',
  630. align: 'center',
  631. width: 120,
  632. ellipsis: true
  633. },
  634. {
  635. title: '广告ID',
  636. dataIndex: 'adgroup_id',
  637. key: 'adgroup_id',
  638. align: 'center',
  639. width: 100,
  640. ellipsis: true,
  641. render: (a: any) => {
  642. return <a onClick={() => { copy(a) }} style={{ color: '#3946c3' }}>{a}</a>
  643. }
  644. },
  645. {
  646. title: '广告账户',
  647. dataIndex: 'account_id',
  648. key: 'account_id',
  649. width: 70,
  650. ellipsis: true,
  651. align: 'center'
  652. },
  653. {
  654. title: '消耗',
  655. dataIndex: 'cost',
  656. key: 'cost',
  657. align: 'center',
  658. width: 90,
  659. render: (a: any, b: any) => {
  660. return <Statistic value={a || 0} />
  661. }
  662. },
  663. {
  664. title: '曝光量',
  665. dataIndex: 'view',
  666. key: 'view',
  667. align: 'center',
  668. width: 80
  669. },
  670. {
  671. title: '千次曝光成本',
  672. dataIndex: 'thousand_display_price',
  673. key: 'thousand_display_price',
  674. align: 'center',
  675. width: 90,
  676. render: (a: any, b: any) => {
  677. return <Statistic value={a || 0} />
  678. }
  679. },
  680. {
  681. title: '点击量',
  682. dataIndex: 'click',
  683. key: 'click',
  684. align: 'center',
  685. width: 90,
  686. render: (a: any, b: any) => {
  687. return <Statistic value={a || 0} />
  688. }
  689. },
  690. {
  691. title: '点击率',
  692. dataIndex: 'ctr',
  693. key: 'ctr',
  694. align: 'center',
  695. width: 90,
  696. render: (a: any, b: any) => {
  697. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  698. }
  699. },
  700. {
  701. title: '点击均价',
  702. dataIndex: 'cpc',
  703. key: 'cpc',
  704. align: 'center',
  705. width: 90,
  706. render: (a: any, b: any) => {
  707. return <Statistic value={a || 0} />
  708. }
  709. },
  710. {
  711. title: '不感兴趣点击次数',
  712. dataIndex: 'no_interest_count',
  713. key: 'no_interest_count',
  714. align: 'center',
  715. width: 90,
  716. render: (a: any, b: any) => {
  717. return <Statistic value={a || 0} />
  718. }
  719. },
  720. {
  721. title: '朋友圈视频播放次数',
  722. dataIndex: 'video_play_count',
  723. key: 'video_play_count',
  724. align: 'center',
  725. width: 90,
  726. render: (a: any, b: any) => {
  727. return <Statistic value={a || 0} />
  728. }
  729. },
  730. {
  731. title: '下载次数',
  732. dataIndex: 'download_count',
  733. key: 'download_count',
  734. align: 'center',
  735. width: 90,
  736. render: (a: any, b: any) => {
  737. return <Statistic value={a || 0} />
  738. }
  739. },
  740. {
  741. title: '安装次数',
  742. dataIndex: 'install_count',
  743. key: 'install_count',
  744. align: 'center',
  745. width: 90,
  746. render: (a: any, b: any) => {
  747. return <Statistic value={a || 0} />
  748. }
  749. },
  750. {
  751. title: '激活次数',
  752. dataIndex: 'activated_count',
  753. key: 'activated_count',
  754. align: 'center',
  755. width: 90,
  756. render: (a: any, b: any) => {
  757. return <Statistic value={a || 0} />
  758. }
  759. },
  760. {
  761. title: '公众号关注人数',
  762. dataIndex: 'mp_follow_uv',
  763. key: 'mp_follow_uv',
  764. align: 'center',
  765. width: 90,
  766. render: (a: any, b: any) => {
  767. return <Statistic value={a || 0} />
  768. }
  769. },
  770. {
  771. title: '公众号关注成本',
  772. dataIndex: 'mp_follow_cost',
  773. key: 'mp_follow_cost',
  774. align: 'center',
  775. width: 90,
  776. render: (a: any, b: any) => {
  777. return <Statistic value={a || 0} />
  778. }
  779. },
  780. {
  781. title: '公众号关注率',
  782. dataIndex: 'mp_follow_rate',
  783. key: 'mp_follow_rate',
  784. align: 'center',
  785. width: 90,
  786. render: (a: any, b: any) => {
  787. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  788. }
  789. },
  790. {
  791. title: '公众号关注次数',
  792. dataIndex: 'mp_follow_pv',
  793. key: 'mp_follow_pv',
  794. align: 'center',
  795. width: 90,
  796. render: (a: any, b: any) => {
  797. return <Statistic value={a || 0} />
  798. }
  799. },
  800. {
  801. title: '公众号关注次数成本',
  802. dataIndex: 'mp_follow_pv_cost',
  803. key: 'mp_follow_pv_cost',
  804. align: 'center',
  805. width: 100,
  806. render: (a: any, b: any) => {
  807. return <Statistic value={a || 0} />
  808. }
  809. },
  810. {
  811. title: '快应用添加次数',
  812. dataIndex: 'add_quick_app_pv',
  813. key: 'add_quick_app_pv',
  814. align: 'center',
  815. width: 90,
  816. render: (a: any, b: any) => {
  817. return <Statistic value={a || 0} />
  818. }
  819. },
  820. {
  821. title: '快应用添加成本',
  822. dataIndex: 'add_quick_app_cost',
  823. key: 'add_quick_app_cost',
  824. align: 'center',
  825. width: 90,
  826. render: (a: any, b: any) => {
  827. return <Statistic value={a || 0} />
  828. }
  829. },
  830. {
  831. title: '快应用添加率',
  832. dataIndex: 'add_quick_app_rate',
  833. key: 'add_quick_app_rate',
  834. align: 'center',
  835. width: 90,
  836. render: (a: any, b: any) => {
  837. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  838. }
  839. },
  840. {
  841. title: '加企业微信客服人数',
  842. dataIndex: 'scan_follow_uv',
  843. key: 'scan_follow_uv',
  844. align: 'center',
  845. width: 100,
  846. render: (a: any, b: any) => {
  847. return <Statistic value={a || 0} />
  848. }
  849. },
  850. {
  851. title: '加企业微信客服成本',
  852. dataIndex: 'scan_follow_cost',
  853. key: 'scan_follow_cost',
  854. align: 'center',
  855. width: 100,
  856. render: (a: any, b: any) => {
  857. return <Statistic value={a || 0} />
  858. }
  859. },
  860. {
  861. title: '加企业微信客服率',
  862. dataIndex: 'scan_follow_rate',
  863. key: 'scan_follow_rate',
  864. align: 'center',
  865. width: 100,
  866. render: (a: any, b: any) => {
  867. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  868. }
  869. },
  870. {
  871. title: '首日新增下单量',
  872. dataIndex: 'first_day_order_count',
  873. key: 'first_day_order_count',
  874. align: 'center',
  875. width: 90,
  876. render: (a: any, b: any) => {
  877. return <Statistic value={a || 0} />
  878. }
  879. },
  880. {
  881. title: '首日新增下单金额',
  882. dataIndex: 'first_day_order_amount',
  883. key: 'first_day_order_amount',
  884. align: 'center',
  885. width: 90,
  886. render: (a: any, b: any) => {
  887. return <Statistic value={a || 0} />
  888. }
  889. },
  890. {
  891. title: '首日新增下单ROI',
  892. dataIndex: 'first_day_order_roi',
  893. key: 'first_day_order_roi',
  894. align: 'center',
  895. width: 90,
  896. render: (a: any, b: any) => {
  897. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  898. }
  899. },
  900. {
  901. title: '订单量',
  902. dataIndex: 'order_count',
  903. key: 'order_count',
  904. align: 'center',
  905. width: 90,
  906. render: (a: any, b: any) => {
  907. return <Statistic value={a || 0} />
  908. }
  909. },
  910. {
  911. title: '订单金额',
  912. dataIndex: 'order_amount',
  913. key: 'order_amount',
  914. align: 'center',
  915. width: 90,
  916. render: (a: any, b: any) => {
  917. return <Statistic value={a || 0} />
  918. }
  919. },
  920. {
  921. title: '下单成本',
  922. dataIndex: 'order_cost',
  923. key: 'order_cost',
  924. align: 'center',
  925. width: 90,
  926. render: (a: any, b: any) => {
  927. return <Statistic value={a || 0} />
  928. }
  929. },
  930. {
  931. title: '下单率',
  932. dataIndex: 'order_rate',
  933. key: 'order_rate',
  934. align: 'center',
  935. width: 90,
  936. render: (a: any, b: any) => {
  937. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  938. }
  939. },
  940. {
  941. title: '下单ROI',
  942. dataIndex: 'order_roi',
  943. key: 'order_roi',
  944. align: 'center',
  945. width: 90,
  946. render: (a: any, b: any) => {
  947. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  948. }
  949. },
  950. {
  951. title: '客单价',
  952. dataIndex: 'atv',
  953. key: 'atv',
  954. align: 'center',
  955. width: 90,
  956. render: (a: any, b: any) => {
  957. return <Statistic value={a || 0} />
  958. }
  959. },
  960. {
  961. title: '转化量',
  962. dataIndex: 'conversions_count',
  963. key: 'conversions_count',
  964. align: 'center',
  965. width: 90,
  966. render: (a: any, b: any) => {
  967. return <Statistic value={a || 0} />
  968. }
  969. },
  970. {
  971. title: '转化成本',
  972. dataIndex: 'conversions_cost',
  973. key: 'conversions_cost',
  974. align: 'center',
  975. width: 90,
  976. render: (a: any, b: any) => {
  977. return <Statistic value={a || 0} />
  978. }
  979. },
  980. {
  981. title: '深度转化',
  982. dataIndex: 'deep_conversions_count',
  983. key: 'deep_conversions_count',
  984. align: 'center',
  985. width: 90,
  986. render: (a: any, b: any) => {
  987. return <Statistic value={a || 0} />
  988. }
  989. },
  990. {
  991. title: '转化率',
  992. dataIndex: 'conversions_rate',
  993. key: 'conversions_rate',
  994. align: 'center',
  995. width: 90,
  996. render: (a: any, b: any) => {
  997. return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
  998. }
  999. },
  1000. {
  1001. title: '加粉数',
  1002. dataIndex: 'add_fans_count',
  1003. key: 'add_fans_count',
  1004. align: 'center',
  1005. width: 90,
  1006. render: (a: any, b: any) => {
  1007. return <Statistic value={a || 0} />
  1008. }
  1009. },
  1010. {
  1011. title: '加粉成本',
  1012. dataIndex: 'add_fans_cost',
  1013. key: 'add_fans_cost',
  1014. align: 'center',
  1015. width: 90,
  1016. render: (a: any, b: any) => {
  1017. return <Statistic value={a || 0} />
  1018. }
  1019. },
  1020. ]
  1021. return newArr
  1022. }
  1023. }
  1024. export {
  1025. columnsMonitor,
  1026. columnsList
  1027. }