king
2021-03-24 abe57d274e6b12c3612788e0be3d1b9201852ebd
src/tabviews/custom/components/form/normal-form/index.jsx
@@ -2,13 +2,13 @@
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { connect } from 'react-redux'
import { Spin, notification } from 'antd'
import { Spin, notification, Button } from 'antd'
// import moment from 'moment'
import Api from '@/api'
// import Utils from '@/utils/utils.js'
import UtilsDM from '@/utils/utils-datamanage.js'
// import asyncComponent from '@/utils/asyncComponent'
import asyncComponent from '@/utils/asyncComponent'
import asyncSpinComponent from '@/utils/asyncSpinComponent'
import MKEmitter from '@/utils/events.js'
import zhCN from '@/locales/zh-CN/main.js'
@@ -17,6 +17,7 @@
import './index.scss'
const MutilForm = asyncSpinComponent(() => import('@/tabviews/zshare/mutilform'))
const NormalButton = asyncComponent(() => import('@/tabviews/zshare/actionList/normalbutton'))
class NormalForm extends Component {
  static propTpyes = {
@@ -34,22 +35,23 @@
    loading: false,            // 数据加载状态
    activeKey: '',             // 选中数据
    sync: false,               // 是否统一请求数据
    data: {},                  // 数据
    group: null
    data: null,                  // 数据
    group: null,
    step: 0
  }
  UNSAFE_componentWillMount () {
    const { data, BID, config } = this.props
    let _data = {}
    let _data = null
    let _sync = false
    
    if (config.setting && config.wrap.datatype !== 'static') {
      _sync = config.setting.sync === 'true'
      if (_sync && data) {
        _data = data[config.dataName] || {}
        if (_data && Array.isArray(_data)) {
      if (_sync && data && data[config.dataName]) {
        _data = data[config.dataName]
        if (Array.isArray(_data)) {
          _data = _data[0] || {}
        }
        _sync = false
@@ -58,10 +60,20 @@
      _data = {}
    }
    config.subcards = config.subcards.map(group => {
      group.subButton.uuid = group.uuid
      group.subButton.Ot = 'requiredSgl'
      group.subButton.btnstyle = group.subButton.style
      group.subButton.OpenType = 'formSubmit'
      return group
    })
    this.setState({
      sync: _sync,
      data: _data,
      group: config.subcards[0],
      step: 0,
      BID: BID || '',
      config: config,
      arr_field: config.columns.map(col => col.field).join(','),
@@ -74,6 +86,7 @@
  componentDidMount () {
    MKEmitter.addListener('reloadData', this.reloadData)
    MKEmitter.addListener('mkFormSubmit', this.mkFormSubmit)
    MKEmitter.addListener('resetSelectLine', this.resetParentParam)
    MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult)
  }
@@ -87,6 +100,7 @@
      return
    }
    MKEmitter.removeListener('reloadData', this.reloadData)
    MKEmitter.removeListener('mkFormSubmit', this.mkFormSubmit)
    MKEmitter.removeListener('resetSelectLine', this.resetParentParam)
    MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult)
  }
@@ -101,8 +115,8 @@
      let _data = {}
      if (nextProps.data && nextProps.data[config.dataName]) {
        _data = nextProps.data[config.dataName]
        if (_data && Array.isArray(_data)) {
          _data = _data[0]
        if (Array.isArray(_data)) {
          _data = _data[0] || {}
        }
      }
@@ -203,7 +217,7 @@
      this.setState({
        activeKey: '',
        data: _data,
        data: _data || {},
        loading: false
      })
    } else {
@@ -216,20 +230,6 @@
        duration: 10
      })
    }
  }
  changeCard = (index, item) => {
    const { config, data, activeKey } = this.state
    this.openView(item)
    if (!config.wrap.cardType || activeKey === index) return
    this.setState({
      activeKey: index
    })
    MKEmitter.emit('resetSelectLine', config.uuid, (item.setting.primaryId || ''), data)
  }
  openView = (item) => {
@@ -294,9 +294,38 @@
    }
  }
  mkFormSubmit = (btnId) => {
    const { group } = this.state
    if (group.uuid !== btnId) return
    this.formRef.handleConfirm().then(res => {
      MKEmitter.emit('triggerFormSubmit', {menuId: btnId, form: res})
    })
  }
  prevStep = () => {
    const { config, group } = this.state
    let _group = config.subcards.filter(item => item.sort === (group.sort - 1))[0]
    this.setState({group: null, step: group.sort - 2}, () => {
      this.setState({group: _group})
    })
  }
  nextStep = () => {
    const { config, group } = this.state
    let _group = config.subcards.filter(item => item.sort === (group.sort + 1))[0]
    this.setState({group: null, step: group.sort}, () => {
      this.setState({group: _group})
    })
  }
  render() {
    const { config, loading, BID, data, group } = this.state
    const { config, loading, BID, data, group, dict, step } = this.state
    return (
      <div className="custom-normal-form-box" style={{...config.style}}>
@@ -308,20 +337,34 @@
        }
        {config.subcards.length > 1 ? <div className="mk-normal-form-title">
          {config.subcards.map(card => (
            <div key={card.uuid} className="form-title">
              <span className="form-sort">{card.sort}</span>
            <div key={card.uuid} className={'form-title' + (card.sort <= step ? ' active' : '')}>
              <span className="form-sort" style={{background: config.wrap.color}}>{card.sort}</span>
              <span className="before-line" style={{background: config.wrap.color}}></span>
              <span className="after-line" style={{background: config.wrap.color}}></span>
              {card.setting.title}
            </div>))
          }
        </div> : null}
        <MutilForm
        {group && data ? <MutilForm
          BID={BID}
          dict={dict}
          data={data}
          dict={this.state.dict}
          action={group}
          inputSubmit={this.handleOk}
          wrappedComponentRef={(inst) => this.formRef = inst}
        />
        /> : null}
        {group && data ? <div className="mk-form-action">
          {group.sort !== 1 ? <Button type="link" className="prev" onClick={this.prevStep} style={group.prevButton.style}>{group.prevButton.label}</Button> : null}
          <NormalButton
            BID={BID}
            position="form"
            btn={group.subButton}
            setting={config.setting}
            columns={config.columns}
            selectedData={[data]}
          />
          {group.nextButton.enable === 'true' && group.sort !== config.subcards.length ? <Button type="link" className="skip" onClick={this.nextStep} style={group.nextButton.style}>{group.nextButton.label}</Button> : null}
        </div> : null}
      </div>
    )
  }