2022-02-09

king

2022-02-09 d59f518f466274b2caeb2e01c10c92deafe7c93b

 src/templates/sharecomponent/tabscomponent/tabform/index.jsx

@@ -1,16 +1,21 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, Select, Icon, Tooltip, Radio } from 'antd'
import { Form, Row, Col, Input, Select, Tooltip, Radio, InputNumber, notification } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'

import { formRule } from '@/utils/option.js'
import Utils from '@/utils/utils.js'
import './index.scss'
import asyncComponent from '@/utils/asyncComponent'
// import './index.scss'

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

class MainTab extends Component {
  static propTpyes = {
    tabs: PropTypes.array,       // 可关联标签集
    dict: PropTypes.object,      // 字典项
    formlist: PropTypes.any,     // 表单
    levels: PropTypes.any,       // 标签显示级别
    card: PropTypes.object,      // 标签页信息
    inputSubmit: PropTypes.any   // 回车提交事件
  }
@@ -25,9 +30,9 @@
  UNSAFE_componentWillMount () {
    const { formlist } = this.props

    let type = formlist.filter(cell => cell.key === 'type')[0].initVal
    // let type = formlist.filter(cell => cell.key === 'type')[0].initVal

    let _tabs = this.props.tabs.filter(tab => tab.type === type)
    let _tabs = this.props.tabs.filter(tab => tab.type === 'SubTable')

    this.setState({
      formlist: formlist.map(item => {
@@ -53,7 +58,7 @@
      try {
        let _form = document.getElementById('label')
        _form.select()
      } catch {
      } catch (e) {
        console.warn('表单focus失败！')
      }
    }
@@ -79,20 +84,19 @@
              ..._tabs
            ]
            item.initVal = ''
            item.hidden = true
          }
          return item
        })
      }, () => {
        this.setState({
          formlist: this.state.formlist.map(item => {
            if (item.key === 'linkTab') {
              item.hidden = false
            }
            return item
          })
        })
        if (this.props.form.getFieldValue('linkTab') !== undefined) {
          this.props.form.setFieldsValue({linkTab: ''})
        }
      })
    } else if (key === 'supMenu' && this.props.levels) {

      if (value && value !== 'mainTable') {
        this.props.form.setFieldsValue({level: this.props.levels[value]})
      }
    }
  }

@@ -111,7 +115,7 @@
    this.state.formlist.forEach((item, index) => {
      if (item.hidden || item.forbid) return

      if (item.type === 'text') { // 文本搜索
      if (item.type === 'text') {
        let rules = []

        if (item.key === 'foreignKey') {
@@ -125,7 +129,7 @@
            <Form.Item label={
              item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                <QuestionCircleOutlined className="mk-form-tip" />
                {item.label}
              </Tooltip> : item.label
            }>
@@ -143,6 +147,28 @@
                  ...rules
                ]
              })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'number') {
        fields.push(
          <Col span={12} key={index}>
            <Form.Item label={
              item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <QuestionCircleOutlined className="mk-form-tip" />
                {item.label}
              </Tooltip> : item.label
            }>
              {getFieldDecorator(item.key, {
                initialValue: item.initVal,
                rules: [
                  {
                    required: !!item.required,
                    message: this.props.dict['form.required.input'] + item.label + '!'
                  }
                ]
              })(<InputNumber min={item.min} max={item.max} precision={0} />)}
            </Form.Item>
          </Col>
        )
@@ -166,10 +192,33 @@
                >
                  {item.options.map((option, i) =>
                    <Select.Option id={'mk' + i} title={option.text} key={'mk' + i} value={option.value}>
                      {item.key === 'icon' && i !== 0 ? <Icon type={option.text} /> : option.text}
                      {option.text}
                    </Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'icon') { // 下拉搜索
        fields.push(
          <Col span={12} key={index}>
            <Form.Item label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <QuestionCircleOutlined className="mk-form-tip" />
                {item.label}
              </Tooltip> : item.label
            }>
              {getFieldDecorator(item.key, {
                initialValue: item.initVal || '',
                rules: [
                  {
                    required: !!item.required,
                    message: this.props.dict['form.required.select'] + item.label + '!'
                  }
                ]
              })(
                <MkEditIcon options={['data', 'normal', 'edit', 'direction', 'hint']} allowClear/>
              )}
            </Form.Item>
          </Col>
@@ -180,7 +229,7 @@
            <Form.Item label={
              item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                <QuestionCircleOutlined className="mk-form-tip" />
                {item.label}
              </Tooltip> : item.label
            }>
@@ -205,7 +254,7 @@
          <Col span={12} key={index}>
            <Form.Item label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                <QuestionCircleOutlined className="mk-form-tip" />
                {item.label}
              </Tooltip> : item.label
            }>
@@ -248,6 +297,18 @@
          if (!values.linkTab) { // 没有关联标签（新建时），创建新标签Id
            values.linkTab = Utils.getuuid()
          }
          if (values.level === undefined) {
            values.level = ''
          } else if (values.supMenu && values.supMenu === 'mainTable' && values.level === 0) {
            notification.warning({
              top: 92,
              message: '显示级别为0时，上级标签不可关联主表！',
              duration: 5
            })
            return
          }

          values.type = 'SubTable' // 类型为子表

          resolve(values)
        } else {
@@ -269,7 +330,7 @@
      }
    }
    return (
      <Form {...formItemLayout} className="ant-advanced-search-form commontable-tab-form">
      <Form {...formItemLayout} style={{minHeight: '180px'}}>
        <Row gutter={24}>{this.getFields()}</Row>
      </Form>
    )