king
2022-04-26 5046d0d13dc6a8563b8e54e31913bc44cfa1072f
src/pc/createview/settingform/index.jsx
@@ -1,6 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Select, Input } from 'antd'
import { Form, Row, Col, Select, Input, Tooltip, Radio } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
import './index.scss'
@@ -10,7 +11,8 @@
  }
  state = {
    appMenus: []
    appMenus: [],
    copymenuId: ''
  }
  UNSAFE_componentWillMount () {
@@ -18,7 +20,15 @@
    if (appMenus) {
      try {
        appMenus = JSON.parse(appMenus)
      } catch {
        appMenus = appMenus.map(item => {
          item.name = item.MenuName
          if (item.MenuNo && item.MenuNo !== item.MenuName) {
            item.name = item.MenuName + `(${item.MenuNo})`
          }
          return item
        })
      } catch (e) {
        appMenus = []
      }
    } else {
@@ -43,7 +53,7 @@
  render() {
    const { getFieldDecorator } = this.props.form
    const { appMenus } = this.state
    const { appMenus, copymenuId } = this.state
    const formItemLayout = {
      labelCol: {
@@ -86,18 +96,62 @@
            </Form.Item>
          </Col>
          <Col span={20}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="自定义菜单ID值。">
                <QuestionCircleOutlined className="mk-form-tip" />
                菜单ID
              </Tooltip>
            }>
              {getFieldDecorator('MenuId', {
                initialValue: '',
                rules: [{
                  pattern: /^[0-9a-zA-Z]*$/ig,
                  message: '菜单ID只允许包含数字或字母(大小写)'
                }, {
                  min: 20,
                  message: '菜单ID最短为20个字符'
                }, {
                  max: 40,
                  message: '菜单ID最长为40个字符'
                }]
              })(<Input placeholder="" autoComplete="off" />)}
            </Form.Item>
          </Col>
          <Col span={20}>
            <Form.Item label="复制菜单">
              {getFieldDecorator('copymenuId', {
                initialValue: ''
              })(
                <Select allowClear showSearch filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}>
                <Select
                  allowClear
                  showSearch
                  onChange={(val) => this.setState({copymenuId: val})}
                  filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                >
                  {appMenus.map(option =>
                    <Select.Option key={option.MenuID} value={option.MenuID}>{option.MenuName}</Select.Option>
                    <Select.Option key={option.MenuID} value={option.MenuID}>{option.name}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
          {copymenuId ? <Col span={20}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="复制菜单时,是否清空原页面中的关联菜单。">
                <QuestionCircleOutlined className="mk-form-tip" />
                清空关联菜单
              </Tooltip>
            }>
              {getFieldDecorator('clearMenu', {
                initialValue: 'true'
              })(
                <Radio.Group>
                  <Radio value={'true'}>是</Radio>
                  <Radio value={'false'}>否</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col> : null}
        </Row>
      </Form>
    )