| | |
| | | import React, {Component} from 'react' |
| | | import {connect} from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { BackTop, Breadcrumb, Icon} from 'antd' |
| | | import { BackTop, Breadcrumb, notification} from 'antd' |
| | | import { HomeOutlined, RightOutlined, RedoOutlined } from '@ant-design/icons' |
| | | import moment from 'moment' |
| | | import 'moment/locale/zh-cn' |
| | | |
| | | 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' |
| | |
| | | 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 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/' |
| | | } |
| | | |
| | | class BreadView extends Component { |
| | | state = { |
| | | tabview: null, // 标签 |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? mzhCN : menUS, |
| | | hasNavBar: window.GLOB.navBar === 'linkage_navigation' |
| | | } |
| | | |
| | |
| | | window.GLOB.CacheMap = new Map() |
| | | |
| | | if (options.sysType === 'local' && window.GLOB.systemType !== 'production') { |
| | | Api.getAppVersion().then(() => { |
| | | MKEmitter.emit('reloadMenuView', tabview.MenuID) |
| | | }, () => { |
| | | let roledefer = new Promise(resolve => { |
| | | Api.getSystemConfig({ |
| | | func: 's_Get_TrdMenu_Role', |
| | | edition_type: 'A', |
| | | pro_sys: '' |
| | | }).then(result => { |
| | | if (!result) return |
| | | if (!result.status) { |
| | | notification.error({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 10 |
| | | }) |
| | | } else { |
| | | let _permAction = {loaded: true} // 按钮权限 |
| | | |
| | | if (result.UserRoles_Menu) { |
| | | result.UserRoles_Menu.forEach(menu => { |
| | | if (!menu.MenuID) return |
| | | _permAction[menu.MenuID] = true |
| | | }) |
| | | } |
| | | |
| | | window.GLOB.mkActions = _permAction |
| | | } |
| | | |
| | | resolve() |
| | | }) |
| | | }) |
| | | |
| | | // 获取主菜单参数 |
| | | let menudefer = new Promise(resolve => { |
| | | Api.getAppVersion().then(() => { |
| | | resolve() |
| | | }, () => { |
| | | resolve() |
| | | }) |
| | | }) |
| | | |
| | | Promise.all([roledefer, menudefer]).then(() => { |
| | | MKEmitter.emit('reloadMenuView', tabview.MenuID) |
| | | }) |
| | | } else { |
| | |
| | | // 根据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') { |
| | | } else if (view.type === 'CommonTable') { |
| | | return (<CommonTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) |
| | | // } else if (view.type === 'BaseTable') { |
| | | // return (<BaseTable MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) |
| | | } else if (view.type === 'CustomPage') { |
| | | return (<CustomPage MenuNo={view.MenuNo} MenuID={view.MenuID} MenuName={view.MenuName} key={view.MenuID} param={view.param}/>) |
| | | } else if (view.type === 'TreePage') { |
| | |
| | | } 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 === '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} />) |
| | | } |
| | |
| | | |
| | | let home = { |
| | | MenuID: 'home_page_id', |
| | | MenuName: this.state.dict['main.homepage'], |
| | | selected: true, |
| | | MenuName: '首页', |
| | | type: 'Home' |
| | | } |
| | | this.setState({tabview: home}) |
| | |
| | | gotoHome = () => { |
| | | let home = { |
| | | MenuID: 'home_page_id', |
| | | MenuName: this.state.dict['main.homepage'], |
| | | selected: true, |
| | | MenuName: '首页', |
| | | type: 'Home' |
| | | } |
| | | this.setState({tabview: home}) |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps (nextProps) { |
| | | if (nextProps.tabviews && !is(fromJS(this.state.tabviews), fromJS(nextProps.tabviews))) { |
| | | // 保存修改标签集 |
| | | this.setState({ |
| | | tabview: nextProps.tabviews[nextProps.tabviews.length - 1] |
| | | }) |
| | | modifyTabs = (tab, type) => { |
| | | if (!tab || type !== 'replace') return |
| | | |
| | | let node = document.getElementById('root').parentNode.parentNode |
| | | if (node) { |
| | | node.scrollTop = 0 |
| | | } |
| | | this.setState({ |
| | | tabview: tab, |
| | | }) |
| | | |
| | | let node = document.getElementById('root').parentNode.parentNode |
| | | if (node) { |
| | | node.scrollTop = 0 |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('modifyTabs', this.modifyTabs) |
| | | } |
| | | |
| | | /** |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('modifyTabs', this.modifyTabs) |
| | | } |
| | | |
| | | render () { |
| | |
| | | <section id="mk-breadview-wrap" className="mk-breadview-wrap"> |
| | | {hasNavBar && tabview ? <Breadcrumb separator=""> |
| | | <Breadcrumb.Item> |
| | | <Icon type="home" onClick={this.gotoHome} /> |
| | | <HomeOutlined onClick={this.gotoHome} /> |
| | | </Breadcrumb.Item> |
| | | {tabview.ParentNames && tabview.ParentNames[0] ? |
| | | <Breadcrumb.Item>{tabview.ParentNames[0]}</Breadcrumb.Item> : null} |
| | | {tabview.ParentNames && tabview.ParentNames[0] ? |
| | | <Breadcrumb.Separator children={<Icon type="right" />} /> : null} |
| | | <Breadcrumb.Separator children={<RightOutlined />} /> : null} |
| | | {tabview.ParentNames && tabview.ParentNames[1] ? |
| | | <Breadcrumb.Item>{tabview.ParentNames[1]}</Breadcrumb.Item> : null} |
| | | {tabview.ParentNames && tabview.ParentNames[1] ? |
| | | <Breadcrumb.Separator children={<Icon type="right" />} /> : null} |
| | | <Breadcrumb.Item><Icon type="redo" onClick={this.refreshTabview}/>{tabview.MenuName}</Breadcrumb.Item> |
| | | <Breadcrumb.Separator children={<RightOutlined />} /> : null} |
| | | <Breadcrumb.Item><RedoOutlined onClick={this.refreshTabview}/>{tabview.MenuName}</Breadcrumb.Item> |
| | | </Breadcrumb> : null} |
| | | {tabview ? this.selectcomponent(tabview) : null} |
| | | <BackTop> |
| | |
| | | } |
| | | } |
| | | |
| | | const mapStateToProps = (state) => { |
| | | return { |
| | | tabviews: state.tabviews |
| | | } |
| | | } |
| | | |
| | | const mapDispatchToProps = () => { |
| | | return {} |
| | | } |
| | | |
| | | export default connect(mapStateToProps, mapDispatchToProps)(BreadView) |
| | | export default BreadView |