2022-09-06

king

2022-09-06 b8e1395f02c929eaa96b949cf6027ee2a43856a6

 src/templates/zshare/modalform/index.jsx

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

import { formRule } from '@/utils/option.js'
@@ -19,24 +19,26 @@
const MkEditIcon = asyncComponent(() => import('@/components/mkIcon'))

const modalTypeOptions = {
  text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'scan', 'splitline', 'placeholder', 'place', 'marginTop', 'marginBottom'],
  text: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'regular', 'interception', 'span', 'labelwidth', 'encryption', 'tooltip', 'extra', 'enter', 'cursor', 'scan', 'splitline', 'placeholder', 'place', 'marginTop', 'marginBottom', 'lenControl'],
  number: ['initval', 'readonly', 'hidden', 'decimal', 'min', 'max', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'enter', 'cursor', 'splitline', 'place', 'marginTop', 'marginBottom'],
  select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
  checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
  radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
  checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'linkSubField', 'fieldlength', 'span', 'labelwidth', 'display', 'tooltip', 'extra', 'width', 'multiple', 'borderColor', 'splitline', 'marginTop', 'marginBottom'],
  multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom'],
  link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'setAll', 'linkField', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
  fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'span', 'labelwidth', 'tooltip', 'extra', 'compress', 'splitline', 'marginTop', 'marginBottom'],
  select: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'declare', 'setAll', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
  checkbox: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
  radio: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'declare', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
  checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'span', 'labelwidth', 'display', 'tooltip', 'extra', 'width', 'multiple', 'splitline', 'marginTop', 'marginBottom'],
  multiselect: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom', 'dropdown'],
  link: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', 'declare', 'setAll', 'linkField', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'emptyText', 'enter', 'splitline', 'dropdown', 'marginTop', 'marginBottom'],
  fileupload: ['readonly', 'required', 'readin', 'fieldlength', 'maxfile', 'fileType', 'span', 'labelwidth', 'tooltip', 'extra', 'compress', 'miniSet', 'splitline', 'marginTop', 'marginBottom'],
  switch: ['initval', 'openVal', 'closeVal', 'openText', 'closeText', 'readonly', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'marginTop', 'marginBottom'],
  date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline', 'marginTop', 'marginBottom', 'minDate', 'maxDate'],
  date: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline', 'marginTop', 'marginBottom', 'minDate', 'maxDate', 'precision'],
  datemonth: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'splitline', 'marginTop', 'marginBottom'],
  datetime: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'declareType', 'mode', 'splitline', 'marginTop', 'marginBottom', 'minDate', 'maxDate'],
  textarea: ['initval', 'readonly', 'required', 'hidden', 'readin', 'fieldlength', 'span', 'labelwidth', 'maxRows', 'encryption', 'interception', 'tooltip', 'extra', 'count', 'placeholder', 'marginTop', 'marginBottom'],
  cascader: ['readonly', 'required', 'hidden', 'readin', 'resourceType', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'splitline', 'marginTop', 'marginBottom', 'separator'],
  color: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom'],
  rate: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'splitline', 'tooltip', 'extra', 'marginTop', 'marginBottom', 'allowHalf', 'rateCount', 'character', 'place'],
  hint: ['label', 'type', 'blacklist', 'message', 'span', 'labelwidth', 'splitline', 'marginTop', 'marginBottom'],
  split: ['label', 'type', 'marginTop', 'marginBottom'],
  rate: ['initval', 'readonly', 'required', 'hidden', 'readin', 'span', 'labelwidth', 'splitline', 'tooltip', 'extra', 'marginTop', 'marginBottom', 'allowHalf', 'color', 'rateCount', 'character', 'place'],
  hint: ['label', 'field', 'type', 'blacklist', 'message', 'span', 'labelwidth', 'splitline', 'marginTop', 'marginBottom'],
  split: ['label', 'type', 'marginTop', 'marginBottom', 'splitline'],
  formula: ['label', 'type', 'marginTop', 'marginBottom', 'splitline', 'span', 'labelwidth', 'formula', 'eval', 'postfix'],
  brafteditor: ['required', 'hidelabel', 'hidden', 'readin', 'fieldlength', 'readonly', 'span', 'labelwidth', 'tooltip', 'extra', 'encryption', 'marginTop', 'marginBottom'],
  funcvar: ['span', 'labelwidth', 'splitline', 'marginTop', 'marginBottom'],
  linkMain: ['readonly', 'required', 'hidden', 'fieldlength', 'span', 'labelwidth', 'tooltip', 'extra', 'marginTop', 'marginBottom']
@@ -52,98 +54,46 @@
  }

  state = {
    openType: null,
    resourceType: null,
    supField: '',
    compress: 'false',
    display: 'text',
    enter: '',
    cFields: [],
    formlist: null,
    linkSubFields: null
    transfield: {},
    formlist: null
  }

  UNSAFE_componentWillMount () {
    let formlist = fromJS(this.props.formlist).toJS()
    let type = ''
    let resourceType = ''
    let supField = ''
    let display = ''
    let compress = 'false'
    let enter = ''
    let cFields = []
    let linkSubFields = []
  record = {}

    formlist.forEach(cell => {
      if (cell.key === 'type') {
        type = cell.initVal
      } else if (cell.key === 'compress') {
        compress = cell.initVal
      } else if (cell.key === 'display') {
        display = cell.initVal
      } else if (cell.key === 'enter') {
        enter = cell.initVal
      } else if (cell.key === 'fields') {
        cFields = cell.initVal
      } else if (cell.key === 'resourceType') {
        resourceType = cell.initVal
      } else if (cell.key === 'linkSubField') {
        let arr = []
        linkSubFields = cell.options.filter(option => {
          if (!['Value', 'Text'].includes(option.field) && cell.initVal.includes(option.field) && !arr.includes(option.field)) {
            arr.push(option.field)
            return true
          } else {
            return false
          }
  UNSAFE_componentWillMount () {
    let transfield = {}
    this.props.formlist.forEach(item => {
      this.record[item.key] = item.initVal

      if (item.key === 'linkSubField') {
        item.options.forEach(cell => {
          transfield[cell.field] = cell.label
        })
      } else if (cell.key === 'supField') {
        supField = cell.initVal
      }
    })
    
    let _options = this.getOptions(type, resourceType, supField, display, enter, compress)

    let { shows, reOptions, reTypes, reRequired, reTooltip } = this.getMutilOptions()

    this.setState({
      enter: enter,
      compress: compress,
      openType: type,
      supField: supField,
      display: display,
      cFields: cFields,
      resourceType: resourceType,
      linkSubFields: linkSubFields,
      formlist: formlist.map(form => {
        if (form.key === 'initval') {
          if (dateOptions.hasOwnProperty(type)) {
            form.options = dateOptions[type]
            form.type = 'select'
          } else if (type === 'switch') {
            form.initVal = !!form.initVal
            form.options = [
              {value: true, text: '开'},
              {value: false, text: '关'}
            ]
            form.type = 'radio'
          }
          if (type === 'number') {
            form.type = 'number'
            form.initVal = form.initVal || 0
            form.required = true
          } else if (type === 'rate') {
            form.type = 'number'
            form.initVal = form.initVal || 0
            form.required = false
          }
        } else if (form.key === 'label') {
          form.required = true
          if (type === 'hint') {
            form.required = false
          }
      transfield,
      formlist: this.props.formlist.map(item => {
        item.show = shows.includes(item.key)
        item.initVal = this.record[item.key]

        if (reOptions[item.key]) {
          item.options = reOptions[item.key]
        }
        if (reTypes[item.key]) {
          item.type = reTypes[item.key]
        }
        if (reRequired[item.key] !== undefined) {
          item.required = reRequired[item.key]
        }
        if (reTooltip[item.key] !== undefined) {
          item.tooltip = reTooltip[item.key]
        }

        form.show = _options.includes(form.key)
        return form
        return item
      })
    })
  }
@@ -161,252 +111,366 @@
    }
  }

  getOptions = (type, resourceType, supField, display, enter, compress) => {
    let _options = ['label', 'field', 'type', 'blacklist', 'writein', ...fromJS(modalTypeOptions[type]).toJS()]
  getMutilOptions = () => {
    let type = this.record.type
    let shows = ['label', 'field', 'type', 'blacklist', 'writein', 'supField', ...fromJS(modalTypeOptions[type] || []).toJS()]
    let reOptions = {}
    let reTypes = {}
    let reRequired = {}
    let reTooltip = {}

    if (type === 'hint') {
      _options = fromJS(modalTypeOptions[type]).toJS()
    } else if (type === 'split') {
      return fromJS(modalTypeOptions[type]).toJS()
    reRequired.field = true

    if (['hint', 'split', 'formula'].includes(type)) {
      reRequired.field = false
      shows = fromJS(modalTypeOptions[type]).toJS()
    }

    // text number select multiselect link switch checkbox radio checkcard fileupload date datemonth datetime textarea 
    // rate color brafteditor funcvar hint split linkMain

    // 通用设置
    reTypes.initval = 'text'
    reRequired.initval = false
    reRequired.label = true
    reRequired.linkField = true
    reTooltip.initval = ''

    if (type === 'text') {
      if (this.record.enter === 'tab' || this.record.enter === 'sub') {
        shows.push('tabField')
      }
    } else if (type === 'number') {
      reTypes.initval = 'number'
      reRequired.initval = true
      if (this.record.enter === 'tab' || this.record.enter === 'sub') {
        shows.push('tabField')
      }
      if (sessionStorage.getItem('appType') === 'mob') { // 移动端右侧扩展信息
        shows.push('placeholder')
      }
    } else if (['multiselect', 'select', 'link', 'radio', 'checkbox'].includes(type)) {
      if (resourceType === '0') {        // 自定义资源
        _options.push('options')
      } else if (resourceType === '1') { // 数据源
        _options.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'disableField', 'database')
      if (this.record.resourceType === '0') {        // 自定义资源
        shows.push('options')
      } else if (this.record.resourceType === '1') { // 数据源
        shows.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'disableField', 'database')
      }
      if (type === 'select' || type === 'link') {
        if (this.record.enter === 'tab' || this.record.enter === 'sub') {
          shows.push('tabField')
        }
      } else if (type === 'radio') {
        shows.push('linkField')
        reRequired.linkField = false
      }
      if (['select', 'link', 'radio'].includes(type)) {
        if (this.record.declare === 'nvarchar') {
          shows.push('fieldlength')
        } else if (this.record.declare === 'decimal') {
          shows.push('decimal')
        }
      }
    } else if (type === 'checkcard') {
      if (display === 'picture') {
        if (resourceType === '0') {        // 自定义资源
          _options.push('options', 'ratio')
        } else if (resourceType === '1') { // 数据源
          _options.push('dataSource', 'cardValField', 'urlField', 'orderBy', 'orderType', 'disableField', 'database', 'ratio')
      reRequired.fields = false
      if (this.record.display === 'picture') {
        if (this.record.resourceType === '0') {        // 自定义资源
          shows.push('options', 'fields', 'picratio')
        } else if (this.record.resourceType === '1') { // 数据源
          shows.push('dataSource', 'cardValField', 'fields', 'urlField', 'orderBy', 'orderType', 'disableField', 'database', 'picratio')
        }
      } else if (this.record.display === 'color') {
        if (this.record.resourceType === '0') {        // 自定义资源
          shows.push('options', 'fields')
        } else if (this.record.resourceType === '1') { // 数据源
          shows.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'database')
        }
      } else {
        if (resourceType === '0') {        // 自定义资源
          _options.push('options', 'fields', 'backgroundColor')
        } else if (resourceType === '1') { // 数据源
          _options.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'disableField', 'database', 'backgroundColor')
        reRequired.fields = true
        if (this.record.resourceType === '0') {        // 自定义资源
          shows.push('options', 'fields', 'selectStyle')
        } else if (this.record.resourceType === '1') { // 数据源
          shows.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'disableField', 'database', 'selectStyle')
        }
        if (this.record.selectStyle === 'custom') {
          shows.push('backgroundColor')
        }
      }

      if (this.record.multiple === 'false') {
        shows.push('linkSubField', 'declare')
        if (this.record.declare === 'nvarchar') {
          shows.push('fieldlength')
        } else if (this.record.declare === 'decimal') {
          shows.push('decimal')
        }
      } else {
        shows.push('fieldlength')
        reTooltip.initval = '添加多个初始值请使用逗号分隔。'
      }

      shows.push('linkField')
      reRequired.linkField = false

      if (sessionStorage.getItem('appType') === 'mob') {
        _options.push('hidelabel')
        shows.push('hidelabel')
      }
    } else if (['date', 'datemonth', 'datetime'].includes(type)) {
      reOptions.initval = dateOptions[type]
      reTypes.initval = 'select'
    } else if (type === 'switch') {
      reOptions.initval = [
        {value: true, text: '开'},
        {value: false, text: '关'}
      ]
      reTypes.initval = 'radio'
    } else if (type === 'rate') {
      reTypes.initval = 'number'
    } else if (type === 'hint') {
      reRequired.label = false
    } else if (type === 'fileupload') {
      if (compress === 'true') {
        _options.push('limit', 'rduri', 'proRduri')
      } else {
        _options.push('suffix')
      if (this.record.compress === 'true') {
        shows.push('limit', 'rduri', 'proRduri')
      } else if (this.record.compress !== 'base64') {
        shows.push('suffix')
      }
      if (this.record.miniSet === 'custom') {
        shows.push('mediaType', 'sourceType')

        if (this.record.sourceType.includes('camera') && this.record.mediaType.includes('video')) {
          shows.push('maxDuration')
        }
        if (this.record.mediaType.includes('image')) {
          shows.push('sizeType')
        }
        if (this.record.sourceType.includes('camera')) {
          shows.push('camera')
        }
      }
    } else if (type === 'textarea') {
      if (this.record.encryption === 'false') {
        shows.push('enterReplace')
      }
    }

    if (type === 'text' || type === 'number' || type === 'select' || type === 'link') {
      if (enter === 'tab' || enter === 'sub') {
        _options.push('tabField')
    if (type === 'cascader') {
      if (this.record.resourceType === '0') {        // 自定义资源
        shows.push('options', 'topmark', 'linkSubField')
      } else if (this.record.resourceType === '1') { // 数据源
        shows.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'disableField', 'database', 'topmark', 'linkField', 'linkSubField')
      }
      reTypes.linkField = 'text'
      reTooltip.linkField = '用于构建数据结构。'
      reOptions.resourceType = [{
        value: '0',
        text: '自定义'
      }, {
        value: '1',
        text: '数据源'
      }, {
        value: '2',
        text: '省市区'
      }]
    } else {
      reTooltip.linkField = ''
      reTypes.linkField = 'select'
      reOptions.resourceType = [{
        value: '0',
        text: '自定义'
      }, {
        value: '1',
        text: '数据源'
      }]
    }

    if (type !== 'funcvar' && type !== 'linkMain') {
      if (supField) {
        _options.push('supField', 'supvalue')
      } else {
        _options.push('supField')
      }
    if (type === 'brafteditor') {
      reOptions.encryption = [{
        value: 'false',
        text: '无'
      }, {
        value: 'true',
        text: 'base64加密'
      }]
    } else {
      reOptions.encryption = [{
        value: 'false',
        text: '无'
      }, {
        value: 'true',
        text: 'base64加密'
      }, {
        value: 'md5',
        text: 'md5加密'
      }]
    }

    return _options
    if (['multiselect', 'checkbox'].includes(type)) {
      reTooltip.initval = '添加多个初始值请使用逗号分隔。'
    } else if (['select', 'link', 'radio'].includes(type)) {
      reTooltip.initval = '使用$first表示默认选择第一项。'
    }

    if (this.record.supField && !['hint', 'split', 'formula'].includes(type)) {
      shows.push('supvalue')
    }

    return {
      shows,
      reOptions,
      reTypes,
      reRequired,
      reTooltip
    }
  }

  openTypeChange = (key, value) => {
  optionChange = (key, value) => {
    let _fieldval = {}

    if (key === 'type') {
      let enter = 'false'
      let fieldValue = {}
      this.record.enter = 'false'
      this.record.initval = ''
      this.record.fieldlength = 50
      _fieldval.initval = ''

      if (value === 'text' || value === 'number') {
        enter = 'sub'
        fieldValue.enter = 'sub'
        this.record.enter = 'sub'
        _fieldval.enter = 'sub'
      } else if (value === 'select' || value === 'link') {
        fieldValue.enter = 'false'
        _fieldval.enter = 'false'
      }

      let _options = this.getOptions(value, this.state.resourceType, this.state.supField, this.state.display, enter, this.state.compress)
      if (value === 'number' || value === 'rate') {
        this.record.initval = 0
        _fieldval.initval = 0
      } else if (value === 'switch') {
        this.record.initval = false
        _fieldval.initval = false
      }

      if (['hint', 'split', 'brafteditor', 'funcvar', 'linkMain', 'fileupload'].includes(value)) {
        delete _fieldval.initval
      }

      if (value === 'text' || value === 'linkMain' || value === 'checkcard') {
        _fieldval.fieldlength = 50
      } else if (value === 'textarea' || value === 'brafteditor') {
        this.record.fieldlength = 8000
        _fieldval.fieldlength = 8000
      } else if (value === 'fileupload' || value === 'multiselect' || value === 'checkbox') {
        this.record.fieldlength = 512
        _fieldval.fieldlength = 512
      }

      if (value === 'brafteditor') {
        this.record.encryption = 'true'
        _fieldval.encryption = 'true'
      }

      if (value === 'linkMain') {
        this.record.hidden = 'true'
        _fieldval.hidden = 'true'
      }
      
      this.setState({
        openType: value,
        enter: enter,
        formlist: this.state.formlist.map(form => {
          form.show = _options.includes(form.key)
          if (form.key === 'initval') {
            form.required = false
            form.initVal = ''
            if (dateOptions.hasOwnProperty(value)) {
              form.options = dateOptions[value]
              form.type = 'select'
            } else if (value === 'switch') {
              form.initVal = false
              form.options = [
                {value: true, text: '开'},
                {value: false, text: '关'}
              ]
              form.type = 'radio'
            } else if (value === 'number') {
              form.type = 'number'
              form.required = true
              form.initVal = 0
            } else if (value === 'rate') {
              form.type = 'number'
              form.required = false
              form.initVal = 0
            } else {
              form.type = 'text'
            }
      if (this.record.type === 'cascader' && value !== 'cascader') {
        this.record.linkField = ''
        _fieldval.linkField = ''

            if (form.show) {
              fieldValue.initval = form.initVal
            }
          } else if (form.key === 'fieldlength') {
            form.initVal = 50
            if (value === 'textarea' || value === 'brafteditor') {
              form.initVal = 8000
            } else if (value === 'fileupload' || value === 'multiselect' || value === 'checkbox') {
              form.initVal = 512
            }

            if (form.show) {
              fieldValue.fieldlength = form.initVal
            }
          } else if (form.key === 'resourceType') {
            form.initVal = this.state.resourceType

            if (form.show) {
              fieldValue.resourceType = form.initVal
            }
          } else if (form.key === 'linkSubField') {
            form.initVal = this.state.linkSubFields.map(_field => _field.field)

            if (form.show) {
              fieldValue.linkSubField = form.initVal
            }
          } else if (form.key === 'label') {
            form.required = true
            if (value === 'hint') {
              form.required = false
            }
          } else if (form.key === 'encryption') {
            if (value === 'brafteditor') {
              fieldValue.encryption = 'true'
            }
          } else if (form.key === 'hidden') {
            if (value === 'linkMain') {
              fieldValue.hidden = 'true'
            }
          }

          return form
        })
      }, () => {
        this.props.form.setFieldsValue(fieldValue)
      })
    } else if (key === 'supField') {
      this.setState({
        supField: value,
        formlist: this.state.formlist.map(form => {
          if (form.key === 'supvalue' && value) {
            form.show = true
          } else if (form.key === 'supvalue' && !value) {
            form.show = false
          }

          return form
        })
      })
    }
  }

  multiselectChange = (key, value, options) => {
    if (key === 'linkSubField') {
      let arr = []
      let linkSubField = {}
      options.forEach(option => {
        if (!['Value', 'Text'].includes(option.field) && value.includes(option.field) && !arr.includes(option.field)) {
          arr.push(option.field)
          linkSubField[option.field] = option
        if (this.record.resourceType === '2') {
          this.record.resourceType = '0'
          _fieldval.resourceType = '0'
        }
      })
      }

      let linkSubFields = []
      value.forEach(item => {
        if (linkSubField[item]) {
          linkSubFields.push(linkSubField[item])
      if (this.record.options.length > 0) {
        if (value === 'checkcard') {
          this.record.options = this.record.options.map(cell => {
            cell.$value = cell.Value || ''
            delete cell.Value
            return cell
          })
  
          if (this.record.options[0].Text) {
            let key = Utils.getuuid()
    
            this.record.fields = [{
              $index: 1,
              align: 'left',
              color: 'rgba(0, 0, 0, 0.85)',
              field: 'Text',
              fontSize: 14,
              key: key,
              uuid: key
            }]
          }
        } else if (['multiselect', 'select', 'link', 'radio', 'checkbox'].includes(value)) {
          if (!this.record.options[0].Text && this.record.fields.length > 0) {
            let field = this.record.fields[0].field
    
            this.record.options = this.record.options.map(cell => {
              cell.Value = cell.Value || cell.$value || ''
              cell.Text = cell[field] || ''
    
              return cell
            })
          } else {
            this.record.options = this.record.options.map(cell => {
              cell.Value = cell.Value || cell.$value || ''
    
              return cell
            })
          }
        }
      })

      this.setState({linkSubFields: linkSubFields})
    }
  }

  onChange = (e, key) => {
    const { openType, compress } = this.state
    let value = e.target.value
    if (key === 'resourceType') {
      let _options = this.getOptions(openType, value, this.state.supField, this.state.display, this.state.enter, compress)
      
      this.setState({
        resourceType: value,
        formlist: this.state.formlist.map(form => {
          form.show = _options.includes(form.key)
          return form
        })
      })
    } else if (key === 'display') {
      let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, value, this.state.enter, compress)
      
      this.setState({
        display: value,
        formlist: this.state.formlist.map(form => {
          form.show = _options.includes(form.key)
          return form
        })
      })
    } else if (key === 'compress') {
      let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, this.state.display, this.state.enter, value)
      
      this.setState({
        compress: value,
        formlist: this.state.formlist.map(form => {
          form.show = _options.includes(form.key)
          return form
        })
      })
    } else if (key === 'enter') {
      let _options = this.getOptions(openType, this.state.resourceType, this.state.supField, this.state.display, value, compress)
      
      this.setState({
        enter: value,
        formlist: this.state.formlist.map(form => {
          form.show = _options.includes(form.key)
          return form
        })
      })
      }
    } else if (key === 'multiple') {
      if (value === 'true') {
        this.props.form.setFieldsValue({fieldlength: 512})
        this.record.fieldlength = 512
        _fieldval.fieldlength = 512
      } else {
        this.props.form.setFieldsValue({fieldlength: 50})
        this.record.fieldlength = 50
        _fieldval.fieldlength = 50
      }
    }

    this.record[key] = value

    let { shows, reOptions, reTypes, reRequired, reTooltip } = this.getMutilOptions()

    this.setState({
      formlist: this.state.formlist.map(item => {
        item.show = shows.includes(item.key)
        item.initVal = this.record[item.key]

        if (reOptions[item.key]) {
          item.options = reOptions[item.key]
        }
        if (reTypes[item.key]) {
          item.type = reTypes[item.key]
        }
        if (reRequired[item.key] !== undefined) {
          item.required = reRequired[item.key]
        }
        if (reTooltip[item.key] !== undefined) {
          item.tooltip = reTooltip[item.key]
        }

        return item
      })
    }, () => {
      this.props.form.setFieldsValue(_fieldval)
    })
  }

  multiselectChange = (key, value) => {
    if (key !== 'linkSubField') return

    this.record[key] = value
  }

  changeField = (data) => {
    this.setState({
      cFields: data,
      formlist: this.state.formlist.map(form => {
        if (form.key === 'fields') {
          form.initVal = data
        }
        return form
      })
    })
    this.record.fields = data || []
  }

  changeOptions = (data) => {
    this.record.options = data || []
  }

  changeVal = (val, type) => {
@@ -447,7 +511,6 @@
      }
    } 


    if (labelwidth) {
      this.props.form.setFieldsValue({labelwidth})
    }
@@ -461,287 +524,229 @@
    }
  }

  handleEmpty = () => {
    let field = this.props.form.getFieldValue('valueField')

    if (!field) {
      notification.warning({
        top: 92,
        message: '请填写值·字段。',
        duration: 5
      })
      return
    }

    let text = this.props.form.getFieldValue('valueText')

    if (!text) {
      notification.warning({
        top: 92,
        message: '请填写文本·字段。',
        duration: 5
      })
      return
    }

    let resource = this.props.form.getFieldValue('dataSource') || ''

    resource = `select '' as ${field},'全部' as ${text} union all \n${resource}`

    this.props.form.setFieldsValue({dataSource: resource})
  }

  getFields() {
    const { getFieldDecorator } = this.props.form
    const { openType } = this.state
    const { dict } = this.props
    const { transfield } = this.state
    const fields = []

    this.state.formlist.forEach((item, index) => {
      if (!item.show || item.forbid) return null

      if (item.type === 'text') { // 文本搜索
        let rules = []
      let span = 12
      let rules = []
      let className = ''
      let content = null
      let extra = null
      let initVal = item.initVal || ''

      if (item.type === 'text') {
        rules = [
          { required: item.required, message: dict['form.required.input'] + item.label + '!' },
          {
            pattern: /^[^']*$/ig,
            message: '不可使用英文状态的单引号！'
          }
        ]
        if (item.key === 'field') {
          rules = [{
          rules.push({
            pattern: formRule.field.pattern,
            message: formRule.field.message
          }, {
            max: formRule.field.max,
            message: formRule.field.maxMessage
          }]
          })
        } else if (item.max) {
          rules.push({
            max: item.max,
            message: `${item.label}最多${item.max}个字符`
          })
        } else {
          rules = [
            {
              max: formRule.input.max,
              message: formRule.input.message
            }
          ]
          rules.push({
            max: formRule.input.max,
            message: formRule.input.message
          })
        }
        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 + '!'
                  },
                  ...rules
                ]
              })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)}
            </Form.Item>
          </Col>
        )

        content = <Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />
      } else if (item.type === 'number') {
        rules = [
          { required: item.required, message: dict['form.required.input'] + item.label + '!' }
        ]
        initVal = item.initVal

        if (item.max) {
          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 || 0,
                  rules: [
                    {
                      required: !!item.required,
                      message: this.props.dict['form.required.input'] + item.label + '!'
                    }
                  ]
                })(<InputNumber onChange={(value) => this.changeVal(value, item.key)} min={item.min} max={item.max} precision={item.precision} onPressEnter={this.handleSubmit}/>)}
              </Form.Item>
            </Col>
          )
          content = <InputNumber onChange={(value) => this.changeVal(value, item.key)} min={item.min} max={item.max} precision={item.precision} onPressEnter={this.handleSubmit}/>
        } else {
          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 onPressEnter={this.handleSubmit}/>)}
              </Form.Item>
            </Col>
          )
          content = <InputNumber onPressEnter={this.handleSubmit}/>
        }
      } else if (item.type === 'select') { // 下拉搜索
        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 + '!'
                  }
                ]
              })(
                <Select
                  showSearch
                  filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0}
                  onChange={(value) => {this.openTypeChange(item.key, value)}}
                  getPopupContainer={() => document.getElementById('modal-fields-form-box')}
                >
                  {item.options.map((option, i) =>
                    <Select.Option key={`${i}`} value={option.value || option.field || ''}>
                      {option.text || option.label}
                    </Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
        )
      } else if (item.type === 'select') {
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]
        content = <Select
          showSearch
          allowClear={item.allowClear === true}
          filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
          onChange={(value) => {this.optionChange(item.key, value)}}
          getPopupContainer={() => document.getElementById('modal-fields-form-box')}
        >
          {item.options.map((option, i) =>
            <Select.Option key={`${i}`} value={option.value || option.field || ''}>
              {option.text || option.label}
            </Select.Option>
          )}
        </Select>
      } else if (item.type === 'multiselect') { // 多选
        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
              })(
                <Select
                  showSearch
                  mode="multiple"
                  filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                  onChange={(value) => this.multiselectChange(item.key, value, item.options)}
                >
                  {item.options.map((option, i) =>
                    <Select.Option key={i} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
        )
        content = <Select
          showSearch
          mode="multiple"
          filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
          onChange={(value) => this.multiselectChange(item.key, value)}
        >
          {item.options.map((option, i) =>
            <Select.Option key={i} value={option.field}>{option.label}</Select.Option>
          )}
        </Select>
      } else if (item.type === 'radio') {
        fields.push(
          <Col span={12} key={index}>
            <Form.Item label={item.tooltip ?
              <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} 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 + '!'
                  }
                ]
              })(
                <Radio.Group onChange={(e) => {this.onChange(e, item.key)}}>
                  {item.options.map(option => {
                    return (
                      <Radio key={option.value} value={option.value}>{option.text}</Radio>
                    )
                  })}
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
        )
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]
        initVal = item.initVal

        content = <Radio.Group style={{whiteSpace: 'nowrap'}} onChange={(e) => {this.optionChange(item.key, e.target.value)}}>
          {item.options.map(option => {
            return (
              <Radio key={option.value} value={option.value}>{option.text}</Radio>
            )
          })}
        </Radio.Group>
      } else if (item.type === 'checkbox') {
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]
        initVal = item.initVal

        content = <Checkbox.Group onChange={(values) => {this.optionChange(item.key, values)}}>
          {item.options.map(option => <Checkbox key={option.value} value={option.value}>{option.text}</Checkbox>)}
        </Checkbox.Group>
      } else if (item.type === 'codemirror') {
        fields.push(
          <Col span={24} key={index}>
            <Form.Item className="text-area" label={item.label}>
              {getFieldDecorator(item.key, {
                initialValue: item.initVal,
                rules: [
                  {
                    required: !!item.required,
                    message: this.props.dict['form.required.input'] + item.label + '!'
                  }
                ]
              })(<CodeMirror />)}
            </Form.Item>
          </Col>
        )
        rules = [
          { required: item.required, message: dict['form.required.input'] + item.label + '!' }
        ]
        span = 24
        className = 'text-area'

        if (this.record.type === 'select' || this.record.type === 'link') {
          extra = <span className="add-resource-empty" onClick={this.handleEmpty}>空</span>
        }

        content = <CodeMirror />
      } else if (item.type === 'textarea') {
        fields.push(
          <Col span={24} key={index}>
            <Form.Item className="text-msg" label={item.tooltip ?
              <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} 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 + '!'
                  }
                ]
              })(<TextArea rows={item.rows || 4} />)}
            </Form.Item>
          </Col>
        )
        span = 24
        className = 'text-msg'
        rules = [
          { required: item.required, message: dict['form.required.input'] + item.label + '!' }
        ]

        content = <TextArea rows={item.rows || 4}/>
      } else if (item.type === 'options') {
        if (openType !== 'checkcard') {
          fields.push(
            <Col span={24} key={index}>
              <Form.Item label={item.label} className="text-area">
                {getFieldDecorator(item.key, {
                  initialValue: item.initVal
                })(<EditTable type={openType} linkSubFields={this.state.linkSubFields}/>)}
              </Form.Item>
            </Col>
          )
        span = 24
        className = 'text-area'

        let type = this.record.type
        let linkSubFields = this.record.linkSubField || []
        
        if (type !== 'checkcard') {
          if (!['select', 'radio', 'link', 'cascader'].includes(type)) {
            linkSubFields = []
          }
          if (type === 'radio' && this.record.linkField) {
            type = 'link'
          } else if (type === 'cascader') {
            type = 'link'
            if (this.record.resourceType === '2') {        // 自定义资源
              linkSubFields = []
            }
          }
          content = <EditTable type={type} module="form" transfield={transfield} linkSubFields={linkSubFields} onChange={this.changeOptions}/>
        } else {
          fields.push(
            <Col span={24} key={index}>
              <Form.Item label={item.label} className="text-area">
                {getFieldDecorator(item.key, {
                  initialValue: item.initVal
                })(<DataTable dict={this.props.dict} type={this.state.display} fields={this.state.cFields}/>)}
              </Form.Item>
            </Col>
          )
          if (this.record.multiple === 'true') {
            linkSubFields = []
          }
          if (this.record.linkField) {
            type = 'link'
          }
          content = <DataTable dict={this.props.dict} type={type} display={this.record.display} linkSubFields={linkSubFields} transfield={transfield} fields={this.record.fields || []} onChange={this.changeOptions}/>
        }
      } else if (item.type === 'fields') {
        fields.push(
          <Col span={24} key={index}>
            <Form.Item label={item.label} className="text-area">
              {getFieldDecorator(item.key, {
                initialValue: item.initVal
              })(<FieldsTable dict={this.props.dict} onChange={this.changeField}/>)}
            </Form.Item>
          </Col>
        )
        span = 24
        className = 'text-area'
        rules = [
          { required: item.required, message: '请添加' + item.label + '!' }
        ]

        content = <FieldsTable onChange={this.changeField}/>
      } else if (item.type === 'color') {
        fields.push(
          <Col span={12} key={index}>
            <Form.Item label={item.label} className="color-form-item">
              {getFieldDecorator(item.key, {
                initialValue: item.initVal
              })(<ColorSketch allowClear={true}/>)}
            </Form.Item>
          </Col>
        )
        className = 'color-form-item'
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]

        content = <ColorSketch allowClear={true}/>
      } 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 allowClear />
              )}
            </Form.Item>
          </Col>
        )
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]

        content = <MkEditIcon allowClear />
      }

      fields.push(
        <Col span={span} key={index}>
          <Form.Item className={className} extra={extra} label={item.tooltip ?
            <Tooltip placement="topLeft" title={item.tooltip}>
              <QuestionCircleOutlined className="mk-form-tip" />
              {item.label}
            </Tooltip> : item.label
          }>
            {getFieldDecorator(item.key, {
              initialValue: initVal,
              rules: rules
            })(content)}
          </Form.Item>
        </Col>
      )
    })

    return fields
@@ -758,23 +763,91 @@
            if (values.resourceType === '0') {
              values.options = values.options || []
              values.dataSource = ''
              let empty = false
              let type = values.type
              if (values.type === 'radio' && values.linkField) {
                type = 'link'
              }

              values.options.forEach(op => {
                if (!((op.Value || op.Value === 0) && (op.Text || op.Text === 0))) {
                  empty = true
                } else if (values.type === 'link' && !(op.ParentID || op.ParentID === 0)) {
                  empty = true
                }
              })

              if (empty) {
              if (values.options.filter(op => op.Text === '').length > 0) {
                notification.warning({
                  top: 92,
                  message: '下拉选项设置错误！',
                  message: '提示文本（Text）不可为空！',
                  duration: 5
                })
                return
              } else if (values.options.filter(op => op.Value === '').length > 1) {
                notification.warning({
                  top: 92,
                  message: 'Value为空最多只可添加一行（在关联菜单中，Value为空时不区分ParentID）！',
                  duration: 5
                })
                return
              } else if (type === 'link') {
                let arr = values.options.map(m => m.ParentID + m.Value)
                let _arr = Array.from(new Set(arr))
                if (arr.length > _arr.length) {
                  notification.warning({
                    top: 92,
                    message: '同一ParentID中，Value值不可重复！',
                    duration: 5
                  })
                  return
                }
              } else {
                let arr = values.options.map(m => m.Value)
                let _arr = Array.from(new Set(arr))
                if (arr.length > _arr.length) {
                  notification.warning({
                    top: 92,
                    message: 'Value值不可重复！',
                    duration: 5
                  })
                  return
                }
              }
            } else {
              values.options = []
            }
          } else if (values.type === 'checkcard') {
            if (values.resourceType === '0') {
              values.options = values.options || []
              let linkSubFields = values.linkSubField || []
              values.options = values.options.map(m => {
                m.ParentID = m.ParentID || ''

                linkSubFields.forEach(n => {
                  m[n] = m[n] || ''
                })
                return m
              })

              let type = values.type
              if (values.linkField) {
                type = 'link'
              }

              if (type === 'link') {
                let arr = values.options.map(m => m.ParentID + m.$value)
                let _arr = Array.from(new Set(arr))
                if (arr.length > _arr.length) {
                  notification.warning({
                    top: 92,
                    message: '同一ParentID中，Value值不可重复！',
                    duration: 5
                  })
                  return
                }
              } else {
                let arr = values.options.map(m => m.$value)
                let _arr = Array.from(new Set(arr))
                if (arr.length > _arr.length) {
                  notification.warning({
                    top: 92,
                    message: 'Value值不可重复！',
                    duration: 5
                  })
                  return
                }
              }
            } else {
              values.options = []