From bde2916433c7830e2879e6524e32b9f6c8bd0bab Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期日, 02 一月 2022 16:31:32 +0800 Subject: [PATCH] 2022-01-02 --- src/tabviews/zshare/actionList/popupbutton/index.jsx | 200 ++++++++++++++++++++++++++++++++++++------------- 1 files changed, 147 insertions(+), 53 deletions(-) diff --git a/src/tabviews/zshare/actionList/popupbutton/index.jsx b/src/tabviews/zshare/actionList/popupbutton/index.jsx index a797d90..19e2982 100644 --- a/src/tabviews/zshare/actionList/popupbutton/index.jsx +++ b/src/tabviews/zshare/actionList/popupbutton/index.jsx @@ -1,13 +1,13 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import {connect} from 'react-redux' import { is, fromJS } from 'immutable' -import { Button, Modal, notification, Icon } 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')) @@ -16,7 +16,6 @@ class PopupButton extends Component { static propTpyes = { show: PropTypes.any, // 鎸夐挳鏄剧ず鏍峰紡鎺у埗 - position: PropTypes.any, // 鎸夐挳浣嶇疆锛屽伐鍏锋爮涓簍oolbar BID: PropTypes.string, // 涓昏〃ID BData: PropTypes.any, // 涓昏〃鏁版嵁 selectedData: PropTypes.any, // 瀛愯〃涓�夋嫨鏁版嵁 @@ -24,6 +23,7 @@ MenuID: PropTypes.string, // 鑿滃崟ID btn: PropTypes.object, // 鎸夐挳 setting: PropTypes.any, // 椤甸潰閫氱敤璁剧疆 + disabled: PropTypes.any, // 琛屾寜閽鐢� } state = { @@ -32,11 +32,12 @@ popData: null, primaryId: '', disabled: false, + hidden: false, loading: false, } UNSAFE_componentWillMount () { - const { btn, selectedData } = this.props + const { btn, selectedData, BData } = this.props let disabled = false if (btn.controlField && selectedData && selectedData.length > 0) { // 琛ㄦ牸涓寜閽殣钘忔帶鍒� @@ -46,7 +47,22 @@ disabled = true } }) - this.setState({disabled}) + 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}) } } @@ -55,21 +71,17 @@ } componentDidMount () { - const { position } = this.props - - if (position === 'toolbar') { - MKEmitter.addListener('triggerBtnId', this.actionTrigger) - } + 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] + '' @@ -78,7 +90,24 @@ } }) } - this.setState({disabled}) + 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}) } } @@ -86,6 +115,7 @@ this.setState = () => { return } + MKEmitter.removeListener('popclose', this.syspopclose) MKEmitter.removeListener('openNewTab', this.openNewTab) MKEmitter.removeListener('triggerBtnId', this.actionTrigger) MKEmitter.removeListener('refreshPopButton', this.refreshPopButton) @@ -122,11 +152,11 @@ /** * @description 瑙﹀彂鎸夐挳鎿嶄綔 */ - actionTrigger = (triggerId, record) => { + actionTrigger = (triggerId, record, type) => { const { setting, Tab, BID, btn, selectedData } = this.props - const { loading } = this.state + const { loading, disabled } = this.state - if ((triggerId && btn.uuid !== triggerId) || loading) return + if ((triggerId && btn.uuid !== triggerId) || loading || disabled) return if (((Tab && Tab.supMenu) || setting.supModule) && !BID) { notification.warning({ @@ -135,6 +165,10 @@ duration: 5 }) return + } else if (type === 'linkbtn' && selectedData && selectedData.length === 1) { + if (record[0].$Index !== selectedData[0].$Index) { + return + } } let data = record || selectedData || [] @@ -176,6 +210,12 @@ } } + syspopclose = () => { + if (!this.state.visible) return + + this.popclose() + } + /** * @description 寮圭獥鍏抽棴 */ @@ -192,9 +232,95 @@ } } + getPop = () => { + const { btn } = this.props + const { popData, primaryId, visible } = this.state + + let ratio = btn.ratio || 85 + + if (btn.display !== 'drawer') { + if (ratio > 100) { + ratio = ratio + 'px' + } else { + ratio = ratio + 'vw' + } + return <Modal + className={'popview-modal ' + (btn.$view === 'CustomPage' ? 'custom-popview' : '')} + title={btn.label} + width={ratio} + maskClosable={btn.clickouter === 'close'} + visible={visible} + onCancel={this.popclose} + footer={[ + <Button key="close" onClick={this.popclose}>{this.state.dict['main.close']}</Button> + ]} + destroyOnClose + > + {btn.$view !== 'CustomPage' ? <SubTabTable + Tab={btn} + MenuID={btn.linkTab} + SupMenuID={this.props.MenuID} + BID={popData ? primaryId : this.props.BID} + BData={popData || this.props.BData} + /> : null} + {btn.$view === 'CustomPage' ? <CustomPage Tab={btn} MenuID={btn.uuid} param={{$BID: (popData ? primaryId : this.props.BID), ...(popData || this.props.BData || {})}} /> : null} + </Modal> + } else { + let height = '100vh' + let width = '100vw' + if (btn.placement === 'top' || btn.placement === 'bottom') { + if (ratio > 100) { + ratio = ratio + 'px' + } else { + ratio = ratio + 'vh' + } + + height = ratio + } else { + if (ratio > 100) { + ratio = ratio + 'px' + } else { + ratio = ratio + 'vw' + } + + width = ratio + } + + return ( + <Drawer + title={btn.label} + className={btn.$view === 'CustomPage' ? 'custom-drawer-popview' : 'table-drawer-popview'} + width={width} + height={height} + maskClosable={btn.clickouter === 'close'} + onClose={this.popclose} + visible={visible} + placement={btn.placement || 'right'} + destroyOnClose + > + {btn.$view !== 'CustomPage' ? <SubTabTable + Tab={btn} + MenuID={btn.linkTab} + SupMenuID={this.props.MenuID} + BID={popData ? primaryId : this.props.BID} + BData={popData || this.props.BData} + /> : null} + {btn.$view === 'CustomPage' ? <CustomPage Tab={btn} MenuName={btn.label} MenuID={btn.uuid} param={{$BID: (popData ? primaryId : this.props.BID), ...(popData || this.props.BData || {})}} /> : null} + <div className="close-drawer"> + <Button onClick={this.popclose}> + 鍏抽棴 + </Button> + </div> + </Drawer> + ) + } + } + render() { const { btn, show } = this.props - const { loading, popData, primaryId, disabled } = this.state + const { loading, disabled, hidden } = this.state + + if (hidden) return null let label = '' let icon = '' @@ -203,11 +329,10 @@ label = btn.label icon = btn.icon || '' } else if (show === 'link') { - label = <span>{btn.label}{btn.icon ? <Icon 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 || '' - // } else if (show === 'text') { } else { label = btn.label } @@ -230,40 +355,9 @@ icon={icon} onClick={() => {this.actionTrigger()}} >{label}</Button> : null} - <Modal - className={'popview-modal ' + (btn.$view === 'CustomPage' ? 'custom-popview' : '')} - title={btn.label} - width={'85vw'} - maskClosable={false} - visible={this.state.visible} - onCancel={this.popclose} - footer={[ - <Button key="close" onClick={this.popclose}>{this.state.dict['main.close']}</Button> - ]} - destroyOnClose - > - {btn.$view !== 'CustomPage' ? <SubTabTable - Tab={btn} - MenuID={btn.linkTab} - SupMenuID={this.props.MenuID} - BID={popData ? primaryId : this.props.BID} - BData={popData || this.props.BData} - /> : null} - {btn.$view === 'CustomPage' ? <CustomPage Tab={btn} MenuID={btn.uuid} param={{$BID: (popData ? primaryId : this.props.BID), ...(popData || this.props.BData || {})}} /> : null} - </Modal> + {this.getPop()} </div> ) } } - -const mapStateToProps = (state) => { - return { - tabviews: state.tabviews, - } -} - -const mapDispatchToProps = () => { - return {} -} - -export default connect(mapStateToProps, mapDispatchToProps)(PopupButton) \ No newline at end of file +export default PopupButton \ No newline at end of file -- Gitblit v1.8.0