rewrite tables

2020-10-06 11:14:51 +03:00 · 2020-10-06 11:14:51 +03:00 · 8edbb0b342
commit 8edbb0b342
parent 839f1fe62a
24 changed files with 616 additions and 621 deletions
--- a/src/client/Containers/Calculation/Results/resultsList.ts
+++ b/src/client/Containers/Calculation/Results/resultsList.ts
@ -15,7 +15,7 @@ const resultsList: IGroup[] = [
            Component: Label,
            props: {
              name: 'lblLead',
-              computedValue: 'leadName',
+              computedValueName: 'leadName',
            },
          },
          {
@ -23,7 +23,7 @@ const resultsList: IGroup[] = [
            Component: Label,
            props: {
              name: 'lblOpportunity',
-              computedValue: 'opportunityName',
+              computedValueName: 'opportunityName',
            },
          },
          {
--- a/src/client/Containers/Calculation/Sections/sectionsList.ts
+++ b/src/client/Containers/Calculation/Sections/sectionsList.ts
@ -599,6 +599,33 @@ const sections: ISections[] = [
              },
            ],
          },
+          // {
+          //   elements: [
+          //     {
+          //       type: ElementType.Table,
+          //       Component: Table,
+          //       props: {
+          //         name: 'tablePayments',
+          //         features: {
+          //           canDeleteRow: false,
+          //           numerize: {
+          //             columnTitle: 'Номер платежа',
+          //           },
+          //         },
+          //         columns: [
+          //           {
+          //             name: 'paymentRelation',
+          //             title: 'Соотношение платежа',
+          //             Component: Label,
+          //           },
+          //         ],
+          //       },
+          //     },
+          //   ],
+          //   layout: {
+          //     newLine: true,
+          //   },
+          // },
        ],
      },
      {
@ -673,7 +700,7 @@ const sections: ISections[] = [
                Component: Label,
                props: {
                  name: 'labelLeaseObjectRisk',
-                  computedValue: 'leaseObjectRiskName',
+                  computedValueName: 'leaseObjectRiskName',
                },
              },

@ -1339,7 +1366,7 @@ const sections: ISections[] = [
                Component: InputNumber,
                props: {
                  name: 'tbxInsKaskoPriceLeasePeriod',
-                  computedValue: 'insKaskoPriceLeasePeriod',
+                  computedValueName: 'insKaskoPriceLeasePeriod',
                },
              },
            ],
@ -1351,9 +1378,6 @@ const sections: ISections[] = [
                Component: Table,
                props: {
                  name: 'tableInsurance',
-                  features: {
-                    // canDeleteRow: true,
-                  },
                  columns: [
                    {
                      name: 'policyType',
--- a/src/client/Containers/Calculation/index.jsx
+++ b/src/client/Containers/Calculation/index.jsx
@ -48,16 +48,9 @@ const Calculation = () => {
          calculationStore.setStaticData(staticEntities);
          calculationStore.applyOptions({ selectLead: leadOptions });
          calculationStore.applyOptions({ selectOpportunity: opportunities });
-          calculationStore.setTableColumn(
-            {
-              tableName: 'tableInsurance',
-            },
-            {
-              options: {
-                insuranceCompany: insuranceCompanies,
-              },
-            },
-          );
+          calculationStore.setTableColumns('tableInsurance')({
+            options: { insuranceCompany: insuranceCompanies },
+          });
          setReady(true);
        },
      )
--- a/src/client/Elements/Table.jsx
+++ b/src/client/Elements/Table.jsx
@ -53,42 +53,44 @@ const TableWrapper = styled(Box)`
  }
 `;

-const DeleteRowButton = ({ onClick }) => (
-  <Flex justifyContent="flex-end">
-    <AntButton type="text" danger onClick={onClick}>
-      Удалить
-    </AntButton>
-  </Flex>
-);
+// const DeleteRowButton = ({ onClick }) => (
+//   <Flex justifyContent="flex-end">
+//     <AntButton type="text" danger onClick={onClick}>
+//       Удалить
+//     </AntButton>
+//   </Flex>
+// );

-const Table = ({ name: tableName, columns, values, features, actions }) => {
-  const { canDeleteRow } = features;
-  if (!values) {
-    values = [];
-  }
+const Table = ({ name: tableName, columns, rows, features, actions }) => {
  return (
    <TableWrapper>
-      <table className="table">
+      <table>
        <thead>
          <tr>
-            {columns.map(({ name, title }, ci) => {
+            {features && features.numerize && (
+              <th>{features.numerize.columnTitle || '#'}</th>
+            )}
+            {columns.map(({ title }, ci) => {
              return <th key={ci}>{title}</th>;
            })}
-            {canDeleteRow && <th />}
+            {/* {features && features.canDeleteRow && <th />} */}
          </tr>
        </thead>
        <tbody>
-          {values.map((row, ri) => {
-            const keys = Object.keys(row);
+          {rows.map((row, ri) => {
+            const rowProps = Object.keys(row);
            return (
              <tr key={ri}>
-                {keys.map((key, ki) => {
-                  const columnIndex = columns.findIndex(c => c.name === key);
-                  const Component = columns[columnIndex].Component;
+                {features && features.numerize && <td>{ri + 1}</td>}
+                {rowProps.map((rowPropName, ki) => {
+                  const columnIndex = columns.findIndex(
+                    c => c.name === rowPropName,
+                  );
+                  const { Component } = columns[columnIndex];
                  const Element = withTableValue(Component)({
                    tableName,
                    rowIndex: ri,
-                    propName: key,
+                    propName: rowPropName,
                    ...columns[columnIndex].props,
                  });
                  return (
@ -97,7 +99,7 @@ const Table = ({ name: tableName, columns, values, features, actions }) => {
                    </td>
                  );
                })}
-                {canDeleteRow && (
+                {/* {features && features.canDeleteRow && (
                  <td>
                    <DeleteRowButton
                      onClick={() => {
@ -105,7 +107,7 @@ const Table = ({ name: tableName, columns, values, features, actions }) => {
                      }}
                    />
                  </td>
-                )}
+                )} */}
              </tr>
            );
          })}
--- a/src/client/hocs/withStore.js
+++ b/src/client/hocs/withStore.js
@ -1,28 +1,33 @@
-import { useOptions } from 'client/hooks/useOptions';
-import { useStatus, useTableStatus } from 'client/hooks/useStatus';
-import { useStoreValue, useTableValue } from 'client/hooks/useValue';
-import { useValidation } from 'client/hooks/useValidation';
-import { observer, useObserver } from 'mobx-react-lite';
-import React from 'react';
+import { useAction } from 'client/hooks/Calculation/useAction';
+import { useModal } from 'client/hooks/Calculation/useModal';
+import {
+  useOptions,
+  useTableOptions,
+} from 'client/hooks/Calculation/useOptions';
+import { useStatus, useTableStatus } from 'client/hooks/Calculation/useStatus';
+import { useValidation } from 'client/hooks/Calculation/useValidation';
+import {
+  useStoreValue,
+  useTableValue,
+} from 'client/hooks/Calculation/useValue';
 import { useStores } from 'client/hooks/useStores';
-import { useTableOptions } from 'client/hooks/useOptions';
-import { useModal } from 'client/hooks/useModal';
-import { useAction } from 'client/hooks/useAction';
+import { observer } from 'mobx-react-lite';
+import React from 'react';

 export const withStoreValue = Component => ({
  name,
  valueName,
-  computedValue,
+  computedValueName,
  validation,
  ...params
-}) => {
-  const ComponentWithStore = () => {
+}) =>
+  observer(() => {
    const { value, setCurrentValue, debouncedValue } = useStoreValue({
-      computedValue,
+      computedValueName,
      valueName,
    });
    const { status } = useStatus(name);
-    const { isValid, validateStatus, message } = useValidation({
+    const { validateStatus, message } = useValidation({
      elementName: name,
      value: debouncedValue,
      validation,
@ -40,38 +45,24 @@ export const withStoreValue = Component => ({
        {...params}
      />
    );
-  };
-  return observer(ComponentWithStore);
-};
+  });

 export const withTableData = Table => props => {
  const { name: tableName } = props;
  const ObservedTable = observer(Table);
-  const TableWithStore = useObserver(() => {
-    const { calculationStore } = useStores();
-    const tableData = calculationStore.tables[tableName];
-    return (
-      <ObservedTable
-        {...props}
-        {...tableData}
-        actions={{
-          deleteRow: rowIndex => {
-            calculationStore.deleteTableRow(tableName, rowIndex);
-          },
-        }}
-      />
-    );
-  });
-  return () => TableWithStore;
+  const { calculationStore } = useStores();
+  const tableData = calculationStore.tables[tableName];
+  return () => <ObservedTable {...props} {...tableData} />;
 };

 export const withTableValue = Component => ({
  tableName,
  rowIndex,
  propName,
+  validation,
  ...params
-}) => {
-  const ComponentWithStore = () => {
+}) =>
+  observer(() => {
    const { value, setCurrentValue } = useTableValue({
      tableName,
      rowIndex,
@ -94,12 +85,10 @@ export const withTableValue = Component => ({
        filter={filter}
      />
    );
-  };
-  return observer(ComponentWithStore);
-};
+  });

-export const withStoreModal = Modal => {
-  const ModalWithStore = () => {
+export const withStoreModal = Modal =>
+  observer(() => {
    const { isModalVisible, modalText, closeModal } = useModal();
    return (
      <Modal
@ -108,16 +97,12 @@ export const withStoreModal = Modal => {
        closeModal={closeModal}
      />
    );
-  };
-  return observer(ModalWithStore);
-};
+  });

-export const withStoreButton = Button => ({ name, actionName, ...params }) => {
-  const ButtonWithStore = () => {
+export const withStoreButton = Button => ({ name, actionName, ...params }) =>
+  observer(() => {
    const { status } = useStatus(name);
    const { action } = useAction({ actionName });

    return <Button {...params} status={status} action={action} />;
-  };
-  return observer(ButtonWithStore);
-};
+  });
--- a/src/client/hooks/Calculation/useAction.js
+++ b/src/client/hooks/Calculation/useAction.js
@ -1,4 +1,4 @@
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

 export const useAction = ({ actionName }) => {
  const { calculationStore } = useStores();
--- a/src/client/hooks/Calculation/useModal.js
+++ b/src/client/hooks/Calculation/useModal.js
@ -1,4 +1,4 @@
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

 export const useModal = () => {
  const { calculationStore } = useStores();
--- a/src/client/hooks/Calculation/useOptions.js
+++ b/src/client/hooks/Calculation/useOptions.js
@ -1,4 +1,4 @@
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

 export const useOptions = elementName => {
  const { calculationStore } = useStores();
@ -12,14 +12,10 @@ export const useOptions = elementName => {

 export const useTableOptions = ({ tableName, rowIndex, propName }) => {
  const { calculationStore } = useStores();
-  const options =
-    (calculationStore.tables[tableName].options &&
-      calculationStore.tables[tableName].options[propName]) ||
-    [];
+  const options = calculationStore.tables[tableName].options[propName] || [];
  const filter =
-    calculationStore.tables[tableName].filters &&
-    calculationStore.tables[tableName].filters[rowIndex] &&
-    calculationStore.tables[tableName].filters[rowIndex][propName];
+    calculationStore.tables[tableName].rows[rowIndex][propName].filter;
+
  return {
    options: filter ? filter(options) : options,
  };
--- a/src/client/hooks/Calculation/useStatus.js
+++ b/src/client/hooks/Calculation/useStatus.js
@ -1,4 +1,4 @@
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

 export const useStatus = elementName => {
  const { calculationStore } = useStores();
@ -10,9 +10,6 @@ export const useStatus = elementName => {
 export const useTableStatus = ({ tableName, rowIndex, propName }) => {
  const { calculationStore } = useStores();
  const status =
-    calculationStore.tables[tableName].statuses &&
-    calculationStore.tables[tableName].statuses[rowIndex]
-      ? calculationStore.tables[tableName].statuses[rowIndex][propName]
-      : undefined;
+    calculationStore.tables[tableName].rows[rowIndex][propName].status;
  return { status };
 };
--- a/src/client/hooks/Calculation/useValidation.ts
+++ b/src/client/hooks/Calculation/useValidation.ts
@ -2,12 +2,13 @@ import { ValidateStatus } from 'antd/lib/form/FormItem';
 import { INVALID_INPUT as INVALID_INPUT_MESSAGE } from 'core/constants/errorMessages';
 import { ElementsNames } from 'core/types/elements';
 import { useEffect, useState } from 'react';
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

+type TValidation = { errorMessage: string; validator: Function };
 interface IUseValidationArgs {
  elementName: ElementsNames;
  value: any;
-  validation: { errorMessage: string; validator: Function };
+  validation: TValidation;
 }

 export const useValidation = ({
@ -38,7 +39,7 @@ export const useValidation = ({
        calculationStore.setValidation(elementName, validationResult);
      }
    }
-  }, [value, validator, elementName]);
+  }, [calculationStore, elementName, validator, value]);

  const getValidateStatus = (): ValidateStatus | undefined => {
    if (isValid === undefined) {
--- a/src/client/hooks/Calculation/useValue.js
+++ b/src/client/hooks/Calculation/useValue.js
@ -1,9 +1,10 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import { DEFAULT_DEBOUNCE_DELAY } from 'core/constants/debounce';
 import { useEffect, useState } from 'react';
 import { useDebounce } from 'use-debounce/lib';
-import { useStores } from './useStores';
+import { useStores } from '../useStores';

-export const useStoreValue = ({ computedValue, valueName }) => {
+export const useStoreValue = ({ computedValueName, valueName }) => {
  const { calculationStore } = useStores();
  const [currentValue, setCurrentValue] = useState(undefined);
  const [debouncedValue] = useDebounce(currentValue, DEFAULT_DEBOUNCE_DELAY);
@ -12,22 +13,24 @@ export const useStoreValue = ({ computedValue, valueName }) => {

  // get value from store
  useEffect(() => {
-    if (!computedValue) {
+    if (!computedValueName) {
      if (sourceValue !== undefined) {
        setCurrentValue(sourceValue);
      }
    }
-  }, [computedValue, sourceValue]);
+  }, [computedValueName, sourceValue]);

  // set value to store
  useEffect(() => {
-    if (!computedValue) {
-      calculationStore.setValue(valueName, debouncedValue);
+    if (!computedValueName) {
+      if (debouncedValue !== undefined) {
+        calculationStore.setValue(valueName, debouncedValue);
+      }
    }
-  }, [calculationStore, computedValue, debouncedValue, valueName]);
+  }, [computedValueName, debouncedValue]);

-  const value = computedValue
-    ? calculationStore[computedValue]()
+  const value = computedValueName
+    ? calculationStore[computedValueName]()
    : currentValue;

  return { value, setCurrentValue, debouncedValue };
@ -39,35 +42,36 @@ export const useTableValue = ({ tableName, rowIndex, propName }) => {
  const [debouncedValue] = useDebounce(currentValue, DEFAULT_DEBOUNCE_DELAY);

  const sourceValue =
-    calculationStore.tables[tableName].values[rowIndex][propName];
-
-  // get value from store
+    calculationStore.tables[tableName].rows[rowIndex][propName].value;
  useEffect(() => {
    if (sourceValue !== undefined) {
      setCurrentValue(sourceValue);
    }
  }, [sourceValue]);

-  // set value to store
  useEffect(() => {
-    calculationStore.setTableRow(
-      {
+    if (debouncedValue !== undefined)
+      calculationStore.setTableRows(
        tableName,
        rowIndex,
-      },
-      { values: { [propName]: debouncedValue } },
-    );
-  }, [calculationStore, debouncedValue, propName, rowIndex, tableName]);
+      )([
+        {
+          [propName]: {
+            value: debouncedValue,
+          },
+        },
+      ]);
+  }, [debouncedValue]);
+
+  const cellCallBack =
+    calculationStore.tables[tableName].callbacks &&
+    calculationStore.tables[tableName].callbacks[propName];

-  // onset debounced value to cell callback
-  const cellCallback = calculationStore.tables[tableName].callbacks
-    ? calculationStore.tables[tableName].callbacks[propName]
-    : undefined;
  useEffect(() => {
-    if (cellCallback) {
-      cellCallback(calculationStore, tableName, rowIndex, propName);
+    if (cellCallBack) {
+      cellCallBack(calculationStore, tableName, rowIndex, propName);
    }
-  }, [cellCallback, debouncedValue]);
+  }, [debouncedValue, cellCallBack]);

  return { value: currentValue, setCurrentValue, debouncedValue };
 };
--- a/src/client/stores/CalculationStore/Data/tables.js
+++ b/src/client/stores/CalculationStore/Data/tables.js
@ -4,107 +4,59 @@ const tablesData = {
  tables: initialTables,
 };

-const checkIsTableExist = function (tableName) {
-  if (!this.tables[tableName]) {
-    throw new Error(`Table ${tableName} doesn't exist in store!`);
-  }
-};
-
-const addRowParams = function (tableName, rowIndex, targetName, params) {
-  if (!this.tables[tableName][targetName]) {
-    this.tables[tableName][targetName] = [];
-  }
-
-  this.tables[tableName][targetName].splice(rowIndex, 0, params || {});
-};
-
-const setRowParams = function (tableName, rowIndex, targetName, params) {
-  if (
-    params &&
-    Object.keys(params).length > 0 &&
-    !Object.values(params).every(x => x === undefined)
-  )
-    this.tables[tableName][targetName][rowIndex] = Object.assign(
-      this.tables[tableName][targetName][rowIndex] ?? {},
-      params,
-    );
-};
-
 const tablesActions = {
-  addTableRow({ tableName, rowIndex }, params) {
-    checkIsTableExist.call(this, tableName);
-    if (rowIndex === undefined) {
-      rowIndex = this.tables[tableName].values.length;
-    }
-
-    for (let paramsName in params) {
-      addRowParams.call(
-        this,
-        tableName,
-        rowIndex,
-        paramsName,
-        params[paramsName],
-      );
-    }
-  },
-
-  setTableRow({ tableName, rowIndex }, params) {
-    checkIsTableExist.call(this, tableName);
-
-    if (!this.tables[tableName].values[rowIndex]) {
-      throw new Error(`Missing row#${rowIndex} in table ${tableName}!`);
-    }
-
-    for (let paramsName in params) {
-      setRowParams.call(
-        this,
-        tableName,
-        rowIndex,
-        paramsName,
-        params[paramsName],
-      );
-    }
-  },
-
-  setTableColumn({ tableName }, { options, callbacks }) {
-    checkIsTableExist.call(this, tableName);
-
-    const applyColumnParams = (targetName, values) => {
-      if (!this.tables[tableName][targetName]) {
-        this.tables[tableName][targetName] = {};
-      }
-      this.tables[tableName][targetName] = Object.assign(
-        {},
-        this.tables[tableName][targetName],
-        values,
-      );
-    };
-
-    if (options && Object.keys(options).length > 0) {
-      applyColumnParams('options', options);
-    }
-    if (callbacks && Object.keys(callbacks).length > 0) {
-      applyColumnParams('callbacks', callbacks);
-    }
-  },
-
-  setTable({ tableName }, values) {
-    if (!this.tables[tableName]) {
-      this.tables[tableName] = {};
-    }
-    this.tables[tableName].values = values;
-  },
-
-  deleteTableRow(tableName, rowIndex) {
-    checkIsTableExist.call(this, tableName);
-    const targetTable = this.tables[tableName];
-    if (targetTable.values) targetTable.values.splice(rowIndex, 1);
-    if (targetTable.statuses) targetTable.statuses.splice(rowIndex, 1);
-    if (targetTable.filters) targetTable.filters.splice(rowIndex, 1);
-  },
-
  cleanTable(tableName) {
-    this.tables[tableName] = {};
+    this.tables[tableName].rows.length = 0;
+  },
+
+  getTableRowValues(tableName, rowIndex, paramName) {
+    let values = {};
+    const row = this.tables[tableName].rows[rowIndex];
+    const keys = Object.keys(row);
+    for (let key of keys) {
+      values[key] = row[key][paramName || 'value'];
+    }
+    return values;
+  },
+
+  setTableRows(tableName, startIndex, override) {
+    return rows => {
+      for (let i = startIndex, j = 0; i < startIndex + rows.length; i++, j++) {
+        if (!override) {
+          const cellNames = Object.keys(rows[j]);
+          for (let cellName of cellNames) {
+            if (this.tables[tableName].rows[i]) {
+              if (this.tables[tableName].rows[i][cellName]) {
+                this.tables[tableName].rows[i][cellName] = Object.assign(
+                  this.tables[tableName].rows[i][cellName],
+                  rows[j][cellName],
+                );
+              }
+            } else {
+              this.tables[tableName].rows.splice(i, 0, rows[j]);
+            }
+          }
+        } else {
+          this.tables[tableName].rows[i] = Object.assign({}, rows[j]);
+        }
+      }
+    };
+  },
+
+  setTableColumns(tableName, override) {
+    return columnParams => {
+      for (let paramsName in columnParams) {
+        if (!override) {
+          this.tables[tableName][paramsName] = Object.assign(
+            {},
+            this.tables[tableName][paramsName] ?? {},
+            columnParams[paramsName],
+          );
+        } else {
+          this.tables[tableName][paramsName] = columnParams[paramsName];
+        }
+      }
+    };
  },
 };

--- a/src/client/stores/CalculationStore/Effects/action.ts
+++ b/src/client/stores/CalculationStore/Effects/action.ts
@ -146,15 +146,16 @@ const actions: TAction = {
    }
  },
  calculate: () => {
-    const { values: tableValues } = CalculationStore.tables.tableInsurance;
-    const kaskoRow = tableValues.find(x => x.policyType === 'КАСКО');
-    const DGORow = tableValues.find(x => x.policyType === 'ДГО');
-    const NSRow = tableValues.find(x => x.policyType === 'НС');
+    const { rows } = CalculationStore.tables.tableInsurance;
+    const kaskoRow = rows[1];
+    const DGORow = rows[2];
+    const NSRow = rows[3];

    if (
      kaskoRow &&
-      kaskoRow.insCost === 0 &&
-      ((DGORow && DGORow.insCost > 0) || (NSRow && NSRow.insCost > 0))
+      kaskoRow.insCost?.value === 0 &&
+      ((DGORow && DGORow.insCost?.value > 0) ||
+        (NSRow && NSRow.insCost?.value > 0))
    ) {
      openNotification({
        type: 'error',
@ -164,7 +165,11 @@ const actions: TAction = {
      return;
    }

-    if (kaskoRow && kaskoRow.insured === 100000001 && kaskoRow.insCost === 0) {
+    if (
+      kaskoRow &&
+      kaskoRow.insured?.value === 100000001 &&
+      kaskoRow.insCost?.value === 0
+    ) {
      openNotification({
        type: 'error',
        title: 'Ошибка во время расчета графика',
--- a/src/client/stores/CalculationStore/Effects/computed.js
+++ b/src/client/stores/CalculationStore/Effects/computed.js
@ -55,15 +55,19 @@ const computedEffects = {
  },
  insKaskoPriceLeasePeriod() {
    const { leasingPeriod } = this.values;
-    const { values: tableValues } = this.tables.tableInsurance;
-    const kaskoRow = tableValues[1];
-    const dgo = tableValues[2];
-    const ns = tableValues[3];
+    const { rows } = this.tables.tableInsurance;
+    const kaskoRow = rows[1];
+    const dgoRow = rows[2];
+    const nsRow = rows[3];

-    if (leasingPeriod && leasingPeriod > 15 && kaskoRow.insTerm === 100000001) {
+    if (
+      leasingPeriod &&
+      leasingPeriod > 15 &&
+      kaskoRow.insTerm.value === 100000001
+    ) {
      return (
        (leasingPeriod / 12) *
-        (kaskoRow.insCost + dgo.insCost + ns.insCost)
+        (kaskoRow.insCost.value + dgoRow.insCost.value + nsRow.insCost.value)
      ).toFixed(2);
    }
    return 0;
--- a/src/client/stores/CalculationStore/Effects/reaction.ts
+++ b/src/client/stores/CalculationStore/Effects/reaction.ts
@ -2026,90 +2026,94 @@ const reactionEffects: IReactionEffect[] = [

  calculationStore => ({
    expression: () => {
-      const { values: tableValues } = calculationStore.tables.tableInsurance;
-      const kaskoRowIndex = tableValues.findIndex(
-        x => x.policyType === 'КАСКО',
+      const { rows: tableRows } = calculationStore.tables.tableInsurance;
+      const kaskoRowIndex = tableRows.findIndex(
+        x => x.policyType?.value === 'КАСКО',
      );
-      const kaskoRow = tableValues[kaskoRowIndex];
-      if (kaskoRow) {
-        return { ...kaskoRow };
-      }
+
+      const kaskoValues = calculationStore.getTableRowValues(
+        'tableInsurance',
+        kaskoRowIndex,
+        'value',
+      );
+
+      return {
+        ...kaskoValues,
+      };
    },
    effect: ({ insuranceCompany, insTerm, insured }) => {
      if (insTerm) {
-        const { values: tableValues } = calculationStore.tables.tableInsurance;
-        const dgoRowIndex = tableValues.findIndex(x => x.policyType === 'ДГО');
+        const { rows: tableRows } = calculationStore.tables.tableInsurance;
+        const dgoRowIndex = tableRows.findIndex(
+          x => x.policyType?.value === 'ДГО',
+        );
        if (dgoRowIndex && dgoRowIndex >= 0)
-          calculationStore.setTableRow(
+          calculationStore.setTableRows(
+            'tableInsurance',
+            dgoRowIndex,
+          )([
            {
-              tableName: 'tableInsurance',
-              rowIndex: dgoRowIndex,
-            },
-            {
-              values: { insuranceCompany, insTerm, insured },
-            },
-          );
-        const nsRowIndex = tableValues.findIndex(x => x.policyType === 'НС');
-        if (nsRowIndex && nsRowIndex >= 0)
-          calculationStore.setTableRow(
-            {
-              tableName: 'tableInsurance',
-              rowIndex: nsRowIndex,
-            },
-            {
-              values: {
-                insuranceCompany,
-                insTerm,
-                insured,
+              insuranceCompany: {
+                value: insuranceCompany,
+              },
+              insTerm: {
+                value: insTerm,
+              },
+              insured: {
+                value: insured,
              },
            },
-          );
+            {
+              insuranceCompany: {
+                value: insuranceCompany,
+              },
+              insTerm: {
+                value: insTerm,
+              },
+              insured: {
+                value: insured,
+              },
+            },
+          ]);
      }
    },
  }),

  calculationStore => ({
    expression: () => {
-      const { values: tableValues } = calculationStore.tables.tableInsurance;
-      const kaskoRowIndex = tableValues.findIndex(
-        x => x.policyType === 'КАСКО',
-      );
-      const kaskoRow = tableValues[kaskoRowIndex];
+      const { rows: tableRows } = calculationStore.tables.tableInsurance;
+      const kaskoRowIndex = tableRows.findIndex(x => x.policyType === 'КАСКО');
+      const kaskoRow = tableRows[kaskoRowIndex];
      const { leasingPeriod } = calculationStore.values;
      if (kaskoRow) {
-        return { insTerm: kaskoRow.insTerm, kaskoRowIndex, leasingPeriod };
+        return {
+          insTerm: kaskoRow.insTerm?.value,
+          kaskoRowIndex,
+          leasingPeriod,
+        };
      }
    },
    effect: ({ insTerm, kaskoRowIndex, leasingPeriod }) => {
      if (insTerm === 100000001 && leasingPeriod > 15 && kaskoRowIndex) {
        if (kaskoRowIndex >= 0)
-          calculationStore.setTableRow(
+          calculationStore.setTableRows(
+            'tableInsurance',
+            kaskoRowIndex,
+          )([
            {
-              tableName: 'tableInsurance',
-              rowIndex: kaskoRowIndex,
+              insured: { value: 100000001, status: Status.Disabled },
            },
-            {
-              values: {
-                insured: 100000001,
-              },
-              statuses: {
-                insured: Status.Disabled,
-              },
-            },
-          );
+          ]);
      } else {
        if (kaskoRowIndex >= 0)
-          calculationStore.setTableRow(
+          calculationStore.setTableRows(
+            'tableInsurance',
+            kaskoRowIndex,
+          )([
            {
-              tableName: 'tableInsurance',
-              rowIndex: kaskoRowIndex,
+              insured: { status: Status.Default },
            },
-            {
-              statuses: {
-                insured: Status.Default,
-              },
-            },
-          );
+          ]);
      }
    },
  }),
@ -2120,123 +2124,90 @@ const reactionEffects: IReactionEffect[] = [
      return leasingPeriod;
    },
    effect: leasingPeriod => {
-      const { values: tableValues } = calculationStore.tables.tableInsurance;
-      const kaskoRowIndex = tableValues.findIndex(
-        x => x.policyType === 'КАСКО',
+      const { rows: tableRows } = calculationStore.tables.tableInsurance;
+      const kaskoRowIndex = tableRows.findIndex(
+        x => x.policyType?.value === 'КАСКО',
      );
-      const osagoRowIndex = tableValues.findIndex(
-        x => x.policyType === 'ОСАГО',
+      const osagoRowIndex = tableRows.findIndex(
+        x => x.policyType?.value === 'ОСАГО',
      );

      if (leasingPeriod) {
        if (leasingPeriod < 12) {
          if (kaskoRowIndex >= 0)
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              kaskoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: kaskoRowIndex,
+                insured: { value: 100000000, status: Status.Disabled },
              },
-              {
-                values: {
-                  insured: 100000000,
-                },
-                statuses: {
-                  insured: Status.Disabled,
-                },
-              },
-            );
+            ]);
          if (osagoRowIndex >= 0) {
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              osagoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: osagoRowIndex,
+                insured: { value: 100000000, status: Status.Disabled },
              },
-              {
-                values: {
-                  insured: 100000000,
-                },
-                statuses: {
-                  insured: Status.Disabled,
-                },
-              },
-            );
+            ]);
          }
        } else {
          if (kaskoRowIndex >= 0)
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              kaskoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: kaskoRowIndex,
+                insured: { value: 100000000, status: Status.Default },
              },
-              {
-                statuses: {
-                  insured: Status.Default,
-                },
-              },
-            );
+            ]);
          if (osagoRowIndex >= 0) {
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              osagoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: osagoRowIndex,
+                insured: { status: Status.Default },
              },
-              {
-                statuses: {
-                  insured: Status.Default,
-                },
-              },
-            );
+            ]);
          }
        }
-        
+
        if (leasingPeriod < 13) {
          if (kaskoRowIndex >= 0)
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              kaskoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: kaskoRowIndex,
+                insTerm: { value: 100000000, status: Status.Disabled },
              },
-              {
-                values: {
-                  insTerm: 100000000,
-                },
-                statuses: {
-                  insTerm: Status.Disabled,
-                },
-              },
-            );
+            ]);
          return;
        } else if (leasingPeriod > 12 && leasingPeriod < 16) {
          if (kaskoRowIndex >= 0)
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              kaskoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: kaskoRowIndex,
+                insTerm: { value: 100000001, status: Status.Disabled },
              },
-              {
-                values: {
-                  insTerm: 100000001,
-                },
-                statuses: {
-                  insTerm: Status.Disabled,
-                },
-              },
-            );
+            ]);
          return;
        } else {
          if (kaskoRowIndex >= 0) {
-            calculationStore.setTableRow(
+            calculationStore.setTableRows(
+              'tableInsurance',
+              kaskoRowIndex,
+            )([
              {
-                tableName: 'tableInsurance',
-                rowIndex: kaskoRowIndex,
+                insured: { status: Status.Default },
+                insTerm: { status: Status.Default },
              },
-              {
-                statuses: {
-                  insured: Status.Default,
-                  insTerm: Status.Default,
-                },
-              },
-            );
+            ]);
          }
        }
      }
--- a/src/client/stores/CalculationStore/index.ts
+++ b/src/client/stores/CalculationStore/index.ts
@ -3,7 +3,7 @@ import {
  modalData,
 } from 'client/stores/CalculationStore/Data/modal';
 import actionsEffects from 'client/stores/CalculationStore/Effects/action';
-import assignProperties from 'client/tools/assignProps';
+// import assignProperties from 'client/tools/assignProps';
 import { ICalculationStore } from 'core/types/stores';
 import { autorun, makeAutoObservable, reaction, when } from 'mobx';
 import CommonStore from '../CommonStore';
@ -20,8 +20,10 @@ import reactionEffects from './Effects/reaction';
 import whenEffects from './Effects/when';

 const CalculationStore: ICalculationStore = makeAutoObservable(
-  assignProperties(
+  Object.assign(
    {},
+    // assignProperties(
+    //   {},
    staticData,
    staticDataAction,
    valuesData,
--- a/src/core/config/initialTables.ts
+++ b/src/core/config/initialTables.ts
@ -1,162 +0,0 @@
-import { openNotification } from 'client/Elements/Notification';
-import { Status } from 'core/types/statuses';
-import { IStoreTable } from './../types/tables';
-const initialTables: IStoreTable = {
-  tableInsurance: {
-    values: [
-      {
-        policyType: 'ОСАГО',
-        insuranceCompany: null,
-        insured: null,
-        insCost: 0,
-        insTerm: 100000000,
-      },
-      {
-        policyType: 'КАСКО',
-        insuranceCompany: null,
-        insured: null,
-        insCost: 0,
-        insTerm: null,
-      },
-      {
-        policyType: 'ДГО',
-        insuranceCompany: null,
-        insured: null,
-        insCost: 0,
-        insTerm: null,
-      },
-      {
-        policyType: 'НС',
-        insuranceCompany: null,
-        insured: null,
-        insCost: 0,
-        insTerm: null,
-      },
-    ],
-    statuses: [
-      {
-        insTerm: Status.Disabled,
-      },
-      {
-        insTerm: Status.Disabled,
-      },
-      {
-        insured: Status.Disabled,
-        insuranceCompany: Status.Disabled,
-        insTerm: Status.Disabled,
-      },
-      {
-        insured: Status.Disabled,
-        insuranceCompany: Status.Disabled,
-        insTerm: Status.Disabled,
-      },
-    ],
-    options: {
-      insured: [
-        {
-          name: 'Лизингополучатель',
-          value: 100000000,
-        },
-        {
-          name: 'Лизингодатель',
-          value: 100000001,
-        },
-      ],
-      insTerm: [
-        {
-          name: '12 месяцев',
-          value: 100000000,
-        },
-        {
-          name: 'Срок ДЛ',
-          value: 100000001,
-        },
-      ],
-    },
-    filters: [],
-    callbacks: {
-      insCost: (calculationStore, tableName, rowIndex, propName) => {
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex][
-            'insuranceCompany'
-          ]
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указана страховая компания по полису',
-          })();
-        }
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex]['insTerm']
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указан срок страхования',
-          })();
-        }
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex]['insured']
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указан плательщик',
-          })();
-        }
-      },
-
-      insured: (calculationStore, tableName, rowIndex, propName) => {
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex]['insured']
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указан плательщик',
-          })();
-        }
-      },
-
-      insTerm: (calculationStore, tableName, rowIndex, propName) => {
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex]['insTerm']
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указан срок страхования',
-          })();
-        }
-      },
-      insuranceCompany: (calculationStore, tableName, rowIndex, propName) => {
-        if (
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] &&
-          calculationStore.tables[tableName].values[rowIndex]['insCost'] > 0 &&
-          !calculationStore.tables[tableName].values[rowIndex][
-            'insuranceCompany'
-          ]
-        ) {
-          openNotification({
-            type: 'error',
-            title: 'Ошибка',
-            description: 'Не указана страховая компания по полису',
-          })();
-        }
-      },
-    },
-  },
-};
-
-export default initialTables;
--- a/src/core/config/initialTables/index.ts
+++ b/src/core/config/initialTables/index.ts
@ -0,0 +1,7 @@
+import tableInsurance from './tableInsurance';
+import tablePayments from './tablePayments';
+
+export default {
+  tableInsurance,
+  tablePayments,
+};
--- a/src/core/config/initialTables/tableInsurance.ts
+++ b/src/core/config/initialTables/tableInsurance.ts
@ -0,0 +1,194 @@
+import { openNotification } from 'client/Elements/Notification';
+import { Status } from 'core/types/statuses';
+import { ITable } from 'core/types/tables';
+
+const tableInsurance: ITable = {
+  rows: [
+    {
+      policyType: {
+        value: 'ОСАГО',
+      },
+      insuranceCompany: {
+        value: null,
+      },
+      insured: {
+        value: null,
+      },
+      insCost: {
+        value: 0,
+      },
+      insTerm: {
+        value: null,
+        status: Status.Disabled,
+      },
+    },
+    {
+      policyType: {
+        value: 'КАСКО',
+      },
+      insuranceCompany: {
+        value: null,
+      },
+      insured: {
+        value: null,
+      },
+      insCost: {
+        value: 0,
+      },
+      insTerm: {
+        value: null,
+        status: Status.Disabled,
+      },
+    },
+    {
+      policyType: {
+        value: 'ДГО',
+      },
+      insuranceCompany: {
+        value: null,
+        status: Status.Disabled,
+      },
+      insured: {
+        value: null,
+        status: Status.Disabled,
+      },
+      insCost: {
+        value: 0,
+      },
+      insTerm: {
+        value: null,
+        status: Status.Disabled,
+      },
+    },
+    {
+      policyType: {
+        value: 'НС',
+      },
+      insuranceCompany: {
+        value: null,
+        status: Status.Disabled,
+      },
+      insured: {
+        value: null,
+        status: Status.Disabled,
+      },
+      insCost: {
+        value: 0,
+      },
+      insTerm: {
+        value: null,
+        status: Status.Disabled,
+      },
+    },
+  ],
+  options: {
+    insured: [
+      {
+        name: 'Лизингополучатель',
+        value: 100000000,
+      },
+      {
+        name: 'Лизингодатель',
+        value: 100000001,
+      },
+    ],
+    insTerm: [
+      {
+        name: '12 месяцев',
+        value: 100000000,
+      },
+      {
+        name: 'Срок ДЛ',
+        value: 100000001,
+      },
+    ],
+  },
+  callbacks: {
+    insCost: (calculationStore, tableName, rowIndex) => {
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insuranceCompany']
+          ?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указана страховая компания по полису',
+        })();
+      }
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insTerm']?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указан срок страхования',
+        })();
+      }
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insured']?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указан плательщик',
+        })();
+      }
+    },
+
+    insured: (calculationStore, tableName, rowIndex) => {
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insured']?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указан плательщик',
+        })();
+      }
+    },
+
+    insTerm: (calculationStore, tableName, rowIndex) => {
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insTerm']?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указан срок страхования',
+        })();
+      }
+    },
+    insuranceCompany: (calculationStore, tableName, rowIndex) => {
+      if (
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value &&
+        calculationStore.tables[tableName]?.rows[rowIndex]['insCost']?.value >
+          0 &&
+        !calculationStore.tables[tableName]?.rows[rowIndex]['insuranceCompany']
+          ?.value
+      ) {
+        openNotification({
+          type: 'error',
+          title: 'Ошибка',
+          description: 'Не указана страховая компания по полису',
+        })();
+      }
+    },
+  },
+};
+
+export default tableInsurance;
--- a/src/core/config/initialTables/tablePayments.ts
+++ b/src/core/config/initialTables/tablePayments.ts
@ -0,0 +1,7 @@
+import { ITable } from 'core/types/tables';
+
+const tablePayments: ITable = {
+  rows: [],
+};
+
+export default tablePayments;
--- a/src/core/types/Calculation/components.ts
+++ b/src/core/types/Calculation/components.ts
@ -1,3 +1,4 @@
+import { TableNames, TableValuesNames } from './../tables';
 import { ActionsNames } from 'core/types/effect';
 import { ElementsNames, ElementType } from 'core/types/elements';
 import { ComputedValuesNames, ValuesNames } from 'core/types/values';
@ -7,17 +8,37 @@ interface IElement {
  title?: string;
  Component: () => JSX.Element;
  props: {
-    name: ElementsNames;
+    name: ElementsNames | TableNames;
    valueName?: ValuesNames;
-    computedValue?: ComputedValuesNames;
+    computedValueName?: ComputedValuesNames;
    actionName?: ActionsNames;
    [key: string]: any;
  };
 }

+interface ITable {
+  type?: ElementType.Table;
+  title?: string;
+  Component: () => JSX.Element;
+  props: {
+    name: TableNames;
+    features?: {
+      canDeleteRow: boolean;
+      numerize: {
+        columnTitle?: string;
+      };
+    };
+    columns: {
+      name: TableValuesNames;
+      title: string;
+      Component: () => JSX.Element;
+    }[];
+  };
+}
+
 interface IBlock {
  title?: string;
-  elements: IElement[];
+  elements: IElement[] | ITable[];
  [key: string]: any;
 }

--- a/src/core/types/elements.ts
+++ b/src/core/types/elements.ts
@ -132,7 +132,6 @@ export type ElementsNames =
  | 'tbxLeadNumber'
  | 'tbxOpportunityNumber'
  | 'radioInsuranceOPF'
-  | 'tableInsurance'
  | 'lblLead'
  | 'lblOpportunity'
  | 'btnCalculate';
--- a/src/core/types/stores.ts
+++ b/src/core/types/stores.ts
@ -1,19 +1,19 @@
 import { TElementFilter } from 'core/types/Calculation/filters';
-import { IBaseOption, IOption } from 'core/types/Calculation/options';
+import { IOption } from 'core/types/Calculation/options';
+import {
+  ITableCell,
+  TableNames,
+  TableProps,
+  TCellCallback,
+} from 'core/types/tables';
 import { ElementsNames, TElements } from './elements';
 import { EntityNames } from './Entities/entityNames';
 import { StaticDataNames, TStaticData } from './staticData';
 import { Status } from './statuses';
-import {
-  IStoreTable,
-  TableNames,
-  TableValuesNames,
-  TCellCallback,
-  TTableValues,
-} from './tables';
+import { StoreTables } from './tables';
 import { TValue, TValues, ValuesNames } from './values';

-export interface ICalculationStore {
+interface ICalculationValues {
  staticData: TStaticData;
  getStaticData: (dataName: StaticDataNames | EntityNames) => IOption[];
  setStaticData: (data: TStaticData) => void;
@ -46,54 +46,37 @@ export interface ICalculationStore {
    validation: boolean | undefined,
  ) => void;

-  tables: IStoreTable;
-  addTableRow: (
-    { tableName, rowIndex }: { tableName: TableNames; rowIndex?: number },
-    {
-      values,
-      statuses,
-    }: {
-      values?: TTableValues<any>;
-      statuses?: TTableValues<Status>;
-      filters?: TTableValues<TElementFilter>[];
-    },
-  ) => void;
-  setTableRow: (
-    { tableName, rowIndex }: { tableName: TableNames; rowIndex: number },
-    {
-      values,
-      statuses,
-    }: {
-      values?: TTableValues<any>;
-      statuses?: TTableValues<Status>;
-      filters?: TTableValues<TElementFilter>[];
-    },
-  ) => void;
-  setTableColumn: (
-    { tableName }: { tableName: TableNames },
-    {
-      options,
-      filters,
-      callbacks,
-    }: {
-      options?: TTableValues<IOption[]>;
-      filters?: TTableValues<TElementFilter>;
-      callbacks?: TTableValues<TCellCallback>;
-    },
-  ) => void;
-  setRowOptions: (
-    { tableName }: { tableName: TableNames },
-    options: { [prop in TableValuesNames]?: IBaseOption[] },
-  ) => void;
-  setTable: (
-    { tableName }: { tableName: TableNames },
-    values: { [prop in TableValuesNames]?: TValue }[],
-  ) => void;
-
-  deleteTableRow: (tableName: TableNames, rowIndex: number) => void;
-  cleanTable: (tableName: TableNames) => void;
-
  modal: { isModalVisible: boolean; modalText: string };
  showModal: (text: string) => void;
  closeModal: () => void;
 }
+
+interface ICalculationTables {
+  tables: StoreTables;
+
+  cleanTable: (tableName: TableNames) => void;
+  getTableRowValues: (
+    tableName: TableNames,
+    rowIndex: number,
+    paramName: string,
+  ) => { values: TableProps<any> };
+
+  setTableRows: (
+    tableName: TableNames,
+    startIndex: number,
+    override?: boolean,
+  ) => (rows: TableProps<ITableCell>[]) => void;
+
+  setTableColumns: (
+    tableName: TableNames,
+    override?: boolean,
+  ) => ({
+    options,
+    callbacks,
+  }: {
+    options?: TableProps<IOption[]>;
+    callbacks?: TableProps<TCellCallback>;
+  }) => void;
+}
+
+export type ICalculationStore = ICalculationValues & ICalculationTables;
--- a/src/core/types/tables.ts
+++ b/src/core/types/tables.ts
@ -2,17 +2,16 @@ import { ICalculationStore } from 'core/types/stores';
 import { TElementFilter } from 'core/types/Calculation/filters';
 import { IOption } from 'core/types/Calculation/options';
 import { Status } from './statuses';
-export type TableNames = 'tableInsurance';
+
+export type TableNames = 'tableInsurance' | 'tablePayments';
 export type TableValuesNames =
  | 'policyType'
  | 'insuranceCompany'
  | 'insured'
  | 'insCost'
-  | 'insTerm';
-
-export type TTableValues<T> = {
-  [propName in TableValuesNames]?: T;
-};
+  | 'insTerm'
+  | 'paymentNumber'
+  | 'paymentRelation';

 export type TCellCallback = (
  calculationStore: ICalculationStore,
@ -21,12 +20,23 @@ export type TCellCallback = (
  propName: TableValuesNames,
 ) => void;

-export type IStoreTable = {
-  [tableName in TableNames]: {
-    values: TTableValues<any>[];
-    statuses: TTableValues<Status>[];
-    options?: TTableValues<IOption[]>;
-    filters?: TTableValues<TElementFilter>[];
-    callbacks?: TTableValues<TCellCallback>;
-  };
+export interface ITableCell {
+  value?: any;
+  status?: Status;
+  validations?: boolean;
+  filter?: TElementFilter;
+}
+
+export type TableProps<T> = {
+  [propName in TableValuesNames]?: T;
+};
+
+export interface ITable {
+  rows: TableProps<ITableCell>[];
+  options?: TableProps<IOption[]>;
+  callbacks?: TableProps<TCellCallback>;
+}
+
+export type StoreTables = {
+  [table in TableNames]: ITable;
 };