Merge branch 'master' into positec

king

2024-06-01 c62724a2cdbafa3c660538955acbedafa5a01871

 src/templates/modalconfig/settingform/index.jsx

@@ -5,7 +5,11 @@

// import { formRule } from '@/utils/option.js'
import StyleInput from '@/menu/stylecontroller/styleInput'
import asyncComponent from '@/utils/asyncComponent'
import './index.scss'

const MkEditIcon = asyncComponent(() => import('@/components/mkIcon'))
const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))

class SettingForm extends Component {
  static propTpyes = {
@@ -18,26 +22,19 @@
    fields: null,
    display: this.props.config.setting.display || 'modal',
    placement: this.props.config.setting.placement || 'right',
    icon: this.props.config.setting.icon || '',
    appType: sessionStorage.getItem('appType'),
    dialogInput: false
    viewType: sessionStorage.getItem('editMenuType') || '',
  }

  UNSAFE_componentWillMount () {
    const { config } = this.props
    const { appType, display } = this.state
    let fields = []
    let dialogInput = null

    config.fields.forEach(f => {
      if (f.field && ['select', 'link', 'text', 'number', 'textarea'].includes(f.type) && f.hidden !== 'true' && f.readonly !== 'true') {
        fields.push(f)
      }
      if (f.field && f.hidden !== 'true' && f.readonly !== 'true') {
        if (dialogInput === null) {
          dialogInput = ['text', 'number'].includes(f.type)
        } else {
          dialogInput = false
        }
      }
    })

@@ -50,8 +47,7 @@

    this.setState({
      fields: fields,
      display: _display,
      dialogInput
      display: _display
    })
  }

@@ -79,7 +75,7 @@

  render() {
    const { config } = this.props
    const { fields, appType, display, placement } = this.state
    const { fields, appType, display, placement, icon } = this.state
    const { getFieldDecorator } = this.props.form

    const formItemLayout = {
@@ -111,7 +107,7 @@
          </Col> */}
          <Col span={24}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="对话框在仅有一个可输入表单（非隐藏、非只读的文本或数字）时有效。">
              <Tooltip placement="topLeft" title="可选择表单的显示形式，注：标签打印按钮，暂不支持以抽屉显示表单。">
                <QuestionCircleOutlined className="mk-form-tip" />
                显示方式
              </Tooltip>
@@ -138,6 +134,18 @@
            }>
              {getFieldDecorator('width', {
                initialValue: config.setting.width || (appType !== 'mob' ? 60 : 100)
              })(<InputNumber min={10} max={2000} precision={0} onPressEnter={this.handleSubmit}/>)}
            </Form.Item>
          </Col> : null}
          {display === 'dialog' && appType === 'mob' ? <Col span={12}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="小于100时为百分率，大于100时为绝对值。空值时宽度自适应。">
                <QuestionCircleOutlined className="mk-form-tip" />
                宽度
              </Tooltip>
            }>
              {getFieldDecorator('width', {
                initialValue: config.setting.width || ''
              })(<InputNumber min={10} max={2000} precision={0} onPressEnter={this.handleSubmit}/>)}
            </Form.Item>
          </Col> : null}
@@ -182,6 +190,32 @@
                  )}
                </Select>
              )}
            </Form.Item>
          </Col> : null}
          {appType !== 'mob' && display === 'modal' ? <Col span={12}>
            <Form.Item label="图标">
              {getFieldDecorator('icon', {
                initialValue: icon
              })(<MkEditIcon onChange={(value) => this.setState({icon: value})} allowClear={true}/>)}
            </Form.Item>
          </Col> : null}
          {appType !== 'mob' && display === 'modal' && icon ? <Col span={12}>
            <Form.Item label="图标样式">
              {getFieldDecorator('iconType', {
                initialValue: config.setting.iconType || 'def'
              })(
                <Radio.Group>
                  <Radio value="def">默认</Radio>
                  <Radio value="circle">圆形</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col> : null}
          {appType !== 'mob' && display === 'modal' && icon ? <Col span={12}>
            <Form.Item label="图标颜色">
              {getFieldDecorator('iconColor', {
                initialValue: config.setting.iconColor || ''
              })(<ColorSketch allowClear={true}/>)}
            </Form.Item>
          </Col> : null}
          {appType === 'mob' && display === 'drawer' ? <Col span={12}>
@@ -260,7 +294,7 @@
            </Form.Item>
          </Col> : null}
          {display === 'drawer' ? <Col span={12}>
            <Form.Item label="抽屉方向">
            <Form.Item label="弹出方向">
              {getFieldDecorator('placement', {
                initialValue: placement
              })(
@@ -285,8 +319,31 @@
              )}
            </Form.Item>
          </Col> : null}
          {display === 'drawer' && appType !== 'mob' ? <Col span={12}>
            <Form.Item label="表单类型">
          {appType !== 'mob' && (display === 'drawer' || display === 'modal') ? <Col span={12}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="正常间隙会预留出报错信息的位置，防止表单位置发生变化。">
                <QuestionCircleOutlined className="mk-form-tip" />
                竖向间隙
              </Tooltip>
            }>
              {getFieldDecorator('verticalSpace', {
                initialValue: config.setting.verticalSpace || 'normal'
              })(
                <Radio.Group>
                  <Radio value="normal">正常</Radio>
                  <Radio value="middle">中</Radio>
                  <Radio value="small">小</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col> : null}
          {appType !== 'mob' && (display === 'drawer' || display === 'modal') ? <Col span={12}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="选择查看时表单均为只读，仅用于数据展示。">
                <QuestionCircleOutlined className="mk-form-tip" />
                表单类型
              </Tooltip>
            }>
              {getFieldDecorator('formType', {
                initialValue: config.setting.formType || 'edit'
              })(
@@ -297,7 +354,21 @@
              )}
            </Form.Item>
          </Col> : null}
          {!this.props.isSubTab && !appType && display === 'modal' ? <Col span={12}>
          {display === 'prompt' ? <Col span={12}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="提示框的确认提示信息。">
                <QuestionCircleOutlined className="mk-form-tip" />
                确认提示
              </Tooltip>
            }>
              {getFieldDecorator('tipTitle', {
                initialValue: config.setting.tipTitle || ''
              })(
                <Input autoComplete="off" onPressEnter={this.handleSubmit} />
              )}
            </Form.Item>
          </Col> : null}
          {!this.props.isSubTab && !appType && this.state.viewType !== 'popview' && display === 'modal' ? <Col span={12}>
            <Form.Item label="挂载对象">
              {getFieldDecorator('container', {
                initialValue: config.setting.container || 'tab'
@@ -321,6 +392,23 @@
              )}
            </Form.Item>
          </Col> : null}
          {!appType && display === 'modal' ? <Col span={12}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="是否可拖拽移动模态框。">
                <QuestionCircleOutlined className="mk-form-tip" />
                可移动
              </Tooltip>
            }>
              {getFieldDecorator('moveable', {
                initialValue: config.setting.moveable || 'false'
              })(
                <Radio.Group>
                  <Radio value="false">否</Radio>
                  <Radio value="true">是</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col> : null}
        </Row>
      </Form>
    )