From 137fb8ea6af2789b3238b22bac31d80bced41dfe Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 28 七月 2021 11:39:39 +0800
Subject: [PATCH] 2021-07-28
---
src/templates/modalconfig/settingform/index.jsx | 90 ++++++++++++++++++++++++++++++++++++---------
1 files changed, 72 insertions(+), 18 deletions(-)
diff --git a/src/templates/modalconfig/settingform/index.jsx b/src/templates/modalconfig/settingform/index.jsx
index 14517aa..a4ff109 100644
--- a/src/templates/modalconfig/settingform/index.jsx
+++ b/src/templates/modalconfig/settingform/index.jsx
@@ -1,7 +1,8 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import { Form, Row, Col, Input, Radio, InputNumber, Select } from 'antd'
+import { Form, Row, Col, Input, Radio, InputNumber, Select, Tooltip, Icon } from 'antd'
import { formRule } from '@/utils/option.js'
+import StyleInput from '@/menu/stylecontroller/styleInput'
import './index.scss'
class SettingForm extends Component {
@@ -14,11 +15,13 @@
state = {
fields: null,
+ display: this.props.config.setting.display,
appType: sessionStorage.getItem('appType')
}
UNSAFE_componentWillMount () {
const { config } = this.props
+ const { appType, display } = this.state
let fields = []
config.fields.forEach(f => {
@@ -27,8 +30,14 @@
}
})
+ let _display = display
+ if (appType === 'mob' && display !== 'prompt' && display !== 'drawer') {
+ _display = 'drawer'
+ }
+
this.setState({
- fields: fields
+ fields: fields,
+ display: _display
})
}
@@ -56,7 +65,7 @@
render() {
const { config, dict } = this.props
- const { fields, appType } = this.state
+ const { fields, appType, display } = this.state
const { getFieldDecorator } = this.props.form
const formItemLayout = {
@@ -86,13 +95,25 @@
})(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)}
</Form.Item>
</Col>
- <Col span={12}>
- <Form.Item label="瀹藉害">
+ {appType !== 'mob' ? <Col span={12}>
+ <Form.Item label="瀹藉害锛�%锛�">
{getFieldDecorator('width', {
initialValue: config.setting.width
- })(<InputNumber min={10} max={90} precision={0} />)}
+ })(<InputNumber min={10} max={90} precision={0} onPressEnter={this.handleSubmit}/>)}
</Form.Item>
- </Col>
+ </Col> : null}
+ {appType === 'mob' ? <Col span={12}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="瀹藉害灏忎簬100鏃朵负鐧惧垎鐜囷紝澶т簬100鏃朵负缁濆鍊笺��">
+ <Icon type="question-circle" />
+ 瀹藉害
+ </Tooltip>
+ }>
+ {getFieldDecorator('width', {
+ initialValue: config.setting.width
+ })(<InputNumber min={10} max={2000} precision={0} onPressEnter={this.handleSubmit}/>)}
+ </Form.Item>
+ </Col> : null}
<Col span={12}>
<Form.Item label="鐒︾偣">
{getFieldDecorator('focus', {
@@ -114,7 +135,7 @@
)}
</Form.Item>
</Col>
- <Col span={12}>
+ {appType !== 'mob' ? <Col span={12}>
<Form.Item label="琛ㄥ崟鎺掑垪">
{getFieldDecorator('align', {
initialValue: config.setting.align || 'left_right'
@@ -125,7 +146,7 @@
</Radio.Group>
)}
</Form.Item>
- </Col>
+ </Col> : null}
<Col span={12}>
<Form.Item label="瀹屾垚鍚�">
{getFieldDecorator('finish', {
@@ -150,7 +171,20 @@
)}
</Form.Item>
</Col>
- {!this.props.isSubTab && appType !== 'pc' ? <Col span={12}>
+ <Col span={12}>
+ <Form.Item label="鏄剧ず鏂瑰紡">
+ {getFieldDecorator('display', {
+ initialValue: display || 'modal'
+ })(
+ <Radio.Group style={{whiteSpace: 'nowrap'}} onChange={(e) => this.setState({display: e.target.value})}>
+ {appType !== 'mob' ? <Radio value="modal">妯℃�佹</Radio> : null}
+ <Radio value="prompt">鏄惁妗�</Radio>
+ <Radio value="drawer">鎶藉眽</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col>
+ {!this.props.isSubTab && !appType && display === 'modal' ? <Col span={12}>
<Form.Item label="鎸傝浇瀵硅薄">
{getFieldDecorator('container', {
initialValue: config.setting.container || 'tab'
@@ -162,18 +196,38 @@
)}
</Form.Item>
</Col> : null}
- <Col span={12}>
- <Form.Item label="鏄剧ず鏂瑰紡">
- {getFieldDecorator('display', {
- initialValue: config.setting.display || 'modal'
+ {display === 'drawer' ? <Col span={12}>
+ <Form.Item label="鎶藉眽鏂瑰悜">
+ {getFieldDecorator('placement', {
+ initialValue: config.setting.placement || 'right'
})(
- <Radio.Group>
- <Radio value="modal">妯℃�佹</Radio>
- <Radio value="prompt">鏄惁妗�</Radio>
+ <Radio.Group style={{whiteSpace: 'nowrap'}}>
+ <Radio value="right">鍙充晶</Radio>
+ <Radio value="left">宸︿晶</Radio>
+ <Radio value="top">涓婁晶</Radio>
+ <Radio value="bottom">涓嬩晶</Radio>
</Radio.Group>
)}
</Form.Item>
- </Col>
+ </Col> : null}
+ {appType === 'mob' ? <Col span={12}>
+ <Form.Item label="宸﹁竟璺�">
+ {getFieldDecorator('paddingLeft', {
+ initialValue: config.setting.paddingLeft || '10px'
+ })(
+ <StyleInput options={['px', '%']} />
+ )}
+ </Form.Item>
+ </Col> : null}
+ {appType === 'mob' ? <Col span={12}>
+ <Form.Item label="鍙宠竟璺�">
+ {getFieldDecorator('paddingRight', {
+ initialValue: config.setting.paddingRight || '10px'
+ })(
+ <StyleInput options={['px', '%']} />
+ )}
+ </Form.Item>
+ </Col> : null}
</Row>
</Form>
)
--
Gitblit v1.8.0