|
|
@@ -1,9 +1,9 @@
|
|
|
import React, { useEffect, useRef, useState } from "react"
|
|
|
import '../../tencentAdPutIn/index.less'
|
|
|
-import { Button, Card, DatePicker, Input, Pagination, Select, Space, Switch, Table, Tabs } from "antd"
|
|
|
-import { getCreativeComponentListApi, GetCreativeComponentProps, getDefaultSharingApi, updateDefaultSharingApi } from "@/services/adqV3/global"
|
|
|
+import { Button, Card, DatePicker, Input, message, Pagination, Popconfirm, Select, Space, Switch, Table, Tabs } from "antd"
|
|
|
+import { delComponentApi, getCreativeComponentListApi, GetCreativeComponentProps, getDefaultSharingApi, updateDefaultSharingApi } from "@/services/adqV3/global"
|
|
|
import './index.less'
|
|
|
-import { PlusOutlined, SyncOutlined } from "@ant-design/icons"
|
|
|
+import { DeleteOutlined, PlusOutlined, SyncOutlined } from "@ant-design/icons"
|
|
|
import { useAjax } from "@/Hook/useAjax"
|
|
|
import SelectAdAccount from "@/components/SelectAdAccount"
|
|
|
import { COMMON_POTENTIAL_STATUS_ENUM, COMPONENT_GENERATION_TYPE_ENUM, DEFAULT_COMPONENT_SUB_IMAGE_TYPE, DEFAULT_COMPONENT_SUB_SHOW_IMAGE, DEFAULT_COMPONENT_SUB_SHOW_VIDEO, DEFAULT_COMPONENT_SUB_VIDEO_TYPE } from "./const"
|
|
|
@@ -32,10 +32,12 @@ const ManageComponent: React.FC = () => {
|
|
|
const [adUnitAccount, setAdUnitAccount] = useState<number>()
|
|
|
const [shared, setShared] = useState<'DEFAULT_SHARED_NONE' | 'DEFAULT_SHARED_ALL_ORGANIZATION'>()
|
|
|
const [putInType, setPutInType] = useState<'NOVEL' | 'GAME'>('NOVEL')
|
|
|
+ const [selectedRows, setSelectedRows] = useState<any[]>([])
|
|
|
|
|
|
const getCreativeComponentList = useAjax((params) => getCreativeComponentListApi(params))
|
|
|
const getDefaultSharing = useAjax((params) => getDefaultSharingApi(params))
|
|
|
const updateDefaultSharing = useAjax((params) => updateDefaultSharingApi(params))
|
|
|
+ const delComponent = useAjax((params) => delComponentApi(params))
|
|
|
/*************************************/
|
|
|
|
|
|
useEffect(() => {
|
|
|
@@ -73,6 +75,19 @@ const ManageComponent: React.FC = () => {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+ const handleDel = (id: number[]) => {
|
|
|
+ const hide = message.loading('正在删除...', 0)
|
|
|
+ delComponent.run({ componentId: id, adAccountId: queryParams?.adAccountId }).then(res => {
|
|
|
+ hide()
|
|
|
+ if (res?.length === 0) {
|
|
|
+ message.success('删除成功')
|
|
|
+ getCreativeComponentList.refresh()
|
|
|
+ } else {
|
|
|
+ message.error(res?.join('、'))
|
|
|
+ }
|
|
|
+ }).catch(() => hide())
|
|
|
+ }
|
|
|
+
|
|
|
return <div className="manageComponent">
|
|
|
<Card
|
|
|
className="cardResetCss"
|
|
|
@@ -115,6 +130,13 @@ const ManageComponent: React.FC = () => {
|
|
|
allowClear={false}
|
|
|
/>
|
|
|
<Button icon={<SyncOutlined />} type="link" onClick={() => { getCreativeComponentList.refresh() }} loading={getCreativeComponentList.loading}></Button>
|
|
|
+ <Popconfirm
|
|
|
+ title="确定删除?"
|
|
|
+ onConfirm={() => { handleDel(selectedRows.map(item => item.componentId)) }}
|
|
|
+ disabled={selectedRows.length === 0}
|
|
|
+ >
|
|
|
+ <Button icon={<DeleteOutlined />} type="primary" danger size="small" disabled={selectedRows.length === 0} loading={delComponent.loading}>删除</Button>
|
|
|
+ </Popconfirm>
|
|
|
{adUnitAccount && <Switch
|
|
|
checkedChildren="业务单元默认全部共享"
|
|
|
unCheckedChildren="业务单元默认不共享"
|
|
|
@@ -226,7 +248,7 @@ const ManageComponent: React.FC = () => {
|
|
|
</div>
|
|
|
<div className="manageComponent-content" ref={ref}>
|
|
|
<Table
|
|
|
- columns={TableConfig(queryParams?.activeKey as any)}
|
|
|
+ columns={TableConfig(queryParams?.activeKey as any, handleDel)}
|
|
|
dataSource={getCreativeComponentList.data?.records || []}
|
|
|
loading={getCreativeComponentList.loading || loading}
|
|
|
scroll={{ x: 1000, y: (size?.height || 0) - 36 }}
|
|
|
@@ -234,6 +256,44 @@ const ManageComponent: React.FC = () => {
|
|
|
size="small"
|
|
|
bordered
|
|
|
rowKey="componentId"
|
|
|
+ rowSelection={{
|
|
|
+ selectedRowKeys: selectedRows.map(item => item.componentId),
|
|
|
+ getCheckboxProps: (record: any) => ({
|
|
|
+ disabled: record?.isDeleted
|
|
|
+ }),
|
|
|
+ onSelect: (record: { componentId: number }, selected: boolean) => {
|
|
|
+ if (selected) {
|
|
|
+ selectedRows.push({ ...record })
|
|
|
+ setSelectedRows([...selectedRows])
|
|
|
+ } else {
|
|
|
+ let newSelectAccData = selectedRows.filter((item: { componentId: number }) => item.componentId !== record.componentId)
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSelectAll: (selected: boolean, selectedRowss: { componentId: number }[], changeRows: { componentId: number }[]) => {
|
|
|
+ if (selected) {
|
|
|
+ let newSelectAccData = [...selectedRows]
|
|
|
+ changeRows.forEach((item: { componentId: number }) => {
|
|
|
+ let index = newSelectAccData.findIndex((ite: { componentId: number }) => ite.componentId === item.componentId)
|
|
|
+ if (index === -1) {
|
|
|
+ let data: any = { ...item }
|
|
|
+ newSelectAccData.push(data)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ } else {
|
|
|
+ let newSelectAccData = selectedRows.filter((item: { componentId: number }) => {
|
|
|
+ let index = changeRows.findIndex((ite: { componentId: number }) => ite.componentId === item.componentId)
|
|
|
+ if (index !== -1) {
|
|
|
+ return false
|
|
|
+ } else {
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }}
|
|
|
/>
|
|
|
</div>
|
|
|
<div className="manageComponent-footer">
|
