2021-09-01

king

2021-09-01 31ec63f0419895876cbaba99637a884a32d33d0d

 src/menu/datasource/verifycard/settingform/index.jsx

@@ -4,8 +4,11 @@

import { formRule } from '@/utils/option.js'
import Utils from '@/utils/utils.js'
import MenuUtils from '@/utils/utils-custom.js'
import CodeMirror from '@/templates/zshare/codemirror'
import './index.scss'

const { TextArea } = Input

class SettingForm extends Component {
  static propTpyes = {
@@ -13,7 +16,7 @@
    menu: PropTypes.any,          // 菜单配置信息
    config: PropTypes.object,     // 组件配置
    setting: PropTypes.object,    // 数据源配置
    modules: PropTypes.array,     // 列设置
    modules: PropTypes.array,     // 可绑定的上级组件
    columns: PropTypes.array,     // 列设置
    scripts: PropTypes.array,     // 自定义脚本
  }
@@ -22,13 +25,15 @@
    interType: this.props.setting.interType || 'system',
    laypage: this.props.setting.laypage || 'true',
    modules: [],
    useMSearch: this.props.setting.useMSearch || 'false'
    usefulFields: [],
    useMSearch: this.props.setting.useMSearch || 'false',
    supModule: this.props.setting.supModule || []
  }

  UNSAFE_componentWillMount () {
    const { menu, config } = this.props

    let modules = this.getModules(menu.components, config.uuid)
    let modules = MenuUtils.getSupModules(menu.components, config.uuid)
    if (!modules) {
      modules = []
    }
@@ -38,58 +43,18 @@
      label: '无'
    })

    this.setState({modules})
  }

  getModules = (components, selfId) => {
    let modules = components.map(item => {
      if (item.uuid === selfId) {
        return {
          children: null
        }
      } else if (item.switchable) {
        return {
          value: item.uuid,
          label: item.name
        }
      } else if (item.type === 'tabs') {
        let _item = {
          value: item.uuid,
          label: item.name,
          children: item.subtabs.map(f_tab => {
            let subItem = {
              value: f_tab.uuid,
              label: f_tab.label,
              children: this.getModules(f_tab.components, selfId)
            }

            if (!subItem.children || subItem.children.length === 0) {
              return {children: null}
            }
            return subItem
          })
        }

        _item.children = _item.children.filter(t => t.children !== null)

        if (_item.children.length === 0) {
          return {children: null}
        }

        return _item
      } else {
        return {
          children: null
        }
    let usefulFields = sessionStorage.getItem('permFuncField')
    if (usefulFields) {
      try {
        usefulFields = JSON.parse(usefulFields)
      } catch (e) {
        usefulFields = []
      }
    })

    modules = modules.filter(mod => mod.children !== null)

    if (modules.length === 0) {
      return null
    } else {
      usefulFields = []
    }
    return modules

    this.setState({modules, usefulFields})
  }

  handleConfirm = () => {
@@ -172,10 +137,22 @@
    }
  }

  onSysInter = (e) => {
    let value = e.target.value

    if (value === 'true') {
      this.props.form.setFieldsValue({interface: window.GLOB.mainSystemApi})
    }
  }

  changeSupModule = (val) => {
    this.setState({supModule: val})
  }

  render() {
    const { setting, menu, columns, config } = this.props
    const { setting, columns, config } = this.props
    const { getFieldDecorator } = this.props.form
    const { interType, modules, useMSearch, laypage } = this.state
    const { interType, modules, useMSearch, laypage, supModule, usefulFields } = this.state

    const formItemLayout = {
      labelCol: {
@@ -191,9 +168,9 @@
    let tooltip = null
    let rules = []

    if (menu.permFuncField && menu.permFuncField.length > 0) {
      tooltip = '开头可用字符：' + menu.permFuncField.join(', ')
      let str = '^(' + menu.permFuncField.join('|') + ')'
    if (usefulFields.length > 0) {
      tooltip = '开头可用字符：' + usefulFields.join(', ')
      let str = '^(' + usefulFields.join('|') + ')'
      let _patten = new RegExp(str + formRule.func.innerPattern + '$', 'g')

      rules.push({
@@ -206,7 +183,6 @@
      <div className="model-datasource-setting-form-box">
        <Form {...formItemLayout} className="model-setting-form">
          <Row gutter={24}>
            
            <Col span={8}>
              <Form.Item label="表名">
                {getFieldDecorator('tableName', {
@@ -216,6 +192,10 @@
                      required: true,
                      message: this.props.dict['form.required.input'] + '表名!'
                    },
                    {
                      max: 50,
                      message: '表名最长为50个字符!'
                    }
                  ]
                })(<Input placeholder={''} autoComplete="off" />)}
              </Form.Item>
@@ -238,6 +218,17 @@
                </Radio.Group>)}
              </Form.Item>
            </Col>
            {interType === 'outer' ? <Col span={8}>
              <Form.Item label="系统接口">
                {getFieldDecorator('sysInterface', {
                  initialValue: setting.sysInterface || 'false'
                })(
                <Radio.Group onChange={this.onSysInter}>
                  <Radio value="true">是</Radio>
                  <Radio value="false">否</Radio>
                </Radio.Group>)}
              </Form.Item>
            </Col> : null}
            {interType === 'system' ? <Col span={8}>
              <Form.Item label={
                <Tooltip placement="topLeft" title={'自定义脚本中的变量（除报错及可用字段外），需以此标识开头。'}>
@@ -279,7 +270,7 @@
                })(<Input placeholder={''} autoComplete="off" />)}
              </Form.Item>
            </Col> : null}
            {interType === 'outer' ? <Col span={8}>
            {interType === 'outer' ? <Col className="outer-interface" span={24}>
              <Form.Item label="接口地址">
                {getFieldDecorator('interface', {
                  initialValue: setting.interface || '',
@@ -289,7 +280,18 @@
                      message: this.props.dict['form.required.input'] + '接口地址!'
                    }
                  ]
                })(<Input placeholder={''} autoComplete="off" />)}
                })(<TextArea rows={2}/>)}
              </Form.Item>
            </Col> : null}
            {interType === 'outer' ? <Col className="outer-interface" span={24}>
              <Form.Item label={<Tooltip placement="topLeft" title="正式系统接口地址，为空时使用接口地址">
                  <Icon type="question-circle" />
                  正式地址
                </Tooltip>
              }>
                {getFieldDecorator('proInterface', {
                  initialValue: setting.proInterface || ''
                })(<TextArea rows={2}/>)}
              </Form.Item>
            </Col> : null}
            {interType === 'outer' ? <Col span={8}>
@@ -304,7 +306,7 @@
            </Col> : null}
            {interType === 'system' ? <Col span={24} className="data-source" style={{paddingLeft: '7px'}}>
              <Form.Item labelCol={{xs: { span: 24 }, sm: { span: 2 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 22 }} } label={
                <Tooltip placement="topLeft" title={'使用系统函数时，需填写数据源。注：数据权限替换符 $@ -> /* 或 \'\'、 @$ -> */ 或 \'\''}>
                <Tooltip placement="topLeft" title={`使用系统函数时，需填写数据源。注：数据权限替换符 $@ -> /* 或 ''、 @$ -> */ 或 ''；查询替换符 $select@ -> /* 或 ''、 @select$ -> */ 或 ''；统计替换符 $sum@ -> /* 或 ''、 @sum$ -> */ 或 ''。`}>
                  <Icon type="question-circle" />
                  数据源
                </Tooltip>
@@ -349,7 +351,7 @@
            {config.format === 'array' ? <Col span={8}>
              <Form.Item label="默认排序">
                {getFieldDecorator('order', {
                  initialValue: setting.order || '',
                  initialValue: setting.order || 'ID desc',
                  rules: [
                    {
                      required: true,
@@ -370,26 +372,26 @@
                </Radio.Group>)}
              </Form.Item>
            </Col> : null}
            <Col span={8}>
            {config.type !== 'navbar' && config.type !== 'balcony' ? <Col span={8}>
              <Form.Item label={
                <Tooltip placement="topLeft" title={'该组件如果受其他组件控制，请选项相应的组件，没有时选“无”。'}>
                  <Icon type="question-circle" />
                  上级模块
                  上级组件
                </Tooltip>
              }>
                {getFieldDecorator('supModule', {
                  initialValue: setting.supModule || [],
                  initialValue: supModule,
                  rules: [
                    {
                      required: true,
                      message: this.props.dict['form.required.select'] + '上级模块!'
                      message: this.props.dict['form.required.select'] + '上级组件!'
                    }
                  ]
                })(
                  <Cascader options={modules} expandTrigger="hover" placeholder="" />
                  <Cascader options={modules} onChange={this.changeSupModule} expandTrigger="hover" placeholder="" />
                )}
              </Form.Item>
            </Col>
            </Col> : null}
            {config.pageable ? <Col span={8}>
              <Form.Item label="分页">
                {getFieldDecorator('laypage', {
@@ -420,7 +422,8 @@
                })(<InputNumber min={1} max={500} precision={0} />)}
              </Form.Item>
            </Col> : null}
            {!config.pageable || (config.pageable && laypage === 'false') ? <Col span={8}>
            {/* 1、不分页且不存在上级模块 */}
            {config.type !== 'navbar' && (!config.pageable || (config.pageable && laypage === 'false')) && (!supModule || supModule.length === 0 || supModule[0] === 'empty') ? <Col span={8}>
              <Form.Item label={
                <Tooltip placement="topLeft" title={'初始化加载时，是否与其他组件一同加载数据，注：仅在使用系统函数，且初始化加载数据时有效，分页请求时无效。'}>
                  <Icon type="question-circle" />
@@ -437,15 +440,15 @@
                )}
              </Form.Item>
            </Col> : null}
            <Col span={8}>
            {config.type !== 'navbar' && config.type !== 'balcony' ? <Col span={8}>
              <Form.Item label={
                <Tooltip placement="topLeft" title={'优先使用同级的搜索条件组件，同级搜索不存在时，依次向上选取，与当前组件的搜索条件一同用作数据过滤（当前组件的搜索条件优先）。'}>
                  <Icon type="question-circle" />
                  外层搜索
                  外部搜索
                </Tooltip>
              }>
                {getFieldDecorator('useMSearch', {
                  initialValue: setting.useMSearch || 'false'
                  initialValue: setting.useMSearch || 'true'
                })(
                  <Radio.Group onChange={(e) => this.setState({useMSearch: e.target.value})}>
                    <Radio value="true">使用</Radio>
@@ -453,8 +456,8 @@
                  </Radio.Group>
                )}
              </Form.Item>
            </Col>
            {useMSearch === 'true' ? <Col span={8}>
            </Col> : null}
            {config.type !== 'navbar' && config.type !== 'balcony' && useMSearch === 'true' ? <Col span={8}>
              <Form.Item label={
                <Tooltip placement="topLeft" title={'外层搜索条件改变时，是否刷新当前组件数据。'}>
                  <Icon type="question-circle" />
@@ -471,7 +474,7 @@
                )}
              </Form.Item>
            </Col> : null}
            <Col span={8}>
            {config.type !== 'navbar' && config.type !== 'balcony' ? <Col span={8}>
              <Form.Item label="初始化数据">
                {getFieldDecorator('onload', {
                  initialValue: setting.onload || 'true'
@@ -482,7 +485,7 @@
                  </Radio.Group>
                )}
              </Form.Item>
            </Col>
            </Col> : null}
          </Row>
        </Form>
      </div>