mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-23 08:10:32 +00:00
fix: Remove not used files and notes.
This commit is contained in:
@@ -1,246 +0,0 @@
|
|||||||
// import React, { useState } from 'react';
|
|
||||||
// import * as Yup from 'yup';
|
|
||||||
// import { useFormik } from 'formik';
|
|
||||||
// import {
|
|
||||||
// FormGroup,
|
|
||||||
// MenuItem,
|
|
||||||
// Intent,
|
|
||||||
// InputGroup,
|
|
||||||
// Position,
|
|
||||||
// Button,
|
|
||||||
// TextArea,
|
|
||||||
// ControlGroup
|
|
||||||
// } from '@blueprintjs/core';
|
|
||||||
// import { DateInput } from '@blueprintjs/datetime';
|
|
||||||
// import { Select } from '@blueprintjs/select';
|
|
||||||
// import { FormattedMessage as T, useIntl } from 'react-intl';
|
|
||||||
// import { momentFormatter } from 'utils';
|
|
||||||
// import moment from 'moment';
|
|
||||||
// import AppToaster from 'components/AppToaster';
|
|
||||||
|
|
||||||
// export default function ExpenseForm({
|
|
||||||
// accounts,
|
|
||||||
// editExpense,
|
|
||||||
// submitExpense,
|
|
||||||
// expenseDetails,
|
|
||||||
// currencies
|
|
||||||
// }) {
|
|
||||||
// const {formatMessage} = useIntl();
|
|
||||||
|
|
||||||
// const [state, setState] = useState({
|
|
||||||
// selectedExpenseAccount: null,
|
|
||||||
// selectedPaymentAccount: null
|
|
||||||
// });
|
|
||||||
// const validationSchema = Yup.object().shape({
|
|
||||||
// date: Yup.date().required().label(formatMessage({id:'date'})),
|
|
||||||
// description: Yup.string().trim().label(formatMessage({id:'description'})),
|
|
||||||
// expense_account_id: Yup.number().required().label(formatMessage({id:'expense_account_id'})),
|
|
||||||
// payment_account_id: Yup.number().required().label(formatMessage({id:'payment_account_id'})),
|
|
||||||
// amount: Yup.number().required().label(formatMessage({id:'amount'})),
|
|
||||||
// currency_code: Yup.string().required().label(formatMessage({id:'currency_code_'})),
|
|
||||||
// publish: Yup.boolean().label(formatMessage({id:'publish'})),
|
|
||||||
// exchange_rate: Yup.number().label(formatMessage({id:'exchange_rate_'}))
|
|
||||||
// });
|
|
||||||
|
|
||||||
// const formik = useFormik({
|
|
||||||
// enableReinitialize: true,
|
|
||||||
// validationSchema: validationSchema,
|
|
||||||
// initialValues: {
|
|
||||||
// date: null
|
|
||||||
// },
|
|
||||||
// onSubmit: values => {
|
|
||||||
// submitExpense(values)
|
|
||||||
// .then(response => {
|
|
||||||
// AppToaster.show({
|
|
||||||
// message: formatMessage({id:'the_expense_has_been_successfully_created'})
|
|
||||||
// });
|
|
||||||
// })
|
|
||||||
// .catch(error => {});
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// // Account item of select accounts field.
|
|
||||||
// const accountItem = (item, { handleClick, modifiers, query }) => {
|
|
||||||
// return (
|
|
||||||
// <MenuItem
|
|
||||||
// text={item.name}
|
|
||||||
// label={item.code}
|
|
||||||
// key={item.id}
|
|
||||||
// onClick={handleClick}
|
|
||||||
// />
|
|
||||||
// );
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const onChangeAccount = () => {};
|
|
||||||
|
|
||||||
// const onChangePaymentAccount = () => {};
|
|
||||||
|
|
||||||
// const handleDateChange = date => {
|
|
||||||
// const formatted = moment(date).format('YYYY/MM/DD');
|
|
||||||
// formik.setFieldValue('date', formatted);
|
|
||||||
// };
|
|
||||||
|
|
||||||
// // Filters accounts items.
|
|
||||||
// const filterAccountsPredicater = (query, account, _index, exactMatch) => {
|
|
||||||
// const normalizedTitle = account.name.toLowerCase();
|
|
||||||
// const normalizedQuery = query.toLowerCase();
|
|
||||||
|
|
||||||
// if (exactMatch) {
|
|
||||||
// return normalizedTitle === normalizedQuery;
|
|
||||||
// } else {
|
|
||||||
// return `${account.code} ${normalizedTitle}`.indexOf(normalizedQuery) >= 0;
|
|
||||||
// }
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const onExpenseAccountSelect = account => {
|
|
||||||
// setState({ ...state, selectedExpenseAccount: account });
|
|
||||||
// formik.setFieldValue('expense_account_id', account.id);
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const onChangePaymentAccountSelect = account => {
|
|
||||||
// setState({ ...state, selectedPaymentAccount: account });
|
|
||||||
// formik.setFieldValue('payment_account_id', account.id);
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const onAmountCurrencySelect = currency => {
|
|
||||||
// formik.setFieldValue('currency_code', currency.id);
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const paymentAccountLabel = state.selectedPaymentAccount
|
|
||||||
// ? state.selectedPaymentAccount.name
|
|
||||||
// : <T id={'select_payment_account'}/>;
|
|
||||||
|
|
||||||
// const expenseAccountLabel = state.selectedExpenseAccount
|
|
||||||
// ? state.selectedExpenseAccount.name
|
|
||||||
// : <T id={'select_expense_account'}/>;
|
|
||||||
|
|
||||||
// const handleClose = () => {};
|
|
||||||
|
|
||||||
// return (
|
|
||||||
// <div class='expense-form'>
|
|
||||||
// <form onSubmit={formik.handleSubmit}>
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'date'}/>}
|
|
||||||
// inline={true}
|
|
||||||
// intent={formik.errors.date && Intent.DANGER}
|
|
||||||
// helperText={formik.errors.date && formik.errors.date}
|
|
||||||
// >
|
|
||||||
// <DateInput
|
|
||||||
// {...momentFormatter('YYYY/MM/DD')}
|
|
||||||
// defaultValue={new Date()}
|
|
||||||
// onChange={handleDateChange}
|
|
||||||
// popoverProps={{ position: Position.BOTTOM }}
|
|
||||||
// />
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'expense_account'}/>}
|
|
||||||
// className={'form-group--expense-account'}
|
|
||||||
// inline={true}
|
|
||||||
// intent={formik.errors.expense_account_id && Intent.DANGER}
|
|
||||||
// helperText={
|
|
||||||
// formik.errors.expense_account_id && formik.errors.expense_account_id
|
|
||||||
// }
|
|
||||||
// >
|
|
||||||
// <Select
|
|
||||||
// items={accounts}
|
|
||||||
// itemRenderer={accountItem}
|
|
||||||
// itemPredicate={filterAccountsPredicater}
|
|
||||||
// popoverProps={{ minimal: true }}
|
|
||||||
// onItemSelect={onExpenseAccountSelect}
|
|
||||||
// >
|
|
||||||
// <Button
|
|
||||||
// fill={true}
|
|
||||||
// rightIcon='caret-down'
|
|
||||||
// text={expenseAccountLabel}
|
|
||||||
// />
|
|
||||||
// </Select>
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'amount'}/>}
|
|
||||||
// className={'form-group--amount'}
|
|
||||||
// intent={formik.errors.amount && Intent.DANGER}
|
|
||||||
// helperText={formik.errors.amount && formik.errors.amount}
|
|
||||||
// inline={true}
|
|
||||||
// >
|
|
||||||
// <ControlGroup>
|
|
||||||
// <Select
|
|
||||||
// items={currencies.map(c => ({
|
|
||||||
// id: c.currency_code,
|
|
||||||
// name: c.currency_code
|
|
||||||
// }))}
|
|
||||||
// itemRenderer={accountItem}
|
|
||||||
// itemPredicate={filterAccountsPredicater}
|
|
||||||
// popoverProps={{ minimal: true }}
|
|
||||||
// onItemSelect={onAmountCurrencySelect}
|
|
||||||
// >
|
|
||||||
// <Button
|
|
||||||
// rightIcon='caret-down'
|
|
||||||
// text={formik.values.currency_code}
|
|
||||||
// />
|
|
||||||
// </Select>
|
|
||||||
|
|
||||||
// <InputGroup
|
|
||||||
// medium={true}
|
|
||||||
// intent={formik.errors.amount && Intent.DANGER}
|
|
||||||
// {...formik.getFieldProps('amount')}
|
|
||||||
// />
|
|
||||||
// </ControlGroup>
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'exchange_rate'}/>}
|
|
||||||
// className={'form-group--exchange-rate'}
|
|
||||||
// inline={true}
|
|
||||||
// >
|
|
||||||
// <InputGroup />
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'payment_account'}/>}
|
|
||||||
// className={'form-group--payment-account'}
|
|
||||||
// inline={true}
|
|
||||||
// intent={formik.errors.payment_account_id && Intent.DANGER}
|
|
||||||
// helperText={
|
|
||||||
// formik.errors.payment_account_id && formik.errors.payment_account_id
|
|
||||||
// }
|
|
||||||
// >
|
|
||||||
// <Select
|
|
||||||
// items={accounts}
|
|
||||||
// itemRenderer={accountItem}
|
|
||||||
// itemPredicate={filterAccountsPredicater}
|
|
||||||
// popoverProps={{ minimal: true }}
|
|
||||||
// onItemSelect={onChangePaymentAccountSelect}
|
|
||||||
// >
|
|
||||||
// <Button
|
|
||||||
// fill={true}
|
|
||||||
// rightIcon='caret-down'
|
|
||||||
// text={paymentAccountLabel}
|
|
||||||
// />
|
|
||||||
// </Select>
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <FormGroup
|
|
||||||
// label={<T id={'description'}/>}
|
|
||||||
// className={'form-group--description'}
|
|
||||||
// inline={true}
|
|
||||||
// >
|
|
||||||
// <TextArea
|
|
||||||
// growVertically={true}
|
|
||||||
// large={true}
|
|
||||||
// {...formik.getFieldProps('description')}
|
|
||||||
// />
|
|
||||||
// </FormGroup>
|
|
||||||
|
|
||||||
// <div class='form__floating-footer'>
|
|
||||||
// <Button intent={Intent.PRIMARY} type='submit'>
|
|
||||||
// <T id={'save'}/>
|
|
||||||
// </Button>
|
|
||||||
// <Button><T id={'save_as_draft'}/></Button>
|
|
||||||
// <Button onClick={handleClose}><T id={'close'}/></Button>
|
|
||||||
// </div>
|
|
||||||
// </form>
|
|
||||||
// </div>
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
@@ -1,82 +0,0 @@
|
|||||||
// import React from 'react';
|
|
||||||
// import {
|
|
||||||
// Button,
|
|
||||||
// AnchorButton,
|
|
||||||
// Classes,
|
|
||||||
// NavbarGroup,
|
|
||||||
// Popover,
|
|
||||||
// MenuItem,
|
|
||||||
// PopoverInteractionKind,
|
|
||||||
// Position,
|
|
||||||
// Menu,
|
|
||||||
// NavbarDivider,
|
|
||||||
// Intent,
|
|
||||||
// } from '@blueprintjs/core';
|
|
||||||
// import { useRouteMatch } from 'react-router-dom'
|
|
||||||
// import { FormattedMessage as T } from 'react-intl';
|
|
||||||
// import classNames from 'classnames';
|
|
||||||
|
|
||||||
// import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
|
|
||||||
// import Icon from 'components/Icon';
|
|
||||||
|
|
||||||
// export default function ExpensesActionsBar() {
|
|
||||||
// const {path} = useRouteMatch();
|
|
||||||
// const onClickNewAccount = () => {};
|
|
||||||
// const views = [];
|
|
||||||
|
|
||||||
// const viewsMenuItems = views.map((view) => {
|
|
||||||
// return (<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />);
|
|
||||||
// });
|
|
||||||
// return (
|
|
||||||
// <DashboardActionsBar>
|
|
||||||
// <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={<T id={'table_views'}/>}
|
|
||||||
// rightIcon={'caret-down'}
|
|
||||||
// />
|
|
||||||
// </Popover>
|
|
||||||
|
|
||||||
// <NavbarDivider />
|
|
||||||
|
|
||||||
// <AnchorButton
|
|
||||||
// className={Classes.MINIMAL}
|
|
||||||
// icon={<Icon icon='plus' />}
|
|
||||||
// href='/expenses/new'
|
|
||||||
// text={<T id={'new_expense'}/>}
|
|
||||||
// onClick={onClickNewAccount}
|
|
||||||
// />
|
|
||||||
// <Button
|
|
||||||
// className={Classes.MINIMAL}
|
|
||||||
// intent={Intent.DANGER}
|
|
||||||
// icon={<Icon icon='plus' />}
|
|
||||||
// text={<T id={'delete'}/>}
|
|
||||||
// onClick={onClickNewAccount}
|
|
||||||
// />
|
|
||||||
// <Button
|
|
||||||
// className={Classes.MINIMAL}
|
|
||||||
// icon={<Icon icon='plus' />}
|
|
||||||
// text={<T id={'bulk_update'}/>}
|
|
||||||
// onClick={onClickNewAccount}
|
|
||||||
// />
|
|
||||||
// <Button
|
|
||||||
// className={Classes.MINIMAL}
|
|
||||||
// icon={<Icon icon='file-import' />}
|
|
||||||
// text={<T id={'import'}/>}
|
|
||||||
// />
|
|
||||||
// <Button
|
|
||||||
// className={Classes.MINIMAL}
|
|
||||||
// icon={<Icon icon='file-export' />}
|
|
||||||
// text={<T id={'export'}/>}
|
|
||||||
// />
|
|
||||||
// </NavbarGroup>
|
|
||||||
// </DashboardActionsBar>
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
@@ -1,92 +0,0 @@
|
|||||||
// import React from 'react';
|
|
||||||
// import {
|
|
||||||
// GridComponent,
|
|
||||||
// ColumnsDirective,
|
|
||||||
// ColumnDirective,
|
|
||||||
// Inject,
|
|
||||||
// Sort,
|
|
||||||
|
|
||||||
// } from '@syncfusion/ej2-react-grids';
|
|
||||||
// import {
|
|
||||||
// Checkbox,
|
|
||||||
// Popover,
|
|
||||||
// Button,
|
|
||||||
// Menu,
|
|
||||||
// MenuItem,
|
|
||||||
// MenuDivider,
|
|
||||||
// Position,
|
|
||||||
// } from '@blueprintjs/core';
|
|
||||||
// import Icon from 'components/Icon';
|
|
||||||
// import moment from 'moment';
|
|
||||||
|
|
||||||
// export default function ExpensesTable({
|
|
||||||
// expenses,
|
|
||||||
// onDeleteExpense,
|
|
||||||
// onEditExpense,
|
|
||||||
// }) {
|
|
||||||
// const onDateStateChange = () => {
|
|
||||||
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const actionMenuList = (expense) => (
|
|
||||||
// <Menu>
|
|
||||||
// <MenuItem text="View Details" />
|
|
||||||
// <MenuDivider />
|
|
||||||
// <MenuItem text="Edit Expense" onClick={() => onEditExpense(expense)} />
|
|
||||||
// <MenuItem text="Delete Expense" onClick={() => onDeleteExpense(expense)} />
|
|
||||||
// </Menu>
|
|
||||||
// );
|
|
||||||
// const columns = [
|
|
||||||
// {
|
|
||||||
// headerText: '',
|
|
||||||
// template: () => (<Checkbox />)
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: 'Date',
|
|
||||||
// template: (row) => (<span>{ moment(row.date).format('YYYY/MM/DD') }</span>),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: 'Expense Account',
|
|
||||||
// template: (row) => (<span>{ row.expenseAccount.name }</span>),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: 'Paid Through',
|
|
||||||
// template: (row) => (<span>{ row.paymentAccount.name }</span>),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: 'Amount',
|
|
||||||
// field: 'amount'
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: 'Status',
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// headerText: '',
|
|
||||||
// template: (expense) => (
|
|
||||||
// <Popover content={actionMenuList(expense)} position={Position.RIGHT_BOTTOM}>
|
|
||||||
// <Button icon={<Icon icon="ellipsis-h" />} />
|
|
||||||
// </Popover>
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
// ]
|
|
||||||
// return (
|
|
||||||
// <GridComponent
|
|
||||||
// allowSorting={true}
|
|
||||||
// dataSource={{ result: expenses, count: 20 }}
|
|
||||||
// dataStateChange={onDateStateChange}>
|
|
||||||
|
|
||||||
// <ColumnsDirective>
|
|
||||||
// {columns.map((column) => {
|
|
||||||
// return (<ColumnDirective
|
|
||||||
// field={column.field}
|
|
||||||
// headerText={column.headerText}
|
|
||||||
// template={column.template}
|
|
||||||
// allowSorting={true}
|
|
||||||
// customAttributes={column.customAttributes}
|
|
||||||
// />);
|
|
||||||
// })}
|
|
||||||
// </ColumnsDirective>
|
|
||||||
// <Inject services={[Sort]} />
|
|
||||||
// </GridComponent>
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
@@ -1,51 +0,0 @@
|
|||||||
// import React from 'react';
|
|
||||||
// import {useHistory} from 'react-router';
|
|
||||||
// import {connect} from 'react-redux';
|
|
||||||
// import {
|
|
||||||
// Alignment,
|
|
||||||
// Navbar,
|
|
||||||
// NavbarGroup,
|
|
||||||
// Tabs,
|
|
||||||
// Tab,
|
|
||||||
// Button
|
|
||||||
// } from "@blueprintjs/core";
|
|
||||||
// import Icon from 'components/Icon';
|
|
||||||
// import {useRouteMatch, Link} from 'react-router-dom';
|
|
||||||
|
|
||||||
// function AccountsViewsTabs({ views }) {
|
|
||||||
// const history = useHistory();
|
|
||||||
// const {path} = useRouteMatch();
|
|
||||||
|
|
||||||
// const handleClickNewView = () => {
|
|
||||||
// history.push('/custom_views/new');
|
|
||||||
// };
|
|
||||||
|
|
||||||
// const tabs = views.map((view) => {
|
|
||||||
// const link = (<Link to={`${path}/${view.id}/custom_view`}>{ view.name }</Link>);
|
|
||||||
// return (<Tab id={`custom_view_${view.id}`} title={link} />);
|
|
||||||
// });
|
|
||||||
// return (
|
|
||||||
// <Navbar className="navbar--dashboard-views">
|
|
||||||
// <NavbarGroup
|
|
||||||
// align={Alignment.LEFT}>
|
|
||||||
// <Tabs
|
|
||||||
// id="navbar"
|
|
||||||
// large={true}
|
|
||||||
// className="tabs--dashboard-views"
|
|
||||||
// >
|
|
||||||
// { tabs }
|
|
||||||
// <Button
|
|
||||||
// className="button--new-view"
|
|
||||||
// icon={<Icon icon="plus" />}
|
|
||||||
// onClick={handleClickNewView} />
|
|
||||||
// </Tabs>
|
|
||||||
// </NavbarGroup>
|
|
||||||
// </Navbar>
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const mapStateToProps = (state) => ({
|
|
||||||
// views: state.views.resourceViews['expenses'],
|
|
||||||
// });
|
|
||||||
|
|
||||||
// export default connect(mapStateToProps)(AccountsViewsTabs);
|
|
||||||
@@ -30,8 +30,6 @@ import withExpenses from 'containers/Expenses/withExpenses';
|
|||||||
import withExpensesActions from 'containers/Expenses/withExpensesActions';
|
import withExpensesActions from 'containers/Expenses/withExpensesActions';
|
||||||
|
|
||||||
function ExpenseDataTable({
|
function ExpenseDataTable({
|
||||||
loading,
|
|
||||||
|
|
||||||
//#withExpenes
|
//#withExpenes
|
||||||
expenses,
|
expenses,
|
||||||
expensesLoading,
|
expensesLoading,
|
||||||
@@ -41,8 +39,11 @@ function ExpenseDataTable({
|
|||||||
changePageSubtitle,
|
changePageSubtitle,
|
||||||
setTopbarEditView,
|
setTopbarEditView,
|
||||||
|
|
||||||
|
// #withView
|
||||||
viewMeta,
|
viewMeta,
|
||||||
|
|
||||||
|
// #ownProps
|
||||||
|
loading,
|
||||||
onFetchData,
|
onFetchData,
|
||||||
onEditExpense,
|
onEditExpense,
|
||||||
onDeleteExpense,
|
onDeleteExpense,
|
||||||
@@ -119,7 +120,6 @@ function ExpenseDataTable({
|
|||||||
),
|
),
|
||||||
[handleEditExpense, handleDeleteExpense, handlePublishExpense],
|
[handleEditExpense, handleDeleteExpense, handlePublishExpense],
|
||||||
);
|
);
|
||||||
console.log(Object.values(expenses), 'ER');
|
|
||||||
|
|
||||||
const columns = useMemo(
|
const columns = useMemo(
|
||||||
() => [
|
() => [
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import React from 'react';
|
|||||||
import { Intent, Button } from '@blueprintjs/core';
|
import { Intent, Button } from '@blueprintjs/core';
|
||||||
import { FormattedMessage as T } from 'react-intl';
|
import { FormattedMessage as T } from 'react-intl';
|
||||||
|
|
||||||
function ExpenseFooter({
|
export default function ExpenseFooter({
|
||||||
formik: { isSubmitting },
|
formik: { isSubmitting },
|
||||||
onSubmitClick,
|
onSubmitClick,
|
||||||
onCancelClick,
|
onCancelClick,
|
||||||
@@ -40,6 +40,4 @@ function ExpenseFooter({
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
||||||
export default ExpenseFooter;
|
|
||||||
|
|||||||
@@ -43,6 +43,7 @@ function ExpenseForm({
|
|||||||
changePageSubtitle,
|
changePageSubtitle,
|
||||||
|
|
||||||
//#withExpenseDetail
|
//#withExpenseDetail
|
||||||
|
// @todo expenseDetail to expense
|
||||||
expenseDetail,
|
expenseDetail,
|
||||||
|
|
||||||
// #own Props
|
// #own Props
|
||||||
@@ -79,6 +80,7 @@ function ExpenseForm({
|
|||||||
} else {
|
} else {
|
||||||
changePageTitle(formatMessage({ id: 'new_expense' }));
|
changePageTitle(formatMessage({ id: 'new_expense' }));
|
||||||
}
|
}
|
||||||
|
// @todo not functions just states.
|
||||||
}, [changePageTitle, changePageSubtitle, expenseDetail, formatMessage]);
|
}, [changePageTitle, changePageSubtitle, expenseDetail, formatMessage]);
|
||||||
|
|
||||||
const validationSchema = Yup.object().shape({
|
const validationSchema = Yup.object().shape({
|
||||||
@@ -98,11 +100,11 @@ function ExpenseForm({
|
|||||||
.label(formatMessage({ id: 'description' })),
|
.label(formatMessage({ id: 'description' })),
|
||||||
|
|
||||||
publish: Yup.boolean().label(formatMessage({ id: 'publish' })),
|
publish: Yup.boolean().label(formatMessage({ id: 'publish' })),
|
||||||
|
|
||||||
categories: Yup.array().of(
|
categories: Yup.array().of(
|
||||||
Yup.object().shape({
|
Yup.object().shape({
|
||||||
index: Yup.number().nullable(),
|
index: Yup.number().nullable(),
|
||||||
amount: Yup.number().nullable(),
|
amount: Yup.number().nullable(),
|
||||||
|
// @todo expense_account_id is required.
|
||||||
expense_account_id: Yup.number().nullable(),
|
expense_account_id: Yup.number().nullable(),
|
||||||
description: Yup.string().nullable(),
|
description: Yup.string().nullable(),
|
||||||
}),
|
}),
|
||||||
@@ -135,6 +137,7 @@ function ExpenseForm({
|
|||||||
reference_no: '',
|
reference_no: '',
|
||||||
currency_code: '',
|
currency_code: '',
|
||||||
categories: [
|
categories: [
|
||||||
|
// @todo @mohamed index
|
||||||
defaultCategory,
|
defaultCategory,
|
||||||
defaultCategory,
|
defaultCategory,
|
||||||
defaultCategory,
|
defaultCategory,
|
||||||
@@ -144,7 +147,6 @@ function ExpenseForm({
|
|||||||
[defaultCategory],
|
[defaultCategory],
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
const initialValues = useMemo(
|
const initialValues = useMemo(
|
||||||
() => ({
|
() => ({
|
||||||
...(expenseDetail
|
...(expenseDetail
|
||||||
@@ -181,7 +183,6 @@ function ExpenseForm({
|
|||||||
const categories = values.categories.filter(
|
const categories = values.categories.filter(
|
||||||
(category) => category.amount || category.index,
|
(category) => category.amount || category.index,
|
||||||
);
|
);
|
||||||
|
|
||||||
const form = {
|
const form = {
|
||||||
...values,
|
...values,
|
||||||
published: payload.publish,
|
published: payload.publish,
|
||||||
@@ -209,6 +210,7 @@ function ExpenseForm({
|
|||||||
resolve(response);
|
resolve(response);
|
||||||
})
|
})
|
||||||
.catch((errors) => {
|
.catch((errors) => {
|
||||||
|
// @todo handle errors.
|
||||||
if (errors.find((e) => e.type === 'TOTAL.AMOUNT.EQUALS.ZERO')) {
|
if (errors.find((e) => e.type === 'TOTAL.AMOUNT.EQUALS.ZERO')) {
|
||||||
}
|
}
|
||||||
setErrors(
|
setErrors(
|
||||||
@@ -255,6 +257,8 @@ function ExpenseForm({
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
console.log(formik.errors);
|
||||||
|
|
||||||
const handleSubmitClick = useCallback(
|
const handleSubmitClick = useCallback(
|
||||||
(payload) => {
|
(payload) => {
|
||||||
setPayload(payload);
|
setPayload(payload);
|
||||||
@@ -280,6 +284,7 @@ function ExpenseForm({
|
|||||||
},
|
},
|
||||||
[setDeletedFiles, deletedFiles],
|
[setDeletedFiles, deletedFiles],
|
||||||
);
|
);
|
||||||
|
// @todo @mohamed
|
||||||
const fetchHook = useQuery('expense-form', () => requestFetchExpensesTable());
|
const fetchHook = useQuery('expense-form', () => requestFetchExpensesTable());
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -35,6 +35,7 @@ function ExpenseFormHeader({
|
|||||||
[setFieldValue],
|
[setFieldValue],
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// @todo @mohamed reusable components.
|
||||||
const infoIcon = useMemo(() => <Icon icon="info-circle" iconSize={12} />, []);
|
const infoIcon = useMemo(() => <Icon icon="info-circle" iconSize={12} />, []);
|
||||||
|
|
||||||
const requiredSpan = useMemo(() => <span className="required">*</span>, []);
|
const requiredSpan = useMemo(() => <span className="required">*</span>, []);
|
||||||
@@ -74,6 +75,7 @@ function ExpenseFormHeader({
|
|||||||
};
|
};
|
||||||
|
|
||||||
// Filters accounts items.
|
// Filters accounts items.
|
||||||
|
// @filter accounts predicator resauble
|
||||||
const filterAccountsPredicater = useCallback(
|
const filterAccountsPredicater = useCallback(
|
||||||
(query, account, _index, exactMatch) => {
|
(query, account, _index, exactMatch) => {
|
||||||
const normalizedTitle = account.name.toLowerCase();
|
const normalizedTitle = account.name.toLowerCase();
|
||||||
@@ -101,6 +103,7 @@ function ExpenseFormHeader({
|
|||||||
const onItemsSelect = useCallback(
|
const onItemsSelect = useCallback(
|
||||||
(filedName) => {
|
(filedName) => {
|
||||||
return (filed) => {
|
return (filed) => {
|
||||||
|
// @todo @mohamed
|
||||||
setSelectedItems({
|
setSelectedItems({
|
||||||
...selectedItems,
|
...selectedItems,
|
||||||
[filedName]: filed,
|
[filedName]: filed,
|
||||||
|
|||||||
@@ -144,6 +144,7 @@ function ExpenseTable({
|
|||||||
disableSortBy: true,
|
disableSortBy: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
// @todo Add hint component after the header label.
|
||||||
Header: formatMessage({ id: 'expense_category' }),
|
Header: formatMessage({ id: 'expense_category' }),
|
||||||
id: 'expense_account_id',
|
id: 'expense_account_id',
|
||||||
accessor: 'expense_account_id',
|
accessor: 'expense_account_id',
|
||||||
@@ -161,7 +162,6 @@ function ExpenseTable({
|
|||||||
disableResizing: true,
|
disableResizing: true,
|
||||||
width: 150,
|
width: 150,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
Header: formatMessage({ id: 'description' }),
|
Header: formatMessage({ id: 'description' }),
|
||||||
accessor: 'description',
|
accessor: 'description',
|
||||||
|
|||||||
@@ -12,25 +12,29 @@ import withCurrenciesActions from 'containers/Currencies/withCurrenciesActions';
|
|||||||
import { compose } from 'utils';
|
import { compose } from 'utils';
|
||||||
|
|
||||||
function Expenses({
|
function Expenses({
|
||||||
//#withwithAccountsActions
|
// #withwithAccountsActions
|
||||||
requestFetchAccounts,
|
requestFetchAccounts,
|
||||||
|
|
||||||
//#withExpensesActions
|
// #withExpensesActions
|
||||||
requestFetchExpense,
|
requestFetchExpense,
|
||||||
|
|
||||||
// #wihtCurrenciesActions
|
// #wihtCurrenciesActions
|
||||||
requestFetchCurrencies,
|
requestFetchCurrencies,
|
||||||
}) {
|
}) {
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
|
|
||||||
|
// @todo
|
||||||
const fetchAccounts = useQuery('accounts-expense-list', (key) =>
|
const fetchAccounts = useQuery('accounts-expense-list', (key) =>
|
||||||
requestFetchAccounts(),
|
requestFetchAccounts(),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// @todo
|
||||||
const fetchExpense = useQuery(id && ['expense', id], (key, expense_Id) =>
|
const fetchExpense = useQuery(id && ['expense', id], (key, expense_Id) =>
|
||||||
requestFetchExpense(expense_Id),
|
requestFetchExpense(expense_Id),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// @todo
|
||||||
const fetchCurrencies = useQuery('currencies-expense-list', () =>
|
const fetchCurrencies = useQuery('currencies-expense-list', () =>
|
||||||
requestFetchCurrencies(),
|
requestFetchCurrencies(),
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -62,7 +62,6 @@ function ExpensesList({
|
|||||||
);
|
);
|
||||||
|
|
||||||
// Handle cancel expense journal.
|
// Handle cancel expense journal.
|
||||||
|
|
||||||
const handleCancelExpenseDelete = useCallback(() => {
|
const handleCancelExpenseDelete = useCallback(() => {
|
||||||
setDeleteExpense(false);
|
setDeleteExpense(false);
|
||||||
}, [setDeleteExpense]);
|
}, [setDeleteExpense]);
|
||||||
@@ -103,12 +102,8 @@ function ExpensesList({
|
|||||||
.then(() => {
|
.then(() => {
|
||||||
AppToaster.show({
|
AppToaster.show({
|
||||||
message: formatMessage(
|
message: formatMessage(
|
||||||
{
|
{ id: 'the_expenses_has_been_successfully_deleted', },
|
||||||
id: 'the_expenses_has_been_successfully_deleted',
|
{ count: selectedRowsCount, },
|
||||||
},
|
|
||||||
{
|
|
||||||
count: selectedRowsCount,
|
|
||||||
},
|
|
||||||
),
|
),
|
||||||
intent: Intent.SUCCESS,
|
intent: Intent.SUCCESS,
|
||||||
});
|
});
|
||||||
@@ -117,6 +112,8 @@ function ExpensesList({
|
|||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
setBulkDelete(false);
|
setBulkDelete(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// @todo
|
||||||
}, [requestDeleteBulkExpenses, bulkDelete, formatMessage, selectedRowsCount]);
|
}, [requestDeleteBulkExpenses, bulkDelete, formatMessage, selectedRowsCount]);
|
||||||
|
|
||||||
// Handle cancel bulk delete alert.
|
// Handle cancel bulk delete alert.
|
||||||
|
|||||||
@@ -1,11 +1,8 @@
|
|||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { getExpenseById } from 'store/expenses/expenses.reducer';
|
import { getExpenseById } from 'store/expenses/expenses.reducer';
|
||||||
|
|
||||||
const mapStateToProps = (state, props) => {
|
const mapStateToProps = (state, props) => ({
|
||||||
|
|
||||||
return {
|
|
||||||
expenseDetail: getExpenseById(state, props.expenseId),
|
expenseDetail: getExpenseById(state, props.expenseId),
|
||||||
};
|
});
|
||||||
};
|
|
||||||
|
|
||||||
export default connect(mapStateToProps);
|
export default connect(mapStateToProps);
|
||||||
|
|||||||
@@ -14,7 +14,6 @@ export const mapDispatchToProps = (dispatch) => ({
|
|||||||
requestSubmitExpense: (form) => dispatch(submitExpense({ form })),
|
requestSubmitExpense: (form) => dispatch(submitExpense({ form })),
|
||||||
requestFetchExpense: (id) => dispatch(fetchExpense({ id })),
|
requestFetchExpense: (id) => dispatch(fetchExpense({ id })),
|
||||||
requestEditExpense: (id, form) => dispatch(editExpense({ id, form })),
|
requestEditExpense: (id, form) => dispatch(editExpense({ id, form })),
|
||||||
|
|
||||||
requestDeleteExpense: (id) => dispatch(deleteExpense({ id })),
|
requestDeleteExpense: (id) => dispatch(deleteExpense({ id })),
|
||||||
requestFetchExpensesTable: (query = {}) =>
|
requestFetchExpensesTable: (query = {}) =>
|
||||||
dispatch(fetchExpensesTable({ query: { ...query } })),
|
dispatch(fetchExpensesTable({ query: { ...query } })),
|
||||||
|
|||||||
@@ -5,12 +5,11 @@ export const fetchExpensesTable = ({ query } = {}) => {
|
|||||||
return (dispatch, getState) =>
|
return (dispatch, getState) =>
|
||||||
new Promise((resolve, reject) => {
|
new Promise((resolve, reject) => {
|
||||||
const pageQuery = getState().expenses.tableQuery;
|
const pageQuery = getState().expenses.tableQuery;
|
||||||
dispatch({
|
|
||||||
type: t.SET_DASHBOARD_REQUEST_LOADING,
|
|
||||||
});
|
|
||||||
dispatch({
|
dispatch({
|
||||||
type: t.EXPENSES_TABLE_LOADING,
|
type: t.EXPENSES_TABLE_LOADING,
|
||||||
|
payload: {
|
||||||
loading: true,
|
loading: true,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
ApiService.get('expenses', {
|
ApiService.get('expenses', {
|
||||||
params: { ...pageQuery, ...query },
|
params: { ...pageQuery, ...query },
|
||||||
@@ -18,19 +17,22 @@ export const fetchExpensesTable = ({ query } = {}) => {
|
|||||||
.then((response) => {
|
.then((response) => {
|
||||||
dispatch({
|
dispatch({
|
||||||
type: t.EXPENSES_PAGE_SET,
|
type: t.EXPENSES_PAGE_SET,
|
||||||
|
payload: {
|
||||||
expenses: response.data.expenses.results,
|
expenses: response.data.expenses.results,
|
||||||
customViewId: response.data.customViewId || -1,
|
customViewId: response.data.customViewId || -1,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
dispatch({
|
dispatch({
|
||||||
type: t.EXPENSES_ITEMS_SET,
|
type: t.EXPENSES_ITEMS_SET,
|
||||||
|
payload: {
|
||||||
expenses: response.data.expenses.results,
|
expenses: response.data.expenses.results,
|
||||||
|
}
|
||||||
});
|
});
|
||||||
dispatch({
|
dispatch({
|
||||||
type: t.EXPENSES_TABLE_LOADING,
|
type: t.EXPENSES_TABLE_LOADING,
|
||||||
|
payload: {
|
||||||
loading: false,
|
loading: false,
|
||||||
});
|
},
|
||||||
dispatch({
|
|
||||||
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
|
|
||||||
});
|
});
|
||||||
resolve(response);
|
resolve(response);
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -18,7 +18,9 @@ const defaultExpense = {
|
|||||||
const reducer = createReducer(initialState, {
|
const reducer = createReducer(initialState, {
|
||||||
[t.EXPENSE_SET]: (state, action) => {
|
[t.EXPENSE_SET]: (state, action) => {
|
||||||
const { id, expense } = action.payload;
|
const { id, expense } = action.payload;
|
||||||
state.items[id] = { ...defaultExpense, ...expense };
|
const oldExpense = state.items[id] || {};
|
||||||
|
|
||||||
|
state.items[id] = { ...defaultExpense, ...oldExpense, ...expense };
|
||||||
},
|
},
|
||||||
|
|
||||||
[t.EXPENSE_PUBLISH]: (state, action) => {
|
[t.EXPENSE_PUBLISH]: (state, action) => {
|
||||||
@@ -29,9 +31,10 @@ const reducer = createReducer(initialState, {
|
|||||||
},
|
},
|
||||||
|
|
||||||
[t.EXPENSES_ITEMS_SET]: (state, action) => {
|
[t.EXPENSES_ITEMS_SET]: (state, action) => {
|
||||||
|
const { expenses } = action.payload;
|
||||||
const _expenses = {};
|
const _expenses = {};
|
||||||
|
|
||||||
action.expenses.forEach((expense) => {
|
expenses.forEach((expense) => {
|
||||||
_expenses[expense.id] = {
|
_expenses[expense.id] = {
|
||||||
...defaultExpense,
|
...defaultExpense,
|
||||||
...expense,
|
...expense,
|
||||||
@@ -44,17 +47,19 @@ const reducer = createReducer(initialState, {
|
|||||||
},
|
},
|
||||||
|
|
||||||
[t.EXPENSES_PAGE_SET]: (state, action) => {
|
[t.EXPENSES_PAGE_SET]: (state, action) => {
|
||||||
const viewId = action.customViewId || -1;
|
const { customViewId, expenses } = action.payload;
|
||||||
|
const viewId = customViewId || -1;
|
||||||
const view = state.views[viewId] || {};
|
const view = state.views[viewId] || {};
|
||||||
|
|
||||||
state.views[viewId] = {
|
state.views[viewId] = {
|
||||||
...view,
|
...view,
|
||||||
ids: action.expenses.map((i) => i.id),
|
ids: expenses.map((i) => i.id),
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
[t.EXPENSES_TABLE_LOADING]: (state, action) => {
|
[t.EXPENSES_TABLE_LOADING]: (state, action) => {
|
||||||
state.loading = action.loading;
|
const { loading } = action.payload;
|
||||||
|
state.loading = loading;
|
||||||
},
|
},
|
||||||
|
|
||||||
[t.EXPENSES_SET_CURRENT_VIEW]: (state, action) => {
|
[t.EXPENSES_SET_CURRENT_VIEW]: (state, action) => {
|
||||||
@@ -63,7 +68,6 @@ const reducer = createReducer(initialState, {
|
|||||||
|
|
||||||
[t.EXPENSE_DELETE]: (state, action) => {
|
[t.EXPENSE_DELETE]: (state, action) => {
|
||||||
const { id } = action.payload;
|
const { id } = action.payload;
|
||||||
// state.items = omit(state.items, [id]);
|
|
||||||
|
|
||||||
if (typeof state.items[id] !== 'undefined') {
|
if (typeof state.items[id] !== 'undefined') {
|
||||||
delete state.items[id];
|
delete state.items[id];
|
||||||
|
|||||||
Reference in New Issue
Block a user