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'],
  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', 'linkSubField', 'span', 'labelwidth', 'tooltip', 'extra', 'setAll', 'emptyText', 'splitline', 'arrange', 'marginTop', 'marginBottom'],
  checkcard: ['initval', 'readonly', 'required', 'hidden', 'readin', 'resourceType', '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'],
  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']
@@ -117,7 +119,10 @@
    let reRequired = {}
    let reTooltip = {}

    if (type === 'hint' || type === 'split') {
    reRequired.field = true

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

@@ -141,6 +146,9 @@
      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 (this.record.resourceType === '0') {        // 自定义资源
        shows.push('options')
@@ -155,28 +163,53 @@
        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') {
      reRequired.fields = false
      if (this.record.display === 'picture') {
        if (this.record.resourceType === '0') {        // 自定义资源
          shows.push('options', 'ratio')
          shows.push('options', 'fields', 'picratio')
        } else if (this.record.resourceType === '1') { // 数据源
          shows.push('dataSource', 'cardValField', 'urlField', 'orderBy', 'orderType', 'disableField', 'database', 'ratio')
          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 {
        reRequired.fields = true
        if (this.record.resourceType === '0') {        // 自定义资源
          shows.push('options', 'fields', 'backgroundColor')
          shows.push('options', 'fields', 'selectStyle')
        } else if (this.record.resourceType === '1') { // 数据源
          shows.push('dataSource', 'cardValField', 'fields', 'orderBy', 'orderType', 'disableField', 'database', 'backgroundColor')
          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')
        shows.push('linkField')
        reRequired.linkField = 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') {
        shows.push('hidelabel')
@@ -197,9 +230,77 @@
    } else if (type === 'fileupload') {
      if (this.record.compress === 'true') {
        shows.push('limit', 'rduri', 'proRduri')
      } else {
      } 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 === '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 === 'brafteditor') {
      reOptions.encryption = [{
        value: 'false',
        text: '无'
      }, {
        value: 'true',
        text: 'base64加密'
      }]
    } else {
      reOptions.encryption = [{
        value: 'false',
        text: '无'
      }, {
        value: 'true',
        text: 'base64加密'
      }, {
        value: 'md5',
        text: 'md5加密'
      }]
    }

    if (['multiselect', 'checkbox'].includes(type)) {
@@ -208,7 +309,7 @@
      reTooltip.initval = '使用$first表示默认选择第一项。'
    }

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

@@ -267,6 +368,16 @@
      if (value === 'linkMain') {
        this.record.hidden = 'true'
        _fieldval.hidden = 'true'
      }
      
      if (this.record.type === 'cascader' && value !== 'cascader') {
        this.record.linkField = ''
        _fieldval.linkField = ''

        if (this.record.resourceType === '2') {
          this.record.resourceType = '0'
          _fieldval.resourceType = '0'
        }
      }

      if (this.record.options.length > 0) {
@@ -413,6 +524,36 @@
    }
  }

  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 { dict } = this.props
@@ -426,11 +567,16 @@
      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 + '!' }
          { required: item.required, message: dict['form.required.input'] + item.label + '!' },
          {
            pattern: /^[^']*$/ig,
            message: '不可使用英文状态的单引号！'
          }
        ]
        if (item.key === 'field') {
          rules.push({
@@ -439,6 +585,11 @@
          }, {
            max: formRule.field.max,
            message: formRule.field.maxMessage
          })
        } else if (item.max) {
          rules.push({
            max: item.max,
            message: `${item.label}最多${item.max}个字符`
          })
        } else {
          rules.push({
@@ -466,7 +617,7 @@
        content = <Select
          showSearch
          allowClear={item.allowClear === true}
          filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0}
          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')}
        >
@@ -491,20 +642,34 @@
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]
        initVal = item.initVal

        content = <Radio.Group onChange={(e) => {this.optionChange(item.key, e.target.value)}}>
        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') {
        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') {
@@ -523,13 +688,18 @@
        let linkSubFields = this.record.linkSubField || []
        
        if (type !== 'checkcard') {
          if (!['select', 'radio', 'link'].includes(type)) {
          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} transfield={transfield} linkSubFields={linkSubFields} onChange={this.changeOptions}/>
          content = <EditTable type={type} module="form" transfield={transfield} linkSubFields={linkSubFields} onChange={this.changeOptions}/>
        } else {
          if (this.record.multiple === 'true') {
            linkSubFields = []
@@ -542,10 +712,16 @@
      } else if (item.type === 'fields') {
        span = 24
        className = 'text-area'
        rules = [
          { required: item.required, message: '请添加' + item.label + '!' }
        ]

        content = <FieldsTable dict={this.props.dict} onChange={this.changeField}/>
        content = <FieldsTable onChange={this.changeField}/>
      } else if (item.type === 'color') {
        className = 'color-form-item'
        rules = [
          { required: item.required, message: dict['form.required.select'] + item.label + '!' }
        ]

        content = <ColorSketch allowClear={true}/>
      } else if (item.type === 'icon') {
@@ -558,7 +734,7 @@

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