fix

src/models/useLaunchAdq/useBdMediaPup.ts

@@ -1,424 +1,596 @@
 import getMD5 from '@/components/MD5';
 import { useAjax } from '@/Hook/useAjax';
-import { bdSysMediaList, bdSysMediaAdd, delMedia, bdSysMediaEdit, getFileUrl, getMedia, configSortApi, getFolderTree, editMediaFolder } from '@/services/launchAdq/material';
+import {
+  bdSysMediaList,
+  bdSysMediaAdd,
+  delMedia,
+  bdSysMediaEdit,
+  getFileUrl,
+  getMedia,
+  configSortApi,
+  getFolderTree,
+  editMediaFolder,
+} from '@/services/launchAdq/material';
 import { blobToBase64, dataURLtoFile, videoMessage } from '@/utils/compress';
 import { getImgSize } from '@/utils/utils';
 import { message } from 'antd';
 import { compressAccurately } from 'image-conversion';
-import { Dispatch, useCallback, useReducer, useState } from 'react'
+import { Dispatch, useCallback, useReducer, useState } from 'react';
 import { request } from 'umi';
 /**新本地素材弹窗 */
 type State = {
-    fileVisible?: boolean,//文件夹弹窗
-    imgVisrible?: boolean,//img,voice,video弹窗
-    newsVisrible?: boolean,//news弹窗
-    knewsVisrible?: boolean,//客服图文弹窗
-    fileName?: string,//文件夹名称
-    sort?: number, // 排序
-    videoTitle?: string,//video文件名称
-    videoDescription?: string,//视频描述
-    belongUser?: any,//0公共本地|1个人本地
-    mediaType?: 'VIDEO' | 'IMG' | 'PAGE', // 类型
-    parentId?: any,//上级目录ID，顶级使用null
-    url?: string,//素材地址
-    pathId?: string,//路径ID
-    selectFile?: number[],//选中的文件列表
-    rightClickPup?: any,// /**右键菜单开关 all为全部 id 为目标文件 空为不显示*/
-    xy?: { x: number, y: number },// /**鼠标位置 菜单弹窗位置使用*/
-    delPupId?: any,//按了单个删除存放的id为了让弹窗区分文件
-    actionItem?: any,//当前选中的Itme
-    path?: any[],//个人路径
-    publicPath?: any[],//本地路径
-    file?: File,//素材文件
-    selectItem?: any[],//单选素材时存放选中的素材
-    knewsdefaultData?: any,//k图文编辑时的默认内容
-    sortVisible?: boolean,//排序弹窗
-    num?: number, //选择数量
-    size?: number,  // 需要上传素材的大小
-    upLoadLoading?: boolean,
-    cloudSize?: any[],
-    maxSize?:number,//素材最大尺寸
-}
+  fileVisible?: boolean; //文件夹弹窗
+  imgVisrible?: boolean; //img,voice,video弹窗
+  newsVisrible?: boolean; //news弹窗
+  knewsVisrible?: boolean; //客服图文弹窗
+  fileName?: string; //文件夹名称
+  sort?: number; // 排序
+  videoTitle?: string; //video文件名称
+  videoDescription?: string; //视频描述
+  belongUser?: any; //0公共本地|1个人本地
+  mediaType?: 'VIDEO' | 'IMG' | 'PAGE'; // 类型
+  parentId?: any; //上级目录ID，顶级使用null
+  url?: string; //素材地址
+  pathId?: string; //路径ID
+  selectFile?: number[]; //选中的文件列表
+  rightClickPup?: any; // /**右键菜单开关 all为全部 id 为目标文件 空为不显示*/
+  xy?: { x: number; y: number }; // /**鼠标位置 菜单弹窗位置使用*/
+  delPupId?: any; //按了单个删除存放的id为了让弹窗区分文件
+  actionItem?: any; //当前选中的Itme
+  path?: any[]; //个人路径
+  publicPath?: any[]; //本地路径
+  file?: File; //素材文件
+  selectItem?: any[]; //单选素材时存放选中的素材
+  knewsdefaultData?: any; //k图文编辑时的默认内容
+  sortVisible?: boolean; //排序弹窗
+  num?: number; //选择数量
+  size?: number; // 需要上传素材的大小
+  upLoadLoading?: boolean;
+  cloudSize?: any[];
+  maxSize?: number; //素材最大尺寸
+  adcreativeTemplateId?: number; //创意模板 id
+  promotedObjectType?: string; //推广目标类型
+  promotedObjectId?: string; //推广目标 id
+  pageType?: string; //落地页类型
+  canvasType?: string; //原生页类型
+  siteSet?: string[]; //版位
+  sourceType?: string; //视频/图片/原生页等素材的创建来源类型
+  marketingScene?: string; //营销场景
+};
 export type Action = {
-    type: 'set' | 'init',
-    params?: any
-}
+  type: 'set' | 'init';
+  params?: any;
+};
 const typeEnum = {
-    'IMG': '图片',
-    'VIDEO': '视频'
-}
+  IMG: '图片',
+  VIDEO: '视频',
+};
 function reducer(state: State, action: Action) {
-    let { type, params } = action
-    let newState = JSON.parse(JSON.stringify(state))
-    newState.file = state.file
-    switch (type) {
-        case 'set':
-            Object.keys(params as State).forEach((key: string) => {
-                newState[key] = (params as State)[key]
-            })
-            return newState
-        case 'init':
-            return { ...initData, ...params }
-        default:
-            return state;
-    }
+  let { type, params } = action;
+  let newState = JSON.parse(JSON.stringify(state));
+  newState.file = state.file;
+  switch (type) {
+    case 'set':
+      Object.keys(params as State).forEach((key: string) => {
+        newState[key] = (params as State)[key];
+      });
+      return newState;
+    case 'init':
+      return { ...initData, ...params };
+    default:
+      return state;
+  }
 }
 const initData: State = {
-    fileVisible: false,
-    knewsVisrible: false,
-    videoTitle: '',
-    videoDescription: '',
-    fileName: '',
-    belongUser: '1',
-    mediaType: 'IMG',
-    parentId: null,
-    selectFile: [],
-    delPupId: '',
-    rightClickPup: { id: '' },
-    publicPath: [{ title: '公共本地', number: '0' }],
-    path: [{ title: '个人本地', number: '0' }],
-    imgVisrible: false,
-    newsVisrible: false,
-    sortVisible: false,
-    sort: 0,
-    num: 1
-}
+  fileVisible: false,
+  knewsVisrible: false,
+  videoTitle: '',
+  videoDescription: '',
+  fileName: '',
+  belongUser: '1',
+  mediaType: 'IMG',
+  parentId: null,
+  selectFile: [],
+  delPupId: '',
+  rightClickPup: { id: '' },
+  publicPath: [{ title: '公共本地', number: '0' }],
+  path: [{ title: '个人本地', number: '0' }],
+  imgVisrible: false,
+  newsVisrible: false,
+  sortVisible: false,
+  sort: 0,
+  num: 1,
+};
 /**本地素材管理器 */
 function useBdMediaPup() {
-    const [state, dispatch]: [State, Dispatch<Action>] = useReducer(reducer, initData)
-    const { fileName, sort, belongUser, mediaType, parentId, selectFile, selectItem, delPupId, cloudSize, num, rightClickPup, actionItem, path, publicPath, videoTitle, videoDescription, size,maxSize } = state
-    const list = useAjax((params) => bdSysMediaList(params))
-    const add = useAjax((params) => bdSysMediaAdd(params), { msgNmae: '新增' })
-    const del = useAjax((params) => delMedia(params), { msgNmae: '删除' })
-    const edit = useAjax((params) => bdSysMediaEdit(params), { msgNmae: '编辑' })
-    const configSort = useAjax((params) => configSortApi(params), { msgNmae: '排序' })
-    const get = useAjax((params) => getMedia(params))//获取图文详情
-    const get_folder_tree = useAjax((params: any) => getFolderTree(params))
-    const edit_media_folder = useAjax((params: any) => editMediaFolder(params))
-    const [isOk, setIsOk] = useState<boolean>(true)
-    //请求上传地址
-    const fileUrl = useAjax((params: { type: string, fileType: 'video' | 'image' }) => getFileUrl(params), {
-        manual: true,
-    })
-    /**初始化数据 */
-    const init = useCallback((params: any) => {
-        console.log('params======>',params)
-        dispatch({ type: 'init', params })
-    }, [])
-    /**设置state */
-    const set = useCallback((params: State) => {
-        if (params) {
-            dispatch({ type: 'set', params })
-        }
-    }, [])
-    /**新增文件夹 */
-    const addFolder = () => {
-        if (fileName) {
-            let obj = { title: fileName, mediaType, folder: true, parentId, belongUser: belongUser === '0' ? false : true, sort }
-            add.run(obj).then((res) => {
-                get_folder_tree.refresh()
-                list.refresh()
-                offEditFile()//关闭弹窗并清空相关数据
-            })
-        }
+  const [state, dispatch]: [State, Dispatch<Action>] = useReducer(reducer, initData);
+  const {
+    fileName,
+    sort,
+    belongUser,
+    mediaType,
+    parentId,
+    selectFile,
+    selectItem,
+    delPupId,
+    cloudSize,
+    num,
+    rightClickPup,
+    actionItem,
+    path,
+    publicPath,
+    videoTitle,
+    videoDescription,
+    size,
+    maxSize,
+    adcreativeTemplateId,
+    promotedObjectType,
+    promotedObjectId,
+    pageType,
+    canvasType,
+    siteSet,
+    sourceType,
+    marketingScene,
+  } = state;
+  const list = useAjax((params) => bdSysMediaList(params));
+  const add = useAjax((params) => bdSysMediaAdd(params), { msgNmae: '新增' });
+  const del = useAjax((params) => delMedia(params), { msgNmae: '删除' });
+  const edit = useAjax((params) => bdSysMediaEdit(params), { msgNmae: '编辑' });
+  const configSort = useAjax((params) => configSortApi(params), { msgNmae: '排序' });
+  const get = useAjax((params) => getMedia(params)); //获取图文详情
+  const get_folder_tree = useAjax((params: any) => getFolderTree(params));
+  const edit_media_folder = useAjax((params: any) => editMediaFolder(params));
+  const [isOk, setIsOk] = useState<boolean>(true);
+  //请求上传地址
+  const fileUrl = useAjax(
+    (params: { type: string; fileType: 'video' | 'image' }) => getFileUrl(params),
+    {
+      manual: true,
+    },
+  );
+  /**初始化数据 */
+  const init = useCallback((params: State) => {
+    console.log('params======>', params);
+    dispatch({ type: 'init', params });
+  }, []);
+  /**设置state */
+  const set = useCallback((params: State) => {
+    if (params) {
+      dispatch({ type: 'set', params });
+    }
+  }, []);
+  /**新增文件夹 */
+  const addFolder = () => {
+    if (fileName) {
+      let obj = {
+        title: fileName,
+        mediaType,
+        folder: true,
+        parentId,
+        belongUser: belongUser === '0' ? false : true,
+        sort,
+      };
+      add.run(obj).then((res) => {
+        get_folder_tree.refresh();
+        list.refresh();
+        offEditFile(); //关闭弹窗并清空相关数据
+      });
     }
-    /** 新增图片 视频 */
-    const addFile = async (data: any) => {
-        if (data) {//存在代表素材
-            if (!data) {
-                return
+  };
+  /** 新增图片 视频 */
+  const addFile = async (data: any) => {
+    if (data) {
+      //存在代表素材
+      if (!data) {
+        return;
+      }
+      if (data?.file) {
+        let file = data.file;
+        let fileSize = size || 0;
+        if (!size) {
+          if (mediaType === 'IMG') {
+            fileSize = 307200;
+          } else {
+            fileSize = 104857600;
+          }
+        }
+
+        if (mediaType === 'IMG') {
+          if (file?.size > fileSize) {
+            // 大于300kb进入压缩
+            let bole = await compressAccurately(file, 250);
+            if (bole?.size > 300000) {
+              bole = await compressAccurately(file, 200);
             }
-            if (data?.file) {
-                let file = data.file
-                let fileSize = size || 0
-                if (!size) {
-                    if (mediaType === 'IMG') {
-                        fileSize = 307200
-                    } else {
-                        fileSize = 104857600
-                    }
-                }
+            if (bole?.size > 300000) {
+              bole = await compressAccurately(file, 150);
+            }
+            if (bole?.size > 300000) {
+              bole = await compressAccurately(file, 100);
+            }
+            let newFile = await blobToBase64(bole);
+            message.warning({
+              content: `选择的图片大于${fileSize / 1024}KB，图片已压缩`,
+              duration: 3,
+            });
+            file = await dataURLtoFile(newFile, file?.name);
+          }
+        } else if (mediaType === 'VIDEO') {
+          if (file?.size > fileSize) {
+            // 大于100mb进入压缩
+            message.error({
+              content: `选择的视频大于${fileSize / 1024 / 1024}MB，请重新选择提交`,
+              duration: 3,
+            });
+            return;
+          }
+        }
+        set({ upLoadLoading: true });
+        let width = 0;
+        let height = 0;
+        if (mediaType === 'IMG') {
+          let imgData = await getImgSize(file);
+          width = imgData.width;
+          height = imgData.height;
+        } else if (mediaType === 'VIDEO') {
+          let videoInfo: any = await videoMessage([file]);
+          width = videoInfo[0].width;
+          height = videoInfo[0].height;
+        }
+        /**修改文件名以用户设置的文件title命名*/
+        let newFile = new File(
+          [file],
+          data?.title ? data?.title + '.' + file?.name?.split('.')[1] : file?.name,
+          { type: file?.type },
+        );
+        let formData = new FormData();
 
-                if (mediaType === 'IMG') {
-                    if (file?.size > fileSize) { // 大于300kb进入压缩
-                        let bole = await compressAccurately(file, 250)
-                        if (bole?.size > 300000) {
-                            bole = await compressAccurately(file, 200)
-                        }
-                        if (bole?.size > 300000) {
-                            bole = await compressAccurately(file, 150)
-                        }
-                        if (bole?.size > 300000) {
-                            bole = await compressAccurately(file, 100)
-                        }
-                        let newFile = await blobToBase64(bole)
-                        message.warning({
-                            content: `选择的图片大于${fileSize / 1024}KB，图片已压缩`,
-                            duration: 3
+        /**向阿里云请求上传地址*/
+        fileUrl
+          .run({ type: newFile.type, fileType: mediaType === 'VIDEO' ? 'video' : 'image' })
+          .then((res1) => {
+            Object.keys(res1).forEach((key: string) => {
+              if (key !== 'url') {
+                formData.append(key, res1[key]);
+              }
+            });
+            formData.append('file', newFile);
+            /**向阿里云返回的上传地址上传文件*/
+            request(res1?.ossUrl, { method: 'post', body: formData })
+              .then(async (res2: { code: number; data: { url: string } }) => {
+                if (res2.code === 200) {
+                  message.success('上传成功');
+                  if (data) {
+                    /**取到返回的文件地址向后端发送具体数据*/
+                    if (res2?.data?.url) {
+                      let fileMd5 = await getMD5(newFile);
+                      let obj = {
+                        title: data.title,
+                        mediaType,
+                        folder: false,
+                        parentId,
+                        width,
+                        height,
+                        fileMd5,
+                        belongUser: belongUser === '0' ? false : true,
+                        url: res2?.data?.url,
+                        sort: data?.sort,
+                        fileSize: newFile?.size,
+                        fileMime: newFile.type,
+                      };
+                      if (mediaType === 'VIDEO') {
+                        obj['videoTitle'] = data?.videoTitle || data?.title;
+                        obj['videoDescription'] = data?.videoDescription;
+                      }
+                      add
+                        .run(obj)
+                        .then((res) => {
+                          list.refresh();
+                          offEditFile(); //关闭弹窗并清空相关数据
+                          set({ upLoadLoading: false });
                         })
-                        file = await dataURLtoFile(newFile, file?.name)
+                        .catch(() => set({ upLoadLoading: false }));
                     }
-                } else if (mediaType === 'VIDEO') {
-                    if (file?.size > fileSize) { // 大于100mb进入压缩
-                        message.error({
-                            content: `选择的视频大于${fileSize / 1024 / 1024}MB，请重新选择提交`,
-                            duration: 3
-                        })
-                        return
-                    }
-                }
-                set({ upLoadLoading: true })
-                let width = 0
-                let height = 0
-                if (mediaType === 'IMG') {
-                    let imgData = await getImgSize(file)
-                    width = imgData.width
-                    height = imgData.height
-                } else if (mediaType === "VIDEO") {
-                    let videoInfo: any = await videoMessage([file])
-                    width = videoInfo[0].width
-                    height = videoInfo[0].height
+                  }
+                } else {
+                  message.error('上传失败！');
                 }
-                /**修改文件名以用户设置的文件title命名*/
-                let newFile = new File([file], data?.title ? data?.title + '.' + file?.name?.split('.')[1] : file?.name, { type: file?.type })
-                let formData = new FormData();
-
-                /**向阿里云请求上传地址*/
-                fileUrl.run({ type: newFile.type, fileType: mediaType === 'VIDEO' ? 'video' : 'image' }).then(res1 => {
-                    Object.keys(res1).forEach((key: string) => {
-                        if (key !== 'url') {
-                            formData.append(key, res1[key])
-                        }
-                    })
-                    formData.append('file', newFile)
-                    /**向阿里云返回的上传地址上传文件*/
-                    request(res1?.ossUrl, { method: 'post', body: formData }).then(async (res2: { code: number, data: { url: string } }) => {
-                        if (res2.code === 200) {
-                            message.success('上传成功')
-                            if (data) {
-                                /**取到返回的文件地址向后端发送具体数据*/
-                                if (res2?.data?.url) {
-                                    let fileMd5 = await getMD5(newFile)
-                                    let obj = { title: data.title, mediaType, folder: false, parentId, width, height, fileMd5, belongUser: belongUser === '0' ? false : true, url: res2?.data?.url, sort: data?.sort, fileSize: newFile?.size, fileMime: newFile.type }
-                                    if (mediaType === 'VIDEO') {
-                                        obj['videoTitle'] = data?.videoTitle || data?.title
-                                        obj['videoDescription'] = data?.videoDescription
-                                    }
-                                    add.run(obj).then((res) => {
-                                        list.refresh()
-                                        offEditFile()//关闭弹窗并清空相关数据
-                                        set({ upLoadLoading: false })
-                                    }).catch(() => set({ upLoadLoading: false }))
-                                }
-                            }
-                        } else {
-                            message.error('上传失败！')
-                        }
-                    }).catch(() => set({ upLoadLoading: false }))
-                }).catch(() => set({ upLoadLoading: false }))
-            }
-        }
+              })
+              .catch(() => set({ upLoadLoading: false }));
+          })
+          .catch(() => set({ upLoadLoading: false }));
+      }
     }
-    /**编辑非图文素材名称*/
-    const nameOk = useCallback((selectWx: any) => {
-        if (fileName && actionItem) {
-            let obj = { title: fileName, belongUser: belongUser === '0' ? false : true, sysMediaId: actionItem?.id, mediaType: actionItem?.mediaType, folder: actionItem?.folder, url: actionItem?.url, sort }
-            if (mediaType === 'VIDEO') {
-                obj['videoTitle'] = videoTitle
-                obj['videoDescription'] = videoDescription
-            }
-            edit.run(obj).then((res) => {
-                list.refresh()
-                offEditFile()//关闭弹窗并清空相关数据
-            })
-        }
-    }, [fileName, actionItem, edit, belongUser, mediaType, videoTitle, videoDescription])
-    /**删除文件 */
-    const dels = useCallback((id?: any) => {
-        let arr = typeof id === 'number' ? [id] : selectFile
-        let len = arr?.length || 0
-        if (len) {
-            arr?.map((id, index) => {
-                del.run({ sysMediaId: id, mediaType }).then(() => {
-                    set({ selectFile: selectFile?.filter(i => i !== id) })//清理已删除文件
-                    if (index === len - 1) {
-                        list.refresh()
-                        get_folder_tree.refresh()
-                    }
-                })
-            })
+  };
+  /**编辑非图文素材名称*/
+  const nameOk = useCallback(
+    (selectWx: any) => {
+      if (fileName && actionItem) {
+        let obj = {
+          title: fileName,
+          belongUser: belongUser === '0' ? false : true,
+          sysMediaId: actionItem?.id,
+          mediaType: actionItem?.mediaType,
+          folder: actionItem?.folder,
+          url: actionItem?.url,
+          sort,
+        };
+        if (mediaType === 'VIDEO') {
+          obj['videoTitle'] = videoTitle;
+          obj['videoDescription'] = videoDescription;
         }
-    }, [list, selectFile, mediaType])
-    /**获取本地素材数据列表 */
-    const getList = useCallback((props?: any) => {
-        console.log('getList====>',props)
-        let obj = { pageSize: 20, pageNum: 1, belongUser: belongUser === '0' ? false : true, mediaType, parentId, sizeQueries: cloudSize,maxSize, ...props }
-        list.run(obj).then((res) => {
-            setIsOk(true)
-        })
-    }, [list, mediaType, belongUser, parentId, cloudSize,maxSize])
-    /**选中文件 single 开启可单选为了在右键删除选择时只选一个*/
-    const onFile = useCallback((e: any, item: { id: any, folder?: boolean }, isAll?: boolean, single?: boolean) => {
-        let { id } = item
-        e?.stopPropagation()
-        if (isAll && !single) {
-            set({ selectFile: [...new Set([...selectFile as number[], id])] })
-        } else {
-            if (item?.folder && !single) {//假如是文件不让选择
-                message.error('不能选择文件夹')
-                return
+        edit.run(obj).then((res) => {
+          list.refresh();
+          offEditFile(); //关闭弹窗并清空相关数据
+        });
+      }
+    },
+    [fileName, actionItem, edit, belongUser, mediaType, videoTitle, videoDescription],
+  );
+  /**删除文件 */
+  const dels = useCallback(
+    (id?: any) => {
+      let arr = typeof id === 'number' ? [id] : selectFile;
+      let len = arr?.length || 0;
+      if (len) {
+        arr?.map((id, index) => {
+          del.run({ sysMediaId: id, mediaType }).then(() => {
+            set({ selectFile: selectFile?.filter((i) => i !== id) }); //清理已删除文件
+            if (index === len - 1) {
+              list.refresh();
+              get_folder_tree.refresh();
             }
-            set({ selectFile: [item.id], selectItem: [item] })
+          });
+        });
+      }
+    },
+    [list, selectFile, mediaType],
+  );
+  /**获取本地素材数据列表 */
+  const getList = useCallback(
+    (props?: any) => {
+      console.log('getList====>', props);
+      let obj = {
+        pageSize: 20,
+        pageNum: 1,
+        belongUser: belongUser === '0' ? false : true,
+        mediaType,
+        parentId,
+        sizeQueries: cloudSize,
+        maxSize,
+        ...props,
+      };
+      if (mediaType === 'PAGE') {
+        obj = {
+          ...obj,
+          adcreativeTemplateId,
+          promotedObjectType,
+          promotedObjectId,
+          pageType,
+          canvasType,
+          siteSet,
+          sourceType,
+          marketingScene,
+        };
+      }
+      list.run(obj).then((res) => {
+        setIsOk(true);
+      });
+    },
+    [list, mediaType, belongUser, parentId, cloudSize, maxSize,adcreativeTemplateId,promotedObjectType,promotedObjectId,pageType,canvasType,siteSet,sourceType,marketingScene],
+  );
+  /**选中文件 single 开启可单选为了在右键删除选择时只选一个*/
+  const onFile = useCallback(
+    (e: any, item: { id: any; folder?: boolean }, isAll?: boolean, single?: boolean) => {
+      let { id } = item;
+      e?.stopPropagation();
+      if (isAll && !single) {
+        set({ selectFile: [...new Set([...(selectFile as number[]), id])] });
+      } else {
+        if (item?.folder && !single) {
+          //假如是文件不让选择
+          message.error('不能选择文件夹');
+          return;
         }
-    }, [selectFile])
-    /**点击文件夹 */
-    const fileClick = useCallback((item) => {
-        if (isOk) {
-            setIsOk(false)
-            if (belongUser == '1' && path) {
-                set({ path: [...path, item] })
-            }
-            if (belongUser == '0' && publicPath) {
-                set({ publicPath: [...publicPath, item] })
-            }
-            set({ parentId: item.id })
-            getList({ parentId: item.id })//请求对应文件夹列表
+        set({ selectFile: [item.id], selectItem: [item] });
+      }
+    },
+    [selectFile],
+  );
+  /**点击文件夹 */
+  const fileClick = useCallback(
+    (item) => {
+      if (isOk) {
+        setIsOk(false);
+        if (belongUser == '1' && path) {
+          set({ path: [...path, item] });
         }
-    }, [path, publicPath, mediaType, belongUser, isOk])
-    /**点击目录树*/
-    const treeClick = useCallback((item) => {
-        if (isOk) {
-            setIsOk(false)
-            console.log(item, belongUser == '1')
-            if (belongUser == '1' && path) {
-                set({ path: [path[0], item] })
-            }
-            if (belongUser == '0' && publicPath) {
-                set({ publicPath: [publicPath[0], item] })
-            }
-            set({ parentId: item.id })
-            getList({ parentId: item.id })//请求对应文件夹列表
+        if (belongUser == '0' && publicPath) {
+          set({ publicPath: [...publicPath, item] });
         }
-    }, [path, publicPath, mediaType, belongUser, isOk])
-    /**点击路径 */
-    const pathClick = useCallback((item) => {
-        let newPath: any[] = []
-        if (belongUser == '1') {
-            path?.forEach((paths, index) => {//用传入的index和path循环的index对比小于等于index代表该保留的路径
-                if (index <= item.index) {
-                    newPath.push(paths)
-                }
-            })
-            set({ path: newPath })
-        } else {
-            publicPath?.forEach((paths, index) => {//用传入的index和path循环的index对比小于等于index代表该保留的路径
-                if (index <= item.index) {
-                    newPath.push(paths)
-                }
-            })
-            set({ publicPath: newPath })
+        set({ parentId: item.id });
+        getList({ parentId: item.id }); //请求对应文件夹列表
+      }
+    },
+    [path, publicPath, mediaType, belongUser, isOk],
+  );
+  /**点击目录树*/
+  const treeClick = useCallback(
+    (item) => {
+      if (isOk) {
+        setIsOk(false);
+        console.log(item, belongUser == '1');
+        if (belongUser == '1' && path) {
+          set({ path: [path[0], item] });
+        }
+        if (belongUser == '0' && publicPath) {
+          set({ publicPath: [publicPath[0], item] });
         }
-        set({ parentId: item.parentId })
-        getList({ pageSize: 20, pageNum: 1, mediaType, belongUser: belongUser === '0' ? false : true, parentId: item.id })
-    }, [path, mediaType, belongUser, publicPath])
-    /**取消文件 */
-    const offFile = useCallback((e: any, item: { id: any }) => {
-        let { id } = item
-        set({ selectFile: selectFile?.filter(i => i !== id) })
-    }, [selectFile])
-    /**判断是取消还是选中文件的操作在点击打钩时使用 */
-    const changeClickFile = useCallback((e: any, item: { id: any, folder?: boolean }, isAll?: boolean, noFile?: boolean) => {
-        let { id } = item
-        e?.stopPropagation()//阻止冒泡传递到文件夹被点击事件
-        console.log(111111, num);
-        
-        // if (mediaType === 'PAGE') {
+        set({ parentId: item.id });
+        getList({ parentId: item.id }); //请求对应文件夹列表
+      }
+    },
+    [path, publicPath, mediaType, belongUser, isOk],
+  );
+  /**点击路径 */
+  const pathClick = useCallback(
+    (item) => {
+      let newPath: any[] = [];
+      if (belongUser == '1') {
+        path?.forEach((paths, index) => {
+          //用传入的index和path循环的index对比小于等于index代表该保留的路径
+          if (index <= item.index) {
+            newPath.push(paths);
+          }
+        });
+        set({ path: newPath });
+      } else {
+        publicPath?.forEach((paths, index) => {
+          //用传入的index和path循环的index对比小于等于index代表该保留的路径
+          if (index <= item.index) {
+            newPath.push(paths);
+          }
+        });
+        set({ publicPath: newPath });
+      }
+      set({ parentId: item.parentId });
+      getList({
+        pageSize: 20,
+        pageNum: 1,
+        mediaType,
+        belongUser: belongUser === '0' ? false : true,
+        parentId: item.id,
+      });
+    },
+    [path, mediaType, belongUser, publicPath],
+  );
+  /**取消文件 */
+  const offFile = useCallback(
+    (e: any, item: { id: any }) => {
+      let { id } = item;
+      set({ selectFile: selectFile?.filter((i) => i !== id) });
+    },
+    [selectFile],
+  );
+  /**判断是取消还是选中文件的操作在点击打钩时使用 */
+  const changeClickFile = useCallback(
+    (e: any, item: { id: any; folder?: boolean }, isAll?: boolean, noFile?: boolean) => {
+      let { id } = item;
+      e?.stopPropagation(); //阻止冒泡传递到文件夹被点击事件
+      console.log(111111, num);
 
-        // } else {
-            let state = selectFile?.some((i) => i === id)
-            if (state) {//存在就是删除
-                set({ selectFile: selectFile?.filter(i => i !== id), selectItem: selectItem?.filter((i: { id: number }) => i.id !== id) })
-            } else {//否则新增
-                if (num === 1) {
-                    if (state) {//存在就是删除
-                        set({ selectFile: selectFile?.filter(i => i !== id), selectItem: [] })
-                    } else {//否则新增
-                        console.log(11111)
-                        set({ selectFile: [id], selectItem: [item] })
-                    }
-                } else {
-                    if (selectFile && num && (selectFile?.length >= num)) {
-                        message.error(`只能选择${num}张`)
-                        return
-                    }
-                    let newSelectItem = selectItem || []
-                    newSelectItem.push(item)
-                    set({ selectItem: newSelectItem, selectFile: [...selectFile as number[], id] })
-                }
-            }
-        // }
-    }, [selectFile, mediaType, num])
-    /**开启删除弹窗 */
-    const delPupOn = useCallback((delPupId) => {
-        set({ delPupId })
-    }, [])
-    /**关闭删除弹窗并去除选中 */
-    const delPupOff = useCallback(() => {
-        set({ delPupId: '' })
-        offFile(null, { id: delPupId })
-    }, [delPupId,])
-    /**编辑 */
-    const editFile = useCallback((e?: any,) => {
-        e?.stopPropagation()
-        onFile(null, rightClickPup, true, true)
-        // if (rightClickPup?.mediaType !== 'news') {//不是图文开启编辑名字弹窗
-        let obj = { fileVisible: true, actionItem: rightClickPup, fileName: rightClickPup.title, sort: rightClickPup.sort }
-        if (rightClickPup?.mediaType === 'video') {
-            obj['videoTitle'] = rightClickPup?.videoTitle || rightClickPup?.title
-            obj['videoDescription'] = rightClickPup?.videoDescription
+      // if (mediaType === 'PAGE') {
+
+      // } else {
+      let state = selectFile?.some((i) => i === id);
+      if (state) {
+        //存在就是删除
+        set({
+          selectFile: selectFile?.filter((i) => i !== id),
+          selectItem: selectItem?.filter((i: { id: number }) => i.id !== id),
+        });
+      } else {
+        //否则新增
+        if (num === 1) {
+          if (state) {
+            //存在就是删除
+            set({ selectFile: selectFile?.filter((i) => i !== id), selectItem: [] });
+          } else {
+            //否则新增
+            console.log(11111);
+            set({ selectFile: [id], selectItem: [item] });
+          }
+        } else {
+          if (selectFile && num && selectFile?.length >= num) {
+            message.error(`只能选择${num}张`);
+            return;
+          }
+          let newSelectItem = selectItem || [];
+          newSelectItem.push(item);
+          set({ selectItem: newSelectItem, selectFile: [...(selectFile as number[]), id] });
         }
-        set(obj)
-        // }
-    }, [rightClickPup])
-    /**取消编辑后清空选中存放的数据并关闭弹窗*/
-    const offEditFile = useCallback(() => {
-        set({ fileVisible: false, imgVisrible: false, sortVisible: false, actionItem: '', fileName: '', selectFile: selectFile?.filter(id => id !== actionItem?.id), sort: 0 })
-    }, [selectFile, actionItem])
-    /**全选反选文件*/
-    const allFile = useCallback(() => {
-        let allArr: any[] = []
-        list?.data?.records?.forEach((item: { id: any }) => {
-            allArr.push(item.id)
-        })
-        set({ selectFile: allArr.filter((i) => selectFile?.every(id => id !== i)) })
-    }, [selectFile, list, mediaType])
-    return {
-        state,
-        init,
-        set,
-        addFile,
-        addFolder,
-        getList,
-        dels,
-        onFile,
-        changeClickFile,
-        allFile,
-        delPupOn,
-        delPupOff,
-        editFile,
-        offEditFile,
-        nameOk,
-        fileClick,
-        treeClick,
-        pathClick,
-        configSort,
-        list,
-        add,
-        get,
-        edit,
-        typeEnum,
-        get_folder_tree,
-        edit_media_folder
-    }
+      }
+      // }
+    },
+    [selectFile, mediaType, num],
+  );
+  /**开启删除弹窗 */
+  const delPupOn = useCallback((delPupId) => {
+    set({ delPupId });
+  }, []);
+  /**关闭删除弹窗并去除选中 */
+  const delPupOff = useCallback(() => {
+    set({ delPupId: '' });
+    offFile(null, { id: delPupId });
+  }, [delPupId]);
+  /**编辑 */
+  const editFile = useCallback(
+    (e?: any) => {
+      e?.stopPropagation();
+      onFile(null, rightClickPup, true, true);
+      // if (rightClickPup?.mediaType !== 'news') {//不是图文开启编辑名字弹窗
+      let obj = {
+        fileVisible: true,
+        actionItem: rightClickPup,
+        fileName: rightClickPup.title,
+        sort: rightClickPup.sort,
+      };
+      if (rightClickPup?.mediaType === 'video') {
+        obj['videoTitle'] = rightClickPup?.videoTitle || rightClickPup?.title;
+        obj['videoDescription'] = rightClickPup?.videoDescription;
+      }
+      set(obj);
+      // }
+    },
+    [rightClickPup],
+  );
+  /**取消编辑后清空选中存放的数据并关闭弹窗*/
+  const offEditFile = useCallback(() => {
+    set({
+      fileVisible: false,
+      imgVisrible: false,
+      sortVisible: false,
+      actionItem: '',
+      fileName: '',
+      selectFile: selectFile?.filter((id) => id !== actionItem?.id),
+      sort: 0,
+    });
+  }, [selectFile, actionItem]);
+  /**全选反选文件*/
+  const allFile = useCallback(() => {
+    let allArr: any[] = [];
+    list?.data?.records?.forEach((item: { id: any }) => {
+      allArr.push(item.id);
+    });
+    set({ selectFile: allArr.filter((i) => selectFile?.every((id) => id !== i)) });
+  }, [selectFile, list, mediaType]);
+  return {
+    state,
+    init,
+    set,
+    addFile,
+    addFolder,
+    getList,
+    dels,
+    onFile,
+    changeClickFile,
+    allFile,
+    delPupOn,
+    delPupOff,
+    editFile,
+    offEditFile,
+    nameOk,
+    fileClick,
+    treeClick,
+    pathClick,
+    configSort,
+    list,
+    add,
+    get,
+    edit,
+    typeEnum,
+    get_folder_tree,
+    edit_media_folder,
+  };
 }
-export default useBdMediaPup
+export default useBdMediaPup;

src/pages/launchSystemNew/components/pageModal/index.tsx

@@ -1,9 +1,137 @@
+// import Tables from "@/components/Tables"
+// import { useAjax } from "@/Hook/useAjax"
+// import { getAdqLandingPageList, putAdqLandingPage } from "@/services/launchAdq/adq"
+// import { CreateAdProps } from "@/services/launchAdq/createAd"
+// import { CheckOutlined, SyncOutlined } from "@ant-design/icons"
+// import { Button, Col, Modal, Row, Space } from "antd"
+// import React, { useEffect, useState } from "react"
+// import style from '../goodsModal/index.less'
+// import columns from "./tableConfig"
+
+
+// /**
+//  * 获取adq落地页
+//  * @returns 
+//  */
+// interface Props {
+//     visible?: boolean,
+//     onClose?: () => void,
+//     onChange?: (data: any) => void,
+//     data: any,
+// }
+// const PageModal: React.FC<Props> = (props) => {
+
+//     /*************************/
+//     const { visible, onClose, data: data1, onChange } = props
+//     const [selectAdz, setSelectAdz] = useState<number>(data1[0].accountId)   // 选择广告主
+//     const [data, setData] = useState<any>(null)
+//     const [queryForm, setQueryForm] = useState<{ accountId?: number, pageSize: number, pageNum: number }>({ pageNum: 1, pageSize: 20 })
+
+//     const putAdq = useAjax((params) => putAdqLandingPage(params))
+//     const listAjax = useAjax((params) => getAdqLandingPageList(params))
+//     /*************************/
+
+//     useEffect(() => {
+//         if (data1?.length > 0) {
+//             setQueryForm({ ...queryForm, accountId: data1.find((item: { accountId: number })=>item.accountId === selectAdz).accountId })
+//         }
+//     }, [selectAdz])
+
+//     useEffect(() => {
+//         if (queryForm?.accountId) {
+//             getList()
+//         }
+//     }, [queryForm])
+
+//     // 获取落地页列表
+//     const getList = () => {
+//         listAjax.run(queryForm)
+//     }
+
+//     const handleOk = () => {
+//         console.log('data---->', data);
+
+//         onChange && onChange(data)
+//     }
+
+//     /** 设置选中广告主 */
+//     const handleSelectAdz = ( item: any) => {
+//         if (item.accountId === selectAdz) {
+//             return
+//         }
+//         setSelectAdz(item.accountId)
+//     }
+
+//     /** 表格选折 */
+//     const onChangeTable = (selectedRowKeys: React.Key[], selectedRows: any) => {
+//         // setData([...data,selectedRows[0]])
+//     }
+
+//     /** 同步落地页 */
+//     const synPageList = () => {
+//         let ajaxs = data?.map((item: { id: number }) => putAdq.run(item.id))
+//         Promise.all(ajaxs).then(res => {
+//             listAjax.refresh()
+//         })
+//     }
+//     console.log(data,data1)
+//     return <Modal
+//         title={<Space>
+//             <span>ADQ落地页</span>
+//             <Button size="small" onClick={() => { synPageList() }} type="link" loading={putAdq?.loading}>同步落地页</Button>
+//         </Space>}
+//         visible={visible}
+//         onCancel={() => { onClose && onClose() }}
+//         onOk={handleOk}
+//         width={1200}
+//         className={style.SelectPackage}
+//         bodyStyle={{ padding: '0 10px 0 10px' }}
+//     >
+
+//         <div className={style.content}>
+//             <div className={style.left} style={{width:180}}>
+//                 <h4 className={style.title}>媒体账户</h4>
+//                 {data1?.map((item: { accountId: number,remark:string, id: number }, index: number) => (
+//                     <Row key={index} onClick={() => { handleSelectAdz(item) }} className={`${style.accItem} ${selectAdz === item.accountId && style.select} `} >
+//                         {/* {item?.accountId} */}
+//                         <Col span={21} style={{whiteSpace:'nowrap',width:'100%',overflow:'hidden',textOverflow:'ellipsis'}}>{item.remark ? item.accountId + '—' + item.remark : item.accountId}</Col>
+//                         <Col span={3}>{data?.accountId === item.accountId && <CheckOutlined style={{ color: '#1890ff' }} />}</Col>
+//                     </Row>))}
+//             </div>
+//             <div className={style.right}>
+//                 <Space style={{ marginBottom: 10 }} align="end">
+//                     <Button icon={<SyncOutlined />} type='link' loading={listAjax?.loading} onClick={() => { listAjax?.refresh() }}></Button>
+//                 </Space>
+//                 <Tables
+//                     columns={columns()}
+//                     dataSource={listAjax?.data?.records?.map((item: any) => ({ ...item, id: item.pageId }))}
+//                     size="small"
+//                     loading={listAjax?.loading}
+//                     scroll={{ y: 300 }}
+//                     bordered
+//                     defaultPageSize={100}
+//                     pageChange={(page: number, pageSize?: number) => {
+//                         setQueryForm({ ...queryForm, pageNum: page, pageSize: pageSize as number || 20 })
+//                     }}
+//                     rowSelection={{
+//                         type: 'radio',
+//                         selectedRowKeys: data1[selectAdz - 1]?.pageList?.map((item: any) => item?.id?.toString()),
+//                         onChange: onChangeTable
+//                     }}
+//                 />
+//             </div>
+//         </div>
+
+//     </Modal>
+// }
+
+// export default React.memo(PageModal)
 import Tables from "@/components/Tables"
 import { useAjax } from "@/Hook/useAjax"
 import { getAdqLandingPageList, putAdqLandingPage } from "@/services/launchAdq/adq"
-import { CreateAdProps } from "@/services/launchAdq/createAd"
 import { CheckOutlined, SyncOutlined } from "@ant-design/icons"
-import { Button, Col, Modal, Row, Space } from "antd"
+import e from "@umijs/deps/compiled/express"
+import { Button, message, Modal, Space } from "antd"
 import React, { useEffect, useState } from "react"
 import style from '../goodsModal/index.less'
 import columns from "./tableConfig"
@@ -17,14 +145,14 @@ interface Props {
     visible?: boolean,
     onClose?: () => void,
     onChange?: (data: any) => void,
-    data: any,
+    data: any
 }
 const PageModal: React.FC<Props> = (props) => {
 
     /*************************/
     const { visible, onClose, data: data1, onChange } = props
-    const [selectAdz, setSelectAdz] = useState<number>(data1[0].accountId)   // 选择广告主
-    const [data, setData] = useState<any>(null)
+    const [selectAdz, setSelectAdz] = useState<number>(1)   // 选择广告主
+    const [data, setData] = useState<any>(data1)
     const [queryForm, setQueryForm] = useState<{ accountId?: number, pageSize: number, pageNum: number }>({ pageNum: 1, pageSize: 20 })
 
     const putAdq = useAjax((params) => putAdqLandingPage(params))
@@ -32,8 +160,8 @@ const PageModal: React.FC<Props> = (props) => {
     /*************************/
 
     useEffect(() => {
-        if (data1?.length > 0) {
-            setQueryForm({ ...queryForm, accountId: data1.find((item: { accountId: number })=>item.accountId === selectAdz).accountId })
+        if (data?.length > 0) {
+            setQueryForm({ ...queryForm, accountId: data[selectAdz - 1].adAccountId })
         }
     }, [selectAdz])
 
@@ -50,21 +178,26 @@ const PageModal: React.FC<Props> = (props) => {
 
     const handleOk = () => {
         console.log('data---->', data);
-        
-        onChange && onChange(data)
+        if(data?.every((item: { pageList: any })=>item.pageList)){
+            onChange && onChange(data)
+        }else{
+            message.error('还有账号未选择落地页！')
+        }
     }
 
     /** 设置选中广告主 */
-    const handleSelectAdz = ( item: any) => {
-        if (item.accountId === selectAdz) {
+    const handleSelectAdz = (value: number, item: any) => {
+        if (value === selectAdz) {
             return
         }
-        setSelectAdz(item.accountId)
+        setSelectAdz(value)
     }
 
     /** 表格选折 */
     const onChangeTable = (selectedRowKeys: React.Key[], selectedRows: any) => {
-        setData(selectedRows[0])
+        let newData = JSON.parse(JSON.stringify(data))
+        newData[selectAdz - 1]['pageList'] = selectedRows
+        setData([...newData])
     }
 
     /** 同步落地页 */
@@ -74,7 +207,6 @@ const PageModal: React.FC<Props> = (props) => {
             listAjax.refresh()
         })
     }
-    console.log(data,data1)
     return <Modal
         title={<Space>
             <span>ADQ落地页</span>
@@ -83,20 +215,19 @@ const PageModal: React.FC<Props> = (props) => {
         visible={visible}
         onCancel={() => { onClose && onClose() }}
         onOk={handleOk}
-        width={1200}
+        width={1100}
         className={style.SelectPackage}
         bodyStyle={{ padding: '0 10px 0 10px' }}
     >
 
         <div className={style.content}>
-            <div className={style.left} style={{width:180}}>
+            <div className={style.left}>
                 <h4 className={style.title}>媒体账户</h4>
-                {data1?.map((item: { accountId: number,remark:string, id: number }, index: number) => (
-                    <Row key={index} onClick={() => { handleSelectAdz(item) }} className={`${style.accItem} ${selectAdz === item.accountId && style.select} `} >
-                        {/* {item?.accountId} */}
-                        <Col span={21} style={{whiteSpace:'nowrap',width:'100%',overflow:'hidden',textOverflow:'ellipsis'}}>{item.remark ? item.accountId + '—' + item.remark : item.accountId}</Col>
-                        <Col span={3}>{data?.accountId === item.accountId && <CheckOutlined style={{ color: '#1890ff' }} />}</Col>
-                    </Row>))}
+                {data?.map((item: { adAccountId: number, id: number }, index: number) => (
+                    <div key={index} onClick={() => { handleSelectAdz(index + 1, item) }} className={`${style.accItem} ${selectAdz === index + 1 && style.select} `}>
+                        {item?.adAccountId}
+                        {data[index].pageList?.length > 0 && <CheckOutlined style={{ color: '#1890ff' }} />}
+                    </div>))}
             </div>
             <div className={style.right}>
                 <Space style={{ marginBottom: 10 }} align="end">
@@ -115,7 +246,7 @@ const PageModal: React.FC<Props> = (props) => {
                     }}
                     rowSelection={{
                         type: 'radio',
-                        selectedRowKeys: data1[selectAdz - 1]?.pageList?.map((item: any) => item?.id?.toString()),
+                        selectedRowKeys: data[selectAdz - 1]?.pageList?.map((item: any) => item?.id?.toString()),
                         onChange: onChangeTable
                     }}
                 />

src/pages/launchSystemNew/launchManage/createAd/ad/modal/leadAd.tsx

@@ -27,7 +27,7 @@ function LeadAdModal(props: Props) {
     let [state, setState] = useState<any>({
         isShowTime: []
     })
-    let [template_checked, settemplate_checked] = useState<boolean>(localStorage.getItem('template_checked') === '1' || false)
+    let [template_checked, settemplate_checked] = useState<boolean>(dataInfo?.isTemplate || false)
     const sceneTagsList = useAjax((params) => getSceneTagsList(params))
     const [form] = Form.useForm();
     let dateType = Form.useWatch('dateType', form)
@@ -158,7 +158,6 @@ function LeadAdModal(props: Props) {
             {<Checkbox checked={template_checked} onChange={(e) => {
                 let checked = e.target.checked
                 settemplate_checked(checked)
-                localStorage.setItem('template_checked', checked ? '1' : '0')
             }}>存为模板</Checkbox>}
         </Space>}
         {...arg}

src/pages/launchSystemNew/launchManage/createAd/ad/modal/wechat.tsx

@@ -26,7 +26,7 @@ function WeChatAdModal(props: Props) {
     let [state, setState] = useState<any>({
         isShowTime: []
     })
-    let [template_checked, settemplate_checked] = useState<boolean>(localStorage.getItem('template_checked') === '1' || false)
+    let [template_checked, settemplate_checked] = useState<boolean>(dataInfo?.isTemplate || false)
     let arg = type === 'look' ? { footer: null } : {}
     const sceneTagsList = useAjax((params) => getSceneTagsList(params))
     const [form] = Form.useForm();
@@ -149,7 +149,6 @@ function WeChatAdModal(props: Props) {
         visible={visible}
         title={type === 'add' ? '新建广告' : type === 'look' ? '广告详情' : '编辑广告'}
         onCancel={() => { PupFn({ visible: false, dataInfo: null, type: 'add' }) }}
-        // onOk={ handleOk}
         width={900}
         confirmLoading={createSysAdgroup?.loading}
         footer={<Space>
@@ -158,7 +157,6 @@ function WeChatAdModal(props: Props) {
             { <Checkbox checked={template_checked} onChange={(e) => {
                 let checked = e.target.checked
                 settemplate_checked(checked)
-                localStorage.setItem('template_checked', checked ? '1' : '0')
             }}>存为模板</Checkbox>}
         </Space>}
         {...arg}
@@ -272,7 +270,7 @@ function WeChatAdModal(props: Props) {
                     <TimePicker />
                 </Form.Item>}
             </Form.Item>
-            <Form.Item label={<strong>出价方式<Tooltip title='出价方式不同将影响自定义人群，行为兴趣意向等某些功能无法使用'><ExclamationCircleOutlined style={{ color: '#e91e63', marginLeft: 5 }} /></Tooltip></strong>} name='bidMode'>
+            <Form.Item label={<strong>出价方式<Tooltip title='oCPC/oCPM出价，或开启自动扩量/智能扩量时不支持二方人群'><ExclamationCircleOutlined style={{ color: '#e91e63', marginLeft: 5 }} /></Tooltip></strong>} name='bidMode'>
                 <Radio.Group >
                     {
                         Object.keys(BidModeEnum).map(key => {

src/pages/launchSystemNew/launchManage/createAd/adcreativeCol.tsx

@@ -1,6 +1,7 @@
 import { PromotedObjectType, SiteSetEnum } from "@/services/launchAdq/enum"
 import React from "react"
 import { Image, Space } from "antd"
+import { overrideCanvasHeadOptionEnum } from "./creative/modal/config"
 
 
 export const adcreativeTemplate = [
@@ -36,7 +37,7 @@ const AdcreativeCol: React.FC<Props> = (props) => {
 
     /***************************/
     const { data } = props
-    const { adcreativeName, promotedObjectType, siteSet, adcreativeTemplateId, adcreativeElements } = data
+    const { adcreativeName, promotedObjectType, siteSet, adcreativeTemplateId, adcreativeElements, overrideCanvasHeadOption} = data
     /***************************/
 
     return <>
@@ -52,6 +53,7 @@ const AdcreativeCol: React.FC<Props> = (props) => {
                 {adcreativeElements?.imageUrlList?.map((url: string, index: number) => <Image width={50} src={url} style={{ borderRadius: 4 }} key={'TOP_SLIDER' + index} />)}
             </Space>
         </Image.PreviewGroup></div>}
+        {overrideCanvasHeadOption && <div>素材选项: <span>{overrideCanvasHeadOptionEnum[overrideCanvasHeadOption]}</span></div> }
         {adcreativeElements?.shortVideoStruct?.shortVideo1Url && <div style={{ display: 'flex', alignItems: 'flex-start' }}><span style={{ marginRight: 4 }}>创意素材:</span> <video src={adcreativeElements?.shortVideoStruct?.shortVideo1Url} width={130} controls></video></div>}
         {adcreativeElements?.videoUrl && <div style={{ display: 'flex', alignItems: 'flex-start' }}><span style={{ marginRight: 4 }}>创意素材:</span> <video src={adcreativeElements?.videoUrl} width={130} controls></video></div>}
     </>

src/pages/launchSystemNew/launchManage/createAd/creative/index.tsx

@@ -35,8 +35,8 @@ function Creative(props: Props) {
     const getInfo = useCallback((sysAdcreativeId) => {
         getSysAdcreative.run(sysAdcreativeId).then(res => {
             let arr = queryForm.taskMediaMaps || []
-            let {createTime,...params} = res
-            console.log('res=>',params)
+            let { createTime, ...params } = res
+            console.log('res=>', params)
             arr[targetKey] = { sysAdcreative: { ...params, isTemplate: false } }
             setQueryForm({ ...queryForm, sysAdcreativeId, taskMediaMaps: arr });
             setCreativeVisible(false);
@@ -48,30 +48,26 @@ function Creative(props: Props) {
     const onEdit = useCallback((targetKey: string | React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>, action: 'add' | 'remove') => {
         if (queryForm.taskMediaMaps) {
             if (action === 'add') {
-                if (page_checked) {
-                    let arr: any = queryForm.taskMediaMaps || []
-                    let adqPageArr: any = queryForm.adqPageList || []
-                    let pageArr: any = queryForm.pageList || []
-                    adqPageArr[queryForm.taskMediaMaps.length.toString()] = adqPageArr[0]
-                    pageArr[queryForm.taskMediaMaps.length.toString()] = pageArr[0]
-                    arr = [...arr, { ...arr[0], sysAdcreative: '' }]
-                    setQueryForm({ ...queryForm, taskMediaMaps: arr, pageList: pageArr, adqPageList: adqPageArr })
-                } else {
-                    setQueryForm({ ...queryForm, taskMediaMaps: [...queryForm.taskMediaMaps, { sysAdcreative: '' }] })
-                }
+                setQueryForm({ ...queryForm, taskMediaMaps: [...queryForm.taskMediaMaps, { sysAdcreative: '' }] })
                 set_targetKey(queryForm.taskMediaMaps.length.toString())
             } else {
-                let arr = queryForm.taskMediaMaps
+                let arr = queryForm.taskMediaMaps || []
+                let adqPageArr = queryForm.adqPageList || []
+                let pageArr = queryForm.pageList || []
                 if (arr.length > 1) {
                     arr = arr.filter((item, index) => index.toString() !== targetKey)
+                    adqPageArr = adqPageArr?.filter((item, index) => index.toString() !== targetKey)
+                    pageArr = pageArr?.filter((item, index) => index.toString() !== targetKey)
                 } else {
                     arr = [{}]
+                    adqPageArr = []
+                    pageArr = []
                 }
                 set_targetKey((arr.length - 1).toString())
-                setQueryForm({ ...queryForm, taskMediaMaps: arr })
+                setQueryForm({ ...queryForm, taskMediaMaps: arr, pageList: pageArr, adqPageList: adqPageArr })
             }
         }
-    }, [queryForm, page_checked])
+    }, [queryForm])
     return <Col span={12} className={style.conRightBorder}>
         <div className={style.top}>创意基本信息
             {queryForm.taskMediaMaps && queryForm.taskMediaMaps?.length > 0 && <a onClick={() => {
@@ -113,9 +109,12 @@ function Creative(props: Props) {
         {/* 创建创意 */}
         {adModalConfig.visible && <CreativePup visible={adModalConfig.visible} type={adModalConfig.type} PupFn={handleAdModalConfig} callback={(values: any) => {
             let arr = queryForm.taskMediaMaps || []
+            let adqPageArr: any = queryForm.adqPageList || []
+            let pageArr: any = queryForm.pageList || []
+            adqPageArr[targetKey as string] = null//清除adq落地页
+            pageArr[targetKey as string] = null//清除本地落地页
             arr[targetKey] = { sysAdcreative: values }
-            console.log('values===>',values)
-            setQueryForm({ ...queryForm, taskMediaMaps: arr }); setCreativeVisible(false); clearData();
+            setQueryForm({ ...queryForm, taskMediaMaps: arr, adqPageList: adqPageArr, pageList: pageArr }); setCreativeVisible(false); clearData();
             handleAdModalConfig({ visible: false, dataInfo: null, type: 'add' })
         }} dataInfo={queryForm?.taskMediaMaps && queryForm?.taskMediaMaps[targetKey]?.sysAdcreative} queryForm={queryForm} />}
     </Col>

src/pages/launchSystemNew/launchManage/createAd/creative/modal/config.ts

@@ -0,0 +1,80 @@
+/**使用外层创意素材替换原生推广页顶部素材*/
+export const overrideCanvasHeadOptionEnum = {
+  OPTION_KEEP_DIFFERENT: '自定义广告创意素材，和原生推广页顶部素材保持两者不同',
+  OPTION_CANVAS_OVERRIDE_CREATIVE: '使用原生推广页顶部素材作为外层创意素材',
+  OPTION_CREATIVE_OVERRIDE_CANVAS: '使用外层创意素材替换原生推广页顶部素材',
+};
+/**使用外层创意素材替换原生推广页顶部素材*/
+export const creativeConfig = {
+  311: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  641: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  642: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  643: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  618: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  711: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  712: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  720: {
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  721: {
+    //保持一致，替换
+    overrideCanvasHeadOption: [
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  1707: {
+    //卡片横版大图
+    overrideCanvasHeadOption: [
+      'OPTION_KEEP_DIFFERENT',
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+  1708: {
+    //卡片横版视频
+    overrideCanvasHeadOption: [
+      'OPTION_KEEP_DIFFERENT',
+      'OPTION_CANVAS_OVERRIDE_CREATIVE',
+      'OPTION_CREATIVE_OVERRIDE_CANVAS',
+    ],
+  },
+};

src/pages/launchSystemNew/launchManage/createAd/creative/modal/index.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react'
-import { Modal, Form, Input, Divider, Select, Radio, Switch, Spin, List, Checkbox, Space, Button, message, Image } from 'antd'
+import { Modal, Form, Input, Divider, Select, Radio, Switch, Spin, List, Checkbox, Space, Button, message, Image, Empty } from 'antd'
 import styles from './index.less'
 import { useAjax } from '@/Hook/useAjax'
 import { getText, get_adcreative_template, get_adcreative_template_list, get_tools_video_capture } from '@/services/launchAdq/global'
@@ -11,6 +11,7 @@ import { ModalConfig } from '../../ad';
 import { outAdcreativeTemplateIdFun } from '../../../localAd/adenum'
 import { CreateAdProps } from '@/services/launchAdq/createAd'
 import { createSysAdcreative } from '@/services/launchAdq/creative'
+import { creativeConfig, overrideCanvasHeadOptionEnum } from './config'
 interface Props {
     queryForm: Partial<CreateAdProps>,
     title?: string,
@@ -25,7 +26,7 @@ const changgui = [311, 641, 642, 643, 618, 1465, 1064, 1480, 721]
 /**创意模板*/
 function CreativePup(props: Props) {
     let { visible, confirmLoading, PupFn, callback, type, dataInfo, queryForm } = props
-    let [template_checked, settemplate_checked] = useState<boolean>(localStorage.getItem('template_checked') === '1' || false)
+    let [template_checked, settemplate_checked] = useState<boolean>(dataInfo?.isTemplate || false)
     let { promotedObjectType, sysAdgroup } = queryForm
     let { siteSet } = sysAdgroup
     const { init } = useModel('useLaunchAdq.useBdMediaPup')
@@ -164,16 +165,6 @@ function CreativePup(props: Props) {
             if (!newValues.adcreativeElements) {
                 newValues.adcreativeElements = {}
             }
-            if ((newValues?.overrideCanvasHeadOption?.length === 0 || !newValues?.overrideCanvasHeadOption) && isShowSc) {//假如不存在选择素材替换，并且当前创意形式支持，那就传入默认
-                console.log('==============================')
-                newValues.overrideCanvasHeadOption = changgui?.some(i => i === newValues.adcreativeTemplateId) ? 'OPTION_CANVAS_OVERRIDE_CREATIVE' : 'OPTION_KEEP_DIFFERENT'
-            }
-            if (newValues?.overrideCanvasHeadOption?.length === 1 && newValues?.overrideCanvasHeadOption[0] === 'OPTION_CREATIVE_OVERRIDE_CANVAS' && isShowSc) {//假如存在并手动勾选替换素材
-                newValues.overrideCanvasHeadOption = 'OPTION_CREATIVE_OVERRIDE_CANVAS'
-            }
-            if(Array.isArray(newValues?.overrideCanvasHeadOption)){//假如是数组，去除数组
-                newValues.overrideCanvasHeadOption  = newValues.overrideCanvasHeadOption[0]
-            }
             //假如不存在promotedObjectType
             if (!newValues?.promotedObjectType) {
                 newValues['promotedObjectType'] = queryForm.promotedObjectType
@@ -187,7 +178,6 @@ function CreativePup(props: Props) {
             delete newValues.adcreativeElementsType //删除创意形式
             delete newValues.dataShow //删除数据开关
             delete newValues.actionBtn //删除行动开关
-            console.log('newValues.overrideCanvasHeadOption ====>',newValues.overrideCanvasHeadOption )
             // 假如使用了落地页顶部素材替换外部素材
             if (newValues.overrideCanvasHeadOption === 'OPTION_CANVAS_OVERRIDE_CREATIVE') {
                 console.log(adcreative_template?.adcreativeElements)
@@ -268,30 +258,29 @@ function CreativePup(props: Props) {
         }
     }, [siteSet, promotedObjectType, form])
     // 获取创意形式详情
-    useEffect(() => {
-        console.log('获取创意形式详情=====>', { siteSet, promotedObjectType, adcreativeTemplateId })
+    const getTemplate = useCallback((id: any, ok?: any) => {
         // CAMPAIGN_TYPE_NORMAL
-        if (siteSet?.length > 0 && promotedObjectType && adcreativeTemplateId) {
-            if (adcreativeTemplateId) {
+        if (siteSet?.length > 0 && promotedObjectType && id) {
+            if (id) {
                 getAdcreativeTemplate.run({
                     siteSet,
                     promotedObjectType,
-                    adcreativeTemplateId
+                    adcreativeTemplateId: id
                 }).then(res => {
                     if (res?.length > 0) {
                         set_adcreative_template(res[0])
                         if (siteSet?.some((name: string) => name === 'SITE_SET_MOMENTS')) {
-                            if (res[0].unsupportSitesetDetailSpec?.length > 0) {
-                                set_isShowSc(!res[0].unsupportSitesetDetailSpec[0].siteSet?.some((name: string) => name === "SITE_SET_MOMENTS"))
-                            } else {
-                                set_isShowSc(true)
+                            let id = res[0].adcreativeTemplateId
+                            set_isShowSc(!!creativeConfig[id])//判定当前创意是否需要展示替换素材选项
+                            if (creativeConfig[id] && !ok) {//假如不等于回填元素的ID
+                                form.setFieldsValue({ overrideCanvasHeadOption: creativeConfig[id].overrideCanvasHeadOption[0] })
                             }
                         }
                     }
                 })
             }
         }
-    }, [siteSet, promotedObjectType, adcreativeTemplateId])
+    }, [siteSet, promotedObjectType])
     // 获取对应落地页按钮
     const pageTypeList = useMemo(() => {
         if (adcreativeTemplateId) {
@@ -317,14 +306,6 @@ function CreativePup(props: Props) {
         }
         return null
     }, [pageType, pageTypeList])
-    // 切换创意形式默认选中第一个
-    //   useEffect(() => {
-    //     // 设置默认选中第一个
-    //     if (adcreativeElementsType && adcreative_template_list?.length > 0 ) {
-    //         let adcreativeTemplateIdArr = adcreative_template_list?.filter(item => item.adcreativeTemplateStyle === adcreativeElementsType)
-    //         form.setFieldsValue({ adcreativeTemplateId: adcreativeTemplateIdArr[0].adcreativeTemplateId })
-    //     }
-    // }, [adcreativeElementsType, adcreative_template_list])
     const typeChange = useCallback((adcreativeElementsType) => {
         if (adcreativeElementsType && adcreative_template_list?.length > 0) {
             let adcreativeTemplateIdArr = adcreative_template_list?.filter(item => item.adcreativeTemplateStyle === adcreativeElementsType)
@@ -434,6 +415,7 @@ function CreativePup(props: Props) {
                 promotedObjectType,
                 adcreativeTemplateId,
             }
+            getTemplate(adcreativeTemplateId, true)
             if ([720, 721, 618, 1708].some(n => n === adcreativeTemplateId)) {
                 obj = { ...obj, adcreativeElementsType: '视频' }
             } else {
@@ -464,7 +446,7 @@ function CreativePup(props: Props) {
                 obj = { ...obj, videoOver: true, ...endPage }
             }
             if (overrideCanvasHeadOption) {
-                obj = { ...obj, overrideCanvasHeadOption: [overrideCanvasHeadOption] }
+                obj = { ...obj, overrideCanvasHeadOption }
             }
             if (videoUrl) {
                 setVideoMaterialConfig({
@@ -543,7 +525,6 @@ function CreativePup(props: Props) {
             {<Checkbox checked={template_checked} onChange={(e) => {
                 let checked = e.target.checked
                 settemplate_checked(checked)
-                localStorage.setItem('template_checked', checked ? '1' : '0')
             }}>存为模板</Checkbox>}
         </Space>}
         className='myModal'
@@ -556,11 +537,6 @@ function CreativePup(props: Props) {
             initialValues={
                 {
                     adcreativeElementsType: '视频',
-                    // promotedObjectType:queryForm?.promotedObjectType,
-                    // siteSet:queryForm?.sysAdgroup?.siteSet,
-                    overrideCanvasHeadOption: [],//默认'自定义广告创意素材，和原生推广页顶部素材保持两者不同，（仅支持朋友圈非常规创意形式）'
-                    // actionBtn: false,//行动按钮
-                    // dataShow: false,//数据展示
                 }
             }
         >
@@ -570,28 +546,6 @@ function CreativePup(props: Props) {
             <Form.Item label={<strong>创意名称</strong>} name='adcreativeName' rules={[{ required: true, message: '请输入广告名称!' }]}>
                 <Input placeholder='创意名称' style={{ width: 300 }} />
             </Form.Item>
-            {/* ============================================================推广目标类型============================================================= */}
-            {/* <Form.Item label={<strong>推广目标类型</strong>} name='promotedObjectType' rules={[{ required: true, message: '请选择推广告推广目标类型!' }]}>
-                <Select style={{ width: 300 }} showSearch filterOption={(input, option) =>
-                    (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
-                } allowClear>
-                    {
-                        Object.keys(PromotedObjectType).map(key => {
-                            return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
-                        })
-                    }
-                </Select>
-            </Form.Item> */}
-            {/* ============================================================投放版位============================================================= */}
-            {/* <Form.Item label={<strong>投放版位</strong>} name='siteSet' rules={[{ required: true, message: '请输入选择广告版位！' }]}>
-                <Select mode='multiple' style={{ width: 300 }} allowClear>
-                    {
-                        Object.keys(SiteSetEnum).map(key => {
-                            return <Select.Option value={key} key={key}>{SiteSetEnum[key]}</Select.Option>
-                        })
-                    }
-                </Select>
-            </Form.Item> */}
             {/* ============================================================创意形式============================================================= */}
             <Divider orientation='center'>创意形式</Divider>
             {/* ============================================================创意形式============================================================= */}
@@ -609,7 +563,10 @@ function CreativePup(props: Props) {
                 getAdcreativeTemplateList?.loading ? <Spin tip="Loading..." style={{ width: '100%' }}></Spin> :
                     <>
                         <Form.Item style={{ marginLeft: 177 }} name='adcreativeTemplateId'>
-                            <Radio.Group className={styles.adcreative_template}>
+                            <Radio.Group className={styles.adcreative_template} onChange={(e) => {
+                                let id = e.target.value
+                                getTemplate(id)
+                            }}>
                                 {
                                     adcreative_template_list?.filter(item => item.adcreativeTemplateStyle === adcreativeElementsType)?.map((item: any) => {
                                         return <Radio.Button value={item.adcreativeTemplateId} key={item.adcreativeTemplateId}>
@@ -628,7 +585,7 @@ function CreativePup(props: Props) {
                         <Divider orientation='center'>创意内容</Divider>
                         {/* ============================================================素材============================================================= */}
                         {/* 优先展示视频或图片,朋友圈常规不勾选使用外部素材替换内部，隐藏此选项，后期自动将落地页顶部素材添加进入 */}
-                        {((Array.isArray(overrideCanvasHeadOption) && overrideCanvasHeadOption[0] === 'OPTION_CREATIVE_OVERRIDE_CANVAS') || !changgui.some(i => i === adcreative_template?.adcreativeTemplateId)) && <div style={{ display: 'flex', flexFlow: 'column' }}>
+                        {((overrideCanvasHeadOption !== 'OPTION_CANVAS_OVERRIDE_CREATIVE') || siteSet.every((name: string) => name !== 'SITE_SET_MOMENTS')) && <div style={{ display: 'flex', flexFlow: 'column' }}>
                             {
                                 adcreative_template?.adcreativeElements?.filter(item => item.required && item.name === 'image_list' || item.name === 'short_video1' || item.name === 'video' || item.name === 'image').map(item => {
                                     return <Form.Item label={<strong>{item.description === '图片' && adcreative_template?.adcreativeElements?.some(item => item.name === 'video') ? '视频封面图' : item.description}</strong>} rules={[{ required: true, message: '请选择素材!' }]} key={item.name} name={item.name} style={item.description === '图片' && adcreative_template?.adcreativeElements?.some(item => item.name === 'video') ? { order: 2 } : {}}>
@@ -794,7 +751,7 @@ function CreativePup(props: Props) {
                             })
                         }
                         {/* ============================================================落地页============================================================= */}
-                        <Form.Item label={<strong>落地页</strong>} name='pageType' >
+                        {adcreativeTemplateId ? <Form.Item label={<strong>落地页</strong>} name='pageType' >
                             <Radio.Group>
                                 {
                                     pageTypeList?.map((item: any) => {
@@ -802,11 +759,18 @@ function CreativePup(props: Props) {
                                     })
                                 }
                             </Radio.Group>
-                        </Form.Item>
+                        </Form.Item> : <div style={{ minHeight: 400, display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+                            <Empty description="请先选择创意形式" />
+                        </div>}
                         {
                             pageType === 'PAGE_TYPE_CANVAS_WECHAT' && isShowSc && <Form.Item label={<strong>素材选项</strong>} name='overrideCanvasHeadOption'>
-                                {/* disabled={changgui?.some((i: any) => i == adcreative_template?.adcreativeTemplateId)} */}
-                                <Checkbox.Group options={[{ label: '使用外层创意素材替换原生推广页顶部素材', value: 'OPTION_CREATIVE_OVERRIDE_CANVAS' }]} />
+                                <Radio.Group >
+                                    {
+                                        adcreativeTemplateId && creativeConfig[adcreativeTemplateId]?.overrideCanvasHeadOption?.map((item: string | number) => {
+                                            return <Radio value={item} key={item}>{overrideCanvasHeadOptionEnum[item]}</Radio>
+                                        })
+                                    }
+                                </Radio.Group>
                             </Form.Item>
                         }
                         {/* ============================================================行动按钮============================================================= */}

src/pages/launchSystemNew/launchManage/createAd/index.tsx

@@ -283,7 +283,6 @@ const CreateAd: React.FC = () => {
                 let adcreativeElementsNew = { ...item.sysAdcreative.adcreativeElements }
                 let obj = e[0].pageSpecsList[0].pageElementsSpecList[0]
                 let { topImageSpec, topVideoSpec, topSliderSpec } = obj
-                console.log(adcreativeElementsNew)
                 Object.keys(adcreativeElementsNew).forEach(key => {
                     switch (key) {
                         case 'imageUrl'://图素材
@@ -300,9 +299,9 @@ const CreateAd: React.FC = () => {
                             break;
                     }
                 })
-                return { ...item, sysPageId: e[0]?.id, pageId: '', pageAccountId: '', sysAdcreative: { ...item.sysAdcreative, adcreativeElements: adcreativeElementsNew } }
+                return { ...item, sysPageId: e[0]?.id, accountPageIdMap: null, sysAdcreative: { ...item.sysAdcreative, adcreativeElements: adcreativeElementsNew } }
             }
-            return { ...item, sysPageId: e[0]?.id, pageId: '', pageAccountId: '', }
+            return { ...item, sysPageId: e[0]?.id, accountPageIdMap: null, }
         }
         if (page_checked) {
             console.log('queryForm.taskMediaMaps', queryForm.taskMediaMaps)
@@ -324,12 +323,10 @@ const CreateAd: React.FC = () => {
                     let data = res
                     let pageElementsSpecList = data?.pageSpecsList[0]?.pageElementsSpecList
                     let arr: any = queryForm.pageList || []
-                    if (page_checked) {
-                        arr = arr.map((item: any) => data)
-                    } else {
-                        arr[targetKey] = data
-                    }
-                    setQueryForm({ ...queryForm, pageList: arr, taskMediaMaps: arrList })//设置落地页详情数组
+                    let adqPageArr: any = queryForm.adqPageList || []
+                    adqPageArr[targetKey] = null
+                    arr[targetKey] = data
+                    setQueryForm({ ...queryForm, pageList: arr, taskMediaMaps: arrList, adqPageList: adqPageArr })//设置落地页详情数组
                     setWxButtonList(() => (pageElementsSpecList as any[])?.filter((item: { elementType: string }) => item?.elementType === 'ENTERPRISE_WX'))
                 } else {
                     //清空对应创意中的落地页ID
@@ -339,36 +336,40 @@ const CreateAd: React.FC = () => {
                 }
             })
         }
-    }, [queryForm, targetKey, page_checked])
+    }, [queryForm, targetKey])
     // 设置云端落地页
     const setAdqPage = useCallback((data) => {
-        let arr: any = queryForm.taskMediaMaps || []
-        let adqPageArr: any = queryForm.adqPageList || []
-        if (page_checked) {
-            adqPageArr = queryForm.taskMediaMaps?.map(item => data)
-            arr = queryForm.taskMediaMaps?.map(item => ({ ...item, sysPageId: '', pageId: data.pageId, pageAccountId: data.accountId }))
-        } else {
+        if (Array.isArray(data) && data.length > 0) {
+            let objMap = {}
+            data?.forEach(item => {
+                objMap[item.adAccountId] = item.pageList[0].pageId
+            })
+            let arr: any = queryForm.taskMediaMaps || []
+            let adqPageArr: any = queryForm.adqPageList || []
+            let pageArr: any = queryForm.pageList || []
             adqPageArr[targetKey as string] = data
-            arr[targetKey as string] = { ...arr[targetKey as string], sysPageId: '', pageId: data.pageId, pageAccountId: data.accountId }
+            pageArr[targetKey as string] = null
+            arr[targetKey as string] = { ...arr[targetKey as string], sysPageId: '', accountPageIdMap: objMap }
+            // 重新设置云端数据并清空本地数据
+            setQueryForm({ ...queryForm, taskMediaMaps: arr, adqPageList: adqPageArr, pageList: pageArr })
         }
-        setQueryForm({ ...queryForm, taskMediaMaps: arr, adqPageList: adqPageArr })
-
-    }, [queryForm, targetKey, page_checked])
+    }, [queryForm, targetKey])
     // tabs新增和删除
     const onEdit = useCallback((targetKey: string | React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>, action: 'add' | 'remove') => {
         if (queryForm.taskMediaMaps) {
             if (action === 'remove') {
                 let arr = queryForm.taskMediaMaps
-                let adqPageArr = queryForm.adqPageList || []
-                let pageArr = queryForm.pageList || []
-                adqPageArr[targetKey as string] = {}
-                pageArr[targetKey as string] = {}
-                arr[targetKey as string] = { ...arr[targetKey as string], pageId: '', sysPageId: '', pageAccountId: '' }
+                let adqPageArr: any = queryForm.adqPageList || []
+                let pageArr: any = queryForm.pageList || []
+                adqPageArr[targetKey as string] = null
+                pageArr[targetKey as string] = null
+                arr[targetKey as string] = { ...arr[targetKey as string], sysPageId: '', accountPageIdMap: null }
                 setQueryForm({ ...queryForm, taskMediaMaps: arr, pageList: pageArr, adqPageList: adqPageArr })
             }
         }
     }, [queryForm, targetKey])
-    console.log('queryForm====>', queryForm)
+
+    console.log(queryForm)
     return <Space direction="vertical" style={{ width: '100%' }}>
         <Card title={<div className={style.cardTitle}>配置区</div>} className={style.createAd} hoverable>
             <Space>
@@ -509,12 +510,6 @@ const CreateAd: React.FC = () => {
                                         <QuestionCircleOutlined />
                                     </Tooltip></span> */}
                                     {wxButtonList?.length > 0 && <Button type="link" size="small">配置客服</Button>}
-                                    {<Checkbox checked={page_checked} onChange={(e) => {
-                                        let checked = e.target.checked
-                                        set_page_checked(checked)
-                                    }}><span style={{ fontSize: 12, fontWeight: 400, color: '#635f5f' }}>同落地页<Tooltip title="勾选后请重新选择一次落地页,将覆盖全部创意，使用同一个落地页">
-                                        <QuestionCircleOutlined style={{ color: '#03a9f4', marginLeft: 2 }} />
-                                    </Tooltip></span></Checkbox>}
                                 </div>
                                 <div className={style.center}>
                                     <Tabs size={'small'} onEdit={onEdit} type="editable-card" activeKey={targetKey} onChange={(key) => { set_targetKey(key) }} hideAdd >
@@ -524,7 +519,7 @@ const CreateAd: React.FC = () => {
                                                     <Spin spinning={get.loading}>
                                                         <div className={style.centerContent}>
                                                             {
-                                                                item?.sysPageId || item?.pageId ? <>
+                                                                item?.sysPageId || item?.accountPageIdMap ? <>
                                                                     {
                                                                         (item?.sysPageId && queryForm?.pageList) && <>
                                                                             <div>落地页名称：{queryForm?.pageList[targetKey]?.pageName || ''}</div>
@@ -547,12 +542,14 @@ const CreateAd: React.FC = () => {
                                                                         </>
                                                                     }
                                                                     {
-                                                                        item?.pageId && queryForm?.adqPageList && <div className={style.acc} >
-                                                                            <div className={style.accName} style={{ fontWeight: 800 }}>{queryForm?.adqPageList[targetKey]?.adAccountId}</div>
-                                                                            <div className={style.accCon}>
-                                                                                <span className={style.title}>{queryForm?.adqPageList[targetKey]?.pageName}</span>
+                                                                        queryForm?.adqPageList && queryForm?.adqPageList[targetKey]?.map((adq: any) => {
+                                                                            return <div className={style.acc} key={adq.adAccountId}>
+                                                                                <div className={style.accName} style={{ fontWeight: 800 }}>{adq.adAccountId}</div>
+                                                                                <div className={style.accCon}>
+                                                                                    <span className={style.title}>{adq.pageList[0].pageName}</span>
+                                                                                </div>
                                                                             </div>
-                                                                        </div>
+                                                                        })
                                                                     }
                                                                 </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
                                                         </div>
@@ -563,13 +560,19 @@ const CreateAd: React.FC = () => {
                                     </Tabs>
                                 </div>
                                 <div className={style.bottom}>{
-                                    queryForm?.taskMediaMaps ? <>
+                                   ( queryForm?.taskMediaMaps && queryForm?.taskMediaMaps[targetKey]?.sysAdcreative) ? <>
                                         {queryForm?.taskMediaMaps && queryForm?.taskMediaMaps[targetKey]?.sysPageId && <Button type="link" onClick={() => { setLookVisible(true) }}>查看</Button>}
                                         <Button type="link" onClick={() => {
                                             setSelectImgVisible(true)
-                                            init({ mediaType: 'PAGE', cloudSize: null })
+                                            // 判定是否用原生页顶部替换外部素材
+                                            if(queryForm?.taskMediaMaps && queryForm?.taskMediaMaps[targetKey]?.sysAdcreative?.overrideCanvasHeadOption === 'OPTION_CANVAS_OVERRIDE_CREATIVE' ){
+                                                init({ mediaType: 'PAGE', cloudSize:undefined,adcreativeTemplateId:queryForm?.taskMediaMaps[targetKey]?.sysAdcreative?.adcreativeTemplateId})
+                                            }else{
+                                                init({ mediaType: 'PAGE', cloudSize:undefined})
+                                            }
+                                           
                                         }}>{queryForm?.taskMediaMaps && queryForm?.taskMediaMaps[targetKey]?.sysPageId ? '修改' : '选择落地页'}</Button>
-                                        {accountCreateLogs?.length > 0 ? <Button type="link" onClick={() => { setPageVisible(true) }}>云端落地页</Button> : <Tooltip title="请先选择媒体账户">
+                                        {accountCreateLogs?.length > 0  ?  <Button type="link" onClick={() => { setPageVisible(true) }}>云端落地页</Button> : <Tooltip title="请先选择媒体账户">
                                             <Button type="link">云端落地页</Button>
                                         </Tooltip>}
                                     </> : <Tooltip title="请先设置创意">
@@ -639,7 +642,7 @@ const CreateAd: React.FC = () => {
         {/* 选择转化ID */}
         {idVisible && <IdModal visible={idVisible} data={accountCreateLogs} onClose={() => setIdVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false); clearData() }} />}
         {/* 选择ADQ落地页 */}
-        {pageVisible && <PageModal visible={pageVisible} data={getAdAccount?.data?.data} onClose={() => setPageVisible(false)} onChange={(e) => { console.log('选择ADQ落地页', e); setAdqPage(e); setPageVisible(false); clearData() }} />}
+        {pageVisible && <PageModal visible={pageVisible} data={accountCreateLogs} onClose={() => setPageVisible(false)} onChange={(e) => { setAdqPage(e); setPageVisible(false); clearData() }} />}
         {/* 选择素材 */}
         {selectImgVisible && <SelectCloud visible={selectImgVisible} onClose={() => setSelectImgVisible(false)} onChange={setPage} isBack={false} />}
         {/* 查看落地页 */}

src/pages/launchSystemNew/launchManage/createAd/targeting/index.tsx

@@ -43,22 +43,24 @@ function TargetIng(props: Props) {
     const handleAdModalConfig = useCallback((arg: ModalConfig) => {
         setAdModalConfig({ ...adModalConfig, ...arg })
     }, [adModalConfig])
-     // 获取定向详情
-     const getInfo = useCallback((sysTargetingId) => {
-        getsysTargeting.run(sysTargetingId).then(res=>{
-            setQueryForm({ ...queryForm, sysTargetingId: sysTargetingId,sysTargeting:{...res,isTemplate:false}  });
-             setDxVisible(false);
-              clearData() 
+    // 获取定向详情
+    const getInfo = useCallback((sysTargetingId) => {
+        getsysTargeting.run(sysTargetingId).then(res => {
+            setQueryForm({ ...queryForm, sysTargetingId: sysTargetingId, sysTargeting: { ...res, isTemplate: false } });
+            setDxVisible(false);
+            clearData()
         })
     }, [queryForm])
     return <Col className={style.conRightBorder}>
         <div className={style.top}>
             定向
-            {getSysAdgroups?.data?.bidMode === 'BID_MODE_CPM' && <>{accountCreateLogs?.length > 0 && queryForm?.sysTargetingId ? <Button type="link" style={{ fontSize: 12, padding: 0 }} onClick={() => setCpVisible(true)}>选择定向包</Button> : <Tooltip title={accountCreateLogs?.length > 0 ? `请先添加定向` : `请先选择媒体账户`}>
-                <Button type="link" style={{ fontSize: 12, padding: 0 }}>选择定向包</Button>
-            </Tooltip>}</>}
+            {(queryForm.sysAdgroup?.bidMode === 'BID_MODE_CPM' || queryForm.sysAdgroup?.bidMode === 'BID_MODE_CPC') && <>{
+                accountCreateLogs?.length > 0 && queryForm?.sysTargetingId ? <Button type="link" style={{ fontSize: 12, padding: 0 }} onClick={() => setCpVisible(true)}>选择定向包</Button> : <Tooltip title={accountCreateLogs?.length > 0 ? `请先添加定向` : `请先选择媒体账户`}>
+                    <Button type="link" style={{ fontSize: 12, padding: 0 }}>选择定向包</Button>
+                </Tooltip>
+            }</>}
             {queryForm.sysTargeting && <a onClick={() => {
-                setQueryForm({ ...queryForm, sysTargeting: undefined, sysTargetingId: undefined})
+                setQueryForm({ ...queryForm, sysTargeting: undefined, sysTargetingId: undefined })
                 setAccountCreateLogs([])
             }}>清空</a>}
         </div>
@@ -122,7 +124,7 @@ function TargetIng(props: Props) {
         <div className={style.bottom}>
             <Space size={20}>
                 <span onClick={() => { setDxVisible(true) }}>{queryForm?.sysTargeting ? '重选定向' : '选择定向'}</span>
-                <span onClick={() => {handleAdModalConfig(queryForm?.sysTargeting ? { visible: true,type: 'edit' }:{ visible: true ,type: 'add'}) }}>{queryForm?.sysTargeting ? '编辑定向' : '新建定向'}</span>
+                <span onClick={() => { handleAdModalConfig(queryForm?.sysTargeting ? { visible: true, type: 'edit' } : { visible: true, type: 'add' }) }}>{queryForm?.sysTargeting ? '编辑定向' : '新建定向'}</span>
             </Space>
         </div>
         {/* 选择定向 */}
@@ -132,7 +134,7 @@ function TargetIng(props: Props) {
         {/* 新建定向包 */}
         {adModalConfig.visible && <TargetingPup visible={adModalConfig.visible} PupFn={handleAdModalConfig} callback={(values: any) => {
             setQueryForm({ ...queryForm, sysTargeting: values, }); setDxVisible(false); clearData();
-            handleAdModalConfig({ visible: false, dataInfo: null, type: 'add' }) 
+            handleAdModalConfig({ visible: false, dataInfo: null, type: 'add' })
         }} type={adModalConfig.type} dataInfo={queryForm.sysTargeting} />}
     </Col>
 }

src/pages/launchSystemNew/launchManage/createAd/targeting/modal/index.tsx

@@ -24,7 +24,7 @@ const android_os = Object.keys(UserOsEnum).filter(key => key.includes('ANDROID')
 /**定向弹窗弹窗*/
 function TargetingPup(props: Props) {
     let { visible, PupFn, callback, type, dataInfo } = props
-    let [template_checked, settemplate_checked] = useState<boolean>(localStorage.getItem('template_checked') === '1' || false)
+    let [template_checked, settemplate_checked] = useState<boolean>(dataInfo?.isTemplate || false)
     const create = useAjax((params) => createsysTargeting(params))
     let arg = type === 'look' ? { footer: null } : {}
     const tagsList_REGION = useAjax((params) => getTagsList(params))
@@ -325,7 +325,6 @@ function TargetingPup(props: Props) {
             {<Checkbox checked={template_checked} onChange={(e) => {
                 let checked = e.target.checked
                 settemplate_checked(checked)
-                localStorage.setItem('template_checked', checked ? '1' : '0')
             }}>存为模板</Checkbox>}
         </Space>}
         confirmLoading={create?.loading || tagsList_REGION?.loading || tagsList_MODEL?.loading}

src/services/launchAdq/material.ts

@@ -106,6 +106,7 @@ export async function bdSysMediaList(params: { parentId?: any, belongUser: boole
       data: param,
     });
   } else {
+    console.log('param===>',param)
     return request(api + `/adq/sysWechatComponentPage/list/${belongUser}`, {
       method: 'POST',
       data: param,