| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Button, Modal, notification, Icon, Drawer } from 'antd' |
| | | import { Button, Modal, notification, Drawer } from 'antd' |
| | | |
| | | import asyncSpinComponent from '@/utils/asyncSpinComponent' |
| | | import zhCN from '@/locales/zh-CN/main.js' |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import MkIcon from '@/components/mk-icon' |
| | | import './index.scss' |
| | | |
| | | const SubTabTable = asyncSpinComponent(() => import('@/tabviews/subtabtable')) |
| | |
| | | class PopupButton extends Component { |
| | | static propTpyes = { |
| | | show: PropTypes.any, // 按钮显示样式控制 |
| | | position: PropTypes.any, // 按钮位置,工具栏为toolbar |
| | | BID: PropTypes.string, // 主表ID |
| | | BData: PropTypes.any, // 主表数据 |
| | | selectedData: PropTypes.any, // 子表中选择数据 |
| | |
| | | MenuID: PropTypes.string, // 菜单ID |
| | | btn: PropTypes.object, // 按钮 |
| | | setting: PropTypes.any, // 页面通用设置 |
| | | disabled: PropTypes.any, // 行按钮禁用 |
| | | lineId: PropTypes.any, // 行索引+主键值,用于行按钮双击 |
| | | } |
| | | |
| | | state = { |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { btn, selectedData } = this.props |
| | | const { btn, selectedData, BData } = this.props |
| | | let disabled = false |
| | | |
| | | if (btn.controlField && selectedData && selectedData.length > 0) { // 表格中按钮隐藏控制 |
| | |
| | | } |
| | | }) |
| | | this.setState({disabled, hidden: disabled && btn.control === 'hidden'}) |
| | | } else if (btn.control === 'parent') { |
| | | if (!BData || !BData.hasOwnProperty(btn.controlField)) { |
| | | this.setState({hidden: true}) |
| | | } else { |
| | | let s = BData[btn.controlField] + '' |
| | | if (s === btn.controlVal || (btn.controlVal && btn.controlVal.split(',').includes(s))) { |
| | | this.setState({hidden: true}) |
| | | } else { |
| | | this.setState({hidden: false}) |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (this.props.disabled || disabled) { |
| | | this.setState({disabled: true}) |
| | | } |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('popclose', this.popclose) |
| | | MKEmitter.addListener('popclose', this.syspopclose) |
| | | MKEmitter.addListener('triggerBtnId', this.actionTrigger) |
| | | MKEmitter.addListener('openNewTab', this.openNewTab) |
| | | MKEmitter.addListener('refreshPopButton', this.refreshPopButton) |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps (nextProps) { |
| | | const { btn, selectedData } = this.props |
| | | const { btn, selectedData, BData } = this.props |
| | | |
| | | let disabled = false |
| | | if (btn.controlField && !is(fromJS(nextProps.selectedData || []), fromJS(selectedData || []))) { |
| | | let disabled = false |
| | | |
| | | if (nextProps.selectedData && nextProps.selectedData.length > 0) { // 表格中按钮隐藏控制 |
| | | nextProps.selectedData.forEach(item => { |
| | | let s = item[btn.controlField] + '' |
| | |
| | | } |
| | | }) |
| | | } |
| | | this.setState({disabled, hidden: disabled && btn.control === 'hidden'}) |
| | | this.setState({hidden: disabled && btn.control === 'hidden'}) |
| | | } else if (btn.control === 'parent' && !is(fromJS(nextProps.BData || {}), fromJS(BData || {}))) { |
| | | if (!nextProps.BData || !nextProps.BData.hasOwnProperty(btn.controlField)) { |
| | | this.setState({hidden: true}) |
| | | } else { |
| | | let s = nextProps.BData[btn.controlField] + '' |
| | | if (s === btn.controlVal || (btn.controlVal && btn.controlVal.split(',').includes(s))) { |
| | | this.setState({hidden: true}) |
| | | } else { |
| | | this.setState({hidden: false}) |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (nextProps.disabled || disabled) { |
| | | this.setState({disabled: true}) |
| | | } else { |
| | | this.setState({disabled: false}) |
| | | } |
| | | } |
| | | |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('popclose', this.popclose) |
| | | MKEmitter.removeListener('popclose', this.syspopclose) |
| | | MKEmitter.removeListener('openNewTab', this.openNewTab) |
| | | MKEmitter.removeListener('triggerBtnId', this.actionTrigger) |
| | | MKEmitter.removeListener('refreshPopButton', this.refreshPopButton) |
| | |
| | | const { setting, Tab, BID, btn, selectedData } = this.props |
| | | const { loading, disabled } = this.state |
| | | |
| | | if ((triggerId && btn.uuid !== triggerId) || loading || disabled) return |
| | | if (loading || disabled) return |
| | | if (triggerId) { |
| | | if (btn.uuid !== triggerId) return |
| | | if (this.props.lineId && record && record[0] && this.props.lineId !== record[0].$$key) { |
| | | return |
| | | } |
| | | } |
| | | |
| | | if (((Tab && Tab.supMenu) || setting.supModule) && !BID) { |
| | | notification.warning({ |
| | |
| | | } |
| | | } |
| | | |
| | | syspopclose = () => { |
| | | if (!this.state.visible) return |
| | | |
| | | this.popclose() |
| | | } |
| | | |
| | | /** |
| | | * @description 弹窗关闭 |
| | | */ |
| | |
| | | className={'popview-modal ' + (btn.$view === 'CustomPage' ? 'custom-popview' : '')} |
| | | title={btn.label} |
| | | width={ratio} |
| | | maskClosable={false} |
| | | maskClosable={btn.clickouter === 'close'} |
| | | visible={visible} |
| | | onCancel={this.popclose} |
| | | footer={[ |
| | |
| | | return ( |
| | | <Drawer |
| | | title={btn.label} |
| | | className={btn.$view === 'CustomPage' ? 'custom-drawer-popview' : ''} |
| | | className={btn.$view === 'CustomPage' ? 'custom-drawer-popview' : 'table-drawer-popview'} |
| | | width={width} |
| | | height={height} |
| | | maskClosable={false} |
| | | maskClosable={btn.clickouter === 'close'} |
| | | onClose={this.popclose} |
| | | visible={visible} |
| | | placement={btn.placement || 'right'} |
| | |
| | | label = btn.label |
| | | icon = btn.icon || '' |
| | | } else if (show === 'link') { |
| | | label = <span>{btn.label}{btn.icon ? <Icon style={{marginLeft: '8px'}} type={btn.icon}/> : ''}</span> |
| | | label = <span>{btn.label}{btn.icon ? <MkIcon style={{marginLeft: '8px'}} type={btn.icon}/> : ''}</span> |
| | | icon = '' |
| | | } else if (show === 'icon') { |
| | | icon = btn.icon || '' |