feat: add customer & vendor ability.

This commit is contained in:
elforjani13
2021-11-23 21:26:34 +02:00
parent 1cba4b5f18
commit 6ec86d3cf7
7 changed files with 214 additions and 141 deletions

View File

@@ -14,6 +14,7 @@ import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
import { import {
If, If,
Icon, Icon,
Can,
FormattedMessage as T, FormattedMessage as T,
DashboardActionViewsList, DashboardActionViewsList,
AdvancedFilterPopover, AdvancedFilterPopover,
@@ -29,6 +30,10 @@ import withCustomersActions from './withCustomersActions';
import withAlertActions from 'containers/Alert/withAlertActions'; import withAlertActions from 'containers/Alert/withAlertActions';
import withSettingsActions from '../../Settings/withSettingsActions'; import withSettingsActions from '../../Settings/withSettingsActions';
import withSettings from '../../Settings/withSettings'; import withSettings from '../../Settings/withSettings';
import {
Customer_Abilities,
AbilitySubject,
} from '../../../common/abilityOption';
import { compose } from 'utils'; import { compose } from 'utils';
@@ -103,15 +108,15 @@ function CustomerActionsBar({
onChange={handleTabChange} onChange={handleTabChange}
/> />
<NavbarDivider /> <NavbarDivider />
<Can I={Customer_Abilities.Create} a={AbilitySubject.Item}>
<Button <Button
className={Classes.MINIMAL} className={Classes.MINIMAL}
icon={<Icon icon={'plus'} />} icon={<Icon icon={'plus'} />}
text={<T id={'new_customer'} />} text={<T id={'new_customer'} />}
onClick={onClickNewCustomer} onClick={onClickNewCustomer}
/> />
<NavbarDivider /> <NavbarDivider />
</Can>
<AdvancedFilterPopover <AdvancedFilterPopover
advancedFilterProps={{ advancedFilterProps={{
conditions: customersFilterConditions, conditions: customersFilterConditions,
@@ -152,11 +157,13 @@ function CustomerActionsBar({
onChange={handleTableRowSizeChange} onChange={handleTableRowSizeChange}
/> />
<NavbarDivider /> <NavbarDivider />
<Switch <Can I={Customer_Abilities.Edit} a={AbilitySubject.Customer}>
labelElement={<T id={'inactive'} />} <Switch
defaultChecked={accountsInactiveMode} labelElement={<T id={'inactive'} />}
onChange={handleInactiveSwitchChange} defaultChecked={accountsInactiveMode}
/> onChange={handleInactiveSwitchChange}
/>
</Can>
</NavbarGroup> </NavbarGroup>
<NavbarGroup align={Alignment.RIGHT}> <NavbarGroup align={Alignment.RIGHT}>
<Button <Button

View File

@@ -4,7 +4,11 @@ import clsx from 'classnames';
import intl from 'react-intl-universal'; import intl from 'react-intl-universal';
import { Icon, Money, If, AvaterCell } from 'components'; import { Can, Icon, Money, If, AvaterCell } from 'components';
import {
Customer_Abilities,
AbilitySubject,
} from '../../../common/abilityOption';
import { safeCallback } from 'utils'; import { safeCallback } from 'utils';
@@ -29,37 +33,46 @@ export function ActionsMenu({
text={intl.get('view_details')} text={intl.get('view_details')}
onClick={safeCallback(onViewDetails, original)} onClick={safeCallback(onViewDetails, original)}
/> />
<MenuDivider /> <Can I={Customer_Abilities.Edit} a={AbilitySubject.Customer}>
<MenuItem <MenuDivider />
icon={<Icon icon="pen-18" />}
text={intl.get('edit_customer')}
onClick={safeCallback(onEdit, original)}
/>
<MenuItem
icon={<Icon icon="duplicate-16" />}
text={intl.get('duplicate')}
onClick={safeCallback(onDuplicate, original)}
/>
<If condition={original.active}>
<MenuItem <MenuItem
text={intl.get('inactivate_customer')} icon={<Icon icon="pen-18" />}
icon={<Icon icon="pause-16" iconSize={16} />} text={intl.get('edit_customer')}
onClick={safeCallback(onInactivate, original)} onClick={safeCallback(onEdit, original)}
/> />
</If> </Can>
<If condition={!original.active}> <Can I={Customer_Abilities.Create} a={AbilitySubject.Customer}>
<MenuItem <MenuItem
text={intl.get('activate_customer')} icon={<Icon icon="duplicate-16" />}
icon={<Icon icon="play-16" iconSize={16} />} text={intl.get('duplicate')}
onClick={safeCallback(onActivate, original)} onClick={safeCallback(onDuplicate, original)}
/> />
</If> </Can>
<MenuItem <Can I={Customer_Abilities.Edit} a={AbilitySubject.Customer}>
icon={<Icon icon="trash-16" iconSize={16} />} <If condition={original.active}>
text={intl.get('delete_customer')} <MenuItem
intent={Intent.DANGER} text={intl.get('inactivate_customer')}
onClick={safeCallback(onDelete, original)} icon={<Icon icon="pause-16" iconSize={16} />}
/> onClick={safeCallback(onInactivate, original)}
/>
</If>
<If condition={!original.active}>
<MenuItem
text={intl.get('activate_customer')}
icon={<Icon icon="play-16" iconSize={16} />}
onClick={safeCallback(onActivate, original)}
/>
</If>
</Can>
<Can I={Customer_Abilities.Delete} a={AbilitySubject.Customer}>
<MenuItem
icon={<Icon icon="trash-16" iconSize={16} />}
text={intl.get('delete_customer')}
intent={Intent.DANGER}
onClick={safeCallback(onDelete, original)}
/>
</Can>
</Menu> </Menu>
); );
} }

View File

@@ -21,8 +21,15 @@ import { useCustomerDetailsDrawerContext } from './CustomerDetailsDrawerProvider
import withAlertsActions from 'containers/Alert/withAlertActions'; import withAlertsActions from 'containers/Alert/withAlertActions';
import withDrawerActions from 'containers/Drawer/withDrawerActions'; import withDrawerActions from 'containers/Drawer/withDrawerActions';
import { Icon, FormattedMessage as T } from 'components'; import { Can, Icon, FormattedMessage as T } from 'components';
import {
AbilitySubject,
Invoice_Abilities,
Estimate_Abilities,
Receipt_Abilities,
Payment_Receive_Abilities,
Customer_Abilities,
} from '../../../common/abilityOption';
import { compose } from 'utils'; import { compose } from 'utils';
/** /**
@@ -62,7 +69,7 @@ function CustomerDetailsActionsBar({
const handleDeleteCustomer = () => { const handleDeleteCustomer = () => {
openAlert(`customer-delete`, { contactId: customerId }); openAlert(`customer-delete`, { contactId: customerId });
}; };
const handleEditContact = () => { const handleEditContact = () => {
history.push(`/customers/${customerId}/edit`); history.push(`/customers/${customerId}/edit`);
closeDrawer('customer-details-drawer'); closeDrawer('customer-details-drawer');
@@ -74,22 +81,34 @@ function CustomerDetailsActionsBar({
<Popover <Popover
content={ content={
<Menu> <Menu>
<MenuItem <Can I={Invoice_Abilities.Create} a={AbilitySubject.Invoice}>
text={<T id={'customer.drawer.action.new_invoice'} />} <MenuItem
onClick={handleNewInvoiceClick} text={<T id={'customer.drawer.action.new_invoice'} />}
/> onClick={handleNewInvoiceClick}
<MenuItem />
text={<T id={'customer.drawer.action.new_estimate'} />} </Can>
onClick={handleNewEstimateClick} <Can I={Estimate_Abilities.Create} a={AbilitySubject.Estimate}>
/> <MenuItem
<MenuItem text={<T id={'customer.drawer.action.new_estimate'} />}
text={<T id={'customer.drawer.action.new_receipt'} />} onClick={handleNewEstimateClick}
onClick={handleNewReceiptClick} />
/> </Can>
<MenuItem <Can I={Receipt_Abilities.Create} a={AbilitySubject.Receipt}>
text={<T id={'customer.drawer.action.new_payment'} />} <MenuItem
onClick={handleNewPaymentClick} text={<T id={'customer.drawer.action.new_receipt'} />}
/> onClick={handleNewReceiptClick}
/>
</Can>
<Can
I={Payment_Receive_Abilities.Create}
a={AbilitySubject.PaymentReceive}
>
<MenuItem
text={<T id={'customer.drawer.action.new_payment'} />}
onClick={handleNewPaymentClick}
/>
</Can>
</Menu> </Menu>
} }
minimal={true} minimal={true}
@@ -104,21 +123,24 @@ function CustomerDetailsActionsBar({
</Popover> </Popover>
<NavbarDivider /> <NavbarDivider />
<Can I={Customer_Abilities.Edit} a={AbilitySubject.Customer}>
<Button <Button
className={Classes.MINIMAL} className={Classes.MINIMAL}
icon={<Icon icon="pen-18" />} icon={<Icon icon="pen-18" />}
text={intl.get('customer.drawer.action.edit')} text={intl.get('customer.drawer.action.edit')}
onClick={handleEditContact} onClick={handleEditContact}
/> />
<NavbarDivider /> <NavbarDivider />
<Button </Can>
className={Classes.MINIMAL} <Can I={Customer_Abilities.Delete} a={AbilitySubject.Customer}>
icon={<Icon icon={'trash-16'} iconSize={16} />} <Button
text={<T id={'delete'} />} className={Classes.MINIMAL}
intent={Intent.DANGER} icon={<Icon icon={'trash-16'} iconSize={16} />}
onClick={handleDeleteCustomer} text={<T id={'delete'} />}
/> intent={Intent.DANGER}
onClick={handleDeleteCustomer}
/>
</Can>
</NavbarGroup> </NavbarGroup>
</DashboardActionsBar> </DashboardActionsBar>
); );

View File

@@ -20,8 +20,13 @@ import { useVendorDetailsDrawerContext } from './VendorDetailsDrawerProvider';
import withAlertsActions from 'containers/Alert/withAlertActions'; import withAlertsActions from 'containers/Alert/withAlertActions';
import withDrawerActions from 'containers/Drawer/withDrawerActions'; import withDrawerActions from 'containers/Drawer/withDrawerActions';
import { Icon, FormattedMessage as T } from 'components'; import { Can, Icon, FormattedMessage as T } from 'components';
import {
AbilitySubject,
Invoice_Abilities,
Payment_Made_Abilities,
Vendor_Abilities,
} from '../../../common/abilityOption';
import { safeCallback, compose } from 'utils'; import { safeCallback, compose } from 'utils';
/** /**
@@ -64,14 +69,21 @@ function VendorDetailsActionsBar({
<Popover <Popover
content={ content={
<Menu> <Menu>
<MenuItem <Can I={Invoice_Abilities.Create} a={AbilitySubject.Invoice}>
text={<T id={'vendor.drawer.action.new_invoice'} />} <MenuItem
onClick={handleNewInvoiceClick} text={<T id={'vendor.drawer.action.new_invoice'} />}
/> onClick={handleNewInvoiceClick}
<MenuItem />
text={<T id={'vendor.drawer.action.new_payment'} />} </Can>
onClick={handleNewPaymentClick} <Can
/> I={Payment_Made_Abilities.Create}
a={AbilitySubject.PaymentMade}
>
<MenuItem
text={<T id={'vendor.drawer.action.new_payment'} />}
onClick={handleNewPaymentClick}
/>
</Can>
</Menu> </Menu>
} }
minimal={true} minimal={true}
@@ -84,23 +96,25 @@ function VendorDetailsActionsBar({
icon={<Icon icon={'plus'} />} icon={<Icon icon={'plus'} />}
/> />
</Popover> </Popover>
<NavbarDivider /> <NavbarDivider />
<Can I={Vendor_Abilities.Edit} a={AbilitySubject.Vendor}>
<Button <Button
className={Classes.MINIMAL} className={Classes.MINIMAL}
icon={<Icon icon="pen-18" />} icon={<Icon icon="pen-18" />}
text={<T id={'vendor.drawer.action.edit'} />} text={<T id={'vendor.drawer.action.edit'} />}
onClick={safeCallback(onEditContact)} onClick={safeCallback(onEditContact)}
/> />
<NavbarDivider /> <NavbarDivider />
<Button </Can>
className={Classes.MINIMAL} <Can I={Vendor_Abilities.Delete} a={AbilitySubject.Vendor}>
icon={<Icon icon={'trash-16'} iconSize={16} />} <Button
text={<T id={'vendor.drawer.action.delete'} />} className={Classes.MINIMAL}
intent={Intent.DANGER} icon={<Icon icon={'trash-16'} iconSize={16} />}
onClick={safeCallback(onDeleteContact)} text={<T id={'vendor.drawer.action.delete'} />}
/> intent={Intent.DANGER}
onClick={safeCallback(onDeleteContact)}
/>
</Can>
</NavbarGroup> </NavbarGroup>
</DashboardActionsBar> </DashboardActionsBar>
); );

View File

@@ -110,7 +110,7 @@ export function ItemsActionMenuList({
onClick={safeCallback(onDuplicate, original)} onClick={safeCallback(onDuplicate, original)}
/> />
</Can> </Can>
<Can I={Item_Abilities.View} a={AbilitySubject.Item}> <Can I={Item_Abilities.Edit} a={AbilitySubject.Item}>
<If condition={original.active}> <If condition={original.active}>
<MenuItem <MenuItem
text={intl.get('inactivate_item')} text={intl.get('inactivate_item')}
@@ -118,8 +118,7 @@ export function ItemsActionMenuList({
onClick={safeCallback(onInactivateItem, original)} onClick={safeCallback(onInactivateItem, original)}
/> />
</If> </If>
</Can>
<Can I={Item_Abilities.Edit} a={AbilitySubject.Item}>
<If condition={!original.active}> <If condition={!original.active}>
<MenuItem <MenuItem
text={intl.get('activate_item')} text={intl.get('activate_item')}

View File

@@ -13,6 +13,7 @@ import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
import Icon from 'components/Icon'; import Icon from 'components/Icon';
import { import {
If, If,
Can,
FormattedMessage as T, FormattedMessage as T,
DashboardActionViewsList, DashboardActionViewsList,
DashboardFilterButton, DashboardFilterButton,
@@ -29,7 +30,10 @@ import withVendors from './withVendors';
import withSettingsActions from '../../Settings/withSettingsActions'; import withSettingsActions from '../../Settings/withSettingsActions';
import withSettings from '../../Settings/withSettings'; import withSettings from '../../Settings/withSettings';
import {
Vendor_Abilities,
AbilitySubject,
} from '../../../common/abilityOption';
import { compose } from 'utils'; import { compose } from 'utils';
/** /**
@@ -90,13 +94,15 @@ function VendorActionsBar({
onChange={handleTabChange} onChange={handleTabChange}
/> />
<NavbarDivider /> <NavbarDivider />
<Button <Can I={VendorActionsBar.Create} a={AbilitySubject.Vendor}>
className={Classes.MINIMAL} <Button
icon={<Icon icon={'plus'} />} className={Classes.MINIMAL}
text={<T id={'new_vendor'} />} icon={<Icon icon={'plus'} />}
onClick={onClickNewVendor} text={<T id={'new_vendor'} />}
/> onClick={onClickNewVendor}
<NavbarDivider /> />
<NavbarDivider />
</Can>
<AdvancedFilterPopover <AdvancedFilterPopover
advancedFilterProps={{ advancedFilterProps={{
conditions: vendorsFilterConditions, conditions: vendorsFilterConditions,

View File

@@ -10,7 +10,11 @@ import {
} from '@blueprintjs/core'; } from '@blueprintjs/core';
import intl from 'react-intl-universal'; import intl from 'react-intl-universal';
import { Icon, Money, If, AvaterCell } from 'components'; import { Can, Icon, Money, If, AvaterCell } from 'components';
import {
Vendor_Abilities,
AbilitySubject,
} from '../../../common/abilityOption';
import { safeCallback, firstLettersArgs } from 'utils'; import { safeCallback, firstLettersArgs } from 'utils';
/** /**
@@ -34,37 +38,45 @@ export function ActionsMenu({
text={intl.get('view_details')} text={intl.get('view_details')}
onClick={safeCallback(onViewDetails, original)} onClick={safeCallback(onViewDetails, original)}
/> />
<MenuDivider /> <Can I={Vendor_Abilities.Edit} a={AbilitySubject.Vendor}>
<MenuItem <MenuDivider />
icon={<Icon icon="pen-18" />}
text={intl.get('edit_vendor')}
onClick={safeCallback(onEdit, original)}
/>
<MenuItem
icon={<Icon icon="duplicate-16" />}
text={intl.get('duplicate')}
onClick={safeCallback(onDuplicate, original)}
/>
<If condition={original.active}>
<MenuItem <MenuItem
text={intl.get('inactivate_item')} icon={<Icon icon="pen-18" />}
icon={<Icon icon="pause-16" iconSize={16} />} text={intl.get('edit_vendor')}
onClick={safeCallback(onInactivate, original)} onClick={safeCallback(onEdit, original)}
/> />
</If> </Can>
<If condition={!original.active}> <Can I={Vendor_Abilities.Create} a={AbilitySubject.Customer}>
<MenuItem <MenuItem
text={intl.get('activate_item')} icon={<Icon icon="duplicate-16" />}
icon={<Icon icon="play-16" iconSize={16} />} text={intl.get('duplicate')}
onClick={safeCallback(onActivate, original)} onClick={safeCallback(onDuplicate, original)}
/> />
</If> </Can>
<MenuItem <Can I={Vendor_Abilities.Edit} a={AbilitySubject.Vendor}>
icon={<Icon icon="trash-16" iconSize={16} />} <If condition={original.active}>
text={intl.get('delete_vendor')} <MenuItem
intent={Intent.DANGER} text={intl.get('inactivate_item')}
onClick={safeCallback(onDelete, original)} icon={<Icon icon="pause-16" iconSize={16} />}
/> onClick={safeCallback(onInactivate, original)}
/>
</If>
<If condition={!original.active}>
<MenuItem
text={intl.get('activate_item')}
icon={<Icon icon="play-16" iconSize={16} />}
onClick={safeCallback(onActivate, original)}
/>
</If>
</Can>
<Can I={Vendor_Abilities.Delete} a={AbilitySubject.Vendor}>
<MenuItem
icon={<Icon icon="trash-16" iconSize={16} />}
text={intl.get('delete_vendor')}
intent={Intent.DANGER}
onClick={safeCallback(onDelete, original)}
/>
</Can>
</Menu> </Menu>
); );
} }