| | |
| | | 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' |
| | |
| | | import './index.scss' |
| | | |
| | | const MutilForm = asyncSpinComponent(() => import('@/tabviews/zshare/mutilform')) |
| | | const NormalButton = asyncComponent(() => import('@/tabviews/zshare/actionList/normalbutton')) |
| | | |
| | | class NormalForm extends Component { |
| | | static propTpyes = { |
| | |
| | | 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 |
| | |
| | | _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(','), |
| | |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('reloadData', this.reloadData) |
| | | MKEmitter.addListener('mkFormSubmit', this.mkFormSubmit) |
| | | MKEmitter.addListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) |
| | | } |
| | |
| | | return |
| | | } |
| | | MKEmitter.removeListener('reloadData', this.reloadData) |
| | | MKEmitter.removeListener('mkFormSubmit', this.mkFormSubmit) |
| | | MKEmitter.removeListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) |
| | | } |
| | |
| | | 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] || {} |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | this.setState({ |
| | | activeKey: '', |
| | | data: _data, |
| | | data: _data || {}, |
| | | loading: false |
| | | }) |
| | | } else { |
| | |
| | | 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) => { |
| | |
| | | } |
| | | } |
| | | |
| | | 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}}> |
| | |
| | | } |
| | | {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> |
| | | ) |
| | | } |