index.tsx 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. import React, { useEffect, useCallback } from 'react'
  2. import { Col, Input, message, Row } from 'antd'
  3. import { useAjax } from '@/Hook/useAjax'
  4. import { getAdqTargetingList, putAdqTargetingSyncAll } from '@/services/launchAdq/adq'
  5. import TableData from '../../components/TableData'
  6. import tableConfig from './tableConfig'
  7. function Targeting(props: { adAccountId: any, userId: string, accountId: any, tableIdClick: any }) {
  8. let { accountId, adAccountId, userId, tableIdClick } = props
  9. const listAjax = useAjax((params) => getAdqTargetingList(params), { formatResult: true })
  10. const syncAjax = useAjax((adAccountId) => putAdqTargetingSyncAll(adAccountId))
  11. console.log('定向=====》')
  12. useEffect(() => {
  13. getList({ pageNum: 1, pageSize: 20, accountId })
  14. }, [userId, accountId])
  15. // 获取列表
  16. const getList = useCallback((params: {
  17. pageNum: number;
  18. pageSize: number;
  19. accountId?: string;
  20. targetingName?: string;
  21. }) => {
  22. console.log(accountId)
  23. if (!params.targetingName || params.targetingName !== listAjax?.params[0]?.targetingName) {
  24. !params.targetingName && delete params.targetingName
  25. listAjax.run({ ...params, userId })
  26. }
  27. }, [listAjax, userId])
  28. // 同步
  29. const sync = useCallback(() => {
  30. if (!adAccountId) {
  31. message.error('请先选择要同步的广点通账号!')
  32. return
  33. }
  34. syncAjax.run(adAccountId).then(res => {
  35. console.log(res)
  36. res && listAjax.refresh()
  37. res ? message.success('同步成功!') : message.error('同步失败!')
  38. })
  39. }, [adAccountId, listAjax])
  40. return <div>
  41. <TableData
  42. isCard={false}
  43. columns={() => tableConfig(tableIdClick)}
  44. ajax={listAjax}
  45. syncAjax={sync}
  46. dataSource={listAjax?.data?.data?.records}
  47. loading={listAjax?.loading || syncAjax?.loading}
  48. scroll={{ x: 2000, y: 550 }}
  49. total={listAjax?.data?.data?.total}
  50. page={listAjax?.data?.data?.current}
  51. pageSize={listAjax?.data?.data?.size}
  52. myKey={'targetingId'}
  53. leftChild={<>
  54. <Row gutter={[10, 10]}>
  55. <Col>
  56. <Input
  57. placeholder='广告账号'
  58. allowClear
  59. style={{ width: 150 }}
  60. onBlur={(e) => {
  61. let value = e.target.value
  62. getList({ pageNum: 1, pageSize: 20, accountId: value })
  63. }}
  64. onKeyDownCapture={(e: any) => {
  65. let key = e.key
  66. if (key === 'Enter') {
  67. let value = e.target.value
  68. getList({ pageNum: 1, pageSize: 20, accountId: value })
  69. }
  70. }}
  71. onChange={(e) => {
  72. let value = e.target.value
  73. if (!value) {
  74. getList({ pageNum: 1, pageSize: 20, accountId: value })
  75. }
  76. }}
  77. />
  78. </Col>
  79. <Col>
  80. <Input
  81. placeholder='定向名称'
  82. allowClear
  83. style={{ width: 150 }}
  84. onBlur={(e) => {
  85. let value = e.target.value
  86. getList({ pageNum: 1, pageSize: 20, targetingName: value })
  87. }}
  88. onKeyDownCapture={(e: any) => {
  89. let key = e.key
  90. if (key === 'Enter') {
  91. let value = e.target.value
  92. getList({ pageNum: 1, pageSize: 20, targetingName: value })
  93. }
  94. }}
  95. onChange={(e) => {
  96. let value = e.target.value
  97. if (!value) {
  98. getList({ pageNum: 1, pageSize: 20, targetingName: value })
  99. }
  100. }}
  101. />
  102. </Col>
  103. </Row>
  104. </>}
  105. onChange={(props: any) => {
  106. let { sortData, pagination } = props
  107. let { current, pageSize } = pagination
  108. getList({ pageNum: current, pageSize })
  109. }}
  110. />
  111. </div>
  112. }
  113. export default Targeting