Merge branch 'develop' of http://git.zanxiangnet.com/wjx/ad-manage

src/pages/launchSystemV3/tencenTasset/manageComponent/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from "react"
 import '../../tencentAdPutIn/index.less'
-import { Button, Card, DatePicker, Input, message, Pagination, Popconfirm, Select, Space, Switch, Tabs } from "antd"
-import { delComponentApi, getCreativeComponentDataListApi, GetCreativeComponentProps, getDefaultSharingApi, updateDefaultSharingApi } from "@/services/adqV3/global"
+import { Button, Card, DatePicker, Input, message, Pagination, Popconfirm, Select, Space, Tabs } from "antd"
+import { delComponentApi, getCreativeComponentDataListApi, GetCreativeComponentProps } from "@/services/adqV3/global"
 import './index.less'
 import { DeleteOutlined, PlusOutlined, SyncOutlined } from "@ant-design/icons"
 import { useAjax } from "@/Hook/useAjax"
@@ -13,6 +13,8 @@ import AddComponents from "./addComponents"
 import { DefaultOptionType } from "antd/lib/select"
 import TablePro from "@/components/TablePro"
 import columns12 from "./tableConfig"
+import ShareComponent from "./shareComponent"
+import ShareDetails from "./shareDetails"
 
 /**
  * 创意组件
@@ -33,14 +35,13 @@ const ManageComponent: React.FC = () => {
     const [tableHeaderHeight, setTableHeaderHeight] = useState<number>(0)
     const [addVisible, setAddVisible] = useState<boolean>(false)
     const [loading, setLoading] = useState<boolean>(true)
-    const [adUnitAccount, setAdUnitAccount] = useState<number>()
-    const [shared, setShared] = useState<'DEFAULT_SHARED_NONE' | 'DEFAULT_SHARED_ALL_ORGANIZATION'>()
+    const [adAccount, setAdccount] = useState<any>()
+    const [shareData, setShareData] = useState<{ visible: boolean, data: any }>({ visible: false, data: null })
+    const [shareDetailsData, setShareDetailsData] = useState<{ visible: boolean, data: any }>({ visible: false, data: null })
     const [putInType, setPutInType] = useState<'NOVEL' | 'GAME'>('NOVEL')
     const [selectedRows, setSelectedRows] = useState<any[]>([])
 
     const getCreativeComponentList = useAjax((params) => getCreativeComponentDataListApi(params))
-    const getDefaultSharing = useAjax((params) => getDefaultSharingApi(params))
-    const updateDefaultSharing = useAjax((params) => updateDefaultSharingApi(params))
     const delComponent = useAjax((params) => delComponentApi(params))
     /*************************************/
 
@@ -84,24 +85,6 @@ const ManageComponent: React.FC = () => {
         };
     }, [])
 
-    const handleGet = (adAccountId: number) => {
-        getDefaultSharing.run({ adAccountId }).then(res => {
-            if (res) {
-                setShared(res)
-            } else {
-                setShared(undefined)
-            }
-        }).catch(() => setShared(undefined))
-    }
-
-    const handleSet = (e?: boolean) => {
-        updateDefaultSharing.run({ adAccountId: adUnitAccount, type: e ? 'DEFAULT_SHARED_ALL_ORGANIZATION' : 'DEFAULT_SHARED_NONE' }).then(res => {
-            if (res) {
-                handleGet(adUnitAccount as number)
-            }
-        })
-    }
-
     const handleDel = (id: number[], accountId: number) => {
         const hide = message.loading('正在删除...', 0)
         delComponent.run({ componentId: id, adAccountId: accountId }).then(res => {
@@ -115,6 +98,14 @@ const ManageComponent: React.FC = () => {
         }).catch(() => hide())
     }
 
+    const share = (data: any) => {
+        setShareData({ visible: true, data })
+    }
+
+    const shareDetails = (data: any) => {
+        setShareDetailsData({ visible: true, data })
+    }
+
     return <div className="manageComponent">
         <Card
             className="cardResetCss"
@@ -140,13 +131,7 @@ const ManageComponent: React.FC = () => {
                     value={queryParams?.adAccountId ? [queryParams.adAccountId] : undefined}
                     type="radio"
                     onChange={(value, data) => {
-                        if (data?.adUnitAccount && value) {
-                            // 是否业务单元账号
-                            setAdUnitAccount(value as number)
-                            handleGet(value as number)
-                        } else {
-                            setAdUnitAccount(undefined)
-                        }
+                        setAdccount(data)
                         setPutInType(data?.adUnitType || 'NOVEL')
                         setLoading(false)
                         setQueryParams({
@@ -165,13 +150,6 @@ const ManageComponent: React.FC = () => {
                 >
                     <Button icon={<DeleteOutlined />} type="primary" danger size="small" disabled={selectedRows.length === 0} loading={delComponent.loading}>删除</Button>
                 </Popconfirm>
-                {adUnitAccount && <Switch
-                    checkedChildren="业务单元默认全部共享"
-                    unCheckedChildren="业务单元默认不共享"
-                    checked={shared === 'DEFAULT_SHARED_ALL_ORGANIZATION'}
-                    onChange={handleSet}
-                    loading={updateDefaultSharing.loading}
-                />}
                 <span style={{ color: 'red' }}>平台只支持选择业务单元的组件创建广告</span>
             </Space>
         </Card>
@@ -293,7 +271,7 @@ const ManageComponent: React.FC = () => {
                     </div>}
                     refreshAjax={() => getCreativeComponentList.refresh()}
                     rowKey="componentId"
-                    config={columns12(handleDel)}
+                    config={columns12(handleDel, share, shareDetails)}
                     fixed={{ left: 1, right: 0 }}
                     scroll={{ x: 1000, y: (size?.height || 0) - ((size1?.height || 33) + (tableHeaderHeight || 45) + 20) }}
                     configName='创意组件'
@@ -386,6 +364,27 @@ const ManageComponent: React.FC = () => {
             }}
             onClose={() => setAddVisible(false)}
         />}
+
+        {/* 组件共享 */}
+        {shareData?.visible && <ShareComponent
+            {...shareData}
+            adAccountData={adAccount}
+            onChange={() => {
+                setShareData({ visible: false, data: null })
+                getCreativeComponentList.refresh()
+            }}
+            onClose={() => {
+                setShareData({ visible: false, data: null })
+            }}
+        />}
+
+        {/* 组件共享详情 */}
+        {shareDetailsData?.visible && <ShareDetails 
+            {...shareDetailsData}
+            onClose={() => {
+                setShareDetailsData({ visible: false, data: null })
+            }}
+        />}
     </div>
 }
 

src/pages/launchSystemV3/tencenTasset/manageComponent/selectShareAccount.tsx

@@ -0,0 +1,128 @@
+import { useAjax } from '@/Hook/useAjax';
+import { getUserAccountListApi } from '@/services/launchAdq/adAuthorize';
+import { Input, Table } from 'antd';
+import React, { useEffect, useState } from 'react';
+
+interface Props {
+    accountId: number
+    value?: number[]
+    onChange?: (value: number[]) => void
+}
+const SelectShareAccount: React.FC<Props> = ({ accountId, value, onChange }) => {
+
+    /*********************************/
+    const [queryForm, setQueryForm] = useState<{ pageNum: number, pageSize: number, accountIdList?: string }>({ pageNum: 1, pageSize: 20 })
+    const [selectedRows, setSelectedRows] = useState<number[]>([])
+
+    const getUserAccountList = useAjax((params) => getUserAccountListApi(params))
+    /*********************************/
+
+    useEffect(() => {
+        if (value && JSON.stringify(value) !== JSON.stringify(selectedRows)) {
+            setSelectedRows([...value])
+        }
+    }, [value, selectedRows])
+
+    useEffect(() => {
+        const { accountIdList, ...params} = queryForm
+        const query: any = { ...params, adUnitAccountId: accountId }
+        if (accountIdList) {
+            query.accountIdList = accountIdList.split(/[,，\n\s]+/ig).filter((item: any) => item)
+        }
+        getUserAccountList.run(query)
+    }, [accountId, queryForm])
+
+    return <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
+        <Input.TextArea
+            rows={1}
+            autoSize={{ minRows: 1, maxRows: 1 }}
+            placeholder="账户(多个，,空格换行)"
+            style={{ width: 180 }}
+            allowClear
+            value={queryForm?.accountIdList}
+            onChange={(e) => setQueryForm({ ...queryForm, accountIdList: e.target.value })}
+        />
+        <Table
+            size={'small'}
+            bordered
+            dataSource={getUserAccountList?.data?.records}
+            rowKey={'accountId'}
+            scroll={{ y: 220 }}
+            pagination={{
+                pageSize: getUserAccountList?.data?.size || 50,
+                current: getUserAccountList?.data?.current || 1,
+                showTotal: total => `总共 ${total} 账户`,
+                total: getUserAccountList?.data?.total,
+                showSizeChanger: true,
+                showLessItems: true,
+                defaultCurrent: 1,
+                defaultPageSize: 50,//默认初始的每页条数
+                onChange: (page, pageSize) => {
+                    setQueryForm({ ...queryForm, pageNum: page, pageSize })
+                }
+            }}
+            loading={getUserAccountList.loading}
+            columns={[
+                {
+                    title: '账号',
+                    dataIndex: 'accountId',
+                    key: 'accountId',
+                    width: 80,
+                    align: 'center',
+                    render(value) {
+                        return <span style={{ fontSize: 12 }}>{value}</span>
+                    }
+                },
+                {
+                    title: '业务单元账号',
+                    dataIndex: 'adUnitAccountId',
+                    key: 'adUnitAccountId',
+                    render(value) {
+                        return <span style={{ fontSize: 12 }}>{value || '--'}</span>
+                    }
+                }
+            ]}
+            rowSelection={{
+                selectedRowKeys: selectedRows,
+                onSelect: (record: { accountId: number }, selected: boolean) => {
+                    if (selected) {
+                        selectedRows.push(record.accountId)
+                        setSelectedRows([...selectedRows])
+                        onChange?.([...selectedRows])
+                    } else {
+                        const newSelectAccData = selectedRows.filter((item: number) => item !== record.accountId)
+                        setSelectedRows([...newSelectAccData])
+                        onChange?.([...newSelectAccData])
+                    }
+                },
+                onSelectAll: (selected: boolean, selectedRowss: { accountId: number }[], changeRows: { accountId: number }[]) => {
+                    
+                    if (selected) {
+                        const newSelectAccData = [...selectedRows]
+                        changeRows.forEach((item: { accountId: number }) => {
+                            const index = newSelectAccData.findIndex((ite: number) => ite === item.accountId)
+                            if (index === -1) {
+                                newSelectAccData.push(item.accountId)
+                            }
+                        })
+                        setSelectedRows([...newSelectAccData])
+                        onChange?.([...newSelectAccData])
+                    } else {
+                        const newSelectAccData = selectedRows.filter((item: number) => {
+                            const index = changeRows.findIndex((ite: { accountId: number }) => ite.accountId === item)
+                            if (index !== -1) {
+                                return false
+                            } else {
+                                return true
+                            }
+                        })
+                        setSelectedRows([...newSelectAccData])
+                        onChange?.([...newSelectAccData])
+                    }
+                }
+            }}
+        />
+    </div>
+};
+
+export default SelectShareAccount;

src/pages/launchSystemV3/tencenTasset/manageComponent/shareComponent.tsx

@@ -0,0 +1,100 @@
+import React, { useEffect } from 'react';
+import '../../tencentAdPutIn/index.less'
+import { Button, Card, Form, message, Modal, Radio, Space } from 'antd';
+import { useAjax } from '@/Hook/useAjax';
+import { updateComponentSharingApi } from '@/services/adqV3/global';
+import SelectShareAccount from './selectShareAccount';
+
+interface Props {
+    adAccountData: any
+    visible?: boolean,
+    onClose?: () => void,
+    onChange?: () => void,
+    data?: any
+}
+
+/**
+ * 共享组件
+ * @param param0 
+ * @returns 
+ */
+const ShareComponent: React.FC<Props> = ({ visible, onClose, onChange, data, adAccountData }) => {
+
+    /****************************************/
+    const [form] = Form.useForm();
+    const sharedAccountType = Form.useWatch('sharedAccountType', form)
+
+    const updateComponentSharing = useAjax((params) => updateComponentSharingApi(params))
+    /****************************************/
+
+    useEffect(() => {
+        form.setFieldsValue({ sharedAccountType: data?.componentSharingType || 'ORGANIZATION' })
+    }, [data])
+
+    const handleOk = (values: any) => {
+        console.log(values, data)
+        updateComponentSharing.run({
+            ...values,
+            componentId: data?.componentId,
+            adAccountId: data?.accountId
+        }).then((res) => {
+            if (res) {
+                message.success('修改成功')
+                onChange?.()
+            }
+        })
+    }
+
+    return <Modal
+        title={<strong style={{ fontSize: 20 }}>组件共享</strong>}
+        open={visible}
+        onCancel={onClose}
+        footer={null}
+        width={700}
+        className={`modalResetCss`}
+        bodyStyle={{ padding: '0 0 40px', position: 'relative', borderRadius: '0 0 8px 8px' }}
+        maskClosable={false}
+    >
+        <Form
+            form={form}
+            name="shareComponents"
+            labelAlign='left'
+            labelCol={{ span: 4 }}
+            colon={false}
+            style={{ backgroundColor: '#f1f4fc', maxHeight: 650, overflow: 'hidden', overflowY: 'auto', padding: 10, borderRadius: '0 0 8px 8px' }}
+            scrollToFirstError={{
+                behavior: 'smooth',
+                block: 'center'
+            }}
+            onFinishFailed={({ errorFields }) => {
+                message.error(errorFields?.[0]?.errors?.[0])
+            }}
+            onFinish={handleOk}
+            initialValues={{
+                // componentsGroup: [{ componentSubType: 'IMAGE_16X9' }, { componentSubType: 'IMAGE_LIST_1X1_3' }]
+            }}
+        >
+            <Card title={<strong>共享设置</strong>} className="cardResetCss">
+                <Form.Item name="sharedAccountType" label={<strong>共享模式</strong>} rules={[{ required: true, message: '请选择投放模式!' }]}>
+                    <Radio.Group buttonStyle="solid">
+                        <Radio.Button value={'ORGANIZATION'}>全部共享</Radio.Button>
+                        <Radio.Button value={'ADVERTISER'}>部分共享</Radio.Button>
+                    </Radio.Group>
+                </Form.Item>
+                {sharedAccountType === 'ADVERTISER' && <Form.Item name="sharingAccountIds" label={<strong>共享账号</strong>} rules={[{ required: true, message: '请选择共享账号!' }]}>
+                    <SelectShareAccount accountId={adAccountData?.adAccountId} />
+                </Form.Item>}
+            </Card>
+            <Form.Item className="submit_pull">
+                <Space>
+                    <Button onClick={onClose}>取消</Button>
+                    <Button type="primary" htmlType="submit" className="modalResetCss" loading={updateComponentSharing.loading}>
+                        确定
+                    </Button>
+                </Space>
+            </Form.Item>
+        </Form>
+    </Modal>
+};
+
+export default ShareComponent;

src/pages/launchSystemV3/tencenTasset/manageComponent/shareDetails.tsx

@@ -0,0 +1,77 @@
+import { useAjax } from '@/Hook/useAjax';
+import { getComponentSharingApi } from '@/services/adqV3/global';
+import { Modal, Table } from 'antd';
+import React, { useEffect, useState } from 'react';
+
+interface Props {
+    data: any;
+    visible?: boolean;
+    onClose?: () => void;
+}
+const ShareDetails: React.FC<Props> = ({ visible, onClose, data }) => {
+
+    /********************************/
+    const [queryForm, setQueryForm] = useState<{ pageNum: number, pageSize: number, isDeleted?: boolean }>({ pageNum: 1, pageSize: 20 })
+    const getComponentSharing = useAjax((params) => getComponentSharingApi(params))
+    /********************************/
+
+    useEffect(() => {
+        getComponentSharing.run({ ...queryForm, componentId: data.componentId, adAccountId: data.accountId })
+    }, [queryForm])
+
+    return <Modal
+        title={<strong style={{ fontSize: 20 }}>组件共享详情</strong>}
+        open={visible}
+        onCancel={onClose}
+        footer={null}
+        width={700}
+        className={`modalResetCss`}
+        maskClosable={false}
+    >
+        <div>
+            <Table
+                size={'small'}
+                bordered
+                dataSource={getComponentSharing?.data?.records}
+                rowKey={'sharedAccountId'}
+                scroll={{ y: 220 }}
+                pagination={{
+                    pageSize: getComponentSharing?.data?.size || 50,
+                    current: getComponentSharing?.data?.current || 1,
+                    showTotal: total => `总共 ${total} 账户`,
+                    total: getComponentSharing?.data?.total,
+                    showSizeChanger: true,
+                    showLessItems: true,
+                    defaultCurrent: 1,
+                    defaultPageSize: 50,//默认初始的每页条数
+                    onChange: (page, pageSize) => {
+                        setQueryForm({ ...queryForm, pageNum: page, pageSize })
+                    }
+                }}
+                loading={getComponentSharing.loading}
+                columns={[
+                    {
+                        title: '账号',
+                        dataIndex: 'sharedAccountId',
+                        key: 'sharedAccountId',
+                        width: 80,
+                        align: 'center',
+                        render(value) {
+                            return <span style={{ fontSize: 12 }}>{value}</span>
+                        }
+                    },
+                    {
+                        title: '共享状态',
+                        dataIndex: 'sharedAccountType',
+                        key: 'sharedAccountType',
+                        render(value) {
+                            return <span style={{ fontSize: 12 }}>{value === 'ORGANIZATION' ? '全部共享' : '部分共享'}</span>
+                        }
+                    }
+                ]}
+            />
+        </div>
+    </Modal>
+};
+
+export default ShareDetails;

src/pages/launchSystemV3/tencenTasset/manageComponent/tableConfig.tsx

@@ -1,12 +1,12 @@
 import React from "react";
 import { COMPONENT_GENERATION_TYPE_ENUM, COMPONENT_SUB_TYPE, getComponentType } from "./const";
-import { Popconfirm, Statistic, Tag } from "antd";
+import { Popconfirm, Space, Statistic, Tag } from "antd";
 import Image1X1 from "../../components/AdsComponent/Image1X1";
 import ImageXXX from "../../components/AdsComponent/ImageXXX";
 
 
 
-function columns12(del: (id: number[], accountId: number) => void): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
+function columns12(del: (id: number[], accountId: number) => void, share: (data: any) => void, shareDetails: (data: any) => void): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
 
     return [
         {
@@ -98,6 +98,18 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                         return <span style={{ fontSize: 12 }}>{value || '--'}</span>
                     },
                 },
+                {
+                    title: '组件共享类型',
+                    dataIndex: 'componentSharingType',
+                    key: 'componentSharingType',
+                    width: 70,
+                    align: 'center',
+                    label: '基础字段',
+                    default: 7,
+                    render(value: any) {
+                        return <span style={{ fontSize: 12 }}>{value === 'ORGANIZATION' ? '全部共享' : '部分共享'}</span>
+                    },
+                },
                 {
                     title: '业务单元ID',
                     dataIndex: 'organizationId',
@@ -106,7 +118,7 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     ellipsis: true,
                     align: 'center',
                     label: '基础字段',
-                    default: 7,
+                    default: 8,
                     render(value: any) {
                         return <span style={{ fontSize: 12 }}>{value || '--'}</span>
                     },
@@ -119,7 +131,7 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     ellipsis: true,
                     align: 'center',
                     label: '基础字段',
-                    default: 8,
+                    default: 9,
                     sorter: true,
                     render(value: any) {
                         return <span style={{ fontSize: 12 }}>{value || '--'}</span>
@@ -133,7 +145,7 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     ellipsis: true,
                     align: 'center',
                     label: '基础字段',
-                    default: 9,
+                    default: 10,
                     render(value: any) {
                         return <span style={{ fontSize: 12 }}>{value || '--'}</span>
                     },
@@ -146,7 +158,7 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     ellipsis: true,
                     align: 'center',
                     label: '基础字段',
-                    default: 10,
+                    default: 11,
                     render(value: any) {
                         return value ? <Tag color="error" style={{ margin: 0 }}>是</Tag> : <Tag color="success" style={{ margin: 0 }}>否</Tag>
                     },
@@ -158,7 +170,7 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     width: 70,
                     align: 'center',
                     label: '基础字段',
-                    default: 11,
+                    default: 12,
                     render(value: any) {
                         return <span style={{ fontSize: 12 }}>{value || '--'}</span>
                     },
@@ -167,18 +179,22 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
                     title: '操作',
                     dataIndex: 'cz',
                     key: 'cz',
-                    width: 60,
+                    width: 80,
                     label: '基础字段',
                     align: 'center',
-                    default: 12,
+                    default: 13,
                     render(_: any, record: any) {
                         if (!record?.isDeleted) {
-                            return <Popconfirm
-                                title="确定删除?"
-                                onConfirm={() => { del([record?.componentId], record?.accountId) }}
-                            >
-                                <a style={{ color: 'red', fontSize: 12 }}>删除</a>
-                            </Popconfirm>
+                            return <Space size={4}>
+                                <Popconfirm
+                                    title="确定删除?"
+                                    onConfirm={() => { del([record?.componentId], record?.accountId) }}
+                                >
+                                    <a style={{ color: 'red', fontSize: 12 }}>删除</a>
+                                </Popconfirm>
+                                <a style={{ fontSize: 12 }} onClick={() => share(record)}>共享组件</a>
+                                <a style={{ fontSize: 12 }} onClick={() => shareDetails(record)}>共享详情</a>
+                            </Space>
                         }
                         return '--'
                     },
@@ -189,75 +205,75 @@ function columns12(del: (id: number[], accountId: number) => void): { label: str
             label: '数据指标',
             data: [
                 {
-                    title: '消耗', dataIndex: 'cost', label: '数据指标', width: 70, default: 13, align: 'right', sorter: true,
+                    title: '消耗', dataIndex: 'cost', label: '数据指标', width: 70, default: 14, align: 'right', sorter: true,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '一键起量消耗', dataIndex: 'acquisitionCost', label: '数据指标', width: 70, default: 14, align: 'center', sorter: true,
+                    title: '一键起量消耗', dataIndex: 'acquisitionCost', label: '数据指标', width: 70, default: 15, align: 'center', sorter: true,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '千次展现均价', dataIndex: 'thousandDisplayPrice', label: '数据指标', width: 70, align: 'center', sorter: true, default: 15,
+                    title: '千次展现均价', dataIndex: 'thousandDisplayPrice', label: '数据指标', width: 70, align: 'center', sorter: true, default: 16,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '点击率', dataIndex: 'ctr', label: '数据指标', width: 70, align: 'center', sorter: true, default: 16,
+                    title: '点击率', dataIndex: 'ctr', label: '数据指标', width: 70, align: 'center', sorter: true, default: 17,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '公众号关注成本（点击归因）', dataIndex: 'fromFollowByClickCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 17,
+                    title: '公众号关注成本（点击归因）', dataIndex: 'fromFollowByClickCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 18,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '公众号关注人数（点击归因）', dataIndex: 'fromFollowByClickUv', label: '数据指标', width: 100, align: 'center', sorter: true, default: 18,
+                    title: '公众号关注人数（点击归因）', dataIndex: 'fromFollowByClickUv', label: '数据指标', width: 100, align: 'center', sorter: true, default: 19,
                     render: (a: number) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '公众号关注成本（平台上报）', dataIndex: 'bizFollowCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 19,
+                    title: '公众号关注成本（平台上报）', dataIndex: 'bizFollowCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 20,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '公众号关注人数（平台上报）', dataIndex: 'bizFollowUv', label: '数据指标', width: 100, align: 'center', sorter: true, default: 20,
+                    title: '公众号关注人数（平台上报）', dataIndex: 'bizFollowUv', label: '数据指标', width: 100, align: 'center', sorter: true, default: 21,
                     render: (a: number) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '加企业微信客服成本（人数）', dataIndex: 'scanFollowUserCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 21,
+                    title: '加企业微信客服成本（人数）', dataIndex: 'scanFollowUserCost', label: '数据指标', width: 100, align: 'center', sorter: true, default: 22,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '加企业微信客服人数', dataIndex: 'scanFollowUserCount', label: '数据指标', width: 90, align: 'center', sorter: true, default: 22,
+                    title: '加企业微信客服人数', dataIndex: 'scanFollowUserCount', label: '数据指标', width: 90, align: 'center', sorter: true, default: 23,
                     render: (a: number) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '下单次数（点击归因）', dataIndex: 'orderByClickCount', label: '数据指标', width: 90, align: 'center', sorter: true, default: 23,
+                    title: '下单次数（点击归因）', dataIndex: 'orderByClickCount', label: '数据指标', width: 90, align: 'center', sorter: true, default: 24,
                     render: (a: number) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '下单成本（点击归因）', dataIndex: 'orderByClickCost', label: '数据指标', width: 90, align: 'center', sorter: true, default: 24,
+                    title: '下单成本（点击归因）', dataIndex: 'orderByClickCost', label: '数据指标', width: 90, align: 'center', sorter: true, default: 25,
                     render: (a: number) => <Statistic value={a || 0} precision={2} />
                 },
                 {
-                    title: '下单率（点击归因）', dataIndex: 'orderByClickRate', label: '数据指标', width: 90, align: 'center', sorter: true, default: 25,
+                    title: '下单率（点击归因）', dataIndex: 'orderByClickRate', label: '数据指标', width: 90, align: 'center', sorter: true, default: 26,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '点击首日付费ROI', dataIndex: 'cheoutFdReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 26,
+                    title: '点击首日付费ROI', dataIndex: 'cheoutFdReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 27,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '点击3日付费ROI', dataIndex: 'cheoutTdReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 27,
+                    title: '点击3日付费ROI', dataIndex: 'cheoutTdReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 28,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '点击7日付费ROI', dataIndex: 'cheoutOwReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 28,
+                    title: '点击7日付费ROI', dataIndex: 'cheoutOwReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 29,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '点击14日付费ROI', dataIndex: 'cheoutTwReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 29,
+                    title: '点击14日付费ROI', dataIndex: 'cheoutTwReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 30,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '点击30日付费ROI', dataIndex: 'cheoutOmReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 30,
+                    title: '点击30日付费ROI', dataIndex: 'cheoutOmReward', label: '数据指标', width: 90, align: 'center', sorter: true, default: 31,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
             ]

src/pages/launchSystemV3/tencentAdPutIn/create/Dynamic/newDynamic.tsx

@@ -183,6 +183,7 @@ const NewDynamic: React.FC<Props> = ({ putInType, value: newValue, visible, onCl
             if (putInType === 'GAME') {
                 params.marketingSubGoal = marketingSubGoal
             }
+            // params.useNewVersion = true
             getCreativeDetails.run(params).then(res => {
                 if (res?.adcreativeTemplateStructAdpermits?.length > 0) {
                     let adcreativeTemplateStructAdpermits = res?.adcreativeTemplateStructAdpermits[0]

src/pages/launchSystemV3/tencentAdPutIn/create/Material/addMaterial.tsx

@@ -1,6 +1,6 @@
 import { CloseCircleOutlined, DeleteOutlined, PlusOutlined, RetweetOutlined } from "@ant-design/icons"
 import { Button, Card, Dropdown, Empty, Form, InputNumber, Modal, Popconfirm, Space, Tooltip, message } from "antd"
-import React, { useEffect, useState } from "react"
+import React, { useEffect, useMemo, useState } from "react"
 import styles from './index.less'
 import VideoNews from "@/pages/launchSystemNew/components/newsModal/videoNews"
 import { chunkArray1, getVideoImgUrl } from "@/utils/utils"
@@ -70,22 +70,23 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
 
     useEffect(() => {
         if (materialData && Object.keys(materialData).length > 0) {
-            let fKey = Object.keys(materialData)[0];
-            let children = materialData[fKey]?.children
-            let childrenKey = Object.keys(children)
+            console.log('materialData', materialData)
+            const fKey = Object.keys(materialData)[0];
+            const children = materialData[fKey]?.children
+            const childrenKey = Object.keys(children)
             setMLength(childrenKey?.length)
 
-            let videoData = childrenKey?.find(item => item === 'short_video1' || item === 'video_id')
+            const videoData = childrenKey?.find(item => item === 'short_video1' || item === 'video_id')
             if (videoData) {
                 setVideoUploads(children[videoData])
             }
-            let imageData = childrenKey?.find(item => item === 'cover_id' || item === 'image_id')
+            const imageData = childrenKey?.find(item => item === 'cover_id' || item === 'image_id')
             if (imageData) {
                 setImgUploads(children[imageData])
             }
-            let imageListData = childrenKey?.find(item => item === 'list')
+            const imageListData = childrenKey?.find(item => item === 'list')
             if (imageListData) {
-                let data = children[imageListData]
+                const data = children[imageListData]
                 if (fKey === 'image_list') {
                     setMinNumber(data.arrayProperty.mixNumber)
                     setImgUploads({ ...data['children']['image_id'], arrayProperty: data.arrayProperty, name: 'image_list' })
@@ -194,10 +195,146 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
         return `${imageCount}张图片，${videoCount}个视频，${arrayImgCount}个组图`
     }
 
+    // 按钮
+    const renderDynamicSwitch = (num: number, isAll?: boolean) => {
+        return Object.keys(materialData)?.map(key => {
+            const m = materialData[key]
+            const children = m.children
+            if (isAll) {
+                return Object.keys(children).map(k => {
+                    const item = children[k]
+                    if (k === 'short_video1' || k === 'video_id') {
+                        return <Button
+                            type="primary"
+                            onClick={() => {
+                                setSelectCloudData({
+                                    num: 500,
+                                    defaultParams: {
+                                        materialType: 'video',
+                                        sizeQueries: creativeTemplateId === 1708 ? [{ relation: '=', width: 1280, height: 720 }] : [{ relation: item.restriction.videoRestriction.minWidth > item.restriction.videoRestriction.minHeight ? '=' : '>=', width: item.restriction.videoRestriction.minWidth, height: item.restriction.videoRestriction.minHeight }],
+                                        fileSize: item.restriction.videoRestriction.fileSize * 1024
+                                    }
+                                })
+                                setMaterialConfig({
+                                    ...materialConfig,
+                                    type: item.name,
+                                    max: 500,
+                                    index: 20000,
+                                    adcreativeTemplateId: creativeTemplateId,
+                                    isGroup: false
+                                })
+                                setTimeout(() => {
+                                    setSelectVideoVisible(true)
+                                }, 100)
+                            }}
+                        >批量添加视频</Button>
+                    } else if (item.name === 'image_id') {
+                        return <Button
+                            type="primary"
+                            onClick={() => {
+                                setSelectCloudData({
+                                    num: 500,
+                                    defaultParams: {
+                                        materialType: 'image',
+                                        sizeQueries: [{ relation: '=', width: item.restriction.imageRestriction.width, height: item.restriction.imageRestriction.height }],
+                                        fileSize: item.restriction.imageRestriction.fileSize * 1024
+                                    }
+                                })
+                                setMaterialConfig({
+                                    ...materialConfig,
+                                    type: item.name,
+                                    max: 500,
+                                    index: 20000,
+                                    adcreativeTemplateId: creativeTemplateId,
+                                    isGroup: false
+                                })
+                                setTimeout(() => {
+                                    setSelectVideoVisible(true)
+                                }, 100)
+                            }}
+                        >批量添加图片</Button>
+                    } else if (item.name === 'list') {
+                        return <Button
+                            type="primary"
+                            onClick={() => {
+                                selectGroupListImg(item.arrayProperty.maxNumber)
+                            }}
+                        >批量添加业务单元{item.arrayProperty.maxNumber}图</Button>
+                    }
+                    return null
+                })
+            }
+            return Object.keys(children).map(k => {
+                const item = children[k]
+                if (k === 'short_video1' || k === 'video_id') {
+                    return <Button
+                        type="primary"
+                        onClick={() => {
+                            setSelectCloudData({
+                                num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                defaultParams: {
+                                    materialType: 'video',
+                                    sizeQueries: creativeTemplateId === 1708 ? [{ relation: '=', width: 1280, height: 720 }] : [{ relation: item.restriction.videoRestriction.minWidth > item.restriction.videoRestriction.minHeight ? '=' : '>=', width: item.restriction.videoRestriction.minWidth, height: item.restriction.videoRestriction.minHeight }],
+                                    fileSize: item.restriction.videoRestriction.fileSize * 1024
+                                }
+                            })
+                            setMaterialConfig({
+                                ...materialConfig,
+                                type: item.name,
+                                max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                index: num,
+                                adcreativeTemplateId: creativeTemplateId,
+                                isGroup: false
+                            })
+                            setTimeout(() => {
+                                setSelectVideoVisible(true)
+                            }, 100)
+                        }}
+                    >添加视频</Button>
+                } else if (item.name === 'image_id') {
+                    return <Button
+                        type="primary"
+                        onClick={() => {
+                            setSelectCloudData({
+                                num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                defaultParams: {
+                                    materialType: 'image',
+                                    sizeQueries: [{ relation: '=', width: item.restriction.imageRestriction.width, height: item.restriction.imageRestriction.height }],
+                                    fileSize: item.restriction.imageRestriction.fileSize * 1024
+                                }
+                            })
+                            setMaterialConfig({
+                                ...materialConfig,
+                                type: item.name,
+                                max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                index: num,
+                                adcreativeTemplateId: creativeTemplateId,
+                                isGroup: false
+                            })
+                            setTimeout(() => {
+                                setSelectVideoVisible(true)
+                            }, 100)
+                        }}
+                    >添加图片</Button>
+                } else if (item.name === 'list') {
+                    return <Button
+                        type="primary"
+                        disabled={dynamicGroup?.[num]?.['list']?.length >= 15}
+                        onClick={() => {
+                            selectGroupImg(num, item.arrayProperty.maxNumber, 15 - (dynamicGroup?.[num]?.['list']?.length || 0))
+                        }}
+                    >添加{item.arrayProperty.maxNumber}图</Button>
+                }
+                return null
+            })
+        })
+    }
+
     return <Modal
         title={<Space>
             <strong style={{ fontSize: 20 }}>创意素材</strong>
-            {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? <>
+            {/* {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? <> */}
+            {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') ? <>
                 {videoUploads && Object.keys(videoUploads)?.length > 0 && <Button type="link" onClick={() => {
                     setSelectCloudData({ defaultParams: { sizeQueries: creativeTemplateId === 1708 ? [{ relation: '>=', width: 1280, height: 720 }] : [{ relation: '>=', width: videoUploads.restriction.videoRestriction.minWidth, height: videoUploads.restriction.videoRestriction.minHeight }], fileSize: videoUploads.restriction.videoRestriction.fileSize * 1024, materialType: 'video' }, num: 500 })
                     setMaterialConfig({
@@ -239,26 +376,54 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
                         }}><RetweetOutlined /></a>
                     </Tooltip>}
                 </Space>
-                <Button
-                    type="link"
-                    onClick={() => {
+                {dynamicCreativeSwitch ? <>
+                    {renderDynamicSwitch(0, true)}
+                </> : <>
+                    <Button
+                        type="link"
+                        onClick={() => {
+                            setSelectCloudData({
+                                num: 500,
+                                defaultParams: {
+                                    materialType: 'image',
+                                    sizeQueries: [
+                                        { relation: '=', width: 800, height: 800 },
+                                        { relation: '=', width: 1280, height: 720 },
+                                        { relation: '=', width: 960, height: 334 },
+                                        { relation: '=', width: 480, height: 320 },
+                                        { relation: '=', width: 1080, height: 1920 }
+                                    ],
+                                    fileSize: 400 * 1024
+                                }
+                            })
+                            setMaterialConfig({
+                                ...materialConfig,
+                                type: 'image',
+                                max: 500,
+                                index: 20000,
+                                adcreativeTemplateId: creativeTemplateId,
+                                isGroup: false
+                            })
+                            setTimeout(() => {
+                                setSelectVideoVisible(true)
+                            }, 100)
+                        }}
+                    >批量添加图片素材</Button>
+                    <Button type="link" onClick={() => {
                         setSelectCloudData({
                             num: 500,
                             defaultParams: {
-                                materialType: 'image',
+                                materialType: 'video',
                                 sizeQueries: [
-                                    { relation: '=', width: 800, height: 800 },
-                                    { relation: '=', width: 1280, height: 720 },
-                                    { relation: '=', width: 960, height: 334 },
-                                    { relation: '=', width: 480, height: 320 },
-                                    { relation: '=', width: 1080, height: 1920 }
+                                    { relation: '>=', width: 1280, height: 720 },
+                                    { relation: '>=', width: 720, height: 1280 }
                                 ],
-                                fileSize: 400 * 1024
+                                fileSize: 512000 * 1024
                             }
                         })
                         setMaterialConfig({
                             ...materialConfig,
-                            type: 'image',
+                            type: 'video',
                             max: 500,
                             index: 20000,
                             adcreativeTemplateId: creativeTemplateId,
@@ -267,45 +432,22 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
                         setTimeout(() => {
                             setSelectVideoVisible(true)
                         }, 100)
-                    }}>批量添加图片素材</Button>
-                <Button type="link" onClick={() => {
-                    setSelectCloudData({
-                        num: 500,
-                        defaultParams: {
-                            materialType: 'video',
-                            sizeQueries: [
-                                { relation: '>=', width: 1280, height: 720 },
-                                { relation: '>=', width: 720, height: 1280 }
-                            ],
-                            fileSize: 512000 * 1024
-                        }
-                    })
-                    setMaterialConfig({
-                        ...materialConfig,
-                        type: 'video',
-                        max: 500,
-                        index: 20000,
-                        adcreativeTemplateId: creativeTemplateId,
-                        isGroup: false
-                    })
-                    setTimeout(() => {
-                        setSelectVideoVisible(true)
-                    }, 100)
-                }}>批量添加视频素材</Button>
-                {deliveryMode === 'DELIVERY_MODE_COMPONENT' && <Dropdown
-                    menu={{
-                        items: [
-                            { label: '1:1 九图', key: '4', onClick: () => { selectGroupListImg(9) } },
-                            { label: '1:1 六图', key: '1', onClick: () => { selectGroupListImg(6) } },
-                            { label: '1:1 三图', key: '2', onClick: () => { selectGroupListImg(3) } },
-                            { label: '1:1 四图', key: '3', onClick: () => { selectGroupListImg(4) } },
-                        ]
-                    }}
-                    placement="bottomLeft"
-                    arrow
-                >
-                    <Button type="link">批量添加业务单元组图</Button>
-                </Dropdown>}
+                    }}>批量添加视频素材</Button>
+                    {deliveryMode === 'DELIVERY_MODE_COMPONENT' && <Dropdown
+                        menu={{
+                            items: [
+                                { label: '1:1 九图', key: '4', onClick: () => { selectGroupListImg(9) } },
+                                { label: '1:1 六图', key: '1', onClick: () => { selectGroupListImg(6) } },
+                                { label: '1:1 三图', key: '2', onClick: () => { selectGroupListImg(3) } },
+                                { label: '1:1 四图', key: '3', onClick: () => { selectGroupListImg(4) } },
+                            ]
+                        }}
+                        placement="bottomLeft"
+                        arrow
+                    >
+                        <Button type="link">批量添加业务单元组图</Button>
+                    </Dropdown>}
+                </>}
             </>}
             {(dynamicGroup && dynamicGroup?.length > 1) && <Popconfirm
                 title="是否清空?"
@@ -361,104 +503,111 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
                         {fields.map((field, num) => (<Card
                             title={<Space>
                                 <strong style={{ fontSize: 18 }}>创意组{num + 1}</strong>
-                                {(deliveryMode === 'DELIVERY_MODE_COMPONENT' && !dynamicCreativeSwitch) && <>
-                                    <Dropdown
-                                        menu={{
-                                            items: [
-                                                {
-                                                    label: '添加视频',
-                                                    key: 'addVideo',
-                                                    onClick: () => {
-                                                        setSelectCloudData({
-                                                            num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
-                                                            defaultParams: {
-                                                                materialType: 'video',
-                                                                sizeQueries: [
-                                                                    { relation: '>=', width: 1280, height: 720 },
-                                                                    { relation: '>=', width: 720, height: 1280 }
-                                                                ],
-                                                                fileSize: 512000 * 1024
-                                                            }
-                                                        })
-                                                        setMaterialConfig({
-                                                            ...materialConfig,
-                                                            type: 'video',
-                                                            max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
-                                                            index: num,
-                                                            adcreativeTemplateId: creativeTemplateId,
-                                                            isGroup: false
-                                                        })
-                                                        setTimeout(() => {
-                                                            setSelectVideoVisible(true)
-                                                        }, 100)
-                                                    }
-                                                },
-                                                {
-                                                    label: '添加图片',
-                                                    key: 'addImg',
-                                                    onClick: () => {
-                                                        setSelectCloudData({
-                                                            num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
-                                                            defaultParams: {
-                                                                materialType: 'image',
-                                                                sizeQueries: [
-                                                                    { relation: '=', width: 800, height: 800 },
-                                                                    { relation: '=', width: 1280, height: 720 },
-                                                                    { relation: '=', width: 960, height: 334 },
-                                                                    { relation: '=', width: 480, height: 320 },
-                                                                    { relation: '=', width: 1080, height: 1920 }
-                                                                ],
-                                                                fileSize: 400 * 1024
-                                                            }
-                                                        })
-                                                        setMaterialConfig({
-                                                            ...materialConfig,
-                                                            type: 'image',
-                                                            max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
-                                                            index: num,
-                                                            adcreativeTemplateId: creativeTemplateId,
-                                                            isGroup: false
-                                                        })
-                                                        setTimeout(() => {
-                                                            setSelectVideoVisible(true)
-                                                        }, 100)
+                                {/* {(deliveryMode === 'DELIVERY_MODE_COMPONENT' && !dynamicCreativeSwitch) && <> */}
+                                {(deliveryMode === 'DELIVERY_MODE_COMPONENT') && <>
+                                    {dynamicCreativeSwitch ? <>
+                                        {renderDynamicSwitch(num)}
+                                    </> : <>
+                                        <Dropdown
+                                            menu={{
+                                                items: [
+                                                    {
+                                                        label: '添加视频',
+                                                        key: 'addVideo',
+                                                        onClick: () => {
+                                                            setSelectCloudData({
+                                                                num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                                                defaultParams: {
+                                                                    materialType: 'video',
+                                                                    sizeQueries: [
+                                                                        { relation: '>=', width: 1280, height: 720 },
+                                                                        { relation: '>=', width: 720, height: 1280 }
+                                                                    ],
+                                                                    fileSize: 512000 * 1024
+                                                                }
+                                                            })
+                                                            setMaterialConfig({
+                                                                ...materialConfig,
+                                                                type: 'video',
+                                                                max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                                                index: num,
+                                                                adcreativeTemplateId: creativeTemplateId,
+                                                                isGroup: false
+                                                            })
+                                                            setTimeout(() => {
+                                                                setSelectVideoVisible(true)
+                                                            }, 100)
+                                                        }
+                                                    },
+                                                    {
+                                                        label: '添加图片',
+                                                        key: 'addImg',
+                                                        onClick: () => {
+                                                            setSelectCloudData({
+                                                                num: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                                                defaultParams: {
+                                                                    materialType: 'image',
+                                                                    sizeQueries: [
+                                                                        { relation: '=', width: 800, height: 800 },
+                                                                        { relation: '=', width: 1280, height: 720 },
+                                                                        { relation: '=', width: 960, height: 334 },
+                                                                        { relation: '=', width: 480, height: 320 },
+                                                                        { relation: '=', width: 1080, height: 1920 }
+                                                                    ],
+                                                                    fileSize: 400 * 1024
+                                                                }
+                                                            })
+                                                            setMaterialConfig({
+                                                                ...materialConfig,
+                                                                type: 'image',
+                                                                max: 15 - (dynamicGroup?.[num]?.['list']?.length || 0),
+                                                                index: num,
+                                                                adcreativeTemplateId: creativeTemplateId,
+                                                                isGroup: false
+                                                            })
+                                                            setTimeout(() => {
+                                                                setSelectVideoVisible(true)
+                                                            }, 100)
+                                                        }
                                                     }
-                                                }
-                                            ]
-                                        }}
-                                        placement="bottomLeft"
-                                        arrow
-                                    >
-                                        <Button type="primary">添加图片/视频</Button>
-                                    </Dropdown>
-                                    <Dropdown
-                                        menu={{
-                                            items: [
-                                                { label: '1:1 九图', key: '4', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 9, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
-                                                { label: '1:1 六图', key: '1', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 6, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
-                                                { label: '1:1 三图', key: '2', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 3, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
-                                                { label: '1:1 四图', key: '3', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 4, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
-                                            ]
-                                        }}
-                                        placement="bottomLeft"
-                                        arrow
-                                    >
-                                        <Button type="primary">上传组图</Button>
-                                    </Dropdown>
+                                                ]
+                                            }}
+                                            placement="bottomLeft"
+                                            arrow
+                                        >
+                                            <Button type="primary">添加图片/视频</Button>
+                                        </Dropdown>
+                                        <Dropdown
+                                            menu={{
+                                                items: [
+                                                    { label: '1:1 九图', key: '4', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 9, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
+                                                    { label: '1:1 六图', key: '1', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 6, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
+                                                    { label: '1:1 三图', key: '2', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 3, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
+                                                    { label: '1:1 四图', key: '3', disabled: dynamicGroup?.[num]?.['list']?.length >= 15, onClick: () => { selectGroupImg(num, 4, 15 - (dynamicGroup?.[num]?.['list']?.length || 0)) } },
+                                                ]
+                                            }}
+                                            placement="bottomLeft"
+                                            arrow
+                                        >
+                                            <Button type="primary">上传组图</Button>
+                                        </Dropdown>
+                                    </>}
                                 </>}
                             </Space>}
                             className="cardResetCss"
                             key={field.key}
-                            style={{ width: (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? ([641, 642, 643, 2277, 720, 721, 722, 1529, 618].includes(creativeTemplateId) || dynamicGroup?.length === 1) ? '100%' : 'calc(50% - 5px)' : '100%' }}
+                            // style={{ width: (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? ([641, 642, 643, 2277, 720, 721, 722, 1529, 618].includes(creativeTemplateId) || dynamicGroup?.length === 1) ? '100%' : 'calc(50% - 5px)' : '100%' }}
+                            style={{ width: (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') ? ([641, 642, 643, 2277, 720, 721, 722, 1529, 618].includes(creativeTemplateId) || dynamicGroup?.length === 1) ? '100%' : 'calc(50% - 5px)' : '100%' }}
                             extra={fields?.length > 1 && <DeleteOutlined className={styles.clear} onClick={() => remove(field.name)} style={{ color: 'red' }} />}
                         >
-                            {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? <Space size={30} style={{ width: '100%' }} className={styles.space}>
+                            {/* {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? <Space size={30} style={{ width: '100%' }} className={styles.space}> */}
+                            {(deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') ? <Space size={30} style={{ width: '100%' }} className={styles.space}>
                                 {Object.keys(materialData)?.map(key => {
-                                    let m = materialData[key]
-                                    let children = m.children
+                                    const m = materialData[key]
+                                    const children = m.children
 
                                     return Object.keys(children).map(k => {
-                                        let item = children[k]
+                                        const item = children[k]
                                         if (k === 'short_video1' || k === 'video_id') {
                                             return <Form.Item
                                                 {...field}
@@ -690,7 +839,8 @@ const AddMaterial: React.FC<Props> = ({ creativeTemplateId, materialData, delive
             deliveryMode={deliveryMode}
             onChange={(content: any) => {
                 if (content.length > 0) {
-                    if (deliveryMode === 'DELIVERY_MODE_COMPONENT' && !dynamicCreativeSwitch) { // 组件化创意
+                    // if (deliveryMode === 'DELIVERY_MODE_COMPONENT' && !dynamicCreativeSwitch) { // 组件化创意
+                    if (deliveryMode === 'DELIVERY_MODE_COMPONENT') { // 组件化创意
                         if (materialConfig.index === 20000) {
                             const aContent = content.map((m: any) => {
                                 if (m?.materialType === 4) { // 组件库

src/pages/launchSystemV3/tencentAdPutIn/create/Material/index.tsx

@@ -109,7 +109,8 @@ const Material: React.FC<{ adData?: any[] }> = ({ adData }) => {
                         <Title level={5} style={{ fontSize: 12 }}>{mediaType === 0 ? '全账号复用' : mediaType === 1 ? '平均分配到广告' : mediaType === 2 ? '顺序分配到广告' : mediaType === 3 ? '账号下平均分配到广告' : null}</Title>
                         <div className={style.detail_body_m}>
                             {dynamicMaterialDTos.dynamicGroup.map((item: any, index: number) => {
-                                if (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) {
+                                // if (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) {
+                                if (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') {
                                     return <div key={index} style={{ width: (deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamicCreativeSwitch) ? [641, 642, 643, 2277].includes(creativeTemplateId) ? '100%' : [720, 721, 722, 1529, 618].includes(creativeTemplateId) ? '50%' : '25%' : '100%' }}>
                                         <Title level={5} style={{ fontSize: 12 }}>创意组{index + 1}</Title>
                                         {mType ? ['short_video', 'video'].includes(mType) ? <div className={style.video}>

src/pages/launchSystemV3/tencentAdPutIn/create/index.tsx

@@ -224,7 +224,8 @@ const Create: React.FC = () => {
                                 message.warning('请注意，检测投放开始日期小于今天，已自动改成今天，如需修改，请重新设置')
                             }
                             let dynamicGroup: any[] = []
-                            if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || (dynamic.deliveryMode === 'DELIVERY_MODE_COMPONENT' && dynamic?.dynamicCreativeType === 'DYNAMIC_CREATIVE_TYPE_COMMON')) {
+                            // if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || (dynamic.deliveryMode === 'DELIVERY_MODE_COMPONENT' && dynamic?.dynamicCreativeType === 'DYNAMIC_CREATIVE_TYPE_COMMON')) {
+                            if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') {
                                 dynamicGroup = dynamicMaterialDTOS?.map((item: any[]) => {
                                     let { type, valueJson } = item[0]
                                     let value = JSON.parse(valueJson).value
@@ -715,7 +716,8 @@ const Create: React.FC = () => {
         const { adgroups, targeting, dynamic, dynamicMaterialDTos, dynamicCreativesTextDTOS, mediaType } = JSON.parse(JSON.stringify(addelivery)) as PULLIN.AddeliveryProps
 
         let dynamicMaterialDTOS = []
-        if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamic?.dynamicCreativeSwitch) {
+        // if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE' || dynamic?.dynamicCreativeSwitch) {
+        if (dynamic.deliveryMode === 'DELIVERY_MODE_CUSTOMIZE') {
             if ((materialData && Object.keys(materialData).length && dynamicMaterialDTos && Object.keys(dynamicMaterialDTos).length)) {
                 const mType = Object.keys(materialData)[0];
                 dynamicMaterialDTOS = dynamicMaterialDTos.dynamicGroup?.map((item: any) => {

src/pages/launchSystemV3/tencentAdPutIn/create/tableConfig.tsx

@@ -126,11 +126,10 @@ const columns = (): TableProps<any>['columns'] => {
                     width: 210,
                     render: (_, b) => {
                         let deliveryMode = b?.dynamicDto?.deliveryMode
-                        let dynamicCreativeSwitch = b?.dynamicDto?.dynamicCreativeSwitch
                         let dynamicGroup = b?.dynamicGroup
                         if (dynamicGroup && Object.keys(dynamicGroup).length) {
                             let keys = Object.keys(dynamicGroup)
-                            if (deliveryMode === "DELIVERY_MODE_CUSTOMIZE" || dynamicCreativeSwitch) {
+                            if (deliveryMode === "DELIVERY_MODE_CUSTOMIZE") {
                                 return <>
                                     <div className={style.detail_body_m}>
                                         {(keys.includes('video_id') || keys.includes('short_video1')) ? <>
@@ -300,11 +299,10 @@ export const columnsAddDynamic = (): TableProps<any>['columns'] => {
                     width: 200,
                     render: (_, b) => {
                         let deliveryMode = b?.dynamicDto?.deliveryMode
-                        let dynamicCreativeSwitch = b?.dynamicDto?.dynamicCreativeSwitch
                         let dynamicGroup = b?.dynamicGroup
                         if (dynamicGroup && Object.keys(dynamicGroup).length) {
                             let keys = Object.keys(dynamicGroup)
-                            if (deliveryMode === "DELIVERY_MODE_CUSTOMIZE" || dynamicCreativeSwitch) {
+                            if (deliveryMode === "DELIVERY_MODE_CUSTOMIZE") {
                                 // return <Text style={{ fontSize: 12, color: '#1890ff' }}>已选{(keys.includes('video_id') || keys.includes('short_video1')) ? '1个视频，0张图片' : keys.includes('image_id') ? '0个视频，1张图片' : (keys.includes('image_list') || keys.includes('element_story') ? '1个组图, 0个视频' : '')}</Text>
                                 return <>
                                     <div className={style.detail_body_m}>

src/services/adqV3/global.ts

@@ -1221,6 +1221,44 @@ export async function getCreativeComponentDataListApi(data: GetCreativeComponent
     })
 }
 
+interface GetComponentSharingProps {
+    adAccountId: number
+    componentId: number
+    pageNum: number,
+    pageSize: number,
+    isDeleted?: boolean
+}
+
+/**
+ * 查询组件共享账号
+ * @param data 
+ * @returns 
+ */
+export async function getComponentSharingApi(data: GetComponentSharingProps) {
+    return request(api + `/adq/creative/component/getComponentSharing`, {
+        method: 'POST',
+        data
+    })
+}
+interface UpdateComponentSharingProps {
+    adAccountId: number
+    componentId: number
+    sharingAccountIds: number[]
+    sharedAccountType: string // ADVERTISER 部分共享、ORGANIZATION 全部共享
+}
+
+/**
+ * 修改共享状态
+ * @param data 
+ * @returns 
+ */
+export async function updateComponentSharingApi(data: UpdateComponentSharingProps) {
+    return request(api + `/adq/creative/component/updateComponentSharing`, {
+        method: 'POST',
+        data
+    })
+}
+
 export interface CreativeComponentDetailDTOS {
     materialId?: string,
     componentSubType: string