@redneckz/wildless-cms-uni-blocks 0.14.581 → 0.14.583

package/mobile/src/api/RetailApi/utils/getUpdateUserTask.ts

@@ -0,0 +1,46 @@
+import { type UpdateUserTaskBody } from '../RetailApiTypes';
+
+/* eslint-disable max-params */
+export const getUpdateUserTaskData = (
+  participantId: number,
+  taskId: number,
+  profileId: number,
+  formatData?: Record<string, any>,
+): UpdateUserTaskBody => ({
+  sendToBank: true,
+  taskKind: 'SHORT',
+  task: {
+    taskSource: globalThis.location.origin,
+    id: taskId,
+    participants: [
+      {
+        birthDate: formatData?.birthDate,
+        id: participantId,
+        midname: formatData?.midname,
+        name: formatData?.name,
+        surname: formatData?.surname,
+        profile: {
+          id: profileId,
+        },
+        participantContacts: [
+          {
+            contactTypeCd: {
+              key: 'EMAIL',
+            },
+            value: formatData?.email,
+          },
+          {
+            contactTypeCd: {
+              key: 'MAIN_PHONE',
+            },
+            value: formatData?.phone,
+          },
+        ],
+        roleCd: {
+          key: 'BORROWER',
+          value: 'Заемщик',
+        },
+      },
+    ],
+  },
+});

package/mobile/src/components/ApplicationLeadForm/ApplicationLeadForm.tsx

@@ -1,54 +1,39 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { LeadServiceAPI } from '../../api/LeadServiceAPI';
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import { ApplicationFormLayout } from '../../ui-kit/ApplicationFormLayout/ApplicationFormLayout';
 import { getField } from '../../ui-kit/FormField/getField';
-import { getObjectValidator } from '../../ui-kit/FormField/getObjectValidator';
 import { inputColumnStyles } from '../../ui-kit/FormField/inputColumnStyle';
 import { renderTitle } from '../../ui-kit/FormField/renderTitle';
 import { useResponseTypeDialog } from '../../ui-kit/ResponseTypeDialog/useResponseTypeDialog';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 import { style } from '../../utils/style';
-import { objectValidator } from '../../validation/objectValidator';
-import { isValidationSuccess } from '../../validation/validator';
 import {
   type ApplicationLeadFormContent,
   type FieldDef,
   type GroupedConsentsProps,
 } from './ApplicationLeadFormContent';
 import { CONSENTS } from './consents';
-import { getFormatData } from './getFormatData';
-import { getInitialFormState, type FormState } from './getInitialFormState';
+import { getInitialFormState } from './getInitialFormState';
 import { GroupedConsents } from './GroupedConsents';
 import { renderSubmitButton } from './renderSubmitButton';
+import { useApplicationLeadApi } from './useApplicationLeadApi';
+import { useInitApplicationLead } from './useInitApplicationLead';
 
 interface ApplicationLeadFormProps extends ApplicationLeadFormContent, UniBlockProps {}
 
-const API = LeadServiceAPI();
-
 export const ApplicationLeadForm = JSX<ApplicationLeadFormProps>(
-  // eslint-disable-next-line max-lines-per-function
-  ({ className, title, typeForm = '', sections = [], button, endpoint, ...rest }) => {
+  ({ className, title, programId, typeForm = '', sections = [], button, ...rest }) => {
     const inputs = (sections?.flatMap((_) => _?.inputs) || []) as FieldDef[];
     const initialFormState = getInitialFormState(inputs, typeForm);
     const [responseType, setResponseType] = useState<'OK' | 'Fail' | ''>('');
-    const handleSubmit = useCallback(async (formData: FormState) => {
-      const feedbackValidator = objectValidator(getObjectValidator(inputs));
-      if (!isValidationSuccess(feedbackValidator(formData))) {
-        return 'Fail';
-      }
-      const formatData = getFormatData(formData);
-      const status = (await API.send(formatData, endpoint === 'lead')) ? 'OK' : 'Fail';
-      setResponseType(status);
-
-      if (status) {
-        const responseTypeDialog = useResponseTypeDialog({ responseType: status, typeForm });
-        responseTypeDialog.open();
-      }
+    useInitApplicationLead();
+    const { handleSubmit, responseStatus } = useApplicationLeadApi(inputs, programId || '');
 
-      return status;
-    }, []);
+    if (responseStatus) {
+      const responseTypeDialog = useResponseTypeDialog({ responseType: responseStatus, typeForm });
+      responseTypeDialog.open();
+    }
 
     const [, { field, onSubmit, reset }] = useForm(initialFormState, { onSubmit: handleSubmit });
 

package/mobile/src/components/ApplicationLeadForm/ApplicationLeadFormContent.ts

@@ -179,6 +179,8 @@ export type ApplicationLeadFormContent = UniBlockContent &
       /** @default "" */
       target?: Target;
     };
+    /** @title Номер кредитной программы */
+    programId?: string;
     typeForm?: TypeFormFieldDef;
     /** @hidden */
     sections?: SectionsProps[];

package/mobile/src/components/ApplicationLeadForm/useApplicationLeadApi.ts

@@ -0,0 +1,75 @@
+import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { RETAIL_API } from '../../api/RetailApi/RetailApi';
+import { getUpdateUserProfileData } from '../../api/RetailApi/utils/getUpdateUserProfile';
+import { getUpdateUserTaskData } from '../../api/RetailApi/utils/getUpdateUserTask';
+import { getObjectValidator } from '../../ui-kit/FormField/getObjectValidator';
+import { useVerifyPhoneDialog } from '../../ui-kit/VerifyPhoneDialog/useVerifyPhoneDialog';
+import { formatPhone } from '../../utils/formatPhone';
+import { objectValidator } from '../../validation/objectValidator';
+import { isValidationSuccess } from '../../validation/validator';
+import { type FieldDef } from './ApplicationLeadFormContent';
+import { type FormState } from './getInitialFormState';
+
+export const useApplicationLeadApi = (inputs: FieldDef[], programId: string) => {
+  const [responseStatus, setResponseStatus] = useState<'OK' | 'Fail' | ''>('');
+
+  // eslint-disable-next-line consistent-return
+  const handleSubmit = useCallback(async (formData: FormState) => {
+    const feedbackValidator = objectValidator(getObjectValidator(inputs));
+    if (!isValidationSuccess(feedbackValidator(formData))) {
+      return 'Fail';
+    }
+
+    try {
+      const { profile } = await RETAIL_API.CreateUserProfile({
+        profile: { phone: formatPhone(formData.phone as string) },
+      });
+      const profileId = profile?.id;
+
+      if (profileId && formData?.phone) {
+        const handleSuccessVerify = async () => {
+          try {
+            await RETAIL_API.UpdateUserProfile(getUpdateUserProfileData(profileId, formData));
+            const { taskId, participantId } = await RETAIL_API.CreateDraftTask({
+              profileId,
+              programId,
+            });
+
+            await RETAIL_API.UpdateUserTask(
+              getUpdateUserTaskData(participantId, taskId, profileId, formData),
+            );
+            setResponseStatus('OK');
+          } catch {
+            setResponseStatus('Fail');
+          }
+        };
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        const verifyPhoneDialog = useVerifyPhoneDialog({
+          onClose: handleSuccessVerify,
+          ...verifyPhoneContent(formData?.phone),
+        });
+        verifyPhoneDialog.open();
+      }
+    } catch {
+      setResponseStatus('Fail');
+    }
+  }, []);
+
+  return {
+    handleSubmit,
+    responseStatus,
+  };
+};
+
+const verifyPhoneContent = (phone: string) => ({
+  title: 'Подтвердите номер телефона',
+  description: `Мы отправили код на ${phone}`,
+  phone: formatPhone(phone),
+  textButton: 'Оформить',
+  __html: `<span>Вводя код, я подтверждаю, что ознакомлен и подписываю:</span>
+              <ul><li>соглашение о порядке использования простой электронной подписи,
+              </li><li>согласие на обработку персональных данных,
+              </li><li>предоставление и подписание прочих согласий Банка,
+              </li><li>согласие на запрос в ПФР</li></ul>`,
+  href: '/credit-lead',
+});

package/mobile/src/components/ApplicationLeadForm/useInitApplicationLead.ts

@@ -0,0 +1,8 @@
+import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
+
+export const useInitApplicationLead = () => {
+  useEffect(() => {
+    sessionStorage.removeItem('accessToken');
+    sessionStorage.removeItem('refreshToken');
+  }, []);
+};

package/mobile/src/ui-kit/VerifyPhoneDialog/VerifyPhoneDialog.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { useMemo } from 'react';
+import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { RETAIL_API } from '../../api/RetailApi/RetailApi';
 import { Headline } from '../../components/Headline/Headline';
 import { Dialog } from '../DialogManager/Dialog';
 import { useDialogManager } from '../DialogManager/useDialogManager';
@@ -10,38 +10,59 @@ import { RichText } from '../RichText/RichText';
 import { Timer } from '../TimerCircle/Timer';
 import { InputCode } from './InputCode';
 import { SubmitButton } from './SubmitButton';
-import { submitVerifyPhoneForm } from './submitVerifyPhoneForm';
 
 export interface VerifyPhoneDialogProps {
+  phone: string;
   title?: string;
   description?: string;
   code?: boolean;
   __html?: string;
   codeLength?: number;
   textButton?: string;
+  onClose?: () => Promise<void>;
+  href?: string;
 }
 
 export const VerifyPhoneDialog = JSX<VerifyPhoneDialogProps>(
-  ({ title, description, __html, code = true, codeLength = 4, textButton = '' }) => {
+  ({
+    title,
+    phone,
+    description,
+    __html,
+    code = true,
+    codeLength = 4,
+    textButton = '',
+    onClose,
+    href = '',
+  }) => {
     const { close } = useDialogManager();
 
-    const [values, setValues] = useState(Array(codeLength).fill(''));
+    const [values, setValues] = useState<string[]>(Array(codeLength).fill('') as string[]);
     const [hasError, setHasError] = useState(false);
     const [isLoading, setIsLoading] = useState(false);
-    const [timeNextReq, setTimeNextReq] = useState<number>(0);
+    const [timeNextReq, setTimeNextReq] = useState<number>(180);
 
     const isValidCode = useMemo(() => values.every(Boolean), [values]);
 
-    const handleSubmit = useCallback(async () => {
-      setIsLoading(true);
-      const { success, expiresIn } = await submitVerifyPhoneForm(values.join(''));
-      setIsLoading(false);
-
-      setTimeNextReq(expiresIn as number);
+    useEffect(() => {
+      RETAIL_API.SendCode({
+        phoneNumber: phone,
+        smsCodesSetName: { key: 'AUTHENTICATION' },
+      });
+    }, []);
 
-      if (success) {
+    const handleSubmit = useCallback(async () => {
+      try {
+        setIsLoading(true);
+        await RETAIL_API.CheckCode({
+          smsText: values.join(''),
+          smsCodesSetName: { key: 'AUTHENTICATION' },
+        });
+        globalThis.location.href = href;
         close();
-      } else {
+        onClose && onClose();
+      } catch {
+        setIsLoading(false);
         setHasError(true);
       }
     }, [values]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.581",
+  "version": "0.14.583",
   "private": false,
   "license": "MIT",
   "author": "ЦК",
@@ -210,7 +210,7 @@
       "path": "lib/common.css"
     },
     {
-      "limit": "71 kB",
+      "limit": "73 kB",
       "path": "bundle/bundle.umd.min.js"
     }
   ],

package/src/api/RetailApi/RetailApi.ts

@@ -0,0 +1,51 @@
+import {
+  type CheckCodeBody,
+  type CheckCodeResponse,
+  type CreateDraftTaskBody,
+  type CreateDraftTaskResponse,
+  type CreateUserProfileBody,
+  type CreateUserProfileResponse,
+  type SendCodeBody,
+  type UpdateUserProfileBody,
+  type UpdateUserTaskBody,
+} from './RetailApiTypes';
+
+type RequsetMethod = 'POST' | 'GET' | 'PUT';
+
+const getAthorizationHeaders = () => {
+  const token = sessionStorage.getItem('accessToken');
+
+  return token ? { Authorization: `Bearer ${token}` } : null;
+};
+
+const isJSON = (response: Response) => response.headers.get('Content-Type') === 'application/json';
+
+const request = async <T>(url: string, method: RequsetMethod, body?: any): Promise<T> =>
+  await fetch('https://retail-light-api.cprb.dev.rshbdev.ru/api/v1' + url, {
+    method,
+    headers: {
+      'Content-Type': 'application/json',
+      ...getAthorizationHeaders(),
+    },
+    credentials: 'include',
+    body: body ? JSON.stringify(body) : null,
+  }).then((response) => (isJSON(response) ? response.json() : response));
+
+const saveToken = (data: CheckCodeResponse) => {
+  sessionStorage.setItem('accessToken', data.access_token as string);
+  sessionStorage.setItem('refreshToken', data.refresh_token as string);
+};
+
+export const RETAIL_API = {
+  CreateUserProfile: async (body: CreateUserProfileBody) =>
+    await request<CreateUserProfileResponse>('/public-data/createUserProfile', 'POST', body),
+  UpdateUserProfile: async (body: UpdateUserProfileBody) =>
+    await request('/user-data/updateUserProfile', 'PUT', body),
+  CreateDraftTask: async (body: CreateDraftTaskBody) =>
+    await request<CreateDraftTaskResponse>('/user-data/createDraftTask', 'POST', body),
+  UpdateUserTask: async (body: UpdateUserTaskBody) =>
+    await request('/user-data/updateUserTask', 'PUT', body),
+  SendCode: async (body: SendCodeBody) => await request('/sms/sendCode', 'POST', body),
+  CheckCode: async (body: CheckCodeBody) =>
+    await request<CheckCodeResponse>('/sms/checkCode', 'POST', body).then(saveToken),
+};

package/src/api/RetailApi/RetailApiTypes.ts

@@ -0,0 +1,91 @@
+export type CreateUserProfileBody = {
+  profile: {
+    phone: string;
+  };
+};
+
+export type CreateUserProfileResponse = {
+  profile: {
+    id: number;
+  };
+};
+
+export type UpdateUserProfileBody = {
+  profile: {
+    id: number;
+    phone: string;
+    email: string;
+    name: string;
+    surname: string;
+    midname: string;
+    birthDate: string;
+    processPersonalDataLeadFlg: boolean;
+    consentProviderFlg: boolean;
+    consentPfrFlg: boolean;
+    consentPhotoFlg: boolean;
+    consentAssignmentClaimsFlg: boolean;
+    consentCollectionFlg: boolean;
+    consentInformFlg: boolean;
+  };
+};
+
+export type CreateDraftTaskBody = {
+  profileId: number;
+  programId: string;
+};
+
+export type CreateDraftTaskResponse = {
+  taskId: number;
+  participantId: number;
+};
+
+export type UpdateUserTaskBody = {
+  sendToBank: boolean;
+  taskKind: 'SHORT' | 'FULL' | 'UNITED';
+  task: {
+    taskSource: string;
+    id: number;
+    participants: [
+      {
+        birthDate: string;
+        id: number;
+        midname: string;
+        name: string;
+        surname: string;
+        profile: {
+          id: number;
+        };
+        participantContacts: Array<{
+          contactTypeCd: {
+            key: 'EMAIL' | 'MAIN_PHONE';
+          };
+          value: string;
+        }>;
+        roleCd: {
+          key: string;
+          value: string;
+        };
+      },
+    ];
+  };
+};
+
+export type SendCodeBody = {
+  phoneNumber: string;
+  smsCodesSetName: {
+    key: 'AUTHENTICATION' | 'SEND_TASK';
+  };
+};
+
+export type CheckCodeBody = {
+  smsText: string;
+  smsCodesSetName: {
+    key: 'AUTHENTICATION' | 'SEND_TASK';
+  };
+};
+
+export type CheckCodeResponse = {
+  access_token: string;
+  expires_in: number;
+  refresh_token: string;
+};

package/src/api/RetailApi/utils/getUpdateUserProfile.ts

@@ -0,0 +1,44 @@
+import { type FormState } from '../../../components/ApplicationLeadForm/getInitialFormState';
+import { formatDate } from '../../../utils/formatDate';
+import { formatPhone } from '../../../utils/formatPhone';
+import { type UpdateUserProfileBody } from '../RetailApiTypes';
+
+export const getUpdateUserProfileData = (
+  profileId: number,
+  formData: FormState,
+): UpdateUserProfileBody => {
+  const {
+    name = '',
+    surname = '',
+    middleName = '',
+    birthday = '',
+    phone = '',
+    email = '',
+    processPersonalDataLeadFlg,
+    consentProviderFlg,
+    consentPfrFlg,
+    consentPhotoFlg,
+    consentAssignmentClaimsFlg,
+    consentCollectionFlg,
+    consentInformFlg,
+  } = formData;
+
+  return {
+    profile: {
+      id: profileId,
+      name,
+      surname,
+      midname: middleName,
+      birthDate: birthday && formatDate(birthday, true),
+      email,
+      phone: formatPhone(phone),
+      processPersonalDataLeadFlg: Boolean(processPersonalDataLeadFlg),
+      consentProviderFlg: Boolean(consentProviderFlg),
+      consentPfrFlg: Boolean(consentPfrFlg),
+      consentPhotoFlg: Boolean(consentPhotoFlg),
+      consentAssignmentClaimsFlg: Boolean(consentAssignmentClaimsFlg),
+      consentCollectionFlg: Boolean(consentCollectionFlg),
+      consentInformFlg: Boolean(consentInformFlg),
+    },
+  };
+};

package/src/api/RetailApi/utils/getUpdateUserTask.ts

@@ -0,0 +1,46 @@
+import { type UpdateUserTaskBody } from '../RetailApiTypes';
+
+/* eslint-disable max-params */
+export const getUpdateUserTaskData = (
+  participantId: number,
+  taskId: number,
+  profileId: number,
+  formatData?: Record<string, any>,
+): UpdateUserTaskBody => ({
+  sendToBank: true,
+  taskKind: 'SHORT',
+  task: {
+    taskSource: globalThis.location.origin,
+    id: taskId,
+    participants: [
+      {
+        birthDate: formatData?.birthDate,
+        id: participantId,
+        midname: formatData?.midname,
+        name: formatData?.name,
+        surname: formatData?.surname,
+        profile: {
+          id: profileId,
+        },
+        participantContacts: [
+          {
+            contactTypeCd: {
+              key: 'EMAIL',
+            },
+            value: formatData?.email,
+          },
+          {
+            contactTypeCd: {
+              key: 'MAIN_PHONE',
+            },
+            value: formatData?.phone,
+          },
+        ],
+        roleCd: {
+          key: 'BORROWER',
+          value: 'Заемщик',
+        },
+      },
+    ],
+  },
+});

package/src/components/ApplicationLeadForm/ApplicationLeadForm.fixture.tsx

@@ -18,6 +18,7 @@ export default {
         title="Заголовок"
         typeForm="CORRUPTION"
         endpoint="lead"
+        programId="10"
         sections={[
           {
             columns: 2,

package/src/components/ApplicationLeadForm/ApplicationLeadForm.tsx

@@ -1,54 +1,39 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
-import { LeadServiceAPI } from '../../api/LeadServiceAPI';
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 import { ApplicationFormLayout } from '../../ui-kit/ApplicationFormLayout/ApplicationFormLayout';
 import { getField } from '../../ui-kit/FormField/getField';
-import { getObjectValidator } from '../../ui-kit/FormField/getObjectValidator';
 import { inputColumnStyles } from '../../ui-kit/FormField/inputColumnStyle';
 import { renderTitle } from '../../ui-kit/FormField/renderTitle';
 import { useResponseTypeDialog } from '../../ui-kit/ResponseTypeDialog/useResponseTypeDialog';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 import { style } from '../../utils/style';
-import { objectValidator } from '../../validation/objectValidator';
-import { isValidationSuccess } from '../../validation/validator';
 import {
   type ApplicationLeadFormContent,
   type FieldDef,
   type GroupedConsentsProps,
 } from './ApplicationLeadFormContent';
 import { CONSENTS } from './consents';
-import { getFormatData } from './getFormatData';
-import { getInitialFormState, type FormState } from './getInitialFormState';
+import { getInitialFormState } from './getInitialFormState';
 import { GroupedConsents } from './GroupedConsents';
 import { renderSubmitButton } from './renderSubmitButton';
+import { useApplicationLeadApi } from './useApplicationLeadApi';
+import { useInitApplicationLead } from './useInitApplicationLead';
 
 interface ApplicationLeadFormProps extends ApplicationLeadFormContent, UniBlockProps {}
 
-const API = LeadServiceAPI();
-
 export const ApplicationLeadForm = JSX<ApplicationLeadFormProps>(
-  // eslint-disable-next-line max-lines-per-function
-  ({ className, title, typeForm = '', sections = [], button, endpoint, ...rest }) => {
+  ({ className, title, programId, typeForm = '', sections = [], button, ...rest }) => {
     const inputs = (sections?.flatMap((_) => _?.inputs) || []) as FieldDef[];
     const initialFormState = getInitialFormState(inputs, typeForm);
     const [responseType, setResponseType] = useState<'OK' | 'Fail' | ''>('');
-    const handleSubmit = useCallback(async (formData: FormState) => {
-      const feedbackValidator = objectValidator(getObjectValidator(inputs));
-      if (!isValidationSuccess(feedbackValidator(formData))) {
-        return 'Fail';
-      }
-      const formatData = getFormatData(formData);
-      const status = (await API.send(formatData, endpoint === 'lead')) ? 'OK' : 'Fail';
-      setResponseType(status);
-
-      if (status) {
-        const responseTypeDialog = useResponseTypeDialog({ responseType: status, typeForm });
-        responseTypeDialog.open();
-      }
+    useInitApplicationLead();
+    const { handleSubmit, responseStatus } = useApplicationLeadApi(inputs, programId || '');
 
-      return status;
-    }, []);
+    if (responseStatus) {
+      const responseTypeDialog = useResponseTypeDialog({ responseType: responseStatus, typeForm });
+      responseTypeDialog.open();
+    }
 
     const [, { field, onSubmit, reset }] = useForm(initialFormState, { onSubmit: handleSubmit });
 

package/src/components/ApplicationLeadForm/ApplicationLeadFormContent.ts

@@ -179,6 +179,8 @@ export type ApplicationLeadFormContent = UniBlockContent &
       /** @default "" */
       target?: Target;
     };
+    /** @title Номер кредитной программы */
+    programId?: string;
     typeForm?: TypeFormFieldDef;
     /** @hidden */
     sections?: SectionsProps[];