<Form.Item label='订阅服务说明' name='payMassage'>
<Input.TextArea
disabled={disabled}
placeholder='最多输入46个字符'
maxLength={46}
style={{ color: '#262626' }}
/>
</Form.Item>
<Row>
<Col span={12}>
<Form.Item
label='是否为一次性收费'
labelCol={{ span: 12 }}
name='type'
rules={[{ required: true, message: '请选择' }]}>
<Radio.Group disabled={disabled}>
<Radio value={1}>是</Radio>
<Radio value={0}>否</Radio>
</Radio.Group>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label={
<span>
收费是否与人数相关
<Tooltip title='页面卡片有且只有一个默认选中'>
<QuestionCircleOutlined />
</Tooltip>
</span>
}
name='isDefault'
labelCol={{ span: 12 }}
rules={[{ required: true, message: '请选择' }]}>
<Radio.Group disabled={disabled}>
<Radio value={0}>是</Radio>
<Radio value={1}>否</Radio>
</Radio.Group>
</Form.Item>
</Col>
</Row>
<Form.Item>
{productUpdateList.length > 1 &&
productUpdateList.map(item => {
console.log(item, 'item')
return (
<Row style={{ marginTop: '12px' }} align='baseline' key={item.key}>
<Col
span={23}
style={{ background: 'rgba(246, 250, 255, 0.39)' }}>
<Row>
<Col span={12}>
<Form.Item
{...item}
labelCol={{ span: 9 }}
label='产品标签'
name={[item.productName, 'productName']}
rules={[
{
required: true,
message: '建议输入2-10个字符'
}
]}>
<Input
disabled={disabled}
placeholder='建议输入2-10个字符'
onChange={this.changeProductName}
value={item.productName}
ref={this.itemProductName}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
{...item}
labelCol={{ span: 10 }}
label='小字描述'
name={[item.productDescribe, 'productDescribe']}
rules={[
{
required: true,
message: '最多输入8个字符'
}
]}>
<Input
disabled={disabled}
placeholder='最多输入8个字符'
onChange={this.changeProductDescribe}
value={item.productDescribe}
ref={this.itemProductDescribe}
/>
</Form.Item>
</Col>
</Row>
<Row>
<Col span={12}>
<Form.Item
{...item}
labelCol={{ span: 7 }}
label='定价'
name={[item.price, 'price']}
rules={[
{
required: true,
pattern: new RegExp(
/^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/
),
message: '最多保留两位小数'
}
]}>
<InputNumber
min={0}
placeholder='最多保留两位小数'
disabled={disabled}
style={{ width: '86%' }}
onChange={this.changePrice}
value={item.price}
ref={this.itemPrice}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
{...item}
labelCol={{ span: 8 }}
label='时长'
name={[item.duration, 'duration']}
rules={[
{
required: false,
pattern: new RegExp(/^[+]{0,1}(\d+)$/),
message: '必须为整数'
}
]}>
<Input
disabled={disabled}
placeholder='必须为整数'
addonAfter='月'
onChange={this.changeDuration}
value={item.duration}
ref={this.itemDuration}
/>
</Form.Item>
</Col>
</Row>
<Form.Item
{...item}
label={
<span>
是否默认选中
<Tooltip title='页面卡片有且只有一个默认选中'>
<QuestionCircleOutlined />
</Tooltip>
</span>
}
name={[item.isDefault, 'isDefault']}
labelCol={{ span: 6 }}>
<Radio.Group
disabled={disabled}
onChange={this.changeIsDefault}
value={item.isDefault}
ref={this.itemIsDefault}>
<Radio value={1}>是</Radio>
<Radio value={0}>否</Radio>
</Radio.Group>
</Form.Item>
</Col>
{/* <Col
span={1}
style={{
margin: '0 auto',
position: 'relative',
textAlign: 'center'
}}>
{productUpdateList.length > 1 ? (
<MinusCircleOutlined
className='dynamic-delete-button'
style={{
position: 'absolute',
top: ' 50%',
transform: 'translateY(-50%)'
}}
disabled={disabled}
onClick={() => {
remove(item.id)
}}
/>
) : null}
</Col> */}
</Row>
)
})}
</Form.Item>
<Form.List name='productSaveList'>
{(fields, { add, remove }) => (
<>
{fields.map(field => (
<Row style={{ marginTop: '12px' }} align='baseline' key={field.key}>
<Col
span={23}
style={{ background: 'rgba(246, 250, 255, 0.39)' }}>
<Row>
<Col span={12}>
<Form.Item
{...field}
labelCol={{ span: 9 }}
label='产品标签'
name={[field.name, 'productName']}
rules={[
{
required: true,
message: '建议输入2-10个字符'
}
]}>
<Input
disabled={disabled}
placeholder='建议输入2-10个字符'
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
{...field}
labelCol={{ span: 10 }}
label='小字描述'
name={[field.name, 'productDescribe']}
rules={[
{
required: true,
message: '最多输入8个字符'
}
]}>
<Input
disabled={disabled}
placeholder='最多输入8个字符'
/>
</Form.Item>
</Col>
</Row>
<Row>
<Col span={12}>
<Form.Item
{...field}
labelCol={{ span: 7 }}
label='定价'
name={[field.name, 'price']}
rules={[
{
required: true,
pattern: new RegExp(
/^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/
),
message: '最多保留两位小数'
}
]}>
<InputNumber
min={0}
placeholder='最多保留两位小数'
disabled={disabled}
style={{ width: '86%' }}
/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
{...field}
labelCol={{ span: 8 }}
label='时长'
name={[field.name, 'duration']}
rules={[
{
required: false,
pattern: new RegExp(/^[+]{0,1}(\d+)$/),
message: '必须为整数'
}
]}>
<Input
disabled={disabled}
placeholder='必须为整数'
addonAfter='月'
/>
</Form.Item>
</Col>
</Row>
<Form.Item
{...field}
label={
<span>
是否默认选中
<Tooltip title='页面卡片有且只有一个默认选中'>
<QuestionCircleOutlined />
</Tooltip>
</span>
}
name={[field.name, 'isDefault']}
labelCol={{ span: 6 }}>
<Radio.Group disabled={disabled}>
<Radio value={1}>是</Radio>
<Radio value={0}>否</Radio>
</Radio.Group>
</Form.Item>
</Col>
<Col
span={1}
style={{
margin: '0 auto',
position: 'relative',
textAlign: 'center'
}}>
{fields.length > 1 ? (
<MinusCircleOutlined
className='dynamic-delete-button'
style={{
position: 'absolute',
top: ' 50%',
transform: 'translateY(-50%)'
}}
disabled={disabled}
onClick={() => {
remove(field.name)
}}
/>
) : null}
</Col>
</Row>
))}
<Form.Item style={{ margin: ' 16px auto', textAlign: 'center' }}>
<Button
onClick={() => add()}
type='dashed'
style={{ width: '30%', margin: '0 auto' }}
icon={<PlusOutlined />}>
新增产品信息
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form>
