feat: Item validate cost, income and inventory account type.

feat: Style sales and purchases forms - 80% progress. feat: Validate purchase-able and sell-able items in invoices and bills. feat: Fix bugs in inventory FIFO/LIFO cost methods.
2026-02-17 05:10:31 +00:00 · 2020-08-22 11:58:08 +02:00
parent b46570dc01
commit 45088b2d3b
34 changed files with 841 additions and 636 deletions
--- a/client/src/containers/Purchases/Bill/BillForm.js
+++ b/client/src/containers/Purchases/Bill/BillForm.js
@@ -9,6 +9,7 @@ import * as Yup from 'yup';
 import { useFormik } from 'formik';
 import moment from 'moment';
 import { Intent, FormGroup, TextArea } from '@blueprintjs/core';
+import { Row, Col } from 'react-grid-system';

 import { FormattedMessage as T, useIntl } from 'react-intl';
 import { pick } from 'lodash';
@@ -291,15 +292,22 @@ function BillForm({
          onClickAddNewRow={onClickAddNewRow}
          onClickClearAllLines={onClickCleanAllLines}
        />
-        <FormGroup label={<T id={'note'} />} className={'form-group--'}>
-          <TextArea growVertically={true} {...formik.getFieldProps('note')} />
-        </FormGroup>
-        <Dragzone
-          initialFiles={initialAttachmentFiles}
-          onDrop={handleDropFiles}
-          onDeleteFile={handleDeleteFile}
-          hint={'Attachments: Maxiumum size: 20MB'}
-        />
+        <Row>
+          <Col>
+            <FormGroup label={<T id={'note'} />} className={'form-group--'}>
+              <TextArea growVertically={true} {...formik.getFieldProps('note')} />
+            </FormGroup>
+          </Col>
+
+          <Col>
+            <Dragzone
+              initialFiles={initialAttachmentFiles}
+              onDrop={handleDropFiles}
+              onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            />
+          </Col>
+        </Row>
      </form>
      <BillFormFooter
        formik={formik}
--- a/client/src/containers/Purchases/Bill/BillFormFooter.js
+++ b/client/src/containers/Purchases/Bill/BillFormFooter.js
@@ -9,7 +9,7 @@ export default function BillFormFooter({
  bill,
 }) {
  return (
-    <div>
+    <div className={'form__floating-footer'}>
      <Button
        disabled={isSubmitting}
        intent={Intent.PRIMARY}
--- a/client/src/containers/Purchases/Bill/BillFormHeader.js
+++ b/client/src/containers/Purchases/Bill/BillFormHeader.js
@@ -76,12 +76,10 @@ function BillFormHeader({
    }
  };

-  console.log(vendorsCurrentPage, 'vendorsCurrentPage');
-  console.log(vendorItems, 'vendorItems');
  return (
-    <div>
-      <div>
-        {/* vendor  account name */}
+    <div className="page-form page-form--bill">
+      <div className={'page-form__primary-section'}>
+        {/* Vendor  account name */}
        <FormGroup
          label={<T id={'vendor_name'} />}
          inline={true}
--- a/client/src/containers/Purchases/BillForm.js
+++ b/client/src/containers/Purchases/BillForm.js
@@ -11,7 +11,8 @@ import moment from 'moment';
 import { Intent, FormGroup, TextArea } from '@blueprintjs/core';

 import { FormattedMessage as T, useIntl } from 'react-intl';
-import { pick, omit } from 'lodash';
+import { omit } from 'lodash';
+import { Row, Col } from 'react-grid-system';

 import BillFormHeader from './BillFormHeader';
 import EstimatesItemsTable from 'containers/Sales/Estimate/EntriesItemsTable';
@@ -273,15 +274,24 @@ function BillForm({
          onClickAddNewRow={onClickAddNewRow}
          onClickClearAllLines={onClickCleanAllLines}
        />
-        <FormGroup label={<T id={'note'} />} className={'form-group--'}>
-          <TextArea growVertically={true} {...formik.getFieldProps('note')} />
-        </FormGroup>
-        <Dragzone
-          initialFiles={initialAttachmentFiles}
-          onDrop={handleDropFiles}
-          onDeleteFile={handleDeleteFile}
-          hint={'Attachments: Maxiumum size: 20MB'}
-        />
+
+        <Row>
+          <Col>
+            <FormGroup label={<T id={'note'} />} className={'form-group--'}>
+              <TextArea growVertically={true} {...formik.getFieldProps('note')} />
+            </FormGroup>
+          </Col>
+
+          <Col>
+            <Dragzone
+              initialFiles={initialAttachmentFiles}
+              onDrop={handleDropFiles}
+              onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            />
+          </Col>
+        </Row>
+      
        <BillFormFooter
          formik={formik}
          onSubmit={handleSubmitClick}
--- a/client/src/containers/Sales/Estimate/EntriesItemsTable.js
+++ b/client/src/containers/Sales/Estimate/EntriesItemsTable.js
@@ -1,10 +1,11 @@
 import React, { useState, useMemo, useEffect, useCallback } from 'react';
+import { omit } from 'lodash';
 import { Button, Intent, Position, Tooltip } from '@blueprintjs/core';
 import { FormattedMessage as T, useIntl } from 'react-intl';
+
+import CLASSES from 'components/classes';
 import DataTable from 'components/DataTable';
 import Icon from 'components/Icon';
-
-import { compose, formattedAmount } from 'utils';
 import {
  InputGroupCell,
  MoneyFieldCell,
@@ -14,7 +15,7 @@ import {
 } from 'components/DataTableCells';

 import withItems from 'containers/Items/withItems';
-import { omit } from 'lodash';
+import { compose, formattedAmount } from 'utils';

 const ActionsCellRenderer = ({
  row: { index },
@@ -92,6 +93,7 @@ function EstimateTable({
        width: 40,
        disableResizing: true,
        disableSortBy: true,
+        className: 'index',
      },
      {
        Header: formatMessage({ id: 'product_and_service' }),
@@ -108,6 +110,7 @@ function EstimateTable({
        Cell: InputGroupCell,
        disableSortBy: true,
        className: 'description',
+        width: 120,
      },

      {
@@ -123,7 +126,7 @@ function EstimateTable({
        accessor: 'rate',
        Cell: TotalEstimateCellRederer(MoneyFieldCell, 'rate'),
        disableSortBy: true,
-        width: 150,
+        width: 100,
        className: 'rate',
      },
      {
@@ -230,8 +233,9 @@ function EstimateTable({
          updateData: handleUpdateData,
          removeRow: handleRemoveRow,
        }}
+        className={CLASSES.DATATABLE_EDITOR}
      />
-      <div className={'mt1'}>
+      <div className={'datatable-editor-actions mt1'}>
        <Button
          small={true}
          className={'button--secondary button--new-line'}
--- a/client/src/containers/Sales/Estimate/Estimate.schema.js
+++ b/client/src/containers/Sales/Estimate/Estimate.schema.js
--- a/client/src/containers/Sales/Estimate/EstimateForm.js
+++ b/client/src/containers/Sales/Estimate/EstimateForm.js
@@ -5,14 +5,13 @@ import React, {
  useRef,
  useState,
 } from 'react';
-
 import * as Yup from 'yup';
 import { useFormik } from 'formik';
 import moment from 'moment';
-import { Intent, FormGroup, TextArea, Button } from '@blueprintjs/core';
+import { Intent, FormGroup, TextArea } from '@blueprintjs/core';
 import { FormattedMessage as T, useIntl } from 'react-intl';
-import { pick, omit } from 'lodash';
-import { queryCache } from 'react-query';
+import { pick } from 'lodash';
+import { Row, Col } from 'react-grid-system';

 import EstimateFormHeader from './EstimateFormHeader';
 import EstimatesItemsTable from './EntriesItemsTable';
@@ -103,13 +102,11 @@ const EstimateForm = ({
      .min(1)
      .max(1024)
      .label(formatMessage({ id: 'note' })),
-
    terms_conditions: Yup.string()
      .trim()
      .min(1)
      .max(1024)
      .label(formatMessage({ id: 'note' })),
-
    entries: Yup.array().of(
      Yup.object().shape({
        quantity: Yup.number().nullable(),
@@ -320,27 +317,35 @@ const EstimateForm = ({
          formik={formik}
          // defaultRow={defaultEstimate}
        />
-        <FormGroup
-          label={<T id={'customer_note'} />}
-          className={'form-group--customer_note'}
-        >
-          <TextArea growVertically={true} {...formik.getFieldProps('note')} />
-        </FormGroup>
-        <FormGroup
-          label={<T id={'terms_conditions'} />}
-          className={'form-group--terms_conditions'}
-        >
-          <TextArea
-            growVertically={true}
-            {...formik.getFieldProps('terms_conditions')}
-          />
-        </FormGroup>
-        <Dragzone
-          initialFiles={initialAttachmentFiles}
-          onDrop={handleDropFiles}
-          onDeleteFile={handleDeleteFile}
-          hint={'Attachments: Maxiumum size: 20MB'}
-        />
+
+        <Row>
+          <Col>
+            <FormGroup
+              label={<T id={'customer_note'} />}
+              className={'form-group--customer_note'}
+            >
+              <TextArea growVertically={true} {...formik.getFieldProps('note')} />
+            </FormGroup>
+            <FormGroup
+              label={<T id={'terms_conditions'} />}
+              className={'form-group--terms_conditions'}
+            >
+              <TextArea
+                growVertically={true}
+                {...formik.getFieldProps('terms_conditions')}
+              />
+            </FormGroup>
+          </Col>
+
+          <Col>
+            <Dragzone
+              initialFiles={initialAttachmentFiles}
+              onDrop={handleDropFiles}
+              onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            />
+          </Col>
+        </Row>
      </form>
      <EstimateFormFooter
        formik={formik}
--- a/client/src/containers/Sales/Estimate/EstimateFormFooter.js
+++ b/client/src/containers/Sales/Estimate/EstimateFormFooter.js
@@ -11,7 +11,7 @@ export default function EstimateFormFooter({
  estimate,
 }) {
  return (
-    <div className={'estimate-form__floating-footer'}>
+    <div className={'form__floating-footer'}>
      <Button
        disabled={isSubmitting}
        intent={Intent.PRIMARY}
--- a/client/src/containers/Sales/Estimate/EstimateFormHeader.js
+++ b/client/src/containers/Sales/Estimate/EstimateFormHeader.js
@@ -68,13 +68,16 @@ function EstimateFormHeader({
  );

  return (
-    <div className={'estimate-form'}>
-      <div className={'estimate-form__primary-section'}>
-        {/* customer name */}
+    <div className={'page-form page-form--estimate'}>
+      <div className={'page-form__primary-section'}>
        <FormGroup
          label={<T id={'customer_name'} />}
          inline={true}
-          className={classNames('form-group--select-list', Classes.FILL)}
+          className={classNames(
+            'form-group--select-list',
+            'form-group--customer',
+            Classes.FILL,
+          )}
          labelInfo={<FieldRequiredHint />}
          intent={errors.customer_id && touched.customer_id && Intent.DANGER}
          helperText={
@@ -94,7 +97,7 @@ function EstimateFormHeader({
            labelProp={'display_name'}
          />
        </FormGroup>
-        {/* estimate_date */}
+        
        <Row>
          <Col

@@ -104,7 +107,11 @@ function EstimateFormHeader({
              label={<T id={'estimate_date'} />}
              inline={true}
              labelInfo={<FieldRequiredHint />}
-              className={classNames('form-group--select-list', Classes.FILL)}
+              className={classNames(
+                'form-group--select-list',
+                Classes.FILL,
+                'form-group--estimate-date'
+              )}
              intent={
                errors.estimate_date && touched.estimate_date && Intent.DANGER
              }
@@ -127,7 +134,11 @@ function EstimateFormHeader({
            <FormGroup
              label={<T id={'expiration_date'} />}
              inline={true}
-              className={classNames('form-group--select-list', Classes.FILL)}
+              className={classNames(
+                'form-group--select-list',
+                'form-group--expiration-date',
+                Classes.FILL
+              )}
              intent={
                errors.expiration_date &&
                touched.expiration_date &&
@@ -147,11 +158,12 @@ function EstimateFormHeader({
          </Col>
        </Row>
      </div>
-      {/* Estimate */}
+
+      {/*- Estimate -*/}
      <FormGroup
        label={<T id={'estimate'} />}
        inline={true}
-        className={('form-group--estimate', Classes.FILL)}
+        className={('form-group--estimate-number', Classes.FILL)}
        labelInfo={<FieldRequiredHint />}
        intent={
          errors.estimate_number && touched.estimate_number && Intent.DANGER
@@ -168,6 +180,7 @@ function EstimateFormHeader({
          {...getFieldProps('estimate_number')}
        />
      </FormGroup>
+    
      <FormGroup
        label={<T id={'reference'} />}
        inline={true}
--- a/client/src/containers/Sales/Estimate/Estimates.js
+++ b/client/src/containers/Sales/Estimate/Estimates.js
@@ -33,6 +33,7 @@ function Estimates({
    requestFetchCustomers({}),
  );

+  // 
  const handleFormSubmit = useCallback(
    (payload) => {
      payload.redirect && history.push('/estimates');
--- a/client/src/containers/Sales/Estimate/withEstimates.js
+++ b/client/src/containers/Sales/Estimate/withEstimates.js
@@ -13,6 +13,7 @@ export default (mapState) => {

  const mapStateToProps = (state, props) => {
    const query = getEstimatesTableQuery(state, props);
+  
    const mapped = {
      estimatesCurrentPage: getEstimatesItems(state, props, query),
      estimateViews: getResourceViews(state, props, 'sales_estimates'),
--- a/client/src/containers/Sales/Invoice/InvoiceForm.js
+++ b/client/src/containers/Sales/Invoice/InvoiceForm.js
@@ -11,6 +11,7 @@ import moment from 'moment';
 import { Intent, FormGroup, TextArea, Button } from '@blueprintjs/core';
 import { FormattedMessage as T, useIntl } from 'react-intl';
 import { pick } from 'lodash';
+import { Row, Col } from 'react-grid-system';

 import InvoiceFormHeader from './InvoiceFormHeader';
 import EstimatesItemsTable from 'containers/Sales/Estimate/EntriesItemsTable';
@@ -308,31 +309,38 @@ function InvoiceForm({
          onClickClearAllLines={handleClearAllLines}
          formik={formik}
        />
-        <FormGroup
-          label={<T id={'invoice_message'} />}
-          className={'form-group--customer_note'}
-        >
-          <TextArea
-            growVertically={true}
-            {...formik.getFieldProps('invoice_message')}
-          />
-        </FormGroup>
-        <FormGroup
-          label={<T id={'terms_conditions'} />}
-          className={'form-group--terms_conditions'}
-        >
-          <TextArea
-            growVertically={true}
-            {...formik.getFieldProps('terms_conditions')}
-          />
-        </FormGroup>
-        <Dragzone
-          initialFiles={initialAttachmentFiles}
-          onDrop={handleDropFiles}
-          onDeleteFile={handleDeleteFile}
-          hint={'Attachments: Maxiumum size: 20MB'}
-        />
+        <Row>
+          <Col>
+            <FormGroup
+              label={<T id={'invoice_message'} />}
+              className={'form-group--customer_note'}
+            >
+              <TextArea
+                growVertically={true}
+                {...formik.getFieldProps('invoice_message')}
+              />
+            </FormGroup>
+            <FormGroup
+              label={<T id={'terms_conditions'} />}
+              className={'form-group--terms_conditions'}
+            >
+              <TextArea
+                growVertically={true}
+                {...formik.getFieldProps('terms_conditions')}
+              />
+            </FormGroup>
+          </Col>
+
+          <Col>
+            <Dragzone
+              initialFiles={initialAttachmentFiles}
+              onDrop={handleDropFiles}
+              onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            /></Col>
+        </Row>
      </form>
+
      <InvoiceFormFooter
        formik={formik}
        onSubmitClick={handleSubmitClick}
--- a/client/src/containers/Sales/Invoice/InvoiceFormFooter.js
+++ b/client/src/containers/Sales/Invoice/InvoiceFormFooter.js
@@ -9,7 +9,7 @@ export default function EstimateFormFooter({
  invoice,
 }) {
  return (
-    <div className={'estimate-form__floating-footer'}>
+    <div className={'form__floating-footer'}>
      <Button
        disabled={isSubmitting}
        intent={Intent.PRIMARY}
--- a/client/src/containers/Sales/Invoice/InvoiceFormHeader.js
+++ b/client/src/containers/Sales/Invoice/InvoiceFormHeader.js
@@ -68,8 +68,8 @@ function InvoiceFormHeader({
  );

  return (
-    <div className={'invoice-form'}>
-      <div className={'invoice__primary-section'}>
+    <div class="page-form page-form--invoice">
+      <div className={'page-form__primary-section'}>
        {/* customer name */}
        <FormGroup
          label={<T id={'customer_name'} />}
--- a/client/src/containers/Sales/Receipt/ReceiptForm.js
+++ b/client/src/containers/Sales/Receipt/ReceiptForm.js
@@ -12,6 +12,7 @@ import moment from 'moment';
 import { Intent, FormGroup, TextArea } from '@blueprintjs/core';
 import { FormattedMessage as T, useIntl } from 'react-intl';
 import { pick } from 'lodash';
+import { Row, Col } from 'react-grid-system';

 import ReceiptFromHeader from './ReceiptFormHeader';
 import EstimatesItemsTable from 'containers/Sales/Estimate/EntriesItemsTable';
@@ -296,31 +297,38 @@ function ReceiptForm({
          onClickClearAllLines={handleClearAllLines}
          formik={formik}
        />
-        <FormGroup
-          label={<T id={'receipt_message'} />}
-          className={'form-group--'}
-        >
-          <TextArea
-            growVertically={true}
-            {...formik.getFieldProps('receipt_message')}
-          />
-        </FormGroup>
-        <FormGroup
-          label={<T id={'statement'} />}
-          className={'form-group--statement'}
-        >
-          <TextArea
-            growVertically={true}
-            {...formik.getFieldProps('statement')}
-          />
-        </FormGroup>

-        <Dragzone
-          initialFiles={initialAttachmentFiles}
-          onDrop={handleDropFiles}
-          onDeleteFile={handleDeleteFile}
-          hint={'Attachments: Maxiumum size: 20MB'}
-        />
+        <Row>
+          <Col>
+            <FormGroup
+              label={<T id={'receipt_message'} />}
+              className={'form-group--'}
+            >
+              <TextArea
+                growVertically={true}
+                {...formik.getFieldProps('receipt_message')}
+              />
+            </FormGroup>
+            <FormGroup
+              label={<T id={'statement'} />}
+              className={'form-group--statement'}
+            >
+              <TextArea
+                growVertically={true}
+                {...formik.getFieldProps('statement')}
+              />
+            </FormGroup>          
+          </Col>
+
+          <Col>
+            <Dragzone
+              initialFiles={initialAttachmentFiles}
+              onDrop={handleDropFiles}
+              onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            />
+          </Col>
+        </Row>        
      </form>
      <ReceiptFormFooter
        formik={formik}
--- a/client/src/containers/Sales/Receipt/ReceiptFormFooter.js
+++ b/client/src/containers/Sales/Receipt/ReceiptFormFooter.js
@@ -9,7 +9,7 @@ export default function ReceiptFormFooter({
  receipt,
 }) {
  return (
-    <div className={'estimate-form__floating-footer'}>
+    <div className={'form__floating-footer'}>
      <Button
        disabled={isSubmitting}
        intent={Intent.PRIMARY}
--- a/client/src/containers/Sales/Receipt/ReceiptFormHeader.js
+++ b/client/src/containers/Sales/Receipt/ReceiptFormHeader.js
@@ -83,13 +83,17 @@ function ReceiptFormHeader({
  );

  return (
-    <div>
-      <div>
-        {/* customer name */}
+    <div class="page-form receipt-form">
+      <div class="page-form__primary-section">
+        {/*- Customer name -*/}
        <FormGroup
          label={<T id={'customer_name'} />}
          inline={true}
-          className={classNames('form-group--select-list', Classes.FILL)}
+          className={classNames(
+            'form-group--select-list',
+            Classes.FILL,
+            'form-group--customer',
+          )}
          labelInfo={<FieldRequiredHint />}
          intent={errors.customer_id && touched.customer_id && Intent.DANGER}
          helperText={
@@ -110,10 +114,11 @@ function ReceiptFormHeader({
          />
        </FormGroup>

+        {/*- Deposit account -*/}
        <FormGroup
          label={<T id={'deposit_account'} />}
          className={classNames(
-            'form-group--deposit_account_id',
+            'form-group--deposit-account',
            'form-group--select-list',
            Classes.FILL,
          )}
@@ -172,6 +177,7 @@ function ReceiptFormHeader({
        />
      </FormGroup> */}

+      {/*- Reference -*/}
      <FormGroup
        label={<T id={'reference'} />}
        inline={true}
@@ -185,6 +191,8 @@ function ReceiptFormHeader({
          {...getFieldProps('reference_no')}
        />
      </FormGroup>
+
+      {/*- Send to email -*/}
      <FormGroup
        label={<T id={'send_to_email'} />}
        inline={true}