haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-01 23:20:51 +00:00
Code Issues Releases Wiki Activity

improve dropdown-menu

Browse Source
This commit is contained in:
shanshuirenjia
2019-04-21 13:57:58 +08:00
parent c827c880f9
commit 681adcf27b
1 changed files with 41 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
frontend/src/components/dropdown-menu/dropdown-menu.js
View File

@@ -1,14 +1,14 @@
import React from 'react';
import PropTypes from 'prop-types';
import listener from '../context-menu/globalEventListener';
import { Dropdown, DropdownMenu, DropdownToggle, DropdownItem } from 'reactstrap';
import { Dropdown, ButtonDropdown, DropdownMenu, DropdownToggle, DropdownItem } from 'reactstrap';
import { gettext } from '../../utils/constants';
const propTypes = {
tagName: PropTypes.string,
opItem: PropTypes.object.isRequired,
menuType: PropTypes.oneOf(['pc', 'mobile']).isRequired,
menuClass: PropTypes.string.isRequired,
menuType: PropTypes.oneOf(['pc', 'mobile']),
menuClass: PropTypes.string,
isHandleContextMenuEvent: PropTypes.bool,
getOpItemMenuList: PropTypes.func.isRequired,
onMenuItemClick: PropTypes.func.isRequired,
@@ -19,8 +19,9 @@ const propTypes = {
class DropDownMenu extends React.Component {
static defaultProps = {
isHandleContextMenuEvent: false,
isHandleContextMenuEvent: true,
menuType: 'pc',
menuClass: 'sf2-icon-caret-down'
};
constructor(props) {
@@ -45,6 +46,15 @@ class DropDownMenu extends React.Component {
this.setState({menuList: menuList});
}
componentWillReceiveProps(nextProps) { // for toolbar opItem operation
let { opItem, menuType } = nextProps;
if (opItem.name !== this.props.opItem.name) {
let isAllOperations = menuType === 'pc' ? false : true;
let menuList = this.props.getOpItemMenuList(opItem, isAllOperations);
this.setState({menuList: menuList});
}
}
componentWillUnmount() {
if (this.props.isHandleContextMenuEvent && this.listenerId) {
listener.unregister(this.listenerId);
@@ -98,6 +108,32 @@ class DropDownMenu extends React.Component {
return '';
}
if (tagName && tagName === 'button') {
return (
<ButtonDropdown isOpen={this.state.isItemMenuShow} toggle={this.onDropdownToggleClick} title={gettext('More Operations')}>
<DropdownToggle
className={menuClass}
data-toggle="dropdown"
title={gettext('More Operations')}
aria-expanded={this.state.isItemMenuShow}
// onClick={this.onDropdownToggleClick}
>
</DropdownToggle>
<DropdownMenu>
{menuList.map((menuItem, index) => {
if (menuItem === 'Divider') {
return <DropdownItem key={index} divider />;
} else {
return (
<DropdownItem key={index} data-toggle={menuItem.key} onClick={this.onMenuItemClick}>{menuItem.value}</DropdownItem>
);
}
})}
</DropdownMenu>
</ButtonDropdown>
);
}
return (
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
<DropdownToggle
@@ -111,7 +147,7 @@ class DropDownMenu extends React.Component {
<DropdownMenu>
{menuList.map((menuItem, index) => {
if (menuItem === 'Divider') {
return <DropdownItem key={index} divider/>;
return <DropdownItem key={index} divider />;
} else {
return (
<DropdownItem key={index} data-toggle={menuItem.key} onClick={this.onMenuItemClick}>{menuItem.value}</DropdownItem>