feat: add status & opened alert in credit & vendor.

This commit is contained in:
elforjani13
2021-12-06 16:28:42 +02:00
parent 2a48d9be51
commit ac99a6ca75
25 changed files with 567 additions and 222 deletions

View File

@@ -26,35 +26,39 @@ export default function VendorCreditNoteFloatingActions() {
const { resetForm, submitForm, isSubmitting } = useFormikContext();
// Credit note form context.
const { setSubmitPayload, isNewMode } = useVendorCreditNoteFormContext();
// Handle submit, save and anothe new button click.
const handleSubmitAndNewBtnClick = (event) => {
setSubmitPayload({ redirect: false, status: true, resetForm: true });
const { setSubmitPayload, vendorCredit } = useVendorCreditNoteFormContext();
// Handle submit as open button click.
const handleSubmitOpenBtnClick = (event) => {
setSubmitPayload({ redirect: true, open: true });
submitForm();
};
// Handle submit as save & continue editing button click.
const handleSubmitSaveContinueEditingBtnClick = (event) => {
setSubmitPayload({ redirect: false, status: true });
// Handle submit, open and anothe new button click.
const handleSubmitOpenAndNewBtnClick = (event) => {
setSubmitPayload({ redirect: false, open: true, resetForm: true });
submitForm();
};
// Handle submit as open & continue editing button click.
const handleSubmitOpenContinueEditingBtnClick = (event) => {
setSubmitPayload({ redirect: false, open: true });
submitForm();
};
// Handle submit as draft button click.
const handleSubmitDraftBtnClick = (event) => {
setSubmitPayload({ redirect: true, status: false });
setSubmitPayload({ redirect: true, open: false });
submitForm();
};
// handle submit as draft & new button click.
const handleSubmitDraftAndNewBtnClick = (event) => {
setSubmitPayload({ redirect: false, status: false, resetForm: true });
setSubmitPayload({ redirect: false, open: false, resetForm: true });
submitForm();
};
// Handle submit as draft & continue editing button click.
const handleSubmitDraftContinueEditingBtnClick = (event) => {
setSubmitPayload({ redirect: false, status: false });
setSubmitPayload({ redirect: false, open: false });
submitForm();
};
@@ -63,89 +67,114 @@ export default function VendorCreditNoteFloatingActions() {
history.goBack();
};
// Handle submit button click.
const handleSubmitBtnClick = (event) => {
setSubmitPayload({ redirect: true });
submitForm();
};
const handleClearBtnClick = (event) => {
resetForm();
};
return (
<div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
{/* ----------- Save ----------- */}
<ButtonGroup>
<Button
disabled={isSubmitting}
loading={isSubmitting}
intent={Intent.PRIMARY}
onClick={handleSubmitBtnClick}
text={<T id={'save'} />}
/>
<Popover
content={
<Menu>
<MenuItem
text={<T id={'save_and_new'} />}
onClick={handleSubmitAndNewBtnClick}
/>
<MenuItem
text={<T id={'save_continue_editing'} />}
onClick={handleSubmitSaveContinueEditingBtnClick}
/>
</Menu>
}
minimal={true}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
>
{/* ----------- Save And Open ----------- */}
<If condition={!vendorCredit || !vendorCredit?.is_open}>
<ButtonGroup>
<Button
disabled={isSubmitting}
loading={isSubmitting}
intent={Intent.PRIMARY}
rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
onClick={handleSubmitOpenBtnClick}
text={<T id={'save_open'} />}
/>
</Popover>
</ButtonGroup>
{/* ----------- Save As Draft ----------- */}
<ButtonGroup>
<Button
disabled={isSubmitting}
className={'ml1'}
onClick={handleSubmitDraftBtnClick}
text={<T id={'save_as_draft'} />}
/>
<Popover
content={
<Menu>
<MenuItem
text={<T id={'save_and_new'} />}
onClick={handleSubmitDraftAndNewBtnClick}
/>
<MenuItem
text={<T id={'save_continue_editing'} />}
onClick={handleSubmitDraftContinueEditingBtnClick}
/>
</Menu>
}
minimal={true}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
>
<Popover
content={
<Menu>
<MenuItem
text={<T id={'open_and_new'} />}
onClick={handleSubmitOpenAndNewBtnClick}
/>
<MenuItem
text={<T id={'open_continue_editing'} />}
onClick={handleSubmitOpenContinueEditingBtnClick}
/>
</Menu>
}
minimal={true}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
>
<Button
disabled={isSubmitting}
intent={Intent.PRIMARY}
rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
/>
</Popover>
</ButtonGroup>
{/* ----------- Save As Draft ----------- */}
<ButtonGroup>
<Button
disabled={isSubmitting}
rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
className={'ml1'}
onClick={handleSubmitDraftBtnClick}
text={<T id={'save_as_draft'} />}
/>
</Popover>
</ButtonGroup>
<Popover
content={
<Menu>
<MenuItem
text={<T id={'save_and_new'} />}
onClick={handleSubmitDraftAndNewBtnClick}
/>
<MenuItem
text={<T id={'save_continue_editing'} />}
onClick={handleSubmitDraftContinueEditingBtnClick}
/>
</Menu>
}
minimal={true}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
>
<Button
disabled={isSubmitting}
rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
/>
</Popover>
</ButtonGroup>
</If>
{/* ----------- Save and New ----------- */}
<If condition={vendorCredit && vendorCredit?.is_open}>
<ButtonGroup>
<Button
loading={isSubmitting}
intent={Intent.PRIMARY}
onClick={handleSubmitOpenBtnClick}
text={<T id={'save'} />}
/>
<Popover
content={
<Menu>
<MenuItem
text={<T id={'save_and_new'} />}
onClick={handleSubmitOpenAndNewBtnClick}
/>
</Menu>
}
minimal={true}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
>
<Button
disabled={isSubmitting}
intent={Intent.PRIMARY}
rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
/>
</Popover>
</ButtonGroup>
</If>
{/* ----------- Clear & Reset----------- */}
<Button
className={'ml1'}
disabled={isSubmitting}
onClick={handleClearBtnClick}
text={isNewMode ? <T id={'reset'} /> : <T id={'clear'} />}
text={vendorCredit ? <T id={'reset'} /> : <T id={'clear'} />}
/>
{/* ----------- Cancel ----------- */}
<Button

View File

@@ -95,6 +95,7 @@ function VendorCreditNoteForm({
}
const form = {
...transformFormValuesToRequest(values),
open: submitPayload.open,
};
// Handle the request success.
const onSuccess = (response) => {

View File

@@ -15,6 +15,7 @@ const getSchema = Yup.object().shape({
.min(1)
.max(DATATYPES_LENGTH.TEXT)
.label(intl.get('note')),
open: Yup.boolean(),
entries: Yup.array().of(
Yup.object().shape({
quantity: Yup.number()

View File

@@ -33,6 +33,7 @@ export const defaultVendorsCreditNote = {
vendor_id: '',
vendor_credit_number: '',
vendor_credit_no_manually: false,
open: '',
vendor_credit_date: moment(new Date()).format('YYYY-MM-DD'),
// reference_no: '',
note: '',
@@ -93,6 +94,7 @@ export const transformFormValuesToRequest = (values) => {
return {
...values,
entries: transformEntriesToSubmit(entries),
open: false,
};
};
@@ -119,7 +121,7 @@ export const entriesFieldShouldUpdate = (newProps, oldProps) => {
/**
* Syncs invoice no. settings with form.
*/
export const useObserveVendorCreditNoSettings = (prefix, nextNumber) => {
export const useObserveVendorCreditNoSettings = (prefix, nextNumber) => {
const { setFieldValue } = useFormikContext();
React.useEffect(() => {

View File

@@ -100,6 +100,10 @@ function VendorsCreditNoteDataTable({
openDialog('refund-vendor-credit', { vendorCreditId: id });
};
// Handle cancel/confirm vendor credit open.
const handleOpenCreditNote = ({ id }) => {
openAlert('vendor-credit-open', { vendorCreditId: id });
};
return (
<DashboardContentTable>
<DataTable
@@ -127,6 +131,7 @@ function VendorsCreditNoteDataTable({
onDelete: handleDeleteVendorCreditNote,
onEdit: hanldeEditVendorCreditNote,
onRefund: handleRefundCreditVendor,
onOpen: handleOpenCreditNote,
}}
/>
</DashboardContentTable>

View File

@@ -1,12 +1,5 @@
import React from 'react';
import {
Intent,
Tag,
Menu,
MenuItem,
MenuDivider,
ProgressBar,
} from '@blueprintjs/core';
import { Intent, Tag, Menu, MenuItem, MenuDivider } from '@blueprintjs/core';
import intl from 'react-intl-universal';
import clsx from 'classnames';
@@ -14,18 +7,17 @@ import { CLASSES } from '../../../../common/classes';
import {
FormatDateCell,
FormattedMessage as T,
AppToaster,
Choose,
If,
Icon,
} from 'components';
import { formattedAmount, safeCallback, calculateStatus } from 'utils';
import { safeCallback } from 'utils';
/**
* Actions menu.
*/
export function ActionsMenu({
payload: { onEdit, onDelete, onRefund, onViewDetails },
payload: { onEdit, onDelete, onOpen, onRefund, onViewDetails },
row: { original },
}) {
return (
@@ -41,11 +33,20 @@ export function ActionsMenu({
text={intl.get('vendor_credits.action.edit_vendor_credit')}
onClick={safeCallback(onEdit, original)}
/>
<MenuItem
icon={<Icon icon="quick-payment-16" />}
text={intl.get('vendor_credits.action.refund_vendor_credit')}
onClick={safeCallback(onRefund, original)}
/>
<If condition={!original.is_closed && !original.is_draft}>
<MenuItem
icon={<Icon icon="quick-payment-16" />}
text={intl.get('vendor_credits.action.refund_vendor_credit')}
onClick={safeCallback(onRefund, original)}
/>
</If>
<If condition={original.is_draft}>
<MenuItem
icon={<Icon icon={'check'} iconSize={18} />}
text={intl.get('mark_as_opened')}
onClick={safeCallback(onOpen, original)}
/>
</If>
<MenuItem
text={intl.get('vendor_credits.action.delete_vendor_credit')}
intent={Intent.DANGER}
@@ -56,6 +57,35 @@ export function ActionsMenu({
);
}
/**
* Status accessor.
*/
export function StatusAccessor(creditNote) {
return (
<div>
<Choose>
<Choose.When condition={creditNote.is_open}>
<Tag minimal={true} intent={Intent.WARNING}>
<T id={'open'} />
</Tag>
</Choose.When>
<Choose.When condition={creditNote.is_closed}>
<Tag minimal={true} intent={Intent.SUCCESS}>
<T id={'closed'} />
</Tag>
</Choose.When>
<Choose.When condition={creditNote.is_draft}>
<Tag minimal={true}>
<T id={'draft'} />
</Tag>
</Choose.When>
</Choose>
</div>
);
}
/**
* Retrieve vendors credit note table columns.
*/
@@ -103,8 +133,8 @@ export function useVendorsCreditNoteTableColumns() {
{
id: 'status',
Header: intl.get('status'),
// accessor:
width: 120, // 160
accessor: StatusAccessor,
width: 160,
className: 'status',
clickable: true,
},

View File

@@ -8,6 +8,10 @@ const RefundVendorCreditDeleteAlert = React.lazy(() =>
import('../../Alerts/VendorCeditNotes/RefundVendorCreditDeleteAlert'),
);
const OpenVendorCreditAlert = React.lazy(() =>
import('../../Alerts/VendorCeditNotes/VendorCreditOpenedAlert'),
);
/**
* Vendor Credit notes alerts.
*/
@@ -16,6 +20,10 @@ export default [
name: 'vendor-credit-delete',
component: VendorCreditDeleteAlert,
},
{
name: 'vendor-credit-open',
component: OpenVendorCreditAlert,
},
{
name: 'refund-vendor-delete',
component: RefundVendorCreditDeleteAlert,