import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { is, fromJS } from 'immutable'
|
import { Button, message, Tooltip } from 'antd'
|
|
import MKEmitter from '@/utils/events.js'
|
// import './index.scss'
|
|
class AutoMatic extends Component {
|
static propTpyes = {
|
autoMatic: PropTypes.object,
|
tabId: PropTypes.string,
|
config: PropTypes.object
|
}
|
|
state = {
|
running: false,
|
line: 1,
|
gap: 2000
|
}
|
|
timer = null
|
|
UNSAFE_componentWillMount() {
|
const { autoMatic, tabId } = this.props
|
|
if (autoMatic.gap && autoMatic.gap >= 1) {
|
this.setState({gap: autoMatic.gap * 1000})
|
}
|
|
if (tabId && tabId === sessionStorage.getItem('autoExecId')) {
|
sessionStorage.removeItem('autoExecId')
|
|
setTimeout(() => {
|
this.trigger()
|
}, 10000)
|
}
|
}
|
|
componentDidMount () {
|
MKEmitter.addListener('modifyTabs', this.breakOff)
|
MKEmitter.addListener('autoGetData', this.autoGetData)
|
MKEmitter.addListener('resetActiveMenu', this.breakOff)
|
MKEmitter.addListener('autoExecOver', this.autoExecOver)
|
MKEmitter.addListener('autoMaticOver', this.autoMaticOver)
|
MKEmitter.addListener('autoMaticError', this.autoMaticError)
|
MKEmitter.addListener('autoTransSelectData', this.autoTransSelectData)
|
}
|
|
shouldComponentUpdate (nextProps, nextState) {
|
return !is(fromJS(this.state), fromJS(nextState))
|
}
|
|
/**
|
* @description 组件销毁,清除state更新
|
*/
|
componentWillUnmount () {
|
this.setState = () => {
|
return
|
}
|
clearTimeout(this.timer)
|
MKEmitter.removeListener('modifyTabs', this.breakOff)
|
MKEmitter.removeListener('autoGetData', this.autoGetData)
|
MKEmitter.removeListener('resetActiveMenu', this.breakOff)
|
MKEmitter.removeListener('autoExecOver', this.autoExecOver)
|
MKEmitter.removeListener('autoMaticOver', this.autoMaticOver)
|
MKEmitter.removeListener('autoMaticError', this.autoMaticError)
|
MKEmitter.removeListener('autoTransSelectData', this.autoTransSelectData)
|
}
|
|
breakOff = () => {
|
if (this.state.running) {
|
this.setState({running: false})
|
clearTimeout(this.timer)
|
}
|
}
|
|
autoExecOver = (btnId, type) => {
|
const { autoMatic, config } = this.props
|
const { gap } = this.state
|
|
if (!this.state.running || btnId !== autoMatic.action) return
|
|
if (this.state.line >= 1000) {
|
this.breakOff()
|
} else if (type === 'error') {
|
if (autoMatic.onFail === 'next') {
|
this.setState({line: this.state.line + 1}, () => {
|
setTimeout(() => {
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, gap)
|
})
|
} else if (autoMatic.onFail === 'stay') {
|
setTimeout(() => {
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, gap)
|
} else {
|
this.setState({running: false})
|
}
|
} else {
|
if (autoMatic.onSuccess === 'next') {
|
this.setState({line: this.state.line + 1}, () => {
|
setTimeout(() => {
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, gap)
|
})
|
} else if (autoMatic.onSuccess === 'stay') {
|
setTimeout(() => {
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, gap)
|
} else {
|
this.setState({running: false})
|
}
|
}
|
}
|
|
autoTransSelectData = (MenuID, data) => {
|
const { config, autoMatic } = this.props
|
|
if (!this.state.running || MenuID !== config.MenuID) return
|
|
if (data.$disabled) {
|
this.setState({line: this.state.line + 1}, () => {
|
setTimeout(() => {
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, 100)
|
})
|
return
|
}
|
|
setTimeout(() => {
|
MKEmitter.emit('triggerBtnId', autoMatic.action, [data], 'autoMatic')
|
if (['prompt', 'pop'].includes(autoMatic.OpenType)) {
|
let delay = autoMatic.OpenType === 'pop' ? 2000 : 300
|
|
setTimeout(() => {
|
if (autoMatic.OpenType === 'prompt') {
|
let node = document.querySelector('.ant-modal-confirm-btns >.ant-btn-primary')
|
node && node.click()
|
} else if (autoMatic.OpenType === 'pop') {
|
let node = document.querySelector('.ant-modal-confirm-btns >.ant-btn-primary')
|
|
if (node) {
|
node.click()
|
} else {
|
MKEmitter.emit('triggerBtnPopSubmit', autoMatic.action)
|
}
|
}
|
}, delay)
|
}
|
}, 100)
|
}
|
|
autoMaticError = (MenuID) => {
|
const { config } = this.props
|
|
if (!this.state.running || MenuID !== config.MenuID) return
|
|
this.setState({running: false})
|
}
|
|
autoGetData = (MenuID) => {
|
const { config } = this.props
|
|
if (!this.state.running || MenuID !== config.MenuID) return
|
setTimeout(() => {
|
MKEmitter.emit('autoSelectData', config.MenuID, this.state.line)
|
}, 100)
|
}
|
|
trigger = () => {
|
const { config } = this.props
|
let running = !this.state.running
|
|
MKEmitter.emit('autoQueryData', config.MenuID, 1)
|
|
this.setState({running: running, line: 1})
|
clearTimeout(this.timer)
|
|
message.info('按Esc键终止运行。')
|
|
document.onkeydown = (event) => {
|
let e = event || window.event
|
|
if (e.key === 'Escape') {
|
this.breakOff()
|
}
|
}
|
}
|
|
autoMaticOver = (MenuID) => {
|
const { config, autoMatic, tabId } = this.props
|
|
if (!this.state.running || MenuID !== config.MenuID) return
|
|
this.setState({running: false})
|
|
if (autoMatic.onFinish !== 'over') {
|
let interval = autoMatic.interval * 1000 || 10
|
|
if (autoMatic.restart === 'refresh') {
|
this.timer = setTimeout(() => {
|
sessionStorage.setItem('ThirdMenu', tabId)
|
sessionStorage.setItem('autoExecId', tabId)
|
window.location.reload()
|
}, interval)
|
} else {
|
if (autoMatic.restart === 'first') {
|
this.setState({line: 1})
|
} else {
|
this.setState({line: this.state.line + 1})
|
}
|
|
this.timer = setTimeout(() => {
|
this.setState({running: true})
|
MKEmitter.emit('autoQueryData', config.MenuID, this.state.line)
|
}, interval)
|
}
|
}
|
}
|
|
render() {
|
const { running } = this.state
|
|
return (
|
<div className="tool-wrap">
|
<Tooltip placement="left" title="无人值守">
|
<Button icon={running ? 'pause' : 'forward'} shape="circle" onClick={this.trigger}/>
|
</Tooltip>
|
</div>
|
)
|
}
|
}
|
|
export default AutoMatic
|