@redneckz/wildless-cms-uni-blocks 0.3.84 → 0.3.85

package/src/components/Calculator/CalculatorContent.ts

@@ -5,6 +5,8 @@ import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
 export interface CommonCalculatorProps {
   /** @title Кнопки */
   buttons?: ButtonWithIconProps[];
+  /** @title Адрес справочника */
+  sourceBookDir?: string;
 }
 
 /**
@@ -12,7 +14,9 @@ export interface CommonCalculatorProps {
  **/
 export interface CreditCalculatorParams {
   /** @hidden */
-  isSalary?: boolean;
+  isSalaryClient?: boolean;
+  /** @hidden */
+  isStateEmployee?: boolean;
   /** @hidden */
   isInsurance?: boolean;
   /** @hidden */
@@ -77,13 +81,19 @@ export interface BonusCalculatorParams {
   /** @hidden */
   bonus?: number;
   /** @hidden */
-  minSumTrip?: number;
+  minSumTravel?: number;
   /** @hidden */
-  maxSumTrip?: number;
+  maxSumTravel?: number;
   /** @hidden */
   minSumOther?: number;
   /** @hidden */
   maxSumOther?: number;
+  maxBonus?: number;
+  prefMonthsNum?: number;
+  prefTravelBonusRate?: number;
+  prefRestBonusRate?: number;
+  travelBonusRate?: number;
+  restBonusRate?: number;
 }
 
 /**
@@ -171,5 +181,5 @@ export interface CalculatorTab {
  */
 export interface CalculatorContent {
   /** @title Вкладки */
-  calcTabs?: CalculatorTab[];
+  calculatorTabs?: CalculatorTab[];
 }

package/src/components/Calculator/CreditCalculatorForm.tsx

@@ -1,78 +1,70 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCreditCalculatorData } from '../../hooks/useCreditCalculatorData';
 import type { UniBlockProps } from '../../types';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { CommonCalculatorProps } from './CalculatorContent';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
-import { DEFAULT_MAX_MONTHS, DEFAULT_MIN_MONTHS } from './constants';
-import { renderWantedSumInput } from './renderWantedSumInput';
-import { getCreditRate } from './getCreditRate';
-import { getCalculatorParams } from './getCalculatorParams';
-import { getDefaultSum } from './getDefaultSum';
-import { getDefaultMonths } from './getDefaultMonths';
-import { getMonthlyPayment } from './getMonthlyPayment';
-import { renderMonthsInput } from './renderMonthsInput';
+import { DEFAULT_MONTHS, DEFAULT_SUM } from './constants';
+import { Rate } from './Rate';
 import { renderButtonSection } from './renderButtonSection';
-import { renderRate } from './renderRate';
-import { CommonCalculatorProps, CreditCalculatorParams } from './CalculatorContent';
+import { renderMonthsInput } from './renderMonthsInput';
+import { renderPaymentTypeSelector } from './renderPaymentTypeSelector';
+import { renderWantedSumInput } from './renderWantedSumInput';
+import { getCreditCalculatorParams } from './useCreditCalculatorParams';
 
-const DEFAULT_PAYMENT_TYPE = 'annuity';
+export const ANNUITY = 'annuity';
+export const DIFFERENTIAL = 'differential';
 
-export interface CreditCalculatorProp
-  extends CreditCalculatorParams,
-    CommonCalculatorProps,
-    UniBlockProps {}
+const paymentTypeItems = [
+  {
+    id: ANNUITY,
+    text: 'Аннуитетный',
+  },
+  {
+    id: DIFFERENTIAL,
+    text: 'Дифференцированный',
+  },
+];
+
+export interface CreditCalculatorProp extends CommonCalculatorProps, UniBlockProps {}
 
 export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
-  ({ context, className = '', buttons }) => {
-    const [moneyValue, setMoneyValue] = context.useState<number | undefined>(undefined);
-    const [monthsValue, setMonthsValue] = context.useState<number | undefined>(undefined);
+  ({ context, className = '', sourceBookDir, buttons }) => {
     const [isAnnuity, toggleIsAnnuity] = context.useState(false);
-    const [isBudgetary, toggleIsBudgetary] = context.useState(false);
-    const [isInsurance, toggleIsInsurance] = context.useState(false);
-    const tableRows = useCreditCalculatorData(context.useAsyncData, 'directoryName').rows;
-    const calculatorParams = getCalculatorParams({ tableRows, isAnnuity: isAnnuity });
-
-    const defaultSum = getDefaultSum(calculatorParams);
-    const defaultMonths = getDefaultMonths(calculatorParams);
-
-    const minMonths = calculatorParams?.minMonths || DEFAULT_MIN_MONTHS;
-    const maxMonths = calculatorParams?.maxMonths || DEFAULT_MAX_MONTHS;
-
-    const rate = getCreditRate({ calculatorParams, isInsurance: isInsurance });
-
-    const monthlyPayment = getMonthlyPayment({
-      calculatorParams,
-      paymentType: DEFAULT_PAYMENT_TYPE,
-      rate,
-      sum: moneyValue || defaultSum,
-      months: monthsValue || defaultMonths,
-    });
-
-    const title = 'Сумма кредита, ₽';
+    const [isInsurance, toggleIsInsurance] = context.useState(true);
+    const [isSalaryClient, toggleIsSalaryClient] = context.useState(false);
+    const [isStateEmployee, toggleIsStateEmployee] = context.useState(false);
+    const [moneyValue, setMoneyValue] = context.useState(DEFAULT_SUM);
+    const [monthsValue, setMonthsValue] = context.useState(DEFAULT_MONTHS);
+    const userInputParams = {
+      isAnnuity,
+      isInsurance,
+      isSalaryClient,
+      isStateEmployee,
+      moneyValue,
+      monthsValue,
+    };
+    const calculatorParams = getCreditCalculatorParams(context, userInputParams, sourceBookDir);
 
     return (
       <section className={className}>
         <div className="w-[468px]">
-          {renderWantedSumInput({ title, calculatorParams, moneyValue, defaultSum, setMoneyValue })}
-          {renderMonthsInput({
-            title: 'Сумма кредита, ₽',
-            minMonths,
-            maxMonths,
-            monthsValue,
-            defaultMonths,
-            setMonthsValue,
-          })}
+          {renderWantedSumInput(
+            'Сумма кредита, ₽',
+            { ...calculatorParams, step: 500 },
+            setMoneyValue,
+          )}
+          {renderMonthsInput('Срок кредита, месяцев', calculatorParams, setMonthsValue)}
           <div className="pt-7">
             <Checkbox
               text="Получаю зарплату на счёт в Россельхозбанке"
-              checked={isAnnuity}
-              onChange={toggleIsAnnuity}
+              checked={isSalaryClient}
+              onChange={toggleIsSalaryClient}
             />
             <Checkbox
               className="mt-3"
               text="Работаю в бюджетной организации"
-              checked={isBudgetary}
-              onChange={toggleIsBudgetary}
+              checked={isStateEmployee}
+              onChange={toggleIsStateEmployee}
             />
             <Checkbox
               className="mt-3"
@@ -82,15 +74,23 @@ export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
             />
           </div>
         </div>
-        <div>
-          {rate
-            ? renderRate({ rate: rate, title: 'Ставка', sup: '%', className: 'tracking-[-25px]' })
-            : null}
-        </div>
+        <Rate
+          title="Ставка"
+          rate={calculatorParams.finalRate}
+          rateBlockClassName="tracking-[-25px]"
+          unit="%"
+        />
         <div className="w-[351px]">
-          {monthlyPayment ? (
-            <CalculatorValueBlock title="Ежемесячный платеж" value={monthlyPayment} postfix="₽" />
-          ) : null}
+          <CalculatorValueBlock
+            title={isAnnuity ? 'Ежемесячный платеж' : 'Платёж в первый месяц'}
+            value={calculatorParams.monthlyPayment}
+            postfix="₽"
+          />
+          {renderPaymentTypeSelector(context, {
+            items: paymentTypeItems,
+            checkedItem: isAnnuity ? ANNUITY : DIFFERENTIAL,
+            onChange: (text: string) => toggleIsAnnuity(text === ANNUITY),
+          })}
           {renderButtonSection(context, buttons)}
         </div>
       </section>

package/src/components/Calculator/DepositCalculatorForm.tsx

@@ -1,16 +1,21 @@
+// TEMP
+
 import { JSX } from '@redneckz/uni-jsx';
-import { useCreditCalculatorData } from '../../hooks/useCreditCalculatorData';
 import type { UniBlockProps } from '../../types';
+import { CommonCalculatorProps, DepositCalculatorParams } from './CalculatorContent';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
-import { DEFAULT_MAX_MONTHS, DEFAULT_MIN_MONTHS } from './constants';
-import { renderWantedSumInput } from './renderWantedSumInput';
-import { getCalculatorParams } from './getCalculatorParams';
-import { getDefaultSum } from './getDefaultSum';
-import { getDefaultMonths } from './getDefaultMonths';
-import { renderMonthsInput } from './renderMonthsInput';
+import {
+  DEFAULT_MAX_MONTHS,
+  DEFAULT_MAX_SUM,
+  DEFAULT_MIN_MONTHS,
+  DEFAULT_MIN_SUM,
+  DEFAULT_MONTHS,
+  DEFAULT_SUM,
+} from './constants';
+import { Rate } from './Rate';
 import { renderButtonSection } from './renderButtonSection';
-import { renderRate } from './renderRate';
-import { CommonCalculatorProps, DepositCalculatorParams } from './CalculatorContent';
+import { renderMonthsInput } from './renderMonthsInput';
+import { renderWantedSumInput } from './renderWantedSumInput';
 
 export interface DepositCalculatorProp
   extends DepositCalculatorParams,
@@ -18,14 +23,9 @@ export interface DepositCalculatorProp
     UniBlockProps {}
 
 export const DepositCalculatorForm = JSX<DepositCalculatorProp>(
-  ({ context, className = '', buttons, rate, minSum, maxSum, minMonths, maxMonths }) => {
-    const [moneyValue, setMoneyValue] = context.useState<number | undefined>(undefined);
-    const [monthsValue, setMonthsValue] = context.useState<number | undefined>(undefined);
-    const tableRows = useCreditCalculatorData(context.useAsyncData, 'directoryName').rows;
-    const calculatorParams = getCalculatorParams({ tableRows, isAnnuity: false });
-
-    const defaultSum = getDefaultSum(calculatorParams);
-    const defaultMonths = getDefaultMonths(calculatorParams);
+  ({ context, className = '', buttons, rate }) => {
+    const [moneyValue, setMoneyValue] = context.useState<number>(DEFAULT_SUM);
+    const [monthsValue, setMonthsValue] = context.useState<number>(DEFAULT_MONTHS);
 
     const income = 948841;
     const finallySum = 1218841;
@@ -33,27 +33,26 @@ export const DepositCalculatorForm = JSX<DepositCalculatorProp>(
     return (
       <section className={className}>
         <div className="w-[468px]">
-          {renderWantedSumInput({
-            title: 'Сумма вклада, ₽',
-            calculatorParams: { minSum, maxSum },
-            moneyValue,
-            defaultSum,
+          {renderWantedSumInput(
+            'Сумма вклада, ₽',
+            {
+              moneyValue,
+              minSum: DEFAULT_MIN_SUM,
+              maxSum: DEFAULT_MAX_SUM,
+            },
             setMoneyValue,
-          })}
-          {renderMonthsInput({
-            title: 'Срок вклада, месяцев',
-            minMonths: minMonths || DEFAULT_MIN_MONTHS,
-            maxMonths: maxMonths || DEFAULT_MAX_MONTHS,
-            monthsValue,
-            defaultMonths,
+          )}
+          {renderMonthsInput(
+            'Срок вклада, месяцев',
+            {
+              minMonths: DEFAULT_MIN_MONTHS,
+              maxMonths: DEFAULT_MAX_MONTHS,
+              monthsValue,
+            },
             setMonthsValue,
-          })}
-        </div>
-        <div>
-          {rate
-            ? renderRate({ rate: rate, title: 'Ставка', sup: '%', className: 'tracking-[-25px]' })
-            : null}
+          )}
         </div>
+        <Rate rate={rate || 1} rateBlockClassName="tracking-[-25px]" unit="%" />
         <div className="w-[351px]">
           {income ? (
             <CalculatorValueBlock title="Доход по вкладу" value={income} postfix="₽" prefix="+" />

package/src/components/Calculator/EmbeddableCalcBlocks.tsx

@@ -1,13 +1,13 @@
+import { BonusCalculatorForm, BonusCalculatorProps } from './BonusCalculatorForm';
 import { CreditCalculatorForm, CreditCalculatorProp } from './CreditCalculatorForm';
-import { MortgageCalculatorForm, MortgageCalculatorProp } from './MortgageCalculatorForm';
 import { DepositCalculatorForm, DepositCalculatorProp } from './DepositCalculatorForm';
-import { BonusCalculatorForm, BonusCalculatorProp } from './BonusCalculatorForm';
+import { MortgageCalculatorForm, MortgageCalculatorProp } from './MortgageCalculatorForm';
 
 export type EmbeddableCalcProps =
   | CreditCalculatorProp
   | MortgageCalculatorProp
   | DepositCalculatorProp
-  | BonusCalculatorProp;
+  | BonusCalculatorProps;
 
 export const EmbeddableCalcBlocks = {
   CreditCalculatorForm,

package/src/components/Calculator/MortgageCalculatorForm.tsx

@@ -1,20 +1,17 @@
+// TEMP
 import { JSX } from '@redneckz/uni-jsx';
-import { useCreditCalculatorData } from '../../hooks/useCreditCalculatorData';
 import type { UniBlockProps } from '../../types';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { CommonCalculatorProps, MortgageCalculatorParams } from './CalculatorContent';
+import { CalculatorValueBlock } from './CalculatorValueBlock';
 import { DEFAULT_MAX_MONTHS, DEFAULT_MIN_MONTHS } from './constants';
-import { renderRealEstateValue } from './renderRealEstateValue';
-import { renderInitialFeeInput } from './renderInitialFeeInput';
 import { getCreditRate } from './getCreditRate';
-import { getCalculatorParams } from './getCalculatorParams';
-import { getDefaultSum } from './getDefaultSum';
-import { getDefaultMonths } from './getDefaultMonths';
-import { renderMonthsInput } from './renderMonthsInput';
+import { Rate } from './Rate';
 import { renderButtonSection } from './renderButtonSection';
+import { renderInitialFeeInput } from './renderInitialFeeInput';
+import { renderMonthsInput } from './renderMonthsInput';
 import { renderProposalMortgage } from './renderProposalMortgage';
-import { renderRate } from './renderRate';
-import { CommonCalculatorProps, MortgageCalculatorParams } from './CalculatorContent';
-import { CalculatorValueBlock } from './CalculatorValueBlock';
+import { renderRealEstateValue } from './renderRealEstateValue';
 
 export interface MortgageCalculatorProp
   extends MortgageCalculatorParams,
@@ -23,19 +20,15 @@ export interface MortgageCalculatorProp
 
 export const MortgageCalculatorForm = JSX<MortgageCalculatorProp>(
   ({ context, className = '', buttons }) => {
-    const [moneyValue, setMoneyValue] = context.useState<number | undefined>(undefined);
-    const [monthsValue, setMonthsValue] = context.useState<number | undefined>(undefined);
+    const [moneyValue, setMoneyValue] = context.useState<number>(1000000);
+    const [monthsValue, setMonthsValue] = context.useState<number>(12);
     const [isInsurance, toggleIsInsurance] = context.useState(false);
     const [isFullInsurance, toggleIsFullInsurance] = context.useState(false);
 
-    const tableRows = useCreditCalculatorData(context.useAsyncData, 'directoryName').rows;
-    const calculatorParams = getCalculatorParams({ tableRows, isAnnuity: isInsurance });
+    const calculatorParams = {}; // getCalculatorParams(context, { isAnnuity: isInsurance });
 
-    const defaultSum = getDefaultSum(calculatorParams);
-    const defaultMonths = getDefaultMonths(calculatorParams);
-
-    const minMonths = calculatorParams?.minMonths || DEFAULT_MIN_MONTHS;
-    const maxMonths = calculatorParams?.maxMonths || DEFAULT_MAX_MONTHS;
+    const minMonths = /*calculatorParams?.minMonths ||*/ DEFAULT_MIN_MONTHS;
+    const maxMonths = /* calculatorParams?.maxMonths || */ DEFAULT_MAX_MONTHS;
 
     const rate = getCreditRate({ calculatorParams, isInsurance: isInsurance });
 
@@ -45,21 +38,23 @@ export const MortgageCalculatorForm = JSX<MortgageCalculatorProp>(
     return (
       <section className={className}>
         <div className="w-[468px]">
-          {renderRealEstateValue({ calculatorParams, moneyValue, defaultSum, setMoneyValue })}
-          {renderInitialFeeInput({
-            calculatorParams,
-            moneyValue,
-            defaultSum,
+          {renderRealEstateValue('Стоимость недвижимости, ₽', { moneyValue }, setMoneyValue)}
+          {renderInitialFeeInput(
+            'Первоначальный взнос, ₽',
+            {
+              moneyValue,
+            },
             setMoneyValue,
-          })}
-          {renderMonthsInput({
-            title: 'Срок ипотеки, месяцев',
-            minMonths,
-            maxMonths,
-            monthsValue,
-            defaultMonths,
+          )}
+          {renderMonthsInput(
+            'Срок ипотеки, месяцев',
+            {
+              minMonths,
+              maxMonths,
+              monthsValue,
+            },
             setMonthsValue,
-          })}
+          )}
           <div className="mt-7">
             <Checkbox text="Страхование жизни" checked={isInsurance} onChange={toggleIsInsurance} />
             <Checkbox
@@ -71,11 +66,8 @@ export const MortgageCalculatorForm = JSX<MortgageCalculatorProp>(
           </div>
         </div>
         <div>
-          <div>
-            {rate
-              ? renderRate({ rate: rate, title: 'Ставка', sup: '%', className: 'tracking-[-25px]' })
-              : null}
-          </div>
+          <Rate rate={rate} rateBlockClassName="tracking-[-25px]" unit="%" />
+
           <CalculatorValueBlock title="Ежемесячный платеж" value={monthlyPayment} postfix="₽" />
         </div>
         <div>

package/src/components/Calculator/Rate.tsx

@@ -0,0 +1,22 @@
+import { JSX } from '@redneckz/uni-jsx';
+
+export interface RateProps {
+  rate: number;
+  title?: string;
+  unit?: string;
+  rateBlockClassName?: string;
+}
+
+export const Rate = JSX<RateProps>(({ rate, title = 'Ставка', unit, rateBlockClassName }) => (
+  <div>
+    <div className="text-sm font-light ml-3">{title}</div>
+    <div className="flex justify-start">
+      <span
+        className={`block calc-rate-text font-mohave text-highlighted pr-6 -mt-4 ${rateBlockClassName}`}
+      >
+        {String(rate).replace('.', ',')}
+      </span>
+      {unit ? <span className="calc-rate-text text-[65px] leading-[75px]">{unit}</span> : ''}
+    </div>
+  </div>
+));

package/src/components/Calculator/constants.ts

@@ -1,8 +1,45 @@
-export const DEFAULT_MIN_SUM = 30000;
-export const DEFAULT_MAX_SUM = 3000000;
+import { BonusCalculatorSourceBookParams } from './useBonusCalculatorParams';
+import { CreditCalculatorSourceBookParams } from './useCreditCalculatorParams';
+
+export const DEFAULT_MIN_SUM = 60000;
+export const DEFAULT_MAX_SUM = 2000000;
 export const DEFAULT_SUM = (DEFAULT_MAX_SUM - DEFAULT_MIN_SUM) / 2;
-export const DEFAULT_MIN_MONTHS = 1;
-export const DEFAULT_MAX_MONTHS = 84;
+export const DEFAULT_MIN_MONTHS = 13;
+export const DEFAULT_MAX_MONTHS = 60;
 export const DEFAULT_MONTHS = Math.round((DEFAULT_MAX_MONTHS - DEFAULT_MIN_MONTHS) / 2);
 
 export const MONTHS_IN_YEAR = 12;
+
+export const MONTHLY_INTEREST_RATE = MONTHS_IN_YEAR * 100;
+
+export const DEFAULT_CREDIT_CALCULATOR_PARAMS: CreditCalculatorSourceBookParams = {
+  minSum: DEFAULT_MIN_SUM,
+  maxSum: DEFAULT_MAX_SUM,
+  minMonths: DEFAULT_MIN_MONTHS,
+  maxMonths: DEFAULT_MAX_MONTHS,
+  rateBottomRange: 10,
+  rateTopRange: 7,
+  isSalaryClient: true,
+  isStateEmployee: true,
+  isInsurance: true,
+  sumBorder: 999999,
+};
+
+export const DEFAULT_TRAVEL_MIN_SUM = 6000;
+export const DEFAULT_REST_MIN_SUM = 6000;
+
+export const DEFAULT_BONUS_CALCULATOR_PARAMS: BonusCalculatorSourceBookParams = {
+  minSumTravel: 6000,
+  maxSumTravel: 200000,
+  minSumOther: 6000,
+  maxSumOther: 200000,
+  maxBonus: 5000,
+  prefMonthsNum: 2,
+  prefTravelBonusRate: 0.015,
+  prefRestBonusRate: 0.01,
+  travelBonusRate: 0.015,
+  restBonusRate: 0.01,
+};
+
+export const CREDIT_CALC_DEFAULT_DIR = 'credit-calculator-data';
+export const BONUS_CALC_DEFAULT_DIR = 'bonus-calculator-data';

package/src/components/Calculator/getBonus.ts

@@ -0,0 +1,38 @@
+import { MONTHS_IN_YEAR } from './constants';
+import type { BonusCalculatorSourceBookParams } from './useBonusCalculatorParams';
+
+export const getBonus = (
+  params: BonusCalculatorSourceBookParams,
+  bonusTravelValue: number,
+  bonusOtherValue: number,
+) => {
+  const {
+    minSumTravel,
+    minSumOther,
+    maxBonus,
+    prefMonthsNum,
+    prefTravelBonusRate,
+    prefRestBonusRate,
+    travelBonusRate,
+    restBonusRate,
+  } = params;
+
+  if (bonusTravelValue === minSumTravel && bonusOtherValue === minSumOther) {
+    return [0, 0];
+  }
+
+  const prefBonus = Math.min(
+    Math.round(prefTravelBonusRate * bonusTravelValue) +
+      Math.round(prefRestBonusRate * bonusOtherValue),
+    maxBonus,
+  );
+
+  const bonus = Math.min(
+    Math.round(travelBonusRate * bonusTravelValue) + Math.round(restBonusRate * bonusOtherValue),
+    maxBonus,
+  );
+
+  const yearBonus = prefBonus * prefMonthsNum + bonus * (MONTHS_IN_YEAR - prefMonthsNum);
+
+  return [prefBonus, yearBonus];
+};

package/src/components/Calculator/getDefaultMonths.ts

@@ -1,7 +1,2 @@
-import { DEFAULT_MONTHS } from './constants';
-import type { CalculatorParams } from './CalculatorContent';
-
-export const getDefaultMonths = (calculatorParams: CalculatorParams) =>
-  calculatorParams.maxMonths && calculatorParams.minMonths
-    ? Math.round((calculatorParams.maxMonths - calculatorParams.minMonths) / 2)
-    : DEFAULT_MONTHS;
+export const getDefaultMonths = (minMonths: number, maxMonths: number) =>
+  Math.round((maxMonths - minMonths) / 2);

package/src/components/Calculator/getDefaultSum.ts

@@ -1,7 +1,4 @@
 import { DEFAULT_SUM } from './constants';
-import type { CalculatorParams } from './CalculatorContent';
 
-export const getDefaultSum = (calculatorParams: CalculatorParams) =>
-  calculatorParams.maxSum && calculatorParams.minSum
-    ? (calculatorParams.maxSum - calculatorParams.minSum) / 2
-    : DEFAULT_SUM;
+export const getDefaultSum = (minSum?: number, maxSum?: number) =>
+  maxSum && minSum ? (maxSum - minSum) / 2 : DEFAULT_SUM;

package/src/components/Calculator/getMonthlyPayment.ts

@@ -1,35 +1,19 @@
-import { clamp } from '../../utils/clamp';
-import { DEFAULT_MAX_SUM, DEFAULT_MIN_SUM, MONTHS_IN_YEAR } from './constants';
-import type { CalculatorParams } from './CalculatorContent';
+/**
+ * Формулы расчёта аннуитетных и дифференцированных платежей:
+ * https://finuslugi.ru/potrebitelskie_kredity/stat_annuitetnye_i_differentsirovannye_platezhi
+ */
 
-type PaymentType = 'annuity' | 'differentiated';
+import { MONTHLY_INTEREST_RATE, MONTHS_IN_YEAR } from './constants';
+import type { CreditCalculatorUserInputParams } from './useCreditCalculatorParams';
 
-interface GetMonthlyPaymentParams {
-  calculatorParams?: CalculatorParams;
-  paymentType: PaymentType;
-  rate: number;
-  sum: number;
-  months: number;
-}
+export const getMonthlyPayment = (rate: number, params: CreditCalculatorUserInputParams) => {
+  const { isAnnuity, moneyValue, monthsValue } = params;
 
-export const getMonthlyPayment = (params: GetMonthlyPaymentParams) => {
-  const { calculatorParams, paymentType, rate, sum, months } = params;
+  if (isAnnuity) {
+    const i = rate / MONTHLY_INTEREST_RATE; // Используется значение ставки в процентах
 
-  if (!calculatorParams) {
-    return 0;
-  }
-
-  const finalSum = clamp(
-    sum,
-    calculatorParams.minSum || DEFAULT_MIN_SUM,
-    calculatorParams.maxSum || DEFAULT_MAX_SUM,
-  );
-
-  if (paymentType === 'annuity') {
-    const annuityCoef = Number(rate) / (MONTHS_IN_YEAR * 100);
-
-    return finalSum * (annuityCoef + annuityCoef / (Math.pow(1 + annuityCoef, months) - 1));
+    return moneyValue * (i + i / (Math.pow(1 + i, monthsValue) - 1));
   } else {
-    return finalSum / months + finalSum * (Number(rate) / 12);
+    return Math.round(moneyValue / monthsValue) + moneyValue * (rate / (MONTHS_IN_YEAR * 100)); // Используется значение ставки (rate) в процентах, делённое на сто.
   }
 };

package/src/components/Calculator/renderCalculatorBlock.tsx

@@ -1,11 +1,11 @@
-import type { JSXBlock } from '../../components/ContentPage/ContentPage';
+import type { JSXBlock } from '../ContentPage/ContentPage';
 import type { CalculatorBlockDef } from './CalculatorContent';
 import { EmbeddableCalcBlocks, EmbeddableCalcProps } from './EmbeddableCalcBlocks';
 
 export const renderCalculatorBlock =
   ({ context, className }: any) =>
-  (blockCalcTabs: CalculatorBlockDef, i: number) => {
-    const type = blockCalcTabs?.calcType;
+  (block: CalculatorBlockDef, i: number) => {
+    const type = block?.calcType;
     if (!type || !(type in EmbeddableCalcBlocks)) {
       return null;
     }
@@ -18,7 +18,7 @@ export const renderCalculatorBlock =
         role="listitem"
       >
         <div className="box-border p-9 w-full">
-          <EmbeddedBlock context={context} {...blockCalcTabs} className="flex justify-between" />
+          <EmbeddedBlock context={context} {...block} className="flex justify-between" />
         </div>
       </section>
     );