2022-02-09

king

2022-02-09 d59f518f466274b2caeb2e01c10c92deafe7c93b

 src/components/tabview/index.jsx

@@ -2,16 +2,15 @@
import PropTypes from 'prop-types'
import {connect} from 'react-redux'
import { fromJS } from 'immutable'
import {Tabs, Icon, BackTop, notification} from 'antd'
import {Tabs, BackTop, notification} from 'antd'
import { RedoOutlined, CloseOutlined } from '@ant-design/icons'
import moment from 'moment'
import 'moment/locale/zh-cn'

import { toggleIsiframe, initActionPermission } from '@/store/action'
import { initActionPermission } from '@/store/action'
import asyncComponent from '@/utils/asyncLoadComponent'
import NotFount from '@/components/404'
import options from '@/store/options.js'
import mzhCN from '@/locales/zh-CN/main.js'
import menUS from '@/locales/en-US/main.js'
import MKEmitter from '@/utils/events.js'
import Api from '@/api'
import './index.scss'
@@ -45,7 +44,6 @@
    activeId: '',
    tabviews: null, // 标签集
    iFrameHeight: 0,
    dict: sessionStorage.getItem('lang') !== 'en-US' ? mzhCN : menUS,
  }

  // 关闭tab页，重新选择显示页
@@ -64,7 +62,9 @@
    
    if (index > -1) {
      let activeId = ''
      if (index > 0) {
      if (id !== this.state.activeId) {
        activeId = this.state.activeId
      } else if (index > 0) {
        activeId = tabs[index - 1].MenuID || ''
      } else if (tabs[index]) {
        activeId = tabs[index].MenuID || ''
@@ -74,10 +74,6 @@
        activeId,
        tabviews: tabs
      })

      if (this.props.isiframe) {
        this.props.toggleIsiframe(false)
      }

      let node = document.getElementById('root').parentNode.parentNode
      if (node) {
@@ -138,10 +134,27 @@
    }
  }

  modifyTabs = (tab, type) => {
    const { tabviews } = this.state
  modifyTabs = (tab, type, fixed) => {
    const { tabviews, activeId } = this.state

    if (type === 'plus') {
    if (type === 'plus' && fixed) {
      let _tabs = tabviews.filter(item => item.MenuID !== tab.MenuID)
      let index = _tabs.findIndex(item => item.MenuID === activeId)

      this.setState({
        tabviews: _tabs
      }, () => {
        if (index > -1) {
          _tabs.splice(index + 1, 0, tab)
        } else {
          _tabs.push(tab)
        }
        this.setState({
          tabviews: _tabs,
          activeId: tab.MenuID
        })
      })
    } else if (type === 'plus') {
      if (tabviews.findIndex(item => item.MenuID === tab.MenuID) > -1) {
        let _tabs = tabviews.filter(item => item.MenuID !== tab.MenuID)
        this.setState({
@@ -174,16 +187,6 @@
  changeTab = (e, menu) => {
    e.stopPropagation()
    // 窗口切换
    let _isiframe = this.props.isiframe
    if (menu.type === 'iframe') {
      _isiframe = true
    } else {
      _isiframe = false
    }

    if (_isiframe !== this.props.isiframe) {
      this.props.toggleIsiframe(_isiframe)
    }
    
    this.setState({
      activeId: menu.MenuID || ''
@@ -252,10 +255,6 @@
    MKEmitter.addListener('closeTabView', this.closeTabView)
  }

  UNSAFE_componentWillReceiveProps (nextProps) {
    
  }

  /**
   * @description 组件销毁，清除state更新
   */
@@ -271,7 +270,7 @@
    const { tabviews, activeId } = this.state

    return (
      <section id="mk-tabview-wrap" className={'mk-tabview-wrap' + (this.props.collapse ? ' collapsed' : '')}>
      <section id="mk-tabview-wrap" className={'mk-tabview-wrap' + (this.props.collapse ? ' collapsed' : '') + (tabviews && tabviews.length > 0 ? ' hastab' : '')}>
        <div className="content-header">
          {tabviews && tabviews.length > 0 &&
            <Tabs activeKey={activeId}>
@@ -280,12 +279,12 @@
                  <Tabs.TabPane
                    tab={
                      <span className="tab-control">
                        <Icon type="redo" onClick={(e) => {this.refreshTabview(e, view)}}/>
                        <RedoOutlined onClick={(e) => {this.refreshTabview(e, view)}}/>
                        <span className="tab-name" onClick={(e) => {this.changeTab(e, view)}}>
                          {view.MenuName}
                        </span>
                        {view.type !== 'Home' ?
                          <Icon type="close" onClick={(e) => {e.stopPropagation();this.closeTabView(view.MenuID)}}/> : null
                          <CloseOutlined onClick={(e) => {e.stopPropagation();this.closeTabView(view.MenuID)}}/> : null
                        }
                      </span>
                    }
@@ -314,14 +313,12 @@
const mapStateToProps = (state) => {
  return {
    collapse: state.collapse,
    isiframe: state.isiframe
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    initActionPermission: (permAction) => dispatch(initActionPermission(permAction)),
    toggleIsiframe: (isiframe) => dispatch(toggleIsiframe(isiframe))
    initActionPermission: (permAction) => dispatch(initActionPermission(permAction))
  }
}