index.tsx 4.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  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: { accountId: string, adAccountId: string }) {
  8. let { accountId, adAccountId } = props
  9. const listAjax = useAjax((params) => getAdqTargetingList(params), { formatResult: true })
  10. const syncAjax = useAjax((adAccountId) => putAdqTargetingSyncAll(adAccountId))
  11. useEffect(() => {
  12. getList({ pageNum: 1, pageSize: 20 })
  13. }, [accountId])
  14. // 获取列表
  15. const getList = useCallback((params: {
  16. pageNum: number;
  17. pageSize: number;
  18. accountId?: string;
  19. pageName?: string;
  20. pageType?: string;
  21. pageTemplateId?: string;
  22. pageStatus?: string;
  23. }) => {
  24. accountId && listAjax.run({ ...params, accountId })
  25. }, [accountId])
  26. // 同步
  27. const sync = useCallback(() => {
  28. syncAjax.run(adAccountId).then(res => {
  29. console.log(res)
  30. res && listAjax.refresh()
  31. res? message.success('同步成功!') : message.error('同步失败!')
  32. })
  33. }, [adAccountId, listAjax])
  34. return <div>
  35. <TableData
  36. columns={tableConfig}
  37. ajax={listAjax}
  38. syncAjax={sync}
  39. dataSource={listAjax?.data?.data?.records}
  40. loading={listAjax?.loading || syncAjax?.loading}
  41. scroll={{ x: 2000 }}
  42. total={listAjax?.data?.data?.total}
  43. page={listAjax?.data?.data?.current}
  44. pageSize={listAjax?.data?.data?.size}
  45. myKey={'targetingId'}
  46. leftChild={<>
  47. <Row gutter={[10, 10]}>
  48. <Col>
  49. <Input
  50. placeholder='定向名称'
  51. allowClear
  52. onBlur={(e) => {
  53. let value = e.target.value
  54. getList({ pageNum: 1, pageSize: 20 })
  55. }}
  56. onKeyDownCapture={(e: any) => {
  57. let key = e.key
  58. if (key === 'Enter') {
  59. let value = e.target.value
  60. getList({ pageNum: 1, pageSize: 20 })
  61. }
  62. }}
  63. onChange={(e) => {
  64. let value = e.target.value
  65. if (!value) {
  66. getList({ pageNum: 1, pageSize: 20 })
  67. }
  68. }}
  69. />
  70. </Col>
  71. {/* <Col>
  72. <Select placeholder='推广目标选择' style={{ minWidth: 200 }} showSearch filterOption={(input: any, option: any) =>
  73. (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
  74. } allowClear onChange={(value: any) => {
  75. getList({ pageNum: 1, pageSize: 20, accountId})
  76. }}>
  77. {
  78. Object.keys(PromotedObjectType).map(key => {
  79. // let obj = JSON.parse(PromotedObjectType[key])
  80. return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
  81. })
  82. }
  83. </Select>
  84. </Col> */}
  85. </Row>
  86. </>}
  87. onChange={(props: any) => {
  88. let { sortData, pagination } = props
  89. let { current, pageSize } = pagination
  90. getList({ pageNum: current, pageSize })
  91. }}
  92. />
  93. </div>
  94. }
  95. export default Targeting