import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { is, fromJS } from 'immutable'
|
import { Modal } from 'antd'
|
import { SettingOutlined } from '@ant-design/icons'
|
|
import VerifyCard from './verifycard'
|
import './index.scss'
|
|
class DataSource extends Component {
|
static propTpyes = {
|
config: PropTypes.any,
|
MenuID: PropTypes.string,
|
updateConfig: PropTypes.func
|
}
|
|
state = {
|
sourcelist: [],
|
visible: false,
|
loading: false,
|
setting: null
|
}
|
|
UNSAFE_componentWillMount () {
|
const { config } = this.props
|
|
this.setState({setting: fromJS(config.setting).toJS()})
|
}
|
|
shouldComponentUpdate (nextProps, nextState) {
|
return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
|
}
|
|
editDataSource = () => {
|
this.setState({
|
visible: true
|
})
|
}
|
|
verifySubmit = () => {
|
const { config } = this.props
|
|
this.setState({loading: true})
|
this.verifyRef.submitDataSource().then(res => {
|
if (window.GLOB.funcs && window.GLOB.funcs.length > 0) {
|
window.GLOB.funcs.forEach(m => {
|
let reg = new RegExp('\\$ex@' + m.func_code + '@ex\\$', 'ig')
|
res.scripts.forEach(item => {
|
item.sql = item.sql.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`)
|
})
|
if (res.setting.dataresource) {
|
res.setting.dataresource = res.setting.dataresource.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`)
|
}
|
})
|
}
|
|
res.show = config.setting.show || 'true'
|
res.advanceType = config.setting.advanceType || 'modal'
|
res.advanceWidth = config.setting.advanceWidth || 1000
|
res.drawerPlacement = config.setting.drawerPlacement || 'right'
|
res.searchRatio = config.setting.searchRatio || 6
|
res.searchLwidth = config.setting.searchLwidth !== undefined ? config.setting.searchLwidth : 33.3
|
|
this.setState({loading: false, visible: false})
|
this.props.updateConfig({...config, ...res})
|
}, () => {
|
this.setState({loading: false})
|
})
|
}
|
|
render () {
|
const { config } = this.props
|
const { visible, loading } = this.state
|
|
return (
|
<div className="model-datasource">
|
<SettingOutlined onClick={() => this.editDataSource()} />
|
<Modal
|
wrapClassName="mk-pop-modal"
|
visible={visible}
|
width={'75vw'}
|
maskClosable={false}
|
okText="提交"
|
onOk={this.verifySubmit}
|
confirmLoading={loading}
|
onCancel={() => { this.setState({ visible: false }) }}
|
destroyOnClose
|
>
|
<VerifyCard
|
config={config}
|
menuId={this.props.config.uuid}
|
searches={config.search}
|
wrappedComponentRef={(inst) => this.verifyRef = inst}
|
/>
|
</Modal>
|
</div>
|
)
|
}
|
}
|
|
export default DataSource
|