import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { fromJS } from 'immutable'
|
import { Form, notification, Tabs } from 'antd'
|
|
import asyncComponent from '@/utils/asyncComponent'
|
import BaseForm from './baseform'
|
import zhCN from '@/locales/zh-CN/model.js'
|
import enUS from '@/locales/en-US/model.js'
|
import './index.scss'
|
|
const { TabPane } = Tabs
|
const SimpleScript = asyncComponent(() => import('./simplescript'))
|
|
class SettingForm extends Component {
|
static propTpyes = {
|
config: PropTypes.object, // 页面配置信息
|
}
|
|
state = {
|
dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
|
formlist: [],
|
btnloading: false,
|
activeKey: 'setting',
|
setting: null,
|
defaultSql: '',
|
status: {}
|
}
|
|
UNSAFE_componentWillMount() {
|
const { config } = this.props
|
|
let _setting = fromJS(config).toJS()
|
let _preScripts = _setting.preScripts || []
|
let _cbScripts = _setting.cbScripts || []
|
|
this.setState({
|
setting: _setting,
|
preScripts: _preScripts,
|
cbScripts: _cbScripts,
|
status: fromJS(_setting).toJS()
|
})
|
}
|
|
|
handleConfirm = () => {
|
const { activeKey, setting, preScripts, cbScripts } = this.state
|
|
let _loading = false
|
if (this.preScriptsForm && this.preScriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.preScriptsForm.props.form.getFieldValue('sql'))) {
|
_loading = true
|
} else if (this.cbScriptsForm && this.cbScriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.cbScriptsForm.props.form.getFieldValue('sql'))) {
|
_loading = true
|
}
|
|
if (_loading) {
|
notification.warning({
|
top: 92,
|
message: '存在未保存脚本，请点击确定保存，或点击取消放弃修改！',
|
duration: 5
|
})
|
return Promise.reject()
|
}
|
|
// 表单提交时检查输入值是否正确
|
if (activeKey === 'setting') {
|
return new Promise((resolve, reject) => {
|
this.settingForm.handleConfirm().then(res => {
|
resolve({...res, preScripts, cbScripts})
|
}, () => {
|
reject()
|
})
|
})
|
} else {
|
return new Promise((resolve) => {
|
resolve({...setting, preScripts, cbScripts})
|
})
|
}
|
}
|
|
// 标签切换
|
changeTab = (val) => {
|
const { activeKey } = this.state
|
|
let _loading = false
|
if (this.preScriptsForm && this.preScriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.preScriptsForm.props.form.getFieldValue('sql'))) {
|
_loading = true
|
} else if (this.cbScriptsForm && this.cbScriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.cbScriptsForm.props.form.getFieldValue('sql'))) {
|
_loading = true
|
}
|
|
if (_loading) {
|
notification.warning({
|
top: 92,
|
message: '存在未保存脚本，请点击确定保存，或点击取消放弃修改！',
|
duration: 5
|
})
|
return
|
}
|
|
if (activeKey === 'setting') {
|
this.settingForm.handleConfirm().then(res => {
|
this.setState({
|
setting: res,
|
activeKey: val
|
})
|
})
|
} else {
|
this.setState({
|
activeKey: val
|
})
|
}
|
}
|
|
// 前置脚本更新
|
preScriptsUpdate = (preScripts) => {
|
this.setState({preScripts})
|
}
|
|
// 后置脚本更新
|
cbScriptsUpdate = (cbScripts) => {
|
this.setState({cbScripts})
|
}
|
|
updateStatus = (status) => {
|
this.setState({status: {...this.state.status, ...status}})
|
}
|
|
render() {
|
const { dict, activeKey, setting, preScripts, cbScripts, status } = this.state
|
|
return (
|
<div className="model-interface-form-box" id="model-interface-form-body">
|
<Tabs activeKey={activeKey} onChange={this.changeTab}>
|
<TabPane tab="接口设置" key="setting">
|
<BaseForm
|
dict={dict}
|
setting={setting}
|
updateStatus={this.updateStatus}
|
wrappedComponentRef={(inst) => this.settingForm = inst}
|
/>
|
</TabPane>
|
<TabPane tab={
|
<span>
|
前置脚本
|
{preScripts.length ? <span className="count-tip">{preScripts.length}</span> : null}
|
</span>
|
} disabled={status.procMode !== 'script'} key="prescripts">
|
<SimpleScript
|
dict={dict}
|
type="front"
|
setting={setting}
|
scripts={preScripts}
|
scriptsUpdate={this.preScriptsUpdate}
|
wrappedComponentRef={(inst) => this.preScriptsForm = inst}
|
/>
|
</TabPane>
|
<TabPane tab={
|
<span>
|
回调脚本
|
{cbScripts.length ? <span className="count-tip">{cbScripts.length}</span> : null}
|
</span>
|
} disabled={status.callbackType !== 'script'} key="cbscripts">
|
<SimpleScript
|
dict={dict}
|
type="back"
|
setting={setting}
|
scripts={cbScripts}
|
scriptsUpdate={this.cbScriptsUpdate}
|
wrappedComponentRef={(inst) => this.cbScriptsForm = inst}
|
/>
|
</TabPane>
|
</Tabs>
|
</div>
|
)
|
}
|
}
|
|
export default Form.create()(SettingForm)
|
