|
@@ -1,11 +1,13 @@
|
|
|
+import New1Radio from "@/pages/launchSystemV3/components/New1Radio"
|
|
|
import TextAideInput from "@/pages/launchSystemV3/components/TextAideInput"
|
|
|
import { txtLength } from "@/utils/utils"
|
|
|
import { Button, Card, Form, Modal, Space, message } from "antd"
|
|
|
-import React, { useEffect } from "react"
|
|
|
+import React, { useEffect, useState } from "react"
|
|
|
|
|
|
|
|
|
interface Props {
|
|
|
- textData: any
|
|
|
+ textData: any,
|
|
|
+ dynamicMaterialDTos: any,
|
|
|
value?: any,
|
|
|
visible?: boolean
|
|
|
onClose?: () => void
|
|
@@ -17,27 +19,55 @@ interface Props {
|
|
|
* @param param0
|
|
|
* @returns
|
|
|
*/
|
|
|
-const NewText: React.FC<Props> = ({ visible, onClose, onChange, value, textData }) => {
|
|
|
+const NewText: React.FC<Props> = ({ visible, onClose, onChange, value, textData, dynamicMaterialDTos }) => {
|
|
|
|
|
|
/*************************************/
|
|
|
const [form] = Form.useForm();
|
|
|
+ const type = Form.useWatch('type', form)
|
|
|
+ const textDto = Form.useWatch('textDto', form)
|
|
|
+
|
|
|
+ const [textList, setTextList] = useState<PULLIN.TextDtoProps[]>([])
|
|
|
/*************************************/
|
|
|
|
|
|
const handleOk = (values: any) => {
|
|
|
console.log(values)
|
|
|
+ const { type, textDto } = values
|
|
|
onChange?.({
|
|
|
- type: 0,
|
|
|
- dynamicCreativesTextDetailDTOList: [values]
|
|
|
+ type,
|
|
|
+ dynamicCreativesTextDetailDTOList: textDto.map((item: any) => {
|
|
|
+ let data: any = {}
|
|
|
+ Object.keys(item).forEach(key => {
|
|
|
+ data[key] = [item[key]]
|
|
|
+ })
|
|
|
+ return data
|
|
|
+ })
|
|
|
})
|
|
|
}
|
|
|
|
|
|
useEffect(() => {
|
|
|
- if (value?.dynamicCreativesTextDetailDTOList) {
|
|
|
- console.log('value?.dynamicCreativesTextDTOS?.dynamicCreativesTextDetailDTOList[0]', value?.dynamicCreativesTextDetailDTOList[0])
|
|
|
- form.setFieldsValue(value?.dynamicCreativesTextDetailDTOList[0])
|
|
|
+ console.log('创意文案--->', value)
|
|
|
+ if (value && Object.keys(value).length) {
|
|
|
+ const { type, dynamicCreativesTextDetailDTOList } = value
|
|
|
+ form.setFieldsValue({ type, textDto: dynamicCreativesTextDetailDTOList.map((item: any) => {
|
|
|
+ let data: any = {}
|
|
|
+ Object.keys(item).forEach(key => {
|
|
|
+ data[key] = item[key]?.[0]
|
|
|
+ })
|
|
|
+ return data
|
|
|
+ }) })
|
|
|
}
|
|
|
}, [value])
|
|
|
|
|
|
+ useEffect(() => {
|
|
|
+ if (textData && Object.keys(textData)) {
|
|
|
+ let data = Object.values(textData).map((item: any) => {
|
|
|
+ let content = item.children.content
|
|
|
+ return { label: content.description, restriction: content.restriction, value: item.name, required: item.required }
|
|
|
+ })
|
|
|
+ setTextList(data)
|
|
|
+ }
|
|
|
+ }, [textData])
|
|
|
+
|
|
|
return <Modal
|
|
|
title={<strong style={{ fontSize: 20 }}>创意文案</strong>}
|
|
|
visible={visible}
|
|
@@ -62,34 +92,67 @@ const NewText: React.FC<Props> = ({ visible, onClose, onChange, value, textData
|
|
|
onFinishFailed={({ errorFields }) => {
|
|
|
message.error(errorFields?.[0]?.errors?.[0])
|
|
|
}}
|
|
|
+ initialValues={{
|
|
|
+ type: 0,
|
|
|
+ textDto: [{}]
|
|
|
+ }}
|
|
|
onFinish={handleOk}
|
|
|
>
|
|
|
<Card className="cardResetCss" style={{ marginTop: 10 }}>
|
|
|
- {Object.keys(textData).map(key => {
|
|
|
- let item = textData[key]
|
|
|
- let content = item.children.content
|
|
|
-
|
|
|
- return <Form.Item
|
|
|
- label={<strong>{content.description}</strong>}
|
|
|
- name={item.name}
|
|
|
- key={key}
|
|
|
- rules={[{
|
|
|
- required: item.required, message: '请输入正确的' + content.description, validator: (rule, value) => {
|
|
|
- if (!value) {
|
|
|
- return Promise.reject()
|
|
|
- } else if (!value.match(RegExp(content.restriction.textRestriction.textPattern))) {
|
|
|
- return Promise.reject()
|
|
|
- } else if (txtLength(value) > content.restriction.textRestriction.maxLength) {
|
|
|
- return Promise.reject()
|
|
|
- }
|
|
|
- return Promise.resolve()
|
|
|
+ <Form.Item name="type" label={<strong>文案分配规则</strong>} style={{ marginBottom: 0 }} rules={[{ required: true, message: '请选择营销目的!' }]}>
|
|
|
+ <New1Radio
|
|
|
+ data={[{ label: '全部相同', value: 0 }, { label: '按创意顺序分配', value: 1 }]}
|
|
|
+ onChange={(value) => {
|
|
|
+ if (value === 0) {
|
|
|
+ form.setFieldsValue({ textDto: [textDto[0] || {}] })
|
|
|
+ } else if (value === 1) {
|
|
|
+ let oldtextDto: PULLIN.TextDtoProps[] = JSON.parse(JSON.stringify(textDto))
|
|
|
+ oldtextDto = oldtextDto.concat(Array(dynamicMaterialDTos.dynamicGroup.length - oldtextDto.length).fill({}))
|
|
|
+ form.setFieldsValue({ textDto: oldtextDto })
|
|
|
}
|
|
|
- }]}
|
|
|
- >
|
|
|
- <TextAideInput placeholder={'请输入' + content.description} style={{ width: 450 }} maxTextLength={content.restriction.textRestriction.maxLength} />
|
|
|
- </Form.Item>
|
|
|
- })}
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </Form.Item>
|
|
|
</Card>
|
|
|
+
|
|
|
+ <Form.List name="textDto">
|
|
|
+ {(fields) => (<>
|
|
|
+ {fields.map(({ key, name, ...restField }, num) => (
|
|
|
+ <Card
|
|
|
+ title={type === 1 ? <strong style={{ fontSize: 14 }}>创意组{num + 1}</strong> : null}
|
|
|
+ className="cardResetCss"
|
|
|
+ style={{ marginTop: 10 }}
|
|
|
+ key={key}
|
|
|
+ >
|
|
|
+ <Space style={{ width: '100%' }} direction="vertical" size={10}>
|
|
|
+ {textList.map(item => {
|
|
|
+ return <Form.Item
|
|
|
+ {...restField}
|
|
|
+ label={<strong>{item.label}</strong>}
|
|
|
+ name={[name, item.value]}
|
|
|
+ key={key}
|
|
|
+ style={{ marginBottom: 0 }}
|
|
|
+ rules={[{
|
|
|
+ required: item.required, message: '请输入正确的' + item.label, validator: (rule, value) => {
|
|
|
+ if (!value) {
|
|
|
+ return Promise.reject()
|
|
|
+ } else if (!value.match(RegExp(item.restriction.textRestriction.textPattern))) {
|
|
|
+ return Promise.reject()
|
|
|
+ } else if (txtLength(value) > item.restriction.textRestriction.maxLength) {
|
|
|
+ return Promise.reject()
|
|
|
+ }
|
|
|
+ return Promise.resolve()
|
|
|
+ }
|
|
|
+ }]}
|
|
|
+ >
|
|
|
+ <TextAideInput placeholder={'请输入' + item.label} style={{ width: 450 }} maxTextLength={item.restriction.textRestriction.maxLength} />
|
|
|
+ </Form.Item>
|
|
|
+ })}
|
|
|
+ </Space>
|
|
|
+ </Card>
|
|
|
+ ))}
|
|
|
+ </>)}
|
|
|
+ </Form.List>
|
|
|
<Form.Item className="submit_pull">
|
|
|
<Space>
|
|
|
<Button onClick={onClose}>取消</Button>
|