2022-01-21

king

2022-01-21 46f79b491173d284a4900d19e7aecf7509481438

 src/tabviews/zshare/mutilform/mkRadio/index.jsx

@@ -1,6 +1,9 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { Radio } from 'antd'

import MKEmitter from '@/utils/events.js'

class MKRadio extends Component {
  static propTpyes = {
@@ -9,27 +12,132 @@
  }

  state = {
    defaultValue: this.props.config.initval
    value: '',
    config: null,
    options: []
  }

  onChange = (e) => {
    let value = e.target.value
    this.props.onChange(value)
  UNSAFE_componentWillMount () {
    const { config } = this.props
    let value = config.initval

    if (value) {
      let option = null
      option= config.oriOptions[0]
      if (typeof(value) === 'string' && option && typeof(option.value) === 'number') {
        value = +value
        if (isNaN(value)) {
          value = config.initval
        }
      }
    }

    this.setState({
      config: fromJS(config).toJS(),
      options: fromJS(config.options).toJS(),
      value,
    })
  }

  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS(this.state), fromJS(nextState))
  }

  UNSAFE_componentWillReceiveProps (nextProps) {
    const { config } = this.state

    if (!is(fromJS(config.oriOptions), fromJS(nextProps.config.oriOptions))) {
      this.setState({
        config: fromJS(nextProps.config).toJS(),
        options: fromJS(nextProps.config.options).toJS()
      })

      if (typeof(config.initval) === 'string' && config.initval.indexOf('$first') > -1) {
        this.setState({
          value: nextProps.config.initval,
        })
      }
    }
  }

  componentDidMount () {
    MKEmitter.addListener('mkFP', this.mkFormHandle)
  }

  componentWillUnmount () {
    this.setState = () => {
      return
    }
    MKEmitter.removeListener('mkFP', this.mkFormHandle)
  }

  mkFormHandle = (uuid, parentId, level) => {
    if (uuid !== this.state.config.uuid) return

    const { config } = this.state

    let options = config.oriOptions.filter(option => option.ParentID === parentId || option.value === '')
    let _option = options[0] && !options[0].$disabled ? options[0] : null
    let val = _option ? _option.value : ''

    this.setState({
      options,
      value: val
    })

    let other = {}

    if (config.subFields && _option) {
      config.subFields.forEach((n, i) => {
        other[n.field] = _option[n.field]
        setTimeout(() => {
          MKEmitter.emit('mkFC', 'input', n.uuid, _option[n.field])
        }, i * 5)
      })
    }

    this.props.onChange(val, other)

    if (level < 7 && config.linkFields) {
      config.linkFields.forEach((m, i) => {
        setTimeout(() => {
          MKEmitter.emit('mkFP', m.uuid, val, level + 1)
        }, (i + 1) * 70)
      })
    }
  }

  onChange = (val) => {
    const { config } = this.state
    let other = {}

    if (config.subFields) {
      let option = this.state.options.filter(m => m.value === val)[0]
      option && config.subFields.forEach((n, i) => {
        other[n.field] = option[n.field]
        setTimeout(() => {
          MKEmitter.emit('mkFC', 'input', n.uuid, option[n.field])
        }, i * 5)
      })
    }
    if (config.linkFields) {
      config.linkFields.forEach((m, i) => {
        setTimeout(() => {
          MKEmitter.emit('mkFP', m.uuid, val, 0)
        }, (i + 1) * 100)
      })
    }

    this.props.onChange(val, other)
    this.setState({value: val})
  }

  render() {
    const { config } = this.props
    const { defaultValue } = this.state
    const { value, options, config } = this.state

    return (
      <Radio.Group defaultValue={defaultValue} disabled={config.readonly} onChange={this.onChange}>
        {config.options.map(option => <Radio key={option.key} disabled={option.$disabled} value={option.value}>{option.label}</Radio>)}
      <Radio.Group value={value} disabled={config.readonly} onChange={(e) => this.onChange(e.target.value)}>
        {options.map(option => <Radio key={option.key} disabled={option.$disabled} value={option.value}>{option.label}</Radio>)}
      </Radio.Group>
    )
  }