From 3df2d3624c6b768d29670b537f8d6a71d3ef122c Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期日, 12 四月 2020 22:04:53 +0800
Subject: [PATCH] 2020-04-12
---
src/components/header/index.jsx | 128 +++++++++++++++++++++++++++++++++++++++++-
1 files changed, 125 insertions(+), 3 deletions(-)
diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx
index cd58ef4..761bfd3 100644
--- a/src/components/header/index.jsx
+++ b/src/components/header/index.jsx
@@ -4,12 +4,13 @@
import {connect} from 'react-redux'
import { is, fromJS } from 'immutable'
import moment from 'moment'
-import {Dropdown, Menu, Icon, Modal, Form, notification, Switch, Button } from 'antd'
+import {Dropdown, Menu, Icon, Modal, Form, notification, Switch, Button, Input } from 'antd'
import asyncComponent from '@/utils/asyncComponent'
import {
toggleCollapse,
modifyMainMenu,
+ modifyTabview,
resetState,
resetDebug,
resetEditState,
@@ -31,6 +32,7 @@
const EditMenu = asyncComponent(() => import('./editmenu'))
const { confirm } = Modal
+const { Search } = Input
class Header extends Component {
static propTpyes = {
@@ -50,7 +52,9 @@
loginVisible: false,
loginLoading: false,
avatar: avatar,
- systems: []
+ systems: [],
+ searchkey: '',
+ thdMenuList: []
}
handleCollapse = () => {
@@ -438,6 +442,46 @@
let _param = window.btoa('ud=' + sessionStorage.getItem('UserID') + '&sd=' + sessionStorage.getItem('SessionUid') + '&ld=' + sessionStorage.getItem('LoginUID') + '&un=' + sessionStorage.getItem('User_Name'))
window.location.href = system.LinkUrl1 + '#/ssologin/' + _param
}
+
+ dropdownMenuChange = (visible) => {
+ this.setState({searchkey: ''}, () => {
+ if (visible) {
+ setTimeout(() => {
+ let input = document.getElementById('thdMenu-search')
+
+ if (input) {
+ input.focus()
+ }
+ }, 500)
+ }
+ })
+ }
+
+ selectMenu = (item) => {
+ const { tabviews } = this.props
+
+ let menu = JSON.parse(JSON.stringify(item))
+ menu.selected = true
+
+ let index = 0
+ let isexit = false
+ let tabs = tabviews.map((tab, i) => {
+ tab.selected = false
+
+ if (tab.MenuID === menu.MenuID) {
+ tab.selected = true
+ isexit = true
+ }
+
+ return tab
+ })
+
+ if (!isexit) {
+ tabs.splice(index + 1, 0, menu)
+ }
+
+ this.props.modifyTabview(tabs)
+ }
UNSAFE_componentWillMount () {
// 缁勪欢鍔犺浇鏃讹紝鑾峰彇鑿滃崟鏁版嵁
@@ -455,15 +499,53 @@
if (!result) return
if (result.status) {
let _permMenus = {}
+ let menulist = []
+
if (result.UserRoles) {
+ let iframes = ['Main/Index', 'bda/rdt', 'Home/rdt']
+
result.UserRoles.forEach(role => {
role.RoleMenu.forEach(menu => {
if (!menu.MenuID) return
_permMenus[menu.MenuID] = true
+
+ let _type = ''
+ if (menu.LinkUrl) {
+ if (menu.LinkUrl === 'CommonTable') {
+ _type = 'CommonTable'
+ } else if (menu.LinkUrl === 'DataManage') {
+ _type = 'DataManage'
+ } else if (iframes.includes(menu.LinkUrl.split('?')[0])) {
+ _type = 'iframe'
+ }
+ }
+
+ if (_type !== 'iframe') {
+ let pageParam = {}
+ try {
+ pageParam = JSON.parse(menu.PageParam)
+ } catch (e) {
+ pageParam = {}
+ }
+ _type = pageParam.Template || _type
+ }
+
+ menulist.push({
+ MenuID: menu.MenuID,
+ MenuName: menu.MenuName,
+ MenuNo: menu.MenuNo || '',
+ EasyCode: menu.EasyCode || '',
+ LinkUrl: menu.LinkUrl,
+ type: _type
+ })
})
})
}
+ this.setState({
+ thdMenuList: menulist
+ })
+
this.props.initMenuPermission(_permMenus)
} else {
notification.error({
@@ -480,6 +562,8 @@
}
render () {
+ const { thdMenuList, searchkey } = this.state
+
const menu = (
<Menu overlayclassname="header-dropdown">
{this.props.debug && <Menu.Item key="0">
@@ -497,7 +581,7 @@
)
return (
- <header className="header-container ant-menu-dark">
+ <header className="header-container ant-menu-dark" id="main-header-container">
<div className={this.props.collapse ? "collapse header-logo" : "header-logo"}><img src={this.state.logourl} alt=""/></div>
<div className={this.props.collapse ? "collapse header-collapse" : "header-collapse"} onClick={this.handleCollapse}>
<Icon type={this.props.collapse ? 'menu-unfold' : 'menu-fold'} />
@@ -533,6 +617,42 @@
</span>
</div>
</Dropdown>
+ {/* 鑿滃崟鎼滅储 */}
+ {!this.props.editState && thdMenuList.length > 0 ?
+ <Dropdown overlayClassName="menu-select-dropdown" getPopupContainer={() => document.getElementById('main-header-container')} overlay={
+ <div>
+ <Search
+ placeholder=""
+ id="thdMenu-search"
+ value={searchkey}
+ onChange={e => this.setState({searchkey: e.target.value})}
+ style={{ minWidth: '200px' }}
+ onSearch={(val, e) => {e.stopPropagation()}}
+ onClick={(e) => {e.stopPropagation()}}
+ />
+ <div className="menu-select-box">
+ <Menu>
+ {thdMenuList.map(option => {
+ if (searchkey) {
+ if (
+ option.MenuName.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0 ||
+ option.MenuNo.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0 ||
+ option.EasyCode.toLowerCase().indexOf(searchkey.toLowerCase()) >= 0
+ ) {
+ return <Menu.Item key={option.MenuID} onClick={() => this.selectMenu(option)}>{option.MenuName}</Menu.Item>
+ } else {
+ return null
+ }
+ }
+ return <Menu.Item key={option.MenuID} onClick={() => this.selectMenu(option)}>{option.MenuName}</Menu.Item>
+ })}
+ </Menu>
+ </div>
+ </div>
+ } trigger={['click']} className="search-menu" placement="bottomRight" onVisibleChange={this.dropdownMenuChange}>
+ <Icon className="search-menu" type="search" />
+ </Dropdown> : null
+ }
{/* 淇敼瀵嗙爜 */}
<Modal
title={this.state.dict['header.password']}
@@ -567,6 +687,7 @@
const mapStateToProps = (state) => {
return {
+ tabviews: state.tabviews,
collapse: state.collapse,
selectmenu: state.selectedMainMenu,
debug: state.debug,
@@ -581,6 +702,7 @@
const mapDispatchToProps = (dispatch) => {
return {
toggleCollapse: (collapse) => dispatch(toggleCollapse(collapse)),
+ modifyTabview: (tabviews) => dispatch(modifyTabview(tabviews)),
modifyMainMenu: (selectmenu) => dispatch(modifyMainMenu(selectmenu)),
resetEditState: (state) => dispatch(resetEditState(state)),
resetEditLevel: (level) => dispatch(resetEditLevel(level)),
--
Gitblit v1.8.0