From 891e8aaad3b2ce6980fd44d1cf49192dca1c3c66 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 23 十一月 2022 14:30:30 +0800 Subject: [PATCH] 2022-11-23 --- src/components/tabview/index.jsx | 95 +++++++++++++++++++++++++---------------------- 1 files changed, 51 insertions(+), 44 deletions(-) diff --git a/src/components/tabview/index.jsx b/src/components/tabview/index.jsx index a853921..2d23bc8 100644 --- a/src/components/tabview/index.jsx +++ b/src/components/tabview/index.jsx @@ -2,16 +2,14 @@ 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 { 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' @@ -19,22 +17,13 @@ const Home = asyncComponent(() => import('@/tabviews/home')) const CustomPage = asyncComponent(() => import('@/tabviews/custom')) const CommonTable = asyncComponent(() => import('@/tabviews/commontable')) +const BaseTable = asyncComponent(() => import('@/tabviews/basetable')) const CalendarPage = asyncComponent(() => import('@/tabviews/calendar')) const TreePage = asyncComponent(() => import('@/tabviews/treepage')) -const VerupTable = asyncComponent(() => import('@/tabviews/verupmanage')) -const ScriptTable = asyncComponent(() => import('@/tabviews/scriptmanage')) -const TabManage = asyncComponent(() => import('@/tabviews/tabmanage')) const Iframe = asyncComponent(() => import('@/tabviews/iframe')) const RoleManage = asyncComponent(() => import('@/tabviews/rolemanage')) const FormTab = asyncComponent(() => import('@/tabviews/formtab')) - -let service = '' - -if (process.env.NODE_ENV === 'production') { - service = document.location.origin + '/' + window.GLOB.service + 'zh-CN/' -} else { - service = window.GLOB.location + '/' + window.GLOB.service + 'zh-CN/' -} +const TabManage = asyncComponent(() => import('@/tabviews/tabmanage')) class TabViews extends Component { static propTpyes = { @@ -45,7 +34,6 @@ activeId: '', tabviews: null, // 鏍囩闆� iFrameHeight: 0, - dict: sessionStorage.getItem('lang') !== 'en-US' ? mzhCN : menUS, } // 鍏抽棴tab椤碉紝閲嶆柊閫夋嫨鏄剧ず椤� @@ -112,7 +100,7 @@ }) } - this.props.initActionPermission(_permAction) + window.GLOB.mkActions = _permAction } resolve() @@ -121,7 +109,7 @@ // 鑾峰彇涓昏彍鍗曞弬鏁� let menudefer = new Promise(resolve => { - Api.getAppVersion().then(() => { + Api.getAppVersion(menu.MenuID).then(() => { resolve() }, () => { resolve() @@ -136,10 +124,27 @@ } } - modifyTabs = (tab, type) => { - const { tabviews } = this.state + modifyTabs = (tab, fixed) => { + const { tabviews, activeId } = this.state - if (type === 'plus') { + if (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 (tabviews.findIndex(item => item.MenuID === tab.MenuID) > -1) { let _tabs = tabviews.filter(item => item.MenuID !== tab.MenuID) this.setState({ @@ -156,11 +161,6 @@ activeId: tab.MenuID }) } - } else if (type === 'replace') { - this.setState({ - tabviews: tab ? [tab] : [], - activeId: tab ? tab.MenuID : '' - }) } let node = document.getElementById('root').parentNode.parentNode @@ -180,32 +180,41 @@ }) } + changeTemp = (MenuID, Template) => { + let tabs = fromJS(this.state.tabviews).toJS() + + this.setState({ + tabviews: tabs.map(item => { + if (item.MenuID === MenuID) { + item.type = Template + } + return item + }) + }) + } + selectcomponent = (view) => { // 鏍规嵁tab椤典腑鑿滃崟淇℃伅锛岄�夋嫨鎵�闇�鐨勭粍浠� if (view.type === 'Home') { return (<Home MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) - } else if (view.type === 'CommonTable' || view.type === 'ManageTable') { - return (<CommonTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) + } else if (view.type === 'CommonTable') { + return (<CommonTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param} changeTemp={this.changeTemp}/>) + } else if (view.type === 'BaseTable') { + return (<BaseTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param} changeTemp={this.changeTemp}/>) } else if (view.type === 'CustomPage') { - return (<CustomPage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) + return (<CustomPage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param} changeTemp={this.changeTemp}/>) } else if (view.type === 'TreePage') { return (<TreePage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) } else if (view.type === 'CalendarPage') { return (<CalendarPage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) - } else if (view.type === 'VerupTable') { - return (<VerupTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) - } else if (view.type === 'ScriptTable') { - return (<ScriptTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) - } else if (view.type === 'TabManage') { - return (<TabManage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) } else if (view.type === 'RolePermission') { - return (<RoleManage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) - } else if (view.type === 'appRolePermission') { return (<RoleManage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID}/>) } else if (view.type === 'FormTab') { return (<FormTab MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) + } else if (view.type === 'TabManage') { + return (<TabManage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) } else if (view.type === 'iframe') { - return (<Iframe key={view.MenuID} MenuID={view.MenuID} MenuNo={view.MenuNo} title={view.MenuName} MenuName={view.MenuName} url={service + view.LinkUrl}/>) + return (<Iframe key={view.MenuID} MenuID={view.MenuID} MenuNo={view.MenuNo} title={view.MenuName} MenuName={view.MenuName} url={window.GLOB.baseurl + 'zh-CN/' + view.LinkUrl}/>) } else { return (<NotFount key={view.MenuID} />) } @@ -255,7 +264,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}> @@ -264,12 +273,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> } @@ -302,9 +311,7 @@ } const mapDispatchToProps = (dispatch) => { - return { - initActionPermission: (permAction) => dispatch(initActionPermission(permAction)) - } + return {} } export default connect(mapStateToProps, mapDispatchToProps)(TabViews) \ No newline at end of file -- Gitblit v1.8.0