fix

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

@@ -6,7 +6,7 @@ import { PlusOutlined } from "@ant-design/icons"
 import { Button, Divider, Form, Input, message, Modal, Select, Space } from "antd"
 import React, { useEffect, useState } from "react"
 import { useModel } from "umi"
-import columns from "./tableConfig"
+import { brandColumns } from "./tableConfig"
 
 interface Props {
     onChange?: (data: any) => void,
@@ -116,7 +116,7 @@ const BrandImage: React.FC<Props> = (props) => {
             <Space direction='vertical' style={{ width: '100%' }}>
                 <Button type="primary" icon={<PlusOutlined />} onClick={() => { setAddVisible(true); setInitialValues({}) }}>上传品牌形象</Button>
                 <Tables
-                    columns={columns(del, edit)}
+                    columns={brandColumns(del, edit)}
                     dataSource={getSysBrand?.data}
                     size="small"
                     loading={getSysBrand?.loading}
@@ -154,7 +154,7 @@ interface ImageProps {
  * 处理选择图片Form
  * @returns 
  */
-const UploadImage: React.FC<ImageProps> = (props) => {
+export const UploadImage: React.FC<ImageProps> = (props) => {
 
     /*********************/
     const { onChange, value } = props

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

@@ -0,0 +1,150 @@
+import Tables from "@/components/Tables"
+import { useAjax } from "@/Hook/useAjax"
+import { addSysProfileApi, delSysProfileApi, editSysProfileApi, getSysProfileApi } from "@/services/launchAdq/global"
+import { PlusOutlined } from "@ant-design/icons"
+import { Button, Divider, Form, Input, message, Modal, Select, Space } from "antd"
+import React, { useEffect, useState } from "react"
+import { UploadImage } from "./brandImage"
+import { profileColumns } from "./tableConfig"
+
+interface Props {
+    onChange?: (data: any) => void,
+    value?: any
+}
+
+/**
+ * 头像及昵称跳转页
+ * @returns 
+ */
+const HeadNickJump: React.FC<Props> = (props) => {
+
+    /****************************/
+    const { onChange, value } = props
+
+    const [visible, setVisible] = useState<boolean>(false)
+    const [addVisible, setAddVisible] = useState<boolean>(false)
+    const [form] = Form.useForm()
+    const [initialValues, setInitialValues] = useState<any>({})
+
+    const getSysProfile = useAjax(() => getSysProfileApi())
+    const addSysProfile = useAjax((params) => addSysProfileApi(params))
+    const editSysProfile = useAjax((params) => editSysProfileApi(params))
+    const delSysProfile = useAjax((params) => delSysProfileApi(params))
+    /****************************/
+
+    // 获取列表
+    useEffect(() => {
+        getSysProfile.run()
+    }, [])
+
+
+    // 新增修改
+    const handleOk = async () => {
+        form.submit()
+        let data = await form.validateFields()
+        if (Object.keys(initialValues).length > 0) { // 修改
+            editSysProfile.run({ ...data, sysProfileId: initialValues.id }).then(res => {
+                if (res) {
+                    message.success('修改成功')
+                    setAddVisible(false)
+                    getSysProfile.refresh()
+                }
+            })
+        } else { // 新增
+            addSysProfile.run(data).then(res => {
+                if (res) {
+                    message.success('新增成功')
+                    setAddVisible(false)
+                    getSysProfile.refresh()
+                }
+            })
+        }
+        setInitialValues({})
+        form.resetFields()
+    }
+
+    /** 删除 */
+    const del = (id: number) => {
+        delSysProfile.run({ sysProfileId: id }).then(res => {
+            if (res) {
+                message.success('删除成功')
+                getSysProfile.refresh()
+            }
+        })
+    }
+
+    /** 修改 */
+    const edit = (data: any) => {
+        setInitialValues(data)
+        setAddVisible(true)
+    }
+
+    return <div>
+        <Select
+            showSearch
+            placeholder="请选择一个品牌跳转页，与广告创意一起展示"
+            optionFilterProp="children"
+            style={{ width: 400 }}
+            onChange={(e) => { onChange && onChange(e) }}
+            allowClear
+            value={value}
+            filterOption={(input, option) => {
+                return (option!.value as unknown as string).toLowerCase().includes(input.toLowerCase())
+            }}
+            dropdownRender={menu => <>
+                {menu}
+                <Divider style={{ margin: '8px 0' }} />
+                <div>
+                    <Button type="link" onClick={() => { setAddVisible(true); setInitialValues({}) }}>新增</Button>
+                    <Button type="link" onClick={() => setVisible(true)}>前往管理</Button>
+                </div>
+            </>}
+        >
+            {
+                getSysProfile?.data?.map((item: any) => {
+                    return <Select.Option value={item.profileName + '_' + item.headImageUrl + '_' + item.description} key={item.id}>
+                        <Space>
+                            <img src={item.headImageUrl} style={{ width: 20 }} />
+                            <span>{item.profileName}</span>
+                        </Space>
+                    </Select.Option>
+                })
+            }
+        </Select>
+
+        {visible && <Modal title="头像及昵称跳转页" width={1000} visible={visible} footer={null} onCancel={() => setVisible(false)}>
+            <Space direction='vertical' style={{ width: '100%' }}>
+                <Button type="primary" icon={<PlusOutlined />} onClick={() => { setAddVisible(true); setInitialValues({}) }}>上传品牌形象</Button>
+                <Tables
+                    columns={profileColumns(del, edit)}
+                    dataSource={getSysProfile?.data}
+                    size="small"
+                    loading={getSysProfile?.loading}
+                    scroll={{ y: 300 }}
+                    bordered
+                />
+            </Space>
+        </Modal>}
+        {addVisible && <Modal title={`${Object.keys(initialValues).length > 0 ? '修改' : '上传'}头像及昵称跳转页`} visible={addVisible} confirmLoading={addSysProfile.loading || editSysProfile.loading} onOk={handleOk} onCancel={() => setAddVisible(false)}>
+            <Form
+                name="basic"
+                form={form}
+                layout='vertical'
+                autoComplete="off"
+                initialValues={{ ...initialValues }}
+            >
+                <Form.Item label={<strong>头像</strong>} name="headImageUrl" rules={[{ required: true, message: '请选择头像!' }]}>
+                    <UploadImage />
+                </Form.Item>
+                <Form.Item label={<strong>名称</strong>} name="profileName" rules={[{ required: true, message: '请输入名称!' }]}>
+                    <Input placeholder="请输入名称" maxLength={12} />
+                </Form.Item>
+                <Form.Item label={<strong>详细描述</strong>} name="description" rules={[{ required: true, message: '请输入详细描述!' }]}>
+                    <Input.TextArea placeholder="请输入详细描述" maxLength={120} />
+                </Form.Item>
+            </Form>
+        </Modal>}
+    </div>
+}
+
+export default React.memo(HeadNickJump)

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

@@ -13,6 +13,7 @@ import { CreateAdProps } from '@/services/launchAdq/createAd'
 import { createSysAdcreative } from '@/services/launchAdq/creative'
 import { creativeConfig, overrideCanvasHeadOptionEnum } from './config'
 import BrandImage from './brandImage'
+import HeadNickJump from './headNickJump'
 interface Props {
     queryForm: Partial<CreateAdProps>,
     title?: string,
@@ -643,6 +644,10 @@ function CreativePup(props: Props) {
                         </Form.Item>
                         {/* ============================================================创意内容============================================================= */}
                         <Divider orientation='center'>创意内容</Divider>
+                        {/* =============================================================头像及昵称跳转页===================================================================== */}
+                        {queryForm.promotedObjectType === 'PROMOTED_OBJECT_TYPE_LEAD_AD' && <Form.Item label={<strong>头像及昵称跳转页</strong>} name='brand' rules={[{ required: true, message: '请选择一个头像及昵称跳转页，与广告创意一起展示' }]}>
+                            <HeadNickJump />
+                        </Form.Item>}
                         {/* =============================================================品牌形象===================================================================== */}
                         {queryForm.promotedObjectType === 'PROMOTED_OBJECT_TYPE_LEAD_AD' && <Form.Item label={<strong>品牌形象</strong>} name='brand' rules={[{ required: true, message: '请选择一个头像及昵称跳转页，与广告创意一起展示' }]}>
                             <BrandImage />

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

@@ -1,7 +1,7 @@
 import React from "react"
 import { Image, Popconfirm, Space } from 'antd'
 
-let columns = (del: (id: number) => void, edit: (data: any) => void) => {
+let brandColumns = (del: (id: number) => void, edit: (data: any) => void) => {
 
 
     let data: any[] = [
@@ -69,4 +69,84 @@ let columns = (del: (id: number) => void, edit: (data: any) => void) => {
     return data
 }
 
-export default columns
+let profileColumns = (del: (id: number) => void, edit: (data: any) => void) => {
+
+
+    let data: any[] = [
+        {
+            title: '操作',
+            dataIndex: 'cz',
+            key: 'cz',
+            align: 'center',
+            width: 100,
+            render: (a: any, b: any) => {
+                return <Space>
+                    <a onClick={() => edit(b)}>修改</a>
+                    <Popconfirm
+                        title="确定删除?"
+                        onConfirm={() => del(b.id)}
+                        okText="是"
+                        cancelText="否"
+                    >
+                        <a style={{ color: 'red' }}>删除</a>
+                    </Popconfirm>
+                </Space>
+            }
+        },
+        {
+            title: 'ID',
+            dataIndex: 'id',
+            key: 'id',
+            width: 60,
+            align: 'center',
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{a}</span>
+            }
+        },
+        {
+            title: '头像预览图',
+            dataIndex: 'headImageUrl',
+            key: 'headImageUrl',
+            width: 120,
+            ellipsis: true,
+            align: 'center',
+            render: (a: any, b: any) => {
+                return <Image width={40} style={{ borderRadius: 4 }} src={a} />
+            }
+        },
+        {
+            title: '头像名称',
+            dataIndex: 'profileName',
+            key: 'profileName',
+            align: 'center',
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{a}</span>
+            }
+        },
+        {
+            title: '详细描述',
+            dataIndex: 'description',
+            key: 'description',
+            align: 'center',
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{a}</span>
+            }
+        },
+        {
+            title: '创建时间',
+            dataIndex: 'createTime',
+            key: 'createTime',
+            align: 'center',
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{a}</span>
+            }
+        }
+    ]
+
+    return data
+}
+
+export {
+    brandColumns,
+    profileColumns
+}

src/services/launchAdq/global.ts

@@ -117,4 +117,52 @@ export async function delSysBrandApi(data: { sysBrandId: number }) {
     return request(api + `/adq/sysBrand/${sysBrandId}`, {
         method: 'DELETE'
     })
+}
+
+
+/**
+ * 获取头像及昵称跳转页
+ * @returns
+ */
+export async function getSysProfileApi() {
+    return request(api + `/adq/sysProfile/allOfUser`, {
+        method: 'GET'
+    })
+}
+
+/**
+ * 新增头像及昵称跳转页
+ * @param data 
+ * @returns 
+ */
+ export async function addSysProfileApi(data: { name: string, brandImgUrl: string }) {
+    return request(api + `/adq/sysProfile`, {
+        method: 'POST',
+        data
+    })
+}
+
+/**
+ * 修改头像及昵称跳转页
+ * @param data 
+ * @returns 
+ */
+export async function editSysProfileApi(data: { name: string, brandImgUrl: string, sysProfileId: number }) {
+    const { sysProfileId, ...params } = data
+    return request(api + `/adq/sysProfile/${sysProfileId}`, {
+        method: 'PUT',
+        data: params
+    })
+}
+
+/**
+ * 删除头像及昵称跳转页
+ * @param data 
+ * @returns 
+ */
+ export async function delSysProfileApi(data: { sysProfileId: number }) {
+    const { sysProfileId } = data
+    return request(api + `/adq/sysProfile/${sysProfileId}`, {
+        method: 'DELETE'
+    })
 }