QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-18 22:00:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Dashboard actions bar styled.

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2020-03-26 19:43:40 +02:00
parent 6c4f86431c
commit a399052a30
5 changed files with 152 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
client/src/containers/Dashboard/Items/ItemsActionsBar.js
View File

@@ -1,16 +1,19 @@
import React, {useMemo} from 'react';
import {useRouteMatch} from 'react-router-dom'
import {useRouteMatch, useHistory} from 'react-router-dom'
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
import { compose } from 'utils';
import {
MenuItem,
Popover,
NavbarGroup,
Menu,
NavbarDivider,
PopoverInteractionKind,
Position,
Button,
Classes,
Intent,
} from '@blueprintjs/core';
import classNames from 'classnames';
import Icon from 'components/Icon';
@@ -27,13 +30,12 @@ const ItemsActionsBar = ({
bulkSelected,
}) => {
const {path} = useRouteMatch();
const history = useHistory();
const viewsMenuItems = views.map((view) => {
return (<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />);
});
const onClickNewItem = () => {
};
const onClickNewItem = () => { history.push('/dashboard/items/new'); };
const itemsFields = getResourceFields('items');
const filterDropdown = FilterDropdown({
@@ -46,42 +48,57 @@ const ItemsActionsBar = ({
return (
<DashboardActionsBar>
<Popover
content={<Menu>{viewsMenuItems}</Menu>}
minimal={true}
interactionKind={PopoverInteractionKind.HOVER}
position={Position.BOTTOM_LEFT}>
<Button
className={classNames(Classes.MINIMAL, 'button--table-views')}
icon={ <Icon icon="table" /> }
text="Table Views"
rightIcon={'caret-down'} />
</Popover>
<NavbarGroup>
<Popover
content={<Menu>{viewsMenuItems}</Menu>}
minimal={true}
interactionKind={PopoverInteractionKind.HOVER}
position={Position.BOTTOM_LEFT}>
<Button
className={classNames(Classes.MINIMAL, 'button--table-views')}
icon={ <Icon icon="table" /> }
text="Table Views"
rightIcon={'caret-down'} />
</Popover>
<Popover
content={filterDropdown}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}>
<NavbarDivider />
<Button
className={classNames(Classes.MINIMAL, 'button--filter')}
text="Filter"
icon={ <Icon icon="filter" /> } />
</Popover>
<Popover
content={filterDropdown}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}>
<Button
className={Classes.MINIMAL}
icon={ <Icon icon="plus" /> }
text="New Item"
onClick={onClickNewItem} />
<Button
className={classNames(Classes.MINIMAL, 'button--filter')}
text="Filter"
icon={ <Icon icon="filter" /> } />
</Popover>
{hasBulkActionsSelected && (
<Button
className={Classes.MINIMAL}
icon={ <Icon icon="trash" />}
text="Delete" />)}
icon={ <Icon icon="plus" /> }
text="New Item"
onClick={onClickNewItem} />
{hasBulkActionsSelected && (
<Button
className={Classes.MINIMAL}
intent={Intent.DANGER}
icon={ <Icon icon="trash" />}
text="Delete" />)}
<Button
className={Classes.MINIMAL}
icon={<Icon icon='file-import' />}
text='Import'
/>
<Button
className={Classes.MINIMAL}
icon={<Icon icon='file-export' />}
text='Export'
/>
</NavbarGroup>
</DashboardActionsBar>
);
};